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

src/Components/index/FoodDetails.vue

 <template>
-  <view @tap="toShop(item.shopId)" class="card" v-for="(item, index) in cardData" :key="index">
+  <view @tap="toShop(item.shopId)" class="card" v-for="item in cardData" :key="item.shopId">
     <image class="img" :src="item.shopLogo" mode="aspectFill" />
     <view class="right">
       <text class="text">{{ item.shopName }}</text>

src/pages/index/foodClassification.vue

 <template>
-  <div class="container">
+  <div class="container" style="padding-bottom: 10rpx">
     <view class="bg-img"></view>
     <view class="top">
       <!-- 搜索 -->
@@ -9,7 +9,10 @@
       <!-- 类别选择 -->
       <scroll-view class="scroll-x" scroll-x="true" @scroll="scroll">
         <view class="foodCard" v-for="(item, index) in topDiscountedProducts" :key="index">
-          <image class="test5" src="../../static/index/test5.png" mode="widthFix" />
+          <view class="test5">
+            <image class="img1" :src="imgUrl + item.pic" />
+            <image class="img2" src="../../static/index/icon-tab.png" />
+          </view>
           <view class="content">
             <text class="title">{{ item.prodName }}</text>
             <view class="labelBox">
@@ -26,8 +29,8 @@
               <text class="text2">￥{{ item.oriPrice }}</text>
               <view class="btn">
                 <!-- <text class="text3">仅剩余5张</text> -->
-                <text class="text3"></text>
-                <image class="qiang" src="../../static/index/qiang.png" mode="widthFix" />
+                <text class="text3">立即抢购</text>
+                <!-- <image class="qiang" src="../../static/index/qiang.png" mode="widthFix" /> -->
               </view>
             </view>
           </view>
@@ -65,7 +68,7 @@
         </view>
       </view>
       <view class="bootom-bottom">
-        <view
+        <!-- <view
           @tap="choice(index)"
           class="item"
           :class="{ light: active === index }"
@@ -73,21 +76,26 @@
           :key="index"
         >
           {{ item }}
-        </view>
+        </view> -->
       </view>
       <!-- 美食类别 -->
       <Classification v-show="rotate" :category="categoryData" @foodCategory="foodCategory" />
       <!-- 附近筛选 -->
-      <Position v-show="rotate2" />
+      <Position v-show="rotate2" @nearby="nearby" @popular="popular" @region="region" />
       <!-- 排序筛选 -->
       <Sort v-show="rotate3" />
     </view>
     <FoodDetails :cardData="cardData" />
+    <view
+      style="width: 100%; text-align: center; font-size: 24rpx; margin-top: 10rpx"
+      v-if="params.isEnd"
+    >
+      没有更多啦~
+    </view>
   </div>
 </template>
 
 <script setup>
-import {} from 'vue';
 import FoodDetails from '../../components/index/FoodDetails.vue';
 import Search from '../../components/index/Search.vue';
 import Classification from '../../components/index/Classification.vue';
@@ -95,6 +103,8 @@ import Position from '../../components/index/Position.vue';
 import Sort from '../../components/index/Sort.vue';
 import { getByParentId, merchantList, prodSpecial } from '../../api/index';
 
+const isLoadReachBottom = ref(null);
+const imgUrl = import.meta.env.VITE_APP_IMG_URL;
 const business = reactive(['优选商家', '超值半价', '今日可订', '经典单人']);
 const active = ref(null);
 const categoryData = ref([]);
@@ -103,32 +113,92 @@ const rotate2 = ref(false);
 const rotate3 = ref(false);
 const categoryId = ref(null);
 const topDiscountedProducts = ref([]);
+const params = ref({
+  current: 1,
+  size: 15,
+  // lon,
+  // lat,
+  lon: 106.68650025025502,
+  lat: 26.567192352601154,
+  isEnd: false,
+});
 const pics = ref(null);
-const paramsId = {
-  parentId: null,
-};
 onLoad((option) => {
   const { parentId, pic } = option;
   categoryId.value = parentId;
   pics.value = pic;
   query(parentId);
   prodSpecialFn();
-  getByParentIdData();
 });
 onMounted(() => {
+  getLocationFn().then((res) => {
+    const { lat, lon } = res;
+    getMerchantList(lat, lon);
+  });
+});
+// distance参数来源
+const nearby = (distance) => {
+  console.log('distance', distance);
+  if (distance === 0) {
+    delete params.value.distance;
+  } else {
+    params.value.distance = distance;
+  }
+  refresh().then(() => {
     getMerchantList();
+  });
+};
+// communityName参数来源
+const popular = (communityName) => {
+  params.value.communityName = communityName;
+  if (params.value.area) {
+    delete params.value.area;
+  }
+  refresh().then(() => {
+    getMerchantList();
+  });
+};
+// area参数来源
+const region = (area) => {
+  console.log('area', area);
+  params.value.area = area;
+  if (params.value.communityName) {
+    delete params.value.communityName;
+  }
+  refresh().then(() => {
+    getMerchantList();
+  });
+};
+onReachBottom(() => {
+  console.log('到底了');
+  if (isLoadReachBottom.value === true) return;
+  isLoadReachBottom.value = true;
+  getMerchantList().then(() => {
+    isLoadReachBottom.value = false;
+  });
 });
-// 根据父级分类id查询子分类列表
-const getByParentIdData = () => {
-  getByParentId(paramsId).then((res) => {
-    categoryData.value = res.data;
+// categoryId参数来源
+const foodCategory = (categoryId) => {
+  params.value.categoryIds = [categoryId];
+  refresh().then(() => {
+    getMerchantList();
   });
 };
-
+/**
+ * @description: 刷新
+ */
+function refresh() {
+  return new Promise((resolve, reject) => {
+    cardData.value = [];
+    params.value.current = 1;
+    params.value.isEnd = false;
+    resolve();
+  });
+}
 // 根据父级分类id查询子分类列表
 const query = (parentId) => {
   getByParentId(parentId).then((res) => {
-    console.log('打印res', res);
+    categoryData.value = res.data;
   });
 };
 const prodSpecialFn = () => {
@@ -142,25 +212,10 @@ const prodSpecialFn = () => {
     topDiscountedProducts.value = res.data.data;
   });
 };
-// onLoad(option) {
-//     //option为object类型，会序列化上个页面传递的参数
-//     console.log(option.id); //打印出上个页面传递的参数。
-//     console.log(option.name); //打印出上个页面传递的参数。
-//   },
 const choice = (index) => {
   active.value = index;
 };
-const cardData = ref([
-  {
-    text: '测试',
-  },
-  {
-    text: '测试',
-  },
-  {
-    text: '测试',
-  },
-]);
+const cardData = ref([]);
 
 const locationFiltering = (index) => {
   switch (index) {
@@ -183,14 +238,19 @@ const locationFiltering = (index) => {
 };
 // 商家列表分页-搜索列表
 const getMerchantList = () => {
-  const data = {
-    current: 1,
-    size: 10,
-    lon: 106.68650025025502,
-    lat: 26.567192352601154,
-  };
-  merchantList(data).then((res) => {
-    console.log('商家列表', res);
+  if (params.value.isEnd === true)
+    return new Promise((resolve) => {
+      resolve();
+    });
+  xma.showLoading({
+    title: '加载中...',
+    mask: false,
+  });
+  return merchantList(params.value).then((res) => {
+    if (res.data.content.length < params.value.size) {
+      params.value.isEnd = true;
+    }
+    params.value.current += 1;
     res.data.content.forEach((item) => {
       item.shopLogo = import.meta.env.VITE_APP_IMG_URL + item.shopLogo;
       if (item.evaluationVos.length > 0) {
@@ -201,9 +261,30 @@ const getMerchantList = () => {
         item.labels = item.labels.split(',');
       }
     });
-    cardData.value = res.data.content;
+    return new Promise((resolve) => {
+      cardData.value = cardData.value.concat(res.data.content);
+      xma.hideLoading();
+      setTimeout(() => {
+        resolve();
+      }, 500);
+    });
   });
 };
+function getLocationFn() {
+  return new Promise((resolve, reject) => {
+    xma.getLocation({
+      type: 'wgs84',
+      isHighAccuracy: true,
+      success: function (res) {
+        // 经纬度
+        resolve({ lat: res.latitude, lon: res.longitude });
+      },
+      fail: function (err) {
+        return err;
+      },
+    });
+  });
+}
 </script>
 
 <style lang="scss" scoped>
@@ -244,6 +325,22 @@ page {
         overflow: hidden;
         .test5 {
           width: 100%;
+          height: 168 * 2rpx;
+          position: relative;
+          .img1 {
+            width: 100%;
+            height: 168 * 2rpx;
+            position: absolute;
+            top: 0;
+            left: 0;
+          }
+          .img2 {
+            width: 100%;
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            height: 56rpx;
+          }
         }
         .content {
           display: flex;
@@ -307,7 +404,8 @@ page {
               border-radius: 10rpx;
               background: #fcdbdb;
               box-sizing: border-box;
-              margin-left: 66rpx;
+              margin-left: auto;
+              margin-right: 20rpx;
               .text3 {
                 font-size: 20rpx;
                 color: #fa5151;

src/pages/shop/confirmOrder.vue

@@ -186,11 +186,15 @@ onShow(() => {
         case '1':
           xma.showToast({
             title: '支付失败',
-            icon: 'success',
+            icon: 'error',
             duration: 2000,
           });
           break;
-        case '2' || '3':
+        case '2':
+          xma.redirectTo({
+            url: `/pages/shop/paymentSuccessful?outTradeNos=${outTradeNos.value}`,
+          });
+        case '3':
           xma.redirectTo({
             url: `/pages/shop/paymentSuccessful?outTradeNos=${outTradeNos.value}`,
           });