veterans_H5/h5_web/pages/myResume/myResume.vue

<!-- 我的简历 -->
<template>
	<view class="resume">

		<!-- ================================ 头像部分 ================================ -->
		<!--  @click="jumpPage('/pages/dynamicTracking/dynamicTracking')" -->
		<view class="resume-head">
			<view class="resume-head-left">
				<view class="name">
					<view>{{ memberinfo.name }}</view>
					<!-- <image src="../../static/img/edit-icon.png" mode=""></image> -->
				</view>
				<view class="info">
					<view>{{ memberinfo.menSex === 1 ? '女' : '男' }} · </view>
					<view>
						<text class="position">{{ memberinfo.jobStatus !== 0 ? '入职中' : '未入职' }}</text>
						<!-- {{ `（${ memberinfo.company }）` }} -->
					</view>
				</view>
			</view>
			<view class="resume-head-right">
				
				<u-avatar :src="memberinfo.avatar" mode="circle" size="130" />
			</view>
		</view>

		<!-- ================================ 基本信息部分 ================================ -->
		<view class="resume-base-info">
			<view class="resume-base-info-left">
				<view class="title">基本信息</view>
				<view class="resume-base-info-item">退役军人 · {{ getAge(memberinfo.menBirth) }}岁 · {{ memberinfo.politOutlook }} · {{ memberinfo.degrEduc }}</view>
				<view class="resume-base-info-phone">
					电话：<text class="icon-phone-icon"></text> {{ memberinfo.mobile }}
				</view>
			</view>
			<view class="resume-base-info-right">
				<!-- <image src="../../static/img/edit-icon.png" mode=""></image> -->
			</view>
		</view>

		<!-- ================================ 求职意向部分 ================================ -->
		<view class="resume-job-intention">
			<view class="resume-job-intention-left">
				<view class="title">期望薪资</view>
				<view v-if="memberinfo.workCity">{{ memberinfo.workCity }}  {{ `${memberinfo.expectedLowestSalary}k ~ ${memberinfo.expectedHighestSalary}k` }}</view>
				<view class="supple" v-else>暂末补充求意向… </view>
			</view>
			<view class="resume-job-intention-right">
				<image src="../../static/img/edit-icon.png" mode="" @click="jumpPage('/pages/evaluationIntention/evaluationIntention', { tabCur: 0 })"></image>
			</view>
		</view>

		<!-- ================================ 自我评价部分 ================================ -->
		<view class="resume-self-evaluation">
			<view class="resume-self-evaluation-left">
				<view class="title">自我评价</view>
				<view class="supple" v-if="memberinfo.selfAssessment === ''">暂未补充自我评价...</view>
				
				<view class="resume-self-evaluation-info" v-else>
					<view class="rsei-box">{{ memberinfo.selfAssessment }}</view>
				</view>
			</view>
			<view class="resume-self-evaluation-right">
				<image src="../../static/img/edit-icon.png" mode="" @click="jumpPage('/pages/evaluationIntention/evaluationIntention', { tabCur: 1 })"></image>
			</view>
		</view>

		<!-- ================================ 工作经历部分 ================================ -->
		<view class="resume-work-experience">
			<view class="resume-work-experience-header">
				<view class="title">工作经历</view>
				<image src="../../static/img/add-experience-icon.png" mode="" @click="jumpPage('/pages/myResume/addExperience')"></image>
			</view>
			<view class="resume-work-experience-list" :class="isExpand ? 'height-auto' : 'height-130'">
				<view class="rwel-item" v-for="(item, index) in workExperice" :key="index">
					<view class="rwel-item-left">
						<view>{{ item.company }}</view>
						<view>{{ item.position }}</view>
						<view>获得企业评价：<text>{{ item.evaluate }}</text></view>
					</view>
					<view class="rwel-item-right">
						<view>{{ item.dateLine }}</view>
						<view>
							<u-icon name="arrow-right" color="#7B7B7B" size="20" @click="jumpPage('/pages/myResume/addExperience')"/>
						</view>
					</view>
				</view>
			</view>
			<view class="resume-work-experience-btn" @click="isExpand = !isExpand">
				{{ isExpand ? '收起' : '展开全部' }}
			</view>
		</view>

		<!-- ================================ 培训与教育经历部分 ================================ -->
		<view class="resume-train-experience">
			<view class="resume-train-experience-header">
				<view class="title">培训与教育经历</view>
				<image src="../../static/img/add-experience-icon.png" mode="" @click="jumpPage('/pages/myResume/addEducation')"/>
			</view>
			<view class="resume-train-experience-list" :class="isTrainExpand ? 'height-auto' : 'height-130'">
				<view class="rtel-item"  v-for="(item, index) in trainExperice" :key="index">
					<view class="rtel-item-left">
						<view>{{ item.classes }}</view>
						<view>{{ item.school }}</view>
						<view>{{ item.content }}</view>
						<view>获得老师评价：<text>{{ item.evaluate }}</text></view>
					</view>
					<view class="rtel-item-right">
						<view>{{ item.dateLine }}</view>
						<view>
							<u-icon name="arrow-right" color="#7B7B7B" size="20" @click="jumpPage('/pages/myResume/addEducation')"/>
						</view>
					</view>
				</view>
			</view>
			<view class="resume-train-experience-btn" @click="isTrainExpand = !isTrainExpand">
				{{ isTrainExpand ? '收起' : '展开全部' }}
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				memberinfo: {},
				// 求职意向
				jobIntention: true,
				// 自我评价
				selfEvaluation: true,
				// 工作经历
				workExperice: [{
						dateLine: '2020.3 ~ 至今',
						company: '贵州威振押运有限公司',
						position: '武装押运员',
						evaluate: '优秀'
					},
					{
						dateLine: '2018.5 ~ 2020.3',
						company: '贵州威振押运有限公司',
						position: '武装押运员',
						evaluate: '优秀'
					},
					{
						dateLine: '2015.11 ~ 2018.5',
						company: '贵州威振押运有限公司',
						position: '武装押运员',
						evaluate: '优秀'
					}
				],
				// 是否展开工作经历
				isExpand: true,
				// 培训与教育经历
				trainExperice: [{
						dateLine: '2020.3 ~ 2020.5',
						classes: '武装押运服务课程',
						school: '贵州特种服务职业技术学校',
						content: '2020年3月9日毕业，成绩优秀，获得特种服务证书',
						evaluate: '优秀'
					},
					{
						dateLine: '2019.3 ~ 2020.2',
						classes: '武装押运服务课程',
						school: '贵州特种服务职业技术学校',
						content: '2020年3月9日毕业，成绩优秀，获得特种服务证书',
						evaluate: '优秀'
					}
				],
				// 是否展开培训经历
				isTrainExpand: true
			}
		},
		onShow() {
			this.getMemberinfo()
		},
		methods: {
			/**
			 * 跳转到指定页
			 */
			jumpPage(url, params) {
				this.$u.route({
					url: url,
					params: params
				})
			},
			/**
			 * 获取用户基本信息
			 */
			getMemberinfo(){
				this.$u.api.getmemberinfo().then(res => {
					if (res.code === 200){
						this.memberinfo = res.data;
					} else {
						this.$refs.uToast.show({
							title: res.msg,
							type: 'error'
						})
					}
				}).catch(err => {
					this.$refs.uToast.show({
						title: err.msg,
						type: 'error'
					})
				})
			},
			/**
			 * 通过出生年月计算年龄
			 * @param { String } date
			 */
			getAge(date) {
				const birth = new Date(date).valueOf();
				const now = new Date().valueOf();
				const age = (now - birth) / 1000 / 60 / 60 / 24 / 365;
				return parseInt(age);
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import 'myResume.scss'
</style>