<template>
|
<LoadingLayout :loading="isLoading">
|
<AppContainer>
|
<PageFormLayout>
|
<ProForm :model="detail" ref="formRef" label-width="140px" is-read>
|
<ProFormCol>
|
<ProFormColItem :span="12">
|
<ProFormItemV2 label="任务名称:" prop="name">
|
<ProFormText v-model.trim="detail.enterpriseName" />
|
</ProFormItemV2>
|
</ProFormColItem>
|
</ProFormCol>
|
<ProFormCol>
|
<ProFormItemV2 label="服务费:" prop="salaryType">
|
<RadioWithExtra
|
v-model="detail.enterpriseName"
|
:value-enum="[
|
{ value: 1, text: '按月' },
|
{ value: 2, text: '按日' },
|
]"
|
enumLabelKey="text"
|
enum-value-key="value"
|
:showExtra="true"
|
>
|
<template #extra>
|
<ProFormInputNumber
|
:controls="false"
|
v-model="detail.enterpriseName"
|
:unit="detail.enterpriseName === '' ? '元/月' : '元/日'"
|
></ProFormInputNumber>
|
</template>
|
</RadioWithExtra>
|
</ProFormItemV2>
|
</ProFormCol>
|
<ProFormCol>
|
<ProFormColItem :span="12">
|
<ProFormItemV2 label="结算方式:" prop="salaryType">
|
<ProFormRadio
|
v-model="detail.enterpriseName"
|
:value-enum="[
|
{ label: '月结', value: 1 },
|
{ label: '日结', value: 2 },
|
]"
|
/>
|
</ProFormItemV2>
|
</ProFormColItem>
|
</ProFormCol>
|
<ProFormCol>
|
<ProFormColItem :span="12">
|
<ProFormItemV2 label="福利:" prop="salaryType">
|
<ProFormRadio v-model="detail.enterpriseName" :value-enum="dictionaryDataList" />
|
</ProFormItemV2>
|
</ProFormColItem>
|
</ProFormCol>
|
<ProFormCol>
|
<ProFormColItem :span="12">
|
<ProFormItemV2 label="年龄范围:" prop="ageRange">
|
<ProFormInputNumber v-model="detail.enterpriseName"></ProFormInputNumber>
|
</ProFormItemV2>
|
</ProFormColItem>
|
</ProFormCol>
|
<ProFormCol>
|
<ProFormColItem :span="12">
|
<ProFormItemV2 label="性别需求:" prop="salaryType">
|
<ProFormRadio
|
v-model="detail.enterpriseName"
|
:value-enum="[
|
{ label: '男', value: 1 },
|
{ label: '女', value: 2 },
|
]"
|
/>
|
</ProFormItemV2>
|
</ProFormColItem>
|
</ProFormCol>
|
<ProFormCol>
|
<ProFormColItem :span="12">
|
<ProFormItemV2 label="资格证书:" prop="salaryType">
|
<ProFormRadio v-model="detail.enterpriseName" :value-enum="dictionaryDataList" />
|
</ProFormItemV2>
|
</ProFormColItem>
|
</ProFormCol>
|
<ProFormCol>
|
<ProFormColItem :span="12">
|
<ProFormItemV2 label="任务地点:" prop="areaList">
|
<!-- <ProFromAddressSelectV2
|
v-model:areaList="detail.areaList"
|
areaListPlaceholder="请选择"
|
:layer="AreaType.Area"
|
/> -->
|
</ProFormItemV2>
|
</ProFormColItem>
|
</ProFormCol>
|
<ProFormCol>
|
<ProFormColItem :span="12">
|
<ProFormItemV2 label="任务时间:" prop="creationTime" mode="read">
|
<ProFormDatePicker
|
v-model="detail.enterpriseName"
|
type="daterange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
></ProFormDatePicker>
|
</ProFormItemV2>
|
</ProFormColItem>
|
</ProFormCol>
|
</ProForm>
|
<template #footer>
|
<el-button @click="handleBack">关闭</el-button>
|
</template>
|
</PageFormLayout>
|
</AppContainer>
|
</LoadingLayout>
|
</template>
|
|
<script setup lang="ts">
|
import {
|
LoadingLayout,
|
AppContainer,
|
PageFormLayout,
|
ProForm,
|
ProFormCol,
|
ProFormColItem,
|
ProFormItemV2,
|
ProFormText,
|
ProFormInputNumber,
|
ProFormRadio,
|
ProFormDatePicker,
|
} from '@bole-core/components';
|
import { useQuery } from '@tanstack/vue-query';
|
import { AreaType } from '@/constants';
|
import * as enterpriseServices from '@/services/api/enterprise';
|
|
defineOptions({
|
name: 'TaskDetailView',
|
});
|
|
const route = useRoute();
|
const id = route.params?.id as string;
|
const { closeViewPush } = useRouteView();
|
const { dictionaryDataList } = useDictionaryDataSelect({
|
categoryCode: computed(() => CategoryCode.Welfare),
|
});
|
|
const { data: detail, isLoading } = useQuery({
|
queryKey: ['enterpriseServices/getEnterprise', id],
|
queryFn: async () => {
|
return await enterpriseServices.getEnterprise(
|
{ id: id },
|
{
|
showLoading: false,
|
}
|
);
|
},
|
placeholderData: () => ({} as API.GetEnterpriseQueryResult),
|
enabled: computed(() => !!id),
|
});
|
|
function handleBack() {
|
closeViewPush(route, {
|
name: 'TaskManageList',
|
});
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
@use '@/style/common.scss' as *;
|
</style>
|
