Merge branch 'master' of http://gitlab.platform.xinhuaapp.com/pengjiani/groupPurchase-miniapp

src/api/shop.js

@@ -39,3 +39,19 @@ export function likeOrDislike(data) {
     data,
   });
 }
+// 周边推荐
+export function peripheryRecom(data) {
+  return request({
+    url: `/sgyrdd/category/peripheryRecomm`,
+    method: 'GET',
+    data,
+  });
+}
+// 商家列表分页-搜索列表
+export function sgyrddShopPage(data) {
+  return request({
+    url: `/sgyrdd/shop/page`,
+    method: 'GET',
+    data,
+  });
+}

src/assets/iconfont/iconfont.css

 @font-face {
   font-family: "iconfont"; /* Project id 4633414 */
-  src: url('//at.alicdn.com/t/c/font_4633414_rdq1553pta.woff2?t=1722413035003') format('woff2'),
-       url('//at.alicdn.com/t/c/font_4633414_rdq1553pta.woff?t=1722413035003') format('woff'),
-       url('//at.alicdn.com/t/c/font_4633414_rdq1553pta.ttf?t=1722413035003') format('truetype');
+  src: url('//at.alicdn.com/t/c/font_4633414_3k0ybwfc2l1.woff2?t=1722483682262') format('woff2'),
+       url('//at.alicdn.com/t/c/font_4633414_3k0ybwfc2l1.woff?t=1722483682262') format('woff'),
+       url('//at.alicdn.com/t/c/font_4633414_3k0ybwfc2l1.ttf?t=1722483682262') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-dianzan:before {
+  content: "\e602";
+}
+
+.icon-dianzan_kuai:before {
+  content: "\ec8c";
+}
+
 .icon-xiai:before {
   content: "\e601";
 }

src/pages.json

@@ -82,6 +82,13 @@
 				"navigationBarTitleText": "支付成功"
 			}
 		}
+		,
+		{
+			"path": "pages/order/remark",
+			"style": {
+				"navigationBarTitleText": "美食评论"
+			}
+		}
 	],
 	"globalStyle": {
 		"navigationStyle": "custom"

src/pages/order/components/Header/index.vue

@@ -37,6 +37,7 @@ const handleBack = () => {
   position: fixed;
   z-index: 999;
   width: 375 * 2rpx;
+  top: 0;
 
   .headbox {
     position: relative;

src/pages/order/remark.vue

+<template>
+  <view class="container">
+    <Header title="评论"></Header>
+    <view class="content">
+      <view class="remake">
+        <wd-row>
+          <wd-col :span="24" custom-class="text">
+            <h5>老凯里酸汤鱼（花果园M区店）</h5>
+          </wd-col>
+        </wd-row>
+        <wd-row>
+          <wd-col :span="16">
+            <span>评分：</span>
+            <wd-rate v-model="value" />
+          </wd-col>
+          <wd-col :span="8"></wd-col>
+        </wd-row>
+      </view>
+
+      <wd-button type="error" block>发布</wd-button>
+    </view>
+  </view>
+</template>
+<script setup>
+import Header from './components/Header/index.vue';
+</script>
+<style lang="scss" scoped>
+.container {
+  width: 100%;
+  height: auto;
+  background: #f4f4f4;
+  margin-top: 88rpx;
+  min-height: calc(100vh - 88rpx);
+  display: flex;
+  flex-direction: column;
+}
+
+.content {
+  margin: 0 20rpx;
+
+  .remake {
+    width: auto;
+    height: auto;
+    background: #ffffff;
+    border-radius: 16rpx;
+    margin-top: 25rpx;
+    margin-bottom: 172rpx;
+    padding: 20rpx;
+    .text h5 {
+      font-weight: 400;
+      font-size: 32rpx;
+      color: #333333;
+      line-height: 32rpx;
+      text-align: left;
+    }
+  }
+}
+</style>

src/pages/packageDetails/packageDetails.vue

@@ -4,13 +4,14 @@
     <view class="swiper">
       <wd-swiper
         customClass="swiper-custom"
-        :list="swiperList"
+        :list="prodInfo.imgs"
         autoplay
         height="512rpx"
         customStyle="border-radius: 0rpx;"
         :current="current"
         @click="handleClick"
         @change="onChange"
+        :indicator="{ type: 'dots-bar' }"
       ></wd-swiper>
     </view>
     <!-- 轮播-end -->
@@ -19,12 +20,12 @@
       <view class="package-details-num">
         <view class="num">
           <text class="icon">￥</text>
-          <text class="amount-of-money">88</text>
+          <text class="amount-of-money">{{ prodInfo.price }}</text>
         </view>
-        <view class="num2">￥128</view>
-        <view class="num3">共省￥30</view>
+        <view class="num2">￥{{ prodInfo.oriPrice }}</view>
+        <view class="num3">共省￥{{ (prodInfo.oriPrice - prodInfo.price).toFixed(2) }}</view>
       </view>
-      <view class="title">双人田蛙尝鲜餐(30元代金券一张，除酒水 饮料外全场通用，仅能使用一张)</view>
+      <view class="title">{{ prodInfo.prodName }}</view>
       <view class="info-card">
         <view class="yh">
           <text class="yh-name">优惠：</text>
@@ -134,7 +135,10 @@ const swiperList = ref([
   'https://registry.npmmirror.com/wot-design-uni-assets/*/files/capybara.jpg',
   'https://registry.npmmirror.com/wot-design-uni-assets/*/files/panda.jpg',
 ]);
+const prodInfo = ref({});
 const myProdId = ref('');
+const current = ref(0);
+const imgUrl = import.meta.env.VITE_APP_IMG_URL;
 onLoad((options) => {
   const { prodId } = options;
   myProdId.value = prodId;
@@ -148,9 +152,37 @@ function getProdDetailFn(prodId) {
   getProdDetail(prodId).then((res) => {
     if (res.code === 0) {
       console.log('res', res);
+      res.data.data.prod.imgs = res.data.data.prod.imgs.split(',');
+      res.data.data.prod.imgs.push(res.data.data.prod.pic);
+      res.data.data.prod.imgs = res.data.data.prod.imgs
+        .map((item) => {
+          if (item !== '') {
+            item = imgUrl + item;
+          }
+          return item;
+        })
+        .filter((item) => {
+          return item !== '';
+        });
+      prodInfo.value = res.data.data.prod;
     }
   });
 }
+const handleClick = (e) => {
+  const { index } = e;
+  const imgSrc = prodInfo.value.imgs[index];
+  previewImage(imgSrc);
+};
+const onChange = (e) => {};
+/**
+ * 图片预览
+ */
+function previewImage(imgSrc) {
+  xma.previewImage({
+    current: imgSrc, // 当前显示图片的链接，不填则默认为 urls 的第一张
+    urls: [imgSrc], // 需要预览的图片链接列表
+  });
+}
 </script>
 
 <style lang="scss" scoped>
@@ -169,6 +201,9 @@ page {
     :deep(.wd-swiper__track) {
       border-radius: 0;
     }
+    :deep(.wd-swiper-nav--bottom) {
+      bottom: 100rpx;
+    }
   }
   .package-details-card {
     width: 710rpx;
@@ -208,7 +243,7 @@ page {
         border-radius: 14rpx 14rpx 14rpx 0rpx;
         font-size: 10 * 2rpx;
         margin-left: 10rpx;
-        padding: 2rpx;
+        padding: 4rpx;
         color: #ff494e;
       }
     }

src/pages/shop/shop.vue

@@ -221,25 +221,30 @@
         <text class="title">周边推荐</text>
         <view class="tag-list">
           <view
-            @click="changeActie(item.id)"
-            :class="activeId == item.id ? 'active-tag' : ''"
+            @click="changeActie(item.categoryId)"
+            :class="activeId == item.categoryId ? 'active-tag' : ''"
             class="tag"
-            v-for="item in tagList"
-            :key="item.id"
+            v-for="item in recommendedTypesOfPeripherals"
+            :key="item.categoryId"
           >
-            {{ item.name }}
+            {{ item.categoryName }}
           </view>
         </view>
         <view class="goods-list-tg">
           <scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120">
-            <view :id="i" class="scroll-view-item_H" v-for="i in 10" :key="i">
+            <view
+              :id="i"
+              class="scroll-view-item_H"
+              v-for="(item, index) in recommendedListOfPeripherals"
+              :key="index"
+            >
               <view class="item-box">
-                <image mode="aspectFill" src="@/static/shop/ice.png"></image>
-                <text class="goods-name multi-line">健康生态调味品</text>
+                <image mode="aspectFill" :src="imgUrl + item.shopLogo"></image>
+                <text class="goods-name multi-line">{{ item.shopName }}</text>
                 <view class="goods-pf-rs">
-                  <text class="goods-fs">4.3</text>
+                  <text class="goods-fs">{{ item.grade }}</text>
                   <text class="goods-fs-2">分</text>
-                  <text class="goods-rs">36/人</text>
+                  <!-- <text class="goods-rs">36/人</text> -->
                 </view>
                 <view class="tag-list">
                   <view class="tag" v-for="item in tagList2" :key="item.id">
@@ -267,8 +272,10 @@ import {
   groupBuyList,
   getEvaluationPage,
   couponShopList,
+  peripheryRecom,
+  sgyrddShopPage,
 } from '@/api/shop';
-import { addImgUrlPrefixToImages, getDistance, addImgUrlPrefix } from '@/utils/common';
+import { debounce, addImgUrlPrefixToImages, getDistance, addImgUrlPrefix } from '@/utils/common';
 const imgUrl = import.meta.env.VITE_APP_IMG_URL;
 const current = ref(0);
 const old = reactive({ scrollTop: 0 });
@@ -301,12 +308,17 @@ const tagList = ref([
   { name: '景点', id: 3 },
   { name: '生活服务', id: 4 },
 ]);
+// 周边推荐类型列表
+const recommendedTypesOfPeripherals = ref([]);
 // 商户id
 const shopId = ref('1626126617850544129');
 const tagList2 = ref([{ name: '免费停车', id: 1 }]);
-
+// 周边推荐-商家列表
+const recommendedListOfPeripherals = ref([]);
 onLoad((options) => {
-  getStoreInformationFn('1626126617850544129');
+  getStoreInformationFn('1626126617850544129').then(() => {
+    peripheryRecomFn();
+  });
   groupBuyListFn('1626126617850544129');
   couponShopListFn('1626126617850544129');
   getEvaluationPageFn();
@@ -326,6 +338,39 @@ function scroll(e) {
   old.scrollTop = e.detail.scrollTop;
 }
 
+/**
+ * 周边推荐类型列表
+ */
+function peripheryRecomFn() {
+  // 维度
+  const lat = currentLatitudeAndLongitude.value.latitude;
+  // 经度
+  const lon = currentLatitudeAndLongitude.value.longitude;
+  peripheryRecom({ lat, lon, distance: 200 }).then((res) => {
+    if (res.code === 0) {
+      recommendedTypesOfPeripherals.value = res.data;
+      const id = recommendedTypesOfPeripherals.value[0].categoryId;
+      activeId.value = id;
+      sgyrddShopPageFn(id);
+    }
+  });
+}
+function sgyrddShopPageFn(categoryIds) {
+  const params = {
+    current: 1,
+    size: 15,
+    lat: currentLatitudeAndLongitude.value.latitude,
+    lon: currentLatitudeAndLongitude.value.longitude,
+    categoryIds,
+    distance: 200,
+  };
+  sgyrddShopPage(params).then((res) => {
+    if (res.code === 0) {
+      recommendedListOfPeripherals.value = res.data.content;
+      console.log('res', res);
+    }
+  });
+}
 function getLocationFn() {
   xma.getLocation({
     type: 'wgs84',
@@ -343,6 +388,7 @@ function getLocationFn() {
 
 // 获取店铺信息
 const getStoreInformationFn = (id) => {
+  return new Promise((resolve, reject) => {
     getStoreInformation(id).then((res) => {
       if (res.code === 0) {
         shopInfo.value = res.data.shop;
@@ -350,8 +396,10 @@ const getStoreInformationFn = (id) => {
         shopInfo.value.tagList = res.data.shop.labels.split(',');
         currentLatitudeAndLongitude.value.latitude = res.data.shop.location.lat;
         currentLatitudeAndLongitude.value.longitude = res.data.shop.location.lon;
+        resolve();
       }
     });
+  });
 };
 /**
  * 获取团购列表
@@ -373,7 +421,6 @@ const groupBuyListFn = (shopId) => {
 const couponShopListFn = (shopId) => {
   couponShopList(shopId).then((res) => {
     if (res.code === 0) {
-      console.log('res', res);
       merchantCoupons.value = res.data[0];
     }
   });
@@ -496,17 +543,23 @@ const viewAll = () => {
     }
   });
 };
+
+// 创建一个防抖后的函数
+const debouncedLog = debounce((id) => {
+  sgyrddShopPageFn(id);
+}, 800);
 function changeActie(id) {
   activeId.value = id;
+  debouncedLog(id);
 }
-onReachBottom(() => {
-  console.log('到底了');
-  if (isLoadReachBottom.value === true) return;
-  isLoadReachBottom.value = true;
-  getEvaluationPageFn().then(() => {
-    isLoadReachBottom.value = false;
-  });
-});
+// onReachBottom(() => {
+//   console.log('到底了');
+//   if (isLoadReachBottom.value === true) return;
+//   isLoadReachBottom.value = true;
+//   getEvaluationPageFn().then(() => {
+//     isLoadReachBottom.value = false;
+//   });
+// });
 /**
  * 拨打商家电话
  * @param {*} phoneNumber
@@ -1098,6 +1151,7 @@ page {
           padding: 6rpx 20rpx;
           margin-right: 20rpx;
           font-size: 11 * 2rpx;
+          margin-top: 20rpx;
         }
         .active-tag {
           border-radius: 10 * 2rpx;

src/utils/common.js

 // 根据经纬度计算距离，参数分别为第一点的纬度、经度；第二点的纬度、经度
-export function getDistance(lat1, lng1, lat2, lng2) {
+/**
+ *
+ * @param {*} lat1 第一个纬度
+ * @param {*} lng1 第一个经度
+ * @param {*} lat2 第二个纬度
+ * @param {*} lng2 第二个经度
+ * @param {*} type 0 中文 1 英文
+ * @returns
+ */
+export function getDistance(lat1, lng1, lat2, lng2, type = 1) {
   const R = 6371; // 地球半径，单位为千米
   const dLat = deg2rad(lat2 - lat1);
   const dLng = deg2rad(lng2 - lng1);
@@ -8,12 +17,13 @@ export function getDistance(lat1, lng1, lat2, lng2) {
     Math.cos(deg2rad(lat1)) * Math.cos(deg2rad(lat2)) * Math.sin(dLng / 2) * Math.sin(dLng / 2);
   const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
   const distance = R * c;
-
-  if (distance >= 1) {
-    return distance.toFixed(2) + '千米';
-  } else {
-    return (distance * 1000).toFixed(2) + '米';
-  }
+  return distance >= 1
+    ? type === 0
+      ? distance.toFixed(2) + '千米'
+      : distance.toFixed(2) + 'km'
+    : type === 1
+      ? (distance * 1000).toFixed(2) + '米'
+      : (distance * 1000).toFixed(2) + 'm';
 }
 
 // 将角度转换为弧度
@@ -52,3 +62,14 @@ export function addImgUrlPrefixToImages(imgUrl, imagePaths) {
     return [];
   }
 }
+
+// 防抖
+export function debounce(func, wait) {
+  let timeout;
+  return function (...args) {
+    clearTimeout(timeout);
+    timeout = setTimeout(() => {
+      func.apply(this, args);
+    }, wait);
+  };
+}