| <template> | 
|   <ContentScrollView :paddingH="false"> | 
|     <nut-form :model-value="form" ref="formRef" :rules="rules"> | 
|       <nut-form-item label="头像:" class="bole-form-item" prop="avatar"> | 
|         <Uploader v-model:file-list="form.avatar" :maximum="1" class="bole-uploader"> </Uploader> | 
|       </nut-form-item> | 
|       <nut-form-item label="姓名:" class="bole-form-item" prop="name"> | 
|         <nut-input v-model.trim="form.name" placeholder="请输入姓名" /> | 
|       </nut-form-item> | 
|       <nut-form-item label="手机号:" class="bole-form-item" prop="contactPhoneNumber" required> | 
|         <nut-input v-model.trim="form.contactPhoneNumber" placeholder="请输入手机号" type="text" /> | 
|       </nut-form-item> | 
|       <nut-form-item label="身份:" class="bole-form-item" prop="personalIdentityCode"> | 
|         <ChooseInputWithPicker | 
|           v-model="form.personalIdentityCode" | 
|           placeholder="请选择身份" | 
|           :value-enum="identityList" | 
|         /> | 
|       </nut-form-item> | 
|       <nut-form-item label="学历:" class="bole-form-item" prop="educationalBackgroundCode"> | 
|         <ChooseInputWithPicker | 
|           v-model="form.educationalBackgroundCode" | 
|           placeholder="请选择学历" | 
|           :value-enum="educationList" | 
|         /> | 
|       </nut-form-item> | 
|       <nut-form-item label="常驻城市:" class="bole-form-item" prop="areaList"> | 
|         <ChooseInputWithAreaPicker | 
|           :columns="areaTree" | 
|           v-model="form.areaList" | 
|           placeholder="请选择常驻城市" | 
|         ></ChooseInputWithAreaPicker> | 
|       </nut-form-item> | 
|     </nut-form> | 
|   </ContentScrollView> | 
|   <PageFooter> | 
|     <PageFooterBtn type="primary" @click="handleConfirm">保存</PageFooterBtn> | 
|   </PageFooter> | 
| </template> | 
|   | 
| <script setup lang="ts"> | 
| import { FormRules } from '@nutui/nutui-taro/dist/types/__VUE/form/types'; | 
| import { ChooseInputWithPicker, ChooseInputWithAreaPicker } from '@12333/components'; | 
| import { convertApi2FormUrlOnlyOne, Message, setOSSLink } from '@12333/utils'; | 
| import { useAreaTree, useDictionaryDataSelect, useUpdateResume } from '@12333/hooks'; | 
| import { AreaType, CategoryCode } from '@12333/constants'; | 
| import * as userResumeServices from '@12333/services/apiV2/userResume'; | 
| import Taro from '@tarojs/taro'; | 
| import { useQuery } from '@tanstack/vue-query'; | 
| import { useEventChannel } from 'senin-mini/hooks'; | 
| import { goBack } from '@/utils'; | 
|   | 
| defineOptions({ | 
|   name: 'InnerPage', | 
| }); | 
|   | 
| const { updateUserResume } = useUpdateResume(); | 
|   | 
| const eventChannel = useEventChannel(); | 
|   | 
| const { dictionaryDataList: identityList } = useDictionaryDataSelect({ | 
|   categoryCode: CategoryCode.Identity, | 
| }); | 
|   | 
| const { dictionaryDataList: educationList } = useDictionaryDataSelect({ | 
|   categoryCode: CategoryCode.Education, | 
| }); | 
|   | 
| const { areaTree } = useAreaTree({ | 
|   maxLayer: AreaType.City, | 
| }); | 
|   | 
| const form = reactive({ | 
|   avatar: [], | 
|   name: '', | 
|   contactPhoneNumber: '', | 
|   personalIdentityCode: '', | 
|   educationalBackgroundCode: '', | 
|   areaList: [] as string[], | 
| }); | 
|   | 
| const { | 
|   isLoading, | 
|   isError, | 
|   data: detail, | 
|   refetch, | 
| } = useQuery({ | 
|   queryKey: ['userResumeServices/getUserResumePersonal'], | 
|   queryFn: async () => { | 
|     return await userResumeServices.getUserResumePersonal( | 
|       {}, | 
|       { | 
|         showLoading: false, | 
|       } | 
|     ); | 
|   }, | 
|   placeholderData: () => ({} as API.GetUserResumePersonalQueryResult), | 
|   onSuccess(data) { | 
|     form.avatar = convertApi2FormUrlOnlyOne(data.avatar); | 
|     form.name = data.name ?? ''; | 
|     form.contactPhoneNumber = data.contactPhoneNumber ?? ''; | 
|     form.personalIdentityCode = data.personalIdentityCode ?? ''; | 
|     form.educationalBackgroundCode = data.educationalBackgroundCode ?? ''; | 
|     form.areaList = [data.provinceCode, data.cityCode].filter(Boolean); | 
|   }, | 
| }); | 
|   | 
| const rules = reactive<FormRules>({ | 
|   contactPhoneNumber: [{ required: true, message: '请输入手机号' }], | 
|   personalIdentityCode: [{ required: true, message: '请选择身份' }], | 
|   educationalBackgroundCode: [{ required: true, message: '请选择学历' }], | 
|   areaList: [ | 
|     { | 
|       required: true, | 
|       validator: () => { | 
|         if (!form.areaList.length) { | 
|           return Promise.reject('请选择常驻城市'); | 
|         } | 
|         return Promise.resolve(); | 
|       }, | 
|     }, | 
|   ], | 
| }); | 
| const formRef = ref<any>(null); | 
| function handleConfirm() { | 
|   if (!formRef.value) return; | 
|   formRef.value.validate().then(({ valid, errors }: any) => { | 
|     if (valid) { | 
|       confirm(); | 
|     } | 
|   }); | 
| } | 
|   | 
| async function confirm() { | 
|   try { | 
|     let params: API.SaveUserResumePersonalCommand = { | 
|       name: form.name, | 
|       avatar: form.avatar?.[0]?.path ?? '', | 
|       contactPhoneNumber: form.contactPhoneNumber, | 
|       educationalBackgroundCode: form.educationalBackgroundCode, | 
|       personalIdentityCode: form.personalIdentityCode, | 
|       provinceCode: form.areaList?.[0] ?? '', | 
|       cityCode: form.areaList?.[1] ?? '', | 
|     }; | 
|     let res = await userResumeServices.saveUserResumePersonal(params); | 
|     if (res) { | 
|       Message.success('保存成功', { | 
|         onClosed() { | 
|           goBack(); | 
|           updateUserResume(); | 
|         }, | 
|       }); | 
|     } | 
|   } catch (error) {} | 
| } | 
| </script> |