From acf6b7af07eee604012514cb3c36048c7f66cffc Mon Sep 17 00:00:00 2001
From: Gao xiaosong <704041637@qq.com>
Date: Wed, 18 Nov 2020 00:04:53 +0800
Subject: [PATCH] =?UTF-8?q?uniapp=E7=AB=AF=E9=A6=96=E9=A1=B5=E6=A0=87?=
 =?UTF-8?q?=E9=A2=98=E6=A0=8F=E3=80=81=E6=90=9C=E8=BF=87=E7=B4=A2=E8=83=8C?=
 =?UTF-8?q?=E6=99=AF=E8=89=B2=E4=B8=8D=E8=83=BD=E8=B0=83=E7=94=A8=E5=90=8E?=
 =?UTF-8?q?=E7=AB=AF=E6=8F=90=E4=BA=A4=E7=9A=84=E8=83=8C=E6=99=AF=E8=89=B2?=
 =?UTF-8?q?=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/home/index.vue | 859 ++++++++++++++++++++++---------------------
 1 file changed, 434 insertions(+), 425 deletions(-)

diff --git a/pages/home/index.vue b/pages/home/index.vue
index 06fe5d1..de5f53c 100644
--- a/pages/home/index.vue
+++ b/pages/home/index.vue
@@ -1,457 +1,466 @@
 <template>
-	<view class="index">
-		<!-- 导航栏 -->
-		<!--		<view class="head_box " :style="{ background: bgcolor }" :class="{ active: bgcolor }">-->
-		<!--			<view class="cu-custom" :style="[{height:CustomBar+ 'px',}]">-->
-		<!--				<view class="cu-bar fixed" :style="customStyle" :class="[bgcolor]">-->
-		<!--					<view class="action">-->
-		<!--						<text class="nav-title Shop-selector-rect">{{ 'yshop商城' }}</text>-->
-		<!--					</view>-->
-		<!--					<view class="content" :style="[{top:StatusBar + 'px'}]">-->
+  <view class="index">
+    <!-- 导航栏 -->
+    <!--		<view class="head_box " :style="{ background: bgcolor }" :class="{ active: bgcolor }">-->
+    <!--			<view class="cu-custom" :style="[{height:CustomBar+ 'px',}]">-->
+    <!--				<view class="cu-bar fixed" :style="customStyle" :class="[bgcolor]">-->
+    <!--					<view class="action">-->
+    <!--						<text class="nav-title Shop-selector-rect">{{ 'yshop商城' }}</text>-->
+    <!--					</view>-->
+    <!--					<view class="content" :style="[{top:StatusBar + 'px'}]">-->
 
-		<!--					</view>-->
-		<!--				</view>-->
-		<!--			</view>-->
-		<!--		</view>-->
+    <!--					</view>-->
+    <!--				</view>-->
+    <!--			</view>-->
+    <!--		</view>-->
 
-		<view class="head_box " :style="{ background: bgcolor }" :class="{ active: bgcolor }">
-			<cu-custom :isBack="true" :bgColor="bgcolor">
-				<block slot="backText">
-					<text class="nav-title shopro-selector-rect">{{ 'YSHOP商城' }}</text>
-				</block>
-			</cu-custom>
-		</view>
-		<view class="header header-search  acea-row row-center-wrapper" :style="{ background: bgcolor }">
-			<view @click="goGoodSearch()" class="search acea-row row-middle">
-				<text class="iconfont icon-xiazai5"></text>
-				搜索商品
-			</view>
-			<view class="qr" @click="startQr()">
-				<image src="@/static/images/qr.png" />
-			</view>
-		</view>
-		<Banner :detail="banner" v-if="banner.length>0" @getbgcolor="getbgcolor"></Banner>
-		<uni-notice-bar scrollable="true" @click="goRoll(singNew)" single="true" :speed="10" showIcon="true" :text="singNew.info"></uni-notice-bar>
-		<view class="content_box home_content_box">
-			<!-- 菜单 -->
-			<Menu :list="menus"></Menu>
-			<!-- 滚动新闻 -->
-			<!-- 广告 -->
-			<Adv />
-			<!-- 热门榜单 -->
-			<HotCommodity :detail="likeInfo"></HotCommodity>
-			<!-- 超值拼团 -->
-			<Groupon :detail="combinationList" />
-			<!-- 首发新品->秒杀 -->
-			<!-- <FirstNewProduct :detail="firstList"></FirstNewProduct> -->
-			<!-- 精品推荐 -->
-			<!-- <ProductsRecommended :detail="bastList"></ProductsRecommended> -->
-			<!-- 促销单品
+    <view
+      class="head_box"
+      :style="{ background: bgcolor }"
+      :class="{ active: bgcolor }"
+    >
+      <cu-custom :isBack="true" :bgColor="bgcolor">
+        <block slot="backText">
+          <text class="nav-title shopro-selector-rect">{{ "YSHOP商城" }}</text>
+        </block>
+      </cu-custom>
+    </view>
+    <view
+      class="header header-search acea-row row-center-wrapper"
+      :style="{ background: bgcolor }"
+    >
+      <view @click="goGoodSearch()" class="search acea-row row-middle">
+        <text class="iconfont icon-xiazai5"></text>
+        搜索商品
+      </view>
+      <view class="qr" @click="startQr()">
+        <image src="@/static/images/qr.png" />
+      </view>
+    </view>
+    <Banner
+      :detail="banner"
+      v-if="banner.length > 0"
+      @getbgcolor="getbgcolor"
+    ></Banner>
+    <uni-notice-bar
+      scrollable="true"
+      @click="goRoll(singNew)"
+      single="true"
+      :speed="10"
+      showIcon="true"
+      :text="singNew.info"
+    ></uni-notice-bar>
+    <view class="content_box home_content_box">
+      <!-- 菜单 -->
+      <Menu :list="menus"></Menu>
+      <!-- 滚动新闻 -->
+      <!-- 广告 -->
+      <Adv />
+      <!-- 热门榜单 -->
+      <HotCommodity :detail="likeInfo"></HotCommodity>
+      <!-- 超值拼团 -->
+      <Groupon :detail="combinationList" />
+      <!-- 首发新品->秒杀 -->
+      <!-- <FirstNewProduct :detail="firstList"></FirstNewProduct> -->
+      <!-- 精品推荐 -->
+      <!-- <ProductsRecommended :detail="bastList"></ProductsRecommended> -->
+      <!-- 促销单品
 			<PromoteProduct :detail="benefit"></PromoteProduct> -->
-			<!-- 直播 -->
-			<!-- #ifdef MP-WEIXIN -->
-			<Live :detail="live"></Live>
-			<!-- #endif -->
+      <!-- 直播 -->
+      <!-- #ifdef MP-WEIXIN -->
+      <Live :detail="live"></Live>
+      <!-- #endif -->
 
-			<!-- 为您推荐 -->
-			<PromotionGood :benefit="benefit"></PromotionGood>
-		</view>
-		<Coupon-window :coupon-list="couponList" v-if="showCoupon" @checked="couponClose" @close="couponClose">
-		</Coupon-window>
-	</view>
+      <!-- 为您推荐 -->
+      <PromotionGood :benefit="benefit"></PromotionGood>
+    </view>
+    <Coupon-window
+      :coupon-list="couponList"
+      v-if="showCoupon"
+      @checked="couponClose"
+      @close="couponClose"
+    >
+    </Coupon-window>
+  </view>
 </template>
 <script>
-	import {
-		mapState,
-		mapMutations,
-		mapActions
-	} from 'vuex';
-	import GoodList from '@/components/GoodList';
-	import PromotionGood from '@/components/PromotionGood';
-	import CouponWindow from '@/components/CouponWindow';
-	import Menu from '@/components/Menu';
-	import UniNoticeBar from '@/components/uni-notice-bar/uni-notice-bar'
-	import Adv from '@/components/sh-adv'
-	import Groupon from '@/components/sh-groupon.vue'
+import { mapState, mapMutations, mapActions } from "vuex";
+import GoodList from "@/components/GoodList";
+import PromotionGood from "@/components/PromotionGood";
+import CouponWindow from "@/components/CouponWindow";
+import Menu from "@/components/Menu";
+import UniNoticeBar from "@/components/uni-notice-bar/uni-notice-bar";
+import Adv from "@/components/sh-adv";
+import Groupon from "@/components/sh-groupon.vue";
 
-	import Banner from './components/Banner';
-	import HotCommodity from './components/HotCommodity';
-	import FirstNewProduct from './components/FirstNewProduct';
-	import ProductsRecommended from './components/ProductsRecommended';
-	import Live from './components/Live';
+import Banner from "./components/Banner";
+import HotCommodity from "./components/HotCommodity";
+import FirstNewProduct from "./components/FirstNewProduct";
+import ProductsRecommended from "./components/ProductsRecommended";
+import Live from "./components/Live";
 
-	import {
-		getHomeData,
-		getShare
-	} from '@/api/public';
-	import cookie from '@/utils/store/cookie';
-	import {
-		isWeixin,
-		handleUrlParam
-	} from '@/utils/index';
+import { getHomeData, getShare } from "@/api/public";
+import cookie from "@/utils/store/cookie";
+import { isWeixin, handleUrlParam } from "@/utils/index";
 
-	const HAS_COUPON_WINDOW = 'has_coupon_window';
+const HAS_COUPON_WINDOW = "has_coupon_window";
 
-	export default {
-		name: 'Index',
-		components: {
-			// swiper,
-			// swiperSlide,
-			UniNoticeBar,
-			GoodList,
-			PromotionGood,
-			CouponWindow,
-			Menu,
-			Adv,
-			Groupon,
-			Banner,
-			HotCommodity,
-			FirstNewProduct,
-			ProductsRecommended,
-			Live
-		},
-		props: {},
-		data: function() {
-			return {
-				CustomBar: this.CustomBar,
-				StatusBar: this.StatusBar,
-				formatMenus: [],
-				categoryCurrent: 0,
-				menuNum: 4,
-				bgcolor: '',
-				bgColor: '',
-				swiperCurrent: 0, //轮播下标
-				webviewId: 0,
-				showCoupon: false,
-				logoUrl: '',
-				banner: [],
-				menus: [],
-				combinationList: [],
-				roll: [],
-				activity: [],
-				activityOne: {},
-				bastList: [],
-				firstList: [],
-				info: {
-					fastList: [],
-					bastBanner: [],
+export default {
+  name: "Index",
+  components: {
+    // swiper,
+    // swiperSlide,
+    UniNoticeBar,
+    GoodList,
+    PromotionGood,
+    CouponWindow,
+    Menu,
+    Adv,
+    Groupon,
+    Banner,
+    HotCommodity,
+    FirstNewProduct,
+    ProductsRecommended,
+    Live,
+  },
+  props: {},
+  data: function () {
+    return {
+      CustomBar: this.CustomBar,
+      StatusBar: this.StatusBar,
+      formatMenus: [],
+      categoryCurrent: 0,
+      menuNum: 4,
+      bgcolor: "",
+      bgColor: "",
+      swiperCurrent: 0, //轮播下标
+      webviewId: 0,
+      showCoupon: false,
+      logoUrl: "",
+      banner: [],
+      menus: [],
+      combinationList: [],
+      roll: [],
+      activity: [],
+      activityOne: {},
+      bastList: [],
+      firstList: [],
+      info: {
+        fastList: [],
+        bastBanner: [],
 
-					bastList: []
-				},
-				likeInfo: [],
-				live: [],
-				lovely: [],
-				benefit: [],
-				couponList: [],
-				swiperOption: {
-					pagination: {
-						el: '.swiper-pagination',
-						clickable: true
-					},
-					autoplay: {
-						disableOnInteraction: false,
-						delay: 2000
-					},
-					loop: true,
-					speed: 1000,
-					observer: true,
-					observeParents: true
-				},
-				swiperRoll: {
-					direction: 'vertical',
-					autoplay: {
-						disableOnInteraction: false,
-						delay: 2000
-					},
-					loop: true,
-					speed: 1000,
-					observer: true,
-					observeParents: true
-				},
-				swiperScroll: {
-					freeMode: true,
-					freeModeMomentum: false,
-					slidesPerView: 'auto',
-					observer: true,
-					observeParents: true
-				},
-				swiperBoutique: {
-					pagination: {
-						el: '.swiper-pagination',
-						clickable: true
-					},
-					autoplay: {
-						disableOnInteraction: false,
-						delay: 2000
-					},
-					loop: true,
-					speed: 1000,
-					observer: true,
-					observeParents: true
-				},
-				swiperProducts: {
-					freeMode: true,
-					freeModeMomentum: false,
-					slidesPerView: 'auto',
-					observer: true,
-					observeParents: true
-				},
-				bgImage: ''
-			};
-		},
-		computed: {
-			singNew() {
-				return this.roll.length > 0 ? this.roll[0] : "你还没添加通知哦！";
-			},
-			customStyle() {
-				var bgImage = this.bgImage;
-				// var style = `height:${this.CustomBar}px;padding-top:${0}px;background: ${this.bgcolor}`;
-				var style = `height:${this.CustomBar}px;padding-top:${this.StatusBar}px;background: ${this.bgcolor}`;
-				if (this.bgImage) {
-					style = `${style}background-image:url(${bgImage});`;
-				}
-				return style
-			},
-
-		},
-		onLoad: function() {
-			this.getLocation()
-			let that = this;
-			uni.showLoading({
-				title: '加载中'
-			});
-			getHomeData().then(res => {
-				that.logoUrl = res.data.logoUrl;
-				res.data.banner.map(item => item.bgcolor = '')
-				that.$set(that, 'banner', res.data.banner);
-				that.$set(that, 'menus', res.data.menus);
-				that.$set(that, 'roll', res.data.roll);
-				that.$set(that, 'info', res.data.info);
-				that.$set(that, 'firstList', res.data.firstList);
-				that.$set(that, 'bastList', res.data.bastList);
-				that.$set(that, 'likeInfo', res.data.likeInfo);
-				that.$set(that, 'live', res.data.liveList);
-				that.$set(that, 'lovely', res.data.lovely);
-				that.$set(that, 'benefit', res.data.benefit);
-				that.$set(that, 'couponList', res.data.couponList);
-				that.$set(that, 'combinationList', res.data.combinationList);
-				uni.hideLoading();
-				that.setOpenShare();
-				// that.doColorThief()
-			});
-		},
-		methods: {
-			...mapActions(["getLocation"]),
-			onShareTimeline: function() {
-				return {
-					title: this.miniHomeRemark,
-					imageUrl: this.miniHomeImg,
-					path: "pages/home/index?spread=" + uni.getStorageSync("uid")
-				}
-			},
-			onShareAppMessage: function() {
-				return {
-					title: this.miniHomeRemark,
-					imageUrl: this.miniHomeImg,
-					path: "pages/home/index?spread=" + uni.getStorageSync("uid")
-				}
-			},
-			goRoll(item) {
-				if (item.uniapp_url) {
-					this.$yrouter.push(item.uniapp_url)
-				}
-			},
-			goGoodSearch() {
-				// this.$yrouter.push('/pages/shop/GoodsEvaluate/index');
-				this.$yrouter.push('/pages/shop/GoodSearch/index');
-			},
-			goWxappUrl(item) {
-				this.$yrouter.push(item.uniapp_url);
-			},
-			goHotNewGoods(type) {
-				this.$yrouter.push({
-					path: '/pages/shop/HotNewGoods/index',
-					query: {
-						type
-					}
-				});
-			},
-			goGoodsCon(item) {
-				this.$yrouter.push({
-					path: '/pages/shop/GoodsCon/index',
-					query: {
-						id: item.id
-					}
-				});
-			},
-			goGoodsPromotion() {
-				this.$yrouter.push('/pages/shop/GoodsPromotion/index');
-			},
-			setOpenShare: function() {
-				if (this.$deviceType == 'weixin') {
-					getShare().then(res => {
-						var data = res.data.data;
-						var configAppMessage = {
-							desc: data.synopsis,
-							title: data.title,
-							link: location.href,
-							imgUrl: data.img
-						};
-						this.openShareAll(configAppMessage);
-					})
-				}
-			},
-			startQr: function() {
-				uni.scanCode({
-					success: (res) => {
-						let option = handleUrlParam(res.result)
-						switch (option.pageType) {
-							case 'good':
-								// 跳转商品详情
-								this.$yrouter.push({
-									path: '/pages/shop/GoodsCon/index',
-									query: {
-										q: res.result
-									}
-								});
-								break;
-							case 'group':
-								// 跳转团购
-								this.$yrouter.push({
-									path: '/pages/activity/GroupRule/index',
-									query: {
-										q: res.result
-									}
-								});
-								break;
-							case 'dargain':
-								// 跳转砍价
-								this.$yrouter.push({
-									path: '/pages/activity/DargainDetails/index',
-									query: {
-										q: res.result
-									}
-								});
-								break;
-							default:
-								// 跳转分销
-								this.$yrouter.push({
-									path: '/pages/Loading/index',
-									query: {
-
-									}
-								});
-								break;
-						}
-					}
-				});
-			},
-			getbgcolor(e) {
-				this.bgcolor = e;
-			},
-		},
-		created: async function() {
-			// await this.doColorThief();
-		},
-	};
+        bastList: [],
+      },
+      likeInfo: [],
+      live: [],
+      lovely: [],
+      benefit: [],
+      couponList: [],
+      swiperOption: {
+        pagination: {
+          el: ".swiper-pagination",
+          clickable: true,
+        },
+        autoplay: {
+          disableOnInteraction: false,
+          delay: 2000,
+        },
+        loop: true,
+        speed: 1000,
+        observer: true,
+        observeParents: true,
+      },
+      swiperRoll: {
+        direction: "vertical",
+        autoplay: {
+          disableOnInteraction: false,
+          delay: 2000,
+        },
+        loop: true,
+        speed: 1000,
+        observer: true,
+        observeParents: true,
+      },
+      swiperScroll: {
+        freeMode: true,
+        freeModeMomentum: false,
+        slidesPerView: "auto",
+        observer: true,
+        observeParents: true,
+      },
+      swiperBoutique: {
+        pagination: {
+          el: ".swiper-pagination",
+          clickable: true,
+        },
+        autoplay: {
+          disableOnInteraction: false,
+          delay: 2000,
+        },
+        loop: true,
+        speed: 1000,
+        observer: true,
+        observeParents: true,
+      },
+      swiperProducts: {
+        freeMode: true,
+        freeModeMomentum: false,
+        slidesPerView: "auto",
+        observer: true,
+        observeParents: true,
+      },
+      bgImage: "",
+    };
+  },
+  computed: {
+    singNew() {
+      return this.roll.length > 0 ? this.roll[0] : "你还没添加通知哦！";
+    },
+    customStyle() {
+      var bgImage = this.bgImage;
+      // var style = `height:${this.CustomBar}px;padding-top:${0}px;background: ${this.bgcolor}`;
+      var style = `height:${this.CustomBar}px;padding-top:${this.StatusBar}px;background: ${this.bgcolor}`;
+      if (this.bgImage) {
+        style = `${style}background-image:url(${bgImage});`;
+      }
+      return style;
+    },
+  },
+  onLoad: function () {
+    this.getLocation();
+    let that = this;
+    uni.showLoading({
+      title: "加载中",
+    });
+    getHomeData().then((res) => {
+      that.logoUrl = res.data.logoUrl;
+      res.data.banner.map((item) => (item.bgcolor = item.color || ""));
+      that.$set(that, "banner", res.data.banner);
+      that.$set(that, "menus", res.data.menus);
+      that.$set(that, "roll", res.data.roll);
+      that.$set(that, "info", res.data.info);
+      that.$set(that, "firstList", res.data.firstList);
+      that.$set(that, "bastList", res.data.bastList);
+      that.$set(that, "likeInfo", res.data.likeInfo);
+      that.$set(that, "live", res.data.liveList);
+      that.$set(that, "lovely", res.data.lovely);
+      that.$set(that, "benefit", res.data.benefit);
+      that.$set(that, "couponList", res.data.couponList);
+      that.$set(that, "combinationList", res.data.combinationList);
+      uni.hideLoading();
+      that.setOpenShare();
+      // that.doColorThief()
+    });
+  },
+  methods: {
+    ...mapActions(["getLocation"]),
+    onShareTimeline: function () {
+      return {
+        title: this.miniHomeRemark,
+        imageUrl: this.miniHomeImg,
+        path: "pages/home/index?spread=" + uni.getStorageSync("uid"),
+      };
+    },
+    onShareAppMessage: function () {
+      return {
+        title: this.miniHomeRemark,
+        imageUrl: this.miniHomeImg,
+        path: "pages/home/index?spread=" + uni.getStorageSync("uid"),
+      };
+    },
+    goRoll(item) {
+      if (item.uniapp_url) {
+        this.$yrouter.push(item.uniapp_url);
+      }
+    },
+    goGoodSearch() {
+      // this.$yrouter.push('/pages/shop/GoodsEvaluate/index');
+      this.$yrouter.push("/pages/shop/GoodSearch/index");
+    },
+    goWxappUrl(item) {
+      this.$yrouter.push(item.uniapp_url);
+    },
+    goHotNewGoods(type) {
+      this.$yrouter.push({
+        path: "/pages/shop/HotNewGoods/index",
+        query: {
+          type,
+        },
+      });
+    },
+    goGoodsCon(item) {
+      this.$yrouter.push({
+        path: "/pages/shop/GoodsCon/index",
+        query: {
+          id: item.id,
+        },
+      });
+    },
+    goGoodsPromotion() {
+      this.$yrouter.push("/pages/shop/GoodsPromotion/index");
+    },
+    setOpenShare: function () {
+      if (this.$deviceType == "weixin") {
+        getShare().then((res) => {
+          var data = res.data.data;
+          var configAppMessage = {
+            desc: data.synopsis,
+            title: data.title,
+            link: location.href,
+            imgUrl: data.img,
+          };
+          this.openShareAll(configAppMessage);
+        });
+      }
+    },
+    startQr: function () {
+      uni.scanCode({
+        success: (res) => {
+          let option = handleUrlParam(res.result);
+          switch (option.pageType) {
+            case "good":
+              // 跳转商品详情
+              this.$yrouter.push({
+                path: "/pages/shop/GoodsCon/index",
+                query: {
+                  q: res.result,
+                },
+              });
+              break;
+            case "group":
+              // 跳转团购
+              this.$yrouter.push({
+                path: "/pages/activity/GroupRule/index",
+                query: {
+                  q: res.result,
+                },
+              });
+              break;
+            case "dargain":
+              // 跳转砍价
+              this.$yrouter.push({
+                path: "/pages/activity/DargainDetails/index",
+                query: {
+                  q: res.result,
+                },
+              });
+              break;
+            default:
+              // 跳转分销
+              this.$yrouter.push({
+                path: "/pages/Loading/index",
+                query: {},
+              });
+              break;
+          }
+        },
+      });
+    },
+    getbgcolor(e) {
+      this.bgcolor = e;
+    },
+  },
+  created: async function () {
+    // await this.doColorThief();
+  },
+};
 </script>
 <style scoped lang="less">
-	.content_box {
-		background: #f6f6f6;
-	}
-
-	.index {
-		background-color: #fff;
-	}
+.content_box {
+  background: #f6f6f6;
+}
 
-	.swiper-item {
-		height: 100%;
-	}
+.index {
+  background-color: #fff;
+}
 
-	.fixed-header {
-		position: fixed;
-		z-index: 99;
-		// #ifdef H5
-		top: 88rpx;
-		// #endif
+.swiper-item {
+  height: 100%;
+}
 
-		// #ifndef H5
-		top: 0;
-		// #endif
-		left: 0;
-		right: 0;
-		background: #fff;
-		box-shadow: 0 0 20rpx -10rpx #aaa;
+.fixed-header {
+  position: fixed;
+  z-index: 99;
+  // #ifdef H5
+  top: 88rpx;
+  // #endif
 
-		&+.fixed-header-box {
-			height: 98rpx
-		}
-	}
+  // #ifndef H5
+  top: 0;
+  // #endif
+  left: 0;
+  right: 0;
+  background: #fff;
+  box-shadow: 0 0 20rpx -10rpx #aaa;
 
-	.head_box {
-		width: 750rpx;
-		// background: #fff;
-		transition: all linear 0.3s;
+  & + .fixed-header-box {
+    height: 98rpx;
+  }
+}
 
-		/deep/.cuIcon-back {
-			display: none;
-		}
+.head_box {
+  width: 750rpx;
+  // background: #fff;
+  transition: all linear 0.3s;
 
-		.nav-title {
-			font-size: 38rpx;
-			font-family: PingFang SC;
-			font-weight: 500;
-			color: #fff;
-		}
-	}
+  /deep/.cuIcon-back {
+    display: none;
+  }
 
-	.cu-bar.fixed {
-		position: fixed;
-		width: 100%;
-		top: 0;
-		z-index: 1024;
-		// box-shadow: 0 1upx 6upx rgba(0, 0, 0, 0.1);
-	}
+  .nav-title {
+    font-size: 38rpx;
+    font-family: PingFang SC;
+    font-weight: 500;
+    color: #fff;
+  }
+}
 
-	.cu-bar {
-		box-sizing: border-box;
+.cu-bar.fixed {
+  position: fixed;
+  width: 100%;
+  top: 0;
+  z-index: 1024;
+  // box-shadow: 0 1upx 6upx rgba(0, 0, 0, 0.1);
+}
 
-		.index .header {
-			height: 64rpx;
-			// width: 100%;
-			// padding: 0 30rpx;
-			// box-sizing: border-box;
+.cu-bar {
+  box-sizing: border-box;
 
-		}
-	}
+  .index .header {
+    height: 64rpx;
+    // width: 100%;
+    // padding: 0 30rpx;
+    // box-sizing: border-box;
+  }
+}
 
-	.header-search {
-		transition: all linear 0.3s;
-	}
+.header-search {
+  transition: all linear 0.3s;
+}
 
-	.cu-bar .action {
-		display: -webkit-box;
-		display: -webkit-flex;
-		display: flex;
-		align-items: center;
-		height: 100%;
-		max-height: 100%;
+.cu-bar .action {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: flex;
+  align-items: center;
+  height: 100%;
+  max-height: 100%;
 
-		&:first-child {
-			margin-left: 15px;
-			font-size: 15px;
-		}
-	}
+  &:first-child {
+    margin-left: 15px;
+    font-size: 15px;
+  }
+}
 
-	.home_content_box {
-		margin-top: -10rpx;
-	}
+.home_content_box {
+  margin-top: -10rpx;
+}
 
-	.head_box {
-	}
+.head_box {
+}
 
-	.nav-title {
-		margin-left: 20rpx;
-		line-height: 40px;
-	}
+.nav-title {
+  margin-left: 20rpx;
+  line-height: 40px;
+}
 </style>