商城首页修改

.idea/sonarlint/issuestore/index.pb

@@ -1,3 +1,35 @@
 
 A
-package-lock.json,f\a\fa288d1472d29beccb489a676f68739ad365fc47
+package-lock.json,f\a\fa288d1472d29beccb489a676f68739ad365fc47
+D
+pages/home/index.vue,7\0\703d8bfeb22c8122000fd66b7c22579ae1b482eb
+I
+common/styles/common.scss,9\6\968bb55ac9337975ca70fa40d45e5b563fe2f0ce
+D
+pages/home/config.js,c\7\c7c5e2324e182a769600a86839b1cf86367f90a0
+N
+pages/home/dashboard/index.vue,1\d\1d6720cc765400540632b2e41f6370505fe95410
+7
+App.vue,f\d\fd280706c6e8f82ed680b651f54ccb82cb52900b
+7
+main.js,c\4\c4a4248f7568c9e41265502c39b0daeb8b635431
+:
+
+index.html,f\6\f6013a00b362253c64368d6eebc50ea2131754e2
+<
+package.json,7\0\7030d0b2f71b999ff89a343de08c414af32fc93a
+\
+,node_modules/vue-jsonp/dist/utils/index.d.ts,d\b\dbf96ebaad7be68a696625f27816c223070b4463
+:
+
+pages.json,8\6\86814244647b75d08ef4f03505e39e2b725a57f9
+E
+pages/home/index.vue2,0\e\0ec286dec1d8ebf68897bf8c60f43ff0e1332c9f
+E
+pages/home/index2.vue,3\4\347a9e6b82014c47d510058e2e295e3866213418
+[
++uview-ui1/components/u1-tabbar/u-tabbar.vue,e\7\e704933ea2965b514372e43d9e044e12f46406ed
+S
+#.idea/sonarlint/issuestore/index.pb,9\f\9fe84ebb15faf917b7def6236dba604453cc61e0
+]
+-.idea/sonarlint/securityhotspotstore/index.pb,8\8\88a9255124c95bdc913197c120a8d560edc59c8e

.idea/sonarlint/securityhotspotstore/index.pb

@@ -1,3 +1,35 @@
 
 A
-package-lock.json,f\a\fa288d1472d29beccb489a676f68739ad365fc47
+package-lock.json,f\a\fa288d1472d29beccb489a676f68739ad365fc47
+D
+pages/home/index.vue,7\0\703d8bfeb22c8122000fd66b7c22579ae1b482eb
+I
+common/styles/common.scss,9\6\968bb55ac9337975ca70fa40d45e5b563fe2f0ce
+D
+pages/home/config.js,c\7\c7c5e2324e182a769600a86839b1cf86367f90a0
+N
+pages/home/dashboard/index.vue,1\d\1d6720cc765400540632b2e41f6370505fe95410
+7
+App.vue,f\d\fd280706c6e8f82ed680b651f54ccb82cb52900b
+7
+main.js,c\4\c4a4248f7568c9e41265502c39b0daeb8b635431
+:
+
+index.html,f\6\f6013a00b362253c64368d6eebc50ea2131754e2
+<
+package.json,7\0\7030d0b2f71b999ff89a343de08c414af32fc93a
+\
+,node_modules/vue-jsonp/dist/utils/index.d.ts,d\b\dbf96ebaad7be68a696625f27816c223070b4463
+:
+
+pages.json,8\6\86814244647b75d08ef4f03505e39e2b725a57f9
+E
+pages/home/index.vue2,0\e\0ec286dec1d8ebf68897bf8c60f43ff0e1332c9f
+E
+pages/home/index2.vue,3\4\347a9e6b82014c47d510058e2e295e3866213418
+[
++uview-ui1/components/u1-tabbar/u-tabbar.vue,e\7\e704933ea2965b514372e43d9e044e12f46406ed
+S
+#.idea/sonarlint/issuestore/index.pb,9\f\9fe84ebb15faf917b7def6236dba604453cc61e0
+]
+-.idea/sonarlint/securityhotspotstore/index.pb,8\8\88a9255124c95bdc913197c120a8d560edc59c8e

App.vue

@@ -1,29 +1,28 @@
 <script>
-	import * as api from 'common/api/index.js'
-	import {
-		getConfig
-	} from "@/common/api/common.js";
-	const getConfigData = () => {
-		api.getConfig()
-			.then((res) => {
-				if (res.code == 200) {
-					uni.setStorageSync("configs", res.data)
-					console.log("getConfig=>", res.data);
-				}
-			})
-			.catch((err) => {});
-	}
-	export default {
-		onLaunch: async (options) => {
-			console.log("App Launch");
-			uni.hideTabBar()
-			getConfigData()
-		},
-		onShow: function() {
-			console.log("App Show");
-		},
-		onHide: function() {
-			console.log("App Hide");
+import * as api from 'common/api/index.js'
+
+const getConfigData = () => {
+  api.getConfig()
+      .then((res) => {
+        if (res.code == 200) {
+          uni.setStorageSync("configs", res.data)
+          console.log("getConfig=>", res.data);
+        }
+      })
+      .catch((err) => {
+      });
+}
+export default {
+  onLaunch: async (options) => {
+    console.log("App Launch");
+    uni.hideTabBar()
+    getConfigData()
+  },
+  onShow: function () {
+    console.log("App Show");
+  },
+  onHide: function () {
+    console.log("App Hide");
 		},
 	};
 </script>
@@ -48,4 +47,4 @@
 			// box-sizing: border-box;
 		}
 	}
-</style>
+</style>

common/styles/common.scss

@@ -331,7 +331,6 @@ ol, ul {
 }
 
 .search-box {
-	width: 710rpx;
 	margin: 0 auto 20rpx;
 	height: 61rpx;
 	background: #FDFDFD;
@@ -391,5 +390,5 @@ ol, ul {
 	font-size: 22rpx;
 	color: #C9161E;
 	background-color: rgba(#C9161E, 0.08);
-	
-}
+
+}

main.js

@@ -7,6 +7,11 @@ import $U from 'common/utils/util.js'
 import $C from 'common/utils/config.js'
 import * as api from 'common/api/index.js'
 import moment from 'moment'
+// #ifndef VUE3
+// #ifdef VUE3
+import Vue, {createSSRApp} from 'vue'
+// 解决百度地图跨域问题
+import {VueJsonp} from 'vue-jsonp'
 
 
 Vue.use(uView1)
@@ -21,8 +26,6 @@ Vue.prototype.$U = $U
 Vue.prototype.$C = $C
 Vue.prototype.$moment = moment
 
-// #ifndef VUE3
-import Vue from 'vue'
 Vue.config.productionTip = false
 // 工具函数
 Object.keys(tools).forEach(key => {
@@ -41,14 +44,9 @@ app.$mount()
 // })
 
 // #endif
-
-// 解决百度地图跨域问题
-import { VueJsonp } from 'vue-jsonp'
 Vue.use(VueJsonp)
 
 
-// #ifdef VUE3
-import { createSSRApp } from 'vue'
 export function createApp() {
 	const app = createSSRApp(App)
 	return { app }

package-lock.json

@@ -15,6 +15,11 @@
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.11.tgz",
       "integrity": "sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ=="
     },
+    "@vant/weapp": {
+      "version": "1.11.7",
+      "resolved": "https://registry.npmmirror.com/@vant/weapp/-/weapp-1.11.7.tgz",
+      "integrity": "sha512-Rwn9BBnb4kHSV4XmvBicwtd42J+amEUfnFDcXJsGNPNX4a9c/DoT6YLsm4X1wB2+sQbdiQsbFBLAvGRBxCkD8g=="
+    },
     "ajv": {
       "version": "6.12.6",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
@@ -287,6 +292,11 @@
         "base64-arraybuffer": "^1.0.2"
       }
     },
+    "vant-weapp": {
+      "version": "0.5.29",
+      "resolved": "https://registry.npmmirror.com/vant-weapp/-/vant-weapp-0.5.29.tgz",
+      "integrity": "sha512-RMc0Ga914XFwspw2WuOMU8bOHlIkua8X1DoQ/KPnGQzjwT1uEL4S7W186EmaHF1wN2krB9BVd0LdRRt39dGh6Q=="
+    },
     "vconsole": {
       "version": "3.14.6",
       "resolved": "https://registry.npmjs.org/vconsole/-/vconsole-3.14.6.tgz",

package.json

@@ -1,9 +1,11 @@
 {
   "dependencies": {
+    "@vant/weapp": "^1.11.7",
     "dayjs": "^1.11.9",
     "html2canvas": "^1.4.1",
     "js-md5": "^0.7.3",
     "moment": "^2.29.4",
+    "vant-weapp": "^0.5.29",
     "vconsole": "^3.14.6",
     "vue-baidu-map": "^0.21.22",
     "vue-jsonp": "^2.0.0",

pages.json

@@ -4,7 +4,7 @@
 		"^u-(.*)": "@/components/uview-ui/components/u-$1/u-$1.vue"
 	},
 	"pages": [
-		//pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
+
 		{
 			"path": "pages/home/dashboard/index",
 			"style": {
@@ -12,7 +12,6 @@
 				"navigationStyle": "custom",
 				"enablePullDownRefresh": false,
 				"app-plus": {
-					// 将回弹属性关掉
 					"bounce": "none"
 				}
 			}
@@ -26,7 +25,6 @@
 				"enablePullDownRefresh": false,
 				"navigationStyle": "custom",
 				"app-plus": {
-					// 将回弹属性关掉
 					"bounce": "none"
 				}
 			}
@@ -457,7 +455,16 @@
 		"navigationBarTitleText": "六感熟眠商城",
 		"navigationBarBackgroundColor": "#FFFFFF",
 		"fontSize": "13px",
-		"backgroundColor": "#F8F8F8"
+		"backgroundColor": "#F8F8F8",
+		"usingComponents": {
+			"van-button": "/wxcomponents/vant/dist/button/index",
+			"van-tab": "/wxcomponents/vant/dist/tab/index",
+			"van-row": "/wxcomponents/vant/dist/row/index",
+			"van-col": "/wxcomponents/vant/dist/col/index",
+			"van-tabs": "/wxcomponents/vant/dist/tabs/index",
+			"van-image": "/wxcomponents/vant/dist/image/index"
+			// 其他需要全局引入的组件
+		}
 		// "navigationStyle": "custom"
 	},
 	"condition": { //模式配置，仅开发期间生效
@@ -468,4 +475,4 @@
 			// "query": "id=5" //启动参数，在页面的onLoad函数里面得到
 		}]
 	}
-}
+}

pages/home/index.vue

@@ -1,905 +1,886 @@
 <template>
-	<view class="ps-wrapper">
-		<view class="header-box" :class="[mpCommonClass]" :style="{
+  <view class="ps-wrapper">
+    <view id="headerBox" ref="headerBox" :class="[mpCommonClass]" :style="{
         background: `url(${bgImg}) no-repeat center top`,
         backgroundSize: '100% 400rpx',
         backgroundColor: '#F7F7F7',
-      }" id="headerBox" ref="headerBox">
-			<!-- <view class="qr-code" :style="{ paddingTop: statusBarHeight * 2 + 'rpx' }"> -->
-			<view class="qr-code" v-if="!mpCommonClass" :style="{
-          height: `${topData.height}px`,
-		  display:'block',
-          paddingTop: `${topData.top}px`,
-					background: `url(${logoImg}) no-repeat center center`,
-					backgroundSize: `300rpx 88rpx`,
-          paddingBottom: '40rpx',
-          backgroundPosition: `0 ${topData.top}px`,
-        }">
-			</view>
-			<view class="qr-code" v-else :style="{
-			    paddingBottom: '40rpx',
-			    paddingTop: `${topData.top}px`,
-					
-			  }">
-				<image :src="logoImg" style="width: 200rpx;height: 100rpx" mode="aspectFit"></image>
-				<!-- <image v-else :src="logoImg" style="width: 200rpx;height: 100rpx" mode="aspectFit"></image> -->
-			</view>
-			<view class="pd10">
-				<view class="content">
-					<view class="search-box" @click="toSearchList">
-						<u-icon name="search" size="20"></u-icon>
-						<text>请输入关键词</text>
-					</view>
-				</view>
-				<view>
-					<!-- <u-swiper height="340" border-radius="0" :list="bannerList"></u-swiper> mpCommonClass=='mp-common3' ? '46vw':-->
-					<u-swiper @click="bannerClick" :list="bannerList" :height=" '280rpx'" :current="current" circular
-						interval="5000" duration="1000" :autoplay="true" @change="(data) => (current = data.current)">
-						<template #indicator>
-							<view class="custom-indicator">
-								<text v-show="bannerList.length > 0" v-for="item in bannerList.length" :key="item"
-									class="custom-indicator-item" :class="{ 'banner-active': item === current }"></text>
-							</view>
-						</template>
-					</u-swiper>
-				</view>
-				<!-- 商品分类 -->
-				<view class="goods-list">
-					<view class="goods-list-item" v-for="(item, index) in goodsList" :key="index" @click="toList(item)">
-						<image style="width: 100rpx; height: 100rpx; margin-bottom: 14rpx" :src="item.logo"
-							mode="aspectFill">
-						</image>
-						<view>{{ item.name }}</view>
-					</view>
-				</view>
-				<!-- 广告位 -->
-				<view class="adv-box display-flex-center">
-					<u-notice-bar direction="column" :text="advList.map((a) => a.name)" :duration="5000"
-						bgColor="#FFFFFF" color="#6C6970" @click="handleAdv"></u-notice-bar>
-					<image class="adv-icon" style="width: 53rpx; height: 53rpx; margin-right: 24rpx"
-						:src="`${imageUrl}/ps_icon1.png`" mode="aspectFill"></image>
-				</view>
-				<view class="content-box">
-					<view>
-						<!-- 限时秒杀 -->
-						<view class="part-box" v-if="msGoodsList.length">
-							<view class="part-title display-flex-between" @click="toMsList">
-								<image style="width: 176rpx; height: 36rpx" :src="`${imageUrl}/ps_icon2.png`"
-									mode="aspectFill">
-								</image>
-								<view class="color-71">查看更多 ></view>
-							</view>
-							<view class="part-list">
-								<view @click="toMsDetail(item)" class="part-list-item"
-									v-for="(item, index) in msGoodsList" :key="index">
-									<image style="width: 206rpx; height: 206rpx; margin-bottom: 13rpx"
-										:src="item.goods.cover" mode="aspectFill">
-									</image>
-									<view>
-										<view class="text-overflow-single mb10">
-											{{ item.goods && item.goods.goods_name }}
-										</view>
-										<view class="display-flex-between">
-											<text
-												class="fs13 fw600 color-red">￥{{ item.goods && item.price_seckill }}</text>
-											<!-- <text class="text-through fs12 color-ca">￥{{item.price_market}}</text> -->
-										</view>
-									</view>
-								</view>
-							</view>
-						</view>
-						<!-- 积分兑换专区 -->
-						<image v-if="ponitsBanner.pic" style="width: 100%; height: 206rpx"
-							@click="toSubpages('pointsZone')" :src="ponitsBanner.pic" mode="aspectFill">
-						</image>
-					</view>
-
-					<!-- 热卖商品  -->
-					<view class="rmsp">
-						<view class="rmsp-title-box">
-							<image :src="`${imageUrl}/ps_icon3.png`"
-								style="margin-left: 28rpx;  width: 140rpx; height: 48rpx" mode="widthFix">
-							</image>
-							<text class="red-tag">火热售卖中</text>
-							<view style="flex: 1;"></view>
-							<navigator url="/pages/productCenter/productCenter" hover-class="none"
-								open-type="switchTab">
-								<text class="more-btn">查看更多></text>
-							</navigator>
-
-						</view>
-						<scroll-view scroll-x class="rm-sv">
-							<view class="sp-box">
-								<view class="rm-sp-item" v-for="(item,index) in goods_hot" :key="index"
-									@click="toDetails(item)">
-									<image :src="item.cover" style="width: 100%; height: 196rpx" mode="widthFix">
-									</image>
-									<text class="rm-title">{{item.goods_name}}</text>
-									<text class="rm-price fw600">￥{{item.price_selling}}</text>
-								</view>
-							</view>
-
-						</scroll-view>
-					</view>
-
-					<!-- 推荐商品 -->
-					<view class="mb10 mt10">
-						<!-- <image :src="`${imageUrl}/ps_icon3.png`" style="width: 133rpx; height: 48rpx" mode="heightFix">
-						</image> -->
-						<image :src="`${imageUrl}/tj_icon.png`" style="width: 133rpx; height: 48rpx" mode="heightFix">
-						</image>
-					</view>
-					<view class="tjsp">
-						<view class="tjsp-item" v-for="(item,index) in goods_hot" :key="index" @click="toDetails(item)">
-							<image :src="item.cover"
-								style="border-radius: 16rpx;overflow: hidden; margin:20rpx; width: 160rpx; height: 160rpx"
-								mode="widthFix">
-							</image>
-							<view class="tjsp-item-content">
-								<text class="tjsp-title">{{item.goods_name}}</text>
-								<text
-									:class="['tjsp-remark',index % 2 === 0 ? 'tjsp-remark1' : 'tjsp-remark2']">{{item.remark}}</text>
-							</view>
-
-							<text class="tjsp-price fw600 color-red">￥{{item.price_selling}}</text>
-
-							<image src="@/static/item_cart.png"
-								style="position: absolute;right: 20rpx; bottom: 20rpx; width: 48rpx; height: 48rpx"
-								mode="heightFix">
-							</image>
-
-						</view>
-					</view>
-
-
-
-
-					<!-- 爆款推荐 -->
-					<view class="mb10 mt10">
-						<!-- <image :src="`${imageUrl}/ps_icon3.png`" style="width: 133rpx; height: 48rpx" mode="heightFix">
-						</image> -->
-						<image :src="`${imageUrl}/zx_icon.png`" style="width: 133rpx; height: 48rpx" mode="heightFix">
-						</image>
-					</view>
-					<CommercePart :data="commonDataList"></CommercePart>
-					<!-- 赠品专区 -->
-					<image v-if="giftBanner.pic" style="width: 100%; height: 206rpx" @click="toSubpages('giftZone')"
-						:src="giftBanner.pic" mode="aspectFill">
-					</image>
-				</view>
-			</view>
-		</view>
-		<tabbarCom :current="1"></tabbarCom>
-	</view>
-
+      }" class="header-box">
+      <view>
+        <view :height=" '1225rpx'" class="banner-container">
+          <!-- <u-swiper height="340" border-radius="0" :list="bannerList"></u-swiper> mpCommonClass=='mp-common3' ? '46vw':-->
+          <u-swiper :autoplay="true" :current="current" :height=" '1225rpx'" :list="bannerList" circular
+                    duration="1000" interval="5000" @change="(data) => (current = data.current)" @click="bannerClick">
+            <template #indicator>
+              <view class="custom-indicator">
+                <text v-for="item in bannerList.length" v-show="bannerList.length > 0" :key="item"
+                      :class="{ 'banner-active': item === current }" class="custom-indicator-item"></text>
+              </view>
+            </template>
+          </u-swiper>
+          <view class="logo-search-container">
+            <view class="centered-image">
+              <van-image
+                  :src="logoImg"
+                  fit="contain"
+                  height="16px"
+                  width="83px"
+              />
+            </view>
+            <view :style="{
+                width: '100%',
+                height: '100%',
+             }" class="search-box" @click="toSearchList">
+              <u-icon name="search" size="20"></u-icon>
+              <text>请输入关键词</text>
+            </view>
+          </view>
+        </view>
+        <!-- 商品分类 -->
+        <view class="goods-list">
+          <view class="goods-list-item" @click="">
+            <van-image
+                height="136rpx"
+                src="/static/hd1.png"
+                width="84rpx"
+            />
+            <view style=" margin-top: 14rpx">芳香好物</view>
+          </view>
+          <view class="goods-list-item" @click="">
+            <van-image
+                height="136rpx"
+                src="/static/hd2.png"
+                width="84rpx"
+            />
+            <view style=" margin-top: 14rpx"> 芳香学院</view>
+          </view>
+
+          <view class="goods-list-item" @click="">
+            <van-image
+                height="136rpx"
+                src="/static/hd3.png"
+                width="84rpx"
+            />
+            <view style=" margin-top: 14rpx"> 芳香活动</view>
+          </view>
+
+          <view class="goods-list-item" @click="">
+            <van-image
+                height="136rpx"
+                src="/static/hd5.png"
+                width="84rpx"
+            />
+            <view style=" margin-top: 14rpx"> 芳香生活
+            </view>
+          </view>
+
+          <view class="goods-list-item" @click="">
+            <van-image
+                height="136rpx"
+                src="/static/hd4.png"
+                width="84rpx"
+            />
+
+            <view style=" margin-top: 14rpx">陪伴营</view>
+          </view>
+        </view>
+        <view :style=" {width: '100%',
+    height: '180rpx',
+    display: 'flex',
+    justifyContent: 'center',
+    alignItems: 'center' }">
+          <van-image
+              height="85.94rpx"
+              src="/static/biaoti1.png"
+              width="171.3rpx"
+          />
+        </view>
+        <view
+            :style="{width: '100%', height: '378rpx' ,borderRadius: '24rpx 24rpx 0rpx 0rpx',backgroundColor: '#F2FAF2'}">
+        </view>
+        <view class="content-box">
+
+          <!-- 爆款推荐 -->
+          <view class="mb10 mt10">
+            <image :src="`${imageUrl}/zx_icon.png`" mode="heightFix" style="width: 133rpx; height: 48rpx">
+            </image>
+          </view>
+          <CommercePart :data="commonDataList"></CommercePart>
+          <!-- 赠品专区 -->
+          <image v-if="giftBanner.pic" :src="giftBanner.pic" mode="aspectFill"
+                 style="width: 100%; height: 206rpx" @click="toSubpages('giftZone')">
+          </image>
+        </view>
+      </view>
+    </view>
+    <tabbarCom :current="1"></tabbarCom>
+  </view>
 </template>
 
 <script>
-	import tabbarCom from "@/components/tabbar/tabbar.vue"
-	import CommercePart from "@/components/CommercePart.vue";
-	// import FlowPart from "@/components/FlowPart.vue";
-	import {
-		goodsList
-	} from "./config";
-	import {
-		getBanner
-	} from "@/common/api/home.js";
-	import {
-		getNewsList
-	} from "@/common/api/news.js";
-	// 获取系统状态栏的高度
-	let systemInfo = uni.getSystemInfoSync();
-	let menuButtonInfo = {};
-	// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
-	// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
-	menuButtonInfo = uni.getMenuButtonBoundingClientRect();
-	// #endif
-	export default {
-		components: {
-			tabbarCom,
-			CommercePart
-		},
-		data() {
-			return {
-				bgImg: '',
-				logoImg: '',
-				shopName: '',
-				shopShareImg: '',
-				ponitsBanner: {}, // 积分兑换
-				giftBanner: {}, // 赠品
-				partGoodsList: [],
-				msGoodsList: [],
-				bannerList: [],
-				topData: {
-					top: 0,
-					height: 0,
-				},
-				current: 0,
-				titleTabCurrentIndex: 0,
-				goodsList: goodsList,
-				imageUrl: this.$C.imageUrl,
-				userInfo: {},
-				keyword: "",
-				commonPage: {
-					pageNum: 1,
-					pageSize: 4,
-					total: 0,
-				},
-				flowPage: {
-					pageNum: 1,
-					pageSize: 4,
-					total: 0,
-				},
-				status: "loadmore",
-				filterData: {},
-				loadText: {
-					loadmore: "点击加载更多",
-					loading: "努力加载中",
-					nomore: "没有更多了",
-				},
-				selectedType: "",
-				activeTabStyle: {
-					fontSize: "36rpx",
-					fontWeight: "600",
-				},
-				mainHeightStyle: {},
-				mainHeight: "",
-				commonDataList: [],
-				flowDataList: [],
-				statusBarHeight: systemInfo.statusBarHeight,
-				menuButtonInfo: menuButtonInfo,
-				searchInputStyle: {
-					backgroundColor: "transparent",
-					color: "#1D161F",
-				},
-				prevData: [],
-				advList: [],
-				goods_hot: [],
-				sourceBanner: []
-			};
-		},
-		computed: {
-			// 导航栏内部盒子的样式
-			navbarInnerStyle() {
-				let style = {};
-				// 导航栏宽度，如果在小程序下，导航栏宽度为胶囊的左边到屏幕左边的距离
-				style.height = this.navbarHeight + "px";
-				// // 如果是各家小程序，导航栏内部的宽度需要减少右边胶囊的宽度
-				// #ifdef MP
-				let rightButtonWidth = systemInfo.windowWidth - menuButtonInfo.left;
-				style.marginRight = rightButtonWidth + "px";
-				// #endif
-				return style;
-			},
-			// 转换字符数值为真正的数值
-			navbarHeight() {
-				// #ifdef APP-PLUS || H5
-				return this.height ? this.height : 44;
-				// #endif
-				// #ifdef MP
-				// 小程序特别处理，让导航栏高度 = 胶囊高度 + 两倍胶囊顶部与状态栏底部的距离之差(相当于同时获得了导航栏底部与胶囊底部的距离)
-				// 此方法有缺陷，暂不用(会导致少了几个px)，采用直接固定值的方式
-				// return menuButtonInfo.height + (menuButtonInfo.top - this.statusBarHeight) * 2;//导航高度
-				let height = systemInfo.platform == "ios" ? 44 : 48;
-				return this.height ? this.height : height;
-				// #endif
-			},
-			token() {
-				return this.$U.getStorage("token");
-			},
-			mpCommonClass() {
-				console.log(this.$C)
-				return this.$C.mpCommonClass || ''
-			}
-		},
-		watch: {
-			titleTabCurrentIndex() {
-				if (this.titleTabCurrentIndex == 0) {
-					this.getCommonData(true);
-				} else {
-					this.getFlowData(true);
-				}
-			},
-		},
-		onLoad() {
-			this.getBanner();
-			this.getNewsList();
-		},
-		onShow() {
-			uni
-				.createSelectorQuery()
-				.in(this)
-				.select("#headerBox")
-				.boundingClientRect((data) => {
-					let height = (data.height + 20) * 2 + "rpx";
-					this.mainHeight = `calc(100vh - ${height})`;
-				})
-				.exec();
-			const topData = uni.getMenuButtonBoundingClientRect();
-			this.topData.top = topData.top;
-			this.topData.height = topData.height;
-			if (this.token) {
-				this.userInfo = this.$U.getStorage("userInfo");
-			}
-
-			// this.getMsData()
-			// this.getCommonData(true);
-		},
-		onReachBottom() {
-			this.getCommonData();
-		},
-		onShareAppMessage(res) {
-			if (res.from === 'button') { // 来自页面内分享按钮
-				console.log(res.target)
-			}
-			let userInfo = uni.getStorageSync('userInfo')
-			userInfo = userInfo && JSON.parse(userInfo) || {}
-			let params = {}
-			if (userInfo.id) {
-				params = {
-					id: userInfo.id
-				}
-			}
-			return {
-				title: this.shopName,
-				path: `/pages/home/index${this.$stringPageOptions(params)}`,
-				imageUrl: this.shopShareImg,
-			}
-		},
-		onShareTimeline(res) {
-			if (res.from === 'button') { // 来自页面内分享按钮
-				console.log(res.target)
-			}
-			let userInfo = uni.getStorageSync('userInfo')
-			userInfo = userInfo && JSON.parse(userInfo) || {}
-			let params = {}
-			if (userInfo.id) {
-				params = {
-					id: userInfo.id
-				}
-			}
-			return {
-				title: this.shopName,
-				imageUrl: this.shopShareImg,
-				path: `/pages/home/index${this.$stringPageOptions(params)}`
-			}
-		},
-		methods: {
-			toMsList() {
-				uni.navigateTo({
-					url: `/subPages/msGoodsList/msGoodsList`,
-				});
-			},
-			toMsDetail(item) {
-				// 秒杀详情
-				uni.navigateTo({
-					url: `/subPages/goodsDetail/goodsDetail?code=${item.id}&type=msGoods`,
-				});
-			},
-
-			toDetails(item) {
-				// 秒杀详情
-				uni.navigateTo({
-					url: `/subPages/goodsDetail/goodsDetail?code=${item.code}&type=common`,
-				});
-			},
-			toSubpages(type) {
-				if (type == "pointsZone") {
-					uni.navigateTo({
-						url: `/subPages/pointsZone/pointsZone?id=${this.ponitsBanner.pstn_id}`,
-					});
-				} else {
-					uni.navigateTo({
-						url: `/subPages/giftZone/giftZone?id=${this.giftBanner.pstn_id}`,
-					});
-				}
-			},
-			bannerClick(index) {
-				const currentUrl = this.sourceBanner[index].pic_url
-				if (currentUrl != '#') {
-					uni.navigateTo({
-						url: currentUrl
-					})
-				}
-			},
-			getBanner() {
-				getBanner().then((res) => {
-					const {
-						slider = [],
-							goods_hot = [],
-							goods_cate = [],
-							goods_new = [],
-							seckill_goods = [],
-							integral_page = [],
-							gifts_page = [],
-							shop_name,
-							shop_logo,
-							shop_share_img,
-							shop_bgimg
-					} = res.data;
-					const configs = uni.getStorageSync("configs");
-					console.log("getConfigzj=>", configs);
-					if (configs) {
-						this.logoImg = configs.shop_logo
-						this.bgImg = configs.shop_bgimg
-						this.shopName = configs.shop_share_title
-						this.shopShareImg = configs.shop_share_img
-					} else {
-						this.logoImg = shop_logo
-						this.bgImg = shop_bgimg
-						this.shopName = shop_name
-						this.shopShareImg = shop_share_img
-					}
-					this.bannerList = slider.map(item => item.pic);
-					this.sourceBanner = slider
-					console.log(23333, this.bannerList)
-					this.goodsList = goods_cate;
-					this.commonDataList = goods_new;
-					this.msGoodsList = seckill_goods;
-					this.goods_hot = goods_hot;
-					this.ponitsBanner = integral_page.length && integral_page[0];
-					this.giftBanner = gifts_page.length && gifts_page[0];
-					uni.setStorageSync('mpInfo', {
-						shopName: this.shopName,
-						shareImg: this.shopShareImg
-					})
-				});
-				// const data = {
-				// 	name: 'sliderread'
-				// };
-				// this.$api.getData(data)
-				// 	.then((res) => {
-				// 		uni.hideLoading();
-				// 		console.log("getBanner==>", res.data)
-				// 		if (res.data) {
-				// 			this.bannerList = res.data;
-				// 		} else {}
-				// 	})
-				// 	.catch(() => {
-				// 		uni.hideLoading();
-				// 	});
-			},
-			toSearchList() {
-				uni.navigateTo({
-					url: "/subPages/searchList/searchList",
-				});
-			},
-			getMsData() {
-				uni.showLoading({
-					title: "加载中",
-				});
-				this.$api
-					.getPSMsList()
-					.then((res) => {
-						uni.hideLoading();
-						// this.msGoodsList = res.data && res.data.list || []
-					})
-					.catch(() => {
-						uni.hideLoading();
-					});
-			},
-			getNewsList() {
-				getNewsList({
-					cid: 1,
-					page: 1,
-					pageSize: 100,
-				}).then(({
-					data = {}
-				}) => {
-					this.advList = data.list || [];
-				});
-			},
-			getCommonData(initFlag) {
-				if (!initFlag) {
-					if (
-						this.commonPage.pageNum * this.commonPage.pageSize <
-						this.commonPage.total
-					) {
-						this.commonPage.pageNum++;
-					} else {
-						return;
-					}
-				} else {
-					this.commonPage.pageNum = 1;
-					this.commonPage.total = 0;
-					this.commonDataList = [];
-				}
-				let sendData = {
-					limit: this.commonPage.pageSize,
-					page: this.commonPage.pageNum,
-				};
-				uni.showLoading({
-					title: "加载中",
-				});
-				this.$api
-					.getPSGoodsList(sendData)
-					.then((res) => {
-						uni.hideLoading();
-						if (res.code == 1) {
-							const {
-								list = [], page = {}
-							} = res.data;
-							this.commonDataList = this.commonDataList.concat(list);
-							this.commonPage.total = page.total;
-						}
-					})
-					.catch((err) => {
-						uni.hideLoading();
-					});
-			},
-			getFlowData(initFlag) {
-				if (!initFlag) {
-					if (
-						this.flowPage.pageNum * this.flowPage.pageSize <
-						this.flowPage.total
-					) {
-						this.flowPage.pageNum++;
-					} else {
-						return;
-					}
-				} else {
-					this.flowPage.pageNum = 1;
-					this.flowPage.total = 0;
-					this.flowDataList = [];
-				}
-				let sendData = {
-					limit: this.flowPage.pageSize,
-					page: this.flowPage.pageNum,
-				};
-				uni.showLoading({
-					title: "加载中",
-				});
-				this.$api
-					.getFlowData(sendData)
-					.then((res) => {
-						uni.hideLoading();
-						if (res.code == 1) {
-							const {
-								list = [], page = {}
-							} = res.data;
-							this.flowDataList = this.flowDataList.concat(list);
-							this.flowPage.total = page.total;
-						}
-					})
-					.catch((err) => {
-						uni.hideLoading();
-					});
-			},
-			searchChange() {},
-
-			toDetail(item) {
-				uni.navigateTo({
-					url: "../../subPages/commerceDetail/commerceDetail?id=" + item.id,
-				});
-			},
-			toList(item) {
-				console.log("cateid=====>", item);
-				uni.setStorageSync('currentCateid', item.id)
-				uni.switchTab({
-					url: `/pages/productCenter/productCenter?cateid=${item.id}`,
-				});
-			},
-			handleAdv(index) {
-				const activeAdv = this.advList[index];
-				uni.navigateTo({
-					url: `/pages/article/article?id=${activeAdv.id}`,
-				});
-			},
-		},
-	};
+import tabbarCom from "@/components/tabbar/tabbar.vue"
+import CommercePart from "@/components/CommercePart.vue";
+// import FlowPart from "@/components/FlowPart.vue";
+import {goodsList} from "./config";
+import {getBanner} from "@/common/api/home.js";
+import {getNewsList} from "@/common/api/news.js";
+// 获取系统状态栏的高度
+let systemInfo = uni.getSystemInfoSync();
+let menuButtonInfo = {};
+// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
+// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
+menuButtonInfo = uni.getMenuButtonBoundingClientRect();
+// #endif
+export default {
+  components: {
+    tabbarCom,
+    CommercePart
+  },
+  data() {
+    return {
+      bgImg: '',
+      logoImg: '',
+      shopName: '',
+      shopShareImg: '',
+      ponitsBanner: {}, // 积分兑换
+      giftBanner: {}, // 赠品
+      partGoodsList: [],
+      msGoodsList: [],
+      bannerList: [],
+      topData: {
+        top: 0,
+        height: 0,
+      },
+      current: 0,
+      titleTabCurrentIndex: 0,
+      goodsList: goodsList,
+      imageUrl: this.$C.imageUrl,
+      userInfo: {},
+      keyword: "",
+      commonPage: {
+        pageNum: 1,
+        pageSize: 4,
+        total: 0,
+      },
+      flowPage: {
+        pageNum: 1,
+        pageSize: 4,
+        total: 0,
+      },
+      status: "loadmore",
+      filterData: {},
+      loadText: {
+        loadmore: "点击加载更多",
+        loading: "努力加载中",
+        nomore: "没有更多了",
+      },
+      selectedType: "",
+      activeTabStyle: {
+        fontSize: "36rpx",
+        fontWeight: "600",
+      },
+      mainHeightStyle: {},
+      mainHeight: "",
+      commonDataList: [],
+      flowDataList: [],
+      statusBarHeight: systemInfo.statusBarHeight,
+      menuButtonInfo: menuButtonInfo,
+      searchInputStyle: {
+        backgroundColor: "transparent",
+        color: "#1D161F",
+      },
+      prevData: [],
+      advList: [],
+      goods_hot: [],
+      sourceBanner: []
+    };
+  },
+  computed: {
+    // 导航栏内部盒子的样式
+    navbarInnerStyle() {
+      let style = {};
+      // 导航栏宽度，如果在小程序下，导航栏宽度为胶囊的左边到屏幕左边的距离
+      style.height = this.navbarHeight + "px";
+      // // 如果是各家小程序，导航栏内部的宽度需要减少右边胶囊的宽度
+      // #ifdef MP
+      let rightButtonWidth = systemInfo.windowWidth - menuButtonInfo.left;
+      style.marginRight = rightButtonWidth + "px";
+      // #endif
+      return style;
+    },
+    // 转换字符数值为真正的数值
+    navbarHeight() {
+      // #ifdef APP-PLUS || H5
+      return this.height ? this.height : 44;
+      // #endif
+      // #ifdef MP
+      // 小程序特别处理，让导航栏高度 = 胶囊高度 + 两倍胶囊顶部与状态栏底部的距离之差(相当于同时获得了导航栏底部与胶囊底部的距离)
+      // 此方法有缺陷，暂不用(会导致少了几个px)，采用直接固定值的方式
+      // return menuButtonInfo.height + (menuButtonInfo.top - this.statusBarHeight) * 2;//导航高度
+      let height = systemInfo.platform == "ios" ? 44 : 48;
+      return this.height ? this.height : height;
+      // #endif
+    },
+    token() {
+      return this.$U.getStorage("token");
+    },
+    mpCommonClass() {
+      console.log(this.$C)
+      return this.$C.mpCommonClass || ''
+    }
+  },
+  watch: {
+    titleTabCurrentIndex() {
+      if (this.titleTabCurrentIndex == 0) {
+        this.getCommonData(true);
+      } else {
+        this.getFlowData(true);
+      }
+    },
+  },
+  onLoad() {
+    this.getBanner();
+    this.getNewsList();
+  },
+  onShow() {
+    uni
+        .createSelectorQuery()
+        .in(this)
+        .select("#headerBox")
+        .boundingClientRect((data) => {
+          let height = (data.height + 20) * 2 + "rpx";
+          this.mainHeight = `calc(100vh - ${height})`;
+        })
+        .exec();
+    const topData = uni.getMenuButtonBoundingClientRect();
+    this.topData.top = topData.top;
+    this.topData.height = topData.height;
+    if (this.token) {
+      this.userInfo = this.$U.getStorage("userInfo");
+    }
+
+    // this.getMsData()
+    // this.getCommonData(true);
+  },
+  onReachBottom() {
+    this.getCommonData();
+  },
+  onShareAppMessage(res) {
+    if (res.from === 'button') { // 来自页面内分享按钮
+      console.log(res.target)
+    }
+    let userInfo = uni.getStorageSync('userInfo')
+    userInfo = userInfo && JSON.parse(userInfo) || {}
+    let params = {}
+    if (userInfo.id) {
+      params = {
+        id: userInfo.id
+      }
+    }
+    return {
+      title: this.shopName,
+      path: `/pages/home/index${this.$stringPageOptions(params)}`,
+      imageUrl: this.shopShareImg,
+    }
+  },
+  onShareTimeline(res) {
+    if (res.from === 'button') { // 来自页面内分享按钮
+      console.log(res.target)
+    }
+    let userInfo = uni.getStorageSync('userInfo')
+    userInfo = userInfo && JSON.parse(userInfo) || {}
+    let params = {}
+    if (userInfo.id) {
+      params = {
+        id: userInfo.id
+      }
+    }
+    return {
+      title: this.shopName,
+      imageUrl: this.shopShareImg,
+      path: `/pages/home/index${this.$stringPageOptions(params)}`
+    }
+  },
+  methods: {
+    toMsList() {
+      uni.navigateTo({
+        url: `/subPages/msGoodsList/msGoodsList`,
+      });
+    },
+    toMsDetail(item) {
+      // 秒杀详情
+      uni.navigateTo({
+        url: `/subPages/goodsDetail/goodsDetail?code=${item.id}&type=msGoods`,
+      });
+    },
+
+    toDetails(item) {
+      // 秒杀详情
+      uni.navigateTo({
+        url: `/subPages/goodsDetail/goodsDetail?code=${item.code}&type=common`,
+      });
+    },
+    toSubpages(type) {
+      if (type == "pointsZone") {
+        uni.navigateTo({
+          url: `/subPages/pointsZone/pointsZone?id=${this.ponitsBanner.pstn_id}`,
+        });
+      } else {
+        uni.navigateTo({
+          url: `/subPages/giftZone/giftZone?id=${this.giftBanner.pstn_id}`,
+        });
+      }
+    },
+    bannerClick(index) {
+      const currentUrl = this.sourceBanner[index].pic_url
+      if (currentUrl != '#') {
+        uni.navigateTo({
+          url: currentUrl
+        })
+      }
+    },
+    getBanner() {
+      getBanner().then((res) => {
+        const {
+          slider = [],
+          goods_hot = [],
+          goods_cate = [],
+          goods_new = [],
+          seckill_goods = [],
+          integral_page = [],
+          gifts_page = [],
+          shop_name,
+          shop_logo,
+          shop_share_img,
+          shop_bgimg
+        } = res.data;
+        const configs = uni.getStorageSync("configs");
+        console.log("getConfigzj=>", configs);
+        if (configs) {
+          this.logoImg = configs.shop_logo
+          this.bgImg = configs.shop_bgimg
+          this.shopName = configs.shop_share_title
+          this.shopShareImg = configs.shop_share_img
+        } else {
+          this.logoImg = shop_logo
+          this.bgImg = shop_bgimg
+          this.shopName = shop_name
+          this.shopShareImg = shop_share_img
+        }
+        this.bannerList = slider.map(item => item.pic);
+        this.sourceBanner = slider
+        console.log(23333, this.bannerList)
+        this.goodsList = goods_cate;
+        this.commonDataList = goods_new;
+        this.msGoodsList = seckill_goods;
+        this.goods_hot = goods_hot;
+        this.ponitsBanner = integral_page.length && integral_page[0];
+        this.giftBanner = gifts_page.length && gifts_page[0];
+        uni.setStorageSync('mpInfo', {
+          shopName: this.shopName,
+          shareImg: this.shopShareImg
+        })
+      });
+      // const data = {
+      // 	name: 'sliderread'
+      // };
+      // this.$api.getData(data)
+      // 	.then((res) => {
+      // 		uni.hideLoading();
+      // 		console.log("getBanner==>", res.data)
+      // 		if (res.data) {
+      // 			this.bannerList = res.data;
+      // 		} else {}
+      // 	})
+      // 	.catch(() => {
+      // 		uni.hideLoading();
+      // 	});
+    },
+    toSearchList() {
+      uni.navigateTo({
+        url: "/subPages/searchList/searchList",
+      });
+    },
+    getMsData() {
+      uni.showLoading({
+        title: "加载中",
+      });
+      this.$api
+          .getPSMsList()
+          .then((res) => {
+            uni.hideLoading();
+            // this.msGoodsList = res.data && res.data.list || []
+          })
+          .catch(() => {
+            uni.hideLoading();
+          });
+    },
+    getNewsList() {
+      getNewsList({
+        cid: 1,
+        page: 1,
+        pageSize: 100,
+      }).then(({
+                 data = {}
+               }) => {
+        this.advList = data.list || [];
+      });
+    },
+    getCommonData(initFlag) {
+      if (!initFlag) {
+        if (
+            this.commonPage.pageNum * this.commonPage.pageSize <
+            this.commonPage.total
+        ) {
+          this.commonPage.pageNum++;
+        } else {
+          return;
+        }
+      } else {
+        this.commonPage.pageNum = 1;
+        this.commonPage.total = 0;
+        this.commonDataList = [];
+      }
+      let sendData = {
+        limit: this.commonPage.pageSize,
+        page: this.commonPage.pageNum,
+      };
+      uni.showLoading({
+        title: "加载中",
+      });
+      this.$api
+          .getPSGoodsList(sendData)
+          .then((res) => {
+            uni.hideLoading();
+            if (res.code == 1) {
+              const {
+                list = [], page = {}
+              } = res.data;
+              this.commonDataList = this.commonDataList.concat(list);
+              this.commonPage.total = page.total;
+            }
+          })
+          .catch((err) => {
+            uni.hideLoading();
+          });
+    },
+    getFlowData(initFlag) {
+      if (!initFlag) {
+        if (
+            this.flowPage.pageNum * this.flowPage.pageSize <
+            this.flowPage.total
+        ) {
+          this.flowPage.pageNum++;
+        } else {
+          return;
+        }
+      } else {
+        this.flowPage.pageNum = 1;
+        this.flowPage.total = 0;
+        this.flowDataList = [];
+      }
+      let sendData = {
+        limit: this.flowPage.pageSize,
+        page: this.flowPage.pageNum,
+      };
+      uni.showLoading({
+        title: "加载中",
+      });
+      this.$api
+          .getFlowData(sendData)
+          .then((res) => {
+            uni.hideLoading();
+            if (res.code == 1) {
+              const {
+                list = [], page = {}
+              } = res.data;
+              this.flowDataList = this.flowDataList.concat(list);
+              this.flowPage.total = page.total;
+            }
+          })
+          .catch((err) => {
+            uni.hideLoading();
+          });
+    },
+    searchChange() {
+    },
+
+    toDetail(item) {
+      uni.navigateTo({
+        url: "../../subPages/commerceDetail/commerceDetail?id=" + item.id,
+      });
+    },
+    toList(item) {
+      console.log("cateid=====>", item);
+      uni.setStorageSync('currentCateid', item.id)
+      uni.switchTab({
+        url: `/pages/productCenter/productCenter?cateid=${item.id}`,
+      });
+    },
+    handleAdv(index) {
+      const activeAdv = this.advList[index];
+      uni.navigateTo({
+        url: `/pages/article/article?id=${activeAdv.id}`,
+      });
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-	.ps-wrapper {
-		background-color: $primary-bg-color;
-
-		.adv-box {
-			position: relative;
-			// padding: 0 33rpx 20rpx;
-			height: 64rpx;
-			background-color: white;
-			padding: 0 20rpx 0;
-			border-radius: 16rpx;
-			margin: 40rpx 0 20rpx;
-			font-weight: 500;
-
-			.adv-icon {
-				position: absolute;
-				left: 6rpx;
-				top: 50%;
-				transform: translateY(-50%);
-			}
-
-			::v-deep {
-				.u-notice__left-icon {
-					width: 19px;
-
-					.u-icon__icon {
-						display: none;
-					}
-				}
-			}
-		}
-
-		.custom-indicator {
-			position: absolute;
-			left: 0rpx;
-			right: 0rpx;
-			bottom: 0;
-			width: 712rpx;
-			// margin-right: 24rpx;
-			display: flex;
-			flex-direction: row;
-			justify-content: center;
-			transform: translateX(-48rpx);
-
-			.custom-indicator-item {
-				width: 12rpx;
-				height: 12rpx;
-				margin: 0 6rpx;
-				border-radius: 12rpx;
-				background-color: rgba(255, 255, 255, 0.79);
-			}
-
-			.banner-active {
-				width: 48rpx;
-				background-color: white;
-			}
-		}
-
-		.slot-wrap {
-			background-color: red;
-		}
-
-		.content-box {
-			// overflow-y: auto;
-			background-color: $primary-bg-color;
-			padding: 20rpx 0 0;
-
-			.part-box {
-				background: linear-gradient(180deg, #fdd118 0%, #f7f7f7 100%);
-				border-radius: 10rpx 10rpx 10rpx 10rpx;
-				padding: 18rpx 14rpx;
-
-				.part-list {
-					display: flex !important;
-					flex-direction: row !important;
-					// justify-content: space-between;
-					background-color: #fff;
-					border-radius: 10rpx;
-					padding: 15rpx 15rpx 30rpx;
-					font-size: 24rpx;
-					color: #1d161f;
-					margin-top: 15rpx;
-
-					&-item {
-						width: calc(33% - 10rpx);
-						margin-right: 10rpx;
-					}
-				}
-			}
-
-			.newset-box {
-				background: transparent;
-			}
-
-			.rmsp {
-				width: 100%;
-				display: flex;
-				flex-direction: column;
-				border-radius: 16rpx;
-				background: #FFFFFF;
-
-				.rmsp-title-box {
-					display: flex;
-					width: 100%;
-					margin-top: 20rpx;
-					flex-direction: row;
-					align-items: center;
-
-					.red-tag {
-						margin-left: 16rpx;
-						background: linear-gradient(285deg, #FF424F -1%, #FF6973 100%);
-						color: #FFFFFF;
-						padding: 2rpx 6rpx;
-						font-size: 20rpx;
-						white-space: nowrap;
-						border-radius: 4rpx;
-						overflow: hidden;
-					}
-
-					.more-btn {
-						padding-right: 32rpx;
-						font-size: 24rpx;
-						color: #6C6970;
-					}
-				}
-
-				.rm-sv {
-					white-space: nowrap;
-					margin-top: 22rpx;
-					width: calc(100% - 50rpx);
-					margin-left: 15rpx;
-
-					.sp-box {
-						display: inline-block;
-						display: flex;
-						flex-direction: row;
-						flex-wrap: nowrap;
-
-						.rm-sp-item {
-							margin-left: 25rpx;
-							width: 196rpx;
-							display: flex;
-							flex-direction: column;
-
-							&:active {
-								opacity: 0.7;
-							}
-
-							.rm-title {
-								margin-top: 16rpx;
-								font-size: 24rpx;
-								display: -webkit-box;
-								-webkit-box-orient: vertical;
-								overflow: hidden;
-								white-space: pre-wrap;
-								text-overflow: ellipsis;
-								-webkit-line-clamp: 2;
-								/* 这里的数字表示你想显示的行数 */
-								// line-height: 1.2;
-								/* 调整行高以匹配你的字体和设计 */
-								height: calc(1.2em * 2);
-								/* 行高乘以行数 */
-							}
-
-
-							.rm-price {
-								margin-top: 10rpx;
-								margin-bottom: 30rpx;
-								width: 196rpx;
-								font-size: 32rpx;
-								color: #FF424F;
-							}
-						}
-					}
-				}
-
-			}
-
-			.tjsp {
-				width: 100%;
-				display: flex;
-				flex-direction: column;
-
-				.tjsp-item {
-					width: 100%;
-					border-radius: 16rpx;
-					background: #FFFFFF;
-					margin-top: 20rpx;
-					position: relative;
-					display: flex;
-					flex-direction: row;
-
-					&:active {
-						opacity: 0.7;
-					}
-				}
-
-				.tjsp-item-content {
-					display: flex;
-					margin-right: 20rpx;
-					flex: 1;
-					flex-direction: column;
-
-					.tjsp-title {
-						margin-top: 20rpx;
-						font-size: 28rpx;
-						color: #3E3D44;
-						display: -webkit-box;
-						-webkit-box-orient: vertical;
-						overflow: hidden;
-						white-space: pre-wrap;
-						text-overflow: ellipsis;
-						-webkit-line-clamp: 1;
-					}
-
-					.tjsp-remark {
-						width: fit-content;
-						margin-top: 20rpx;
-						font-size: 20rpx;
-						display: -webkit-box;
-						-webkit-box-orient: vertical;
-						border-radius: 8rpx;
-						overflow: hidden;
-						white-space: pre-wrap;
-						padding: 0 10rpx;
-						text-overflow: ellipsis;
-						-webkit-line-clamp: 1;
-					}
-
-					.tjsp-remark1 {
-						color: #1AC77F;
-						background: #E7FCF3;
-					}
-
-					.tjsp-remark2 {
-						color: #D18D3F;
-						background: #FFF8EF;
-					}
-				}
-
-				.tjsp-price {
-					font-size: 32rpx;
-					position: absolute;
-					left: 200rpx;
-					bottom: 20rpx;
-				}
-			}
-
-		}
-
-		.header-box {
-			width: 100%;
-
-			.qr-code {
-				padding: 0 20rpx;
-				font-size: 34rpx;
-				font-weight: 700;
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				font-style: italic;
-
-
-			}
-
-			.content {
-				width: 100%;
-				z-index: 50;
-				// margin-top: -60rpx;s
-
-				.title-tab {
-					font-size: 34rpx;
-					color: #aca9af;
-					font-style: italic;
-					font-weight: 700;
-					margin-bottom: 26rpx;
-					padding: 0 20rpx;
-
-					&-item {
-						margin-right: 30rpx;
-					}
-
-					&-actived {
-						color: #000;
-					}
-				}
-			}
-		}
-
-		.mp-common3 {}
-
-		.goods-list {
-			display: flex;
-			flex-wrap: wrap;
-			justify-content: flex-start;
-			padding-top: 40rpx;
-
-			&-item {
-				width: 20%;
-				flex-shrink: 0;
-				text-align: center;
-				margin-bottom: 30rpx;
-				color: #1d161f;
-				font-size: 26rpx;
-			}
-		}
-	}
+.ps-wrapper {
+  background-color: $primary-bg-color;
+
+  .adv-box {
+    position: relative;
+    // padding: 0 33rpx 20rpx;
+    height: 64 rpx;
+    background-color: white;
+    padding: 0 20 rpx 0;
+    border-radius: 16 rpx;
+    margin: 40 rpx 0 20 rpx;
+    font-weight: 500;
+
+    .adv-icon {
+      position: absolute;
+      left: 6 rpx;
+      top: 50%;
+      transform: translateY(-50%);
+    }
+
+    ::v-deep {
+      .u-notice__left-icon {
+        width: 19px;
+
+        .u-icon__icon {
+          display: none;
+        }
+      }
+    }
+  }
+
+  .banner-container {
+    position: relative;
+    width: 100%;
+  }
+
+  .logo-search-container {
+    position: absolute;
+    top: 59px;
+    left: 0;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0 20 rpx;
+    box-sizing: border-box;
+  }
+
+  .centered-image {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 61 rpx;
+  }
+
+  .custom-indicator {
+    position: absolute;
+    left: 0 rpx;
+    right: 0 rpx;
+    bottom: 29 rpx;
+    width: 712 rpx;
+    // margin-right: 24rpx;
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    transform: translateX(-48rpx);
+
+    .custom-indicator-item {
+      width: 16 rpx;
+      height: 16 rpx;
+      margin: 0 6 rpx;
+      border-radius: 12 rpx;
+      background: #666666;
+    }
+
+    .banner-active {
+      width: 48 rpx;
+      background: #222222;
+    }
+  }
+
+  .slot-wrap {
+    background-color: red;
+  }
+
+  .content-box {
+    // overflow-y: auto;
+    background-color: $primary-bg-color;
+    padding: 20 rpx 0 0;
+
+    .part-box {
+      background: linear-gradient(180deg, #fdd118 0%, #f7f7f7 100%);
+      border-radius: 10 rpx 10 rpx 10 rpx 10 rpx;
+      padding: 18 rpx 14 rpx;
+
+      .part-list {
+        display: flex !important;
+        flex-direction: row !important;
+        // justify-content: space-between;
+        background-color: #fff;
+        border-radius: 10 rpx;
+        padding: 15 rpx 15 rpx 30 rpx;
+        font-size: 24 rpx;
+        color: #1d161f;
+        margin-top: 15 rpx;
+
+        &-item {
+          width: calc(33% - 10rpx);
+          margin-right: 10 rpx;
+        }
+      }
+    }
+
+    .newset-box {
+      background: transparent;
+    }
+
+    .rmsp {
+      width: 100%;
+      display: flex;
+      flex-direction: column;
+      border-radius: 16 rpx;
+      background: #FFFFFF;
+
+      .rmsp-title-box {
+        display: flex;
+        width: 100%;
+        margin-top: 20 rpx;
+        flex-direction: row;
+        align-items: center;
+
+        .red-tag {
+          margin-left: 16 rpx;
+          background: linear-gradient(285deg, #FF424F -1%, #FF6973 100%);
+          color: #FFFFFF;
+          padding: 2 rpx 6 rpx;
+          font-size: 20 rpx;
+          white-space: nowrap;
+          border-radius: 4 rpx;
+          overflow: hidden;
+        }
+
+        .more-btn {
+          padding-right: 32 rpx;
+          font-size: 24 rpx;
+          color: #6C6970;
+        }
+      }
+
+      .rm-sv {
+        white-space: nowrap;
+        margin-top: 22 rpx;
+        width: calc(100% - 50rpx);
+        margin-left: 15 rpx;
+
+        .sp-box {
+          display: inline-block;
+          display: flex;
+          flex-direction: row;
+          flex-wrap: nowrap;
+
+          .rm-sp-item {
+            margin-left: 25 rpx;
+            width: 196 rpx;
+            display: flex;
+            flex-direction: column;
+
+            &:active {
+              opacity: 0.7;
+            }
+
+            .rm-title {
+              margin-top: 16 rpx;
+              font-size: 24 rpx;
+              display: -webkit-box;
+              -webkit-box-orient: vertical;
+              overflow: hidden;
+              white-space: pre-wrap;
+              text-overflow: ellipsis;
+              -webkit-line-clamp: 2;
+              /* 这里的数字表示你想显示的行数 */
+              // line-height: 1.2;
+              /* 调整行高以匹配你的字体和设计 */
+              height: calc(1.2em * 2);
+              /* 行高乘以行数 */
+            }
+
+
+            .rm-price {
+              margin-top: 10 rpx;
+              margin-bottom: 30 rpx;
+              width: 196 rpx;
+              font-size: 32 rpx;
+              color: #FF424F;
+            }
+          }
+        }
+      }
+
+    }
+
+    .tjsp {
+      width: 100%;
+      display: flex;
+      flex-direction: column;
+
+      .tjsp-item {
+        width: 100%;
+        border-radius: 16 rpx;
+        background: #FFFFFF;
+        margin-top: 20 rpx;
+        position: relative;
+        display: flex;
+        flex-direction: row;
+
+        &:active {
+          opacity: 0.7;
+        }
+      }
+
+      .tjsp-item-content {
+        display: flex;
+        margin-right: 20 rpx;
+        flex: 1;
+        flex-direction: column;
+
+        .tjsp-title {
+          margin-top: 20 rpx;
+          font-size: 28 rpx;
+          color: #3E3D44;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          overflow: hidden;
+          white-space: pre-wrap;
+          text-overflow: ellipsis;
+          -webkit-line-clamp: 1;
+        }
+
+        .tjsp-remark {
+          width: fit-content;
+          margin-top: 20 rpx;
+          font-size: 20 rpx;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          border-radius: 8 rpx;
+          overflow: hidden;
+          white-space: pre-wrap;
+          padding: 0 10 rpx;
+          text-overflow: ellipsis;
+          -webkit-line-clamp: 1;
+        }
+
+        .tjsp-remark1 {
+          color: #1AC77F;
+          background: #E7FCF3;
+        }
+
+        .tjsp-remark2 {
+          color: #D18D3F;
+          background: #FFF8EF;
+        }
+      }
+
+      .tjsp-price {
+        font-size: 32 rpx;
+        position: absolute;
+        left: 200 rpx;
+        bottom: 20 rpx;
+      }
+    }
+
+  }
+
+  .header-box {
+    width: 100%;
+
+    .qr-code {
+      padding: 0 20 rpx;
+      font-size: 34 rpx;
+      font-weight: 700;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      font-style: italic;
+    }
+
+    .content {
+      width: 100%;
+      z-index: 50;
+      // margin-top: -60rpx;s
+      .title-tab {
+        font-size: 34 rpx;
+        color: #aca9af;
+        font-style: italic;
+        font-weight: 700;
+        margin-bottom: 26 rpx;
+        padding: 0 20 rpx;
+
+        &-item {
+          margin-right: 30 rpx;
+        }
+
+        &-actived {
+          color: #000;
+        }
+      }
+    }
+  }
+
+  .mp-common3 {
+  }
+
+  .goods-list {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    background-color: #FFFFFF;;
+    padding: 0 20 rpx;
+    padding-top: 40 rpx;
+
+    &-item {
+      width: 20%;
+      flex-shrink: 0;
+      text-align: center;
+      margin-bottom: 30 rpx;
+      color: #1d161f;
+      font-size: 26 rpx;
+    }
+  }
+}
+
+.search-box {
+  margin: 0 auto 0 rpx;
+  height: 61 rpx;
+  background: rgba(255, 255, 255, 0.3);
+  border-radius: 30 rpx;
+  opacity: 1;
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+
+  text {
+    font-size: 24 rpx;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #9D9D9D;
+    line-height: 61 rpx;
+    margin-left: 11 rpx;
+  }
+}
 </style>
 
 <style lang="scss">
-	page {
-		height: 100vh;
-	}
-</style>
+page {
+  height: 100vh;
+}
+</style>

pages/home/index2.vue

@@ -0,0 +1,893 @@
+<template>
+  <view class="ps-wrapper">
+    <view id="headerBox" ref="headerBox" :class="[mpCommonClass]" :style="{
+        background: `url(${bgImg}) no-repeat center top`,
+        backgroundSize: '100% 400rpx',
+        backgroundColor: '#F7F7F7',
+      }" class="header-box">
+      <view>
+        <view :height=" '1225rpx'" class="banner-container">
+          <!-- <u-swiper height="340" border-radius="0" :list="bannerList"></u-swiper> mpCommonClass=='mp-common3' ? '46vw':-->
+          <u-swiper :autoplay="true" :current="current" :height=" '1225rpx'" :list="bannerList" circular
+                    duration="1000" interval="5000" @change="(data) => (current = data.current)" @click="bannerClick">
+            <template #indicator>
+              <view class="custom-indicator">
+                <text v-for="item in bannerList.length" v-show="bannerList.length > 0" :key="item"
+                      :class="{ 'banner-active': item === current }" class="custom-indicator-item"></text>
+              </view>
+            </template>
+          </u-swiper>
+          <view class="logo-search-container">
+            <view class="centered-image">
+              <van-image
+                  :src="logoImg"
+                  fit="contain"
+                  height="16px"
+                  width="83px"
+              />
+            </view>
+            <view :style="{
+                width: '100%',
+                height: '100%',
+             }" class="search-box" @click="toSearchList">
+              <u-icon name="search" size="20"></u-icon>
+              <text>请输入关键词</text>
+            </view>
+          </view>
+        </view>
+        <!-- 商品分类 -->
+        <view class="goods-list">
+          <view class="goods-list-item" @click="">
+            <van-image
+                height="136rpx"
+                src="/static/hd1.png"
+                width="84rpx"
+            />
+            <view style=" margin-top: 14rpx">芳香好物</view>
+          </view>
+          <view class="goods-list-item" @click="">
+            <van-image
+                height="136rpx"
+                src="/static/hd2.png"
+                width="84rpx"
+            />
+            <view style=" margin-top: 14rpx"> 芳香学院</view>
+          </view>
+
+          <view class="goods-list-item" @click="">
+            <van-image
+                height="136rpx"
+                src="/static/hd3.png"
+                width="84rpx"
+            />
+            <view style=" margin-top: 14rpx"> 芳香活动</view>
+          </view>
+
+          <view class="goods-list-item" @click="">
+            <van-image
+                height="136rpx"
+                src="/static/hd5.png"
+                width="84rpx"
+            />
+            <view style=" margin-top: 14rpx"> 芳香生活
+            </view>
+          </view>
+
+          <view class="goods-list-item" @click="">
+            <van-image
+                height="136rpx"
+                src="/static/hd4.png"
+                width="84rpx"
+            />
+            <view style=" margin-top: 14rpx">陪伴营</view>
+          </view>
+        </view>
+        <view class="content-box">
+          <view :style=" {width: '100%',
+    height: '180rpx',
+    display: 'flex',
+    justifyContent: 'center',
+    alignItems: 'center' }" class="biaoti">
+            <van-image
+                height="85.94rpx"
+                src="/static/biaoti1.png"
+                width="171.3rpx"
+            />
+          </view>
+          <view
+              :style="{width: '100%', height: '378rpx' ,borderRadius: '24rpx 24rpx 0rpx 0rpx',backgroundColor: '#F2FAF2'}">
+          </view>
+
+          <!-- 爆款推荐 -->
+          <view class="mb10 mt10">
+            <image :src="`${imageUrl}/zx_icon.png`" mode="heightFix" style="width: 133rpx; height: 48rpx">
+            </image>
+          </view>
+          <CommercePart :data="commonDataList"></CommercePart>
+          <!-- 赠品专区 -->
+          <image v-if="giftBanner.pic" :src="giftBanner.pic" mode="aspectFill"
+                 style="width: 100%; height: 206rpx" @click="toSubpages('giftZone')">
+          </image>
+        </view>
+      </view>
+    </view>
+    <tabbarCom :current="1"></tabbarCom>
+  </view>
+</template>
+
+<script>
+import tabbarCom from "@/components/tabbar/tabbar.vue"
+import CommercePart from "@/components/CommercePart.vue";
+// import FlowPart from "@/components/FlowPart.vue";
+import {goodsList} from "./config";
+import {getBanner} from "@/common/api/home.js";
+import {getNewsList} from "@/common/api/news.js";
+// 获取系统状态栏的高度
+let systemInfo = uni.getSystemInfoSync();
+let menuButtonInfo = {};
+// 如果是小程序，获取右上角胶囊的尺寸信息，避免导航栏右侧内容与胶囊重叠(支付宝小程序非本API，尚未兼容)
+// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
+menuButtonInfo = uni.getMenuButtonBoundingClientRect();
+// #endif
+export default {
+  components: {
+    tabbarCom,
+    CommercePart
+  },
+  data() {
+    return {
+      bgImg: '',
+      logoImg: '',
+      shopName: '',
+      shopShareImg: '',
+      ponitsBanner: {}, // 积分兑换
+      giftBanner: {}, // 赠品
+      partGoodsList: [],
+      msGoodsList: [],
+      bannerList: [],
+      topData: {
+        top: 0,
+        height: 0,
+      },
+      current: 0,
+      titleTabCurrentIndex: 0,
+      goodsList: goodsList,
+      imageUrl: this.$C.imageUrl,
+      userInfo: {},
+      keyword: "",
+      commonPage: {
+        pageNum: 1,
+        pageSize: 4,
+        total: 0,
+      },
+      flowPage: {
+        pageNum: 1,
+        pageSize: 4,
+        total: 0,
+      },
+      status: "loadmore",
+      filterData: {},
+      loadText: {
+        loadmore: "点击加载更多",
+        loading: "努力加载中",
+        nomore: "没有更多了",
+      },
+      selectedType: "",
+      activeTabStyle: {
+        fontSize: "36rpx",
+        fontWeight: "600",
+      },
+      mainHeightStyle: {},
+      mainHeight: "",
+      commonDataList: [],
+      flowDataList: [],
+      statusBarHeight: systemInfo.statusBarHeight,
+      menuButtonInfo: menuButtonInfo,
+      searchInputStyle: {
+        backgroundColor: "transparent",
+        color: "#1D161F",
+      },
+      prevData: [],
+      advList: [],
+      goods_hot: [],
+      sourceBanner: []
+    };
+  },
+  computed: {
+    // 导航栏内部盒子的样式
+    navbarInnerStyle() {
+      let style = {};
+      // 导航栏宽度，如果在小程序下，导航栏宽度为胶囊的左边到屏幕左边的距离
+      style.height = this.navbarHeight + "px";
+      // // 如果是各家小程序，导航栏内部的宽度需要减少右边胶囊的宽度
+      // #ifdef MP
+      let rightButtonWidth = systemInfo.windowWidth - menuButtonInfo.left;
+      style.marginRight = rightButtonWidth + "px";
+      // #endif
+      return style;
+    },
+    // 转换字符数值为真正的数值
+    navbarHeight() {
+      // #ifdef APP-PLUS || H5
+      return this.height ? this.height : 44;
+      // #endif
+      // #ifdef MP
+      // 小程序特别处理，让导航栏高度 = 胶囊高度 + 两倍胶囊顶部与状态栏底部的距离之差(相当于同时获得了导航栏底部与胶囊底部的距离)
+      // 此方法有缺陷，暂不用(会导致少了几个px)，采用直接固定值的方式
+      // return menuButtonInfo.height + (menuButtonInfo.top - this.statusBarHeight) * 2;//导航高度
+      let height = systemInfo.platform == "ios" ? 44 : 48;
+      return this.height ? this.height : height;
+      // #endif
+    },
+    token() {
+      return this.$U.getStorage("token");
+    },
+    mpCommonClass() {
+      console.log(this.$C)
+      return this.$C.mpCommonClass || ''
+    }
+  },
+  watch: {
+    titleTabCurrentIndex() {
+      if (this.titleTabCurrentIndex == 0) {
+        this.getCommonData(true);
+      } else {
+        this.getFlowData(true);
+      }
+    },
+  },
+  onLoad() {
+    this.getBanner();
+    this.getNewsList();
+  },
+  onShow() {
+    uni
+        .createSelectorQuery()
+        .in(this)
+        .select("#headerBox")
+        .boundingClientRect((data) => {
+          let height = (data.height + 20) * 2 + "rpx";
+          this.mainHeight = `calc(100vh - ${height})`;
+        })
+        .exec();
+    const topData = uni.getMenuButtonBoundingClientRect();
+    this.topData.top = topData.top;
+    this.topData.height = topData.height;
+    if (this.token) {
+      this.userInfo = this.$U.getStorage("userInfo");
+    }
+
+    // this.getMsData()
+    // this.getCommonData(true);
+  },
+  onReachBottom() {
+    this.getCommonData();
+  },
+  onShareAppMessage(res) {
+    if (res.from === 'button') { // 来自页面内分享按钮
+      console.log(res.target)
+    }
+    let userInfo = uni.getStorageSync('userInfo')
+    userInfo = userInfo && JSON.parse(userInfo) || {}
+    let params = {}
+    if (userInfo.id) {
+      params = {
+        id: userInfo.id
+      }
+    }
+    return {
+      title: this.shopName,
+      path: `/pages/home/index${this.$stringPageOptions(params)}`,
+      imageUrl: this.shopShareImg,
+    }
+  },
+  onShareTimeline(res) {
+    if (res.from === 'button') { // 来自页面内分享按钮
+      console.log(res.target)
+    }
+    let userInfo = uni.getStorageSync('userInfo')
+    userInfo = userInfo && JSON.parse(userInfo) || {}
+    let params = {}
+    if (userInfo.id) {
+      params = {
+        id: userInfo.id
+      }
+    }
+    return {
+      title: this.shopName,
+      imageUrl: this.shopShareImg,
+      path: `/pages/home/index${this.$stringPageOptions(params)}`
+    }
+  },
+  methods: {
+    toMsList() {
+      uni.navigateTo({
+        url: `/subPages/msGoodsList/msGoodsList`,
+      });
+    },
+    toMsDetail(item) {
+      // 秒杀详情
+      uni.navigateTo({
+        url: `/subPages/goodsDetail/goodsDetail?code=${item.id}&type=msGoods`,
+      });
+    },
+
+    toDetails(item) {
+      // 秒杀详情
+      uni.navigateTo({
+        url: `/subPages/goodsDetail/goodsDetail?code=${item.code}&type=common`,
+      });
+    },
+    toSubpages(type) {
+      if (type == "pointsZone") {
+        uni.navigateTo({
+          url: `/subPages/pointsZone/pointsZone?id=${this.ponitsBanner.pstn_id}`,
+        });
+      } else {
+        uni.navigateTo({
+          url: `/subPages/giftZone/giftZone?id=${this.giftBanner.pstn_id}`,
+        });
+      }
+    },
+    bannerClick(index) {
+      const currentUrl = this.sourceBanner[index].pic_url
+      if (currentUrl != '#') {
+        uni.navigateTo({
+          url: currentUrl
+        })
+      }
+    },
+    getBanner() {
+      getBanner().then((res) => {
+        const {
+          slider = [],
+          goods_hot = [],
+          goods_cate = [],
+          goods_new = [],
+          seckill_goods = [],
+          integral_page = [],
+          gifts_page = [],
+          shop_name,
+          shop_logo,
+          shop_share_img,
+          shop_bgimg
+        } = res.data;
+        const configs = uni.getStorageSync("configs");
+        console.log("getConfigzj=>", configs);
+        if (configs) {
+          this.logoImg = configs.shop_logo
+          this.bgImg = configs.shop_bgimg
+          this.shopName = configs.shop_share_title
+          this.shopShareImg = configs.shop_share_img
+        } else {
+          this.logoImg = shop_logo
+          this.bgImg = shop_bgimg
+          this.shopName = shop_name
+          this.shopShareImg = shop_share_img
+        }
+        this.bannerList = slider.map(item => item.pic);
+        this.sourceBanner = slider
+        console.log(23333, this.bannerList)
+        this.goodsList = goods_cate;
+        this.commonDataList = goods_new;
+        this.msGoodsList = seckill_goods;
+        this.goods_hot = goods_hot;
+        this.ponitsBanner = integral_page.length && integral_page[0];
+        this.giftBanner = gifts_page.length && gifts_page[0];
+        uni.setStorageSync('mpInfo', {
+          shopName: this.shopName,
+          shareImg: this.shopShareImg
+        })
+      });
+      // const data = {
+      // 	name: 'sliderread'
+      // };
+      // this.$api.getData(data)
+      // 	.then((res) => {
+      // 		uni.hideLoading();
+      // 		console.log("getBanner==>", res.data)
+      // 		if (res.data) {
+      // 			this.bannerList = res.data;
+      // 		} else {}
+      // 	})
+      // 	.catch(() => {
+      // 		uni.hideLoading();
+      // 	});
+    },
+    toSearchList() {
+      uni.navigateTo({
+        url: "/subPages/searchList/searchList",
+      });
+    },
+    getMsData() {
+      uni.showLoading({
+        title: "加载中",
+      });
+      this.$api
+          .getPSMsList()
+          .then((res) => {
+            uni.hideLoading();
+            // this.msGoodsList = res.data && res.data.list || []
+          })
+          .catch(() => {
+            uni.hideLoading();
+          });
+    },
+    getNewsList() {
+      getNewsList({
+        cid: 1,
+        page: 1,
+        pageSize: 100,
+      }).then(({
+                 data = {}
+               }) => {
+        this.advList = data.list || [];
+      });
+    },
+    getCommonData(initFlag) {
+      if (!initFlag) {
+        if (
+            this.commonPage.pageNum * this.commonPage.pageSize <
+            this.commonPage.total
+        ) {
+          this.commonPage.pageNum++;
+        } else {
+          return;
+        }
+      } else {
+        this.commonPage.pageNum = 1;
+        this.commonPage.total = 0;
+        this.commonDataList = [];
+      }
+      let sendData = {
+        limit: this.commonPage.pageSize,
+        page: this.commonPage.pageNum,
+      };
+      uni.showLoading({
+        title: "加载中",
+      });
+      this.$api
+          .getPSGoodsList(sendData)
+          .then((res) => {
+            uni.hideLoading();
+            if (res.code == 1) {
+              const {
+                list = [], page = {}
+              } = res.data;
+              this.commonDataList = this.commonDataList.concat(list);
+              this.commonPage.total = page.total;
+            }
+          })
+          .catch((err) => {
+            uni.hideLoading();
+          });
+    },
+    getFlowData(initFlag) {
+      if (!initFlag) {
+        if (
+            this.flowPage.pageNum * this.flowPage.pageSize <
+            this.flowPage.total
+        ) {
+          this.flowPage.pageNum++;
+        } else {
+          return;
+        }
+      } else {
+        this.flowPage.pageNum = 1;
+        this.flowPage.total = 0;
+        this.flowDataList = [];
+      }
+      let sendData = {
+        limit: this.flowPage.pageSize,
+        page: this.flowPage.pageNum,
+      };
+      uni.showLoading({
+        title: "加载中",
+      });
+      this.$api
+          .getFlowData(sendData)
+          .then((res) => {
+            uni.hideLoading();
+            if (res.code == 1) {
+              const {
+                list = [], page = {}
+              } = res.data;
+              this.flowDataList = this.flowDataList.concat(list);
+              this.flowPage.total = page.total;
+            }
+          })
+          .catch((err) => {
+            uni.hideLoading();
+          });
+    },
+    searchChange() {
+    },
+
+    toDetail(item) {
+      uni.navigateTo({
+        url: "../../subPages/commerceDetail/commerceDetail?id=" + item.id,
+      });
+    },
+    toList(item) {
+      console.log("cateid=====>", item);
+      uni.setStorageSync('currentCateid', item.id)
+      uni.switchTab({
+        url: `/pages/productCenter/productCenter?cateid=${item.id}`,
+      });
+    },
+    handleAdv(index) {
+      const activeAdv = this.advList[index];
+      uni.navigateTo({
+        url: `/pages/article/article?id=${activeAdv.id}`,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.ps-wrapper {
+  background-color: $primary-bg-color;
+
+  .adv-box {
+    position: relative;
+    // padding: 0 33rpx 20rpx;
+    height: 64 rpx;
+    background-color: white;
+    padding: 0 20 rpx 0;
+    border-radius: 16 rpx;
+    margin: 40 rpx 0 20 rpx;
+    font-weight: 500;
+
+    .adv-icon {
+      position: absolute;
+      left: 6 rpx;
+      top: 50%;
+      transform: translateY(-50%);
+    }
+
+    ::v-deep {
+      .u-notice__left-icon {
+        width: 19px;
+
+        .u-icon__icon {
+          display: none;
+        }
+      }
+    }
+  }
+
+  .banner-container {
+    position: relative;
+    width: 100%;
+  }
+
+  .logo-search-container {
+    position: absolute;
+    top: 59px;
+    left: 0;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0 20 rpx;
+    box-sizing: border-box;
+  }
+
+  .centered-image {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 61 rpx;
+  }
+
+  .custom-indicator {
+    position: absolute;
+    left: 0 rpx;
+    right: 0 rpx;
+    bottom: 29 rpx;
+    width: 712 rpx;
+    // margin-right: 24rpx;
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    transform: translateX(-48rpx);
+
+    .custom-indicator-item {
+      width: 16 rpx;
+      height: 16 rpx;
+      margin: 0 6 rpx;
+      border-radius: 12 rpx;
+      background: #666666;
+    }
+
+    .banner-active {
+      width: 48 rpx;
+      background: #222222;
+    }
+  }
+
+  .slot-wrap {
+    background-color: red;
+  }
+
+  .content-box {
+    // overflow-y: auto;
+    background-color: $primary-bg-color;
+    padding: 20 rpx 0 0;
+
+    .part-box {
+      background: linear-gradient(180deg, #fdd118 0%, #f7f7f7 100%);
+      border-radius: 10 rpx 10 rpx 10 rpx 10 rpx;
+      padding: 18 rpx 14 rpx;
+
+      .part-list {
+        display: flex !important;
+        flex-direction: row !important;
+        // justify-content: space-between;
+        background-color: #fff;
+        border-radius: 10 rpx;
+        padding: 15 rpx 15 rpx 30 rpx;
+        font-size: 24 rpx;
+        color: #1d161f;
+        margin-top: 15 rpx;
+
+        &-item {
+          width: calc(33% - 10rpx);
+          margin-right: 10 rpx;
+        }
+      }
+    }
+
+    .newset-box {
+      background: transparent;
+    }
+
+    .biaoti {
+      width: 100%;
+      height: 180 rpx;
+      display: flex;
+      justifyContent: 'center';
+      alignItems: 'center'
+    }
+
+    .rmsp {
+      width: 100%;
+      display: flex;
+      flex-direction: column;
+      border-radius: 16 rpx;
+      background: #FFFFFF;
+
+      .rmsp-title-box {
+        display: flex;
+        width: 100%;
+        margin-top: 20 rpx;
+        flex-direction: row;
+        align-items: center;
+
+        .red-tag {
+          margin-left: 16 rpx;
+          background: linear-gradient(285deg, #FF424F -1%, #FF6973 100%);
+          color: #FFFFFF;
+          padding: 2 rpx 6 rpx;
+          font-size: 20 rpx;
+          white-space: nowrap;
+          border-radius: 4 rpx;
+          overflow: hidden;
+        }
+
+        .more-btn {
+          padding-right: 32 rpx;
+          font-size: 24 rpx;
+          color: #6C6970;
+        }
+      }
+
+      .rm-sv {
+        white-space: nowrap;
+        margin-top: 22 rpx;
+        width: calc(100% - 50rpx);
+        margin-left: 15 rpx;
+
+        .sp-box {
+          display: inline-block;
+          display: flex;
+          flex-direction: row;
+          flex-wrap: nowrap;
+
+          .rm-sp-item {
+            margin-left: 25 rpx;
+            width: 196 rpx;
+            display: flex;
+            flex-direction: column;
+
+            &:active {
+              opacity: 0.7;
+            }
+
+            .rm-title {
+              margin-top: 16 rpx;
+              font-size: 24 rpx;
+              display: -webkit-box;
+              -webkit-box-orient: vertical;
+              overflow: hidden;
+              white-space: pre-wrap;
+              text-overflow: ellipsis;
+              -webkit-line-clamp: 2;
+              /* 这里的数字表示你想显示的行数 */
+              // line-height: 1.2;
+              /* 调整行高以匹配你的字体和设计 */
+              height: calc(1.2em * 2);
+              /* 行高乘以行数 */
+            }
+
+
+            .rm-price {
+              margin-top: 10 rpx;
+              margin-bottom: 30 rpx;
+              width: 196 rpx;
+              font-size: 32 rpx;
+              color: #FF424F;
+            }
+          }
+        }
+      }
+
+    }
+
+    .tjsp {
+      width: 100%;
+      display: flex;
+      flex-direction: column;
+
+      .tjsp-item {
+        width: 100%;
+        border-radius: 16 rpx;
+        background: #FFFFFF;
+        margin-top: 20 rpx;
+        position: relative;
+        display: flex;
+        flex-direction: row;
+
+        &:active {
+          opacity: 0.7;
+        }
+      }
+
+      .tjsp-item-content {
+        display: flex;
+        margin-right: 20 rpx;
+        flex: 1;
+        flex-direction: column;
+
+        .tjsp-title {
+          margin-top: 20 rpx;
+          font-size: 28 rpx;
+          color: #3E3D44;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          overflow: hidden;
+          white-space: pre-wrap;
+          text-overflow: ellipsis;
+          -webkit-line-clamp: 1;
+        }
+
+        .tjsp-remark {
+          width: fit-content;
+          margin-top: 20 rpx;
+          font-size: 20 rpx;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          border-radius: 8 rpx;
+          overflow: hidden;
+          white-space: pre-wrap;
+          padding: 0 10 rpx;
+          text-overflow: ellipsis;
+          -webkit-line-clamp: 1;
+        }
+
+        .tjsp-remark1 {
+          color: #1AC77F;
+          background: #E7FCF3;
+        }
+
+        .tjsp-remark2 {
+          color: #D18D3F;
+          background: #FFF8EF;
+        }
+      }
+
+      .tjsp-price {
+        font-size: 32 rpx;
+        position: absolute;
+        left: 200 rpx;
+        bottom: 20 rpx;
+      }
+    }
+
+  }
+
+  .header-box {
+    width: 100%;
+
+    .qr-code {
+      padding: 0 20 rpx;
+      font-size: 34 rpx;
+      font-weight: 700;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      font-style: italic;
+    }
+
+    .content {
+      width: 100%;
+      z-index: 50;
+      // margin-top: -60rpx;s
+      .title-tab {
+        font-size: 34 rpx;
+        color: #aca9af;
+        font-style: italic;
+        font-weight: 700;
+        margin-bottom: 26 rpx;
+        padding: 0 20 rpx;
+
+        &-item {
+          margin-right: 30 rpx;
+        }
+
+        &-actived {
+          color: #000;
+        }
+      }
+    }
+  }
+
+  .mp-common3 {
+  }
+
+  .goods-list {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    background-color: #FFFFFF;;
+    padding: 0 20 rpx;
+    padding-top: 40 rpx;
+
+    &-item {
+      width: 20%;
+      flex-shrink: 0;
+      text-align: center;
+      margin-bottom: 30 rpx;
+      color: #1d161f;
+      font-size: 26 rpx;
+    }
+  }
+}
+
+.search-box {
+  margin: 0 auto 0 rpx;
+  height: 61 rpx;
+  background: rgba(255, 255, 255, 0.3);
+  border-radius: 30 rpx;
+  opacity: 1;
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+
+  text {
+    font-size: 24 rpx;
+    font-family: PingFang SC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #9D9D9D;
+    line-height: 61 rpx;
+    margin-left: 11 rpx;
+  }
+}
+</style>
+
+<style lang="scss">
+page {
+  height: 100vh;
+}
+</style>