| | |
| | | </nut-form-item> |
| | | <nut-form-item |
| | | label="服务费:" |
| | | class="bole-form-item" |
| | | class="bole-form-item alignTop" |
| | | prop="feeType" |
| | | required |
| | | label-width="90px" |
| | | label-position="top" |
| | | > |
| | | <nut-radio-group v-model="form.feeType" direction="horizontal"> |
| | | <BlRadio :label="Number(key)" v-for="(val, key) in FlexTaskFeeTypeEnumText" :key="key">{{ |
| | |
| | | }}</BlRadio> |
| | | </nut-radio-group> |
| | | </nut-form-item> |
| | | <nut-form-item label=" " class="bole-form-item" prop="fee" label-width="90px"> |
| | | <nut-form-item label=" " class="bole-form-item" prop="fee" label-width="0"> |
| | | <div class="bole-form-input-wrapper"> |
| | | <nut-input |
| | | v-model.trim="form.fee" |
| | |
| | | > |
| | | </nut-radio-group> |
| | | </nut-form-item> |
| | | <nut-form-item label="福利:" class="bole-form-item" prop="listAideIds" label-width="90px"> |
| | | <ChooseInputWithPicker |
| | | <nut-form-item label="福利:" class="bole-form-item" prop="settleType" label-width="90px"> |
| | | <ChooseInputWithCheckbox |
| | | v-model="form.listAideIds" |
| | | title="请选择福利" |
| | | :columns="WelfareTypeList" |
| | | placeholder="请选择福利" |
| | | :value-enum="TaskStatusText" |
| | | /> |
| | | </nut-form-item> |
| | | <nut-form-item |
| | | label="年龄范围:" |
| | | class="bole-form-item" |
| | | prop="ageStart" |
| | | prop="minAge" |
| | | required |
| | | label-width="90px" |
| | | > |
| | | <div class="bole-form-input-wrapper"> |
| | | <NumberInput |
| | | v-model.trim="form.ageStart" |
| | | v-model.trim="form.minAge" |
| | | class="nut-input-text bole-input-text" |
| | | placeholder="请选择年龄范围" |
| | | :min="1" |
| | | /> |
| | | <div class="form-input-separator">至</div> |
| | | <NumberInput |
| | | v-model.trim="form.ageEnd" |
| | | v-model.trim="form.maxAge" |
| | | class="nut-input-text bole-input-text" |
| | | placeholder="请选择年龄范围" |
| | | :min="1" |
| | | /> |
| | | </div> |
| | | </nut-form-item> |
| | | <nut-form-item label="性别:" class="bole-form-item" prop="welfare" label-width="90px"> |
| | | <nut-form-item label="性别:" class="bole-form-item" prop="sexType" label-width="90px"> |
| | | <ChooseInputWithPicker |
| | | v-model="form.welfare" |
| | | v-model="form.sexType" |
| | | placeholder="请选择性别要求" |
| | | :value-enum="TaskStatusText" |
| | | :value-enum="GenderText" |
| | | /> |
| | | </nut-form-item> |
| | | <nut-form-item label="资格证书:" class="bole-form-item" prop="welfare" label-width="90px"> |
| | | <ChooseInputWithPicker |
| | | v-model="form.welfare" |
| | | placeholder="请选择要求的资格证书" |
| | | :value-enum="TaskStatusText" |
| | | <nut-form-item label="资格证书:" class="bole-form-item" prop="settleType" label-width="90px"> |
| | | <ChooseInputWithCheckbox |
| | | v-model="form.listCertionIds" |
| | | title="请选择资格证书" |
| | | :columns="CertificateTypeList" |
| | | placeholder="请选择资格证书" |
| | | /> |
| | | </nut-form-item> |
| | | <nut-form-item label="任务地点" class="bole-form-item" prop="weMapInfo" required> |
| | | <ChooseLocationInput placeholder="请选择任务所在地" v-model="form.weMapInfo" /> |
| | | <nut-form-item label="任务地点" class="bole-form-item" prop="areaList" required> |
| | | <!-- <ChooseLocationInput placeholder="请选择任务所在地" v-model="form.weMapInfo" /> --> |
| | | <ChooseInputWithAreaPicker |
| | | :columns="areaTreeList" |
| | | v-model="form.areaList" |
| | | placeholder="请选择所在地区" |
| | | ></ChooseInputWithAreaPicker> |
| | | </nut-form-item> |
| | | <nut-form-item label="详细地址:" class="bole-form-item" prop="name" label-width="90px"> |
| | | <nut-input v-model="form.name" placeholder="请输入详细地址"> </nut-input> |
| | | <nut-form-item label="详细地址:" class="bole-form-item" prop="address" label-width="90px"> |
| | | <nut-input v-model="form.address" placeholder="请输入详细地址"> </nut-input> |
| | | </nut-form-item> |
| | | <nut-form-item |
| | | label="任务开始日期:" |
| | |
| | | |
| | | <script setup lang="ts"> |
| | | import { |
| | | TaskStatus, |
| | | TaskStatusText, |
| | | FlexTaskSettleTypeEnum, |
| | | FlexTaskSettleTypeEnumText, |
| | | FlexTaskFeeTypeEnum, |
| | |
| | | NumberInput, |
| | | ChooseLocationInput, |
| | | Radio as BlRadio, |
| | | ChooseInputWithAreaPicker, |
| | | ChooseInputWithCheckbox, |
| | | } from '@12333/components'; |
| | | import { FormValidator, Message } from '@12333/utils'; |
| | | import * as flexWorkerServices from '@12333/services/api/FlexWorker'; |
| | | import { FormRules } from '@nutui/nutui-taro/dist/types/__VUE/form/types'; |
| | | import Taro from '@tarojs/taro'; |
| | | import { goBack } from '@/utils'; |
| | | import { Gender, GenderText, SearchType } from '@12333/constants'; |
| | | import { useAllAreaList, useSearchSettingType } from '@12333/hooks'; |
| | | import { useQuery } from '@tanstack/vue-query'; |
| | | import dayjs from 'dayjs'; |
| | | |
| | | defineOptions({ |
| | | name: 'InnerPage', |
| | | }); |
| | | |
| | | const { userDetail } = useUser(); |
| | | const { areaTreeList } = useAllAreaList(); |
| | | const router = Taro.useRouter(); |
| | | const taskId = router.params?.taskId ?? ''; |
| | | const isEdit = computed(() => !!taskId); |
| | | const isEdit = !!taskId; |
| | | const isCopy = router.params?.isCopy === 'true'; |
| | | console.log('isCopy: ', router.params?.isCopy); |
| | | |
| | | const { searchSettingTypeList: WelfareTypeList } = useSearchSettingType({ |
| | | searchType: SearchType.Welfare, |
| | | }); |
| | | const { searchSettingTypeList: CertificateTypeList } = useSearchSettingType({ |
| | | searchType: SearchType.CertificateType, |
| | | }); |
| | | |
| | | const form = reactive({ |
| | | taskName: '', |
| | |
| | | fee: 0, |
| | | settleType: FlexTaskSettleTypeEnum.OfMonth, |
| | | listAideIds: [] as string[], |
| | | |
| | | welfare: TaskStatus.All, |
| | | salaryTimeType: SalaryTimeTypeEnum.Month, |
| | | salaryType: SalaryType.month, |
| | | minAge: 0, |
| | | maxAge: 0, |
| | | sexType: Gender.Male, |
| | | listCertionIds: [] as string[], |
| | | address: '', |
| | | startDate: '', |
| | | endDate: '', |
| | | ageStart: '', |
| | | ageEnd: '', |
| | | areaList: [] as number[], |
| | | |
| | | weMapInfo: {} as WeMapModel, |
| | | }); |
| | | |
| | | const rules = reactive<FormRules>({ |
| | | taskName: [{ required: true, message: '请输入任务名称' }], |
| | | |
| | | weMapInfo: [ |
| | | { required: true, message: '请设置工作地点', validator: FormValidator.validatorWeMap }, |
| | | // weMapInfo: [ |
| | | // { required: true, message: '请设置工作地点', validator: FormValidator.validatorWeMap }, |
| | | // ], |
| | | areaList: [ |
| | | { required: true, message: '清添加工作地点', validator: FormValidator.validatorArray }, |
| | | ], |
| | | |
| | | ageStart: [ |
| | | minAge: [ |
| | | { |
| | | required: true, |
| | | message: '请输入年龄要求', |
| | | validator: () => { |
| | | if (!form.ageStart) { |
| | | if (!form.minAge) { |
| | | return Promise.reject('请输入年龄要求'); |
| | | } |
| | | if (!form.ageEnd) { |
| | | if (!form.maxAge) { |
| | | return Promise.reject('请输入年龄要求'); |
| | | } |
| | | if (Number(form.ageEnd) <= Number(form.ageStart)) { |
| | | if (Number(form.maxAge) <= Number(form.minAge)) { |
| | | return Promise.reject('最大年龄不能小于最小年龄'); |
| | | } |
| | | return Promise.resolve(true); |
| | | }, |
| | | }, |
| | | ], |
| | | |
| | | startDate: [ |
| | | { |
| | | required: true, |
| | | message: '请选择开始日期', |
| | | }, |
| | | ], |
| | | endDate: [ |
| | | { |
| | | required: true, |
| | | message: '请选择结束日期', |
| | | validator(value) { |
| | | if (!value) return Promise.reject('请选择结束日期'); |
| | | if (value <= form.startDate) return Promise.reject('结束日期不能小于开始日期'); |
| | | return Promise.resolve(true); |
| | | }, |
| | | }, |
| | | ], |
| | | }); |
| | | |
| | | const { |
| | | isLoading, |
| | | isError, |
| | | data: detail, |
| | | refetch, |
| | | } = useQuery({ |
| | | queryKey: ['flexWorkerServices/getFlexTaskDto', taskId], |
| | | queryFn: async () => { |
| | | return await flexWorkerServices.getFlexTaskDto( |
| | | { id: taskId }, |
| | | { |
| | | showLoading: false, |
| | | } |
| | | ); |
| | | }, |
| | | placeholderData: () => ({} as API.GetFlexTaskDtoOutput), |
| | | enabled: isEdit, |
| | | onSuccess(data) { |
| | | form.taskName = data.taskName; |
| | | form.feeType = data.feeType; |
| | | form.fee = data.fee; |
| | | form.settleType = data.settleType; |
| | | form.listAideIds = data.taskWeals?.length > 0 ? data.taskWeals.map((item) => item.id) : []; |
| | | form.minAge = data.minAge; |
| | | form.maxAge = data.maxAge; |
| | | form.sexType = data.sexType; |
| | | form.listCertionIds = data.taskCerts?.length > 0 ? data.taskCerts.map((item) => item.id) : []; |
| | | form.address = data.address; |
| | | form.startDate = dayjs(data.startDate).format('YYYY-MM-DD'); |
| | | form.endDate = dayjs(data.endDate).format('YYYY-MM-DD'); |
| | | form.areaList = [data.provinceId, data.cityId, data.areaId]; |
| | | form.address = data.address; |
| | | }, |
| | | }); |
| | | |
| | | const formRef = ref<any>(null); |
| | | function handleConfirm() { |
| | | if (!formRef.value) return; |
| | |
| | | try { |
| | | let params: API.AddEidtFlexTaskInput = { |
| | | taskName: form.taskName, |
| | | feeType: form.salaryType, |
| | | feeType: form.feeType, |
| | | fee: form.fee, |
| | | settleType: form.settleType, |
| | | listAideIds: form.listAideIds, |
| | | minAge: form.minAge, |
| | | maxAge: form.maxAge, |
| | | sexType: form.sexType, |
| | | listCertionIds: form.listCertionIds, |
| | | address: form.address, |
| | | startDate: form.startDate, |
| | | endDate: form.endDate, |
| | | provinceId: form.areaList[0], |
| | | cityId: form.areaList[1], |
| | | areaId: form.areaList[2], |
| | | }; |
| | | if (isEdit.value) { |
| | | if (isEdit) { |
| | | params.taskId = taskId; |
| | | } |
| | | if (isCopy) { |
| | | params.taskId = ''; |
| | | } |
| | | let res = await flexWorkerServices.addEidtFlexTask(params); |
| | | if (res) { |
| | | Message.success(isEdit.value ? '编辑成功' : '发布成功', { |
| | | Message.success(isEdit ? '编辑成功' : '发布成功', { |
| | | onClosed() { |
| | | goBack(); |
| | | }, |
| | |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | flex-shrink: 0; |
| | | } |
| | | |
| | | .form-input-separator { |
| | | margin-right: 10px; |
| | | } |
| | | } |
| | | </style> |