| | |
| | | :value-enum="EnumBillingMethodText" |
| | | :showExtra="true" |
| | | :button-style="false" |
| | | :disabled="feeCannotEdit" |
| | | > |
| | | <template #extra> |
| | | <ProFormInputNumber |
| | | v-if="form.billingMethod !== EnumBillingMethod.Face" |
| | | :controls="false" |
| | | v-model="form.serviceFee" |
| | | placeholder="请输入" |
| | | :min="0" |
| | | :max="999999999999" |
| | | :unit="EnumBillingMethodUnitText[form.billingMethod]" |
| | | :disabled="feeCannotEdit" |
| | | ></ProFormInputNumber> |
| | | </template> |
| | | </RadioWithExtra> |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | | <template |
| | | v-if=" |
| | | form.billingMethod === EnumBillingMethod.Hour || |
| | | form.billingMethod === EnumBillingMethod.Day |
| | | " |
| | | > |
| | | <ProFormCol> |
| | | <ProFormColItem :span="12"> |
| | | <ProFormItemV2 |
| | | label="核定工时:" |
| | | prop="verifyWorkHours" |
| | | :check-rules="[{ message: '请输入核定工时' }]" |
| | | > |
| | | <ProFormInputNumber |
| | | :controls="false" |
| | | v-model="form.verifyWorkHours" |
| | | placeholder="请输入核定工时" |
| | | :min="0" |
| | | :max="999999999999" |
| | | unit="小时/天" |
| | | :disabled="feeCannotEdit" |
| | | ></ProFormInputNumber> |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | | <ProFormCol> |
| | | <ProFormColItem :span="12"> |
| | | <ProFormItemV2 |
| | | label="超时服务费:" |
| | | prop="timeoutServiceFee" |
| | | :check-rules="[{ message: '请输入超时服务费' }]" |
| | | > |
| | | <ProFormInputNumber |
| | | :controls="false" |
| | | v-model="form.timeoutServiceFee" |
| | | placeholder="请输入超时服务费" |
| | | :min="0" |
| | | :max="999999999999" |
| | | unit="元/小时" |
| | | :disabled="feeCannotEdit" |
| | | ></ProFormInputNumber> |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | | </template> |
| | | |
| | | <ProFormCol> |
| | | <ProFormColItem :span="12"> |
| | | <ProFormItemV2 |
| | |
| | | v-model="form.settlementCycle" |
| | | :value-enum="EnumSettlementCycleText" |
| | | :button-style="false" |
| | | @change="handleSettlementCycleChange" |
| | | :disabled="feeCannotEdit" |
| | | ></ProFormRadio> |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | | <ProFormCol> |
| | | <ProFormColItem :span="12" class="settlement-cycle-date-form-item"> |
| | | <ProFormItemV2 |
| | | v-if="form.settlementCycle !== EnumSettlementCycle.Day" |
| | | label="结算日期:" |
| | | prop="settlementCycle" |
| | | :check-rules="[{ message: '请选择结算日期' }]" |
| | | > |
| | | {{ EnumSettlementCycleDateText[form.settlementCycle] }} |
| | | <ProFormSelect |
| | | v-model="form.settlementDate" |
| | | :value-enum="settlementDateList" |
| | | :button-style="false" |
| | | ></ProFormSelect> |
| | | {{ '结算' }} |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | |
| | | > |
| | | <ProFormInputNumber |
| | | :controls="false" |
| | | :min="1" |
| | | :min="16" |
| | | v-model="form.ageMinLimit" |
| | | placeholder="请输入" |
| | | ></ProFormInputNumber> |
| | | <div class="form-input-separator">至</div> |
| | | <ProFormInputNumber |
| | | :controls="false" |
| | | :min="1" |
| | | :min="16" |
| | | v-model="form.ageMaxLimit" |
| | | placeholder="请输入" |
| | | ></ProFormInputNumber> |
| | | 岁 |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | |
| | | <ProFormItemV2 |
| | | label="任务地点:" |
| | | prop="weMapInfo" |
| | | :check-rules="[ |
| | | { message: '请选择任务地点', validator: FormValidator.validatorWeMap }, |
| | | ]" |
| | | :check-rules="[{ message: '请选择任务地点', type: 'weMap' }]" |
| | | > |
| | | <WeMap v-if="!isDetail" v-model="form.weMapInfo" /> |
| | | <div v-else> |
| | |
| | | </ProFormCol> |
| | | <ProFormCol> |
| | | <ProFormColItem :span="12"> |
| | | <ProFormItemV2 |
| | | label="详细地址:" |
| | | prop="addressDetail" |
| | | :check-rules="[{ message: '请输入详细地址' }]" |
| | | > |
| | | <ProFormText v-model.trim="form.addressDetail" placeholder="请输入详细地址" /> |
| | | <ProFormItemV2 label="地点说明:" prop="addressDetail"> |
| | | <ProFormText v-model.trim="form.addressDetail" placeholder="请输入地点说明" /> |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | | <ProFormCol> |
| | | <ProFormColItem :span="12"> |
| | | <ProFormItemV2 label="任务描述:" prop="description"> |
| | | <ProFormTextArea |
| | | :rows="4" |
| | | v-model.trim="form.description" |
| | | placeholder="请输入任务描述" |
| | | /> |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | | <ProFormCol> |
| | | <ProFormColItem :span="12"> |
| | | <ProFormItemV2 |
| | | label="报名时间:" |
| | | prop="applyTime" |
| | | :check-rules="[{ message: '请选择报名时间', type: 'array' }]" |
| | | > |
| | | <ProFormDatePicker |
| | | v-model="form.applyTime" |
| | | type="daterange" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | :disabled-date="disabledapplyDate" |
| | | ></ProFormDatePicker> |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | | <ProFormCol> |
| | | <ProFormColItem :span="12"> |
| | | <ProFormItemV2 |
| | | label="验收方式:" |
| | | prop="checkReceiveMethod" |
| | | :check-rules="[{ message: '请选择验收方式' }]" |
| | | > |
| | | <ProFormRadio |
| | | v-model="form.checkReceiveMethod" |
| | | :value-enum="EnumTaskCheckReceiveMethodText" |
| | | :button-style="false" |
| | | ></ProFormRadio> |
| | | </ProFormItemV2> |
| | | </ProFormColItem> |
| | | </ProFormCol> |
| | | <ProFormItemV2 |
| | | label="结算方式:" |
| | | prop="settlementAccess" |
| | | :check-rules="[{ message: '请选择结算方式' }]" |
| | | > |
| | | <ProFormSelect |
| | | v-model="form.settlementAccess" |
| | | :value-enum="settlementAccessList" |
| | | :disabled="isEdit" |
| | | placeholder="请选择结算方式" |
| | | ></ProFormSelect> |
| | | </ProFormItemV2> |
| | | </ProForm> |
| | | <template #footer> |
| | | <el-button @click="handleBack()">关闭</el-button> |
| | |
| | | ProFormRadio, |
| | | ProFormDatePicker, |
| | | ProFormCheckbox, |
| | | ProFormSelect, |
| | | ProFormTextArea, |
| | | } from '@bole-core/components'; |
| | | import { FormInstance, ModelValueType } from 'element-plus'; |
| | | import { Message } from '@bole-core/core'; |
| | |
| | | import * as taskServices from '@/services/api/task'; |
| | | import { |
| | | EnumUserGenderTextForEdit, |
| | | EnumBillingMethod, |
| | | EnumBillingMethodText, |
| | | EnumBillingMethodUnitText, |
| | | EnumSettlementCycleText, |
| | | EnumSettlementCycleDateText, |
| | | EnumSettlementCycleDateMonthArray, |
| | | EnumSettlementCycleDateWeekArray, |
| | | EnumSettlementCycle, |
| | | EnumTaskCheckReceiveMethodText, |
| | | EnumEnterpriseWalletAccessText, |
| | | } from '@/constants'; |
| | | import { format, FormValidator } from '@/utils'; |
| | | import dayjs from 'dayjs'; |
| | |
| | | const id = route.params.id as string; |
| | | const isEdit = !!id; |
| | | |
| | | const { settlementAccessList } = useEnterpriseWalletAccessSelect(); |
| | | |
| | | function disabledDate(time: Date) { |
| | | return dayjs(time).isBefore(dayjs(), 'day'); |
| | | } |
| | | |
| | | function disabledapplyDate(time: Date) { |
| | | return dayjs(time).isBefore(form.time[0], 'day') || dayjs(time).isAfter(form.time[1], 'day'); |
| | | } |
| | | |
| | | const feeCannotEdit = computed(() => { |
| | | return dayjs(form.time[0]).isBefore(dayjs(), 'day'); |
| | | }); |
| | | |
| | | const eventContext = useGlobalEventContext(); |
| | | |
| | |
| | | }); |
| | | const { dictionaryDataList: certificateTypeList } = useDictionaryDataSelect({ |
| | | categoryCode: CategoryCode.CertificateType, |
| | | }); |
| | | |
| | | const settlementDateList = computed(() => { |
| | | if (form.settlementCycle === EnumSettlementCycle.Month) { |
| | | return EnumSettlementCycleDateMonthArray; |
| | | } |
| | | if (form.settlementCycle === EnumSettlementCycle.Week) { |
| | | return EnumSettlementCycleDateWeekArray; |
| | | } |
| | | return []; |
| | | }); |
| | | |
| | | const state = reactive({ |
| | |
| | | |
| | | const form = reactive({ |
| | | name: '', |
| | | billingMethod: '' as any as EnumBillingMethod, |
| | | serviceFee: 0, |
| | | settlementCycle: EnumSettlementCycle.Month, |
| | | billingMethod: EnumBillingMethod.Day, |
| | | serviceFee: null, |
| | | settlementCycle: EnumSettlementCycle.Day, |
| | | settlementDate: null as number, |
| | | benefits: [] as string[], |
| | | ageMinLimit: 0, |
| | | ageMaxLimit: 0, |
| | | ageMinLimit: null, |
| | | ageMaxLimit: null, |
| | | genderLimit: 0 as any as EnumUserGender, |
| | | credentialLimits: [] as string[], |
| | | time: [] as unknown as ModelValueType, |
| | | weMapInfo: {} as WeMapModel, |
| | | addressDetail: '', |
| | | verifyWorkHours: null as number, |
| | | timeoutServiceFee: null as number, |
| | | description: '', |
| | | checkReceiveMethod: '' as any as EnumTaskCheckReceiveMethod, |
| | | applyTime: [] as unknown as ModelValueType, |
| | | settlementAccess: '' as any as EnumEnterpriseWalletAccess, |
| | | }); |
| | | |
| | | const { isLoading } = useQuery({ |
| | |
| | | form.billingMethod = data.billingMethod; |
| | | form.serviceFee = data.serviceFee; |
| | | form.settlementCycle = data.settlementCycle; |
| | | form.settlementDate = data.settlementDate; |
| | | form.benefits = data.benefits?.map((x) => x.benefitCode) ?? []; |
| | | form.ageMinLimit = data.ageMinLimit; |
| | | form.ageMaxLimit = data.ageMaxLimit; |
| | |
| | | form.time = [ |
| | | format(data.beginTime, 'YYYY-MM-DD 00:00:00'), |
| | | format(data.endTime, 'YYYY-MM-DD 23:59:59'), |
| | | ]; |
| | | form.applyTime = [ |
| | | format(data.applyBeginTime, 'YYYY-MM-DD 00:00:00'), |
| | | format(data.applyEndTime, 'YYYY-MM-DD 23:59:59'), |
| | | ]; |
| | | form.weMapInfo = { |
| | | latitude: data.latitude, |
| | |
| | | addressName: data.addressName, |
| | | }; |
| | | form.addressDetail = data.addressDetail; |
| | | form.verifyWorkHours = data.verifyWorkHours; |
| | | form.timeoutServiceFee = data.timeoutServiceFee; |
| | | form.description = data.description; |
| | | form.checkReceiveMethod = data.checkReceiveMethod; |
| | | form.applyTime = [ |
| | | format(data.applyBeginTime, 'YYYY-MM-DD 00:00:00'), |
| | | format(data.applyEndTime, 'YYYY-MM-DD 23:59:59'), |
| | | ]; |
| | | form.settlementAccess = data.settlementAccess; |
| | | }, |
| | | enabled: isEdit, |
| | | }); |
| | | |
| | | function handleSettlementCycleChange() { |
| | | form.settlementDate = null as number; |
| | | } |
| | | |
| | | function handleBack() { |
| | | closeViewPush(route, { |
| | |
| | | } |
| | | async function submit() { |
| | | try { |
| | | console.log('form.weMapInfo: ', form.weMapInfo); |
| | | let params: API.SaveTaskInfoCommand = { |
| | | name: form.name, |
| | | billingMethod: form.billingMethod, |
| | | serviceFee: form.serviceFee, |
| | | settlementCycle: form.settlementCycle, |
| | | settlementDate: form.settlementDate ? form.settlementDate : 0, |
| | | benefits: form.benefits, |
| | | ageMinLimit: form.ageMinLimit, |
| | | ageMaxLimit: form.ageMaxLimit, |
| | |
| | | latitude: form.weMapInfo.latitude, |
| | | beginTime: dayjs(form.time[0]).format('YYYY-MM-DD 00:00:00'), |
| | | endTime: dayjs(form.time[1]).format('YYYY-MM-DD 23:59:59'), |
| | | applyBeginTime: dayjs(form.applyTime[0]).format('YYYY-MM-DD 00:00:00'), |
| | | applyEndTime: dayjs(form.applyTime[1]).format('YYYY-MM-DD 23:59:59'), |
| | | verifyWorkHours: form.verifyWorkHours, |
| | | timeoutServiceFee: form.timeoutServiceFee, |
| | | description: form.description, |
| | | checkReceiveMethod: form.checkReceiveMethod, |
| | | settlementAccess: form.settlementAccess, |
| | | }; |
| | | if (isEdit) { |
| | | params.id = id; |
| | |
| | | width: auto; |
| | | } |
| | | } |
| | | |
| | | .settlement-cycle-date-form-item { |
| | | color: inherit; |
| | | |
| | | .el-form-item__content { |
| | | flex-wrap: nowrap; |
| | | |
| | | .el-select { |
| | | margin: 0 20px; |
| | | width: auto; |
| | | min-width: 0; |
| | | flex: 1; |
| | | } |
| | | |
| | | .pro-from-item-read-content-wrapper { |
| | | width: auto; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </style> |