From 812f1587329a1302a047d06ee119f8130584d23f Mon Sep 17 00:00:00 2001
From: aixianling <aixianling@sinoecare.com>
Date: Mon, 21 Mar 2022 18:06:43 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9C=B0=E5=8C=BA=E7=BB=84=E4=BB=B6=E4=BF=AE?=
 =?UTF-8?q?=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/pages/selectArea.vue      |   2 -
 src/mods/AppCreditPoints/supermarket.vue | 274 +++++++++++------------
 2 files changed, 134 insertions(+), 142 deletions(-)

diff --git a/src/components/pages/selectArea.vue b/src/components/pages/selectArea.vue
index a81628d..36c1487 100644
--- a/src/components/pages/selectArea.vue
+++ b/src/components/pages/selectArea.vue
@@ -30,11 +30,9 @@
 
 <script>
 import {mapState} from "vuex";
-import AiEmpty from "../AiEmpty/AiEmpty";
 
 export default {
   name: "selectArea",
-  components: {AiEmpty},
   appName: "选择地区",
   computed: {
     ...mapState(['user']),
diff --git a/src/mods/AppCreditPoints/supermarket.vue b/src/mods/AppCreditPoints/supermarket.vue
index 9786412..8f64336 100644
--- a/src/mods/AppCreditPoints/supermarket.vue
+++ b/src/mods/AppCreditPoints/supermarket.vue
@@ -1,55 +1,53 @@
 <template>
-  <div class="page">
-    <div class="supermarket">
-      <div class="fixed-top title" @click="$linkTo(`./system?areaName=${areaName}`)">{{ areaName }}积分超市管理制度，点击查看 >>
-      </div>
-      <div class="goods-list" v-if="numList.length"
-           :style="propAreaId == '341021104000' ? 'padding-top:80rpx' : 'padding-top: 0;'">
-        <div class="left">
-          <div
-              :class="numIndex == index ? 'item active' : 'item'"
-              v-for="(item, index) in numList"
-              :key="index"
-              @click="numClick(index)">
-            <i v-show="item.total > 0">{{ item.total }}</i>
-            {{ item.type }}分区
-          </div>
+  <div class="supermarket">
+    <div class="title" @click="$linkTo(`./system?areaName=${areaName}`)">{{ areaName }}积分超市管理制度，点击查看 >>
+    </div>
+    <div class="goods-list" v-if="numList.length"
+         :style="propAreaId == '341021104000' ? 'padding-top:80rpx' : 'padding-top: 0;'">
+      <div class="left">
+        <div
+            :class="numIndex == index ? 'item active' : 'item'"
+            v-for="(item, index) in numList"
+            :key="index"
+            @click="numClick(index)">
+          <i v-show="item.total > 0">{{ item.total }}</i>
+          {{ item.type }}分区
         </div>
-        <div class="right">
-          <div class="item" v-for="(item, index) in goodsList[numIndex]" :key="index">
-            <img :src="item.photo[0].url" alt="">
-            <div class="item-info">
-              <p class="item-name">{{ item.merchandiseName }}</p>
-              <div class="item-point"><span class="num">{{ item.costIntegral }}</span>积分</div>
-              <div class="item-bottom">
-                <div></div>
-                <div class="item-bottom__right">
-                  <image v-show="item.num > 0" @click="cut(numIndex, index)" src="/static/img/cut.png"/>
-                  <input v-show="item.num > 0" v-model="item.num">
-                  <image src="/static/img/add.png" @click="add(numIndex, index)"/>
-                </div>
+      </div>
+      <div class="right">
+        <div class="item" v-for="(item, index) in goodsList[numIndex]" :key="index">
+          <img :src="item.photo[0].url" alt="">
+          <div class="item-info">
+            <p class="item-name">{{ item.merchandiseName }}</p>
+            <div class="item-point"><span class="num">{{ item.costIntegral }}</span>积分</div>
+            <div class="item-bottom">
+              <div></div>
+              <div class="item-bottom__right">
+                <image v-show="item.num > 0" @click="cut(numIndex, index)" src="/static/img/cut.png"/>
+                <input v-show="item.num > 0" v-model="item.num">
+                <image src="/static/img/add.png" @click="add(numIndex, index)"/>
               </div>
             </div>
           </div>
         </div>
       </div>
-      <AiEmpty v-else/>
-      <div class="goods-footer" v-if="numList.length">
-        <div class="goods-footer__top">
-          <h2>{{ userInfo.familyName || user.nickName }}{{ userInfo.familyName ? '家' : '' }}</h2>
-          <span>剩余积分:{{ userInfo.familyIntegral || 0 }}分</span>
-        </div>
-        <div class="goods-footer__bottom">
-          <div class="goods-footer__bottom__left">
-            <h3>共{{ total }}件商品</h3>
-            <div class="goods-footer__bottom--middle">
-              <span>合计 ：</span>
-              <i>{{ money }}</i>
-              <em>积分</em>
-            </div>
+    </div>
+    <AiEmpty v-else/>
+    <div class="goods-footer" v-if="numList.length">
+      <div class="goods-footer__top">
+        <h2>{{ userInfo.familyName || user.nickName }}{{ userInfo.familyName ? '家' : '' }}</h2>
+        <span>剩余积分:{{ userInfo.familyIntegral || 0 }}分</span>
+      </div>
+      <div class="goods-footer__bottom">
+        <div class="goods-footer__bottom__left">
+          <h3>共{{ total }}件商品</h3>
+          <div class="goods-footer__bottom--middle">
+            <span>合计 ：</span>
+            <i>{{ money }}</i>
+            <em>积分</em>
           </div>
-          <div class="goods-footer__bottom--btn" @click="toOrder" hover-class="text-hover">去结算</div>
         </div>
+        <div class="goods-footer__bottom--btn" @click="toOrder" hover-class="text-hover">去结算</div>
       </div>
     </div>
   </div>
@@ -323,118 +321,114 @@ export default {
   }
 }
 
-.page {
-  width: 100%;
-  background-color: #fff;
+.supermarket {
+  min-height: 100vh;
+  background: #fff;
+  overflow-y: hidden;
 
-  .supermarket {
+  .title {
+    width: 100vw;
+    height: 80px;
+    line-height: 80px;
+    background: #EFF4FF;
+    padding-left: 30px;
+    color: #3A7EE2;
+    font-size: 28px;
+  }
+
+  .goods-list {
+    // padding-top:80px;      padding-bottom: 184px;
     height: 100%;
+    box-sizing: border-box;
     overflow-y: hidden;
 
-    .title {
-      width: 100%;
-      height: 80px;
-      line-height: 80px;
-      background: #EFF4FF;
-      padding-left: 30px;
-      color: #3A7EE2;
-      font-size: 28px;
-    }
-
-    .goods-list {
-      // padding-top:80px;      padding-bottom: 184px;
+    .left {
+      width: 168px;
       height: 100%;
-      box-sizing: border-box;
-      overflow-y: hidden;
+      overflow-y: scroll;
+      overflow-x: hidden;
+      float: left;
+      background: #FAF9FB;
 
-      .left {
-        width: 168px;
-        height: 100%;
-        overflow-y: scroll;
-        overflow-x: hidden;
-        float: left;
-        background: #FAF9FB;
+      .item {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        position: relative;
+        width: 100%;
+        height: 104px;
+        line-height: 1.1;
+        border-bottom: 2px solid #D8E5FF;
+        text-align: center;
+        color: #333;
+        font-size: 28px;
+        border-left: 6px solid #FAF9FB;
 
-        .item {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          position: relative;
-          width: 100%;
-          height: 104px;
-          line-height: 1.1;
-          border-bottom: 2px solid #D8E5FF;
-          text-align: center;
-          color: #333;
-          font-size: 28px;
-          border-left: 6px solid #FAF9FB;
-
-          i {
-            position: absolute;
-            right: 8px;
-            top: 8px;
-            height: 28px;
-            line-height: 28px;
-            padding: 0 12px;
-            color: #fff;
-            font-size: 20px;
-            border-radius: 13px;
-            background: #FB4E44;
-          }
-        }
-
-        .active {
-          border-left: 6px solid #1D58FE;
-          background: linear-gradient(270deg, #FFFFFF 0%, #FFFFFF 77%, #E7EAFA 100%);
+        i {
+          position: absolute;
+          right: 8px;
+          top: 8px;
+          height: 28px;
+          line-height: 28px;
+          padding: 0 12px;
+          color: #fff;
+          font-size: 20px;
+          border-radius: 13px;
+          background: #FB4E44;
         }
       }
 
-      .right {
-        float: left;
-        width: calc(100% - 168px);
-        height: 100%;
-        overflow-y: scroll;
+      .active {
+        border-left: 6px solid #1D58FE;
+        background: linear-gradient(270deg, #FFFFFF 0%, #FFFFFF 77%, #E7EAFA 100%);
+      }
+    }
 
-        .item {
-          width: 100%;
-          padding: 28px 30px 44px;
-          box-sizing: border-box;
+    .right {
+      float: left;
+      width: calc(100% - 168px);
+      height: 100%;
+      overflow-y: scroll;
 
-          img {
-            width: 192px;
-            height: 192px;
-            border: 2px solid #D7D5D5;
+      .item {
+        width: 100%;
+        padding: 28px 30px 44px;
+        box-sizing: border-box;
+
+        img {
+          width: 192px;
+          height: 192px;
+          border: 2px solid #D7D5D5;
+        }
+
+        .item-info {
+          display: inline-block;
+          width: 276px;
+          padding-left: 30px;
+          vertical-align: top;
+
+          .item-name {
+            width: 100%;
+            word-break: break-all;
+            line-height: 42px;
+            margin-bottom: 30px;
+            font-size: 30px;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: 500;
           }
 
-          .item-info {
-            display: inline-block;
-            width: 276px;
-            padding-left: 30px;
-            vertical-align: top;
+          .item-point {
+            font-size: 24px;
+            font-family: PingFangSC-Medium, PingFang SC;
+            font-weight: 500;
+            color: #FA4A51;
+            line-height: 34px;
 
-            .item-name {
-              width: 100%;
-              word-break: break-all;
-              line-height: 42px;
-              margin-bottom: 30px;
-              font-size: 30px;
-              font-family: PingFangSC-Medium, PingFang SC;
-              font-weight: 500;
-            }
-
-            .item-point {
-              font-size: 24px;
-              font-family: PingFangSC-Medium, PingFang SC;
-              font-weight: 500;
-              color: #FA4A51;
-              line-height: 34px;
-
-              .num {
-                font-size: 40px;
-                font-family: PingFangSC-Semibold, PingFang SC;
-                font-weight: 600;
-                margin-right: 8px;
-              }
+            .num {
+              font-size: 40px;
+              font-family: PingFangSC-Semibold, PingFang SC;
+              font-weight: 600;
+              margin-right: 8px;
             }
           }
         }