Browse Source

Merge branch 'feature/v1.0.56' of https://jygit.jydev.jianyu360.cn/jianyu/web into dev/v1.0.56_wmh

wenmenghao 1 year ago
parent
commit
ff1bc35597

BIN
apps/bigmember_pc/src/assets/images/icon/limit-time.png


BIN
apps/bigmember_pc/src/assets/images/official-wxcode.png


BIN
apps/bigmember_pc/src/assets/images/userType/bigmember-icon.png


BIN
apps/bigmember_pc/src/assets/images/userType/vip-icon.png


+ 2 - 2
apps/bigmember_pc/src/router/routers.js

@@ -1,8 +1,8 @@
 export default [
 export default [
   {
   {
     path: '/',
     path: '/',
-    // redirect: '/workspace/dashboard'
-    redirect: '/search/bidding'
+    redirect: '/workspace/dashboard'
+    // redirect: '/search/bidding'
   },
   },
   {
   {
     path: '/desktop',
     path: '/desktop',

+ 2 - 3
apps/bigmember_pc/src/views/download-pdf/components/PageBottom.vue

@@ -13,7 +13,7 @@
       <div class="qr-code">
       <div class="qr-code">
         <div>2. 关注微信公众号:</div>
         <div>2. 关注微信公众号:</div>
         <img
         <img
-          :src="wxCode"
+          src="@/assets/images/official-wxcode.png"
           alt=""
           alt=""
           class="qr_img"
           class="qr_img"
         />
         />
@@ -45,8 +45,7 @@ export default {
       kefuInfo: {
       kefuInfo: {
         wxer: qrCode
         wxer: qrCode
       },
       },
-      appUrl:`${location.origin}/front/downloadJyApp/qr?page=pc-analysis&source=pc-analysis-app`,
-      wxCode: 'https://www.jianyu360.cn/front/share/87'
+      appUrl:`${location.origin}/front/downloadJyApp/qr?page=pc-analysis&source=pc-analysis-app`
     }
     }
   },
   },
   created() {
   created() {

+ 22 - 8
apps/bigmember_pc/src/views/order/components/vipsubscribe/info.vue

@@ -8,7 +8,7 @@
         cardType="line"
         cardType="line"
       >
       >
         <div slot="header" class="vip-sub-item-title">购买区域</div>
         <div slot="header" class="vip-sub-item-title">购买区域</div>
-        <div class="vip-sub-item-content">
+        <div class="vip-sub-item-content choice-area-content">
           <el-radio-group
           <el-radio-group
             class="radio-selector-group"
             class="radio-selector-group"
             v-model="selectedInfo.radio"
             v-model="selectedInfo.radio"
@@ -28,7 +28,7 @@
                 </JStepper>
                 </JStepper>
               </div>
               </div>
             </el-radio>
             </el-radio>
-            <el-radio class="radio-selector" label="">
+            <el-radio class="radio-selector" label="" style="margin-left:30px;">
               <div class="radio-content radio-content-text">
               <div class="radio-content radio-content-text">
                 <span>全国</span>
                 <span>全国</span>
                 <span class="radio-content-sub-text"
                 <span class="radio-content-sub-text"
@@ -37,6 +37,7 @@
               </div>
               </div>
             </el-radio>
             </el-radio>
           </el-radio-group>
           </el-radio-group>
+          <div class="tip-text">支付成功后,可点击“立即订阅”前往设置订阅区域</div>
         </div>
         </div>
       </SelectorCard>
       </SelectorCard>
       <!-- 续费 -->
       <!-- 续费 -->
@@ -929,23 +930,27 @@ export default {
           ? spec.discountPrice
           ? spec.discountPrice
           : spec.originalPrice
           : spec.originalPrice
       let perDayPrice = 0
       let perDayPrice = 0
+      const giveDay = spec._offers?.time || 0
       switch (cycleType) {
       switch (cycleType) {
         // 1个月
         // 1个月
         case 1:
         case 1:
         case '月': {
         case '月': {
-          perDayPrice = (fen2Yuan(price) / 30).toFixed(2)
+          const day = 30 + giveDay
+          perDayPrice = (fen2Yuan(price) / day).toFixed(2)
           break
           break
         }
         }
         // 1个季度
         // 1个季度
         case 2:
         case 2:
         case '季': {
         case '季': {
-          perDayPrice = (fen2Yuan(price) / (30 * 3)).toFixed(2)
+          const day = (30 * 3) + giveDay
+          perDayPrice = (fen2Yuan(price) / day).toFixed(2)
           break
           break
         }
         }
         // 1年
         // 1年
         case 3:
         case 3:
         case '年': {
         case '年': {
-          perDayPrice = (fen2Yuan(price) / 365).toFixed(2)
+          const day = 365 + giveDay
+          perDayPrice = (fen2Yuan(price) / day).toFixed(2)
           break
           break
         }
         }
       }
       }
@@ -977,13 +982,14 @@ export default {
 }
 }
 .radio-selector-group {
 .radio-selector-group {
   display: flex;
   display: flex;
-  flex-direction: column;
+  align-items: baseline;
+  flex-direction: row;
 }
 }
 .radio-selector {
 .radio-selector {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
   &:not(:last-of-type) {
   &:not(:last-of-type) {
-    margin-bottom: 24px;
+    margin-bottom: 12px;
   }
   }
   .r-c-label {
   .r-c-label {
     margin-right: 32px;
     margin-right: 32px;
@@ -1022,10 +1028,18 @@ export default {
   text-decoration: underline;
   text-decoration: underline;
   cursor: pointer;
   cursor: pointer;
 }
 }
-
+.tip-text{
+  font-size: 14px;
+  line-height: 22px;
+  color: #aaa;
+}
 .vip-sub-item-content {
 .vip-sub-item-content {
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
+  &.choice-area-content{
+    align-items: flex-start;
+    flex-direction: column;
+  }
 }
 }
 .vip-sub-tip {
 .vip-sub-tip {
   padding-top: 0 !important;
   padding-top: 0 !important;

+ 1 - 1
apps/bigmember_pc/src/views/order/layout.vue

@@ -55,7 +55,7 @@ export default {
 <style lang="scss" scoped>
 <style lang="scss" scoped>
 .page-create-order {
 .page-create-order {
   &-content {
   &-content {
-    padding-top: 36px;
+    //padding-top: 36px;
     padding-bottom: 126px;
     padding-bottom: 126px;
     &.v-w1200 {
     &.v-w1200 {
       max-width: 1200px !important;
       max-width: 1200px !important;

+ 14 - 1
apps/bigmember_pc/src/views/vipsubscribe/components/Contrast.vue

@@ -163,6 +163,8 @@
         </div>
         </div>
       </div>
       </div>
     </div>
     </div>
+    <div class="view-all" @click="viewAll">查看全部权益 <i class="iconfont icon-more"></i></div>
+
   </div>
   </div>
 </template>
 </template>
 
 
@@ -203,6 +205,9 @@ export default {
         $(window).scrollTop() > this.stickyed.startFixedTop &&
         $(window).scrollTop() > this.stickyed.startFixedTop &&
         $(window).scrollTop() < tableMaxHeight
         $(window).scrollTop() < tableMaxHeight
       this.stickyed.forbid = !show
       this.stickyed.forbid = !show
+    },
+    viewAll () {
+      window.open('/product/index?serviceType=0', '_blank')
     }
     }
   }
   }
 }
 }
@@ -276,7 +281,7 @@ export default {
   }
   }
   .contrast-main {
   .contrast-main {
     width: 100%;
     width: 100%;
-    height: 1180px;
+    height: 1170px;
     margin-top: 32px;
     margin-top: 32px;
 
 
     $border-color: #ececec;
     $border-color: #ececec;
@@ -647,4 +652,12 @@ export default {
     }
     }
   }
   }
 }
 }
+.view-all{
+  cursor: pointer;
+  font-size:16px;
+  line-hieght: 24px;
+  color: $color_main;
+  text-align: center;
+  padding-bottom:20px;
+}
 </style>
 </style>

+ 268 - 17
apps/bigmember_pc/src/views/workspace/components/AccountInfo.vue

@@ -1,19 +1,95 @@
 <template>
 <template>
   <section class="user-info-card">
   <section class="user-info-card">
     <h4 class="user-info-title">
     <h4 class="user-info-title">
-      <span class="user-info-title-fireworks"></span>
-      <span class="user-info-title-text highlight-text"
-        >欢迎您!<i class="user-nickname">{{ accountInfo.nickName }}</i></span
-      >
+      <span>
+        <span class="user-info-title-fireworks"></span>
+        <span class="user-info-title-text highlight-text"
+        >欢迎您!<i class="user-nickname">{{ accountInfo.nickName }}</i></span>
+      </span>
+      <span class="user-info-icon" v-if="accountInfo.vipType && (accountInfo.vipType === '超级订阅'  || accountInfo.vipType.includes('大会员'))">
+        <i :class="accountInfo.vipType === '超级订阅' ? 'vip-icon': 'bigmember-icon'"></i>
+      </span>
     </h4>
     </h4>
     <p class="user-info-line user-info-type">
     <p class="user-info-line user-info-type">
       <span class="user-info-line-label">账号类型:</span>
       <span class="user-info-line-label">账号类型:</span>
       <span class="user-info-line-value">{{ accountInfo.vipType }}</span>
       <span class="user-info-line-value">{{ accountInfo.vipType }}</span>
+      <span class="u-i-line-tip" v-if="accountInfo.vipType === '注册用户'">您尚未开通会员</span>
     </p>
     </p>
-    <p class="user-info-line user-info-time" v-if="accountInfo.vipEntTime">
-      <span class="user-info-line-label">会员服务到期时间:</span>
-      <span class="user-info-line-value">{{ accountInfo.vipEntTime }}</span>
-    </p>
+    <div
+      class="user-info-line user-info-free bg-gold"
+      v-if="accountInfo.vipType === '注册用户'"
+    >
+      <p>
+        <span>
+          <i class="vip-icon"> </i>
+          <span>开通超级订阅</span>
+        </span>
+        <span class="activity-span" v-if="attr.subVipActMsg">
+          <i class="limit-time-icon"></i>
+          <span>{{attr.subVipActMsg}}</span>
+        </span>
+      </p>
+      <p class="handle-p">
+        <span>立享27+项专属权益</span>
+        <span
+          class="handle-btn"
+          @click="buyVip('buy')">
+          立即开通</span>
+      </p>
+    </div>
+    <div
+      class="user-info-line user-info-module"
+      v-else-if="accountInfo.vipType === '超级订阅'"
+    >
+      <div class="user-info-line-value value-box bg-gold">
+        <p>到期时间:{{ accountInfo.vipEntTime }}</p>
+        <p class="handle-btn  m-t-6"
+           v-if="attr.renew"
+           @click="buyVip('renew')">
+          去续费<i class="iconfont icon-more"></i>
+        </p>
+      </div>
+      <div class="gap"></div>
+      <div  class="user-info-line-value value-box bg-gold">
+        <p>购买区域:{{ attr.buyMsg }}</p>
+        <p class="handle-btn m-t-6"
+           @click="updateVip">
+          {{ attr.upgrade ? '去升级' : '升级咨询'}}
+          <i class="iconfont icon-more"></i>
+        </p>
+      </div>
+    </div>
+    <div
+      class="user-info-line user-info-module"
+      v-else-if="accountInfo.vipType === '省份订阅包'"
+    >
+      <div class="user-info-line-value value-box bg-blue">
+        <p>到期时间:{{ accountInfo.vipEntTime }}</p>
+        <p class="handle-btn m-t-6"
+           v-if="attr.renew"
+           @click="openCustomer">
+          去续费<i class="iconfont icon-more"></i>
+        </p>
+      </div>
+      <div class="gap"></div>
+      <div  class="user-info-line-value value-box bg-blue">
+        <p>购买区域:{{ attr.buyMsg }}</p>
+        <p class="handle-btn m-t-6" v-if="attr.upgrade" @click="areaVipUpdate">
+          {{attr.upgrade ? '去升级' : '开通超级订阅'}}
+          <i class="iconfont icon-more"></i>
+        </p>
+      </div>
+    </div>
+<!--    大会员或者商机管理-->
+    <div class="user-info-line user-info-module" v-else>
+      <div class="user-info-line-value value-box bigmember bg-black">
+        <p>到期时间:{{ accountInfo.vipEntTime }}</p>
+        <p class="handle-btn  m-t-6"
+           @click="renewConsult">续费咨询
+          <i class="iconfont icon-more"></i>
+        </p>
+      </div>
+    </div>
   </section>
   </section>
 </template>
 </template>
 
 
@@ -25,23 +101,66 @@ export default {
     return {
     return {
       accountInfo: {
       accountInfo: {
         nickName: '',
         nickName: '',
-        vipType: '',
-        vipEntTime: ''
       }
       }
     }
     }
   },
   },
+  computed: {
+    attr () {
+      return this.accountInfo.attr || {}
+    }
+  },
   mounted() {
   mounted() {
     this.getAccount()
     this.getAccount()
   },
   },
   methods: {
   methods: {
     async getAccount() {
     async getAccount() {
-      const { data } = await getUserAccountShow()
-      if (data) {
-        const { nickname, vipType, vipEntTime } = data
-        this.accountInfo.nickName = nickname
-        this.accountInfo.vipType = vipType
-        this.accountInfo.vipEntTime = vipEntTime
+      const { data, error_code } = await getUserAccountShow()
+      if(error_code === 0 && data) {
+        const { nickname, list = []} = data
+        const info = list[0] || {}
+        this.accountInfo = {
+          nickName: nickname,
+          vipType: info.name,
+          vipEntTime:  info.endTime ? new Date(info.endTime * 1000 ).pattern('yyyy-MM-dd') : '',
+          attr: info.attr || {}
+        }
+      }
+    },
+    buyVip (type) {
+      window.open('/swordfish/page_big_pc/free/svip/buy?type=' + type)
+    },
+    // 升级超级订阅
+    updateVip () {
+      if(this.attr.upgrade) {
+        this.buyVip('upgrade')
+      } else {
+        this.openCustomer()
       }
       }
+    },
+    // 省份订阅包升级
+    areaVipUpdate () {
+      if(this.attr.upgrade) {
+        this.openCustomer()
+      } else {
+        this.buyVip('buy')
+      }
+    },
+    // 联系客服
+    openCustomer() {
+      this.contactCustomer(this)
+    },
+    jumpPage (link) {
+      if(link) {
+        window.open(link)
+      }
+    },
+    renewConsult () {
+      if(this.accountInfo.vipType === '商机管理') {
+        this.openCustomer()
+      } else {
+        this.jumpPage(this.attr.pc)
+      }
+
     }
     }
   }
   }
 }
 }
@@ -56,6 +175,7 @@ export default {
   .user-info-title {
   .user-info-title {
     display: flex;
     display: flex;
     align-items: center;
     align-items: center;
+    justify-content: space-between;
     margin-bottom: 6px;
     margin-bottom: 6px;
     &-fireworks {
     &-fireworks {
       display: inline-block;
       display: inline-block;
@@ -64,6 +184,7 @@ export default {
       margin-right: 8px;
       margin-right: 8px;
       background: url('~@/assets/images/icon/fireworks.png') no-repeat center;
       background: url('~@/assets/images/icon/fireworks.png') no-repeat center;
       background-size: contain;
       background-size: contain;
+      vertical-align: text-bottom;
     }
     }
     &-text {
     &-text {
       font-size: 16px;
       font-size: 16px;
@@ -79,9 +200,139 @@ export default {
     &-value {
     &-value {
       color: #1d1d1d;
       color: #1d1d1d;
     }
     }
+    .u-i-line-tip {
+        font-size: 12px;
+        line-height: 18px;
+        color: #fb483d;
+        padding:3px 8px;
+        background: #FEE9E8;
+        border-radius: 16px;
+        margin-left:8px;
+    }
+  }
+  .user-info-module{
+    display: flex;
+    justify-content: space-between;
+    .value-box{
+      flex: 1;
+      border-radius: 8px;
+      text-align: center;
+      padding: 8px 0;
+      font-size: 12px;
+      line-height: 18px;
+      &.bigmember{
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 8px 16px 8px 12px;
+        color: #FAE7CA;
+        .handle-btn{
+          padding: 3px 12px;
+          background: #FAE7CA;
+          color: #171826;
+          margin-top: 0;
+          box-shadow: 0 4px 12px rgba(186, 105, 31, 0.32);
+          border: 1px solid rgba(255, 255, 255, .5);
+          .icon-more {
+            color: #171826;
+          }
+        }
+      }
+    }
+    .gap{
+      display: inline-block;
+      width: 8px;
+    }
+  }
+  .handle-btn{
+    display: inline-block;
+    padding: 3px 8px;
+    border-radius: 16px;
+    border: 1px solid #fff;
+    font-size: 12px;
+    line-height: 18px;
+    cursor: pointer;
+    background: rgba(255, 255, 255, 0.5);
   }
   }
   .user-info-type {
   .user-info-type {
-    margin-bottom: 4px;
+    margin-bottom: 8px;
+  }
+  .user-info-free {
+    padding: 8px 12px;
+    border-radius: 8px;
+    color: #1d1d1d;
+    p{
+      display: flex;
+      align-items: center;
+    }
+    .vip-icon{
+      width: 20px;
+      height:20px;
+      background-size: 14px;
+      border-radius: 50%;
+      margin-right: 4px;
+    }
+    .activity-span{
+      padding: 2px 5px;
+      border-radius: 9px 0 9px 0;
+      color: #fff;
+      background: linear-gradient(90deg, #FF7C32 0%, #F33838 100%);
+      margin-left: 4px;
+      font-size: 12px;
+      line-height: 18px;
+    }
+    .limit-time-icon{
+      display: inline-block;
+      width: 16px;
+      height: 16px;
+      background: url('~@/assets/images/icon/limit-time.png') no-repeat center;
+      background-size: cover;
+      vertical-align: text-bottom;
+    }
+    .handle-p{
+      font-size: 12px;
+      line-height:18px;
+      justify-content: space-between;
+      margin-top: 4px;
+      .handle-btn{
+        padding: 5px 12px;
+        background: #FAE7CA;
+        box-shadow: 0 4px 12px rgba(186, 105, 31, 0.32);
+        border: 1px solid rgba(255, 255, 255, .5);
+      }
+    }
+  }
+  .bg-gold{
+    background: linear-gradient(90deg,#FFECCE 0%, #FCD7B2 100%);
+  }
+  .bg-blue{
+    background: linear-gradient(90deg, #DDFFF5 0%, #7CE8F6 100%);
+  }
+  .bg-black{
+    background: linear-gradient(90deg,#747474 0%, #424350 100%);
+  }
+  .vip-icon {
+    display: inline-block;
+    width: 18px;
+    height: 18px;
+    background: #fff url('~@/assets/images/userType/vip-icon.png') no-repeat center;
+    background-size: cover;
+    vertical-align: text-bottom;
+  }
+  .bigmember-icon {
+    display: inline-block;
+    width: 20px;
+    height: 20px;
+    background: #fff url('~@/assets/images/userType/bigmember-icon.png') no-repeat center;
+    background-size: cover;
+    vertical-align: text-bottom;
+  }
+  .icon-more{
+    font-size: 14px;
+    color: #1d1d1d;
+  }
+  .m-t-6{
+    margin-top: 6px;
   }
   }
 }
 }
 </style>
 </style>

+ 11 - 0
apps/mobile/src/api/modules/user.js

@@ -23,3 +23,14 @@ export function getCustomInfo (data) {
     data
     data
   })
   })
 }
 }
+
+/**
+ *  获取用户账号下多类型权益信息如,有大会员、超级订阅等权益
+ * @returns {*}
+ */
+export function getUserAccountInfo() {
+  return request({
+    url: '/jypay/user/account/show',
+    method: 'POST'
+  })
+}

BIN
apps/mobile/src/assets/image/icon/limit-time.png


BIN
apps/mobile/src/assets/image/icon/vip/vip-icon.png


BIN
apps/mobile/src/assets/image/mine/bg-black.png


BIN
apps/mobile/src/assets/image/mine/bg-blue.png


BIN
apps/mobile/src/assets/image/mine/bg-gold.png


+ 498 - 272
apps/mobile/src/components/mine/MineHeader.vue

@@ -1,125 +1,118 @@
 <template>
 <template>
-  <div class="mine-header">
-    <van-sticky v-if="$envs.inAppOrH5">
-      <div class="tabbar-header-top-placeholder" v-if="$envs.inApp"></div>
-      <div class="app-header-set tabbar-header">
-        <span class="set-icon clickable" @click="jumpSetting">
-          <AppIcon name="Setting" size="25" />
-        </span>
-      </div>
-    </van-sticky>
+  <div class="mine-header" :class="mineClass">
+    <div class="tabbar-header-top-placeholder" v-if="$envs.inApp"></div>
     <div class="header-info" :class="{ pt: $envs.inWX }">
     <div class="header-info" :class="{ pt: $envs.inWX }">
       <div class="user-img">
       <div class="user-img">
         <img
         <img
           :src="pageUserInfo.headimageurl || pageUserInfo.avatar"
           :src="pageUserInfo.headimageurl || pageUserInfo.avatar"
           @error="errorImgFun"
           @error="errorImgFun"
         />
         />
+        <span v-if="accountInfo.hasVip" class="j-icon vip-icon"></span>
+        <span v-if="accountInfo.hasBigmember" class="j-icon bigmember-icon"></span>
       </div>
       </div>
       <div class="user-info-container">
       <div class="user-info-container">
         <div class="user-info-top">
         <div class="user-info-top">
-          <span
-            class="ellipsis user-name"
-            v-if="
-              pageUserInfo.nickname || pageUserInfo.phone || pageUserInfo.jyname
-            "
-            >{{ getName }}</span
-          >
-          <span
-            class="j-icon base-icon icon-super-sub"
-            v-if="pageUserInfo.subscribeVip && pageUserInfo.subscribeVip > 0"
-          ></span>
-          <span
-            class="j-icon base-icon big-vip-icon"
-            v-if="pageUserInfo.bigmemberVip && pageUserInfo.bigmemberVip > 0"
-            :style="'background-image:url(' + setBigVipPic + ')'"
-          ></span>
+          <span class="ellipsis user-name"
+            v-if="getName">{{ getName }}</span>
         </div>
         </div>
-        <div class="user-info-bottom">
-          <span
-            class="ellipsis user-phone"
-            v-if="pageUserInfo.nickname && pageUserInfo.phone"
-            >{{
-              pageUserInfo.phone.replace(/(\d{3})\d{4}(\d{4})/, '$1 **** $2')
-            }}</span
-          >
-          <span
-            class="set-phone"
-            @click="bindPhone({})"
-            v-if="!pageUserInfo.phone"
-            >绑定手机号</span
-          >
+        <div class="user-info-bottom" :class="{'single-identity-container': userIdentityList.length === 1}">
+          <span class="change-identity" @click="changeIdentityHandle">
+            <span class="identity-name ellipsis">
+               {{userCurrentIdentity ? userCurrentIdentity.name : '' }}
+            </span>
+            <AppIcon v-if="userIdentityList.length > 1" name="qiehuan" size="12" color="#171826" />
+          </span>
+          <span class="identity-keep" @click.stop="jumpIdentityKeep">
+            <span>身份信息维护</span>
+            <AppIcon name="youbian" size="10" color="#fff" />
+          </span>
         </div>
         </div>
       </div>
       </div>
-      <div
-        class="wx-header-set clickable"
-        @click="jumpSetting"
-        v-if="$envs.inWX"
-      >
-        <AppIcon name="Setting" size="25" />
-      </div>
-    </div>
-    <div
-      class="change-identity plr12"
-      :class="
-        userCurrentIdentity && userCurrentIdentity.positionType !== 1
-          ? 'id-bg-one'
-          : 'id-bg-two'
-      "
-    >
-      <span class="identity-name ellipsis">{{
-        userCurrentIdentity ? userCurrentIdentity.name : ''
-      }}</span>
-      <div class="change-right" @click="changeIdentityHandle">
-        <span v-if="userIdentityList.length > 1">
-          <AppIcon name="qiehuan" size="14" color="#33373B" />
-          <span class="text">切换身份</span>
-        </span>
-        <span class="identity-keep-inset" v-else @click.stop="jumpIdentityKeep">
-          <span>身份信息维护</span>
-          <AppIcon name="youbian" size="16" color="#2ABED1" />
-        </span>
-      </div>
-      <div
-        v-if="userIdentityList.length > 1"
-        class="identity-keep"
-        @click.stop="jumpIdentityKeep"
-      >
-        <span>身份信息维护</span>
-        <AppIcon name="youbian" size="10" color="#fff" />
+      <div class="app-header-set clickable"  @click="jumpSetting">
+        <AppIcon name="Setting" size="20" color="#fff"/>
       </div>
       </div>
     </div>
     </div>
-    <div class="order-tabs">
-      <div class="order-tab-item clickable" @click="jumpOrderPage(1)">
-        <AppIcon name="dingdan_daifukuan" size="36" color="33373B" />
-        <div class="tab-item-text">待付款</div>
-      </div>
-      <div class="order-tab-item clickable" @click="jumpOrderPage(2)">
-        <AppIcon name="dingdan_yiwancheng" size="36" color="33373B" />
-        <div class="tab-item-text">已完成</div>
-      </div>
-      <div class="order-tab-item clickable" @click="jumpOrderPage(3)">
-        <AppIcon name="dingdan_yiquxiao" size="36" color="33373B" />
-        <div class="tab-item-text">已取消</div>
+    <div class="account-info" v-if="Array.isArray(accountList) && accountList.length > 0">
+      <div class="account-info-label">
+        <div class="account-info-name" :class="{'active-type': temp.selected && accountList.length > 1}"  v-for="temp in accountList" @click="changeAccountType(temp)">
+          <span class="type-name">{{accountList.length === 1 ? '账号类型:' : ''}}{{ temp.name }}</span>
+          <span class="tip" v-if="activeAccountType.name === '注册用户'">您尚未开通会员</span>
+        </div>
       </div>
       </div>
-      <div class="order-tab-item clickable" @click="jumpOrderPage(0)">
-        <AppIcon name="dingdan_quanbudingdan" size="36" color="33373B" />
-        <div class="tab-item-text">全部订单</div>
+      <div class="account-info-content" v-if="activeAccountType">
+        <div class="account-handle account-handle--free bg-line-gold" v-if="activeAccountType.name === '注册用户'">
+          <p>
+            <i class="vip-icon"></i>
+            <span class="text">开通超级订阅</span>
+            <span class="activity-tip" v-if="activeAccountType.attr.subVipActMsg">
+              <i class="limit-time-icon"></i>
+              {{ activeAccountType.attr.subVipActMsg }}
+            </span>
+          </p>
+          <p>
+            <span>立享27+项专属权益</span>
+            <span class="self-handle-btn" @click="toBuyVip('buy')">立即开通</span>
+          </p>
+        </div>
+        <div class="account-handle account-handle--vip " v-else-if="activeAccountType.name === '超级订阅' && activeAccountType.attr">
+          <div class="account-handle-item bg-line-gold">
+            <p>到期时间:{{ activeAccountType.vipEntTime }}</p>
+            <p class="self-handle-btn" v-if="activeAccountType.attr.renew" @click="toBuyVip('renew')">
+              去续费 <AppIcon name="youbian" size="16" color="#171826" />
+            </p>
+          </div>
+          <div class="gap"></div>
+          <div class="account-handle-item bg-line-gold">
+            <p>购买区域:{{ activeAccountType.attr.buyMsg }}</p>
+            <p class="self-handle-btn" @click="updateVip(activeAccountType.attr)">
+              <span>{{activeAccountType.attr.upgrade ? '去升级' : '升级咨询'}}</span>
+              <AppIcon name="youbian" size="16" color="#171826" />
+            </p>
+          </div>
+        </div>
+        <div class="account-handle account-handle--vip " v-else-if="activeAccountType.name === '省份订阅包' && activeAccountType.attr">
+          <div class="account-handle-item bg-line-gold">
+            <p>到期时间:{{ activeAccountType.vipEntTime }}</p>
+            <p class="self-handle-btn" v-if="activeAccountType.attr.renew" @click="areaVip('renew')">
+              去续费 <AppIcon name="youbian" size="16" color="#171826" />
+            </p>
+          </div>
+          <div class="gap"></div>
+          <div class="account-handle-item" :class="activeAccountType.attr.buyMsg !== '全国' ? 'bg-line-gold' : 'bg-line-blue'">
+            <p>购买区域:{{ activeAccountType.attr.buyMsg }}</p>
+            <p class="self-handle-btn" @click="areaVipUpdate(activeAccountType.attr)">
+              <span>{{activeAccountType.attr.upgrade ? '去升级' : '开通超级订阅'}} </span>
+              <AppIcon name="youbian" size="16" color="#171826" />
+            </p>
+          </div>
+        </div>
+        <!--大会员和商机管理-->
+        <div class="account-handle account-handle--big-ent bg-line-gold" v-else>
+          <p>您的会员到期时间:{{ activeAccountType.vipEntTime }}</p>
+          <p class="self-handle-btn" @click="renewConsult">
+            续费咨询 <AppIcon name="youbian" size="16" color="#171826" />
+          </p>
+        </div>
       </div>
       </div>
     </div>
     </div>
+<!--    订单tab-->
+    <order-tabs/>
   </div>
   </div>
 </template>
 </template>
 
 
 <script>
 <script>
+import OrderTabs from './OrderTabs.vue'
 import { Sticky } from 'vant'
 import { Sticky } from 'vant'
-import { getAccountInfo } from '@/api/modules'
+import { getAccountInfo, getUserAccountInfo } from '@/api/modules'
 import { AppIcon } from '@/ui'
 import { AppIcon } from '@/ui'
-import { openAppOrWxPage } from '@/utils'
+import { openAppOrWxPage, dateFormatter } from '@/utils'
 import { LINKS } from '@/data'
 import { LINKS } from '@/data'
 import { mapActions, mapGetters } from 'vuex'
 import { mapActions, mapGetters } from 'vuex'
 export default {
 export default {
   components: {
   components: {
     [Sticky.name]: Sticky,
     [Sticky.name]: Sticky,
-    [AppIcon.name]: AppIcon
+    [AppIcon.name]: AppIcon,
+    OrderTabs
   },
   },
   data() {
   data() {
     return {
     return {
@@ -128,61 +121,97 @@ export default {
         nickname: '',
         nickname: '',
         phone: '',
         phone: '',
         bigmemberVip: ''
         bigmemberVip: ''
+      },
+      accountInfo: {
+        hasVip: false,
+        hasBigmember: false
       }
       }
     }
     }
   },
   },
   computed: {
   computed: {
     getName() {
     getName() {
-      let name
       const { nickname, phone, jyname } = this.pageUserInfo
       const { nickname, phone, jyname } = this.pageUserInfo
-      if (nickname) {
-        name = nickname
-      } else if (phone) {
-        name = phone.replace(/(\d{3})\d{4}(\d{4})/, '$1 **** $2')
-      } else if (jyname) {
-        name = jyname
-      }
-      return name
+      const rephone = phone ? phone.replace(/(\d{3})\d{4}(\d{4})/, '$1 **** $2') : ''
+      return nickname || rephone || jyname
     },
     },
-    setBigVipPic() {
-      let url = new URL(
-        '@/assets/image/icon/big-member/icon-shiyonghy.png',
-        import.meta.url
-      ).href
-      const { bigmemberVip } = this.pageUserInfo
-      if (bigmemberVip === 1 || bigmemberVip === 5 || bigmemberVip === 7) {
-        url = new URL(
-          '@/assets/image/icon/big-member/icon-gaojihy.png',
-          import.meta.url
-        ).href
-      } else if (bigmemberVip === 2) {
-        url = new URL(
-          '@/assets/image/icon/big-member/icon-biaozhunhy.png',
-          import.meta.url
-        ).href
-      } else if (bigmemberVip === 3 || bigmemberVip === 6) {
-        url = new URL(
-          '@/assets/image/icon/big-member/icon-putonghy.png',
-          import.meta.url
-        ).href
-      } else if (bigmemberVip === 4) {
-        url = new URL(
-          '@/assets/image/icon/big-member/icon-shiyonghy.png',
-          import.meta.url
-        ).href
+    // setBigVipPic() {
+    //   let url = new URL(
+    //     '@/assets/image/icon/big-member/icon-shiyonghy.png',
+    //     import.meta.url
+    //   ).href
+    //   const { bigmemberVip } = this.pageUserInfo
+    //   if (bigmemberVip === 1 || bigmemberVip === 5 || bigmemberVip === 7) {
+    //     url = new URL(
+    //       '@/assets/image/icon/big-member/icon-gaojihy.png',
+    //       import.meta.url
+    //     ).href
+    //   } else if (bigmemberVip === 2) {
+    //     url = new URL(
+    //       '@/assets/image/icon/big-member/icon-biaozhunhy.png',
+    //       import.meta.url
+    //     ).href
+    //   } else if (bigmemberVip === 3 || bigmemberVip === 6) {
+    //     url = new URL(
+    //       '@/assets/image/icon/big-member/icon-putonghy.png',
+    //       import.meta.url
+    //     ).href
+    //   } else if (bigmemberVip === 4) {
+    //     url = new URL(
+    //       '@/assets/image/icon/big-member/icon-shiyonghy.png',
+    //       import.meta.url
+    //     ).href
+    //   }
+    //   return url
+    // },
+    // 账户权益类型列表
+    accountList () {
+      return this.accountInfo.list || []
+    },
+    // 当前选中账户权益类型
+    activeAccountType() {
+      const obj = this.accountList.filter(item => {
+        return item.selected
+      })
+      return obj.length > 0 ? obj[0] : {}
+    },
+    mineClass () {
+      const type = this.accountList[0] ? this.accountList[0].name : '注册用户'
+      let cl = 'mine-header--blue'
+      if(type === '注册用户' || type === '省份订阅包') {
+        cl = 'mine-header--blue'
+      } else if(type === '超级订阅' ) {
+        cl = 'mine-header--gold'
+      } else {
+        cl = 'mine-header--black'
+      }
+      // 多个权益类型的时候默认黑棕
+      if(this.accountList.length > 1) {
+        cl = 'mine-header--black'
       }
       }
-      return url
+      return cl
+    },
+    ...mapGetters('user', ['userCurrentIdentity', 'userIdentityList', 'isLogin'])
+  },
+  watch: {
+    userCurrentIdentity: {
+      handler () {
+        localStorage.removeItem('mine_account_active_Type')
+      },
+      deep: true,
+      immediate: true,
     },
     },
-    ...mapGetters('user', ['userCurrentIdentity', 'userIdentityList'])
+    isLogin () {
+      localStorage.removeItem('mine_account_active_Type')
+    }
   },
   },
   created() {
   created() {
     this.init()
     this.init()
   },
   },
   methods: {
   methods: {
     ...mapActions('user', ['getUserIdentityList']),
     ...mapActions('user', ['getUserIdentityList']),
-    async init() {
-      await this.getUserInfo()
-      // await this.getUserIdentityList()
+    init() {
+      this.getUserInfo()
+      this.getUserAccountInfo()
     },
     },
     // 获取用户信息
     // 获取用户信息
     async getUserInfo() {
     async getUserInfo() {
@@ -197,6 +226,36 @@ export default {
         return {}
         return {}
       }
       }
     },
     },
+    // 获取用户账号类型信息
+    async getUserAccountInfo () {
+      try {
+        const { error_code: code, data } = await getUserAccountInfo()
+        if (code === 0) {
+          if(Array.isArray(data.list) && data.list.length > 0) {
+            data.list.forEach((item, index) => {
+               if(item.name && item.name.includes('大会员')) {
+                data.hasBigmember = true
+              } else if(item.name === '超级订阅') {
+                data.hasVip = true
+              }
+              item.vipEntTime = item.endTime ? dateFormatter(item.endTime * 1000, 'yyyy-MM-dd') : ''
+              item.selected = false
+              if(index === 0) {
+                item.selected = true
+              }
+              if(!localStorage.getItem('mine_account_active_Type')) {
+                localStorage.setItem('mine_account_active_Type', item.name)
+              }
+            })
+          }
+          this.accountInfo = data || {}
+          // 回显选中的账号权益类型
+          this.backActiveName()
+        }
+      } catch (error) {
+        return {}
+      }
+    },
     checkUserHasBindPhone() {
     checkUserHasBindPhone() {
       const { phone } = this.pageUserInfo
       const { phone } = this.pageUserInfo
       if (!phone) {
       if (!phone) {
@@ -221,65 +280,116 @@ export default {
     bindPhone(query = {}) {
     bindPhone(query = {}) {
       openAppOrWxPage(LINKS.绑定手机号, { query })
       openAppOrWxPage(LINKS.绑定手机号, { query })
     },
     },
-    // 跳转到订单页
-    jumpOrderPage(type) {
-      openAppOrWxPage(LINKS.我的订单页面, {
-        query: { active: type }
-      })
-    },
     changeIdentityHandle() {
     changeIdentityHandle() {
       this.$router.push('/mine/change/identity')
       this.$router.push('/mine/change/identity')
     },
     },
     // 身份信息维护
     // 身份信息维护
     jumpIdentityKeep() {
     jumpIdentityKeep() {
       this.$router.push('/identity/keep')
       this.$router.push('/identity/keep')
+    },
+    // 账号权益类型切换
+    changeAccountType (temp) {
+      if(this.accountInfo.list) {
+        this.accountInfo.list.forEach(item => {
+          item.selected = false
+        })
+        temp.selected = true
+      }
+      localStorage.setItem('mine_account_active_Type', temp.name)
+    },
+    backActiveName () {
+      const active = localStorage.getItem('mine_account_active_Type')
+      if(active && this.accountInfo.list) {
+        this.accountInfo.list.forEach(item => {
+          item.selected = false
+          if(item.name === active) {
+            item.selected = true
+          }
+        })
+      }
+    },
+    // 超级订阅
+    toBuyVip(type) {
+      this.$router.push(`/common/order/create/svip?type=${type}`)
+    },
+    // 升级
+    updateVip (item) {
+      if(item.upgrade) {
+        this.toBuyVip('upgrade')
+      } else {
+        this.openCustomer()
+      }
+    },
+    // 省份订阅包续费/升级
+    areaVip (type) {
+      this.$router.push(`/common/order/create/areapack?type=${type}`)
+    },
+    // 省份订阅包升级
+    areaVipUpdate (item) {
+      if(item.upgrade) {
+        this.areaVip('upgrade')
+      } else {
+        // 开通超级订阅
+        this.toBuyVip('buy')
+      }
+    },
+    // 大会员or商机管理续费咨询
+    renewConsult () {
+      // 大会员续费咨询跳转落地页
+      if(this.activeAccountType.name && this.activeAccountType.name.includes('大会员')) {
+        const attr = this.activeAccountType.attr || {}
+        const link = {
+          app: attr.app,
+          h5: attr.h5,
+          wx: attr.h5
+        }
+        openAppOrWxPage(link)
+      } else {
+        // 商机管理的续费咨询,咨询客服
+        this.openCustomer()
+      }
+    },
+    // 联系客服
+    openCustomer () {
+      if (this.$envs.inWX) {
+        window.location.href = '/big/wx/page/customer'
+      } else {
+        window.location.href = '/jyapp/free/customer'
+      }
     }
     }
   }
   }
 }
 }
 </script>
 </script>
 
 
 <style lang="scss" scoped>
 <style lang="scss" scoped>
-.tabbar-header-top-placeholder {
-  background-color: $white;
-}
 .mine-header {
 .mine-header {
-  background-color: $white;
+  position: relative;
   display: flex;
   display: flex;
   flex-direction: column;
   flex-direction: column;
-  padding: 0 16px;
+  padding: 0 12px 79px;
   flex-shrink: 0;
   flex-shrink: 0;
-  &.app-header-padding-top {
-    padding-top: ($app-header-padding-top - 8px);
+  background-repeat: no-repeat;
+  background-position: center top;
+  background-size: cover;
+  &--blue {
+    background-image: url(@/assets/image/mine/bg-blue.png);
   }
   }
-  .set-icon {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    // width: 40px;
-    // height:40px;
+  &--black {
+    background-image: url(@/assets/image/mine/bg-black.png);
   }
   }
-  .app-header-set {
-    width: 100%;
-    height: 44px;
-    padding: 0;
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-    min-width: 20px;
-    background: #fff;
+  &--gold {
+    background-image: url(@/assets/image/mine/bg-gold.png);
   }
   }
-  .van-sticky--fixed {
-    .app-header-set {
-      padding: 16px;
-    }
+  .app-header-set {
+    padding: 4px 0 0;
+    align-self: flex-start;
   }
   }
   .header-info {
   .header-info {
     display: flex;
     display: flex;
     flex: 1;
     flex: 1;
     justify-content: space-between;
     justify-content: space-between;
     align-items: center;
     align-items: center;
-    background: #fff;
-    padding-bottom: 12px;
+    padding:8px 0;
     .user-info-container {
     .user-info-container {
       display: flex;
       display: flex;
       flex-direction: column;
       flex-direction: column;
@@ -294,60 +404,39 @@ export default {
     .user-name {
     .user-name {
       max-width: 164px;
       max-width: 164px;
       display: inline-block;
       display: inline-block;
-      font-size: 21px;
-      line-height: 29px;
-      color: #33373c;
+      font-size: 20px;
+      line-height: 30px;
+      color: #fff;
       text-overflow: ellipsis;
       text-overflow: ellipsis;
       overflow: hidden;
       overflow: hidden;
       white-space: nowrap;
       white-space: nowrap;
       word-break: break-all;
       word-break: break-all;
       margin-right: 8px;
       margin-right: 8px;
     }
     }
-    .user-phone {
-      width: auto;
-      display: flex;
-      align-items: center;
-      margin-top: 2px;
-      color: #686868;
-      font-size: 13px;
-      box-sizing: content-box;
-    }
-    .set-phone {
-      display: inline-block;
-      position: relative;
-      border-radius: 13px;
-      line-height: 24px;
-      color: #64696f;
-      padding: 0 10px;
-      border: 1px solid rgba(0, 0, 0, 0.07);
-      text-align: center;
-      font-size: 13px;
-    }
-    .wx-header-set {
-      margin-left: 8px;
-      padding: 10px;
-      align-self: flex-start;
-    }
     .user-img {
     .user-img {
-      margin-right: 12px;
-      width: 60px;
-      height: 60px;
+      margin-right: 8px;
+      width: 48px;
+      height: 48px;
+      position: relative;
+      border: 1px solid rgba(255, 255, 255, 0.5);
       border-radius: 50%;
       border-radius: 50%;
-      overflow: hidden;
+      img{
+        border-radius: 50%;
+      }
+      .j-icon {
+        position: absolute;
+      }
+      .vip-icon{
+        left:0;
+        background:rgba(255, 255, 255, 0.5) url(@/assets/image/icon/vip/vip-icon.png) no-repeat center;
+        background-size: 14px;
+      }
+      .bigmember-icon {
+        right:0;
+        bottom: 0;
+      }
     }
     }
 
 
-    .u_right {
-      display: block;
-      white-space: nowrap;
-      padding: 0 10px;
-      height: 21px;
-      line-height: 24px;
-      text-align: center;
-      background: linear-gradient(270deg, #f1d090 0%, #fae7ca 100%);
-      color: #1b1a2a;
-      font-size: 11px;
-      border-radius: 12px;
-    }
     .j-icon {
     .j-icon {
       display: inline-block;
       display: inline-block;
       width: 20px;
       width: 20px;
@@ -360,8 +449,27 @@ export default {
       background-size: contain;
       background-size: contain;
       margin-right: 8px;
       margin-right: 8px;
     }
     }
-    .icon-super-sub {
-      background-image: url(@/assets/image/icon/vip/icon-vip-gold-deep.png);
+    //.icon-super-sub {
+    //  background-image: url(@/assets/image/icon/vip/icon-vip-gold-deep.png);
+    //}
+    .user-info-bottom{
+      display: flex;
+      align-items: center;
+      .change-identity{
+        font-size: 10px;
+        line-height: 14px;
+        color: #171826;
+        padding: 2px 8px;
+        border-radius: 10px;
+        border: 1px solid  #fff;
+        background: rgba(255, 255, 255, 0.65);
+        margin-right: 8px;
+      }
+      .identity-keep{
+        color: #fff;
+        line-height: 18px;
+        font-size: 12px;
+      }
     }
     }
   }
   }
   .pt {
   .pt {
@@ -371,75 +479,193 @@ export default {
     padding-left: 12px;
     padding-left: 12px;
     padding-right: 12px;
     padding-right: 12px;
   }
   }
-  .change-identity {
-    position: relative;
-    height: 44px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    background-repeat: no-repeat;
-    background-position: center;
-    background-size: 100%;
-    border-radius: 6px;
-    .change-right {
-      min-width: 80px;
-      text-align: right;
-      .identity-keep-inset {
-        color: #5f5e64;
-        text-align: center;
-        font-size: 14px;
-      }
+  .self-handle-btn{
+    display: inline-block;
+    font-size:12px;
+    line-height: 18px;
+    padding: 3px 12px;
+    border-radius: 16px;
+    border: 1px solid #fff;
+    background: rgba(255, 255, 255, .65);
+    color: #171826;
+  }
+  .j-icon {
+    display: inline-block;
+    width: 20px;
+    height: 20px;
+    border-radius: 50%;
+    border: 1px solid rgba(255, 255, 255, 0.65);
+  }
+  .vip-icon{
+    background:rgba(255, 255, 255, 0.65) url(@/assets/image/icon/vip/vip-icon.png) no-repeat center;
+    background-size: 14px;
+  }
+  .bigmember-icon {
+    background:rgba(255, 255, 255, 0.5) url(@/assets/image/icon/big-member/icon-gaojihy.png) no-repeat center;
+    background-size: 14px;
+  }
+  .bg-line-gold{
+    background: linear-gradient(90deg,#FFECCE 0%, #FCD7B2 100%);
+    .self-handle-btn{
+      border: 1px solid rgba(255,255,255,.5);
+      box-shadow: 0px 4px 12px 0px rgba(186, 105, 31, 0.32);
     }
     }
-    .identity-name {
-      font-size: 15px;
-      line-height: 22px;
-      color: #171826;
+  }
+  .bg-line-blue{
+    background: linear-gradient(90deg, #DDFFF5 0%, #7CE8F6 100%);
+    .self-handle-btn{
+      border: 1px solid #fff;
+      box-shadow: 0 4px 12px 0 rgba(31, 186, 177, 0.32);
     }
     }
-    .text {
-      font-size: 14px;
-      line-height: 20px;
-      color: #5f5e64;
+  }
+  .limit-time-icon {
+    display: inline-block;
+    width: 12px;
+    height: 12px;
+    background: url(@/assets/image/icon/limit-time.png) no-repeat center;
+    background-size: cover;
+    vertical-align: text-bottom;
+  }
+  .account-info{
+    font-size:12px;
+    color: #171826;
+    margin-top: 8px;
+    span {
+      display: inline-block;
+    }
+    .account-info-label {
+      display: flex;
+      justify-content: flex-start;
+    }
+    .account-info-name{
+      line-height: 18px;
+      cursor: pointer;
+      .type-name {
+        padding: 2px 12px;
+        border-radius: 11px;
+        margin-right: 8px;
+      }
+      .tip {
+        color: #fff;
+        margin-left:4px;
+      }
     }
     }
+    .account-handle{
+      display: flex;
+      justify-content: space-between;
+      margin-top: 8px;
+      .gap{
+        width:8px;
+      }
+      &-item{
+        display: flex;
+        align-items: center;
+        flex-direction: column;
+        justify-content: center;
+        flex: 1;
+        text-align: center;
+        padding: 8px 0;
+        border-radius: 12px 12px 0 0;
+        color: #171826;
+        box-shadow: 0px -2px 8px 0px rgba(169, 117, 39, 0.15);
+        p{
+          font-size: 12px;
+          line-height:18px;
+        }
+        p:nth-of-type(1) {
+          margin-bottom: 6px;
+        }
+      }
+      &--free {
+        padding: 8px 12px 14px;
+        border-radius: 12px 12px 0 0;
+        flex-direction: column;
+        position: relative;
+        p:nth-of-type(1) {
+          display: flex;
+          align-items: center;
+          margin-bottom: 4px;
+          .text {
+            font-size: 16px;
+            line-height: 24px;
+            margin-left: 2px;
+          }
+          .activity-tip{
+            padding: 2px 5px;
+            border-radius: 9px 0 9px 0;
+            background: linear-gradient(90deg, #FF7C32 0%, #F33838 100%);
+            margin-left: 4px;
+            font-size: 10px;
+            line-height: 14px;
+            color: #fff;
+          }
+        }
+        .self-handle-btn{
+          position: absolute;
+          bottom: 10px;
+          right: 12px;
+          font-size:12px;
+          line-height: 18px;
+          padding: 5px 12px;
+          border-radius: 16px;
+          border: 1px solid rgba(255, 255, 255, .5);
+          background: rgba(255, 255, 255, .65);
+          box-shadow: 0 4px 12px 0 rgba(186, 105, 31, 0.32);
+          color: #33323A;
+        }
+      }
 
 
-    &.id-bg-one {
-      background-image: url('@/assets/image/mine/idBg@2x.png');
-      box-shadow: 0 0 0 0.5px #86e1ed !important;
+      &--big-ent {
+        color: #171826;
+        align-items: center;
+        padding: 9px 16px 9px 12px;
+        border-radius: 12px 12px 0px 0px;
+        box-shadow: 0 -2px 8px 0 rgba(169, 117, 39, 0.15);
+      }
     }
     }
-    &.id-bg-two {
-      background-image: url('@/assets/image/mine/IdBg@2x-2.png');
-      box-shadow: 0 0 0 0.5px #f1d090 !important;
+
+  }
+  .icon-youbian {
+    vertical-align: middle;
+  }
+}
+.mine-header--blue {
+  .account-info {
+    .type-name {
+      background: #B9F1F8;
     }
     }
-    .identity-keep {
-      position: absolute;
-      border-radius: 4px 4px 0 0;
-      background: #2abed1;
-      padding: 5px 8px;
-      color: #fff;
-      font-size: 10px;
-      line-height: 14px;
-      right: 0;
-      top: -25px;
+  }
+}
+.mine-header--gold {
+  .account-info {
+    .type-name {
+      background: #FAE7CA;
     }
     }
   }
   }
-  .order-tabs {
-    margin-top: 12px;
-    margin-bottom: 4px;
-    display: flex;
-    justify-content: space-around;
-    .order-tab-item {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      flex: 1;
-      height: 80px;
+}
+.mine-header--black {
+  .account-info {
+    .type-name {
+      background: linear-gradient(90deg, #171826 0%, #444444 100%);
+      color: #FAE7CA;
     }
     }
-    .tab-item-text {
-      margin-top: 8px;
-      font-size: 13px;
-      line-height: 18px;
-      color: #33373c;
+    .active-type {
+      .type-name{
+        background: #FAE7CA;
+        color: #1B1A2A;
+      }
     }
     }
   }
   }
 }
 }
+::v-deep {
+  .order-tabs {
+    position: absolute;
+    width:100%;
+    left:0;
+    bottom:-1px;
+    border-top-right-radius: 16px;
+    box-shadow: 0 -8px 12px 0 rgba(92, 31, 5, 0.15);
+    background: linear-gradient(180deg, #fff 0%, #F5F6F7 100%);
+  }
+}
 </style>
 </style>

+ 10 - 7
apps/mobile/src/components/mine/MineList.vue

@@ -2,7 +2,7 @@
   <div class="mine-list-component">
   <div class="mine-list-component">
     <!--    账号数据合并-->
     <!--    账号数据合并-->
     <van-cell-group
     <van-cell-group
-      class="merge-cell cell-group mt16"
+      class="merge-cell cell-group mt12"
       :border="false"
       :border="false"
       v-if="mergeInfo.show"
       v-if="mergeInfo.show"
     >
     >
@@ -15,7 +15,7 @@
     <van-cell-group
     <van-cell-group
       v-for="(mItem, mIndex) in menuList"
       v-for="(mItem, mIndex) in menuList"
       :key="'group—' + mIndex"
       :key="'group—' + mIndex"
-      class="cell-group mt16"
+      class="cell-group mt12"
       :border="false"
       :border="false"
     >
     >
       <van-cell
       <van-cell
@@ -164,13 +164,13 @@ export default {
 .mine-list-component {
 .mine-list-component {
   .cell-group {
   .cell-group {
     .left-icon {
     .left-icon {
-      margin-right: 16px;
+      margin-right: 8px;
     }
     }
     .icon-partner,
     .icon-partner,
     .icon-customer {
     .icon-customer {
       display: inline-block;
       display: inline-block;
-      width: 20px;
-      height: 20px;
+      width: 24px;
+      height: 24px;
       background: url(@/assets/image/mine/icon-partner.png) no-repeat center;
       background: url(@/assets/image/mine/icon-partner.png) no-repeat center;
       background-size: contain;
       background-size: contain;
     }
     }
@@ -271,9 +271,12 @@ export default {
     position: relative;
     position: relative;
     display: flex;
     display: flex;
     align-items: center;
     align-items: center;
+    .left-icon{
+      font-size:22px !important;
+    }
   }
   }
 }
 }
-.mt16 {
-  margin-top: 16px;
+.mt12 {
+  margin-top: 12px;
 }
 }
 </style>
 </style>

+ 62 - 0
apps/mobile/src/components/mine/OrderTabs.vue

@@ -0,0 +1,62 @@
+<template>
+  <div class="order-tabs">
+    <div class="order-tab-item clickable" @click="jumpOrderPage(1)">
+      <AppIcon name="dingdan_daifukuan" size="36" color="33373B" />
+      <div class="tab-item-text">待付款</div>
+    </div>
+    <div class="order-tab-item clickable" @click="jumpOrderPage(2)">
+      <AppIcon name="dingdan_yiwancheng" size="36" color="33373B" />
+      <div class="tab-item-text">已完成</div>
+    </div>
+    <div class="order-tab-item clickable" @click="jumpOrderPage(3)">
+      <AppIcon name="dingdan_yiquxiao" size="36" color="33373B" />
+      <div class="tab-item-text">已取消</div>
+    </div>
+    <div class="order-tab-item clickable" @click="jumpOrderPage(0)">
+      <AppIcon name="dingdan_quanbudingdan" size="36" color="33373B" />
+      <div class="tab-item-text">全部订单</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { AppIcon } from '@/ui'
+import { openAppOrWxPage } from '@/utils'
+import { LINKS } from '@/data'
+export default {
+  components: {
+    [AppIcon.name]: AppIcon
+  },
+  methods: {
+    // 跳转到订单页
+    jumpOrderPage(type) {
+      openAppOrWxPage(LINKS.我的订单页面, {
+        query: { active: type }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.order-tabs {
+  background: #fff;
+  width:100%;
+  display: flex;
+  justify-content: space-around;
+  .order-tab-item {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    flex: 1;
+    height: 80px;
+  }
+  .tab-item-text {
+    margin-top: 8px;
+    font-size: 13px;
+    line-height: 18px;
+    color: #33373c;
+  }
+}
+</style>

+ 33 - 33
apps/mobile/src/components/mine/SignIn.vue

@@ -1,8 +1,12 @@
 <template>
 <template>
   <div class="mine-sign-in">
   <div class="mine-sign-in">
     <div class="continuous">
     <div class="continuous">
-      <div class="days">
-        已连续签到 <em>{{ signInfo.days }} </em> 天
+      <div class="days-row">
+        <div class="days"> 已连续签到 <em>{{ signInfo.days }} </em> 天</div>
+        <div class="points-record" @click="viewMoreRecord" v-if="showMoreRecord">
+          <span>查看记录</span>
+          <AppIcon name="youbian" size="14" color="#C26F33" />
+        </div>
       </div>
       </div>
       <span
       <span
         class="btn"
         class="btn"
@@ -30,10 +34,10 @@
         ></div>
         ></div>
       </div>
       </div>
     </div>
     </div>
-    <div class="points-record" @click="viewMoreRecord" v-if="showMoreRecord">
-      <span>查看记录</span>
-      <AppIcon name="youbian" size="14" color="#C0C4CC" />
-    </div>
+<!--    <div class="points-record" @click="viewMoreRecord" v-if="showMoreRecord">-->
+<!--      <span>查看记录</span>-->
+<!--      <AppIcon name="youbian" size="14" color="#C0C4CC" />-->
+<!--    </div>-->
     <van-dialog
     <van-dialog
       class="sign-success-dialog"
       class="sign-success-dialog"
       v-model:show="visibleDialog"
       v-model:show="visibleDialog"
@@ -186,55 +190,59 @@ export default {
 .mine-sign-in {
 .mine-sign-in {
   background: #fff;
   background: #fff;
   position: relative;
   position: relative;
-  //margin: 12px 16px 0;
   margin-top: 12px;
   margin-top: 12px;
-  padding: 16px;
-  border-radius: 8px;
+  padding: 12px;
+  border-radius: 12px;
   background: url(@/assets/image/mine/dateGetBg@2x.png) no-repeat center center;
   background: url(@/assets/image/mine/dateGetBg@2x.png) no-repeat center center;
   background-size: cover;
   background-size: cover;
   box-shadow: 0px 2px 8px 0px rgb(54 147 179 / 5%);
   box-shadow: 0px 2px 8px 0px rgb(54 147 179 / 5%);
   z-index: 3;
   z-index: 3;
+  border: 1px solid #F1D090;
 }
 }
 .continuous {
 .continuous {
   display: flex;
   display: flex;
   justify-content: space-between;
   justify-content: space-between;
   align-items: center;
   align-items: center;
+  .days-row{
+    display: flex;
+    align-items: center;
+  }
   .days {
   .days {
     font-size: 12px;
     font-size: 12px;
-    color: #5f5e64;
+    line-height:16px;
+    color: #171826;
+    padding-right:8px;
+    border-right: 1px solid rgba(0, 0, 0, 0.1);
     em {
     em {
-      color: #ff7a00;
+      color: #C26F33;
       font-weight: 600;
       font-weight: 600;
       font-size: 16px;
       font-size: 16px;
     }
     }
   }
   }
+  .points-record {
+    padding-left: 8px;
+    font-size: 12px;
+    line-height:16px;
+  }
   .btn {
   .btn {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 24px;
-    padding: 0;
+    padding: 1px 6px;
     border-radius: 4px;
     border-radius: 4px;
     font-size: 12px;
     font-size: 12px;
-    box-sizing: border-box;
+    line-height:18px;
   }
   }
   .sign-btn {
   .sign-btn {
-    min-width: 60px;
-    background: #33323a;
-    color: #f1d090;
+    background: #33323A;
+    color: #F1D090;
   }
   }
   .normal-btn {
   .normal-btn {
-    width: 48px;
-    border: 1px solid #d69e55;
-    color: #d69e55;
-    box-sizing: border-box;
+    color: #C26F33;
   }
   }
 }
 }
 .sign-data {
 .sign-data {
   display: flex;
   display: flex;
   justify-content: space-between;
   justify-content: space-between;
   align-items: center;
   align-items: center;
-  padding-top: 16px;
+  padding-top: 12px;
   .sign-list {
   .sign-list {
     position: relative;
     position: relative;
     display: flex;
     display: flex;
@@ -293,14 +301,6 @@ export default {
     }
     }
   }
   }
 }
 }
-.points-record {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  font-size: 12px;
-  color: #5f5e64;
-  margin-top: 16px;
-}
 @keyframes turn {
 @keyframes turn {
   0% {
   0% {
     -webkit-transform: rotate(0deg);
     -webkit-transform: rotate(0deg);

+ 11 - 5
apps/mobile/src/views/tabbar/Mine.vue

@@ -2,7 +2,7 @@
   <div class="mine-page j-container">
   <div class="mine-page j-container">
     <!--头部信息-->
     <!--头部信息-->
     <mine-header />
     <mine-header />
-    <div class="mine-page-list plr16">
+    <div class="mine-page-list plr8">
       <!--签到-->
       <!--签到-->
       <sign-in :show-more-record="true" />
       <sign-in :show-more-record="true" />
       <!--菜单列表-->
       <!--菜单列表-->
@@ -53,11 +53,17 @@ export default {
 </script>
 </script>
 
 
 <style lang="scss" scoped>
 <style lang="scss" scoped>
+.mine-page {
+  background: #F5F6F7;
+}
 .mine-page-list {
 .mine-page-list {
-  padding-bottom: 16px;
+  padding-bottom: 12px;
+}
+.plr8 {
+  padding-left: 8px;
+  padding-right: 8px;
 }
 }
-.plr16 {
-  padding-left: 16px;
-  padding-right: 16px;
+.mine-sign-in{
+  margin-top: 0;
 }
 }
 </style>
 </style>