| | |
| | | <template> |
| | | <LoadingLayout :loading="isLoading" :error="isError" :loadError="refetch"> |
| | | <ContentScrollView style="background-color: transparent"> |
| | | <Cell :title="detail?.name ?? ''" titleSize="large"> |
| | | <div class="taskDetail-time"> |
| | | {{ dayjs(detail?.beginTime).format('YYYY年MM月DD日') }} 至 |
| | | {{ dayjs(detail?.endTime).format('YYYY年MM月DD日') }} |
| | | </div> |
| | | <div class="task-card-welfare-wrapper"> |
| | | <div class="task-card-welfare-list"> |
| | | <div class="task-card-welfare-list-item"> |
| | | {{ EnumSettlementCycleText[detail.settlementCycle] }} |
| | | </div> |
| | | <!-- <div class="task-card-welfare-list-item"> |
| | | {{ TaskUtils.getGenderText(detail.genderLimit) }} |
| | | </div> --> |
| | | </div> |
| | | <TaskPrice |
| | | v-if="detail.releaseStatus !== EnumTaskReleaseStatus.Stopped" |
| | | :value="toThousand(detail.serviceFee ?? 0)" |
| | | :unit="BillingMethodEnumUnit[detail.billingMethod]" |
| | | /> |
| | | </div> |
| | | <div class="taskDetail-address-wrapper" @click="goMap"> |
| | | <div class="taskDetail-address-title-wrapper"> |
| | | <img :src="IconLocaltion" class="taskDetail-address-title-icon" /> |
| | | <div class="taskDetail-address-title">{{ detail?.addressName ?? '' }}</div> |
| | | </div> |
| | | <div class="taskDetail-address-info-wrapper"> |
| | | <div class="taskDetail-address-info">{{ detail?.addressDetail ?? '' }}</div> |
| | | <RectRight :size="8" class="taskDetail-address-info-icon" /> |
| | | </div> |
| | | </div> |
| | | </Cell> |
| | | <Cell :show-title="false"> |
| | | <CellChunk title="福利信息"> |
| | | <div class="taskDetail-welfare-list"> |
| | | <TaskDetailWelfareItem |
| | | v-for="benefit in detail.benefits" |
| | | :key="benefit.benefitCode" |
| | | :icon="setOSSLink(benefit.benefitField2)" |
| | | :text="benefit.benefitContent" |
| | | /> |
| | | </div> |
| | | </CellChunk> |
| | | <CellChunk title="报名条件"> |
| | | <div class="taskDetail-limit-list"> |
| | | <div class="taskDetail-limit-list-item"> |
| | | <div class="taskDetail-limit-list-item-label">年龄:</div> |
| | | <div class="taskDetail-limit-list-item-text"> |
| | | {{ detail.ageMinLimit ?? 0 }}-{{ detail.ageMaxLimit ?? 0 }}岁 |
| | | </div> |
| | | </div> |
| | | <div class="taskDetail-limit-list-item"> |
| | | <div class="taskDetail-limit-list-item-label">性别:</div> |
| | | <div class="taskDetail-limit-list-item-text"> |
| | | {{ TaskUtils.getGenderText(detail.genderLimit) }} |
| | | </div> |
| | | </div> |
| | | <div class="taskDetail-limit-list-item"> |
| | | <template v-if="detail?.credentialLimits?.length > 0"> |
| | | <div class="taskDetail-limit-list-item-label">资格证书:</div> |
| | | <div class="taskDetail-limit-list-item-text"> |
| | | {{ TaskUtils.getCredentialLimit(detail?.credentialLimits) }} |
| | | </div> |
| | | </template> |
| | | </div> |
| | | </div> |
| | | </CellChunk> |
| | | </Cell> |
| | | <Cell title="任务描述"> |
| | | <div class="safe-cell-content">{{ detail?.description ?? '' }}</div> |
| | | </Cell> |
| | | <TaskDetailView :detail="detail"></TaskDetailView> |
| | | </ContentScrollView> |
| | | </LoadingLayout> |
| | | </template> |
| | |
| | | import Taro from '@tarojs/taro'; |
| | | import { useQuery } from '@tanstack/vue-query'; |
| | | import * as taskServices from '@12333/services/apiV2/task'; |
| | | import { TaskPrice, TaskDetailWelfareItem } from '@12333/components'; |
| | | import { RectRight } from '@nutui/icons-vue-taro'; |
| | | import IconLocaltion from '@/assets/task/icon-localtion.png'; |
| | | import { TaskDetailView } from '@12333/components'; |
| | | import './taskDetail.scss'; |
| | | import dayjs from 'dayjs'; |
| | | import { TaskUtils, toThousand, setOSSLink, Message } from '@12333/utils'; |
| | | import { |
| | | EnumSettlementCycleText, |
| | | BillingMethodEnumUnit, |
| | | EnumTaskReleaseStatus, |
| | | } from '@12333/constants'; |
| | | |
| | | defineOptions({ |
| | | name: 'InnerPage', |
| | |
| | | // if (data.isExistTradeChatRecord) setTrue(); |
| | | }, |
| | | }); |
| | | |
| | | function goMap() { |
| | | Taro.openLocation({ |
| | | latitude: detail.value?.latitude, |
| | | longitude: detail.value?.longitude, |
| | | scale: 18, |
| | | }); |
| | | } |
| | | |
| | | Taro.useDidShow(() => { |
| | | refetch(); |