style(client): 优化背景颜色

src/PageMine/coupon/coupon - 副本.vue

@@ -2,38 +2,60 @@
   <view class="container">
     <!-- 顶部导航栏 -->
     <view class="top-tab">
-      <u-tabs class="tab" :list="list" @click="handlerChangeTab1" :activeStyle="{
+      <u-tabs
+        class="tab"
+        :list="list"
+        @click="handlerChangeTab1"
+        :activeStyle="{
           color: '#fff',
           fontWeight: 'bold',
           transform: 'scale(1.05)',
-        }" :inactiveStyle="{
+        }"
+        :inactiveStyle="{
           color: '#fff',
           transform: 'scale(1)',
-        }" itemStyle="height: 34px; width:27%;" lineColor="#D89A4C"></u-tabs>
+        }"
+        itemStyle="height: 34px; width:27%;"
+        lineColor="#D89A4C"
+      ></u-tabs>
     </view>
 
     <!-- 优惠券的可用和失效 -->
     <view class="use">
-      <u-tabs :list="list2" lineWidth="60" lineColor="#347caf" :scrollable="false" :activeStyle="{
+      <u-tabs
+        :list="list2"
+        lineWidth="60"
+        lineColor="#347caf"
+        :scrollable="false"
+        :activeStyle="{
           color: '#347caf',
           fontWeight: 'bold',
           transform: 'scale(1.05)',
-        }" :inactiveStyle="{
+        }"
+        :inactiveStyle="{
           color: '#b7b6b8',
           transform: 'scale(1)',
-        }" itemStyle="padding-left: 90rpx; padding-right: 80rpx; height: 120rpx;" @change="handlerSelectTab" />
+        }"
+        itemStyle="padding-left: 90rpx; padding-right: 80rpx; height: 120rpx;"
+        @change="handlerSelectTab"
+      />
     </view>
 
     <!-- 优惠券可用 -->
-    <view class="couponUse" v-show="lable_type == 0" :key="index" v-for="(item, index) of init_list">
+    <view
+      class="couponUse"
+      v-show="lable_type == 0"
+      :key="index"
+      v-for="(item, index) of init_list"
+    >
       <view class="useLeft">
         <view>{{ item.couponVO.name }}</view>
         <text>到期时间 : {{ item.couponVO.dueTime }}</text>
       </view>
       <view class="useRight">
-        <view class="text">{{ 10 - item.couponVO.reduce  }}<text>折</text></view>
+        <view class="text">{{ 10 - item.couponVO.reduce }}<text>折</text></view>
         <view>折扣</view>
-        <view class="gouUse" @click='handlerToUsed(item)'>去使用</view>
+        <view class="gouUse" @click="handlerToUsed(item)">去使用</view>
       </view>
     </view>
 
@@ -43,174 +65,173 @@
 </template>
 
 <script>
-  import {
-    getUserAcceptCouponsList
-  } from '@/api/client/mine.js';
-  export default {
-    data() {
-      return {
-        list: [{
-            id: 1,
-            name: '满减',
-            type: 'REDUCE',
-          },
-          {
-            id: 2,
-            name: '折扣',
-            type: 'DISCOUNT',
-          },
-          {
-            id: 3,
-            name: '赠送',
-            type: 'GIVE',
-          },
-        ],
-        list2: [{
-            name: '可用',
-            type: 'UNUSED',
-          },
-          {
-            name: '失效',
-            type: 'CLOSED',
-          },
-        ],
-        lable_type: 0, // 是否可用
-        queryParams: {
-          size: '10', //分页信息  取值范围: 页码,分页大小
-          type: 'REDUCE', //优惠券类型 允许值: GIVE(赠送), REDUCE(满减), DISCOUNT(折扣)
-          status: 'UNUSED', // 用户优惠券状态 UNUSED(未使用), USED(已使用), EXPIRED(已过期), CLOSED(作废)
+import { getUserAcceptCouponsList } from '@/api/client/mine.js';
+export default {
+  data() {
+    return {
+      list: [
+        {
+          id: 1,
+          name: '满减',
+          type: 'REDUCE',
         },
-        init_list: [], //初始化列表
-        total: 0,
-      };
+        {
+          id: 2,
+          name: '折扣',
+          type: 'DISCOUNT',
+        },
+        {
+          id: 3,
+          name: '赠送',
+          type: 'GIVE',
+        },
+      ],
+      list2: [
+        {
+          name: '可用',
+          type: 'UNUSED',
+        },
+        {
+          name: '失效',
+          type: 'CLOSED',
+        },
+      ],
+      lable_type: 0, // 是否可用
+      queryParams: {
+        size: '10', //分页信息  取值范围: 页码,分页大小
+        type: 'REDUCE', //优惠券类型 允许值: GIVE(赠送), REDUCE(满减), DISCOUNT(折扣)
+        status: 'UNUSED', // 用户优惠券状态 UNUSED(未使用), USED(已使用), EXPIRED(已过期), CLOSED(作废)
+      },
+      init_list: [], //初始化列表
+      total: 0,
+    };
+  },
+  mounted() {
+    this.handlerInitCouponList();
+  },
+  methods: {
+    // 初始化优惠卷列表
+    handlerInitCouponList() {
+      getUserAcceptCouponsList(this.queryParams).then(res => {
+        this.init_list = res.data;
+        this.init_list.map(rs => {
+          rs.couponVO.dueTime = this.handlerGetTime(rs.couponVO.expiration);
+        });
+        this.total = res.data.total;
+      });
+    },
+    handlerGetTime(e) {
+      // 1707148800000
+      let time = new Date(e);
+      let year = time.getFullYear();
+      let month = time.getMonth() + 1;
+      let date = time.getDate();
+      if (month < 10) {
+        month = '0' + month;
+      }
+      if (date < 10) {
+        date = '0' + date;
+      }
+      return year + '-' + month + '-' + date;
     },
-    mounted() {
+    // 选择顶部导航栏
+    handlerChangeTab1(e) {
+      this.queryParams.type = e.type;
       this.handlerInitCouponList();
     },
-    methods: {
-      // 初始化优惠卷列表
-      handlerInitCouponList() {
-        getUserAcceptCouponsList(this.queryParams).then(res => {
-          this.init_list = res.data;
-          this.init_list.map(rs=>{
-            rs.couponVO.dueTime = this.handlerGetTime(rs.couponVO.expiration)
-          })
-          this.total = res.data.total;
-        });
-      },
-      handlerGetTime(e){
-        // 1707148800000
-        let time = new Date(e)
-        let year = time.getFullYear()
-        let month = time.getMonth() + 1
-        let date = time.getDate()
-        if (month < 10) {
-          month = '0' + month
-        }
-        if (date < 10) {
-          date = '0' + date
-        }
-        return year + '-' + month + '-' + date
 
-      },
-      // 选择顶部导航栏
-      handlerChangeTab1(e) {
-        this.queryParams.type = e.type;
-        this.handlerInitCouponList();
-      },
-
-      // 点击选择下层tab栏 选择是否可用
-      handlerSelectTab(e) {
-        this.lable_type = e.index;
-        this.queryParams.status = e.type;
-        this.handlerInitCouponList();
-      },
-      // 点击去使用
-      handlerToUsed(item){
-        uni.navigateTo({
-          url:`/pagesHome/marketer/index?id=${item.couponVO.merchantId}`
-        })
-      }
+    // 点击选择下层tab栏 选择是否可用
+    handlerSelectTab(e) {
+      this.lable_type = e.index;
+      this.queryParams.status = e.type;
+      this.handlerInitCouponList();
+    },
+    // 点击去使用
+    handlerToUsed(item) {
+      uni.navigateTo({
+        url: `/pagesHome/marketer/index?id=${item.couponVO.merchantId}`,
+      });
     },
-  };
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-  .container {
-    height: 100vh;
-    background-color: #efefef;
+.container {
+  height: 100vh;
+  background-color: #f9f9f9;
+
+  .top-tab {
+    width: 100%;
+    background-color: #347caf;
+    padding: 20rpx 0;
+  }
 
-    .top-tab {
-      width: 100%;
-      background-color: #347caf;
-      padding: 20rpx 0;
-    }
+  .use {
+    padding: 0 140rpx;
+  }
+
+  /* 优惠券可用 */
+  .couponUse {
+    margin: 20rpx 30rpx;
+    height: 200rpx;
+    display: flex;
+    background-color: #fff;
+    box-sizing: border-box;
+
+    .useLeft {
+      width: 380rpx;
+      padding: 20rpx;
+
+      > view {
+        font-size: 40rpx;
+        margin: 20rpx;
+        color: #333;
+      }
 
-    .use {
-      padding: 0 140rpx;
+      > text {
+        font-size: 28rpx;
+        color: #5f5f5f;
+      }
     }
 
-    /* 优惠券可用 */
-    .couponUse {
-      margin: 20rpx 30rpx;
-      height: 200rpx;
-      display: flex;
-      background-color: #fff;
+    .useRight {
+      height: 100%;
+      padding: 10rpx;
+      color: #fff;
+      text-align: center;
       box-sizing: border-box;
+      width: calc(100% - 380rpx);
+      background-color: #347caf;
 
-      .useLeft {
-        width: 380rpx;
-        padding: 20rpx;
-
-        >view {
-          font-size: 40rpx;
-          margin: 20rpx;
-          color: #333;
-        }
+      .text {
+        font-size: 50rpx;
 
-        >text {
-          font-size: 28rpx;
-          color: #5f5f5f;
+        > text {
+          margin-left: 5rpx;
+          font-size: 24rpx;
         }
       }
 
-      .useRight {
-        height: 100%;
-        padding: 10rpx;
-        color: #fff;
-        text-align: center;
-        box-sizing: border-box;
-        width: calc(100% - 380rpx);
-        background-color: #347caf;
-
-        .text {
-          font-size: 50rpx;
-
-          >text {
-            margin-left: 5rpx;
-            font-size: 24rpx;
-          }
-        }
-
-        .gouUse {
-          width: 180rpx;
-          height: 60rpx;
-          line-height: 60rpx;
-          color: #347caf;
-          margin: 16rpx 0 0 60rpx;
-          background-color: #fff;
-        }
+      .gouUse {
+        width: 180rpx;
+        height: 60rpx;
+        line-height: 60rpx;
+        color: #347caf;
+        margin: 16rpx 0 0 60rpx;
+        background-color: #fff;
       }
     }
+  }
 
-    .couponDisUse {
-      .useRight {
-        background-color: #cecece;
+  .couponDisUse {
+    .useRight {
+      background-color: #cecece;
 
-        .gouUse {
-          color: #cecece;
-        }
+      .gouUse {
+        color: #cecece;
       }
     }
   }
+}
 </style>

src/PageMine/favourite/favourite - 副本.vue

@@ -1,20 +1,32 @@
 <template>
   <view class="collect">
     <view class="collect_list">
-      <u-tabs :list="listCollect" @click="clickCollect" lineWidth="30" lineColor="#5992bb" :activeStyle="{
+      <u-tabs
+        :list="listCollect"
+        @click="clickCollect"
+        lineWidth="30"
+        lineColor="#5992bb"
+        :activeStyle="{
           color: '#303133',
           fontWeight: 'bold',
           transform: 'scale(1.05)',
-        }" :inactiveStyle="{
+        }"
+        :inactiveStyle="{
           color: '#606266',
           transform: 'scale(1)',
-        }" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;" />
+        }"
+        itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;"
+      />
     </view>
     <view>
       <view v-if="init_list.length > 0">
         <view class="text">以下是您收藏的商品服务</view>
         <!-- 收藏的服务 -->
-        <serviceItem v-if="indexs == 0" :item="init_list" @uploadIniList="uploadIniList"></serviceItem>
+        <serviceItem
+          v-if="indexs == 0"
+          :item="init_list"
+          @uploadIniList="uploadIniList"
+        ></serviceItem>
         <goodsItem v-else :item="init_list" @uploadIniList="uploadIniList" />
       </view>
       <u-empty v-else mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" />
@@ -23,124 +35,124 @@
 </template>
 
 <script>
-  import serviceItem from '@/components/service/serviceItem.vue';
-  import goodsItem from "./components/goodsItem"
-  import { maintainFavoritePaging, getFavouriteGoods } from '@/api/client/mine.js';
-  import { getCurrentLocation } from '@/api/client/home';
-  import { mapGetters } from "vuex"
-  export default {
-    components: {
-      serviceItem,
-      goodsItem
-    },
-    data() {
-      return {
-        queryParams: {
-          size: 10,
-          type: 'MERCHANT',
-          region: null, //地区编码
-          longitude: null , //经度
-          latitude: null, //纬度
-        },
-        init_list: [],
-        listCollect: [{
-            id: 1,
-            name: '商家',
-          },
-          {
-            id: 1,
-            name: '服务',
-          },
-        ],
-        indexs: 0,
-
-      };
-    },
-	mounted() {
-	  let { latitude , longitude , region } = this.location
-	  this.queryParams.latitude = latitude
-	  this.queryParams.longitude = longitude
-	  this.queryParams.region = region
-	  this.handlerInitList();
-	},
-	computed:{
-		  ...mapGetters(['location'])
-	},
-    methods: {
-      // 初始化商家列表信息
-      handlerInitList() {
-        maintainFavoritePaging(this.queryParams).then(res => {
-          if (res.code === 'OK' && res.data) {
-            res.data.map(rs => {
-              this.init_list.push(rs.simpleMerchantVO);
-            });
-          } else {
-            uni.showToast({
-              title: '数据请求失败',
-              icon: 'none',
-            });
-          }
-        });
+import serviceItem from '@/components/service/serviceItem.vue';
+import goodsItem from './components/goodsItem';
+import { maintainFavoritePaging, getFavouriteGoods } from '@/api/client/mine.js';
+import { getCurrentLocation } from '@/api/client/home';
+import { mapGetters } from 'vuex';
+export default {
+  components: {
+    serviceItem,
+    goodsItem,
+  },
+  data() {
+    return {
+      queryParams: {
+        size: 10,
+        type: 'MERCHANT',
+        region: null, //地区编码
+        longitude: null, //经度
+        latitude: null, //纬度
       },
-      // 初始化服务列表
-      handlerInitGoodsList() {
-        getFavouriteGoods().then(res => {
-          if (res.code === 'OK' && res.data) {
-            res.data.map(rs => {
-              this.init_list.push(rs.goods);
-            });
-          } else {
-            uni.showToast({
-              title: '数据请求失败',
-              icon: 'none',
-            });
-          }
-        });
-      },
-      clickCollect(e) {
-        this.init_list = []
-        this.indexs = e.index
-        switch (e.index) {
-          case 0:
-            this.handlerInitList()
-            break;
-          case 1:
-            this.handlerInitGoodsList()
-            break;
+      init_list: [],
+      listCollect: [
+        {
+          id: 1,
+          name: '商家',
+        },
+        {
+          id: 1,
+          name: '服务',
+        },
+      ],
+      indexs: 0,
+    };
+  },
+  mounted() {
+    let { latitude, longitude, region } = this.location;
+    this.queryParams.latitude = latitude;
+    this.queryParams.longitude = longitude;
+    this.queryParams.region = region;
+    this.handlerInitList();
+  },
+  computed: {
+    ...mapGetters(['location']),
+  },
+  methods: {
+    // 初始化商家列表信息
+    handlerInitList() {
+      maintainFavoritePaging(this.queryParams).then(res => {
+        if (res.code === 'OK' && res.data) {
+          res.data.map(rs => {
+            this.init_list.push(rs.simpleMerchantVO);
+          });
+        } else {
+          uni.showToast({
+            title: '数据请求失败',
+            icon: 'none',
+          });
         }
-      },
-      uploadIniList(e) {
-        this.init_list = []
-        if (e == 1) {
-          this.handlerInitGoodsList()
-          this.indexs = 1
+      });
+    },
+    // 初始化服务列表
+    handlerInitGoodsList() {
+      getFavouriteGoods().then(res => {
+        if (res.code === 'OK' && res.data) {
+          res.data.map(rs => {
+            this.init_list.push(rs.goods);
+          });
         } else {
-          this.handlerInitList()
-          this.indexs = 0
+          uni.showToast({
+            title: '数据请求失败',
+            icon: 'none',
+          });
         }
+      });
+    },
+    clickCollect(e) {
+      this.init_list = [];
+      this.indexs = e.index;
+      switch (e.index) {
+        case 0:
+          this.handlerInitList();
+          break;
+        case 1:
+          this.handlerInitGoodsList();
+          break;
       }
     },
-  };
+    uploadIniList(e) {
+      this.init_list = [];
+      if (e == 1) {
+        this.handlerInitGoodsList();
+        this.indexs = 1;
+      } else {
+        this.handlerInitList();
+        this.indexs = 0;
+      }
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-  .collect {
-    min-height: 100vh;
-    background-color: #efefef;
+.collect {
+  min-height: 100vh;
+  background-color: #f9f9f9;
 
-    &_list {
-      display: flex;
-      height: 70rpx;
-      justify-content: center;
-      align-items: center;
-      background-color: #fff;
-      margin-bottom: 40rpx;
-    }
+  &_list {
+    display: flex;
+    height: 70rpx;
+    justify-content: center;
+    align-items: center;
+    background-color: #fff;
+    margin-bottom: 40rpx;
+  }
 
-    .text {
-      text-align: center;
-      padding: 40rpx;
-      color: #999;
-    }
+  .text {
+    text-align: center;
+    padding: 40rpx;
+    color: #999;
   }
+}
 </style>

src/PageMine/goodsReserve/goodsReserve - 副本.vue

@@ -84,7 +84,7 @@ export default {
 
 <style lang="scss" scoped>
 page {
-  background-color: #efefef;
+  background-color: #f9f9f9;
 }
 
 .container {

src/PageMine/goodsReserve/index.vue

@@ -84,7 +84,7 @@ export default {
 
 <style lang="scss" scoped>
 page {
-  background-color: #efefef;
+  background-color: #f9f9f9;
 }
 
 .container {

src/pagesHome/storeList/index copy.vue

@@ -235,7 +235,7 @@ export default {
 <style lang="scss" scoped>
 .container {
   min-height: 100vh;
-  background-color: #efefef;
+  background-color: #f9f9f9;
 
   .top-box {
     width: 100%;