job-pc/src/components/invite/position/demand.vue

<template>
	<a-form :model="createForm" :label-col="{span: 6}" labelAlign="right">
		<a-row :gutter="20">
			<a-col span="12">
				<a-row>
					<a-col span="24">
						<a-form-item required label="工作经验">
							<a-xuanze :dict="2021" placeholder="请选择工作经验" @saveSelect="saveExperience"
								:select_content="createForm.experience"></a-xuanze>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item label="学历">
							<a-xuanze :dict="2006" placeholder="请选择学历" @saveSelect="saveSchoolDegree"
								:select_content="createForm.school_degree"></a-xuanze>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item label="含最高学历" name="degree_better">
							<a-radio-group v-model:value="createForm.degree_better" button-style="solid">
								<a-radio-button :value="1">是</a-radio-button>
								<a-radio-button :value="2">否</a-radio-button>
							</a-radio-group>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item required label="职称要求">
							<a-xuanze :dict="2006" placeholder="请选择职称要求" @saveSelect="saveProfelevel"
								:select_content="createForm.profelevel"></a-xuanze>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item required label="技能认证">
							<a-xuanze :dict="2015" placeholder="请选择技能认证" @saveSelect="saveCertification"
								:select_content="createForm.certification"></a-xuanze>
						</a-form-item>
					</a-col>

					<a-col span="24">
						<a-form-item label="语言要求">
							<a-xuanze :dict="2007" placeholder="请选择语言要求" @saveSelect="saveLanguage"
								:select_content="createForm.language"></a-xuanze>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item label="掌握程度">
							<a-xuanze :dict="2007" placeholder="请选择掌握程度" @saveSelect="saveLanguageDegree"
								:select_content="createForm.language_degree"></a-xuanze>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item label="性别要求" name="sex">
							<a-radio-group v-model:value="createForm.sex" button-style="solid">
								<a-radio-button :value="1">男</a-radio-button>
								<a-radio-button :value="2">女</a-radio-button>
								<a-radio-button :value="3">不限</a-radio-button>
							</a-radio-group>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item label="最小年龄" name="age_min">
							<a-input-number :min="0" type="number" v-model:value="createForm.age_min"
								placeholder="请输入最小年龄" style="width: 100%;" />
						</a-form-item>
					</a-col>

					<a-col span="24">
						<a-form-item label="最大年龄" name="age_max">
							<a-input-number :min="0" type="number" v-model:value="createForm.age_max"
								placeholder="请输入最大年龄" style="width: 100%;" />
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item required label="婚姻状况" name="marital_status">
							<a-radio-group v-model:value="createForm.marital_status" button-style="solid">
								<a-radio-button :value="1">已婚</a-radio-button>
								<a-radio-button :value="2">未婚</a-radio-button>
								<a-radio-button :value="3">不限</a-radio-button>
							</a-radio-group>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item required label="专业" name="major">
							<a-input v-model:value="createForm.major" placeholder="请输入专业" />
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item label="证书要求">
							<a-checkbox-group v-model:value="createForm.license">
								<a-row>
									<template v-for="(item, index) in licenseOption">
										<a-col span="8">
											<a-checkbox :value="item.id">{{item.name}}</a-checkbox>
										</a-col>
									</template>
								</a-row>
							</a-checkbox-group>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item label="籍贯要求" name="mandarin">
							<a-jilian :dict="2009" @saveCascader="compantJiguanSave" placeholder="请选择籍贯"
								:cascader_content="addOtherForm.company_jiguan_cascader"></a-jilian>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item label="所在地要求" name="mandarin">
							<a-jilian :dict="2009" @saveCascader="compantSuozaidiSave" placeholder="请选择所在地"
								:cascader_content="addOtherForm.company_suozaidi_cascader"></a-jilian>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-form-item required label="保存">
							<a-button type="primary" block @click="sumbitForm">保存</a-button>
						</a-form-item>
					</a-col>
				</a-row>
			</a-col>
		</a-row>
	</a-form>
</template>

<script setup lang="ts">
	import { ref, onMounted, computed, watch, defineEmits, defineProps } from 'vue';
	import { GetDictTree, PostCompanyJobAdd, alreadyValue } from '@/apis/models';
	import { warnToast, successToast } from '@/utils/toastHelper';
	import { intersectionAlike } from '@/utils/dataHelper';
	const emit = defineEmits();
	const props = defineProps(['job_detail']);
	let licenseOption = ref<Object[]>([])

	let createForm : companyListType.addrFormType = ref({
		experience: 0,
		school_degree: 0,
		degree_better: 0,
		profelevel: 0,
		certification: 0,
		language: 0,
		language_degree: 0,
		sex: 3,
		age_min: 0,
		age_max: 0,
		marital_status: 3,
		major: '',
		license: [],
		household_province: 0,
		household_city: 0,
		location_province: 0,
		location_city: 0,
		location_town: 0,
	})


	let addOtherForm = ref<companyListType.addOtherFormType>({
		company_jiguan_cascader: [],
		company_suozaidi_cascader: [],
	})

	const job_id = ref<object>(null);
	watch(() => [props.job_detail], async (newVal : string[], oldVal) => {
		let res = await GetDictTree({ code: 2018 })
		licenseOption.value = res.data.dicts;
		if (newVal[0]) {
			job_id.value = newVal[0].id;
			createForm.value = intersectionAlike(createForm.value, newVal[0]);
			addOtherForm.value = {
				company_jiguan_cascader: [newVal[0].household_province, newVal[0].household_city],
				company_suozaidi_cascader: addToLocationArray(newVal[0])
			}
			sessionStorage.setItem("second", JSON.stringify(createForm.value))
			sessionStorage.setItem("secondOther", JSON.stringify(addOtherForm.value))
			
			addOtherForm.value = sessionStorage.getItem('secondOther') ? JSON.parse(sessionStorage.getItem('secondOther')) : addOtherForm.value
			createForm.value = sessionStorage.getItem('second') ? JSON.parse(sessionStorage.getItem('second')) : createForm.value
		}
	}, { immediate: true })

	const addToLocationArray = (data) => {
		let locationArray = [];
		if (data.location_province !== 0) {
			locationArray.push(data.location_province);
		}
		if (data.location_city !== 0) {
			locationArray.push(data.location_city);
		}
		if (data.location_town !== 0) {
			locationArray.push(data.location_town);
		}
		return locationArray;
	}

	onMounted(async () => {

	})

	// 工作经验
	const saveExperience = (data) => {
		createForm.value.experience = data.val.key;
	}

	// 学历要求
	const saveSchoolDegree = (data) => {
		createForm.value.school_degree = data.val.key;
	}

	// 职称要求
	const saveProfelevel = (data) => {
		createForm.value.profelevel = data.val.key;
	}

	// 技能认证
	const saveCertification = (data) => {
		createForm.value.certification = data.val.key;
	}

	// 语言要求
	const saveLanguage = (data) => {
		createForm.value.language = data.val.key;
	}

	// 掌握程度
	const saveLanguageDegree = (data) => {
		createForm.value.language_degree = data.val.key;;
	}

	// 选择籍贯
	const compantJiguanSave = (data) => {
		addOtherForm.value.company_jiguan_cascader = data.arr1;
		createForm.value.household_province = data.arr1[0] ? data.arr1[0] : 0;
		createForm.value.household_city = data.arr1[1] ? data.arr1[1] : 0;
	}

	// 选择所在地
	const compantSuozaidiSave = (data) => {
		addOtherForm.value.company_suozaidi_cascader = data.arr1;
		createForm.value.location_province = data.arr1[0] ? data.arr1[0] : 0;
		createForm.value.location_city = data.arr1[1] ? data.arr1[1] : 0;
		createForm.value.location_town = data.arr1[2] ? data.arr1[2] : 0;
	}

	const sumbitForm = () => {
		console.log(createForm.value)
		sessionStorage.setItem("second", JSON.stringify(createForm.value))
		sessionStorage.setItem("secondOther", JSON.stringify(addOtherForm.value))
		emit('saveSuccess', { key: "3" })
	}

	const resetForm = () => {
		addOtherForm.value = {
			company_jiguan_cascader: '',
			company_suozaidi_cascader: ''
		}
		createForm.value = {
			experience: 0,
			school_degree: 0,
			degree_better: 0,
			profelevel: 0,
			certification: 0,
			language: 0,
			language_degree: 0,
			sex: 3,
			age_min: 0,
			age_max: 0,
			marital_status: 3,
			major: '',
			license: [],
			household_province: 0,
			household_city: 0,
			location_province: 0,
			location_city: 0,
			location_town: 0,
		}
	}
</script>

<style>
</style>