uniProject/pages/admin/Jiazheng/qiuzhiXinxi.vue

<template>
	<view class="jz-content-box">
		<view class="form-label-radio form-top-margin flex-start-row">
			<view class="phone-form-label"> <text class="form-label-require"></text>类型</view>
			<dataChecked :list="typeList" mode="multiple" :defaultCount="9" @change="selectChangeType" @add="addType" />
		</view>
		<view class="form-label-select">
			<view class="phone-form-label"><text class="form-label-require"></text>经验</view>
		</view>
		<view class="form-label-radio flex-start-row">
			<view class="phone-form-label"><text class="form-label-require">*</text>技能</view>
			<dataChecked :list="skillList" mode="multiple" :defaultCount="9" @change="selectChangeSkill"
				@add="addSkill" />
		</view>
		<view class="form-label-radio form-top-margin flex-start-row">
			<view class="phone-form-label"><text class="form-label-require">*</text>状态</view>
			<dataChecked :list="zhuangtaiList" mode="single" :showAdd="false" @change="selectChangeZhuangtai" />
		</view>
		<view class="form-label-select">
			<view class="phone-form-label"><text class="form-label-require"></text>薪资级别</view>
			<picker :range="xinziJibie" mode='selector' @change="xinziJibieChange" @cancel="xinziJibieCancel">
				<view class="form-radio-select">
					<view></view><icon></icon>
				</view>
			</picker>
		</view>
		
		<view class="form-label-input">
			<view class="phone-form-label"><text class="form-label-require"></text>期望薪资</view>
			<input v-model="inputValue"  placeholder="请输入期望薪资" />
		</view>	
		<view class="form-label-input">
			<view class="phone-form-label"><text class="form-label-require"></text>工作经历</view>
			<input v-model="inputValue"  placeholder="请填写工作经历" />
		</view>
		<view class="page-btn-box">
			<button type="default" class="phone-white-btn">上一步</button>
			<button type="default" class="phone-green-btn">下一步</button>
		</view>
	</view>
</template>

<script>
	import dataChecked from './common/dataChecked.vue';
	import {
		getJiazhengLeixing,
		getJiazhengJineng,
		getJiazhengZhuangtai
	} from "@/api/jiazheng.js";

	export default {
		components: {
			dataChecked
		},
		// onLoad 是 uni-app 的页面生命周期钩子，不需要导入
		created() {
			this.getLeixing()
			this.getJineng()
			this.getZhuangtai()
		},
		data() {
			return {
				// 从后端获取的技能列表
				skillList: [],
				typeList: [],
				zhuangtaiList: [],
				inputValue: '',
				xinziJibie: ["一", "二","三","四","五",],
			};
		},
		methods: {
			// 点击完成按钮的时候触发，
			xinziJibieChange(e) {
				//通过e.detail.value获取值，获取的是自定义数据的下标
				const val = e.detail.value
				console.log(val);
			},
			xinziJibieCancel(e) {
				console.log("您已取消选择");
			},

			getLeixing() {
				getJiazhengLeixing({}).then(res => {
					this.skillList = this.dataConversionObject(res.data)
					console.log('this.skillList', this.skillList);
				}).catch(error => {
					console.error('获取技能类型失败:', error);
				});
			},
			getJineng() {
				getJiazhengJineng({}).then(res => {
					this.typeList = this.dataConversionObject(res.data)
					console.log('this.typeList', this.typeList);
				}).catch(error => {
					console.error('获取技能类型失败:', error);
				});
			},
			getZhuangtai() {
				getJiazhengZhuangtai({}).then(res => {
					console.log('res', res);
					this.zhuangtaiList = res.data
					// this.typeList = this.dataConversionObject(res.data)
					// console.log('this.typeList', this.typeList);
				}).catch(error => {
					console.error('获取技能类型失败:', error);
				});
			},
			dataConversionObject(data) {
				let newList
				newList = data.map((name, index) => ({
					id: index,
					name: name
				}));
				return newList
			},
			dataConversionArray(data) {
				let newList
				newList = data.map((item, index) => {
					return item.name
				});
				return newList
			},
			selectChangeType(data) {
				console.log('typeData', data);
			},
			addType(newType) {
				this.typeList.push({
					...newType,
				});
			},
			selectChangeSkill(data) {
				console.log('SkillData', data);
			},
			addSkill(newSkill) {
				this.skillList.push({
					...newSkill,
				});
			},
			selectChangeZhuangtai(data) {
				console.log('zhuangtaiData', data);
			}
		}
	};
</script>