会员显示优化

hdApp/src/admin/member/detail.vue

@@ -16,20 +16,21 @@
               <text class="user-id">ID {{ data.id }}</text>
             </view>
           </view>
-
-          <view class="member-level-badge" v-if="((useVip == true && Number(data.vip) == 1) || (useVip == false)) && Number(data.member)>0">
-            <view class="member-badge-row" @click.stop="openVipPopup">
-              <image v-if="data.member == 1" class="member-badge-icon" style="width:76upx;height:76upx;" src="@/static/member-icons/member-1.svg" mode="aspectFit"></image>
-              <image v-else-if="data.member == 2" class="member-badge-icon" style="width:74upx;height:74upx;" src="@/static/member-icons/member-2.svg" mode="aspectFit"></image>
-              <image v-else-if="data.member == 3" class="member-badge-icon" style="width:73upx;height:73upx;" src="@/static/member-icons/member-3.svg" mode="aspectFit"></image>
-              <image v-else-if="data.member == 4" class="member-badge-icon" style="width:82upx;height:82upx;" src="@/static/member-icons/member-4.svg" mode="aspectFit"></image>
-              <image v-else-if="data.member == 5" class="member-badge-icon" style="width:77upx;height:77upx;" src="@/static/member-icons/member-5.svg" mode="aspectFit"></image>
-              <text class="member-name">{{ data.memberName }}</text>
+          <block v-if="Number(data.member)>0">
+            <view class="member-level-badge" v-if="Number(data.vip) == 1">
+              <view class="member-badge-row" @click.stop="confirmCloseVip">
+                <image v-if="data.member == 1" class="member-badge-icon" style="width:76upx;height:76upx;" src="@/static/member-icons/member-1.svg" mode="aspectFit"></image>
+                <image v-else-if="data.member == 2" class="member-badge-icon" style="width:74upx;height:74upx;" src="@/static/member-icons/member-2.svg" mode="aspectFit"></image>
+                <image v-else-if="data.member == 3" class="member-badge-icon" style="width:73upx;height:73upx;" src="@/static/member-icons/member-3.svg" mode="aspectFit"></image>
+                <image v-else-if="data.member == 4" class="member-badge-icon" style="width:82upx;height:82upx;" src="@/static/member-icons/member-4.svg" mode="aspectFit"></image>
+                <image v-else-if="data.member == 5" class="member-badge-icon" style="width:77upx;height:77upx;" src="@/static/member-icons/member-5.svg" mode="aspectFit"></image>
+                <text class="member-name">{{ data.memberName }}</text>
+              </view>
             </view>
-          </view>
-          <view v-else-if="useVip == true && Number(data.vip) == 0">
-            <button class="admin-button-com mini-btn" @click="openVipPopup">开启会员</button>
-          </view>
+            <view v-else>
+              <button class="admin-button-com mini-btn" @click="confirmOpenVip">开启会员</button>
+            </view>
+          </block>
         </view>
       </view>
       <view class="user-bottom">
@@ -424,20 +425,16 @@
       </template>
     </modal-module>
 
-    <modal-module :show="vipModal" @click="vipModalClick" :maskClosable="false" title="会员设置" padding="28rpx 28rpx" >
-      <template v-slot:content>
-        <view class="app-modal-input-wrap">
-          <view class="vip-switch-row">
-            <text class="vip-switch-label">{{ vipForm.vip == 1 ? '会员' : '非会员' }}</text>
-            <switch
-              style="transform:scale(0.7,0.7)"
-              :checked="vipForm.vip == 1"
-              @change="vipSwitchChange"
-            />
-          </view>
-        </view>
-      </template>
-    </modal-module>
+    <modal-module
+      :show="vipModal"
+      @click="vipModalClick"
+      :maskClosable="false"
+      title="提示"
+      :content="vipModalText"
+      color="#333"
+      :size="32"
+      padding="30rpx 30rpx" 
+    ></modal-module>
 
 		<modal-module :show="changeShow" @click="confirmChange" :maskClosable="true" title="修改名称" padding="30rpx 30rpx" >
 		<template v-slot:content>
@@ -587,6 +584,7 @@ export default {
       memberLevelData:[],
       useVip: false, // 是否启用会员
       vipModal: false,
+      vipModalText: "",
       vipForm: {
         vip: 0
       }
@@ -886,12 +884,15 @@ export default {
         }
       }
     },
-    openVipPopup() {
-      this.vipForm.vip = Number(this.data.vip) || 0
+    confirmOpenVip() {
+      this.vipForm.vip = 1
+      this.vipModalText = "确认开启会员资格"
       this.vipModal = true
     },
-    vipSwitchChange(e) {
-      this.vipForm.vip = e.detail.value ? 1 : 0
+    confirmCloseVip() {
+      this.vipForm.vip = 0
+      this.vipModalText = "确认关闭会员资格"
+      this.vipModal = true
     },
     vipModalClick(e) {
       if (e.index === 0) {
@@ -1313,20 +1314,6 @@ export default {
     }
   }
 }
-  .vip-switch-row {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 25upx 20upx;
-
-    .vip-switch-label {
-      font-size: 32upx;
-      color: #333;
-      font-weight: 500;
-      margin-right: 80upx;
-    }
-  }
-
    .user_tag{
     border:1px solid #CCCCCC;
     padding:5upx 12upx 5upx 12upx;