| | |
| | | <script setup lang="ts"> |
| | | import { useQuery } from '@tanstack/vue-query'; |
| | | import Taro from '@tarojs/taro'; |
| | | import * as orderServices from '@12333/services/api/Order'; |
| | | import * as flexWorkerServices from '@12333/services/api/FlexWorker'; |
| | | import IconLocaltion from '@/assets/flexJob/icon-localtion.png'; |
| | | import { TaskPrice, TaskDetailWelfareItem } from '@12333/components'; |
| | | |
| | |
| | | // const props = withDefaults(defineProps<Props>(), {}); |
| | | const router = Taro.useRouter(); |
| | | |
| | | const taskId = router.params?.id ?? ''; |
| | | const taskId = router.params?.id ?? 'c4cfe028-23e7-0be8-ee56-3a11e3743b9d'; |
| | | |
| | | const { |
| | | isLoading, |
| | |
| | | data: detail, |
| | | refetch, |
| | | } = useQuery({ |
| | | queryKey: ['orderServices/getOrdeForDetail', taskId], |
| | | queryKey: ['flexWorkerServices/getOrdeForDetail', taskId], |
| | | queryFn: async () => { |
| | | return await orderServices.getOrdeForDetail( |
| | | return await flexWorkerServices.getOrdeForDetail( |
| | | { id: taskId }, |
| | | { |
| | | showLoading: false, |
| | |
| | | |
| | | <style lang="scss"> |
| | | @import '@/styles/common.scss'; |
| | | |
| | | .jobApplicationDetail-page-wrapper { |
| | | .taskDetail-time { |
| | | font-size: 24px; |
| | | color: boleGetCssVar('text-color', 'regular'); |
| | | line-height: 36px; |
| | | margin-bottom: 16px; |
| | | } |
| | | |
| | | .task-card-welfare-wrapper { |
| | | display: flex; |
| | | align-items: flex-start; |
| | | padding-bottom: 48px; |
| | | border-bottom: 1px solid #d9d9d9; |
| | | margin-bottom: 12px; |
| | | |
| | | .task-card-welfare-list { |
| | | flex: 1; |
| | | display: flex; |
| | | min-width: 0; |
| | | flex-wrap: wrap; |
| | | min-height: 40px; |
| | | row-gap: 6px; |
| | | column-gap: 18px; |
| | | margin-right: 10px; |
| | | |
| | | .task-card-welfare-list-item { |
| | | font-size: 24px; |
| | | color: #ff7d00; |
| | | line-height: 36px; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .taskDetail-address-wrapper { |
| | | padding: 28px 32px 14px; |
| | | background: #f9fbff; |
| | | border-radius: 8px; |
| | | |
| | | .taskDetail-address-title-wrapper { |
| | | display: flex; |
| | | align-items: center; |
| | | margin-bottom: 22px; |
| | | |
| | | .taskDetail-address-title-icon { |
| | | width: 40px; |
| | | height: 40px; |
| | | margin-right: 8px; |
| | | } |
| | | |
| | | .taskDetail-address-title { |
| | | flex: 1; |
| | | min-width: 0; |
| | | @include ellipsis; |
| | | font-size: 28px; |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | line-height: 42px; |
| | | } |
| | | } |
| | | |
| | | .taskDetail-address-info-wrapper { |
| | | display: flex; |
| | | align-items: center; |
| | | |
| | | .taskDetail-address-info { |
| | | flex: 1; |
| | | min-width: 0; |
| | | @include ellipsis; |
| | | font-weight: 400; |
| | | font-size: 24px; |
| | | color: boleGetCssVar('text-color', 'regular'); |
| | | line-height: 36px; |
| | | } |
| | | |
| | | .taskDetail-address-info-icon { |
| | | color: boleGetCssVar('text-color', 'secondary'); |
| | | margin-left: 10px; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .taskDetail-welfare-list { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | row-gap: 24px; |
| | | } |
| | | } |
| | | </style> |