veterans_H5/h5_web/pages/evaluationIntention/evaluationIntention.vue

<!-- 自我评价和求职意向 -->
<template>
	<view class="evaluate-intention">
		
		<!-- 导航栏 -->
		<u-navbar class="evaluate-intention-bar" back-text="" title="">
			<view class="evaluate-intention-bar-right" slot="right" @click="jumpPage('/pages/myResume/myResume')">跳过</view>
		</u-navbar>
		
		<view class="evaluate-intention-explain">
			<view>继续完善加分项</view>
			<view>据平台数据显示，完善后，被HR查看几率更高</view>
		</view>
		
		<!-- tab页 -->
		<view class="evaluate-intention-tabs">
			<view
				class="evaluate-intention-tabs-item"
				v-for="(item, index) in list"
				:key="index"
				:class="{'evaluate-intention-tabs-active': tabCur === index}"
				@click="tabCur = index"
			>
				{{ item.name }}
			</view>
		</view>
		
		<!-- 工作意向 -->
		<view class="evaluate-intention-intention" v-if="tabCur === 0">
			<u-form
				:model="intentionForm"
				ref="intentionForm"
				label-position="top"
			>
				<u-form-item label="工作城市" prop="city" required>
					<u-input v-model="intentionForm.city" type="select" @click="cityShow = true" placeholder="请选择工作城市"/>
					<u-select v-model="cityShow" :list="cityList" @confirm="cityConfirm"></u-select>
				</u-form-item>
				<u-form-item label="期望职位" prop="position" required>
					<u-input v-model="intentionForm.position" type="select" @click="positionShow = true" placeholder="请选择期望职位"/>
					<u-select v-model="positionShow" :list="positionList" @confirm="positionConfirm"></u-select>
				</u-form-item>
				<u-form-item label="期望行业" prop="industry" required>
					<u-input v-model="intentionForm.industry" type="select" @click="industryShow = true" placeholder="请选择期望行业"/>
					<u-select v-model="industryShow" :list="industryList" @confirm="industryConfirm"></u-select>
				</u-form-item>
				<u-form-item label="薪资要求" prop="salary" required>
					<u-input v-model="intentionForm.salary" type="select" @click="salaryShow = true" placeholder="请选择薪资要求"/>
					<u-select v-model="salaryShow" :list="salaryList" @confirm="salaryConfirm"></u-select>
				</u-form-item>
			</u-form>
			<view class="evaluate-intention-intention-submit">
				<u-button type="primary" class="btn" @click="submitIntention">开始找工作</u-button>
			</view>
			<view class="evaluate-intention-intention-explain">去完善项目经历，让更多HR看到你</view>
		</view>
		
		<!-- 自我评价 -->
		<view class="evaluate-intention-evaluate" v-else-if="tabCur === 1">
			<u-form
				:model="evaluateForm"
				ref="evaluateForm"
				label-position="top"
			>
				<u-form-item label="自我评价">
					<u-input
						v-model="evaluateForm.content"
						type="textarea"
						:border="true"
						:height="150"
						:auto-height="true"
					/>
				</u-form-item>
			</u-form>
			<view class="evaluate-intention-evaluate-submit">
				<u-button type="primary" class="btn" @click="submitEvaluation">提交</u-button>
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import { industry } from './industry.js';
	import { city } from './city.js'
	export default {
		data() {
			return {
				list: [
					{
						name: '求职意向'
					},
					{
						name: '自我评价'
					}
				],
				tabCur: 0,
				intentionForm: {
					city: '',
					cityId: '',
					position: '',
					positionId: '',
					industry: '',
					industryId: '',
					salary: '',
					salaryId: ''
				},
				intentionRules: {
					city: [
						{ 
							required: true, 
							message: '请选择您的工作城市', 
							trigger: ['change','blur']
						}
					],
					position: [
						{
							required: true, 
							message: '请选择您的期望职位', 
							trigger: ['change', 'blur']
						}
					],
					industry: [
						{
							required: true, 
							message: '请选择您的期望行业', 
							trigger: ['change', 'blur']
						}
					],
					salary: [
						{
							required: true,
							message: '请选择您的期望薪资', 
							trigger: ['change', 'blur']
						}
					]
				},
				// 城市下拉显示
				cityShow: false,
				// 城市列表
				cityList: city,
				// 职位下拉显示
				positionShow: false,
				// 职位列表
				positionList: [
					{
						value: 1,
						label: '保安'
					},
					{
						value: 2,
						label: '服务员'
					},
					{
						value: 3,
						label: '消防员'
					}
				],
				// 行业下拉显示
				industryShow: false,
				// 行业列表
				industryList: industry,
				// 薪资下拉显示
				salaryShow: false,
				// 薪资列表
				salaryList: [
					{
						value: 1,
						label: '1 ~ 3'
					},
					{
						value: 2,
						label: '3 ~ 5'
					},
					{
						value: 3,
						label: '5 ~ 7'
					},
					{
						value: 4,
						label: '7 ~ 10'
					},
					{
						value: 5,
						label: '10 ~ 以上'
					}
				],
				// 自我评价
				evaluateForm: {
					content: ''
				}
			}
		},
		onLoad(page) {
			this.getMemberinfo()
			if (page.tabCur) {
				this.tabCur = Number(page.tabCur)
			}
		},
		// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
		onReady() {
			if (this.tabCur === 0) {
				this.$refs.intentionForm.setRules(this.intentionRules);
			}
		},
		methods: {
			/**
			 * 获取用户基本信息
			 */
			getMemberinfo(){
				this.$u.api.getmemberinfo().then(res => {
					if (res.code === 200){
						this.evaluateForm.content = res.data.selfAssessment
						this.intentionForm.city = res.data.workCity
						this.evaluateForm.position = res.data.expectedPost
						this.evaluateForm.industry = res.data.expectedIndustry
						this.evaluateForm.salary = (res.data.expectedLowestSalary + 'k ~ ' + res.data.expectedHighestSalary + 'k')
					} else {
						this.$refs.uToast.show({
							title: res.msg,
							type: 'error'
						})
					}
				}).catch(err => {
					this.$refs.uToast.show({
						title: err.msg,
						type: 'error'
					})
				})
			},
			/**
			 * 城市下拉
			 * @param { Object } item
			 */
			cityConfirm(item) {
				this.intentionForm.city = item[0].label
				this.intentionForm.cityId = item[0].value
			},
			/**
			 * 职位下拉
			 * @param {Object} item
			 */
			positionConfirm(item) {
				this.intentionForm.position = item[0].label
				this.intentionForm.positionId = item[0].value
			},
			/**
			 * 行业下拉
			 * @param {Object} item
			 */
			industryConfirm(item) {
				this.intentionForm.industry = item[0].label
				this.intentionForm.industryId = item[0].value
			},
			/**
			 * 薪资下拉
			 * @param {Object} item
			 */
			salaryConfirm(item) {
				this.intentionForm.salary = item[0].label
				this.intentionForm.salaryId = item[0].value
			},
			/**
			 * 跳转到指定页面
			 */
			jumpPage(url) {
				this.$u.route(url)
			},
			submitIntention() {
				this.$refs.intentionForm.validate(valid => {
					if (valid) {
						const form = {
							...this.intentionForm
						}
						uni.showLoading({
							title: '数据提交中，请等待'
						})
						this.$u.api.resume.submitJobIntention({
							workCity: form.city,
							expectedPost: form.position,
							expectedIndustry: form.industry,
							expectedLowestSalary: form.salary.split(' ~ ')[0],
							expectedHighestSalary: form.salary.split(' ~ ')[1]
						}).then(res => {
							if (res.code === 200) {
								this.$refs.uToast.show({
									title: '更新成功',
									type: 'success'
								})
								setTimeout(() => {
									uni.hideLoading()
									this.jumpPage('/pages/myResume/myResume');
								}, 300)
							} else {
								uni.hideLoading();
								this.$refs.uToast.show({
									title: res.msg,
									type: 'error'
								})
							}
						}).catch(() => {
							uni.hideLoading();
							this.$refs.uToast.show({
								title: '系统异常',
								type: 'error'
							})
						})
					}
				})
			},
			/**
			 * 提交自我评价
			 */
			submitEvaluation() {
				if (this.evaluateForm.content) {
					uni.showLoading({
						title: '数据提交中，请等待'
					})
					this.$u.api.resume.submitSelfAssessment({
						selfAssessment: this.evaluateForm.content
					}).then(res => {
						if (res.code === 200) {
							this.$refs.uToast.show({
								title: '更新成功',
								type: 'success'
							})
							setTimeout(() => {
								uni.hideLoading()
								this.jumpPage('/pages/myResume/myResume');
							}, 300)
						} else {
							uni.hideLoading();
							this.$refs.uToast.show({
								title: res.msg,
								type: 'error'
							})
						}
					}).catch(() => {
						uni.hideLoading();
						this.$refs.uToast.show({
							title: '系统异常',
							type: 'error'
						})
					})
				} else {
					uni.hideLoading()
					this.$refs.uToast.show({
						title: '请输入自我评价',
						type: 'warning'
					})
				}
			}
		}
	}
</script>

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