jp-charge/pages/hr/index/resumeInfo/resumeInfo.vue

<template>
	<view>
		<u-navbar title="职位详情" ></u-navbar>
		 
		 <resumeInfo :isHr="true" ref="info" @getInfo="getInfo"></resumeInfo>
		 
		
		<view class="resumeInfo-foot">
			<view class="resumeInfo-collect"  @click="collectBtn">
				<u-icon :name="isCollect?'a-fasfa-star ':'antOutline-star'" custom-prefix="custom-icon" size="36" color="#2295FF"></u-icon>
				<u-icon v-if="false" name="antOutline-star" custom-prefix="custom-icon" size="36" color="#2295FF"></u-icon>
				<span>收藏</span>
			</view>
			<view class="resumeInfo-btn">
				<u-button type="primary"   @click="deliverBtn" v-text="isDeliver?'已发送':'电话沟通'">立即沟通</u-button>
			</view>
		</view>
		 
		<view class="jp-work" v-show="list.length" >
			<view class="jp-work-title">
				推荐简历
			</view>
			<view class="jp-work-list"  v-show="list.length" >
				 
				<ResumeItem v-for="(item ,index) in list" :key="index" :item="item" :ck="false" @ckItem="setId" ></ResumeItem>
				
			</view>
			
		</view>
	</view>
</template>

<script>
	import api from './index.js'
	export default api;
</script>

<style>
	page{
		background-color: #F7F7F7;
	}
</style>
 
<style scoped lang="scss">
	.resumeInfo-foot{
		height: 120rpx;
		background-color: #fff;
		margin-top: 20rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 20rpx;
		.resumeInfo-collect{
			display: flex;
			flex-direction: column;
			align-items: center;
			background-color: #f3f4f8;
			padding:4rpx 20rpx;
			border-radius: 8rpx;
			margin-right: 20rpx;
			span{
				font-size: 24rpx;
			}
		}
		.resumeInfo-btn{
			flex: 1;
		}
	}
	.resumeInfo-info{
		margin-top: 20rpx;
		padding: 0 20rpx;
		padding-top: 20rpx;
		background-color: #fff;
		.resumeInfo-info-head{
			font-size: 36rpx;
			font-weight: bold;
		}
		.resumeInfo-info-main{
			padding: 20rpx 0;
			p{
				color:#999;
			}
		}
	}
	.undergo-item-row{
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 10rpx;
		h4{
			font-size: 30rpx;
		}
		&:last-child{
			margin-bottom: 0;
		}
		span{
			color:#1677FF;
		}
	}
	.work-undergo{
		border-bottom: 1px solid #f7f7f7;
		padding: 20rpx 0;
		&:last-child{
			border-bottom: 0;
		}
	}
	.edu-undergo{
		border-bottom: 1px solid #f7f7f7;
		padding: 20rpx 0;
		&:last-child{
			border-bottom: 0;
		}
	}
	.resumeInfo{
		background-color: #fff;
		padding: 20rpx;
		margin-bottom: 20rpx;		
	}
	.resumeInfo-row{
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 10rpx;
		h3{
			font-size: 36rpx;
		}
		span{
			color:#2295FF;
			border: 1px solid #2295FF;
			padding: 0 10rpx;
			border-radius: 6rpx;
		}
		.jp-work-tag{
			display: flex;
			align-items: center;
			*{
				margin-right: 10rpx;
			}
		}
		h2{
			color:#FF6D58;
			font-size: 36rpx;
		}
	}
	.resumeInfo-head{
		display: flex;
		align-items: center;
		justify-content:space-between;
		padding: 20rpx 0;
		.resumeInfo-name{
			h3{
				font-size:48rpx ;
				margin-bottom: 20rpx;
			}
			span{
				color:#333;
				font-size: 28rpx;
			}
		}
	}
	.resumeInfo-name-row{
		margin-bottom:20rpx;
		span{
			color:#333;
			margin-left: 10rpx;
		}
	}
	.jp-work{
		margin-top: 20rpx;
	}
	.jp-work-title{
		background-color: #fff;
		border-bottom: 1px solid #F7F7F7;
		font-size: 36rpx;
		padding: 20rpx 20rpx;
		font-weight: bold;
	}
	.jp-work-item{
		padding:30rpx;
		background-color: #fff;
		border-bottom: 1px solid #f7f7f7;
		&:last-child{
			border-bottom:none;
		}
		.jp-work-label{
			margin-top: 10rpx;
		}
		.jp-work-name{
			display: flex;
			justify-content: space-between;
			align-items: center;
			h3{
				font-size: 36rpx;
			}
			span{
				font-size: 32rpx;
				color:#FF1700
			}
		}
		.jp-work-tag{
			display: flex;
			align-items: center;
			margin-top: 10rpx;
			*{
				margin-right: 10rpx;
			}
		}
		.jp-work-info{
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 10rpx;
			p{
				color:#999;
				font-size: 24rpx;
				margin-left: 10rpx;
			}
		}
	}
</style>