From 9289f5fd30c4cf89845482cb5ec351962dce852a Mon Sep 17 00:00:00 2001
From: wupengfei <834520024@qq.com>
Date: 星期二, 30 十二月 2025 16:20:17 +0800
Subject: [PATCH] fix: bug
---
apps/housekeepingMiniApp/src/subpackages/sercice/serciceDetail/serciceDetail.vue | 273 ++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 222 insertions(+), 51 deletions(-)
diff --git a/apps/housekeepingMiniApp/src/subpackages/sercice/serciceDetail/serciceDetail.vue b/apps/housekeepingMiniApp/src/subpackages/sercice/serciceDetail/serciceDetail.vue
index fa0f6d3..f1a8641 100644
--- a/apps/housekeepingMiniApp/src/subpackages/sercice/serciceDetail/serciceDetail.vue
+++ b/apps/housekeepingMiniApp/src/subpackages/sercice/serciceDetail/serciceDetail.vue
@@ -1,31 +1,122 @@
<template>
- <PageLayoutWithBg class="mineHire-page-wrapper" :title="'鏈嶅姟鍚�'" :need-auth="false">
+ <PageLayout class="serciceDetail-page-wrapper" :title="detail?.name ?? ''" :need-auth="false">
<LoadingLayout :loading="isLoading" :error="isError" :loadError="refetch">
- <ContentScrollView style="background-color: transparent"> serciceDetail </ContentScrollView>
+ <InfiniteLoading
+ commonMode
+ :refetch="refetch"
+ :isLoading="isLoading"
+ :isError="isError"
+ :showMoreText="false"
+ scrollViewClassName="common-infinite-scroll-list-no-padding"
+ >
+ <div class="serciceDetail-top-view">
+ <SquareView>
+ <nut-swiper
+ :auto-play="3000"
+ v-if="detail?.files?.length > 0"
+ class="serciceDetail-swiper"
+ >
+ <nut-swiper-item
+ v-for="(item, index) in detail.files"
+ :key="item"
+ class="serciceDetail-swiper-item"
+ >
+ <img
+ :src="setOSSLink(item)"
+ class="serciceDetail-swiper-item-img"
+ draggable="false"
+ />
+ </nut-swiper-item>
+ </nut-swiper>
+ </SquareView>
+ <div class="serciceDetail-top-view-title-wrapper">
+ <div class="serciceDetail-price-wrapper">
+ <div class="serciceDetail-price">{{ toThousand(minPrice) }}</div>
+ <div class="serciceDetail-price-unit">鍏冭捣</div>
+ </div>
+ <div class="serciceDetail-top-view-title">{{ detail?.name ?? '' }}</div>
+ </div>
+ </div>
+
+ <List class="serciceDetail-content-list">
+ <ListItem title="瑙勬牸" @click="openSkuDialog()">
+ <template #extra>
+ <div>鍏眥{ detail.specs?.length }}绫�</div>
+ </template>
+ </ListItem>
+ </List>
+ <ProTabs
+ v-model="tab"
+ name="serciceDetail-content-tab"
+ class="serciceDetail-content-tabs"
+ flexTitle
+ >
+ <ProTabPane :title="`鏈嶅姟璇︽儏`" pane-key="1">
+ <RichEditorContent :content="detail?.description ?? ''"></RichEditorContent>
+ </ProTabPane>
+ <ProTabPane :title="`瀹㈡埛璇勪环`" pane-key="2">
+ <NoData />
+ </ProTabPane>
+ <ProTabPane :title="`鐩稿叧鎺ㄨ崘`" pane-key="3">
+ <div class="serciceDetail-recommend-list">
+ <StandardServiceCard
+ v-for="item in []"
+ :key="item.id"
+ v-bind="item"
+ style="min-width: 0"
+ />
+ </div>
+ <NoData />
+ </ProTabPane>
+ </ProTabs>
+ </InfiniteLoading>
+ <Sku
+ v-model:visible="skuState.visible"
+ :sku="skuState.sku"
+ v-model:goods="skuState.goods"
+ @clickBtnOperate="clickBtnOperate"
+ >
+ </Sku>
<PageFooter>
- <!-- <PageFooterAction
- :icon="IconShare"
- text="鍒嗕韩"
- :isFlex="false"
- openType="share"
- ></PageFooterAction>
- <PageFooterAction
- :icon="userResumeInfo.isCollected ? IconAttentionActive : IconAttention"
- text="鏀惰棌"
- :isFlex="false"
- @click="handleAttention"
- ></PageFooterAction> -->
- <PageFooterBtn type="primary" @click="pay">棰勭害涓嬪崟</PageFooterBtn>
- <PageFooterBtn type="primary" @click="pay">棰勭害涓嬪崟</PageFooterBtn>
+ <PageFooterAction
+ :icon="detail.isCollection ? IconAttentionActive : IconAttention"
+ text="鏀惰棌"
+ :isFlex="false"
+ @click="handleAttention"
+ ></PageFooterAction>
+ <PageFooterAction
+ :icon="IconShare"
+ text="瀹㈡湇"
+ :isFlex="false"
+ :open-type="'contact'"
+ ></PageFooterAction>
+ <PageFooterBtn type="primary" @click="openSkuDialog()">棰勭害涓嬪崟</PageFooterBtn>
</PageFooter>
</LoadingLayout>
- </PageLayoutWithBg>
+ </PageLayout>
</template>
<script setup lang="ts">
import { useStandardServiceDetail } from '@12333/hooks';
import Taro from '@tarojs/taro';
import * as standardOrderServices from '@12333/services/apiV2/standardOrder';
+import * as standardServiceServices from '@12333/services/apiV2/standardService';
+import { toThousand, setOSSLink, Message } from '@12333/utils';
+import {
+ Sku,
+ Goods,
+ SkuItem,
+ SkuUtils,
+ List,
+ ListItem,
+ ProTabs,
+ ProTabPane,
+ SquareView,
+} from '@12333/components';
+import { useAccessLogin } from '@/hooks';
+import IconShare from '@/assets/flexJob/icon-share.png';
+import IconAttention from '@/assets/flexJob/icon-attention-lg.png';
+import IconAttentionActive from '@/assets/flexJob/icon-attention-lg-active.png';
defineOptions({
name: 'serciceDetail',
@@ -34,51 +125,131 @@
const router = Taro.useRouter();
const id = router.params?.id ?? '';
-const { isLoading, isError, detail, refetch } = useStandardServiceDetail({
+const tab = ref('1');
+
+const { isLoading, isError, detail, refetch, minPrice } = useStandardServiceDetail({
id,
+ onSuccess(res) {
+ skuState.sku = [
+ {
+ id: SkuUtils.DefaultSkuSpecId,
+ name: '瑙勬牸',
+ list: res.specs.map((item, index) => ({
+ id: item.id,
+ name: item.name,
+ price: item.price,
+ active: index === 0,
+ disable: false,
+ })),
+ },
+ ];
+ skuState.goods = {
+ skuId: SkuUtils.DefaultSkuSpecId,
+ price: res.specs[0].price,
+ imagePath: setOSSLink(res.files[0]),
+ name: res.name,
+ };
+ },
});
-async function addStandardOrder() {
- try {
- let params: API.AddStandardOrderCommand = {
- serviceId: '3fa85f64-5717-4562-b3fc-2c963f66afa6',
- serviceName: 'string',
- specId: '3fa85f64-5717-4562-b3fc-2c963f66afa6',
- specName: 'string',
- specPrice: 0,
- specNumber: 0,
- addressId: '3fa85f64-5717-4562-b3fc-2c963f66afa6',
- beginTime: '2025-12-24T06:44:24.840Z',
- endTime: '2025-12-24T06:44:24.840Z',
- supplierEnterpriseId: '3fa85f64-5717-4562-b3fc-2c963f66afa6',
- enterpriseEmployeeIds: ['3fa85f64-5717-4562-b3fc-2c963f66afa6'],
- remark: 'string',
- payAccess: 1,
- payAmount: 0,
- };
- let res = await standardOrderServices.addStandardOrder(params);
- } catch (error) {}
-}
+const skuState = reactive({
+ visible: false,
+ sku: [] as SkuItem[],
+ goods: {} as Goods,
+});
-async function pay() {
+// 搴曢儴鎿嶄綔鎸夐挳瑙﹀彂
+const clickBtnOperate = (op: { type: string; value: number }) => {
+ goAddStandardOrder(op.value);
+};
+
+const openSkuDialog = () => {
+ skuState.visible = true;
+};
+
+const goAddStandardOrder = useAccessLogin((specNumber: number) => {
+ const spec = SkuUtils.getCurrentActiveSpec(skuState.sku);
+ Taro.navigateTo({
+ url: `${RouterPath.addStandardOrder}?specNumber=${specNumber}&specId=${spec.id}&id=${id}`,
+ });
+});
+
+const handleAttention = useAccessLogin(async () => {
try {
- let params: API.PayStandardOrderCommand = {
- id: '9e919af2-3d33-4eac-f6dc-08de429676b3',
+ let params: API.CollectionStandardServiceCommand = {
+ ids: [id],
+ isCollect: !detail.value.isCollection,
};
- let res = await standardOrderServices.payStandardOrder(params);
+ let res = await standardServiceServices.collectionStandardService(params);
if (res) {
- Taro.requestPayment({
- timeStamp: res.timestamp,
- nonceStr: res.nonceStr,
- package: res.package,
- signType: res.signType as any,
- paySign: res.paySign,
- });
+ refetch({ type: 'inactive' });
}
} catch (error) {}
-}
+});
</script>
<style lang="scss">
@import '@/styles/common.scss';
+
+.serciceDetail-page-wrapper {
+ .serciceDetail-swiper {
+ width: 100%;
+ height: 100%;
+
+ .serciceDetail-swiper-item-img {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ /* 鍙�夛細璋冩暣鍥剧墖瑁佸壀鐨勫榻愭柟寮忥紙榛樿灞呬腑锛� */
+ object-position: center center;
+ }
+ }
+
+ .serciceDetail-top-view {
+ margin-bottom: 20px;
+ background-color: #fff;
+
+ .serciceDetail-top-view-title-wrapper {
+ padding: 24px boleGetCssVar('size', 'body-padding-h') 32px;
+
+ .serciceDetail-price-wrapper {
+ display: flex;
+ align-items: flex-end;
+ margin-bottom: 24px;
+
+ .serciceDetail-price {
+ font-weight: 600;
+ font-size: 48px;
+ color: #ff6414;
+ line-height: 52px;
+ margin-right: 8px;
+ }
+
+ .serciceDetail-price-unit {
+ font-weight: 400;
+ font-size: 28px;
+ color: #ff6414;
+ line-height: 40px;
+ }
+ }
+
+ .serciceDetail-top-view-title {
+ font-weight: 500;
+ font-size: 32px;
+ color: boleGetCssVar('text-color', 'primary');
+ line-height: 44px;
+ }
+ }
+ }
+
+ .serciceDetail-content-list {
+ margin-bottom: 20px;
+ }
+
+ .serciceDetail-recommend-list {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ grid-gap: 20px;
+ }
+}
</style>
--
Gitblit v1.10.0