修复bug和更改会员界面

2024-10-30 22:01:46 +08:00
parent e920251718
commit 56ee90ed30
6 changed files with 70 additions and 88 deletions
--- a/src/components/LablesMember.vue
+++ b/src/components/LablesMember.vue
@@ -20,42 +20,15 @@
              <div @click="tabIndex = 0, currIndex = 0, getPriceList(1)" :class="[tabIndex === 0 ? 'active' : '']">
                <span>金币充值</span>
              </div>
-              <div @click="tabIndex = 1, currIndex = 0" :class="[tabIndex === 1 ? 'active' : '']">
-                <span>基础功能</span>
+              <div @click="tabIndex = 1, currIndex = 0, getPriceList(0)" :class="[tabIndex === 1 ? 'active' : '']">
+                <span>年度会员</span>
              </div>
              <div @click="tabIndex = 2, currIndex = 0, getPriceList(2)" :class="[tabIndex === 2 ? 'active' : '']">
                <span>高级功能</span>
              </div>
            </div>
-            <div class="tab-content" v-if="tabIndex === 1">
-              <div class="title">金币充值</div>
-              <div class="tab-content__item--wrapper">
-                <el-form :model="form" label-position="top" ref="form" label-width="100px" class="form" style="width: 100%;">
-                  <el-form-item
-                    prop="mallName"
-                    label="当前绑定店铺"
-                    style="width: 100%;"
-                    :rules="[{ required: true, message: '请先登录拼多多跨境卖家中心', trigger: 'blur' }]">
-                    <el-input readonly placeholder="请先登录拼多多跨境卖家中心" v-model="form.mallName"></el-input>
-                  </el-form-item>
-                  <el-form-item
-                    prop="mallId"
-                    v-show="false"
-                    style="width: 100%;"
-                    :rules="[{ message: '请输入店铺ID', trigger: 'blur' }]">
-                    <el-input placeholder="请输入店铺ID" v-model="form.mallId"></el-input>
-                  </el-form-item>
-                  <el-form-item
-                    prop="code"
-                    label="激活码"
-                    :rules="[{ required: true, message: '请输入激活码', trigger: 'blur' }]">
-                    <el-input placeholder="请输入激活码" v-model="form.code"></el-input>
-                  </el-form-item>
-                </el-form>
-              </div>
-            </div>
            <div class="tab-content" v-if="tabIndex === 0">
-              <div class="title">基础功能</div>
+              <div class="title">金币充值</div>
              <div class="tab-content__item--wrapper">
                <div
                  class="tab-content__item"
@@ -72,7 +45,29 @@
                    <i>¥</i>
                    <span>{{ price.originPrice }}</span>
                  </div>
-                  <p>{{ price.coin }}金币</p>
+                  <p>{{ price.coin }}条/每年</p>
+                </div>
+              </div>
+            </div>
+            <div class="tab-content" v-if="tabIndex === 1">
+              <div class="title">年度会员</div>
+              <div class="tab-content__item--wrapper">
+                <div
+                  class="tab-content__item"
+                  :class="[currIndex === i ? 'active' : '']"
+                  v-for="(price, i) in priceList"
+                  :key="i"
+                  @click="currIndex = i, getQrcode(price)">
+                  <h3>{{ price.title }}</h3>
+                  <div class="price">
+                    <i>¥</i>
+                    <span>{{ price.price }}</span>
+                  </div>
+                  <div class="original-price">
+                    <i>¥</i>
+                    <span>{{ price.originPrice }}</span>
+                  </div>
+                  <!-- <p>{{ price.coin }}条/每年</p> -->
                </div>
              </div>
            </div>
@@ -99,8 +94,8 @@
              </div>
            </div>
          </div>
-          <div class="title" v-if="tabIndex !== 1">支付方式</div>
-          <div class="bottom" v-if="tabIndex !== 1">
+          <div class="title">支付方式</div>
+          <div class="bottom">
            <div class="bottom-left">
              <div class="code">
                <vue-qr v-if="qrcode" :text="qrcode" :size="110" :margin="0" :logoSrc="wechatLogo"/>
@@ -123,15 +118,6 @@
              </div>
            </div>
          </div>
-          <div class="bottom" v-else>
-            <div class="bottom-left">
-            </div>
-            <div class="bottom-right">
-              <div class="pay-btn">
-                <el-button round size="mini" type="warning" @click="onConfirm">确定</el-button>
-              </div>
-            </div>
-          </div>
        </div>
      </div>
    </div>
@@ -203,45 +189,13 @@
          }
        })
      },
+
      show () {
        this.isShow = true
      },

      hide () {
        this.isShow = false
-      },
-
-      onConfirm () {
-        this.$refs.form.validate((valid) => {
-          if (valid) {
-            this.$http.post(`/api/coupon/getDetail`, null, {
-              params: {
-                code: this.form.code
-              }
-            }).then(res => {
-              if (res.code == 0) {
-                let msg = this.getMessage(res.data.type);
-                this.$confirm(msg, '温馨提示', {
-                  confirmButtonText: '确定',
-                  cancelButtonText: '取消',
-                  type: 'info'
-                }).then(() => {
-                  this.$http.post(`/api/order/upgradeByCode`, null, {
-                    params: {
-                      ...this.form
-                    }
-                  }).then(res => {
-                    if (res.code == 0) {
-                      this.$message.success('激活成功')
-                      this.$store.dispatch('getUserInfo')
-                      this.isShow = false
-                    }
-                  })
-                })
-              }
-            })
-          }
-        })
      }
    }
  }
@@ -280,7 +234,7 @@
      top: 50%;
      left: 50%;
      z-index: 11;
-      min-width: 840px;
+      min-width: 916px;
      // height: 620px;
      padding: 40px 40px;
      transform: translate(-50%, -50%);
--- a/src/components/print/customProvider.js
+++ b/src/components/print/customProvider.js
@@ -117,8 +117,10 @@ export const customProvider = function () {
        {
          tid: 'providerModule1.image',
          title: '图片',
-          data: 'https://foruda.gitee.com/avatar/1677050350324030848/5400665_ccsimple_1591166830.png!avatar200',
-          type: 'image'
+          type: 'image',
+          options: {
+            src: 'http://lyshunong.oss-cn-beijing.aliyuncs.com/image/material/a6e14259412606502e49f1abd866039.png',
+          }
        }
      ])
    ])
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -57,7 +57,7 @@ export default new Vuex.Store({
      state.showTemuAlert = flag
    },
    setLabelInfo(state, info) {
-      state.info = info
+      state.labelInfo = info
    }
  },

@@ -70,7 +70,7 @@ export default new Vuex.Store({
            resolve(res.data)
          }
        })
-        // this.getLabelInfo()
+        store.dispatch('getLabelInfo')
      })
    },

@@ -78,7 +78,11 @@ export default new Vuex.Store({
      return new Promise(resolve => {
        request.post('/api/userExtend/getLabelDetail').then(res => {
          if (res.code === 0) {
-            store.commit('setLabelInfo', res.data)
+            const isExpires = new Date().getTime() > new Date(res.data.expireTime).getTime() || res.data.skuUsed > res.data.skuTotal
+            store.commit('setLabelInfo', {
+              ...res.data,
+              isExpires
+            })
            resolve(res.data)
          }
        })
--- a/src/view/Home.vue
+++ b/src/view/Home.vue
@@ -7,7 +7,7 @@
      </div>
      <div class="admin-right">
        <el-tooltip class="item" effect="dark" content="金币信息" placement="top">
-          <div class="left" @click="toActive">
+          <div class="left" @click="openMember">
            <div :style="{marginLeft: '0px'}">{{ $store.state.userInfo.coin }}</div>
            <span style="margin-right: 10px;"><img src="../assets/coin.png" width="30"/></span>
          </div>
@@ -15,7 +15,7 @@
        <el-button type="button" :class="'el-button el-button--primary'" @click="sign">签到</el-button>
        <!--<el-button type="button" :class="'el-button el-button--primary'" @click="openFolder">打开文件夹</el-button>-->
        <el-tooltip class="item" effect="dark" content="用户激活" placement="top">
-          <div class="left" @click="toActive">
+          <div class="left" @click="openMember">
            <span>会员信息:</span>
            <div :style="{marginLeft: '10px', color: $store.state.userInfo.flag == 1? 'green': 'red'}">{{ getStateInfo }}</div>
          </div>
@@ -252,11 +252,6 @@
    <div id="kefu" @click="gotoKefu">
      <label slot="reference" class="topBtn" title="联系客服"></label>
    </div>
-    <el-dialog
-      title="开通标签会员"
-      :close-on-click-modal="false"
-      width="1200">
-    </el-dialog>
    <LablesMember ref="LablesMember"></LablesMember>
  </div>
 </template>
--- a/src/view/lables/SkuManage.vue
+++ b/src/view/lables/SkuManage.vue
@@ -531,6 +531,8 @@
            this.getList()
          }

+          this.btnLoading = false
+        }).catch(() => {
          this.btnLoading = false
        })
      },
--- a/src/view/lables/Template.vue
+++ b/src/view/lables/Template.vue
@@ -4,6 +4,12 @@
      slot="title"
      title="模板管理"
      isShowBottomBorder>
+      <template #rightBtn>
+        <div class="tips" slot="rightBtn" :class="[$store.state.labelInfo.isExpires ? 'active' : '']">
+          <p>有效期：{{ $store.state.labelInfo.expireTime }}</p>
+          <p>剩余SKU数：{{ $store.state.labelInfo.skuUsed }}/{{ $store.state.labelInfo.skuTotal }}</p>
+        </div>
+      </template>
    </ai-title>
    <template slot="content">
      <ai-search-bar>
@@ -151,5 +157,24 @@
    .search-item {
      margin-bottom: 0;
    }
+
+    .tips {
+      display: flex;
+      align-items: center;
+      color: green;
+
+      &.active {
+        color: red;
+      }
+
+      p {
+        font-size: 15px;
+        font-weight: 600;
+
+        &:first-child {
+          margin-right: 20px;
+        }
+      }
+    }
  }
 </style>