|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <div class="task-card-wrapper"> | 
|---|
|  |  |  | <div class="task-card-title-wrapper"> | 
|---|
|  |  |  | <div class="task-card-title">客房服务员</div> | 
|---|
|  |  |  | <div class="task-card-title">{{ name }}</div> | 
|---|
|  |  |  | <slot name="title-right"> | 
|---|
|  |  |  | <TaskPrice :value="212" /> | 
|---|
|  |  |  | <TaskPrice | 
|---|
|  |  |  | v-if="releaseStatus !== EnumTaskReleaseStatus.Stopped" | 
|---|
|  |  |  | :value="toThousand(serviceFee ?? 0)" | 
|---|
|  |  |  | :unit="BillingMethodEnumUnit[billingMethod]" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </slot> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <slot> | 
|---|
|  |  |  | <div class="task-card-welfare-list"> | 
|---|
|  |  |  | <div class="task-card-welfare-list-item">日结</div> | 
|---|
|  |  |  | <div class="task-card-welfare-list-item">男女不限</div> | 
|---|
|  |  |  | <div class="task-card-welfare-list-item">包三餐</div> | 
|---|
|  |  |  | <div class="task-card-welfare-list-item"> | 
|---|
|  |  |  | {{ EnumSettlementCycleText[settlementCycle] }} | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="task-card-welfare-list-item">{{ TaskUtils.getGenderText(genderLimit) }}</div> | 
|---|
|  |  |  | <div | 
|---|
|  |  |  | class="task-card-welfare-list-item" | 
|---|
|  |  |  | v-if="benefits?.length > 0" | 
|---|
|  |  |  | v-for="item in benefits" | 
|---|
|  |  |  | :key="item.benefitCode" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | {{ item.benefitContent }} | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="task-card-time">上班时间:07:00-15:30</div> | 
|---|
|  |  |  | <div class="task-card-time"> | 
|---|
|  |  |  | {{ dayjs(beginTime).format('YYYY年MM月D日') }}至{{ dayjs(endTime).format('YYYY年MM月D日') }} | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </slot> | 
|---|
|  |  |  | <div class="task-card-footer"> | 
|---|
|  |  |  | <div class="task-card-left"> | 
|---|
|  |  |  | <div class="task-card-footer-tag">H</div> | 
|---|
|  |  |  | <div class="task-card-footer-address">宁波雷迪森酒店</div> | 
|---|
|  |  |  | <div class="task-card-footer-address">{{ addressName }}</div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="task-card-actions" v-if="showActions"> | 
|---|
|  |  |  | <slot name="actions"> | 
|---|
|  |  |  | <nut-button type="primary" @click.stop="handleSign">报名</nut-button> | 
|---|
|  |  |  | <nut-button | 
|---|
|  |  |  | v-if="releaseStatus === EnumTaskReleaseStatus.InProcess" | 
|---|
|  |  |  | type="primary" | 
|---|
|  |  |  | @click="emit('apply', props.id)" | 
|---|
|  |  |  | :disabled="!!hireStatus" | 
|---|
|  |  |  | >报名</nut-button | 
|---|
|  |  |  | > | 
|---|
|  |  |  | </slot> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script setup lang="ts"> | 
|---|
|  |  |  | import { | 
|---|
|  |  |  | EnumBillingMethod, | 
|---|
|  |  |  | EnumSettlementCycle, | 
|---|
|  |  |  | EnumTaskCheckReceiveStatus, | 
|---|
|  |  |  | EnumTaskRecommendStatus, | 
|---|
|  |  |  | EnumTaskReleaseStatus, | 
|---|
|  |  |  | EnumTaskSettlementStatus, | 
|---|
|  |  |  | EnumTaskStatus, | 
|---|
|  |  |  | EnumUserGender, | 
|---|
|  |  |  | EnumBillingMethodText, | 
|---|
|  |  |  | EnumUserGenderText, | 
|---|
|  |  |  | EnumSettlementCycleText, | 
|---|
|  |  |  | BillingMethodEnumUnit, | 
|---|
|  |  |  | EnumTaskUserHireStatus, | 
|---|
|  |  |  | } from '@12333/constants'; | 
|---|
|  |  |  | import TaskPrice from './TaskPrice.vue'; | 
|---|
|  |  |  | import { CommonTaskCardProps } from './card'; | 
|---|
|  |  |  | import dayjs from 'dayjs'; | 
|---|
|  |  |  | import { TaskUtils, toThousand } from '@12333/utils'; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | defineOptions({ | 
|---|
|  |  |  | name: 'TaskCard', | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | type Props = CommonTaskCardProps & { | 
|---|
|  |  |  | showActions?: boolean; | 
|---|
|  |  |  | /** Id */ | 
|---|
|  |  |  | id?: string; | 
|---|
|  |  |  | /** 任务名称 */ | 
|---|
|  |  |  | name: string; | 
|---|
|  |  |  | /** 任务单号 */ | 
|---|
|  |  |  | code?: string; | 
|---|
|  |  |  | billingMethod?: EnumBillingMethod; | 
|---|
|  |  |  | /** 服务费 */ | 
|---|
|  |  |  | serviceFee?: number; | 
|---|
|  |  |  | settlementCycle?: EnumSettlementCycle; | 
|---|
|  |  |  | /** 福利 */ | 
|---|
|  |  |  | benefits?: API.GetTaskInfoQueryResultBenefit[]; | 
|---|
|  |  |  | genderLimit?: EnumUserGender; | 
|---|
|  |  |  | /** 资格证书类型 */ | 
|---|
|  |  |  | credentialLimits?: API.GetTaskInfoQueryResultCredentialLimit[]; | 
|---|
|  |  |  | /** 任务地点所属省份编号 */ | 
|---|
|  |  |  | provinceCode?: string; | 
|---|
|  |  |  | /** 任务地点所属省份 */ | 
|---|
|  |  |  | provinceContent?: string; | 
|---|
|  |  |  | /** 任务地点所属城市编号 */ | 
|---|
|  |  |  | cityCode?: string; | 
|---|
|  |  |  | /** 任务地点所属城市 */ | 
|---|
|  |  |  | cityContent?: string; | 
|---|
|  |  |  | /** 任务地点名称 */ | 
|---|
|  |  |  | addressName?: string; | 
|---|
|  |  |  | /** 任务地点详细地址 */ | 
|---|
|  |  |  | addressDetail?: string; | 
|---|
|  |  |  | /** 经度 */ | 
|---|
|  |  |  | longitude?: number; | 
|---|
|  |  |  | /** 纬度 */ | 
|---|
|  |  |  | latitude?: number; | 
|---|
|  |  |  | /** 报名人数 */ | 
|---|
|  |  |  | userCount?: number; | 
|---|
|  |  |  | status?: EnumTaskStatus; | 
|---|
|  |  |  | /** 任务开始时间 */ | 
|---|
|  |  |  | beginTime?: string; | 
|---|
|  |  |  | /** 任务结束时间 */ | 
|---|
|  |  |  | endTime?: string; | 
|---|
|  |  |  | releaseStatus?: EnumTaskReleaseStatus; | 
|---|
|  |  |  | checkReceiveStatus?: EnumTaskCheckReceiveStatus; | 
|---|
|  |  |  | settlementStatus?: EnumTaskSettlementStatus; | 
|---|
|  |  |  | recommendStatus?: EnumTaskRecommendStatus; | 
|---|
|  |  |  | /** 创建时间 */ | 
|---|
|  |  |  | createdTime?: string; | 
|---|
|  |  |  | hireStatus?: EnumTaskUserHireStatus; | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const props = withDefaults(defineProps<Props>(), { | 
|---|
|  |  |  | showActions: true, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function handleSign() {} | 
|---|
|  |  |  | const emit = defineEmits<{ | 
|---|
|  |  |  | (e: 'apply', id: string): void; | 
|---|
|  |  |  | }>(); | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style lang="scss"> | 
|---|