Browse Source

修复问题

hejie 3 years ago
parent
commit
27fb12c654
1 changed files with 384 additions and 336 deletions
  1. 384 336
      src/pages/sign/index.vue

+ 384 - 336
src/pages/sign/index.vue

@@ -1,473 +1,521 @@
 <template>
-    <view class="container">
-        <!-- 用户信息 -->
-        <view class="userinfo flex_r flex_ac">
-            <image class="user_img" :src="userinfo.head_pic" mode=""></image>
-            <view class="user_info flex_c flex_jc">
-                <view class="user_name">{{ userinfo.nickname }}</view>
-                <view class="level_con flex_r flex_ac">
-                    <view class="level">{{ userinfo.level_name }}</view>
-                </view>
-            </view>
-            <!-- <view class="record flex_r flex_ac flex_jc" @tap="NavToSignList">积分记录</view> -->
+  <view class="container">
+    <!-- 用户信息 -->
+    <view class="userinfo flex_r flex_ac">
+      <image class="user_img" :src="userinfo.head_pic" mode=""></image>
+      <view class="user_info flex_c flex_jc">
+        <view class="user_name">{{ userinfo.nickname }}</view>
+        <view class="level_con flex_r flex_ac">
+          <view class="level">{{ userinfo.level_name }}</view>
         </view>
-        <!-- 用户信息-end -->
-        <!-- 签到信息 -->
-        <view class="sign_info flex_c">
-            <view class="info flex_r flex_ac flex_jb">
-                <view class="info_today flex_c flex_ac">
-                    <view class="today_text g_color">{{todaySign}}</view>
-                    <view class="info_text">今日签到</view>
-                </view>
-                <view class="info_today flex_c flex_ac">
-                    <view class="today_text">{{totalSign}}</view>
-                    <view class="info_text">累计签到({{totalSign || 0}}次)</view>
-                </view>
-                <view class="info_con">
-                    <image class="info_img" :src="nextSign > 0 ? '/static/sgin/p_back2.png' : '/static/sgin/p_back.png'" mode="" />
-                    <view class="info_texts flex_r flex_ac flex_jc" v-if="nextSign > 0">{{ timer }}</view>
-                    <view class="info_texts flex_r flex_ac flex_jc" @tap="setSignIn" v-else>立即签到</view>
-                </view>
-            </view>
-            <view class="sign_time flex_r flex_ac flex_je mar_t20">
-                <text></text>
-            </view>
+      </view>
+      <!-- <view class="record flex_r flex_ac flex_jc" @tap="NavToSignList">积分记录</view> -->
+    </view>
+    <!-- 用户信息-end -->
+    <!-- 签到信息 -->
+    <view class="sign_info flex_c">
+      <view class="info flex_r flex_ac flex_jb">
+        <view class="info_today flex_c flex_ac">
+          <view class="today_text g_color">{{ todaySign }}</view>
+          <view class="info_text">今日签到</view>
+        </view>
+        <view class="info_today flex_c flex_ac">
+          <view class="today_text">{{ totalSign }}</view>
+          <view class="info_text">累计签到({{ totalSign || 0 }}次)</view>
+        </view>
+        <view class="info_con">
+          <image
+            class="info_img"
+            :src="
+              nextSign > 0
+                ? '/static/sgin/p_back2.png'
+                : '/static/sgin/p_back.png'
+            "
+            mode=""
+          />
+          <view class="info_texts flex_r flex_ac flex_jc" v-if="nextSign > 0">{{
+            timer
+          }}</view>
+          <view
+            class="info_texts flex_r flex_ac flex_jc"
+            @tap="setSignIn"
+            v-else
+            >立即签到</view
+          >
         </view>
-        <!-- 签到信息-end -->
-        
-        <!-- 精品推荐 -->
-        <view class="bou_head flex_r flex_ac flex_jc">
-            <image class="bou_img" src="/static/sgin/left.png" mode=""></image>
-            <view class="bou_title">精品推荐</view>
-            <image class="bou_img" src="/static/sgin/right.png" mode=""></image>
+      </view>
+      <view class="sign_time flex_r flex_ac flex_je mar_t20">
+        <text></text>
+      </view>
+    </view>
+    <!-- 签到信息-end -->
+
+    <!-- 精品推荐 -->
+    <view class="bou_head flex_r flex_ac flex_jc">
+      <image class="bou_img" src="/static/sgin/left.png" mode=""></image>
+      <view class="bou_title">精品推荐</view>
+      <image class="bou_img" src="/static/sgin/right.png" mode=""></image>
+    </view>
+    <view class="product-list">
+      <view
+        class="product"
+        v-for="(i, s) in goods"
+        :key="s"
+        @click="NavToGoodsDetail(i.id, i.type)"
+      >
+        <view class="image-view">
+          <image class="product-image" :src="i.original_img"></image>
         </view>
-        <view class="product-list">
-            <view class="product" v-for="(i, s) in goods" :key="s" @click="NavToGoodsDetail(i.id,i.type)">
-                <view class="image-view">
-                    <image class="product-image" :src="i.original_img"></image>
-                </view>
-                <view class="content-view">
-                    <view :class="['product-title', 'ellipsis1']">{{ i.goods_name }}</view>
-                    <view class="product-price">
-                        <text class="product-price-original"><text class="product-unit">¥</text>{{ i.price }}</text>
-                        <!-- <text class="product-price-favour">¥{{i.originalPrice}}</text> -->
-                        <!-- <text class="product-tip">{{i.tip}}</text> -->
-                    </view>
-                    <view class="product-txt">赠送{{ i.give_integral ? i.give_integral + '批发积分' : i.give_cha_bao + '茶宝'}}</view>
-                </view>
-            </view>
-            <view class='fz_w_text mar_t20 mar_b20'>让数字经济赋能美好生活!</view>
+        <view class="content-view">
+          <view :class="['product-title', 'ellipsis1']">{{
+            i.goods_name
+          }}</view>
+          <view class="product-price">
+            <text class="product-price-original"
+              ><text class="product-unit">¥</text>{{ i.price }}</text
+            >
+            <!-- <text class="product-price-favour">¥{{i.originalPrice}}</text> -->
+            <!-- <text class="product-tip">{{i.tip}}</text> -->
+          </view>
+          <view class="product-txt"
+            >赠送{{
+              i.give_integral
+                ? i.give_integral + "批发积分"
+                : i.give_cha_bao + "茶宝"
+            }}</view
+          >
         </view>
-        <!-- 精品推荐-end -->
+      </view>
+      <view class="fz_w_text mar_t20 mar_b20">让数字经济赋能美好生活!</view>
     </view>
+    <!-- 精品推荐-end -->
+  </view>
 </template>
 <script>
-var tim
+var tim;
 let page = 1;
 let app = getApp();
 var appEv = app.$vm.$options;
-import uniPopup from '@/components/uni-popup/uni-popup'
+import uniPopup from "@/components/uni-popup/uni-popup";
 import { get, post } from "@/request/api.js";
 export default {
-    components: { uniPopup },
-    data() {
-        return {
-            integerInfo: {}, // 积分详情
-            userInof: {}, // 用户详情
-            timer: '00:00:00', // 倒计时
-            goods: [], // 精品推荐
-            haveGoods: false, // 是否有商品
-            way_list: [], //兑换方式
-            checked: false, //是否选中协议
-            currrent: 0, // 选中的兑换方式
-            pay_way: 0, //选中的支付方式
-            isShow: false, // 是否显示现金支付
-            goodsId: '', // 选中的商品Id
-            shopInfo: {}, // 商户信息
-            userinfo:undefined, //用户信息
-            todaySign:0, //今日签到数
-            totalSign:0, //累计签到数
-            nextSign:0, //剩余签到时间 秒
-        };
+  components: { uniPopup },
+  data() {
+    return {
+      integerInfo: {}, // 积分详情
+      userInof: {}, // 用户详情
+      timer: "00:00:00", // 倒计时
+      goods: [], // 精品推荐
+      haveGoods: false, // 是否有商品
+      way_list: [], //兑换方式
+      checked: false, //是否选中协议
+      currrent: 0, // 选中的兑换方式
+      pay_way: 0, //选中的支付方式
+      isShow: false, // 是否显示现金支付
+      goodsId: "", // 选中的商品Id
+      shopInfo: {}, // 商户信息
+      userinfo: undefined, //用户信息
+      todaySign: 0, //今日签到数
+      totalSign: 0, //累计签到数
+      nextSign: 0, //剩余签到时间 秒
+      canClick: true,
+    };
+  },
+  onShow() {
+    // this.timer = '00:00:00'
+    this.userinfo = uni.getStorageSync("userinfo");
+    this.loadData();
+    this.goodsDay();
+  },
+  onHide() {
+    clearInterval(tim);
+  },
+  methods: {
+    loadData() {
+      post("/user/sign").then((res) => {
+        if (res.code == 0) {
+          this.todaySign = res.data.today_sign;
+          this.totalSign = res.data.total_sign;
+          this.nextSign = res.data.next_sign;
+          this.setTime();
+        }
+      });
     },
-    onShow() {
-        // this.timer = '00:00:00'
-        this.userinfo = uni.getStorageSync("userinfo")
-        this.loadData()
-        this.goodsDay()
+    // 距可以签到倒计时
+    setTime() {
+      var date;
+      let timer = this.nextSign;
+      tim = setInterval(() => {
+        if (timer >= 1) {
+          timer--;
+        } else {
+          clearInterval(tim);
+          this.nextSign = 0;
+        }
+
+        let hour =
+          parseInt(timer / 3600) > 9
+            ? parseInt(timer / 3600)
+            : "0" + parseInt(timer / 3600);
+        let min =
+          parseInt((timer / 60) % 60) > 9
+            ? parseInt((timer / 60) % 60)
+            : "0" + parseInt((timer / 60) % 60);
+        let sec =
+          parseInt(timer % 60) > 9
+            ? parseInt(timer % 60)
+            : "0" + parseInt(timer % 60);
+
+        date = hour + ":" + min + ":" + sec;
+        // console.log(date);
+        this.timer = date;
+      }, 999);
     },
-    onHide() {
-        clearInterval(tim)
+    // 签到
+    setSignIn() {
+      if (this.canClick) {
+        this.canClick = false;
+        let data = {
+            time:(new Date().getTime() / 1000).toFixed(0)
+        }
+        post("user/doSign",data).then((res) => {
+          if (res.code === 0) {
+            appEv.errTips(res.msg);
+            this.loadData();
+          } else {
+            appEv.errTips(res.msg);
+          }
+        });
+        setTimeout(() => {
+            this.canClick = true
+        }, 2000);
+      }
     },
-    methods: {
-        loadData() {
-            post("/user/sign").then(res => {
-                if (res.code == 0) {
-                    this.todaySign = res.data.today_sign
-                    this.totalSign = res.data.total_sign
-                    this.nextSign = res.data.next_sign
-                    this.setTime()
-                }
-            })
-        },
-        // 距可以签到倒计时
-        setTime() {
-            var date;
-            let timer = this.nextSign
-            tim = setInterval(() => {
-                if (timer >= 1) {
-                    timer--
-                } else {
-                    clearInterval(tim)
-                    this.nextSign = 0;
-                }
-
-                let hour = parseInt(timer / 3600) > 9 ? parseInt(timer / 3600) : '0' + parseInt(timer / 3600)
-                let min = parseInt(timer / 60 % 60) > 9 ? parseInt(timer / 60 % 60) : '0' + parseInt(timer / 60 % 60)
-                let sec = parseInt(timer % 60) > 9 ? parseInt(timer % 60) : '0' + parseInt(timer % 60)
-                
-                date = hour + ':' + min + ':' + sec;
-                // console.log(date);
-                this.timer = date
-            }, 999)
-        },
-        // 签到
-        setSignIn() {
-            post("user/doSign").then(res => {
-                if (res.code === 0) {
-                    appEv.errTips(res.msg)
-                    this.loadData()
-                } else {
-                    appEv.errTips(res.msg)
-                }
-            })
-        },
-
-        // 获取今日值得买
-        goodsDay() {
-            let that = this;
-            let data = {
-                page: page,
-                type: 4
+
+    // 获取今日值得买
+    goodsDay() {
+      let that = this;
+      let data = {
+        page: page,
+        type: 4,
+      };
+      post("goods/goodsList", data).then((res) => {
+        if (res.code === 0) {
+          let obj = res.data.data;
+          if (page <= 1) that.goods = [];
+          if (obj.length > 0) {
+            obj.forEach((e) => {
+              that.goods.push(e);
+            });
+          } else {
+            if (page == 1) {
+              that.haveGoods = true;
+              page = -1;
+            } else {
+              page = -1;
+              appEv.errTips("暂无更多");
             }
-            post("goods/goodsList", data).then(res => {
-                if (res.code === 0) {
-                    let obj = res.data.data
-                    if(page <= 1) that.goods = []
-                    if (obj.length > 0) {
-                        obj.forEach(e => {
-                            that.goods.push(e)
-                        });
-                    } else {
-                        if (page == 1) {
-                            that.haveGoods = true
-                            page = -1
-                        } else {
-                            page = -1
-                            appEv.errTips('暂无更多')
-                        }
-                    }
-                } else {
-                    if (page == 1) {
-                        that.haveGoods = true
-                        page = -1
-                    } else {
-                        page = -1
-                        appEv.errTips('暂无更多')
-                    }
-                }
-            })
-        },
-        // 跳转到商品详情页
-        NavToGoodsDetail(id, type) {
-            this.goto("/pages/product/p_details", { id, type });
-        },
-    },
-    //页面上拉触底事件的处理函数
-    onReachBottom() {
-        if (page != -1) {
-            setTimeout(() => {
-                ++page;
-                this.goodsDay();
-            }, 500);
+          }
+        } else {
+          if (page == 1) {
+            that.haveGoods = true;
+            page = -1;
+          } else {
+            page = -1;
+            appEv.errTips("暂无更多");
+          }
         }
+      });
+    },
+    // 跳转到商品详情页
+    NavToGoodsDetail(id, type) {
+      this.goto("/pages/product/p_details", { id, type });
+    },
+  },
+  //页面上拉触底事件的处理函数
+  onReachBottom() {
+    if (page != -1) {
+      setTimeout(() => {
+        ++page;
+        this.goodsDay();
+      }, 500);
     }
-}
+  },
+};
 </script>
 <style lang="scss" scoped>
 // 页面配置
 page {
-    background: #f5f5f5;
+  background: #f5f5f5;
 }
 
 .container {
-    padding: var(--status-bar-height) 30rpx 30rpx;
-    box-sizing: border-box;
-    background: url('https://tea.soowin.com/mnt/image/sign_back.png');
-    background-repeat: no-repeat;
-    background-size: 100% 427rpx;
+  padding: var(--status-bar-height) 30rpx 30rpx;
+  box-sizing: border-box;
+  background: url("https://tea.soowin.com/mnt/image/sign_back.png");
+  background-repeat: no-repeat;
+  background-size: 100% 427rpx;
 }
 
 // 页面配置-end
 
 // 用户信息
 .userinfo {
-    width: 100%;
-    // margin-top: 24rpx;
-    position: relative;
+  width: 100%;
+  // margin-top: 24rpx;
+  position: relative;
 }
 
 .user_img {
-    width: 101.5rpx;
-    height: 101.5rpx;
-    margin-right: 20rpx;
-    border-radius: 50%;
+  width: 101.5rpx;
+  height: 101.5rpx;
+  margin-right: 20rpx;
+  border-radius: 50%;
 }
 
 .level {
-    background: rgba(0, 0, 0, .18);
-    padding: 6rpx 24rpx;
-    font-size: 24rpx;
-    color: #fff;
-    border-radius: 100rpx;
+  background: rgba(0, 0, 0, 0.18);
+  padding: 6rpx 24rpx;
+  font-size: 24rpx;
+  color: #fff;
+  border-radius: 100rpx;
 }
 
 .user_name {
-    font-size: 30rpx;
-    color: #333;
-    font-family: "SourceHanSansSC-Medium";
-    font-weight: 500;
-    margin-bottom: 18rpx;
-    line-height: 1;
+  font-size: 30rpx;
+  color: #333;
+  font-family: "SourceHanSansSC-Medium";
+  font-weight: 500;
+  margin-bottom: 18rpx;
+  line-height: 1;
 }
 
 .record {
-    width: 136rpx;
-    height: 54rpx;
-    background: rgba(0, 0, 0, .18);
-    color: #fff;
-    font-size: 24rpx;
-    border-radius: 27rpx 0 0 27rpx;
-    position: absolute;
-    bottom: calc(50% - 27rpx);
-    right: -30rpx;
+  width: 136rpx;
+  height: 54rpx;
+  background: rgba(0, 0, 0, 0.18);
+  color: #fff;
+  font-size: 24rpx;
+  border-radius: 27rpx 0 0 27rpx;
+  position: absolute;
+  bottom: calc(50% - 27rpx);
+  right: -30rpx;
 }
 
 // 用户信息-end
 
 // 签到信息
 .info {
-    width: 100%;
-    overflow: hidden;
+  width: 100%;
+  overflow: hidden;
 }
 
 .info_text {
-    font-size: 24rpx;
-    color: #404040;
+  font-size: 24rpx;
+  color: #404040;
 }
 
 .info_con {
-    width: 185rpx;
-    height: 185rpx;
-    position: relative;
+  width: 185rpx;
+  height: 185rpx;
+  position: relative;
 }
 
 .info_img {
-    width: 100%;
-    height: 185rpx;
-    animation: myfirst 1s infinite;
+  width: 100%;
+  height: 185rpx;
+  animation: myfirst 1s infinite;
 }
 
 .info_texts {
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    top: 0;
-    left: 0;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
 }
 
 .today_text {
-    font-family: "SourceHanSansCN-Medium";
-    font-size: 53rpx;
-    color: #373737;
+  font-family: "SourceHanSansCN-Medium";
+  font-size: 53rpx;
+  color: #373737;
 }
 
 .info_texts text {
-    width: 56rpx;
-    text-align: justify;
-    font-size: 28rpx;
-    color: #12B381;
+  width: 56rpx;
+  text-align: justify;
+  font-size: 28rpx;
+  color: #12b381;
 }
 
 .sign_time text {
-    width: 185rpx;
-    overflow: hidden;
-    font-size: 36rpx;
-    color: #353535;
-    font-family: "SourceHanSansCN-Bold";
-    font-weight: bold;
+  width: 185rpx;
+  overflow: hidden;
+  font-size: 36rpx;
+  color: #353535;
+  font-family: "SourceHanSansCN-Bold";
+  font-weight: bold;
 }
 
 .sign_info {
-    width: 100%;
-    overflow: hidden;
-    background: #fff;
-    border-radius: 16rpx;
-    box-shadow: 0px 3px 0px 0px rgba(16, 178, 127, 0.36), 0px 6px 10px 0px rgba(17, 179, 129, 0.2);
-    padding: 24rpx 40rpx;
-    box-sizing: border-box;
-    margin-top: 44rpx;
+  width: 100%;
+  overflow: hidden;
+  background: #fff;
+  border-radius: 16rpx;
+  box-shadow: 0px 3px 0px 0px rgba(16, 178, 127, 0.36),
+    0px 6px 10px 0px rgba(17, 179, 129, 0.2);
+  padding: 24rpx 40rpx;
+  box-sizing: border-box;
+  margin-top: 44rpx;
 }
 
 .g_color {
-    color: #12B381;
+  color: #12b381;
 }
 
 .gr_color {
-    color: #999 !important;
+  color: #999 !important;
 }
 
 // 签到信息-end
 
-
 // 动画效果
 @keyframes myfirst {
-    0% {
-        transform: rotate(0);
-    }
+  0% {
+    transform: rotate(0);
+  }
 
-    10% {
-        transform: rotate(-36deg);
-    }
+  10% {
+    transform: rotate(-36deg);
+  }
 
-    20% {
-        transform: rotate(-72deg);
-    }
+  20% {
+    transform: rotate(-72deg);
+  }
 
-    30% {
-        transform: rotate(-108deg);
-    }
+  30% {
+    transform: rotate(-108deg);
+  }
 
-    40% {
-        transform: rotate(-144deg);
-    }
+  40% {
+    transform: rotate(-144deg);
+  }
 
-    50% {
-        transform: rotate(-180deg);
-    }
+  50% {
+    transform: rotate(-180deg);
+  }
 
-    60% {
-        transform: rotate(-216deg);
-    }
+  60% {
+    transform: rotate(-216deg);
+  }
 
-    70% {
-        transform: rotate(-252deg);
-    }
+  70% {
+    transform: rotate(-252deg);
+  }
 
-    80% {
-        transform: rotate(-288deg);
-    }
+  80% {
+    transform: rotate(-288deg);
+  }
 
-    90% {
-        transform: rotate(-324deg);
-    }
+  90% {
+    transform: rotate(-324deg);
+  }
 
-    100% {
-        transform: rotate(-360deg);
-    }
+  100% {
+    transform: rotate(-360deg);
+  }
 }
 
 // 动画效果-end
 
 // 积分兑好礼
 .more {
-    font-size: 24rpx;
-    color: #313131;
+  font-size: 24rpx;
+  color: #313131;
 }
 
 .inte_con {
-    width: 100%;
-    overflow: hidden;
+  width: 100%;
+  overflow: hidden;
 }
 
 .goods_price {
-    font-size: 30rpx;
-    color: #F15C21;
+  font-size: 30rpx;
+  color: #f15c21;
 }
 
 .inte_goods:nth-last-child(1) {
-    margin-right: 0;
+  margin-right: 0;
 }
 
 .goods_price text {
-    font-size: 18rpx;
-    color: #F15C21;
+  font-size: 18rpx;
+  color: #f15c21;
 }
 
 .more_img {
-    width: 9rpx;
-    height: 16rpx;
-    margin-left: 10rpx;
+  width: 9rpx;
+  height: 16rpx;
+  margin-left: 10rpx;
 }
 
 .goods_img {
-    width: 100%;
-    height: 141rpx;
-    margin-bottom: 16rpx;
+  width: 100%;
+  height: 141rpx;
+  margin-bottom: 16rpx;
 }
 
 .goods_name {
-    width: 100%;
-    overflow: hidden;
-    color: #1D1D1D;
-    font-size: 24rpx;
+  width: 100%;
+  overflow: hidden;
+  color: #1d1d1d;
+  font-size: 24rpx;
 }
 
 .inte_goods {
-    width: calc((100% - 28rpx) / 3);
-    margin-right: 14rpx;
-    overflow: hidden;
+  width: calc((100% - 28rpx) / 3);
+  margin-right: 14rpx;
+  overflow: hidden;
 }
 
 .inte_title {
-    font-size: 36rpx;
-    color: #2A2A2A;
-    font-family: "SourceHanSansSC-Bold";
-    font-weight: bold;
+  font-size: 36rpx;
+  color: #2a2a2a;
+  font-family: "SourceHanSansSC-Bold";
+  font-weight: bold;
 }
 
 .integral {
-    width: 100%;
-    overflow: hidden;
-    background: #fff;
-    padding: 30rpx;
-    box-sizing: border-box;
-    border-radius: 20rpx;
+  width: 100%;
+  overflow: hidden;
+  background: #fff;
+  padding: 30rpx;
+  box-sizing: border-box;
+  border-radius: 20rpx;
 }
 
 // 积分兑好礼-end
 
-
 // 精彩推荐
-.bou_head{
-    width: 100%;
-    height: 114rpx;
-    margin-top: 50rpx;
-    .bou_img{
-        width: 89rpx;
-        height: 30rpx;
-    }
-    .bou_title{
-        font-size: 36rpx;
-        color:#121212;
-        font-family: "SourceHanSansSC-Bold";
-        font-weight: bold;
-        margin: 0 36rpx;
-    }
+.bou_head {
+  width: 100%;
+  height: 114rpx;
+  margin-top: 50rpx;
+  .bou_img {
+    width: 89rpx;
+    height: 30rpx;
+  }
+  .bou_title {
+    font-size: 36rpx;
+    color: #121212;
+    font-family: "SourceHanSansSC-Bold";
+    font-weight: bold;
+    margin: 0 36rpx;
+  }
 }
 
 .product-list {
-//   padding: 0 20rpx;
+  //   padding: 0 20rpx;
   display: flex;
   width: 100%;
   flex-wrap: wrap;
@@ -484,21 +532,21 @@ page {
     // border: 1px solid #eee;
     border-radius: 5px;
     box-shadow: 4rpx 4rpx 26rpx 2rpx rgba(17, 18, 29, 0.08);
-    &:nth-child(2n){
-        margin-left: 3%;
+    &:nth-child(2n) {
+      margin-left: 3%;
     }
   }
 
   .product-image {
     border-radius: 10rpx 10rpx 0 0;
     width: 100%;
-    height:41vw;
+    height: 41vw;
     object-fit: cover;
   }
 
-    .content-view{
-        padding: 0 16rpx;
-    }
+  .content-view {
+    padding: 0 16rpx;
+  }
 
   .product-title {
     width: 100%;