<template>
	<div  style="width: 100%;">
			<a-form :model="createForm" layout="vertical"  class="resume-form">
				<a-row :gutter="20">
					<a-col span="8">
						<a-form-item required label="英语" name="english">
							<a-xuanze :dict="2008" placeholder="请选择掌握程度" @saveSelect="saveEnglish"
								:select_content="createForm.english"></a-xuanze>
						</a-form-item>
					</a-col>
					<a-col span="8">
						<a-form-item required label="国语" name="mandarin">
							<a-xuanze :dict="2008" placeholder="请选择掌握程度" @saveSelect="saveMandarin"
								:select_content="createForm.mandarin"></a-xuanze>
						</a-form-item>
					</a-col>
					<a-col span="8">
						<a-form-item required label="粤语" name="cantonese">
							<a-xuanze :dict="2008" placeholder="请选择掌握程度" @saveSelect="saveCantonese"
								:select_content="createForm.cantonese"></a-xuanze>
						</a-form-item>
					</a-col>
					<a-col span="8">
						<a-form-item label="第二外语" name="other_language">
							<a-xuanze :dict="2007" placeholder="请选择掌握程度" @saveSelect="saveOtherLanguage"
								:select_content="createForm.other_language"></a-xuanze>
						</a-form-item>
					</a-col>
					<a-col span="8">
						<a-form-item required label="计算机能力" name="computer_skills">
							<a-input v-model:value="createForm.computer_skills" placeholder="请输入计算机能力"/>
						</a-form-item>
					</a-col>
					<a-col span="24">
						<a-flex justify="flex-end">
							<a-space>
								<a-button @click="resetForm"  >取消</a-button>
								<a-button type="primary" @click="sumbitForm"  >保存</a-button>
							</a-space>
						</a-flex>
					</a-col>
				</a-row>
			</a-form>

	</div>
</template>

<script setup lang="ts">
	import { ref, onMounted, computed, defineProps, watch, defineEmits, createVNode } from 'vue';
	import { PostJobapplicantAddskill, PostJobapplicantUpdateskill, PostJobapplicantSkilldetail } from '@/apis/models';
	import { intersectionAlike } from '@/utils/dataHelper';
	import { warnToast, successToast } from '@/utils/toastHelper';
	import { dataForm, otherDataForm, reset } from '@/views/jobSeeker/resume/add/skill/data.ts';
	import { useCommon } from '@/hooks/useCommon';
	let { store, dayjs, richOption, ExclamationCircleOutlined, Modal } = useCommon();
	const dayjsRef = ref(dayjs);
	let props = defineProps(['customer_record']);
	const emit = defineEmits();

	let createForm = ref<JobseekerSkillType.JobseekerSkillFormType>(dataForm)

	onMounted(() => {
		getBasic()
	})

	const getBasic = () => {
		PostJobapplicantSkilldetail({customer_id: props.customer_record.customer_id}).then(res => {
			createForm.value = intersectionAlike(createForm.value, res.data)
			createForm.value.id = res.data.id;
			createForm.value.customer_id = res.data.customer_id;
		})
	}

	// 英语
	const saveEnglish = (data) => {
		createForm.value.english = data.val.key;
	}

	// 国语
	const saveMandarin = (data) => {
		createForm.value.mandarin = data.val.key;
	}

	// 粤语
	const saveCantonese = (data) => {
		createForm.value.cantonese = data.val.key;
	}

	// 第二外语
	const saveOtherLanguage = (data) => {
		createForm.value.other_language = data.val.key;
	}

	const sumbitForm = () => {
		if (createForm.value.id) {
			PostJobapplicantUpdateskill(createForm.value).then(res => {
				successToast('保存成功');
				getBasic();
				// resetForm()
			}).catch(err => {
			})
		} else {
			PostJobapplicantAddskill(createForm.value).then(res => {
				successToast('保存成功');
				getBasic();
				// resetForm()
			}).catch(err => {
			})
		}
	}

	const resetForm = () => {
		createForm.value = reset().dataForm as JobseekerSkillType.JobseekerSkillFormType;
	}

	// watch(() => [props.form_state], (newVal) => {
	// 	state.value = newVal[0];
	// 	getBasic();
	// })
</script>

<style>
</style>
