商品详情

src/api/packageDetail.js

@@ -7,7 +7,22 @@ export function getProdDetail(data) {
     method: 'GET',
   });
 }
-
+// 商品详情评论数量和好评率
+export function getEvalNumber(data) {
+  return request({
+    url: `/sgyrdd/evaluation/getEvalNumber`,
+    method: 'GET',
+    data,
+  });
+}
+// 加入购物车
+export function addOrder(data) {
+  return request({
+    url: `/sgyrdd/sgyBasket/add`,
+    method: 'POST',
+    data,
+  });
+}
 // 套餐详情
 export function getCollect(data) {
   return request({

src/pages.json

@@ -10,7 +10,7 @@
 			"path": "pages/index/loading",
 			"style": {
 				"navigationBarTitleText": "加载",
-				"navigationStyle":"custom",
+				"navigationStyle":"custom"
 			}
 		},
 		{

src/pages/assistingAgriculture/detail/detail.vue

@@ -13,51 +13,42 @@
     </view>
     <!--    图片-->
     <view class="nav">
-      <img
-        class="main-img"
-        src="/static/assistingAgriculture/detail/img2.png"
-        style="width: 750rpx; height: 668rpx"
-      />
-      <view class="pre-icon">
-        <img
-          class="left-icon"
-          src="/static/assistingAgriculture/detail/img4.png"
-          style="width: 248rpx; height: 100rpx; position: relative"
-        />
-        <img
-          class="right-icon"
-          src="/static/assistingAgriculture/detail/img3.png"
-          style="width: 546rpx; height: 62rpx"
-        />
-      </view>
-      <view class="pre-text">
-        <text class="left-text">预售</text>
-        <text class="right-text">预计9月15日发货</text>
-      </view>
+      <wd-swiper
+        :list="dataDetails.prod.imgs"
+        autoplay
+        :indicator="{ type: 'fraction' }"
+        indicatorPosition="bottom-right"
+        @click="handleClick"
+        @change="onChange"
+        height="512rpx"
+      ></wd-swiper>
     </view>
     <!--详情-->
     <view class="detail">
-      <view class="detail-title">筑农散养虫子土鸡(未下蛋小母鸡)1.5kg</view>
+      <view class="detail-title">{{ dataDetails.prod.prodName }}</view>
       <view class="detail-int">
-        这是商品简介这是商品简介这是商品简介这是商品简介这是商品 简介这是商品简介这是商品简介
+        {{ dataDetails.prodPresale.memo }}
       </view>
-      <view>
+      <!-- <view>
         <img class="share-img" src="/static/assistingAgriculture/detail/share.png" />
         <text class="share-text" @click="share">分享</text>
-      </view>
+      </view> -->
     </view>
     <view class="evaluate">
       <view class="evaluate-num">
-        <text class="env">评价（0）</text>
-        <text class="num">好评率（100%）</text>
+        <text class="env">评价（{{ commentData.count }}）</text>
+        <text class="num">好评率（{{ commentData.high }} %）</text>
         <wd-icon name="arrow-right" size="32rpx" style="margin-top: 2rpx"></wd-icon>
       </view>
     </view>
     <!--    详情图-->
     <view class="detail-info">
       <text class="info-title">详情</text>
-      <img class="info-img" src="/static/assistingAgriculture/detail/detail-img.png" />
-      <img class="info-img" src="/static/assistingAgriculture/detail/detail-img.png" />
+      <!-- <img class="info-img" src="/static/assistingAgriculture/detail/detail-img.png" />
+      <img class="info-img" src="/static/assistingAgriculture/detail/detail-img.png" /> -->
+      <view class="content">
+        <rich-text class="desc" :nodes="dataDetails.prod.content"></rich-text>
+      </view>
     </view>
     <!--    底部-->
     <view class="detail-bottom">
@@ -70,13 +61,13 @@
             />
             <view class="sort-text">店铺</view>
           </view>
-          <view class="borderClass">
+          <!-- <view class="borderClass">
             <img
               src="/static/assistingAgriculture/detail/img8.png"
               style="width: 40rpx; height: 40rpx"
             />
             <view class="sort-text">客服</view>
-          </view>
+          </view> -->
           <view class="borderClass" @tap="toCart">
             <wd-badge modelValue="4">
               <img
@@ -95,7 +86,9 @@
         <!--          </view>-->
         <!--        </view>-->
         <view class="btn">
-          <wd-button type="warning" size="small" style="margin-right: 10rpx">加入购物车</wd-button>
+          <wd-button @tap="addOrderFn" type="warning" size="small" style="margin-right: 10rpx">
+            加入购物车
+          </wd-button>
           <wd-button type="error" size="small" @tap="toSettle">立即购买</wd-button>
         </view>
       </view>
@@ -107,19 +100,86 @@
 import Search from '../../../components/assistingAgriculture/index/Search.vue';
 import { ref } from 'vue';
 import { onShow } from '@dcloudio/uni-app';
-
+import {
+  getProdDetail,
+  getEvalNumber,
+  addOrder,
+  getCollect,
+  getCouponShopList,
+  receiveCoupon,
+} from '@/api/packageDetail';
+const imgUrl = import.meta.env.VITE_APP_IMG_URL;
 // 图片
 const swiperList = ref([
   '../../static/assistingAgriculture/detail/img2.png',
   '../../static/assistingAgriculture/detail/img2.png',
   '../../static/assistingAgriculture/detail/img2.png',
 ]);
+const swiperList2 = ref([
+  'https://registry.npmmirror.com/wot-design-uni-assets/*/files/redpanda.jpg',
+  'https://registry.npmmirror.com/wot-design-uni-assets/*/files/capybara.jpg',
+  'https://registry.npmmirror.com/wot-design-uni-assets/*/files/panda.jpg',
+  'https://registry.npmmirror.com/wot-design-uni-assets/*/files/moon.jpg',
+  'https://registry.npmmirror.com/wot-design-uni-assets/*/files/meng.jpg',
+]);
 // 底部
 const storeList = ref([
   { img: '/static/assistingAgriculture/detail/img7.png', text: '店铺' },
   { img: '/static/assistingAgriculture/detail/img8.png', text: '客服' },
   { img: '/static/assistingAgriculture/detail/img6.png', text: '购物车' },
 ]);
+let prodId;
+const dataDetails = ref({});
+const commentData = ref({});
+onLoad((options) => {
+  prodId = '43834';
+  getProdDetailFn();
+  getEvalNumberFn();
+});
+function handleClick(e) {
+  console.log(e);
+}
+function onChange(e) {
+  console.log(e);
+}
+// 获取商品详情
+const getProdDetailFn = () => {
+  getProdDetail(prodId).then((res) => {
+    res.data.data.prod.imgs = res.data.data.prod.imgs
+      .split(',')
+      .map((item) => {
+        if (item !== '') {
+          item = imgUrl + item;
+        }
+        return item;
+      })
+      .filter((item) => {
+        return item !== '';
+      });
+    dataDetails.value = res.data.data;
+    console.log('打印', dataDetails.value);
+  });
+};
+// 获取商品评价数量
+const getEvalNumberFn = () => {
+  getEvalNumber({ prodId }).then((res) => {
+    console.log('评价数量', res);
+    commentData.value = res.data;
+  });
+};
+// 加入购物车
+const addOrderFn = () => {
+  const orderParams = {
+    shopId: dataDetails.value.prod.prodId,
+    prodId: dataDetails.value.prodParameters.prodId,
+    skuId: dataDetails.value.skus[0].skuId,
+    shopType: 3,
+    basketCount: 1,
+  };
+  addOrder(orderParams).then((res) => {
+    console.log('加入购物车', res);
+  });
+};
 // 进入页面回到顶部
 onShow(() => {
   uni.pageScrollTo({
@@ -322,6 +382,13 @@ page {
   z-index: 9;
   top: -8rpx;
   padding-bottom: 120rpx;
+  .content {
+    .desc {
+      img {
+        width: 100%;
+      }
+    }
+  }
 }
 .info-title {
   width: 64rpx;

src/pages/index/loading.vue

@@ -10,8 +10,8 @@ import { getTokenUser } from '../../api/index';
 import { getToken } from '../../utils/auth';
 
 onMounted(async () => {
-  // await signIn();
-  if (!getToken()) await signIn2();
+  await signIn();
+  // if (!getToken()) await signIn2();
   xma.reLaunch({ url: '/pages/index/index' });
 });
 

src/pages/order/remark.vue

@@ -9,8 +9,13 @@
             <view class="item01" prop="merchantServices">
               <text class="label">评分</text>
               <!-- 评分 -->
-              <wd-rate v-model="formdata.merchantServices" active-color="#ff0000" size="50rpx" space="10px"
-                @change="handlemerchant" />
+              <wd-rate
+                v-model="formdata.merchantServices"
+                active-color="#ff0000"
+                size="50rpx"
+                space="10px"
+                @change="handlemerchant"
+              />
             </view>
             <view class="item02">
               <text>{{ merList[formdata.merchantServices] }}</text>
@@ -18,20 +23,34 @@
           </view>
           <!-- 内容描述 -->
           <view prop="evaluation">
-            <wd-textarea v-model="formdata.evaluation" placeholder="亲，分享您的看法，给其他人一个参考哦！" />
+            <wd-textarea
+              v-model="formdata.evaluation"
+              placeholder="亲，分享您的看法，给其他人一个参考哦！"
+            />
           </view>
           <wd-cell title-width="0px"></wd-cell>
           <text class="textarea">上传图片/视频</text>
           <!-- 图片上传 -->
           <view class="wdUpload" prop="images">
-            <wd-upload multiple :action="action" @change="handleFile" :file-list="formdata.images"
-              :before-remove="beforeRemove" :header="headers"></wd-upload>
+            <wd-upload
+              multiple
+              :action="action"
+              @change="handleFile"
+              :file-list="formdata.images"
+              :before-remove="beforeRemove"
+              :header="headers"
+            ></wd-upload>
           </view>
 
           <!-- 匿名评价 -->
           <wd-cell title="匿名评价" prop="isAnonymous" class="itemSwichval">
-            <wd-switch size="48rpx" active-color="#EC1B1B" v-model="formdata.isAnonymous" active-value="1"
-              inactive-value="0" />
+            <wd-switch
+              size="48rpx"
+              active-color="#EC1B1B"
+              v-model="formdata.isAnonymous"
+              active-value="1"
+              inactive-value="0"
+            />
           </wd-cell>
         </wd-cell-group>
       </wd-form>