From 1d472eb06970c85b0edfb58871956bc2c8d69916 Mon Sep 17 00:00:00 2001
From: zhengyiming <540361168@qq.com>
Date: 星期四, 25 十二月 2025 17:44:46 +0800
Subject: [PATCH] fix: 甲方小程序

---
 apps/housekeepingMiniApp/src/subpackages/sercice/serciceDetail/serciceDetail.vue |  232 +++++++++++++++++++++++++++++++++++++++++++--------------
 1 files changed, 175 insertions(+), 57 deletions(-)

diff --git a/apps/housekeepingMiniApp/src/subpackages/sercice/serciceDetail/serciceDetail.vue b/apps/housekeepingMiniApp/src/subpackages/sercice/serciceDetail/serciceDetail.vue
index f41598b..6911877 100644
--- a/apps/housekeepingMiniApp/src/subpackages/sercice/serciceDetail/serciceDetail.vue
+++ b/apps/housekeepingMiniApp/src/subpackages/sercice/serciceDetail/serciceDetail.vue
@@ -1,23 +1,67 @@
 <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>
-      <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="skuState.visible = true">棰勭害涓嬪崟</PageFooterBtn>
-        <PageFooterBtn type="primary" @click="pay">棰勭害涓嬪崟</PageFooterBtn>
-      </PageFooter>
+      <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">
+            <NoData />
+          </ProTabPane>
+        </ProTabs>
+      </InfiniteLoading>
       <Sku
         v-model:visible="skuState.visible"
         :sku="skuState.sku"
@@ -25,16 +69,46 @@
         @clickBtnOperate="clickBtnOperate"
       >
       </Sku>
+      <PageFooter>
+        <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 { toThousand, setOSSLink } from '@12333/utils';
-import { Sku, Goods, SkuItem } from '@12333/components';
+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',
@@ -43,23 +117,26 @@
 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: '1',
+        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: '1',
+      skuId: SkuUtils.DefaultSkuSpecId,
       price: toThousand(res.specs[0].price),
       imagePath: setOSSLink(res.files[0]),
       name: res.name,
@@ -74,45 +151,30 @@
 });
 
 // 搴曢儴鎿嶄綔鎸夐挳瑙﹀彂
-const clickBtnOperate = (op) => {
-  console.log('鐐瑰嚮浜嗘搷浣滄寜閽�', op);
+const clickBtnOperate = (op: { type: string; value: number }) => {
+  goAddStandardOrder(op.value);
 };
 
-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,
-    };
-    let res = await standardOrderServices.addStandardOrder(params);
-  } catch (error) {}
-}
+const openSkuDialog = () => {
+  skuState.visible = true;
+};
 
-async function pay() {
+const goAddStandardOrder = useAccessLogin((specNumber: number) => {
+  const spec = SkuUtils.getCurrentActiveSpec(skuState.sku);
+  Taro.navigateTo({
+    url: `${RouterPath.addStandardOrder}?specNumber=${specNumber}&specId=${spec.id}&id=${id}`,
+  });
+});
+
+async function handleAttention() {
   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) {}
 }
@@ -120,4 +182,60 @@
 
 <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;
+  }
+}
 </style>

--
Gitblit v1.10.0