贵大小程序更新

App.vue

@@ -3,6 +3,8 @@
 		getGoodsTypeObj,
 		getUserDetail
 	} from '@/api/common.js';
+
+	import {getGdShopInfo} from '@/api/study.js';
 	// 腾讯地图
 	// var QQMapWX = require('@/libs/qqmap-wx-jssdk.min.js');
 	// var qqmapsdk = new QQMapWX({key:'KX5BZ-B64RC-RO62W-AMWAZ-VVTC3-YAFXF'});
@@ -21,6 +23,13 @@
 					uni.setStorageSync('goodsTypeObj',JSON.stringify(res.content))
 				}
 			})
+			// 获取贵大文创ID
+			getGdShopInfo().then(res=>{
+				console.log('res',res);
+				if(res.state == "Success"){
+					uni.setStorageSync('gdShopId',res.content.shopId)
+				}
+			})
 		},
 		onHide: function() {
 			console.log('App Hide')

api/shop.js

@@ -14,4 +14,12 @@ export function shopDetail(data) {
 		url: '/zswl-cloud-shop/shopInfo/detail',
 		data
 	})
+}
+
+// goodsInfo/appSearch
+export function appSearch(data) {
+	return request({
+		url: '/zswl-cloud-shop/goodsInfo/appSearch',
+		data
+	})
 }

api/study.js

@@ -8,6 +8,16 @@ export function getMenu(data) {
 	})
 }
 
+
+// 搜索栏目
+export function searchMenu(data) {
+	return request({
+		url: '/zswl-cloud-shop/column/search',
+		data
+	})
+}
+
+
 // 获取二级栏目页
 export function getPage(data) {
 	return request({
@@ -146,3 +156,11 @@ export function studyGoods(data) {
 		data
 	})
 }
+
+// 获取贵大文创商城ID
+export function getGdShopInfo(data){
+	return request({
+		url: '/zswl-cloud-shop/shopInfo/getGdShopInfo',
+		data
+	})
+}

components/zs-search/index.vue

@@ -1,8 +1,8 @@
 <template>
 	<view class="zs-search" :class="[fixed?'fixed':'']">
-		<input class="input" :style="{lineHeight:height+'rpx',height:height+'rpx',borderRadius:height / 2+'px',color:color,background:bgColor}" :type="type" v-model="value" :placeholder="placeholder" />
-		<image class="icon" src="../../static/search.png" mode=""></image>
-		<button class="btn" type="default" @click="search">搜索</button>
+		<input :class="[showPrefix?'input':'fullwidInput']" :style="{lineHeight:height+'rpx',height:height+'rpx',borderRadius:height / 2+'px',color:color,background:bgColor}" :type="type" v-model="value" :placeholder="placeholder" />
+		<image v-if="showPrefix" class="icon" src="../../static/search.png" mode=""></image>
+		<button v-if="showBtn" class="btn" type="default" @click="search">搜索</button>
 	</view>
 </template>
 
@@ -34,6 +34,14 @@
 			placeholder:{
 				type: String,
 				default: '搜索'
+			},
+			showBtn:{
+				type: Boolean,
+				default: true
+			},
+			showPrefix:{
+				type: Boolean,
+				default: true
 			}
 		},
 		data() {
@@ -69,6 +77,13 @@
 			padding-left: 100rpx;
 			padding-right: 130rpx;
 		}
+		.fullwidInput{
+			// width: 100vw;
+			box-sizing: border-box;
+			font-size: 22rpx;
+			padding-left: 20rpx;
+			padding-right: 130rpx;
+		}
 		.icon {
 			width: 37rpx;
 			height: 37rpx;

components/zs-tab-bar/index.vue

@@ -0,0 +1,118 @@
+<template>
+  <view>
+    <u-tabbar
+      :border="false"
+      :value="value"
+      activeColor="#A10808"
+      :placeholder="false"
+      :customStyle="barStyle"
+      class="tabBar"
+      @click="clickBar"
+      @change="changBar"
+    >
+      <u-tabbar-item text="首页">
+        <image
+          class="u-page__item__slot-icon"
+          slot="active-icon"
+          src="@/static/icon/taskBar/home_active.png"
+        >
+        </image>
+        <image
+          class="u-page__item__slot-icon"
+          slot="inactive-icon"
+          src="@/static/icon/taskBar/home.png"
+        ></image>
+      </u-tabbar-item>
+      <u-tabbar-item text="活动">
+        <image
+          class="u-page__item__slot-icon"
+          slot="active-icon"
+          src="@/static/icon/taskBar/act_active.png"
+        >
+        </image>
+        <image
+          class="u-page__item__slot-icon"
+          slot="inactive-icon"
+          src="@/static/icon/taskBar/act.png"
+        ></image>
+      </u-tabbar-item>
+      <u-tabbar-item text="生活">
+        <image
+          class="u-page__item__slot-icon"
+          slot="active-icon"
+          src="@/static/icon/taskBar/life_active.png"
+        >
+        </image>
+        <image
+          class="u-page__item__slot-icon"
+          slot="inactive-icon"
+          src="@/static/icon/taskBar/life.png"
+        ></image>
+      </u-tabbar-item>
+      <u-tabbar-item text="我的">
+        <image
+          class="u-page__item__slot-icon"
+          slot="active-icon"
+          src="@/static/icon/taskBar/my_active.png"
+        >
+        </image>
+        <image
+          class="u-page__item__slot-icon"
+          slot="inactive-icon"
+          src="@/static/icon/taskBar/my.png"
+        ></image>
+      </u-tabbar-item>
+    </u-tabbar>
+  </view>
+</template>
+
+<script>
+export default {
+  props:{
+	value:{
+		type:Number,
+		default:0
+	}
+  },
+  data() {
+    return {
+      barStyle: {
+        borderRadius: "32rpx 32rpx 0 0",
+        boxShadow: "0rpx -6rpx 12rpx 2rpx rgba(0,0,0,0.09)",
+      },
+      list: [
+        {
+          text: "首页",
+          pagePath: "pages/index/index",
+        },
+        {
+          text: "活动",
+          pagePath: "pages/activity/index",
+        },
+        {
+          text: "生活",
+          pagePath: "pages/life/index",
+        },
+        {
+          text: "我的",
+          pagePath: "pages/my/index",
+        },
+      ],
+    };
+  },
+  methods: {
+    changBar(e) {
+      uni.switchTab({
+        url:"/"+ this.list[e].pagePath,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.u-page__item__slot-icon {
+  width: 20px;
+  height: 20px;
+}
+</style>

main.js

@@ -1,6 +1,7 @@
 import App from './App'
 
 import {myRequest} from './utils/request.js'
+import {getNavHight} from './utils/tool.js'
 // #ifndef VUE3
 import Vue from 'vue'
 import './uni.promisify.adaptor'
@@ -8,6 +9,7 @@ Vue.config.productionTip = false
 App.mpType = 'app'
 //挂载，让全局可以使用
 Vue.prototype.$req = myRequest
+Vue.prototype.$navHight = getNavHight;
 import uView from '@/uni_modules/uview-ui'
 Vue.use(uView)
 uni.$u.config.unit = 'rpx'

pages.json

@@ -37,6 +37,33 @@
 				"enablePullDownRefresh": false
 			}
 		},
+
+		{
+			"path": "pages/activity/index",
+			"style": {
+				"navigationBarTitleText": "活动",
+				"navigationStyle": "custom",
+				"enablePullDownRefresh": false
+			}
+		},	
+		{
+			"path": "pages/activity/detail",
+			"style": {
+				"navigationBarTitleText": "活动详情",
+				"enablePullDownRefresh": false
+			}
+		},
+
+		{
+			"path": "pages/life/index",
+			"style": {
+				"navigationBarTitleText": "生活",
+				"enablePullDownRefresh": false,
+				"navigationStyle": "custom"
+				
+			}
+		},
+		
 		{
 			"path": "pages/my/index",
 			"style": {
@@ -425,23 +452,19 @@
 		"color": "#AAAAAA",
 		"selectedColor": "#0084CF",
 		"backgroundColor": "#fff",
-		"list": [{
-				"iconPath": "static/home_off.png",
-				"selectedIconPath": "static/home_on.png",
-				"text": "首页",
+		"custom": true,
+		"list": [
+			{
 				"pagePath": "pages/index/index"
 			},
 			{
-				"iconPath": "static/service_off.png",
-				"selectedIconPath": "static/service_on.png",
-				"text": "客服",
-				"pagePath": "pages/service/index"
+				"pagePath": "pages/activity/index"
 			},
 			{
-				"iconPath": "static/my_off.png",
-				"selectedIconPath": "static/my_on.png",
-				"text": "我的",
 				"pagePath": "pages/my/index"
+			},
+			{
+				"pagePath": "pages/life/index"
 			}
 		]
 

pages/activity/detail.vue

@@ -0,0 +1,94 @@
+<template>
+  <view class="content">
+    <view class="title">贵州大学 新生欢迎活动隆重举行！</view>
+    <view class="msg-type">
+      <view> 活动消息 2024-03-18 13:30 </view>
+      <view v-if="inOpter"> 阅读4886 </view>
+    </view>
+    <view class="msg-cover">
+      <image
+        style="height: 300rpx"
+        src="https://jbm.dev.zonelife.cn/img/15519395654249311.jpg"
+      ></image>
+    </view>
+    <view class="main-content">
+      <rich-text :nodes="content"> </rich-text>
+    </view>
+    <view v-if="inOpter" class="btn-box"> 报名 </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      inOpter: false,
+      content: `
+      ✨ 活动亮点 ✨<br/><br/>            
+      ➡️ 多元文化交流<br/><br/>
+      ➡️ 舞蹈、音乐、戏剧等精彩表演<br/><br/>
+      ➡️ 手工艺展示，感受创意之美<br/><br/>
+      ➡️ 丰富多彩的文化角落，让你环游世界<br/><br/>
+      🔸 主要活动安排 🔸<br/><br/>
+      🎶 9:30 - 开幕式暨舞蹈表演<br/><br/>
+      🎭 11:00 - 戏剧表演《XXXX》<br/><br/>
+      🎨 14:00 - 手工艺DIY工作坊<br/><br/>
+      🌍 每个展区都是一次文化冒险！<br/><br/>
+      🌟 特别活动 🌟<br/><br/>
+      🍜 美食区域：品尝全球美味小吃<br/><br/>
+      🎤 卡拉OK角落：释放你的音乐天赋<br/><br/>
+      🌸 花艺摄影墙：与花儿合影留念<br/><br/>
+      📢 欢迎所有同学参与，展现你的才华！<br/><br/>
+      💬 分享你对文化的独特见解，一起创造不同寻常的校园盛会！<br/><br/>
+      🎈欢迎新同学融入贵州大学大家庭，让我们一起度过难忘的时光！🌈
+    `,
+    };
+  },
+  created() {
+    const random = Math.random();
+    if (random > 0.5) {
+      this.inOpter = true;
+    }
+  },
+  methods: {},
+};
+</script>
+
+<style lang="scss" scoped>
+.content {
+  padding: 20rpx;
+  .title {
+    font-size: 40rpx;
+  }
+  .msg-type {
+    display: flex;
+    justify-content: space-between;
+    font-size: 30rpx;
+    color: #999;
+    margin: 10rpx 0;
+  }
+  .msg-cover {
+    margin: 20rpx 0;
+    image {
+      width: 100%;
+      height: 350rpx;
+    }
+  }
+  .main-content {
+    color: #999;
+    font-size: 35rpx;
+  }
+  .btn-box {
+    position: fixed;
+    bottom: 30px;
+    width: 95%;
+    height: 80rpx;
+    background-color: #202020;
+    color: white;
+    text-align: center;
+    line-height: 80rpx;
+    font-size: 40rpx;
+    border-radius: 50px;
+  }
+}
+</style>

pages/activity/index.vue

@@ -0,0 +1,105 @@
+<template>
+  <view class="content">
+    <view class="navBarBox">
+      <view
+        class="statusBar"
+        :style="{ paddingTop: statusBarHeight + 'px' }"
+      ></view>
+      <view class="navBar">
+        <view>活动</view>
+        <image class="logo" mode="scaleToFill"></image>
+      </view>
+    </view>
+    <uni-card v-for="item in 2" :key="item" padding="0" spacing="0">
+      <view @click.stop="onClick">
+        <image
+          slot="cover"
+          class="cover"
+          src="https://jbm.dev.zonelife.cn/img/15519395654249311.jpg"
+        ></image>
+        <view class="content-box">
+          <view class="title">期待与生活与“粽”不同</view>
+          <view class="sub-title">
+            期待与生活与“粽”不同期待与生活与“粽”不同
+          </view>
+        </view>
+      </view>
+    </uni-card>
+    <zs-tab-bar :value="1"></zs-tab-bar>
+  </view>
+</template>
+
+<script>
+import uniCard from "@/uni_modules/uni-card/components/uni-card/uni-card.vue";
+export default {
+  components: {
+    uniCard,
+  },
+  data() {
+    return {
+      navBarHeight: 0,
+      statusBarHeight: 0,
+    };
+  },
+  created() {
+    this.navBarHeight = this.$navHight(1);
+    this.statusBarHeight = uni.getSystemInfoSync()["statusBarHeight"];
+    this.navBarHeight = this.navBarHeight + 10 + "px";
+  },
+  methods: {
+    onClick() {
+      uni.navigateTo({
+        url: "/pages/activity/detail",
+      });
+    },
+  },
+};
+</script>
+<style>
+page {
+  background-color: #fafafa;
+}
+</style>
+<style lang="scss" scoped>
+.navBarBox .navBar .logo {
+  width: 0rpx;
+  height: 82rpx;
+  // margin-right: 10rpx;
+}
+
+.navBarBox .navBar {
+  font-size: 35rpx;
+  font-weight: bold;
+  padding: 3rpx 50rpx;
+  padding-bottom: 8rpx;
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+}
+.content {
+  // padding-top: 24%;
+}
+.cover {
+  width: 100%;
+  height: 300rpx;
+}
+.content-box {
+  padding: 0 20rpx;
+  height: 110rpx;
+  .title {
+    font-weight: bold;
+    // 超出文本使用...
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .sub-title {
+    font-size: 20rpx;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+}
+</style>

pages/index/detail.vue

@@ -0,0 +1,641 @@
+<template>
+  <view class="content">
+    <view class="top-box">
+      <view class="progress">
+        <!-- {{ current + 1 + "/" + bannerList.length }} -->
+        <view class="indicator" v-for="item in bannerList.length">
+          <view :class="['block', item == current ? 'active' : '']"> </view>
+        </view>
+      </view>
+      <view class="goods-box">
+        <view class="goods-title">
+          {{ bannerList[current].title }}
+        </view>
+        <view class="goods-subtitle">
+          {{ bannerList[current].subtitle }}
+        </view>
+      </view>
+      <swiper
+        class="swiper"
+        @change="swiperChange"
+        :indicator-dots="false"
+        circular
+        :current="current"
+        indicatorMode="line"
+        :autoplay="true"
+        :interval="3000"
+        :duration="1000"
+      >
+        <swiper-item v-for="(item, index) in bannerList" :key="index">
+          <image class="swiper-item" mode="" :src="item.src"> </image>
+        </swiper-item>
+      </swiper>
+    </view>
+
+    <view class="card-box">
+      <view class="card-item">
+        <view class="card-title">
+          <view class="card-item-title">
+            <view class="title-moji">到店自提</view>
+            <view class="subtitle">提前点单免排队</view>
+          </view>
+          <view class="card-img">
+            <image
+              class="card-item-img"
+              src="../../static/icons/self-pick.png"
+            ></image>
+          </view>
+        </view>
+      </view>
+
+      <view class="card-item">
+        <view class="card-title">
+          <view class="card-item-title">
+            <view class="title-moji">印象配送</view>
+            <view class="subtitle">外卖点单及时送</view>
+          </view>
+          <view class="card-img">
+            <image
+              class="card-item-img"
+              src="../../static/icons/distribution.png"
+            ></image>
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <view class="swiper-box" style="height: 200rpx">
+      <swiper
+        class="swiper"
+        @change="swiperChange"
+        :indicator-dots="false"
+        circular
+        :autoplay="false"
+        :interval="3000"
+        :duration="1000"
+      >
+        <swiper-item
+          v-for="(item, index) in advList1"
+          :key="item.id"
+          @click="jump(item.jumpUrl)"
+        >
+          <image class="swiper-item" mode="" :src="item.advertsImg"> </image>
+        </swiper-item>
+      </swiper>
+    </view>
+
+    <view class="sub-title">
+      <view>精选推荐</view>
+    </view>
+
+    <view class="goods-list">
+      <!-- 列表 -->
+      <zs-list class="store-box" mt="0" @load="loadMore" :status="status">
+        <view class="left">
+          <view
+            class="store-item"
+            v-for="(item, index) in list"
+            :key="index"
+            @click="goShopDetail(item)"
+          >
+            <zs-img
+              :src="item.logoPath"
+              width="340rpx"
+              height="340rpx"
+              mode="widthFix"
+            ></zs-img>
+            <view class="info">
+              <view class="title">
+                {{ item.shopVo.shopName }}
+              </view>
+              <view class="goods-price">
+                <!-- <image
+                  class="position"
+                  src="../../static/position.png"
+                  mode=""
+                ></image> -->
+                <view> ￥120 </view>
+                <view class="distance">
+                  销售{{ (item.shopVo.distance / 1000).toFixed(2) }}
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+        <view class="right">
+          <view
+            class="store-item"
+            v-for="(item, index) in list1"
+            :key="index"
+            @click="goShopDetail(item)"
+          >
+            <zs-img
+              :src="item.logoPath"
+              width="340rpx"
+              height="340rpx"
+              mode="widthFix"
+            ></zs-img>
+            <view class="info">
+              <view class="title">
+                {{ item.shopVo.shopName }}
+              </view>
+              <view class="goods-price">
+                <!-- <image
+                  class="position"
+                  src="../../static/position.png"
+                  mode=""
+                ></image> -->
+                <view> ￥120 </view>
+                <view class="distance">
+                  销售{{ (item.shopVo.distance / 1000).toFixed(2) }}
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </zs-list>
+    </view>
+
+    <zs-tabbar-shadow />
+  </view>
+</template>
+
+<script>
+import { getUserDetail, getMenu, getAdv } from "@/api/common.js";
+import { search } from "@/api/shop.js";
+// 腾讯地图
+var QQMapWX = require("../../libs/qqmap-wx-jssdk.min.js");
+var qqmapsdk = new QQMapWX({ key: "KX5BZ-B64RC-RO62W-AMWAZ-VVTC3-YAFXF" });
+export default {
+  data() {
+    return {
+      advList: [],
+      advList1: [],
+      discountsList: [], //菜单
+      current: 0,
+      loading: false,
+      navBarHeight: 0,
+      bannerList: [
+        {
+          src: "http://zswl-dev.oss-cn-chengdu.aliyuncs.com/63b7c68b71a69169d1b33f92/store/bdb/user/avatar/LasLcHe8z6F9c7c569e98cf778f866ac466404589d03.png/1.png",
+          theme: "#FD9E59",
+          title: "春季新品",
+          subtitle: "蜜桃乌龙海盐芝士茶",
+        },
+        {
+          src: "http://zswl-dev.oss-cn-chengdu.aliyuncs.com/63b7c68b71a69169d1b33f92/store/bdb/user/avatar/QdulVZUZ9HYH190ae2e9392281ee1b845573e68ece1e.png/1.png",
+          theme: "#FDD34C",
+          title: "清仓处理",
+          subtitle: "农夫山泉矿泉水",
+        },
+        {
+          src: "http://zswl-dev.oss-cn-chengdu.aliyuncs.com/63b7c68b71a69169d1b33f92/store/bdb/user/avatar/N7kknVWzDPKLbb7e15025599a818bbf11e3b030b6765.png/1.png",
+          theme: "#B0ACF9",
+          title: "正在热卖",
+          subtitle: "哇哈哈AD盖",
+        },
+      ],
+      list: [],
+      list1: [],
+      status: "more",
+      query: {
+        queryName: "",
+        "location.lat": 0,
+        "location.lon": 0,
+        pageCurrent: 1,
+        pageSize: 10,
+      },
+    };
+  },
+  onLoad() {},
+  created() {
+    this.loading = true;
+    this.navBarHeight = this.$navHight(1);
+    this.navBarHeight = this.navBarHeight + 10 + "px";
+    Promise.all([this.getMenu(), this.getAdv(), this.getCity()]).then((res) => {
+      this.search();
+    });
+  },
+  methods: {
+    // swiper变动
+    swiperChange(val) {
+      this.current = val.target.current;
+    },
+    // 广告位
+    getAdv() {
+      return new Promise((resolve, reject) => {
+        getAdv({ currentPage: 1, pageSize: 99, advertsType: 1 }).then((res) => {
+          if (res.state == "Success") {
+            this.advList = res.content.records.filter(
+              (item, index) => index < 2
+            );
+            this.advList1 = res.content.records
+              .filter((item, index) => index >= 2)
+              .map((item) => {
+                return {
+                  ...item,
+                  advertsImg:
+                    "https://img.tukuppt.com/bg_grid/00/19/09/1dM5I5nUz7.jpg!/fh/350",
+                };
+              })
+              .filter((item, index) => index == 1);
+            this.loading = false;
+            resolve(2);
+          }
+        });
+      });
+    },
+    // 金刚区
+    getMenu() {
+      return new Promise((resolve, reject) => {
+        getMenu({ currentPage: 1, pageSize: 10 }).then((res) => {
+          if (res.state == "Success") {
+            this.discountsList = res.content.records.slice(0, 5);
+            resolve(1);
+          }
+        });
+      });
+    },
+    // 跳转优惠详情
+    goDetail(url, id, banner, title) {
+      url = "/pages/home/detail";
+      uni.navigateTo({
+        url: `${url}`,
+        success(res) {
+          // res.eventChannel.emit("banner", banner);
+        },
+      });
+    },
+    search() {
+      if (this.status == "noMore") return;
+      this.status = "loading";
+      search(this.query).then((res) => {
+        if (res.state == "Success") {
+          this.loading = false;
+          let list = [];
+          let list1 = [];
+          res.content.records.map((item, index) => {
+            if (index % 2) {
+              list.push(item);
+            } else {
+              list1.push(item);
+            }
+          });
+          this.list = this.list.concat(list);
+          this.list1 = this.list1.concat(list1);
+          let total = this.list.length + this.list1.length;
+          if (total >= res.content.total) {
+            this.status = "noMore";
+          } else {
+            this.status = "more";
+            this.query.pageCurrent++;
+          }
+        }
+      });
+    },
+    loadMore() {
+      console.log("loadMore");
+      if (this.query["location.lat"] && this.query["location.lon"]) {
+        this.search();
+      }
+    },
+    // 获取当前城市
+    getCity() {
+      let that = this;
+      return new Promise((resolve, reject) => {
+        uni.getLocation({
+          type: "gcj02",
+          success: (res) => {
+            // 解析地址
+            that.query["location.lat"] = res.latitude;
+            that.query["location.lon"] = res.longitude;
+            // 存储经纬度
+            uni.setStorageSync(
+              "location",
+              JSON.stringify({
+                latitude: res.latitude,
+                longitude: res.longitude,
+              })
+            );
+            qqmapsdk.reverseGeocoder({
+              location: {
+                latitude: res.latitude,
+                longitude: res.longitude,
+              },
+              success: function (res) {
+                // 市
+                that.city = res.result.address_component.city;
+                resolve();
+              },
+              fail: function (res) {
+                that.city = "定位失败";
+              },
+            });
+          },
+          fail: (res) => {
+            console.log("获取经纬度失败");
+          },
+        });
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+page{
+  background-color: #fafafa;
+}
+.content {
+  // padding-top: 24%;
+  display: flex;
+  flex-direction: column;
+  background-color: #fafafa;
+  justify-content: center;
+  .top-box {
+    background: linear-gradient(180deg, var(--bg) 0%, #fff 100%);
+    // padding: 100rpx 32rpx 0;
+    height: 550rpx;
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-end;
+
+    .progress {
+      position: absolute;
+      top: 24%;
+      right: 80%;
+      display: flex;
+      z-index: 2;
+      color: #ffffff;
+      font-size: 16rpx;
+      // background: rgba(255, 255, 255, 0.3);
+      padding: 2rpx 10rpx;
+      border-radius: 14rpx;
+      .block {
+        width: 30rpx;
+        height: 10rpx;
+        margin-left: 10rpx;
+        background: #fff;
+        border-radius: 10px;
+      }
+      .active {
+        background: #b4b4b4;
+      }
+    }
+    .goods-box {
+      position: absolute;
+      top: 10%;
+      z-index: 22;
+      margin-left: 20rpx;
+      .goods-title {
+        font-size: 70rpx;
+        color: #000;
+        margin-bottom: 10rpx;
+      }
+      .goods-subtitle {
+        font-size: 35rpx;
+        color: #8b8b8b;
+      }
+    }
+    .swiper {
+      height: 584rpx;
+      border-radius: 16rpx;
+      .swiper-item {
+        width: 100%;
+        height: 100%;
+        // border-radius: 16rpx;
+      }
+    }
+  }
+
+  .card-box {
+    background-color: white;
+    border-radius: 15rpx;
+    padding: 40rpx 60rpx 20rpx 60rpx;
+    display: flex;
+    justify-content: space-evenly;
+    z-index: 9999;
+    margin: -15% 20rpx 20rpx 20rpx;
+    .title-moji {
+      font-size: 40rpx;
+      margin-bottom: 10rpx;
+      text-align: center;
+    }
+    .subtitle {
+      text-align: center;
+      font-size: 30rpx;
+      color: #8b8b8b;
+    }
+    .card-img {
+      display: flex;
+      justify-content: center;
+      padding: 40rpx 0 50rpx 0;
+      .card-item-img {
+        width: 100rpx;
+        height: 100rpx;
+      }
+    }
+
+    // height: 300rpx;
+  }
+}
+
+.search-box {
+  width: 100vw;
+}
+
+.swiper-box {
+  position: relative;
+  margin: 0 24rpx 10rpx;
+  padding-top: 20rpx;
+  width: 702rpx;
+  height: 280rpx;
+  border-radius: 16rpx;
+  .progress {
+    position: absolute;
+    top: 38rpx;
+    right: 20rpx;
+    z-index: 2;
+    color: #ffffff;
+    font-size: 16rpx;
+    background: rgba(255, 255, 255, 0.3);
+    padding: 2rpx 10rpx;
+    border-radius: 14rpx;
+  }
+
+  .swiper {
+    position: relative;
+    height: 100%;
+    padding: 0 10rpx;
+    .swiper-item {
+      width: 100%;
+      height: 100%;
+      border-radius: 16rpx;
+      object-fit: cover;
+    }
+  }
+}
+
+.discount-list {
+  display: flex;
+  flex-wrap: wrap;
+  width: 100%;
+  // padding: 30rpx 0;
+  // margin: 0 0rpx 0rpx;
+  background: #fafafa;
+  border-radius: 16rpx;
+  position: relative;
+  top: 0rpx;
+  padding-top: 20rpx;
+  .discount-item {
+    width: 20%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin-top: 10rpx;
+    margin-bottom: 10rpx;
+    position: relative;
+
+    .icon {
+      width: 56rpx;
+      height: 56rpx;
+    }
+
+    .title {
+      font-size: 26rpx;
+      margin-top: 10rpx;
+    }
+
+    .tag {
+      position: absolute;
+      top: -20rpx;
+      left: 50%;
+      background: #ff0615;
+      box-shadow: inset 0rpx 6rpx 12rpx 2rpx rgba(255, 255, 255, 0.16);
+      border-radius: 12rpx 14rpx 14rpx 0rpx;
+      color: #fff;
+      white-space: nowrap;
+      font-size: 18rpx;
+      line-height: -14rpx;
+      height: 24rpx;
+      padding: 0 10rpx;
+      // width: fit-content;
+      background-size: 100% 34rpx;
+    }
+
+    .desc {
+      color: #ff0817;
+      font-size: 16rpx;
+      text-align: center;
+      margin-top: 4rpx;
+    }
+  }
+}
+.sub-title {
+  margin: 20rpx 0;
+  padding-left: 40rpx;
+  font-size: 30rpx;
+  font-weight: bold;
+}
+
+.goods-list {
+  border-radius: 16rpx 16rpx 0 0;
+}
+
+.zs-list {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  padding: 0 24rpx;
+
+  .left {
+    .adv-swiper {
+      width: 340rpx;
+      height: 444rpx;
+      margin-bottom: 25rpx;
+      .adv-item {
+        width: 340rpx;
+        height: 444rpx;
+      }
+    }
+  }
+
+  .right {
+  }
+
+  .store-item {
+    width: 340rpx;
+    margin-bottom: 25rpx;
+    // box-shadow: 0rpx 0rpx 24rpx 2rpx rgba(0, 0, 0, 0.08);
+    border-radius: 16rpx;
+    background: #fff;
+
+    .icon {
+      width: 100%;
+      height: 300rpx;
+      border-radius: 16rpx 16rpx 0 0;
+    }
+
+    .info {
+      padding: 20rpx;
+      background: #fff;
+      border-radius: 0 0 16rpx 16rpx;
+      position: relative;
+
+      .title {
+        // font-weight: bold;
+        width: 100%;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+      }
+
+      .tags {
+        display: flex;
+        align-items: center;
+
+        .tag-item {
+          line-height: 50rpx;
+          border-radius: 8rpx;
+          padding: 6rpx 0;
+          font-size: 24rpx;
+          margin-left: 10rpx;
+          display: flex;
+
+          .label {
+            background: #fff;
+            color: #fe5b47;
+            padding: 0 10rpx;
+            border-radius: 8rpx 0 0 8rpx;
+          }
+
+          .value {
+            color: #fff;
+            background: rgba(255, 255, 255, 0.2);
+            padding: 0 14rpx;
+            border-radius: 0 8rpx 8rpx 0;
+          }
+        }
+      }
+
+      .goods-price {
+        display: flex;
+        align-items: center;
+        margin-top: 15rpx;
+        justify-content: space-between;
+        color: #202020;
+        .distance {
+          color: #999;
+        }
+        .position {
+          color: 999;
+          width: 25rpx;
+          height: 29rpx;
+          margin-right: 8rpx;
+        }
+      }
+    }
+  }
+}
+</style>

pages/index/index.vue

@@ -1,673 +1,522 @@
 <template>
-	<view class="home">
-		<zs-skeleton :loading="loading"></zs-skeleton>
-
-		<zs-banner :city="city" :background="background" position @search="handleSearch"></zs-banner>
-
-		<view class="login-home">
-			<!-- 登录显示的套餐列表 -->
-			<view class="discount-list">
-				<view class="discount-item" v-for="(item,index) in discountsList" :key="index" @click="goDetail(item.domainUrl,item.id,item.secondaryImg,item.menuName)">
-					<image class="icon" :src="item.imgUrl" mode=""></image>
-					<view class="title">{{item.menuName}}</view>
-					<view class="tag" v-if="item.labelAbove">
-						{{item.labelAbove}}
-					</view>
-					<view class="desc">
-						{{item.labelBelow || ''}}
-					</view>
-				</view>
+	<view>
+		<zs-skeleton type="index" :loading="loading"></zs-skeleton>
+		<view class="navBarBox">
+			<view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view>
+			<view class="navBar">
+				<view>印象贵大文创</view>
+				<image class="logo"  mode="scaleToFill"></image>
+			</view>
+		</view>
+		<view class="content">
+			<view class="search-box">
+				<zs-search style="margin-top: 10px" :showBtn="false" :showPrefix="false" placeholder="请输入商品名称"
+					height="80" bgColor="#F6F6F6"></zs-search>
 			</view>
-			
+
 			<view class="swiper-box">
 				<view class="progress">
-					{{current+1+'/'+advList.length}}
+					{{ current + 1 + "/" + advList.length }}
 				</view>
-				<swiper class="swiper" @change="swiperChange" :current="current" :indicator-dots="false" circular :autoplay="true"
-					:interval="3000" :duration="1000">
-					<swiper-item v-for="(item,index) in advList" :key="item.id"  @click="jump(item.jumpUrl)">
-						<image class="swiper-item" mode="" :src="item.advertsImg">
-						</image>
+				<swiper class="swiper" @change="swiperChange" :current="current" :indicator-dots="false" circular
+					:autoplay="true" :interval="3000" :duration="1000">
+					<swiper-item v-for="(item, index) in advList" :key="item.id" @click="jump(item.jumpUrl)">
+						<image class="swiper-item" mode="" :src="item.advertsImg"> </image>
 					</swiper-item>
-						
 				</swiper>
 			</view>
 
-
-			<!-- 广告位 -->
-<!-- 			<view class="advertise-box">
-				<view class="item" v-for="item in advList" :key="item.id">
-					<zs-img
-						:src="item.advertsImg"
-						width="335rpx" height="188rpx" radius="full" mode=""></zs-img>
+			<view class="discount-list">
+				<view class="discount-item" v-for="(item, index) in discountsList" :key="index" @click="
+            goDetail(item.linkUrl, item.id, item.secondaryImg, item.menuName)
+          ">
+					<image class="icon" :src="item.columnImg" mode=""></image>
+					<view class="title">{{ item.columnName }}</view>
 				</view>
-			</view> -->
+			</view>
+
+			<view class="swiper-box" style="height: 160rpx">
+				<swiper class="swiper" @change="swiperChange" :indicator-dots="false" circular :autoplay="false"
+					:interval="3000" :duration="1000">
+					<swiper-item v-for="(item, index) in advList1" :key="item.id" @click="jump(item.jumpUrl)">
+						<image class="swiper-item" mode="" :src="item.advertsImg"> </image>
+					</swiper-item>
+				</swiper>
+			</view>
 
-			<view class="content">
+			<view class="sub-title">
+				<view>精选推荐</view>
+			</view>
 
-				<!-- 列表 -->
+			<view class="goods-list">
 				<zs-list class="store-box" mt="0" @load="loadMore" :status="status">
 					<view class="left">
-						<!-- 广告banner -->
-					<!-- 	<swiper class="adv-swiper" v-if="advList1.length" indicator-active-color="#fff" indicator-color="rgba(255, 255, 255, .46)" :indicator-dots="advList1.length>1" circular  autoplay>
-						
-							<swiper-item v-for="item in advList1" :key="item" @click="jump(item.jumpUrl)">
-								<image class="adv-item"
-									:src="item.advertsImg"
-									mode=""></image>
-							</swiper-item>
-						</swiper> -->
-
-						
-						<view class="store-item" v-for="(item,index) in list" :key="index" @click="goGoodsDetail(item)">
-							<template v-if="item.isAdv">
-								<image class="ad" :src="item.advertsImg" mode="widthFix"></image>
-							</template>
-							<template v-else>
-								<zs-img :src="item.goodsVos[0].goodsImg" width="340rpx" height="340rpx" mode="widthFix"></zs-img>
-								<view class="info">
-									<view class="title">
-										{{item.goodsVos[0].goodsName}}
-									</view>
-									<view class="desc">
-										{{item.goodsVos[0].goodsDescribe}}
-									</view>
-									<view class="price-box">
-										<view class="left">
-											<view class="unit">
-												￥
-											</view>
-											<view class="price">
-											{{item.goodsVos[0].realPrice}}
-											</view>
-										</view>
-										
-										<view class="right">
-											销量{{item.goodsVos[0].saleNum}}
-										</view>
+						<view class="store-item" v-for="(item, index) in list" :key="index" @click="goShopDetail(item)">
+							<zs-img :src="item.goodsImg" width="340rpx" height="340rpx" mode="widthFix"></zs-img>
+							<view class="info">
+								<view class="title">
+									{{ item.goodsName }}
+								</view>
+								<view class="goods-price">
+									<view> ￥{{ item.realPrice }} </view>
+									<view class="distance">
+										销售{{ (item.saleNum).toFixed(2) }}
 									</view>
 								</view>
-							</template>
-							
+							</view>
 						</view>
 					</view>
 					<view class="right">
-						
-						<view class="store-item" v-for="(item,index) in list1" :key="index" @click="goGoodsDetail(item)">
-							<template v-if="item.isAdv">
-								<image class="ad" :src="item.advertsImg" mode="widthFix"></image>
-							</template>
-							<template v-else>
-								<zs-img :src="item.goodsVos[0].goodsImg" width="340rpx" height="340rpx" mode="widthFix"></zs-img>
-								<view class="info">
-									<view class="title">
-										{{item.goodsVos[0].goodsName}}
-									</view>
-									<view class="desc">
-										{{item.goodsVos[0].goodsDescribe}}
-									</view>
-									<view class="price-box">
-										<view class="left">
-											<view class="unit">
-												￥
-											</view>
-											<view class="price">
-											{{item.goodsVos[0].realPrice}}
-											</view>
-										</view>
-										
-										<view class="right">
-											销量{{item.goodsVos[0].saleNum}}
-										</view>
+						<view class="store-item" v-for="(item, index) in list1" :key="index"
+							@click="goShopDetail(item)">
+							<zs-img :src="item.goodsImg" width="340rpx" height="340rpx" mode="widthFix"></zs-img>
+							<view class="info">
+								<view class="title">
+									{{ item.goodsName }}
+								</view>
+								<view class="goods-price">
+									<!-- <image
+                  class="position"
+                  src="../../static/position.png"
+                  mode=""
+                ></image> -->
+									<view> ￥{{ item.realPrice }}</view>
+									<view class="distance">
+										销售{{ (item.saleNum).toFixed(2) }}
 									</view>
 								</view>
-							</template>
+							</view>
 						</view>
 					</view>
-
 				</zs-list>
 			</view>
 
+			<zs-tab-bar :value="0"></zs-tab-bar>
 		</view>
-
 	</view>
 </template>
 
 <script>
 	import {
 		getUserDetail,
-		getMenu,
 		getAdv
-	} from '@/api/common.js'
-	import { search } from '@/api/shop.js';
+	} from "@/api/common.js";
+	import {
+		appSearch
+	} from "@/api/shop.js";
+	import {searchMenu} from "@/api/study.js";
 	// 腾讯地图
-	var QQMapWX = require('../../libs/qqmap-wx-jssdk.min.js');
-	var qqmapsdk = new QQMapWX({key:'KX5BZ-B64RC-RO62W-AMWAZ-VVTC3-YAFXF'});
+	var QQMapWX = require("../../libs/qqmap-wx-jssdk.min.js");
+	var qqmapsdk = new QQMapWX({
+		key: "KX5BZ-B64RC-RO62W-AMWAZ-VVTC3-YAFXF"
+	});
 	export default {
 		data() {
 			return {
-				background:false,
+				advList: [],
+				advList1: [],
+				discountsList: [], //菜单
+				current: 0,
 				loading: false,
-				userId: '',
-				city:'定位中',
-				status: 'more',
-				current:0,
-				bannerList:['https://alipic.lanhuapp.com/XDSlicePNGMAX2f4cb415a269b2e935c7a97da9077db4d78ddb8306ac44ec1e10274387048a22.png',
-				'https://alipic.lanhuapp.com/XDSlicePNGMAX2f4cb415a269b2e935c7a97da9077db4d78ddb8306ac44ec1e10274387048a22.png'],
-				discountsList: [],//菜单
-				advList:[],
-				advList1:[],
+				navBarHeight: 0,
+				statusBarHeight: 0,
 				list: [],
 				list1: [],
-				query:{
-					queryName:'',
-					'location.lat':0,
-					'location.lon':0,
-					pageCurrent:1,
-					pageSize:10
+				status: "more",
+				query: {
+					currentPage: 1,
+					pageSize: 10,
+					shopId: "",
+					status:3
 				},
-				
-			}
+			};
+		},
+		onLoad() {},
+		created() {
+			this.loading = true;
+			this.navBarHeight = this.$navHight(1);
+			this.navBarHeight = this.navBarHeight + 10 + "px";
+			this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'];
+			Promise.all([this.getSearchMenu(), this.getAdv(), this.getCity(),this.getBanner()]).then((res) => {
+				this.appSearch();
+			});
+			this.query.shopId = uni.getStorageSync("gdShopId");
 		},
-		
 		methods: {
 			// swiper变动
 			swiperChange(val) {
-				this.current = val.target.current
+				this.current = val.target.current;
 			},
-			jump(url){
-				uni.reLaunch({
-					url
-				})
+			// Banner
+			getBanner(){
+				return new Promise((resolve, reject) => {
+					getAdv({
+						currentPage: 1,
+						pageSize: 99,
+						advertsType: 1
+					}).then((res) => {
+						if (res.state == "Success") {
+							this.advList = res.content.records
+							this.loading = false;
+							resolve(2);
+						}
+					});
+				});
 			},
-			// 点击搜索
-			handleSearch(){
-				if(!uni.getStorageSync('token')){
-					return uni.showModal({
-						title:'请登录',
-						confirmText:'去登录',
-						success(res){
-							console.log(res);
-							if(res.confirm){
-								uni.navigateTo({
-									url:'/login/login/login?redirect=/pages/index/index'
-								})
-							}
+			// 广告位
+			getAdv() {
+				return new Promise((resolve, reject) => {
+					getAdv({
+						currentPage: 1,
+						pageSize: 99,
+						advertsType: 2
+					}).then((res) => {
+						if (res.state == "Success") {
+							this.advList1 = res.content.records
+							this.loading = false;
+							resolve(2);
 						}
-					})
-				}
-				uni.reLaunch({
-					url:'./search'
-				})
-				// if(!val) return
-				// this.query.queryName = val
-				// this.query.pageCurrent = 1
-				// this.list = []
-				// this.list1 = []
-				// this.status = 'more'
-				// this.search()
+					});
+				});
 			},
-			// 获取当前城市
-			getCity(){
-				let that = this
-				return new Promise((resolve,reject)=>{
-					uni.getLocation({
-							type: 'gcj02',
-							success: (res) => {
-								// 解析地址
-								that.query['location.lat'] = res.latitude
-								that.query['location.lon'] = res.longitude
-								// 存储经纬度
-								uni.setStorageSync('location',JSON.stringify({latitude:res.latitude,longitude:res.longitude}))
-								qqmapsdk.reverseGeocoder({
-									location: {
-										latitude: res.latitude,
-										longitude: res.longitude
-									},
-									success: function(res) {
-										// 市
-										that.city = res.result.address_component.city
-										console.log(9999,that.city,res);
-										if(uni.setStorageSync('districtList')&&uni.getStorageSync('city')==that.city) return
-										uni.setStorageSync('city',res.result.address_component.city)
-										// 获取市区的行政区
-										qqmapsdk.getDistrictByCityId({
-										  // 传入对应省份ID获得城市数据，传入城市ID获得区县数据,依次类推
-										  id: res.result.ad_info.city_code.substr(3), //对应接口getCityList返回数据的Id，如：北京是'110000'
-										  success: function(res) {//成功后的回调
-										    console.log('对应城市ID下的区县数据：', res.result[0]);
-											let data = res.result[0]
-											data.map(item=>{
-												item.label = item.fullname
-											})
-											uni.setStorageSync('districtList',JSON.stringify(data))
-										  },
-										  fail: function(error) {
-										    console.error(error);
-										  },
-										  complete: function(res) {
-										    console.log(res);
-										  }
-										});
-										resolve()
-									},
-									fail: function(res) {
-										that.city = '定位失败'
-									},
-								})
-								  
-								
-							},
-							fail: () => {
-								console.log("获取经纬度失败");
-							},
-						})
-				})
+			// 金刚区
+			getSearchMenu() {
+				return new Promise((resolve, reject) => {
+					searchMenu({
+						currentPage: 1,
+						pageSize: 4,
+						belongType:1,
+						status:1
+					}).then((res) => {
+						if (res.state == "Success") {
+							this.discountsList = res.content.records;
+							resolve(1);
+						}
+					});
+				});
 			},
-
 			// 跳转优惠详情
-			goDetail(url,id,banner,title) {
+			goDetail(url, id, banner, title) {
+				url = "/pages/home/detail";
 				uni.navigateTo({
-					url: `${url}?id=${id}&title=${title}`,
+					url: `${url}`,
 					success(res) {
-						res.eventChannel.emit('banner', banner)
-					}
-				})
+						// res.eventChannel.emit("banner", banner);
+					},
+				});
 			},
-			goGoodsDetail(item) {
-				uni.setStorageSync('shopInfo', JSON.stringify(item))
-				uni.reLaunch({
-					url: `../../detail/goodsDetail/index?id=${item.goodsVos[0].goodsId}`
-				})
-			},
-
-			// 更多套餐
-			handleMore() {
-				uni.reLaunch({
-					// url:'../../login/login/login'
-					url: '../../combo/combo/combo'
-				})
-			},
-
-			// 获取用户详情
-			getUserDetail() {
-				getUserDetail().then(res => {
-					uni.setStorageSync('userInfo', JSON.stringify(res.content))
-				})
-			},
-			loadMore() {
-				if(this.query['location.lat']&&this.query['location.lon']){
-					this.search()
-				}
-			},
-			search() {
-				if(this.status == 'noMore') return
-				this.status = 'loading'
-				search(this.query).then(res=>{
-					if(res.state == 'Success'){
-						this.loading = false
-						let list = []
-						let list1 = []
-						let data = res.content.records
-						data.map((item,index)=>{
-							if(index%2 == 0){
-								list.push(item)
-							}else{
-								list1.push(item)
-							}
-						})
-						this.list = this.list.concat(list)
-						this.list1 = this.list1.concat(list1)
-						if(this.query.pageCurrent == res.content.pages){
-							this.status = 'noMore'
-						}else{
-							this.status = 'more'
-							this.query.pageCurrent++
-						}
-						if(!this.advList1.length){
-							this.getGoodsAdv().then(()=>{
-								this.advList1.map(item=>{
-									if(item.showSort<= (this.list.length + this.list1.length)){
-										if((item.showSort-1)%2 == 0){
-											this.list.splice(Math.ceil(item.showSort/2)-1,0,{isAdv:true,...item})
-										}else{
-											this.list1.splice(Math.ceil(item.showSort/2)-1,0,{isAdv:true,...item})
-										}
-									}
-								})
+			appSearch() {
+				if (this.status == "noMore") return;
+				this.status = "loading";
+				appSearch(this.query).then((res) => {
+					if (res.state == "Success") {
+						this.loading = false;
+						let list = [];
+						let list1 = [];
+						res.content.records.map((item, index) => {
+							if (index % 2) {
+								list1.push(item);
+							} else {
+								list.push(item);
 							}
-						  )
-						}else{
-							this.advList1.map(item=>{
-								if(item.showSort<= (this.list.length + this.list1.length)){
-									if((item.showSort-1)%2 == 0){
-										this.list.splice(Math.ceil(item.showSort/2)-1,0,{isAdv:true,...item})
-									}else{
-										this.list1.splice(Math.ceil(item.showSort/2)-1,0,{isAdv:true,...item})
-									}
-								}
-							})
+						});
+						this.list = this.list.concat(list);
+						this.list1 = this.list1.concat(list1);
+						let total = this.list.length + this.list1.length;
+						if (total >= res.content.total) {
+							this.status = "noMore";
+						} else {
+							this.status = "more";
+							this.query.currentPage++;
 						}
-						// 获取商品里面的广告
-						// getAdv({currentPage:1,pageSize:99,advertsType:2,status:1}).then(res1=>{
-						// 	if(res.state == 'Success'){
-						// 		res1.content.records.map(item=>{
-						// 			data.splice(item.showSort-1,0,{isAdv:true,...item})
-						// 		})
-						// 		console.log(data);
-						// 		data.map((item,index)=>{
-						// 			if(index%2){
-						// 				list.push(item)
-						// 			}else{
-						// 				list1.push(item)
-						// 			}
-						// 		})
-						// 		this.list = this.list.concat(list)
-						// 		this.list1 = this.list1.concat(list1)
-						// 		// let total = this.list.length+this.list1.length
-						// 		// if(total>=res.content.total){
-						// 		if(this.query.pageCurrent == res.content.pages){
-						// 			this.status = 'noMore'
-						// 		}else{
-						// 			this.status = 'more'
-						// 			this.query.pageCurrent++
-						// 		}
-						// 	}
-						// })
-						
-						
 					}
-				})
-			},
-			// 金刚区
-			getMenu(){
-				return new Promise((resolve,reject)=>{
-					getMenu({currentPage:1,pageSize:10,status:2}).then(res=>{
-						if(res.state == 'Success'){
-							this.discountsList = res.content.records
-							resolve(1)
-						}
-					})
-				})
+				});
 			},
-			// 广告位
-			getAdv(){
-				return new Promise((resolve,reject)=>{
-					getAdv({currentPage:1,pageSize:99,advertsType:1,status:1}).then(res=>{
-						if(res.state == 'Success'){
-							this.advList = res.content.records
-							// this.advList = res.content.records.filter((item,index)=>index<2)
-							// this.advList1 = res.content.records.filter((item,index)=>index>=2)
-							resolve(2)
-						}
-					})
-				})
+			loadMore() {
+				console.log("loadMore");
+				if (this.query["location.lat"] && this.query["location.lon"]) {
+					this.appSearch();
+				}
 			},
-			// 获取商品列表内广告位
-			getGoodsAdv(){
-				return new Promise((resolve,reject)=>{
-					getAdv({currentPage:1,pageSize:99,advertsType:2,status:1}).then(res=>{
-						if(res.state == 'Success'){
-							this.advList1 = res.content.records
-							resolve(2)
-						}
-					})
-				})
+			// 获取当前城市
+			getCity() {
+				let that = this;
+				return new Promise((resolve, reject) => {
+					uni.getLocation({
+						type: "gcj02",
+						success: (res) => {
+							// 解析地址
+							that.query["location.lat"] = res.latitude;
+							that.query["location.lon"] = res.longitude;
+							// 存储经纬度
+							uni.setStorageSync(
+								"location",
+								JSON.stringify({
+									latitude: res.latitude,
+									longitude: res.longitude,
+								})
+							);
+							qqmapsdk.reverseGeocoder({
+								location: {
+									latitude: res.latitude,
+									longitude: res.longitude,
+								},
+								success: function(res) {
+									// 市
+									that.city = res.result.address_component.city;
+									resolve();
+								},
+								fail: function(res) {
+									that.city = "定位失败";
+								},
+							});
+						},
+						fail: (res) => {
+							console.log("获取经纬度失败");
+						},
+					});
+				});
 			},
 		},
-		onPageScroll(e) {
-				if(e.scrollTop >= 50){
-					this.background = true
-				}else{
-					this.background = false
-				}
-		},
-		onShow() {
-			if (uni.getStorageSync('token')&&!uni.getStorageSync('userInfo')) {
-				this.getUserDetail()
-			}
-		},
-		onHide() {},
-		onLoad(query){
-			
-			 uni.setStorageSync('inviteCode',decodeURIComponent(query.scene))
-		},
-		created() {
-			this.loading = true
-			Promise.all([this.getMenu(),this.getAdv(),this.getCity()]).then(res=>{
-				this.search()
-			})
-			
-		}
-	}
+	};
 </script>
 
 <style lang="scss">
-	.home {
-		// padding-bottom:120rpx;
-		// background: linear-gradient(180deg, #FFFFFF 0%, #DCE8FF 100%);
-		background: #F9F9F9;
+	.navBarBox .navBar .logo {
+		width: 0rpx;
+		height: 82rpx;
+		// margin-right: 10rpx;
+	}
+
+	.navBarBox .navBar {
+		font-size: 35rpx;
+		font-weight: bold;
+		padding: 3rpx 50rpx;
+		padding-bottom: 8rpx;
+		display: flex;
+		flex-direction: row;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.content {
+		// padding-top: 24%;
+		display: flex;
+		flex-direction: column;
+		background-color: #fafafa;
+		justify-content: center;
+	}
+
+	page {
+		background-color: #fafafa;
+	}
+
+	.search-box {
+		width: 100vw;
+	}
+
+	.swiper-box {
+		position: relative;
+		margin: 0 24rpx 10rpx;
+		padding-top: 20rpx;
+		width: 702rpx;
+		height: 280rpx;
+		border-radius: 16rpx;
+
+		.progress {
+			position: absolute;
+			top: 38rpx;
+			right: 20rpx;
+			z-index: 2;
+			color: #ffffff;
+			font-size: 16rpx;
+			background: rgba(255, 255, 255, 0.3);
+			padding: 2rpx 10rpx;
+			border-radius: 14rpx;
+		}
+
+		.swiper {
+			position: relative;
+			height: 100%;
+			padding: 0 10rpx;
+
+			.swiper-item {
+				width: 100%;
+				height: 100%;
+				border-radius: 16rpx;
+				object-fit: cover;
+			}
+		}
+	}
 
-		.card-title {
+	.discount-list {
+		display: flex;
+		flex-wrap: wrap;
+		width: 100%;
+		justify-content: space-evenly;
+		// padding: 30rpx 0;
+		// margin: 0 0rpx 0rpx;
+		background: #fafafa;
+		border-radius: 16rpx;
+		position: relative;
+		top: 0rpx;
+		padding-top: 20rpx;
+
+		.discount-item {
+			width: 20%;
 			display: flex;
-			justify-content: center;
+			flex-direction: column;
+			align-items: center;
+			margin-top: 10rpx;
+			margin-bottom: 10rpx;
+			position: relative;
+
+			.icon {
+				width: 56rpx;
+				height: 56rpx;
+			}
 
 			.title {
-				font-size: 32rpx;
-				text-align: center;
+				font-size: 26rpx;
+				margin-top: 10rpx;
+			}
+
+			.tag {
+				position: absolute;
+				top: -20rpx;
+				left: 50%;
+				background: #ff0615;
+				box-shadow: inset 0rpx 6rpx 12rpx 2rpx rgba(255, 255, 255, 0.16);
+				border-radius: 12rpx 14rpx 14rpx 0rpx;
 				color: #fff;
-				width: 210rpx;
-				line-height: 64rpx;
-				background: linear-gradient(360deg, #3074F8 0%, #568FFF 100%);
-				border-radius: 0rpx 0rpx 24rpx 24rpx;
+				white-space: nowrap;
+				font-size: 18rpx;
+				line-height: -14rpx;
+				height: 24rpx;
+				padding: 0 10rpx;
+				// width: fit-content;
+				background-size: 100% 34rpx;
 			}
 
+			.desc {
+				color: #ff0817;
+				font-size: 16rpx;
+				text-align: center;
+				margin-top: 4rpx;
+			}
 		}
+	}
 
-		.login-home {
-			// background: linear-gradient(178deg, #FFFFFF 0%, #F9F9F9 100%);
-			// background: #FFF;
-
-			.discount-list {
-				display: flex;
-				flex-wrap: wrap;
-				// padding: 30rpx 0;
-				margin: 0 24rpx 20rpx;
-				// background: #fff;
-				border-radius: 16rpx;
-				position: relative;
-				top: 20rpx;
-				padding-top: 20rpx;
-				.discount-item {
-					width: 20%;
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					margin-top: 20rpx;
-					margin-bottom: 20rpx;
-					position: relative;
+	.sub-title {
+		margin: 20rpx 0;
+		padding-left: 40rpx;
+		font-size: 30rpx;
+		font-weight: bold;
+	}
 
-					.icon {
-						width: 80rpx;
-						height: 80rpx;
-					}
+	.goods-list {
+		border-radius: 16rpx 16rpx 0 0;
+		margin-bottom: 60rpx;
+	}
 
-					.title {
-						font-size: 24rpx;
-						margin-top: 10rpx;
-						font-weight: 300;
-						color: #222222;
-					}
+	.zs-list {
+		display: flex;
+		flex-wrap: wrap;
+		justify-content: space-between;
+		padding: 0 24rpx;
 
-					.tag {
-						position: absolute;
-						top: -20rpx;
-						left: 50%;
-						background: #FF0615;
-						box-shadow: inset 0rpx 6rpx 12rpx 2rpx rgba(255, 255, 255, 0.16);
-						border-radius: 12rpx 14rpx 14rpx 0rpx;
-						color: #fff;
-						white-space: nowrap;
-						font-size: 18rpx;
-						line-height: -14rpx;
-						height: 24rpx;
-						padding: 0 10rpx;
-						// width: fit-content;
-						background-size: 100% 34rpx;
-					}
+		.left {
+			.adv-swiper {
+				width: 340rpx;
+				height: 444rpx;
+				margin-bottom: 25rpx;
 
-					.desc {
-						color: #FF0817;
-						font-size: 16rpx;
-						text-align: center;
-						margin-top: 4rpx;
-					}
+				.adv-item {
+					width: 340rpx;
+					height: 444rpx;
 				}
 			}
+		}
+
+		.right {}
+
+		.store-item {
+			width: 340rpx;
+			margin-bottom: 25rpx;
+			// box-shadow: 0rpx 0rpx 24rpx 2rpx rgba(0, 0, 0, 0.08);
+			border-radius: 16rpx;
+			background: #fff;
 
-			.title-img {
-				width: 686rpx;
-				height: 166rpx;
-				margin: 24rpx 32rpx;
+			.icon {
+				width: 100%;
+				height: 300rpx;
+				border-radius: 16rpx 16rpx 0 0;
 			}
-			.swiper-box{
+
+			.info {
+				padding: 20rpx;
+				background: #fff;
+				border-radius: 0 0 16rpx 16rpx;
 				position: relative;
-				margin: 0 24rpx 20rpx;
-				padding-top: 20rpx;
-				width: 702rpx;
-				height: 284rpx;
-				border-radius: 16rpx;
-				.progress{
-					position: absolute;
-					top: 38rpx;
-					right: 20rpx;
-					z-index: 2;
-					color: #FFFFFF;
-					font-size: 16rpx;
-					background: rgba(255, 255, 255, 0.3);
-					padding: 2rpx 10rpx;
-					border-radius: 14rpx;
-				}
-				.swiper {
-					position: relative;
-					height: 100%;
-					.swiper-item {
-						width: 100%;
-						height: 100%;
-						border-radius: 16rpx;
-						object-fit: cover;
-					}
+
+				.title {
+					// font-weight: bold;
+					width: 100%;
+					white-space: nowrap;
+					text-overflow: ellipsis;
+					overflow: hidden;
 				}
-			}
 
-			.advertise-box {
-				display: flex;
-				justify-content: space-between;
-				margin: 0 24rpx;
-				padding: 20rpx 0;
-				
-			}
+				.tags {
+					display: flex;
+					align-items: center;
 
-			.content {
-				border-radius: 16rpx 16rpx 0 0;
-			}
+					.tag-item {
+						line-height: 50rpx;
+						border-radius: 8rpx;
+						padding: 6rpx 0;
+						font-size: 24rpx;
+						margin-left: 10rpx;
+						display: flex;
 
+						.label {
+							background: #fff;
+							color: #fe5b47;
+							padding: 0 10rpx;
+							border-radius: 8rpx 0 0 8rpx;
+						}
 
-			.zs-list {
-				display: flex;
-				flex-wrap: wrap;
-				justify-content: space-between;
-				padding: 0 24rpx;
-
-				.left {
-					.adv-swiper{
-						width: 340rpx;
-						height: 444rpx;
-						margin-bottom: 25rpx;
-						.adv-item{
-							width: 340rpx;
-							height: 444rpx;
+						.value {
+							color: #fff;
+							background: rgba(255, 255, 255, 0.2);
+							padding: 0 14rpx;
+							border-radius: 0 8rpx 8rpx 0;
 						}
 					}
 				}
-					.ad{
-						width: 340rpx;
-						border-radius: 16rpx;
-					}
 
-				.store-item {
-					width: 340rpx;
-					margin-bottom: 20rpx;
-					// box-shadow: 0rpx 0rpx 24rpx 2rpx rgba(0, 0, 0, 0.08);
-					border-radius: 16rpx;
-					background: #fff;
-
-					.icon {
-						width: 100%;
-						height: 300rpx;
-						border-radius: 16rpx 16rpx 0 0;
+				.goods-price {
+					display: flex;
+					align-items: center;
+					margin-top: 15rpx;
+					justify-content: space-between;
+					color: #FF4D3A;
+					font-weight: bold;
+					font-size: 30rpx;
+					.distance {
+						font-weight: normal;
+						font-size: 20rpx;
+						color: #999;
 					}
 
-					.info{
-						flex: 1;
-						padding: 16rpx;
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						position: relative;
-						.title{
-							font-size: 28rpx;
-							font-weight: bold;
-							width: 100%;
-							white-space: nowrap;
-							overflow: hidden;
-							text-overflow: ellipsis;
-							margin-top: 10rpx;
-						}
-						
-						.desc{
-							font-size: 24rpx;
-							color: #AAAAAA;
-							overflow: hidden;
-							text-overflow: ellipsis;
-							/* 弹性伸缩盒子模型显示 */
-							display: -webkit-box;
-							/* 限制在一个块元素显示的文本的行数 */
-							-webkit-line-clamp: 2;
-							/* 设置或检索伸缩盒对象的子元素的排列方式 */
-							-webkit-box-orient: vertical;
-							margin-top: 12rpx;
-						}
-						
-						.price-box{
-							display: flex;
-							justify-content: space-between;
-							align-items: center;
-							margin-top: 12rpx;
-							.left{
-								display: flex;
-								align-items: flex-end;
-								.unit{
-									font-size: 20rpx;
-									color: #FF4D3A;
-									font-weight: bold;
-								}
-								.price{
-									font-size: 32rpx;
-									color: #FF4D3A;
-									font-weight: bold;
-								}
-							}
-							.right{
-								font-size: 24rpx;
-								color: #AAAAAA;
-							}
-						}
-						
+					.position {
+						color: 999;
+						width: 25rpx;
+						height: 29rpx;
+						margin-right: 8rpx;
 					}
 				}
 			}
 		}
-
 	}
 </style>

pages/life/index.vue

@@ -0,0 +1,672 @@
+<template>
+	<view class="home">
+		<zs-skeleton :loading="loading"></zs-skeleton>
+
+		<zs-banner :city="city" :background="background" position @search="handleSearch"></zs-banner>
+
+		<view class="login-home">
+			<!-- 登录显示的套餐列表 -->
+			<view class="discount-list">
+				<view class="discount-item" v-for="(item,index) in discountsList" :key="index" @click="goDetail(item.domainUrl,item.id,item.secondaryImg,item.menuName)">
+					<image class="icon" :src="item.imgUrl" mode=""></image>
+					<view class="title">{{item.menuName}}</view>
+					<view class="tag" v-if="item.labelAbove">
+						{{item.labelAbove}}
+					</view>
+					<view class="desc">
+						{{item.labelBelow || ''}}
+					</view>
+				</view>
+			</view>
+			
+			<view class="swiper-box">
+				<view class="progress">
+					{{current+1+'/'+advList.length}}
+				</view>
+				<swiper class="swiper" @change="swiperChange" :current="current" :indicator-dots="false" circular :autoplay="true"
+					:interval="3000" :duration="1000">
+					<swiper-item v-for="(item,index) in advList" :key="item.id"  @click="jump(item.jumpUrl)">
+						<image class="swiper-item" mode="" :src="item.advertsImg">
+						</image>
+					</swiper-item>
+						
+				</swiper>
+			</view>
+
+
+			<!-- 广告位 -->
+<!-- 			<view class="advertise-box">
+				<view class="item" v-for="item in advList" :key="item.id">
+					<zs-img
+						:src="item.advertsImg"
+						width="335rpx" height="188rpx" radius="full" mode=""></zs-img>
+				</view>
+			</view> -->
+
+			<view class="content">
+
+				<!-- 列表 -->
+				<zs-list class="store-box" mt="0" @load="loadMore" :status="status">
+					<view class="left">
+						<!-- 广告banner -->
+					<!-- 	<swiper class="adv-swiper" v-if="advList1.length" indicator-active-color="#fff" indicator-color="rgba(255, 255, 255, .46)" :indicator-dots="advList1.length>1" circular  autoplay>
+						
+							<swiper-item v-for="item in advList1" :key="item" @click="jump(item.jumpUrl)">
+								<image class="adv-item"
+									:src="item.advertsImg"
+									mode=""></image>
+							</swiper-item>
+						</swiper> -->
+
+						
+						<view class="store-item" v-for="(item,index) in list" :key="index" @click="goGoodsDetail(item)">
+							<template v-if="item.isAdv">
+								<image class="ad" :src="item.advertsImg" mode="widthFix"></image>
+							</template>
+							<template v-else>
+								<zs-img :src="item.goodsVos[0].goodsImg" width="340rpx" height="340rpx" mode="widthFix"></zs-img>
+								<view class="info">
+									<view class="title">
+										{{item.goodsVos[0].goodsName}}
+									</view>
+									<view class="desc">
+										{{item.goodsVos[0].goodsDescribe}}
+									</view>
+									<view class="price-box">
+										<view class="left">
+											<view class="unit">
+												￥
+											</view>
+											<view class="price">
+											{{item.goodsVos[0].realPrice}}
+											</view>
+										</view>
+										
+										<view class="right">
+											销量{{item.goodsVos[0].saleNum}}
+										</view>
+									</view>
+								</view>
+							</template>
+							
+						</view>
+					</view>
+					<view class="right">
+						
+						<view class="store-item" v-for="(item,index) in list1" :key="index" @click="goGoodsDetail(item)">
+							<template v-if="item.isAdv">
+								<image class="ad" :src="item.advertsImg" mode="widthFix"></image>
+							</template>
+							<template v-else>
+								<zs-img :src="item.goodsVos[0].goodsImg" width="340rpx" height="340rpx" mode="widthFix"></zs-img>
+								<view class="info">
+									<view class="title">
+										{{item.goodsVos[0].goodsName}}
+									</view>
+									<view class="desc">
+										{{item.goodsVos[0].goodsDescribe}}
+									</view>
+									<view class="price-box">
+										<view class="left">
+											<view class="unit">
+												￥
+											</view>
+											<view class="price">
+											{{item.goodsVos[0].realPrice}}
+											</view>
+										</view>
+										
+										<view class="right">
+											销量{{item.goodsVos[0].saleNum}}
+										</view>
+									</view>
+								</view>
+							</template>
+						</view>
+					</view>
+
+				</zs-list>
+			</view>
+
+		</view>
+		<zs-tab-bar :value="2"></zs-tab-bar>
+	</view>
+</template>
+
+<script>
+	import {
+		getUserDetail,
+		getMenu,
+		getAdv
+	} from '@/api/common.js'
+	import { search } from '@/api/shop.js';
+	// 腾讯地图
+	var QQMapWX = require('../../libs/qqmap-wx-jssdk.min.js');
+	var qqmapsdk = new QQMapWX({key:'KX5BZ-B64RC-RO62W-AMWAZ-VVTC3-YAFXF'});
+	export default {
+		data() {
+			return {
+				background:false,
+				loading: false,
+				userId: '',
+				city:'定位中',
+				status: 'more',
+				current:0,
+				bannerList:[],
+				discountsList: [],//菜单
+				advList:[],
+				advList1:[],
+				list: [],
+				list1: [],
+				query:{
+					queryName:'',
+					'location.lat':0,
+					'location.lon':0,
+					pageCurrent:1,
+					pageSize:10
+				},
+				
+			}
+		},
+		
+		methods: {
+			// swiper变动
+			swiperChange(val) {
+				this.current = val.target.current
+			},
+			jump(url){
+				uni.reLaunch({
+					url
+				})
+			},
+			// 点击搜索
+			handleSearch(){
+				if(!uni.getStorageSync('token')){
+					return uni.showModal({
+						title:'请登录',
+						confirmText:'去登录',
+						success(res){
+							console.log(res);
+							if(res.confirm){
+								uni.navigateTo({
+									url:'/login/login/login?redirect=/pages/index/index'
+								})
+							}
+						}
+					})
+				}
+				uni.reLaunch({
+					url:'./search'
+				})
+				// if(!val) return
+				// this.query.queryName = val
+				// this.query.pageCurrent = 1
+				// this.list = []
+				// this.list1 = []
+				// this.status = 'more'
+				// this.search()
+			},
+			// 获取当前城市
+			getCity(){
+				let that = this
+				return new Promise((resolve,reject)=>{
+					uni.getLocation({
+							type: 'gcj02',
+							success: (res) => {
+								// 解析地址
+								that.query['location.lat'] = res.latitude
+								that.query['location.lon'] = res.longitude
+								// 存储经纬度
+								uni.setStorageSync('location',JSON.stringify({latitude:res.latitude,longitude:res.longitude}))
+								qqmapsdk.reverseGeocoder({
+									location: {
+										latitude: res.latitude,
+										longitude: res.longitude
+									},
+									success: function(res) {
+										// 市
+										that.city = res.result.address_component.city
+										console.log(9999,that.city,res);
+										if(uni.setStorageSync('districtList')&&uni.getStorageSync('city')==that.city) return
+										uni.setStorageSync('city',res.result.address_component.city)
+										// 获取市区的行政区
+										qqmapsdk.getDistrictByCityId({
+										  // 传入对应省份ID获得城市数据，传入城市ID获得区县数据,依次类推
+										  id: res.result.ad_info.city_code.substr(3), //对应接口getCityList返回数据的Id，如：北京是'110000'
+										  success: function(res) {//成功后的回调
+										    console.log('对应城市ID下的区县数据：', res.result[0]);
+											let data = res.result[0]
+											data.map(item=>{
+												item.label = item.fullname
+											})
+											uni.setStorageSync('districtList',JSON.stringify(data))
+										  },
+										  fail: function(error) {
+										    console.error(error);
+										  },
+										  complete: function(res) {
+										    console.log(res);
+										  }
+										});
+										resolve()
+									},
+									fail: function(res) {
+										that.city = '定位失败'
+									},
+								})
+								  
+								
+							},
+							fail: () => {
+								console.log("获取经纬度失败");
+							},
+						})
+				})
+			},
+
+			// 跳转优惠详情
+			goDetail(url,id,banner,title) {
+				uni.navigateTo({
+					url: `${url}?id=${id}&title=${title}`,
+					success(res) {
+						res.eventChannel.emit('banner', banner)
+					}
+				})
+			},
+			goGoodsDetail(item) {
+				uni.setStorageSync('shopInfo', JSON.stringify(item))
+				uni.reLaunch({
+					url: `../../detail/goodsDetail/index?id=${item.goodsVos[0].goodsId}`
+				})
+			},
+
+			// 更多套餐
+			handleMore() {
+				uni.reLaunch({
+					// url:'../../login/login/login'
+					url: '../../combo/combo/combo'
+				})
+			},
+
+			// 获取用户详情
+			getUserDetail() {
+				getUserDetail().then(res => {
+					uni.setStorageSync('userInfo', JSON.stringify(res.content))
+				})
+			},
+			loadMore() {
+				if(this.query['location.lat']&&this.query['location.lon']){
+					this.search()
+				}
+			},
+			search() {
+				if(this.status == 'noMore') return
+				this.status = 'loading'
+				search(this.query).then(res=>{
+					if(res.state == 'Success'){
+						this.loading = false
+						let list = []
+						let list1 = []
+						let data = res.content.records
+						data.map((item,index)=>{
+							if(index%2 == 0){
+								list.push(item)
+							}else{
+								list1.push(item)
+							}
+						})
+						this.list = this.list.concat(list)
+						this.list1 = this.list1.concat(list1)
+						if(this.query.pageCurrent == res.content.pages){
+							this.status = 'noMore'
+						}else{
+							this.status = 'more'
+							this.query.pageCurrent++
+						}
+						if(!this.advList1.length){
+							this.getGoodsAdv().then(()=>{
+								this.advList1.map(item=>{
+									if(item.showSort<= (this.list.length + this.list1.length)){
+										if((item.showSort-1)%2 == 0){
+											this.list.splice(Math.ceil(item.showSort/2)-1,0,{isAdv:true,...item})
+										}else{
+											this.list1.splice(Math.ceil(item.showSort/2)-1,0,{isAdv:true,...item})
+										}
+									}
+								})
+							}
+						  )
+						}else{
+							this.advList1.map(item=>{
+								if(item.showSort<= (this.list.length + this.list1.length)){
+									if((item.showSort-1)%2 == 0){
+										this.list.splice(Math.ceil(item.showSort/2)-1,0,{isAdv:true,...item})
+									}else{
+										this.list1.splice(Math.ceil(item.showSort/2)-1,0,{isAdv:true,...item})
+									}
+								}
+							})
+						}
+						// 获取商品里面的广告
+						// getAdv({currentPage:1,pageSize:99,advertsType:2,status:1}).then(res1=>{
+						// 	if(res.state == 'Success'){
+						// 		res1.content.records.map(item=>{
+						// 			data.splice(item.showSort-1,0,{isAdv:true,...item})
+						// 		})
+						// 		console.log(data);
+						// 		data.map((item,index)=>{
+						// 			if(index%2){
+						// 				list.push(item)
+						// 			}else{
+						// 				list1.push(item)
+						// 			}
+						// 		})
+						// 		this.list = this.list.concat(list)
+						// 		this.list1 = this.list1.concat(list1)
+						// 		// let total = this.list.length+this.list1.length
+						// 		// if(total>=res.content.total){
+						// 		if(this.query.pageCurrent == res.content.pages){
+						// 			this.status = 'noMore'
+						// 		}else{
+						// 			this.status = 'more'
+						// 			this.query.pageCurrent++
+						// 		}
+						// 	}
+						// })
+						
+						
+					}
+				})
+			},
+			// 金刚区
+			getMenu(){
+				return new Promise((resolve,reject)=>{
+					getMenu({currentPage:1,pageSize:10,status:2}).then(res=>{
+						if(res.state == 'Success'){
+							this.discountsList = res.content.records
+							resolve(1)
+						}
+					})
+				})
+			},
+			// 广告位
+			getAdv(){
+				return new Promise((resolve,reject)=>{
+					getAdv({currentPage:1,pageSize:99,advertsType:1,status:1}).then(res=>{
+						if(res.state == 'Success'){
+							this.advList = res.content.records
+							// this.advList = res.content.records.filter((item,index)=>index<2)
+							// this.advList1 = res.content.records.filter((item,index)=>index>=2)
+							resolve(2)
+						}
+					})
+				})
+			},
+			// 获取商品列表内广告位
+			getGoodsAdv(){
+				return new Promise((resolve,reject)=>{
+					getAdv({currentPage:1,pageSize:99,advertsType:2,status:1}).then(res=>{
+						if(res.state == 'Success'){
+							this.advList1 = res.content.records
+							resolve(2)
+						}
+					})
+				})
+			},
+		},
+		onPageScroll(e) {
+				if(e.scrollTop >= 50){
+					this.background = true
+				}else{
+					this.background = false
+				}
+		},
+		onShow() {
+			if (uni.getStorageSync('token')&&!uni.getStorageSync('userInfo')) {
+				this.getUserDetail()
+			}
+		},
+		onHide() {},
+		onLoad(query){
+			
+			 uni.setStorageSync('inviteCode',decodeURIComponent(query.scene))
+		},
+		created() {
+			this.loading = true
+			Promise.all([this.getMenu(),this.getAdv(),this.getCity()]).then(res=>{
+				this.search()
+			})
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.home {
+		// padding-bottom:120rpx;
+		// background: linear-gradient(180deg, #FFFFFF 0%, #DCE8FF 100%);
+		background: #F9F9F9;
+
+		.card-title {
+			display: flex;
+			justify-content: center;
+
+			.title {
+				font-size: 32rpx;
+				text-align: center;
+				color: #fff;
+				width: 210rpx;
+				line-height: 64rpx;
+				background: linear-gradient(360deg, #3074F8 0%, #568FFF 100%);
+				border-radius: 0rpx 0rpx 24rpx 24rpx;
+			}
+
+		}
+
+		.login-home {
+			// background: linear-gradient(178deg, #FFFFFF 0%, #F9F9F9 100%);
+			// background: #FFF;
+
+			.discount-list {
+				display: flex;
+				flex-wrap: wrap;
+				// padding: 30rpx 0;
+				margin: 0 24rpx 20rpx;
+				// background: #fff;
+				border-radius: 16rpx;
+				position: relative;
+				top: 20rpx;
+				padding-top: 20rpx;
+				.discount-item {
+					width: 20%;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					margin-top: 20rpx;
+					margin-bottom: 20rpx;
+					position: relative;
+
+					.icon {
+						width: 80rpx;
+						height: 80rpx;
+					}
+
+					.title {
+						font-size: 24rpx;
+						margin-top: 10rpx;
+						font-weight: 300;
+						color: #222222;
+					}
+
+					.tag {
+						position: absolute;
+						top: -20rpx;
+						left: 50%;
+						background: #FF0615;
+						box-shadow: inset 0rpx 6rpx 12rpx 2rpx rgba(255, 255, 255, 0.16);
+						border-radius: 12rpx 14rpx 14rpx 0rpx;
+						color: #fff;
+						white-space: nowrap;
+						font-size: 18rpx;
+						line-height: -14rpx;
+						height: 24rpx;
+						padding: 0 10rpx;
+						// width: fit-content;
+						background-size: 100% 34rpx;
+					}
+
+					.desc {
+						color: #FF0817;
+						font-size: 16rpx;
+						text-align: center;
+						margin-top: 4rpx;
+					}
+				}
+			}
+
+			.title-img {
+				width: 686rpx;
+				height: 166rpx;
+				margin: 24rpx 32rpx;
+			}
+			.swiper-box{
+				position: relative;
+				margin: 0 24rpx 20rpx;
+				padding-top: 20rpx;
+				width: 702rpx;
+				height: 284rpx;
+				border-radius: 16rpx;
+				.progress{
+					position: absolute;
+					top: 38rpx;
+					right: 20rpx;
+					z-index: 2;
+					color: #FFFFFF;
+					font-size: 16rpx;
+					background: rgba(255, 255, 255, 0.3);
+					padding: 2rpx 10rpx;
+					border-radius: 14rpx;
+				}
+				.swiper {
+					position: relative;
+					height: 100%;
+					.swiper-item {
+						width: 100%;
+						height: 100%;
+						border-radius: 16rpx;
+						object-fit: cover;
+					}
+				}
+			}
+
+			.advertise-box {
+				display: flex;
+				justify-content: space-between;
+				margin: 0 24rpx;
+				padding: 20rpx 0;
+				
+			}
+
+			.content {
+				border-radius: 16rpx 16rpx 0 0;
+			}
+
+
+			.zs-list {
+				display: flex;
+				flex-wrap: wrap;
+				justify-content: space-between;
+				padding: 0 24rpx;
+
+				.left {
+					.adv-swiper{
+						width: 340rpx;
+						height: 444rpx;
+						margin-bottom: 25rpx;
+						.adv-item{
+							width: 340rpx;
+							height: 444rpx;
+						}
+					}
+				}
+					.ad{
+						width: 340rpx;
+						border-radius: 16rpx;
+					}
+
+				.store-item {
+					width: 340rpx;
+					margin-bottom: 20rpx;
+					// box-shadow: 0rpx 0rpx 24rpx 2rpx rgba(0, 0, 0, 0.08);
+					border-radius: 16rpx;
+					background: #fff;
+
+					.icon {
+						width: 100%;
+						height: 300rpx;
+						border-radius: 16rpx 16rpx 0 0;
+					}
+
+					.info{
+						flex: 1;
+						padding: 16rpx;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						position: relative;
+						.title{
+							font-size: 28rpx;
+							font-weight: bold;
+							width: 100%;
+							white-space: nowrap;
+							overflow: hidden;
+							text-overflow: ellipsis;
+							margin-top: 10rpx;
+						}
+						
+						.desc{
+							font-size: 24rpx;
+							color: #AAAAAA;
+							overflow: hidden;
+							text-overflow: ellipsis;
+							/* 弹性伸缩盒子模型显示 */
+							display: -webkit-box;
+							/* 限制在一个块元素显示的文本的行数 */
+							-webkit-line-clamp: 2;
+							/* 设置或检索伸缩盒对象的子元素的排列方式 */
+							-webkit-box-orient: vertical;
+							margin-top: 12rpx;
+						}
+						
+						.price-box{
+							display: flex;
+							justify-content: space-between;
+							align-items: center;
+							margin-top: 12rpx;
+							.left{
+								display: flex;
+								align-items: flex-end;
+								.unit{
+									font-size: 20rpx;
+									color: #FF4D3A;
+									font-weight: bold;
+								}
+								.price{
+									font-size: 32rpx;
+									color: #FF4D3A;
+									font-weight: bold;
+								}
+							}
+							.right{
+								font-size: 24rpx;
+								color: #AAAAAA;
+							}
+						}
+						
+					}
+				}
+			}
+		}
+
+	}
+</style>

pages/life/position.vue

@@ -0,0 +1,154 @@
+<template>
+    <view>
+        <city-select
+            @cityClick="cityClick"
+            :formatName="formatName"
+            :activeCity="activeCity"
+            :hotCity="hotCity"
+            :obtainCitys="obtainCitys"
+            :isSearch="true"
+            ref="citys"
+        ></city-select>
+    </view>
+</template>
+
+<script>
+import citys from '@/components/city-select/citySelect.js'
+import citySelect from '@/components/city-select/city-select.vue'
+// 腾讯地图
+var QQMapWX = require('../../libs/qqmap-wx-jssdk.min.js');
+var qqmapsdk = new QQMapWX({key:'KX5BZ-B64RC-RO62W-AMWAZ-VVTC3-YAFXF'});
+export default {
+    data() {
+        return {
+            //需要构建索引参数的名称（注意：传递的对象里面必须要有这个名称的参数）
+            formatName: 'title',
+            //当前城市
+            activeCity: {
+                id: 1,
+                title: '南京'
+            },
+            //热门城市
+            hotCity: [
+                {
+                    id: 0,
+                    title: '北京'
+                },
+                {
+                    id: 1,
+                    title: '南京'
+                }
+            ],
+            //显示的城市数据
+            obtainCitys: [
+                {
+                    id: 0,
+                    title: '南京'
+                },
+                {
+                    id: 1,
+                    title: '北京'
+                },
+                {
+                    id: 2,
+                    title: '天津'
+                },
+                {
+                    id: 3,
+                    title: '成都'
+                },
+				{
+				    id: 4,
+				    title: '长沙'
+				},
+				{
+				    id: 5,
+				    title: '贵阳'
+				}
+            ]
+        }
+    },
+    components: {
+        citySelect
+    },
+    created() {
+		this.getCity()
+		
+        //动态更新数据
+        // setTimeout(() => {
+        //     //修改需要构建索引参数的名称
+        //     this.formatName = 'cityName'
+        //     //修改当前城市
+        //     this.activeCity = {
+        //         cityName: '南京',
+        //         cityCode: 110100
+        //     }
+        //     //修改热门城市
+        //     this.hotCity = [
+        //         {
+        //             cityName: '南京',
+        //             cityCode: 110100
+        //         },
+        //         {
+        //             cityName: '北京',
+        //             cityCode: 110102
+        //         }
+        //     ]
+        //     //修改构建索引数据
+        //     this.obtainCitys = citys
+        //     uni.showToast({
+        //         icon: 'none',
+        //         title: '更新数据成功',
+        //         // #ifdef MP-WEIXIN
+        //         duration: 3000,
+        //         // #endif
+        //         mask: true
+        //     })
+        // }, 5000)
+    },
+    methods: {
+        cityClick(item) {
+			uni.setStorageSync('city',item.title)
+			uni.navigateBack()
+        },
+		getCity(){
+			this.activeCity.title = '定位中'
+			let that = this
+			uni.getLocation({
+			        type: 'wgs84',
+			        geocode: true,
+			        success: (res) => {
+			            console.log("获取经纬度成功");
+						// 解析地址
+						qqmapsdk.reverseGeocoder({
+						    location: {
+						        latitude: res.latitude,
+						        longitude: res.longitude
+						    },
+						    success: function(res) {
+						        console.log("解析地址成功");
+						        // 市
+						        that.activeCity.title = res.result.ad_info.city.slice(0,2);
+						    },
+						    fail: function(res) {
+								this.city = '定位失败'
+						       
+						    },
+						    complete: function(res) {
+						        console.log(res);
+						    }
+						})
+			        },
+			        fail: () => {
+			            console.log("获取经纬度失败");
+			        },
+			        complete: () => {
+			           
+			        }
+			    })
+		},
+    }
+}
+</script>
+
+<style></style>

pages/life/search.vue

@@ -0,0 +1,373 @@
+<template>
+	<view class="search-page">
+		<view class="search-box">
+			<input class="search" type="text" placeholder="搜索" v-model="query.queryName" />
+			<image class="icon" src="@/static/search.png" mode=""></image>
+			<button class="btn" type="default" @click="handleSearch">搜索</button>
+		</view>
+
+		<view class="content" v-show="!list.length">
+			<view class="title-box">
+				<view class="title">
+					历史搜索
+				</view>
+				<u-icon name="trash" color="#999" size="42" @click="delSearchHistory"></u-icon>
+			</view>
+
+			<view class="tab-box">
+				<view class="tab" v-for="(item,index) in tabList" :key="index" @click="handleHistory(item)">
+					{{item}}
+				</view>
+			</view>
+		</view>
+		<view class="content" v-show="list.length">
+<!-- 			<view class="tab-group">
+				<view class="tab" :class="[tab == 1?'active':'']" @click="handleTab(1)">
+					店铺
+				</view>
+				<view class="tab" :class="[tab == 2?'active':'']" @click="handleTab(2)">
+					商品
+				</view>
+			</view>
+
+			<zs-list mt="0" @load="loadMore" :status="status">
+				<view :class="[tab == 1?'item':'goods-item']" v-for="(item,index) in list" :key="index">
+					<template v-if="tab == 1">
+						<zs-img :src="item.logoPath" width="164rpx" height="164rpx" radius="full"
+							@click.native="goDetail(item)"></zs-img>
+						<view class="info">
+							<view class="title">
+								{{item.shopVo.shopName}}
+							</view>
+							<view class="address">
+								<image class="position" src="../../static/position.png" mode=""></image>
+								距离你{{(item.shopVo.distance/1000).toFixed(2)}}km ·{{item.district}}
+							</view>
+							<view class="activity" :class="!item.activityContent?'white':''">
+								{{item.activityContent || '-'}}
+							</view>
+
+						</view>
+					</template>
+					<template v-else>
+							<zs-img  :src="item.goodsImg" width="310rpx" height="310rpx" raduis="full"  mode="" ></zs-img>
+							<view class="goods-name">
+								{{item.goodsName}}
+							</view>
+							<view class="type">
+								{{goodsTypeObj[item.goodsCode]}}
+							</view>
+							<view class="price">
+								¥{{item.buyPrice}}
+							</view>
+					</template>
+				</view>
+			</zs-list> -->
+
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		getSearchHistory,
+		saveSearchHistory,
+		delSearchHistory
+	} from '@/api/common.js';
+	import {
+		search
+	} from '@/api/shop.js';
+	export default {
+		data() {
+			return {
+				status: 'more',
+				result: false,
+				tab: 1,
+				tabList: [],
+				list: [],
+				query: {
+					pageCurrent: 1,
+					pageSize: 10,
+					'location.lat': 0,
+					'location.lon': 0,
+					queryName: ''
+				}
+			}
+		},
+		methods: {
+			handleHistory(val){
+				this.query.queryName = val
+				this.handleSearch()
+			},
+			goDetail(item) {
+				uni.setStorageSync('shopInfo', JSON.stringify(item))
+				uni.navigateTo({
+					url: '/detail/shopDetail/shopDetail'
+				})
+			},
+			handleTab(val) {
+				this.tab = val
+				this.query.pageCurrent = 1
+				this.list = []
+			},
+			handleSearch() {
+				this.status = 'more'
+				this.query.pageCurrent = 1
+				this.list = []
+				this.saveSearchHistory()
+				uni.navigateTo({
+					url:'./searchResult?search='+this.query.queryName
+				})
+				// this.search()
+			},
+			getSearchHistory() {
+				getSearchHistory().then(res => {
+					if (res.state == 'Success') {
+						this.tabList = res.content
+					}
+				})
+			},
+			saveSearchHistory() {
+				saveSearchHistory({
+					key: this.query.queryName
+				}).then(res => {
+					if (res.state == 'Success') {
+						this.getSearchHistory()
+					}
+				})
+			},
+			delSearchHistory() {
+				delSearchHistory().then(res => {
+					if (res.state == 'Success') {
+						this.getSearchHistory()
+					}
+				})
+			},
+			search() {
+				if(this.status == 'noMore') return
+				this.status = 'loading'
+				search(this.query).then(res => {
+					if (res.state == 'Success') {
+						this.saveSearchHistory()
+						this.list = this.list.concat(res.content.records)
+						if(res.content.total>=this.list.length){
+							this.status = 'noMore'
+						}else{
+							this.status = 'more'
+							this.query.pageCurrent++
+						}
+					}
+				})
+			},
+			loadMore() {
+				if(this.query.queryName){
+					this.search()
+				}
+			}
+		},
+		onLoad(options) {
+			let location = JSON.parse(uni.getStorageSync('location'))
+			this.query['location.lat'] = location.latitude
+			this.query['location.lon'] = location.longitude
+			this.getSearchHistory()
+		},
+		created() {}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.search-page {
+		.search-box {
+			height: 72rpx;
+			width: 686rpx;
+			border-radius: 40rpx 40rpx 40rpx 40rpx;
+			background: #F6F6F6;
+			position: relative;
+			margin: 30rpx auto;
+
+			.icon {
+				width: 37rpx;
+				height: 37rpx;
+				position: absolute;
+				top: 50%;
+				left: 36rpx;
+				transform: translateY(-50%);
+			}
+
+			.search {
+				line-height: 72rpx;
+				height: 72rpx;
+				padding-left: 100rpx;
+				padding-right: 150rpx;
+			}
+
+			.btn {
+				position: absolute;
+				top: 8rpx;
+				right: 10rpx;
+				width: 128rpx;
+				height: 56rpx;
+				line-height: 56rpx;
+				background: $uni-color-primary;
+				color: #fff;
+				font-size: 28rpx;
+				border-radius: 32rpx;
+				padding: 0;
+			}
+		}
+		.content{
+			padding: 0 30rpx;
+		}
+
+		.title-box {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+
+			.title {
+				font-weight: bold;
+				color: #222222;
+				font-size: 32rpx;
+			}
+		}
+
+		.tab-box {
+			display: flex;
+			flex-wrap: wrap;
+			align-items: center;
+			padding: 24rpx 0;
+
+			.tab {
+				padding: 0 20rpx;
+				line-height: 44rpx;
+				border-radius: 22rpx;
+				background: #F6F6F6;
+				color: #999999;
+				font-size: 24rpx;
+				max-width: 700rpx;
+				white-space: nowrap;
+				overflow: hidden;
+				text-overflow: ellipsis;
+				margin-bottom: 20rpx;
+				margin-right: 20rpx;
+			}
+		}
+		
+		.tab-group{
+			display: flex;
+			align-items: center;
+			border-bottom: 1rpx solid #F0F0F0;
+			margin-top: -30rpx;
+			.tab{
+				flex: 1;
+				height: 80rpx;
+				line-height: 80rpx;
+				text-align: center;
+				font-size: 28rpx;
+				color: #222222;
+			}
+			.tab.active{
+				position: relative;
+				&::before{
+					content: '';
+					position: absolute;
+					bottom: 0;
+					left: 50%;
+					width: 40rpx;
+					height: 8rpx;
+					transform: translateX(-50%);
+					border-radius: 2rpx;
+					background: $uni-color-primary;
+				}
+				
+				
+			}
+		}
+		
+		.zs-list {
+			padding: 0 30rpx;
+			.item {
+				display: flex;
+				padding: 20rpx 30rpx;
+				background: #fff;
+				border-radius: 16rpx;
+				margin: 20rpx 30rpx 0;
+				.icon{
+					border-radius: 8px;
+				}	
+				.info{
+					flex: 1;
+					padding-left: 20rpx;
+					display: flex;
+					flex-direction: column;
+					justify-content: space-between;
+					position: relative;
+					.title{
+						font-size: 28rpx;
+						font-weight: bold;
+						width: 340rpx;
+						white-space: nowrap;
+						overflow: hidden;
+						text-overflow: ellipsis;
+						margin-top: 10rpx;
+					}
+					.address{
+						color: #bebebe;
+						display: flex;
+						align-items: center;
+						font-size: 24rpx;
+						.u-icon{
+							align-self: flex-start;
+						}
+						.position {
+								width: 25rpx;
+								height: 29rpx;
+								margin-right: 8rpx;
+							}
+					}
+					.activity.white{
+						color: #fff;
+					}
+					.activity{
+						font-size: 24rpx;
+						color: #E77F57;
+						line-height: 42rpx;
+					}
+				}
+			}
+			
+			.goods-item{
+				padding: 12rpx;
+				background: #FFFFFF;
+				box-shadow: 0rpx 0rpx 24rpx 2rpx rgba(0,0,0,0.08);
+				border-radius: 16rpx;
+				width: 334rpx;
+				box-sizing: border-box;
+				margin-top: 20rpx;
+				.goods-name{
+					font-weight: bold;
+					color: #222222;
+					font-size: 24rpx;
+					margin: 16rpx 0;
+					overflow: hidden;
+					width: 100%;
+					text-overflow: ellipsis;
+					display: -webkit-box;
+					-moz-box-orient: vertical;
+					-webkit-line-clamp: 2;
+				}
+				.type{
+					color: #AAAAAA;
+					font-size: 20rpx;
+				}
+				.price{
+					font-weight: bold;
+					color: #FF4C3A;
+					font-size: 28rpx;
+					margin-top: 16rpx;
+				}
+			}
+		}
+		
+	}
+</style>

pages/life/searchResult.vue

@@ -0,0 +1,293 @@
+<template>
+	<view class="searchResult">
+		<zs-choose-tab :tabList="tabList" @choose="chooseTab"></zs-choose-tab>
+		<zs-list mt="0" @load="loadMore" :status="status">
+			<view class="item" v-for="(item,index) in list" :key="index">
+					<zs-img class="icon" :src="item.logoPath" radius="full" width="120rpx" height="120rpx" @click="goShopDetail(item)"></zs-img>
+				<view class="shop-box">
+					<view class="shop-info">
+						<view class="shop-name" @click="goShopDetail(item)">
+							{{item.shopVo.shopName}}
+						</view>
+						<view class="address-box">
+							<view class="address">
+								{{item.district}} 
+							</view>
+							<view class="distance">
+								{{(item.shopVo.distance/1000).toFixed(2)}}km
+							</view>
+						</view>
+					</view>
+	
+					<!-- <view class="goods-list"> -->
+						<scroll-view class="goods-list" enable-flex scroll-x="true">
+						<view class="goods-item" v-for="(i,d) in item.goodsVos" :key="d"  @click="goGoodsDetail(item,i)">
+							<zs-img :src="i.goodsImg" width="160rpx" height="160rpx"></zs-img>
+							<view class="goods-name">
+							{{i.goodsName}}
+							</view>
+							<view class="price-box">
+									<view class="price">
+									￥{{i.realPrice}}
+									</view>
+									<view class="old-price">
+										 ￥{{i.marketPrice}}
+									</view>
+							</view>
+						</view>
+	
+						</scroll-view>
+					<!-- </view> -->
+				</view>
+			</view>
+		</zs-list>
+	</view>
+</template>
+
+<script>
+	import {
+		search
+	} from '@/api/shop.js';
+	import {
+		getMenu,
+	} from '@/api/common.js'
+	export default {
+		data() {
+			return {
+				location:'',
+				query: {
+					district:'',
+					pageCurrent: 1,
+					pageSize: 10,
+					'location.lat': 0,
+					'location.lon': 0,
+					range:'',
+					queryName: ''
+				},
+				status: 'more',
+				list: [],
+				tabList: [{
+						id: 1,
+						label: '区域',
+						list: [
+				
+							{
+								id: 1,
+								label: '观山湖'
+							},
+							{
+								id: 2,
+								label: '白云区'
+							},
+							{
+								id: 3,
+								label: '花果山区'
+							}
+						]
+					},
+					{
+						id: 1,
+						label: '全部分类',
+						list: []
+					},
+					
+					{
+						id: 1,
+						label: '附近',
+						list: [
+							{
+								id:5,
+								label: '5KM'
+							},
+							{
+								id:10,
+								label: '10KM'
+							},
+							{
+								id:20,
+								label: '20KM'
+							},
+							{
+								id:50,
+								label: '50KM'
+							}
+						]
+					},
+				]
+			}
+		},
+		methods: {
+			goShopDetail(item) {
+				uni.setStorageSync('shopInfo', JSON.stringify(item))
+				uni.navigateTo({
+					url: '/detail/shopDetail/shopDetail'
+				})
+			},
+			goGoodsDetail(item,i) {
+				uni.setStorageSync('shopInfo', JSON.stringify(item))
+				uni.reLaunch({
+					url: `/detail/goodsDetail/index?id=${i.goodsId}`
+				})
+			},
+			chooseTab(val) {
+				console.log(val);
+				this.query.range = val[2].id
+				if(val[0]){
+					this.query['location.lat'] = val[0].location.lat
+					this.query['location.lon'] = val[0].location.lng
+					this.query.range = 50
+					this.query.district = val[0].label
+				}else if(!val[0]){
+					this.query['location.lat'] = this.location.latitude
+					this.query['location.lon'] = this.location.longitude
+					this.query.district = ''
+				}
+				if(val[1]){
+					this.query.menuId = val[1].id
+				}else if(!val[1]){
+					this.query.menuId = ''
+				}
+				this.query.pageCurrent = 1
+				this.status = 'more'
+				this.list = []
+				this.search()
+			},
+			search() {
+				// if(this.status == 'noMore') return
+				this.status = 'loading'
+				let obj = JSON.parse(JSON.stringify(this.query))
+				if(!obj.range){
+					delete obj.range
+				}
+				search(obj).then(res => {
+					if (res.state == 'Success') {
+						this.list = this.list.concat(res.content.records)
+						console.log(res.content.total>=this.list.length);
+						if(res.content.total>this.list.length){
+							this.status = 'more'
+						}else{
+							this.status = 'noMore'
+							this.query.pageCurrent++
+						}
+					}
+				})
+			},
+			loadMore() {
+				this.search()
+			},
+			// 金刚区
+			getMenu(){
+					getMenu({currentPage:1,pageSize:10,status:2}).then(res=>{
+						if(res.state == 'Success'){
+							let list = []
+							res.content.records.map(item => {
+								list.push({
+									id: item.id,
+									label: item.menuName
+								})
+							})
+							this.tabList[1].list = list
+						}
+					})
+			},
+		},
+		onLoad(options) {
+			this.tabList[0].list = JSON.parse(uni.getStorageSync('districtList'))
+			this.location = JSON.parse(uni.getStorageSync('location'))
+			this.query['location.lat'] = this.location.latitude
+			this.query['location.lon'] = this.location.longitude
+			this.query.queryName = options.search
+			this.search()
+			this.getMenu()
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.searchResult{
+	padding: 100rpx 24rpx 20rpx;
+	background: #F9F9F9;
+	.item{
+		padding: 24rpx;
+		background: #FFFFFF;
+		border-radius: 16rpx 16rpx 16rpx 16rpx;
+		display: flex;
+		align-items: flex-start;
+		margin-bottom: 20rpx;
+		
+		.icon{
+			width: 120rpx;
+		}
+		.shop-box{
+			flex: 1;
+				margin-left: 20rpx;
+			.shop-info{
+				.shop-name{
+					font-weight: 600;
+					font-size: 36rpx;
+					color: #222222;
+					width: 100%;
+					white-space: nowrap;
+					overflow: hidden;
+					text-overflow: ellipsis;
+				}
+				.address-box{
+					display: flex;
+					justify-content: space-between;
+					align-items: center;
+					font-weight: 300;
+					font-size: 24rpx;
+					color: #AAAAAA;
+					margin-top: 25rpx;
+					.address{
+						width: 400rpx;
+						white-space: nowrap;
+						overflow: hidden;
+						text-overflow: ellipsis;
+					}
+				}
+			}
+			.goods-list{
+				display: flex;
+				align-items: flex-start;
+				margin-top: 20rpx;
+				overflow: auto;
+				width: calc(750rpx - 94rpx - 120rpx - 20rpx);
+				.goods-item{
+					display: inline-block;
+					width: 160rpx;
+					margin-right: 20rpx;
+					.goods-name{
+						margin-top: 20rpx;
+						width: 100%;
+						overflow: hidden;
+						text-overflow: ellipsis;
+						/* 弹性伸缩盒子模型显示 */
+						display: -webkit-box;
+						/* 限制在一个块元素显示的文本的行数 */
+						-webkit-line-clamp: 2;
+						/* 设置或检索伸缩盒对象的子元素的排列方式 */
+						-webkit-box-orient: vertical;
+					}
+				}
+				.price-box{
+					display: flex;
+					align-items: center;
+					margin-top: 20rpx;
+					.price{
+						font-weight: 600;
+						font-size: 28rpx;
+						color: #FF4D3A;
+					}
+					.old-price{
+						font-weight: 300;
+						font-size: 20rpx;
+						color: #AAAAAA;
+						text-decoration: line-through;
+					}
+				}
+			}
+		}
+	}
+}
+</style>

pages/my/index._old.vue

@@ -0,0 +1,376 @@
+<template>
+	<view class="my">
+
+		<view class="top-box">
+
+			<view class="user-info">
+				<image class="image" :src="userInfo.imgPath || defaultImg" lazy-load mode=""></image>
+				<view class="info">
+					<view class="user-name">{{userInfo.nickname ||'用户'}}</view>
+					<view class="tel">{{userInfo.phoneNum ||'-'}}</view>
+				</view>
+				<image class="setting" src="../../static/setting.png" @click="setting" mode=""></image>
+			</view>
+			<view class="level-box">
+				<view class="level-content">
+					<image class="level" :src="`../../static/level${userInfo.setMealId || 0}.png`" mode=""></image>
+					<view class="num" :style="{color:filterMeal(userInfo.setMealId)}">
+						已为您节省0元
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="btn-group">
+			<view class="item" @click="jump('../../my/order/index')">
+
+				<image class="icon" src="../../static/icon1.png" mode=""></image>
+				<view class="label">
+					全部订单
+				</view>
+			</view>
+			<view class="item" @click="jump('../../my/order/index?type=WAIT_PAYMENT')">
+				<image class="icon" src="../../static/icon2.png" mode=""></image>
+				<view class="label">
+					待付款
+				</view>
+			</view>
+			<view class="item" @click="jump('../../my/order/index?type=WAIT_USE')">
+				<image class="icon" src="../../static/icon3.png" mode=""></image>
+				<view class="label">
+					待使用
+				</view>
+			</view>
+			<view class="item" @click="jump('../../my/order/index?type=APPLY_REFUND')">
+				<image class="icon" src="../../static/icon4.png" mode=""></image>
+				<view class="label">
+					退款
+				</view>
+			</view>
+		</view>
+
+		<view class="type-box">
+			<view class="type-item"  @click="jump('../../my/memberCenter/index')">
+				<view class="left">
+					<view class="title">
+						会员中心
+					</view>
+					<view class="desc">
+						会员享受更多优惠
+					</view>
+				</view>
+				<image class="icon" src="../../static/type-icon1.png" mode=""></image>
+			</view>
+			<view class="type-item" @click="jump('/invite/index')">
+				<view class="left">
+					<view class="title">
+						推广邀请
+					</view>
+					<view class="desc">
+						百万佣金发放中
+					</view>
+				</view>
+				<image class="icon" src="../../static/type-icon2.png" mode=""></image>
+			</view>
+		</view>
+
+		<u-cell-group :border="false">
+			<!-- <u-cell title="优惠券" @click="jump('../../my/coupon/index')" :border="false" :isLink="true" arrow-direction="right">
+				<image slot="icon" class="cell-icon" src="../../static/icon7.png" mode=""></image>
+			</u-cell> -->
+			<u-cell title="研学MBTI测试"  @click="jump('../../study/test')" :border="false" :isLink="true" arrow-direction="right">
+				<image slot="icon" class="cell-icon" src="../../static/icon8.png" mode=""></image>
+			</u-cell>
+		</u-cell-group>
+
+
+
+	</view>
+</template>
+
+<script>
+	import {
+		getUserDetail
+	} from '@/api/common.js'
+	export default {
+		data() {
+			return {
+				active: 1,
+				keyword: '',
+				userId: '',
+				loading: false,
+				status: 'more',
+				defaultImg: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fci.xiaohongshu.com%2Fc34b7b74-ba38-0456-982a-43c0f97522fe%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fci.xiaohongshu.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1693532127&t=a2e186c12aecaab7723611cb52a6778f',
+				userInfo: {
+					imgPath: null,
+					lastLogin: "",
+					level: null,
+					nickname: null,
+					openId: "",
+					phoneNum: "",
+					sex: 0,
+					userId: "",
+					valid: 0
+				},
+
+			}
+		},
+		onShow() {
+			if (uni.getStorageSync('token')) {
+				this.getUserDetail()
+			}else{
+				this.userInfo = {
+					imgPath: null,
+					lastLogin: "",
+					level: null,
+					nickname: null,
+					openId: "",
+					phoneNum: "",
+					sex: 0,
+					userId: "",
+					valid: 0
+				},
+				uni.showModal({
+					title:'请登录',
+					confirmText:'去登录',
+					success(res){
+						console.log(res);
+						if(res.confirm){
+							uni.navigateTo({
+								url:'../../login/login/login'
+							})
+						}
+					}
+				})
+			}
+
+		},
+		onLoad() {
+
+		},
+		
+		methods: {
+			filterMeal(val) {
+				if(val == 1){
+					return '#3E5C91'
+				}else if(val == 2){
+					return '#FF532A'
+				}else if(val == 3){
+					return '#F3CC90'
+				}
+			},
+			// 点击设置
+			setting() {
+				if (uni.getStorageSync('token')) {
+					uni.navigateTo({
+						url: '../../my/edit/edit'
+					})
+				} else {
+					uni.showModal({
+						title:'请登录',
+						confirmText:'去登录',
+						success(res){
+							console.log(res);
+							if(res.confirm){
+								uni.navigateTo({
+									url:'../../login/login/login?redirect=/pages/my/index'
+								})
+							}
+						}
+					})
+				}
+			},
+
+			jump(url) {
+				if(!uni.getStorageSync('token')){
+					return uni.showModal({
+						title:'请登录',
+						confirmText:'去登录',
+						success(res){
+							console.log(res);
+							if(res.confirm){
+								uni.navigateTo({
+									url:'../../login/login/login?redirect=/pages/my/index'
+								})
+							}
+						}
+					})
+				}
+				uni.navigateTo({
+					url
+				})
+			},
+
+			// 获取用户详情
+			getUserDetail() {
+				getUserDetail().then(res => {
+					if(res.state == 'Success'){
+						this.userInfo = res.content
+						uni.setStorageSync('userInfo', JSON.stringify(this.userInfo))
+					}
+				})
+			},
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	.my {
+		height: 100vh;
+		padding: 0 30rpx;
+		background: #F9F9F9;
+
+		.top-box {
+			width: 750rpx;
+			height: 460rpx;
+			margin-left: -30rpx;
+			padding: 150rpx 30rpx 0;
+			box-sizing: border-box;
+			background: url('../../static/top-bg.png') no-repeat;
+			background-size: 100% 500rpx;
+			position: relative;
+
+			.user-info {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				padding: 15rpx 0;
+				color: #222222;
+
+				.image {
+					width: 108rpx;
+					height: 108rpx;
+					background: #f1f1f1;
+					border-radius: 50%;
+				}
+
+				.info {
+					flex: 1;
+					margin-left: 30rpx;
+
+					.user-name {
+						font-size: 32rpx;
+						font-weight: bold;
+					}
+
+					.tel {
+						font-size: 24rpx;
+						margin-top: 10rpx;
+					}
+				}
+
+				.setting {
+					width: 60rpx;
+					height: 60rpx;
+				}
+			}
+
+			.level-box {
+				position: absolute;
+				left: 0;
+				bottom: 0;
+				padding: 0 35rpx 22rpx;
+				width: 750rpx;
+				box-sizing: border-box;
+				
+				.level-content {
+					width: 686rpx;
+					height: 100rpx;
+					position: absolute;
+					bottom: 0rpx;
+					left: 50%;
+					transform: translateX(-50%);
+
+					.level {
+						width: 100%;
+						height: 100%;
+					}
+
+					.num {
+						font-size: 28rpx;
+						color: #F3CC90;
+						position: absolute;
+						right: 25rpx;
+						top: 50%;
+						transform: translateY(-50%);
+					}
+				}
+			}
+
+		}
+
+		.btn-group {
+			display: flex;
+			align-items: center;
+			padding: 30rpx 20rpx;
+			margin-top: 20rpx;
+			border-radius: 16rpx;
+			background: #fff;
+			width: 690rpx;
+			box-sizing: border-box;
+
+			.item {
+				flex: 1;
+				display: flex;
+				flex-direction: column;
+				align-items: center;
+
+				.icon {
+					width: 100rpx;
+					height: 100rpx;
+				}
+
+				.label {
+					font-size: 24rpx;
+					color: #121212;
+				}
+			}
+		}
+
+		.type-box {
+			display: flex;
+			justify-content: space-between;
+
+			.type-item {
+				width: 335rpx;
+				border-radius: 16rpx;
+				background: #FFFFFF;
+				padding: 32rpx 24rpx;
+				margin-top: 20rpx;
+				box-sizing: border-box;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+
+				.left {
+					.title {
+						font-weight: bold;
+						color: #181818;
+						font-size: 32rpx;
+					}
+
+					.desc {
+						color: #AAAAAA;
+						font-size: 24rpx;
+						margin-top: 16rpx;
+					}
+				}
+
+				.icon {
+					width: 80rpx;
+					height: 80rpx;
+				}
+			}
+		}
+
+		.cell-icon {
+			width: 48rpx;
+			height: 48rpx;
+		}
+
+		.u-cell-group {
+			margin-top: 20rpx;
+			background: #fff;
+		}
+	}
+</style>

pages/my/index.vue

@@ -1,376 +1,291 @@
 <template>
-	<view class="my">
-
-		<view class="top-box">
-
-			<view class="user-info">
-				<image class="image" :src="userInfo.imgPath || defaultImg" lazy-load mode=""></image>
-				<view class="info">
-					<view class="user-name">{{userInfo.nickname ||'用户'}}</view>
-					<view class="tel">{{userInfo.phoneNum ||'-'}}</view>
-				</view>
-				<image class="setting" src="../../static/setting.png" @click="setting" mode=""></image>
-			</view>
-			<view class="level-box">
-				<view class="level-content">
-					<image class="level" :src="`../../static/level${userInfo.setMealId || 0}.png`" mode=""></image>
-					<view class="num" :style="{color:filterMeal(userInfo.setMealId)}">
-						已为您节省0元
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="btn-group">
-			<view class="item" @click="jump('../../my/order/index')">
-
-				<image class="icon" src="../../static/icon1.png" mode=""></image>
-				<view class="label">
-					全部订单
-				</view>
-			</view>
-			<view class="item" @click="jump('../../my/order/index?type=WAIT_PAYMENT')">
-				<image class="icon" src="../../static/icon2.png" mode=""></image>
-				<view class="label">
-					待付款
-				</view>
-			</view>
-			<view class="item" @click="jump('../../my/order/index?type=WAIT_USE')">
-				<image class="icon" src="../../static/icon3.png" mode=""></image>
-				<view class="label">
-					待使用
-				</view>
-			</view>
-			<view class="item" @click="jump('../../my/order/index?type=APPLY_REFUND')">
-				<image class="icon" src="../../static/icon4.png" mode=""></image>
-				<view class="label">
-					退款
-				</view>
-			</view>
-		</view>
-
-		<view class="type-box">
-			<view class="type-item"  @click="jump('../../my/memberCenter/index')">
-				<view class="left">
-					<view class="title">
-						会员中心
-					</view>
-					<view class="desc">
-						会员享受更多优惠
-					</view>
-				</view>
-				<image class="icon" src="../../static/type-icon1.png" mode=""></image>
-			</view>
-			<view class="type-item" @click="jump('/invite/index')">
-				<view class="left">
-					<view class="title">
-						推广邀请
-					</view>
-					<view class="desc">
-						百万佣金发放中
-					</view>
-				</view>
-				<image class="icon" src="../../static/type-icon2.png" mode=""></image>
-			</view>
-		</view>
-
-		<u-cell-group :border="false">
-			<!-- <u-cell title="优惠券" @click="jump('../../my/coupon/index')" :border="false" :isLink="true" arrow-direction="right">
-				<image slot="icon" class="cell-icon" src="../../static/icon7.png" mode=""></image>
-			</u-cell> -->
-			<u-cell title="研学MBTI测试"  @click="jump('../../study/test')" :border="false" :isLink="true" arrow-direction="right">
-				<image slot="icon" class="cell-icon" src="../../static/icon8.png" mode=""></image>
-			</u-cell>
-		</u-cell-group>
-
-
-
-	</view>
+  <view class="content">
+    <view :style="{ paddingTop: navBarHeight }" class="profile-box">
+      <view class="header">
+        <view class="avatar">
+          <image
+            :src="userInfo.imgPath || defaultImg"
+            mode="aspectFill"
+            class="avatar-img"
+          />
+        </view>
+
+        <view class="info">
+          <view class="name">
+            <text>{{ userInfo.nickname || "用户" }}</text>
+          </view>
+          <view class="desc">
+            <text>{{ userInfo.phoneNum || "请先登录" }}</text>
+          </view>
+        </view>
+      </view>
+
+      <view class="vip-card">
+        <!-- <view class="vip-title">会员专属</view> -->
+        <view class="vip-btn">开通</view>
+      </view>
+    </view>
+    <view
+      style="font-size: 34rpx; font-weight: bold; margin: 30rpx 0 20rpx 30rpx"
+      >我的订单</view
+    >
+    <u-grid :border="false" col="5" @click="click">
+      <u-grid-item
+        v-for="(baseListItem, baseListIndex) in baseList"
+        :key="baseListIndex"
+      >
+        <!-- <u-icon
+          :customStyle="{ paddingTop: 20 + 'rpx' }"
+          :name="baseListItem.name"
+          :size="50"
+        ></u-icon> -->
+        <image
+          style="height: 50rpx; width: 50rpx; padding-top: 20rpx"
+          :src="baseListItem.src"
+        >
+        </image>
+        <text class="grid-text">{{ baseListItem.title }}</text>
+      </u-grid-item>
+    </u-grid>
+    <view
+      style="font-size: 34rpx; font-weight: bold; margin: 30rpx 0 0 30rpx"
+    >
+      常用功能
+    </view>
+    <view class="setting">
+      <u-cell-group :border="false">
+        <u-cell
+          class="setting-cell"
+          v-for="item in settingList"
+          :rightIconStyle="{ fontSize: '15px' }"
+          :isLink="true"
+          :border="false"
+          :title="item.title"
+        >
+        </u-cell>
+      </u-cell-group>
+    </view>
+    <view class="btn-box"> 退出 </view>
+    <zs-tab-bar :value="3"></zs-tab-bar>
+  </view>
 </template>
 
 <script>
-	import {
-		getUserDetail
-	} from '@/api/common.js'
-	export default {
-		data() {
-			return {
-				active: 1,
-				keyword: '',
-				userId: '',
-				loading: false,
-				status: 'more',
-				defaultImg: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fci.xiaohongshu.com%2Fc34b7b74-ba38-0456-982a-43c0f97522fe%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fci.xiaohongshu.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1693532127&t=a2e186c12aecaab7723611cb52a6778f',
-				userInfo: {
-					imgPath: null,
-					lastLogin: "",
-					level: null,
-					nickname: null,
-					openId: "",
-					phoneNum: "",
-					sex: 0,
-					userId: "",
-					valid: 0
-				},
-
-			}
-		},
-		onShow() {
-			if (uni.getStorageSync('token')) {
-				this.getUserDetail()
-			}else{
-				this.userInfo = {
-					imgPath: null,
-					lastLogin: "",
-					level: null,
-					nickname: null,
-					openId: "",
-					phoneNum: "",
-					sex: 0,
-					userId: "",
-					valid: 0
-				},
-				uni.showModal({
-					title:'请登录',
-					confirmText:'去登录',
-					success(res){
-						console.log(res);
-						if(res.confirm){
-							uni.navigateTo({
-								url:'../../login/login/login'
-							})
-						}
-					}
-				})
-			}
-
-		},
-		onLoad() {
-
-		},
-		
-		methods: {
-			filterMeal(val) {
-				if(val == 1){
-					return '#3E5C91'
-				}else if(val == 2){
-					return '#FF532A'
-				}else if(val == 3){
-					return '#F3CC90'
-				}
-			},
-			// 点击设置
-			setting() {
-				if (uni.getStorageSync('token')) {
-					uni.navigateTo({
-						url: '../../my/edit/edit'
-					})
-				} else {
-					uni.showModal({
-						title:'请登录',
-						confirmText:'去登录',
-						success(res){
-							console.log(res);
-							if(res.confirm){
-								uni.navigateTo({
-									url:'../../login/login/login?redirect=/pages/my/index'
-								})
-							}
-						}
-					})
-				}
-			},
-
-			jump(url) {
-				if(!uni.getStorageSync('token')){
-					return uni.showModal({
-						title:'请登录',
-						confirmText:'去登录',
-						success(res){
-							console.log(res);
-							if(res.confirm){
-								uni.navigateTo({
-									url:'../../login/login/login?redirect=/pages/my/index'
-								})
-							}
-						}
-					})
-				}
-				uni.navigateTo({
-					url
-				})
-			},
-
-			// 获取用户详情
-			getUserDetail() {
-				getUserDetail().then(res => {
-					if(res.state == 'Success'){
-						this.userInfo = res.content
-						uni.setStorageSync('userInfo', JSON.stringify(this.userInfo))
-					}
-				})
-			},
-			
-		}
-	}
+import { getUserDetail } from "@/api/common.js";
+export default {
+  data() {
+    return {
+      navBarHeight: 0,
+      inOpter: false,
+      defaultImg:
+        "https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fci.xiaohongshu.com%2Fc34b7b74-ba38-0456-982a-43c0f97522fe%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fci.xiaohongshu.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1693532127&t=a2e186c12aecaab7723611cb52a6778f",
+      userInfo: {
+        nickName: "用户12332111",
+        type: "尊享会员",
+      },
+      baseList: [
+        {
+          name: "order",
+          title: "全部",
+          src: "/static/icon/my/all.png",
+        },
+        {
+          name: "red-packet",
+          title: "待付款",
+          src: "/static/icon/my/obligations.png",
+        },
+        {
+          name: "car",
+          title: "待发货",
+          src: "/static/icon/my/shipments.png",
+        },
+        {
+          name: "bag",
+          title: "待收货",
+          src: "/static/icon/my/receiving.png",
+        },
+        {
+          name: "rmb-circle",
+          title: "退款",
+          src: "/static/icon/my/refund.png",
+        },
+      ],
+      settingList: [
+        // 会员码 、 收获地址 、 我的收藏 、 我的优惠券
+        {
+          name: "vip",
+          title: "会员码",
+        },
+        {
+          name: "location",
+          title: "收货地址",
+        },
+        {
+          name: "heart",
+          title: "我的收藏",
+        },
+        {
+          name: "coupon",
+          title: "我的优惠券",
+        },
+      ],
+    };
+  },
+  created() {
+    this.navBarHeight = this.$navHight();
+  },
+  onShow() {
+    if (uni.getStorageSync("token")) {
+      this.getUserDetail();
+    } else {
+      (this.userInfo = {
+        imgPath: null,
+        lastLogin: "",
+        level: null,
+        nickname: null,
+        openId: "",
+        phoneNum: "",
+        sex: 0,
+        userId: "",
+        valid: 0,
+      }),
+        uni.showModal({
+          title: "请登录",
+          confirmText: "去登录",
+          success(res) {
+            console.log(res);
+            if (res.confirm) {
+              uni.navigateTo({
+                url: "../../login/login/login",
+              });
+            }
+          },
+        });
+    }
+  },
+  methods: {
+    // 获取用户详情
+    getUserDetail() {
+      getUserDetail().then((res) => {
+        if (res.state == "Success") {
+          this.userInfo = res.content;
+          uni.setStorageSync("userInfo", JSON.stringify(this.userInfo));
+        }
+      });
+    },
+  },
+};
 </script>
-
-<style lang="scss">
-	.my {
-		height: 100vh;
-		padding: 0 30rpx;
-		background: #F9F9F9;
-
-		.top-box {
-			width: 750rpx;
-			height: 460rpx;
-			margin-left: -30rpx;
-			padding: 150rpx 30rpx 0;
-			box-sizing: border-box;
-			background: url('../../static/top-bg.png') no-repeat;
-			background-size: 100% 500rpx;
-			position: relative;
-
-			.user-info {
-				display: flex;
-				align-items: center;
-				justify-content: space-between;
-				padding: 15rpx 0;
-				color: #222222;
-
-				.image {
-					width: 108rpx;
-					height: 108rpx;
-					background: #f1f1f1;
-					border-radius: 50%;
-				}
-
-				.info {
-					flex: 1;
-					margin-left: 30rpx;
-
-					.user-name {
-						font-size: 32rpx;
-						font-weight: bold;
-					}
-
-					.tel {
-						font-size: 24rpx;
-						margin-top: 10rpx;
-					}
-				}
-
-				.setting {
-					width: 60rpx;
-					height: 60rpx;
-				}
-			}
-
-			.level-box {
-				position: absolute;
-				left: 0;
-				bottom: 0;
-				padding: 0 35rpx 22rpx;
-				width: 750rpx;
-				box-sizing: border-box;
-				
-				.level-content {
-					width: 686rpx;
-					height: 100rpx;
-					position: absolute;
-					bottom: 0rpx;
-					left: 50%;
-					transform: translateX(-50%);
-
-					.level {
-						width: 100%;
-						height: 100%;
-					}
-
-					.num {
-						font-size: 28rpx;
-						color: #F3CC90;
-						position: absolute;
-						right: 25rpx;
-						top: 50%;
-						transform: translateY(-50%);
-					}
-				}
-			}
-
-		}
-
-		.btn-group {
-			display: flex;
-			align-items: center;
-			padding: 30rpx 20rpx;
-			margin-top: 20rpx;
-			border-radius: 16rpx;
-			background: #fff;
-			width: 690rpx;
-			box-sizing: border-box;
-
-			.item {
-				flex: 1;
-				display: flex;
-				flex-direction: column;
-				align-items: center;
-
-				.icon {
-					width: 100rpx;
-					height: 100rpx;
-				}
-
-				.label {
-					font-size: 24rpx;
-					color: #121212;
-				}
-			}
-		}
-
-		.type-box {
-			display: flex;
-			justify-content: space-between;
-
-			.type-item {
-				width: 335rpx;
-				border-radius: 16rpx;
-				background: #FFFFFF;
-				padding: 32rpx 24rpx;
-				margin-top: 20rpx;
-				box-sizing: border-box;
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-
-				.left {
-					.title {
-						font-weight: bold;
-						color: #181818;
-						font-size: 32rpx;
-					}
-
-					.desc {
-						color: #AAAAAA;
-						font-size: 24rpx;
-						margin-top: 16rpx;
-					}
-				}
-
-				.icon {
-					width: 80rpx;
-					height: 80rpx;
-				}
-			}
-		}
-
-		.cell-icon {
-			width: 48rpx;
-			height: 48rpx;
-		}
-
-		.u-cell-group {
-			margin-top: 20rpx;
-			background: #fff;
-		}
-	}
-</style>
+<style>
+page {
+  background-color: #ffffff;
+}
+</style>
+<style lang="scss" scoped>
+.content {
+  .profile-box {
+    background: url("https://jbm.dev.zonelife.cn/img/background.png") no-repeat;
+    background-size: 100% 100%;
+    overflow: hidden;
+    border-bottom-left-radius: 40% 5%;
+    border-bottom-right-radius: 40% 5%;
+    .header {
+      display: flex;
+      align-items: center;
+      padding: 40rpx;
+      height: 300rpx;
+      .avatar {
+        width: 150rpx;
+        height: 150rpx;
+
+        margin-top: -40rpx;
+        .avatar-img {
+          width: 100%;
+          height: 100%;
+          border-radius: 50%;
+        }
+      }
+    }
+
+    .info {
+      margin-left: 20rpx;
+      display: flex;
+      margin-top: -40rpx;
+      flex-direction: column;
+      justify-content: center;
+
+      .name {
+        font-size: 35rpx;
+        font-weight: bold;
+      }
+
+      .desc {
+        margin-top: 20rpx;
+        width: 85rpx;
+        background: #8b8b8b;
+        font-size: 20rpx;
+        color: white;
+        padding: 5rpx 10rpx;
+        border-radius: 12px;
+      }
+    }
+  }
+
+  .vip-card {
+    display: flex;
+    justify-content: flex-end;
+    margin: -88rpx 20rpx 0 20rpx;
+    padding: 20rpx;
+    height: 80rpx;
+    color: white;
+    background: url("https://jbm.dev.zonelife.cn/img/vip.png") no-repeat;
+    background-size: 100% 100%;
+    border-radius: 10px 10px 0 0;
+
+    .vip-btn {
+      background: #fde9c7;
+      padding: 20rpx 40rpx;
+      line-height: 20rpx;
+      height: 21rpx;
+      color: #d6a873;
+      border-radius: 17px;
+      font-size: 30rpx;
+    }
+  }
+
+  .grid-text {
+    font-size: 14px;
+    color: #909399;
+    padding: 10rpx 0 20rpx 0rpx;
+    /* #ifndef APP-PLUS */
+    box-sizing: border-box;
+    /* #endif */
+  }
+
+  .setting:not(:nth-child(1)) {
+    font-size: 30rpx;
+    font-weight: bold;
+    // margin-top: 40rpx;
+    background-color: white;
+    border-radius: 20px;
+
+    .setting-cell {
+      margin-top: 40rpx;
+    }
+  }
+
+  .btn-box {
+    position: fixed;
+    bottom: 20px;
+    margin-left: 20rpx;
+    width: 90%;
+    height: 80rpx;
+    background-color: white;
+    color: black;
+    padding-left: 30rpx;
+    line-height: 80rpx;
+    font-size: 30rpx;
+    border-radius: 5px;
+  }
+}
+</style>

uni_modules/uni-card/changelog.md

@@ -0,0 +1,26 @@
+## 1.3.1（2021-12-20）
+- 修复 在vue页面下略缩图显示不正常的bug
+## 1.3.0（2021-11-19）
+- 重构插槽的用法 ，header 替换为 title 
+- 新增 actions 插槽
+- 新增 cover 封面图属性和插槽
+- 新增 padding 内容默认内边距离
+- 新增 margin 卡片默认外边距离
+- 新增 spacing 卡片默认内边距
+- 新增 shadow 卡片阴影属性
+- 取消 mode 属性，可使用组合插槽代替
+- 取消 note 属性 ，使用actions插槽代替
+- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
+- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-card](https://uniapp.dcloud.io/component/uniui/uni-card)
+## 1.2.1（2021-07-30）
+- 优化 vue3下事件警告的问题
+## 1.2.0（2021-07-13）
+- 组件兼容 vue3，如何创建vue3项目详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
+## 1.1.8（2021-07-01）
+- 优化 图文卡片无图片加载时，提供占位图标
+- 新增 header 插槽，自定义卡片头部（ 图文卡片 mode="style" 时，不支持）
+- 修复 thumbnail 不存在仍然占位的 bug
+## 1.1.7（2021-05-12）
+- 新增 组件示例地址
+## 1.1.6（2021-02-04）
+- 调整为uni_modules目录规范

uni_modules/uni-card/components/uni-card/uni-card.vue

@@ -0,0 +1,270 @@
+<template>
+	<view class="uni-card" :class="{ 'uni-card--full': isFull, 'uni-card--shadow': isShadow,'uni-card--border':border}"
+		:style="{'margin':isFull?0:margin,'padding':spacing,'box-shadow':isShadow?shadow:''}">
+		<!-- 封面 -->
+		<slot name="cover">
+			<view v-if="cover" class="uni-card__cover">
+				<image class="uni-card__cover-image" mode="widthFix" @click="onClick('cover')" :src="cover"></image>
+			</view>
+		</slot>
+		<slot name="title">
+			<view v-if="title || extra" class="uni-card__header">
+				<!-- 卡片标题 -->
+				<view class="uni-card__header-box" @click="onClick('title')">
+					<view v-if="thumbnail" class="uni-card__header-avatar">
+						<image class="uni-card__header-avatar-image" :src="thumbnail" mode="aspectFit" />
+					</view>
+					<view class="uni-card__header-content">
+						<text class="uni-card__header-content-title uni-ellipsis">{{ title }}</text>
+						<text v-if="title&&subTitle"
+							class="uni-card__header-content-subtitle uni-ellipsis">{{ subTitle }}</text>
+					</view>
+				</view>
+				<view class="uni-card__header-extra" @click="onClick('extra')">
+					<text class="uni-card__header-extra-text">{{ extra }}</text>
+				</view>
+			</view>
+		</slot>
+		<!-- 卡片内容 -->
+		<view class="uni-card__content" :style="{padding:padding}" @click="onClick('content')">
+			<slot></slot>
+		</view>
+		<view class="uni-card__actions" @click="onClick('actions')">
+			<slot name="actions"></slot>
+		</view>
+	</view>
+</template>
+
+<script>
+	/**
+	 * Card 卡片
+	 * @description 卡片视图组件
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=22
+	 * @property {String} title 标题文字
+	 * @property {String} subTitle 副标题
+	 * @property {Number} padding 内容内边距
+	 * @property {Number} margin 卡片外边距
+	 * @property {Number} spacing 卡片内边距
+	 * @property {String} extra 标题额外信息
+	 * @property {String} cover 封面图（本地路径需要引入）
+	 * @property {String} thumbnail 标题左侧缩略图
+	 * @property {Boolean} is-full = [true | false] 卡片内容是否通栏，为 true 时将去除padding值
+	 * @property {Boolean} is-shadow = [true | false] 卡片内容是否开启阴影
+	 * @property {String} shadow 卡片阴影
+	 * @property {Boolean} border 卡片边框
+	 * @event {Function} click 点击 Card 触发事件
+	 */
+	export default {
+		name: 'UniCard',
+		emits: ['click'],
+		props: {
+			title: {
+				type: String,
+				default: ''
+			},
+			subTitle: {
+				type: String,
+				default: ''
+			},
+			padding: {
+				type: String,
+				default: '10px'
+			},
+			margin: {
+				type: String,
+				default: '15px'
+			},
+			spacing: {
+				type: String,
+				default: '0 10px'
+			},
+			extra: {
+				type: String,
+				default: ''
+			},
+			cover: {
+				type: String,
+				default: ''
+			},
+			thumbnail: {
+				type: String,
+				default: ''
+			},
+			isFull: {
+				// 内容区域是否通栏
+				type: Boolean,
+				default: false
+			},
+			isShadow: {
+				// 是否开启阴影
+				type: Boolean,
+				default: true
+			},
+			shadow: {
+				type: String,
+				default: '0px 0px 3px 1px rgba(0, 0, 0, 0.08)'
+			},
+			border: {
+				type: Boolean,
+				default: true
+			}
+		},
+		methods: {
+			onClick(type) {
+				this.$emit('click', type)
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	$uni-border-3: #EBEEF5 !default;
+	$uni-shadow-base:0 0px 6px 1px rgba($color: #a5a5a5, $alpha: 0.2) !default;
+	$uni-main-color: #3a3a3a !default;
+	$uni-base-color: #6a6a6a !default;
+	$uni-secondary-color: #909399 !default;
+	$uni-spacing-sm: 0px !default;
+	$uni-border-color:$uni-border-3;
+	$uni-shadow: $uni-shadow-base;
+	$uni-card-title: 15px;
+	$uni-cart-title-color:$uni-main-color;
+	$uni-card-subtitle: 12px;
+	$uni-cart-subtitle-color:$uni-secondary-color;
+	$uni-card-spacing: 10px;
+	$uni-card-content-color: $uni-base-color;
+
+	.uni-card {
+		margin: $uni-card-spacing;
+		padding: 0 $uni-spacing-sm;
+		border-radius: 10px;
+		overflow: hidden;
+		font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif;
+		background-color: #fff;
+		flex: 1;
+
+		.uni-card__cover {
+			position: relative;
+			margin-top: $uni-card-spacing;
+			flex-direction: row;
+			overflow: hidden;
+			border-radius: 4px;
+			.uni-card__cover-image {
+				flex: 1;
+				// width: 100%;
+				/* #ifndef APP-PLUS */
+				vertical-align: middle;
+				/* #endif */
+			}
+		}
+
+		.uni-card__header {
+			display: flex;
+			border-bottom: 1px $uni-border-color solid;
+			flex-direction: row;
+			align-items: center;
+			padding: $uni-card-spacing;
+			overflow: hidden;
+
+			.uni-card__header-box {
+				/* #ifndef APP-NVUE */
+				display: flex;
+				/* #endif */
+				flex: 1;
+				flex-direction: row;
+				align-items: center;
+				overflow: hidden;
+			}
+
+			.uni-card__header-avatar {
+				width: 40px;
+				height: 40px;
+				overflow: hidden;
+				border-radius: 5px;
+				margin-right: $uni-card-spacing;
+				.uni-card__header-avatar-image {
+					flex: 1;
+					width: 40px;
+					height: 40px;
+				}
+			}
+
+			.uni-card__header-content {
+				/* #ifndef APP-NVUE */
+				display: flex;
+				/* #endif */
+				flex-direction: column;
+				justify-content: center;
+				flex: 1;
+				// height: 40px;
+				overflow: hidden;
+
+				.uni-card__header-content-title {
+					font-size: $uni-card-title;
+					color: $uni-cart-title-color;
+					// line-height: 22px;
+				}
+
+				.uni-card__header-content-subtitle {
+					font-size: $uni-card-subtitle;
+					margin-top: 5px;
+					color: $uni-cart-subtitle-color;
+				}
+			}
+
+			.uni-card__header-extra {
+				line-height: 12px;
+
+				.uni-card__header-extra-text {
+					font-size: 12px;
+					color: $uni-cart-subtitle-color;
+				}
+			}
+		}
+
+		.uni-card__content {
+			padding: $uni-card-spacing;
+			font-size: 14px;
+			color: $uni-card-content-color;
+			line-height: 22px;
+		}
+
+		.uni-card__actions {
+			font-size: 12px;
+		}
+	}
+
+	.uni-card--border {
+		border: 1px solid $uni-border-color;
+	}
+
+	.uni-card--shadow {
+		position: relative;
+		/* #ifndef APP-NVUE */
+		box-shadow: $uni-shadow;
+		/* #endif */
+	}
+
+	.uni-card--full {
+		margin: 0;
+		border-left-width: 0;
+		border-left-width: 0;
+		border-radius: 0;
+	}
+
+	/* #ifndef APP-NVUE */
+	.uni-card--full:after {
+		border-radius: 0;
+	}
+
+	/* #endif */
+	.uni-ellipsis {
+		/* #ifndef APP-NVUE */
+		overflow: hidden;
+		white-space: nowrap;
+		text-overflow: ellipsis;
+		/* #endif */
+		/* #ifdef APP-NVUE */
+		lines: 1;
+		/* #endif */
+	}
+</style>

uni_modules/uni-card/package.json

@@ -0,0 +1,90 @@
+{
+  "id": "uni-card",
+  "displayName": "uni-card 卡片",
+  "version": "1.3.1",
+  "description": "Card 组件，提供常见的卡片样式。",
+  "keywords": [
+    "uni-ui",
+    "uniui",
+    "card",
+    "",
+    "卡片"
+],
+  "repository": "https://github.com/dcloudio/uni-ui",
+  "engines": {
+    "HBuilderX": ""
+  },
+  "directories": {
+    "example": "../../temps/example_temps"
+  },
+  "dcloudext": {
+    "category": [
+      "前端组件",
+      "通用组件"
+    ],
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
+  },
+  "uni_modules": {
+    "dependencies": [
+			"uni-icons",
+			"uni-scss"
+		],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y"
+      },
+      "client": {
+        "App": {
+          "app-vue": "y",
+          "app-nvue": "y"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "y",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "y",
+          "百度": "y",
+          "字节跳动": "y",
+          "QQ": "y"
+        },
+        "快应用": {
+          "华为": "u",
+          "联盟": "u"
+        },
+        "Vue": {
+            "vue2": "y",
+            "vue3": "y"
+        }
+      }
+    }
+  }
+}

uni_modules/uni-card/readme.md

@@ -0,0 +1,12 @@
+
+
+## Card 卡片
+> **组件名：uni-card**
+> 代码块： `uCard`
+
+卡片视图组件。
+
+### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-card)
+#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839 
+
+

uni_modules/uview-ui/components/u-tabbar/u-tabbar.vue

@@ -120,7 +120,7 @@
 		@include flex(column);
 		flex: 1;
 		justify-content: center;
-		
+		border-radius: 120rpx;
 		&__content {
 			@include flex(column);
 			background-color: #fff;

utils/config.js

@@ -1,5 +1,5 @@
 // export const BASE_URL = 'https://api.dev.zonelife.cn';
-export const BASE_URL = 'https://api.zonelife.cn';
+export let BASE_URL = 'https://api.dev.zonelife.cn';
 
 // export const SHOP_ID = '65aa19c3e2cc5b1095f087fc';//测试视频会员店铺
 export const SHOP_ID = '65aa17f980f6d56f44643a1f';//生产视频会员店铺

utils/request.js

@@ -12,6 +12,13 @@ export const request = (options) => {
 			//请求路径拼接，，其中options.url就是通过下面方法myRequest获取到接口部分的url
 			//method--请求方法，不是method的post就是get
 			//请求的参数，当没有参数的时候就是空对象
+			// BASE_URL = BASE_UR.includes('dev') ? 
+			let BASE_URL = BASE_URL || '';
+			if(options.url.includes('/zswl-cloud-shop')){
+				BASE_URL = 'http://g3710170f8.zicp.fun'
+				options.url =	options.url.replace("/zswl-cloud-shop","")
+			}
+
 			uni.request({
 					url: BASE_URL + options.url,
 					method: options.method || 'GET',
@@ -20,30 +27,39 @@ export const request = (options) => {
 						accessToken: uni.getStorageSync('token')
 					},
 					success: (res) => {
+						
 						if (res.statusCode !== 200) {
+
 							return uni.showToast({
 								title: '获取失败'
 							})
+
 							// uni.hideLoading()
 						} else if (res.data.msg != '成功') { //接口返回报错
+
 							uni.showToast({
 								title: res.data.content || res.data.msg || res.data.exception.message || '请求失败',
 								icon: 'error'
 							})
+
 							console.log('报错：', res);
 
 							// token过期或出了问题
 							if (res.data.exception && res.data.exception.type ==
-								'AuthenticationCredentialsNotFoundException') {
+								'AuthenticationCredentialsNotFoundException')
+								 {
+
 									uni.showLoading({
 										title: '刷新登录中',
 									})
+
 								if (!uni.getStorageSync('refreshToken')) {
 									uni.clearStorageSync()
 									uni.reLaunch({
 										url: '/pages/index/index'
 									})
 								}
+
 								// 刷新token
 								uni.request({
 										url: BASE_URL + '/zswl-cloud-bdb/user/refreshToken',
@@ -79,6 +95,7 @@ export const request = (options) => {
 										}
 									}
 								})
+
 						}
 
 					}

utils/tool.js

@@ -60,3 +60,16 @@ export const rpxTopx = function (rpx) {
 			let px = rpx *( width / 750 );
 			return px
 		}
+		
+export const getNavHight = function (f) {
+  //#ifndef H5 || MP-ALIPAY ||APP-PLUS
+  //获取小程序胶囊的高度
+  let { bottom, height } = uni.getMenuButtonBoundingClientRect();
+  // this.height = height;
+  this.navBareight = bottom;
+  if(f){
+    return bottom;
+  }
+  return bottom + 'px';
+  //#endif
+};