feat: 完善会员兑换码列表

apps/jy-pc/src/api/modules/public.js

@@ -43,6 +43,33 @@ export function getActivityRecords() {
   })
 }
 
+
+// 获取三方活动会员兑换信息列表2
+export function ajaxGetNewActivityEquityList() {
+  return request({
+    url: '/publicapply/activity/drawRecords',
+    method: 'post',
+    headers: {
+      activeId: 'Qg=='
+    }
+  })
+}
+
+// 获取三方活动会员可用的兑换列表
+export function ajaxGetNewActivityEquityProductList({ pid, id }) {
+  return request({
+    url: '/publicapply/activity/redeem',
+    method: 'post',
+    headers: {
+      activeId: 'Qg=='
+    },
+    data: qs.stringify({
+      prize_id: pid,
+      account_id: id
+    })
+  })
+}
+
 // 获取可兑换权益列表
 export function getActivityParties(data) {
   return request({

apps/jy-pc/src/views/equity/Exchange.vue

@@ -6,40 +6,40 @@
         <el-tab-pane label="兑换剑鱼会员" name="1">
           <div class="tab-pane-content">
             <div class="exchange-handle">
-              <div class="ex-tips" v-if="jianyuExchange.showTips">
+              <div v-if="jianyuExchange.showTips" class="ex-tips">
                 <i class="j-icon icon-orange-phone"></i>
                 <span
-                  >兑换权益与当前用户权益不对等，无法兑换。请直接联系吕经理：<a
-                    class="tel"
-                    href="tel:15136295365"
-                    >151 3629 5365</a
-                  >。</span
+                >兑换权益与当前用户权益不对等，无法兑换。请直接联系吕经理：<a
+                  class="tel"
+                  href="tel:15136295365"
+                >151 3629 5365</a
+                >。</span
                 >
               </div>
               <div class="ex-input">
                 <span class="ex-input-label">兑换码</span>
                 <el-input
-                  :class="{ 'error-input': jianyuExchange.showTips }"
                   v-model="jianyuExchange.code"
-                  placeholder="请输入兑换码"
+                  :class="{ 'error-input': jianyuExchange.showTips }"
                   clearable
+                  placeholder="请输入兑换码"
                   @input="onJyExchangeInput"
                 ></el-input>
                 <span
-                  class="status-text error-status"
                   v-show="jianyuExchange.errorStatus"
-                  ><i class="j-icon icon-error-status"></i
-                  >{{ jianyuExchange.errorMsg }}</span
+                  class="status-text error-status"
+                ><i class="j-icon icon-error-status"></i
+                >{{ jianyuExchange.errorMsg }}</span
                 >
                 <span
-                  class="status-text success-status"
                   v-show="jianyuExchange.successStatus"
-                  ><i class="j-icon icon-success-status"></i>恭喜兑换成功</span
+                  class="status-text success-status"
+                ><i class="j-icon icon-success-status"></i>恭喜兑换成功</span
                 >
               </div>
               <el-button class="ex-btn" type="primary" @click="onJyExchange"
-                >立即兑换</el-button
-              >
+              >立即兑换
+              </el-button>
               <div class="ex-desc">
                 <p>说明</p>
                 <p>1.输入兑换码即可兑换；</p>
@@ -51,8 +51,8 @@
             <div class="exchange-list">
               <div class="list-title">我的兑换记录</div>
               <div
-                class="list-table"
                 v-if="jianyuExchange.list && jianyuExchange.list.length > 0"
+                class="list-table"
               >
                 <div class="t-thead">
                   <span>兑换码</span>
@@ -61,9 +61,9 @@
                 </div>
                 <div class="t-body">
                   <p
-                    class="t-list"
                     v-for="item in jianyuExchange.list"
                     :key="item.EquityCode"
+                    class="t-list"
                   >
                     <span>{{ item.EquityCode }}</span>
                     <span>{{ item.EquityName }}</span>
@@ -78,52 +78,73 @@
           </div>
         </el-tab-pane>
         <el-tab-pane label="获取三方会员兑换码" name="2">
+          <div class='other-equity-exchange-select-group flex-(row items-center)'>
+            <div class='other-equity-exchange-select-item' :class='{"is-active": activeType === 0 }' @click='doSelectType(0)'>购买产品获取</div>
+            <div class='other-equity-exchange-select-item' :class='{"is-active": activeType === 1 }' @click='doSelectType(1)'>抽奖活动获取</div>
+          </div>
           <div class="tab-pane-content">
             <div class="waiting-exchange-container e-card-container">
               <div class="e-card-header">
-                <div class="e-card-title">待获取兑换码订单列表</div>
+                <div class="e-card-title" v-if='activeType === 0'>待获取兑换码订单列表</div>
+                <div class="e-card-title" v-else>待获取兑换码列表</div>
                 <div class="e-card-actions">
                   <el-link
+                    v-if='activeType === 0'
+                    :underline="false"
                     class="third-activity-rule"
                     type="info"
-                    :underline="false"
                     @click="goThirdActivityRule"
-                    >活动规则</el-link
-                  >
+                  >活动规则
+                  </el-link>
                 </div>
               </div>
               <div
-                class="e-card-content"
                 v-loading="thirdPartyExchange.loading"
+                class="e-card-content"
               >
                 <div
-                  class="list-table third-pending-table"
                   v-if="
                     thirdPartyExchange.pending &&
                     thirdPartyExchange.pending.length > 0 &&
                     thirdPartyExchange.loaded
                   "
+                  class="list-table third-pending-table"
                 >
-                  <div class="t-thead">
+                  <div class="t-thead" v-if='activeType === 0'>
                     <span>购买产品</span>
                     <span>购买时间</span>
                     <span>获取兑换码</span>
                   </div>
+                  <div class="t-thead" v-else>
+                    <span>会员名称</span>
+                    <span>获奖时间</span>
+                    <span>获取兑换码</span>
+                  </div>
                   <div class="t-body">
                     <p
-                      class="t-list"
                       v-for="item in thirdPartyExchange.pending"
                       :key="item.account_id"
+                      class="t-list"
                     >
-                      <span>{{ item.name }}</span>
+                      <span v-if='activeType === 0'>{{ item.name }}</span>
+                      <span v-else>{{ item.party_name }}</span>
                       <span>{{ item.create_date }}</span>
                       <span>
                         <el-link
+                          v-if='activeType === 0'
+                          :underline="false"
                           class="get-code-now"
                           type="primary"
-                          :underline="false"
                           @click="getThirdCodeNow(item)"
-                          >立即获取</el-link
+                        >立即获取</el-link
+                        >
+                        <el-link
+                          v-else
+                          :underline="false"
+                          class="get-code-now"
+                          type="primary"
+                          @click="getNewOtherProductInfo(item)"
+                        >立即获取</el-link
                         >
                       </span>
                     </p>
@@ -139,54 +160,55 @@
                 <div class="list-title">我的兑换记录</div>
                 <div class="exchange-list-actions">
                   <el-button
-                    type="primary"
+                    v-if="thirdPartyExchange.address"
+                    class="to-exchange-button"
                     plain
                     size="small"
-                    class="to-exchange-button"
-                    v-if="thirdPartyExchange.address"
+                    type="primary"
                     @click="thirdExchangeNow"
-                    >去兑换</el-button
-                  >
+                  >去兑换
+                  </el-button>
                 </div>
               </div>
               <div
-                class="list-table third-processed-table"
-                v-loading="thirdPartyExchange.loading"
                 v-if="
                   thirdPartyExchange.processed &&
                   thirdPartyExchange.processed.length > 0 &&
                   thirdPartyExchange.loaded
                 "
+                v-loading="thirdPartyExchange.loading"
+                class="list-table third-processed-table"
               >
                 <div class="t-thead">
-                  <span>购买产品</span>
-                  <span>购买时间</span>
+                  <span>{{ activeType === 0 ? '购买产品' : '会员名称'}}</span>
+                  <span>{{ activeType === 0 ? '购买时间' : '获奖时间'}}</span>
                   <span>获取状态</span>
                   <span>获取权益</span>
                   <span>获取时间</span>
                 </div>
                 <div class="t-body">
-                  <p
-                    class="t-list"
+                  <div
                     v-for="item in thirdPartyExchange.processed"
                     :key="item.ex_code"
+                    class="t-list"
                   >
-                    <span>{{ item.name }}</span>
+                    <span>{{ activeType === 0 ? item.name : item.party_name}}</span>
                     <span>{{ item.create_date }}</span>
                     <span>{{
-                      item.state === -1 ? '超期未获取' : '已获取'
-                    }}</span>
-                    <span>
-                      <template v-if="item.party_name || item.ex_code">
-                        <p>会员名称：{{ item.party_name || '-' }}</p>
-                        <p>兑换码：{{ item.ex_code || '-' }}</p>
-                      </template>
-                      <template v-else>
-                        <p>-</p>
-                      </template>
+                        item.state === -1 ? '超期未获取' : '已获取'
+                      }}</span>
+                    <span v-if='activeType === 0 && (item.party_name || item.ex_code)'>
+                      <p>会员名称：{{ item.party_name || '-' }}</p>
+                      <p>兑换码：{{ item.ex_code || '-' }}</p>
+                    </span>
+                    <span v-else-if='activeType === 1 && (item.ex_code)'>
+                      <p>兑换码：{{ item.ex_code || '-' }}</p>
+                    </span>
+                    <span v-else>
+                      <p>-</p>
                     </span>
                     <span>{{ item.ex_date || '-' }}</span>
-                  </p>
+                  </div>
                 </div>
               </div>
               <Empty v-else>
@@ -198,27 +220,27 @@
       </el-tabs>
     </div>
     <CustomDialog
-      title="三方会员列表"
-      class="exchange-dialog"
-      top="30vh"
+      :disabled="thirdExchangePartyConfirmDisabled"
       :showDialog.sync="thirdPartyExchange.inventoryListDialog"
-      confirmBtnText="立即获取兑换码"
-      closePressEsc
+      class="exchange-dialog"
       closeClickModal
-      :disabled="thirdExchangePartyConfirmDisabled"
+      closePressEsc
+      confirmBtnText="立即获取兑换码"
+      title="三方会员列表"
+      top="30vh"
       @onConfirm="onExchangeThirdDialogConfirm"
     >
       <div slot="content" class="third-power-content">
         <div class="third-power-select-list">
           <div
-            class="third-power-select-item"
             v-for="item in thirdPartyExchange.thirdPowerList"
             :key="item.prize_id"
-            @click="clickThirdExchangePowerList(item)"
             :class="{
               active: thirdPartyExchange.thirdPowerCheck === item.prize_id,
               disabled: item.state === 0
             }"
+            class="third-power-select-item"
+            @click="clickThirdExchangePowerList(item)"
           >
             <span class="t-p-s-item-label">{{ item.name }}</span>
             <span class="t-p-s-item-check">
@@ -227,17 +249,17 @@
           </div>
         </div>
       </div>
-      <div slot="footer" class="third-no-stock-tip" v-if="showThirdNotStockTip">
+      <div v-if="showThirdNotStockTip" slot="footer" class="third-no-stock-tip">
         {{ thirdPartyExchange.errorTip.text }}
       </div>
     </CustomDialog>
     <CustomDialog
-      title="获取成功"
-      top="30vh"
-      class="exchange-dialog"
-      :showDialog.sync="thirdPartyExchange.successAlert"
       :showCancelBtn="false"
+      :showDialog.sync="thirdPartyExchange.successAlert"
+      class="exchange-dialog"
       confirmBtnText="我知道了"
+      title="获取成功"
+      top="30vh"
       @onConfirm="thirdPartyExchange.successAlert = false"
     >
       <div slot="content" class="third-exchange-success-list">
@@ -258,11 +280,14 @@ import { Input, Tabs, TabPane, Button, Link } from 'element-ui'
 import { equityExchange, equityList } from '@/api/modules/pay'
 import {
   getActivityRecords,
+  ajaxGetNewActivityEquityList,
+  ajaxGetNewActivityEquityProductList,
   getActivityParties,
   getActivityRedeem
 } from '@/api/modules/public'
 import Empty from '@/components/empty/Empty.vue'
 import CustomDialog from '@/components/dialog/Dialog.vue'
+
 export default {
   name: 'equityExchangeComponent',
   components: {
@@ -277,6 +302,7 @@ export default {
   data() {
     return {
       activeName: '1',
+      activeType: 0,
       jianyuExchange: {
         code: '',
         list: [],
@@ -350,11 +376,18 @@ export default {
     this.getThirdExchangeList()
   },
   methods: {
+    doSelectType (type) {
+      this.activeType = type
+      this.getThirdExchangeList()
+    },
     getQuery() {
-      const { tab } = this.$route.query
+      const { tab, select } = this.$route.query
       if (tab) {
         this.activeName = tab
       }
+      if (select?.length) {
+        this.activeType = Number(select) || 0
+      }
     },
     async getJyExchangeList() {
       const { data } = await equityList()
@@ -402,7 +435,8 @@ export default {
     async getThirdExchangeList() {
       this.thirdPartyExchange.loading = true
       try {
-        const r = await getActivityRecords()
+        const ajaxFn = this.activeType === 0 ? getActivityRecords : ajaxGetNewActivityEquityList
+        const r = await ajaxFn()
         const { error_code: code, data } = r
         if (code === 0 && data) {
           this.thirdPartyExchange.pending = data.pending || []
@@ -442,6 +476,34 @@ export default {
         this.$toast('获取兑换列表失败')
       }
     },
+    async getNewOtherProductInfo (row) {
+      this.thirdPartyExchange.getCodeNow = row
+      const payload = {
+        pid: row.prize_id,
+        id: row.account_id
+      }
+      this.thirdPartyExchange.thirdPowerCheck = ''
+      try {
+        const r = await ajaxGetNewActivityEquityProductList(payload)
+        const { error_code: code, data } = r
+        if (code === 0 && Array.isArray(data)) {
+          this.thirdPartyExchange.thirdPowerList = data || []
+          // 默认选中赋值
+          if (data.length > 0) {
+            // do something
+          } else {
+            this.thirdPartyExchange.thirdPowerList = []
+            this.$toast('暂未获取到兑换列表')
+          }
+        } else {
+          this.thirdPartyExchange.thirdPowerList = []
+          this.$toast(r?.error_msg || '暂未获取到兑换列表')
+        }
+      } catch (error) {
+        console.log(error)
+        this.$toast( '获取兑换列表失败')
+      }
+    },
     getThirdCodeNow(row) {
       this.thirdPartyExchange.getCodeNow = row
       this.showInventoryListDialog(true)
@@ -517,16 +579,39 @@ export default {
     border-radius: 8px 8px 0 0;
     margin: 0;
   }
+
   .el-tabs__item {
     height: 50px;
     font-size: 16px;
     line-height: 50px;
   }
+
   .el-tabs__nav-wrap {
     padding-left: 40px;
   }
 }
 
+.other-equity-exchange-select-group {
+  padding: 10px 40px;
+  background-color: #fff;
+  border-bottom: 1px solid #ECECEC;
+  .other-equity-exchange-select-item {
+    display: inline-block;
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    font-size: 13px;
+    line-height: 20px;
+    text-align: center;
+    color: rgba(95, 94, 100, 1);
+    padding: 4px 12px;
+    margin-right: 16px;
+    border-radius: 4px;
+    &.is-active {
+      background-color: #2ABED1;
+      color: #fff;
+    }
+  }
+}
+
 .exchange-dialog {
   ::v-deep {
     .jy-custom-dialog {
@@ -543,6 +628,7 @@ export default {
   display: flex;
   align-items: center;
 }
+
 .equity-exchange {
   %bg {
     border-radius: 8px;
@@ -554,27 +640,32 @@ export default {
     line-height: 24px;
     color: #1d1d1d;
   }
+
   %item {
     display: inline-block;
     padding: 0 16px;
     width: 33.33%;
   }
+
   .exchange-header {
     padding: 2px 0 26px;
     font-size: 24px;
     line-height: 36px;
     color: #1d1d1d;
   }
+
   .exchange-list-hd {
     display: flex;
     align-items: center;
     justify-content: space-between;
   }
+
   .exchange-handle {
     background: $white;
     border-radius: 0 0 8px 8px;
     padding: 16px 16px 32px;
   }
+
   .ex-tips {
     @extend %flex;
     justify-content: center;
@@ -584,19 +675,23 @@ export default {
     color: #f56500;
     font-size: 14px;
     line-height: 22px;
+
     .tel {
       color: $main;
       text-decoration: underline;
     }
+
     .icon-orange-phone {
       width: 20px;
       height: 20px;
       margin-right: 8px;
     }
   }
+
   .ex-input {
     @extend %flex;
     padding: 16px 0;
+
     .ex-input-label {
       padding: 0 22px 0 24px;
       flex-shrink: 0;
@@ -604,86 +699,106 @@ export default {
       line-height: 22px;
       color: #1d1d1d;
     }
+
     .status-text {
       @extend %flex;
       margin-left: 18px;
       flex-shrink: 0;
       font-size: 14px;
       line-height: 22px;
+
       i {
         margin-right: 8px;
       }
+
       &.error-status {
         color: #fe737a;
       }
+
       &.success-status {
         color: $main;
       }
     }
+
     ::v-deep {
       .el-input {
         width: 590px;
       }
+
       .error-input .el-input__inner:focus {
         border-color: #f56500 !important;
       }
     }
   }
+
   .ex-btn {
     margin: 16px 0 16px 88px;
     width: 180px;
     height: 46px;
     font-size: 16px;
   }
+
   .ex-desc {
     margin-left: 88px;
+
     p {
       color: #888888;
       font-size: 12px;
       line-height: 16px;
     }
   }
+
   .exchange-list {
     @extend %bg;
     margin-top: 24px;
     padding: 24px 40px;
   }
+
   .list-title {
     @extend %title;
     width: 100%;
   }
+
   .list-table {
     width: 100%;
     margin-top: 12px;
+
     .t-thead {
       height: 40px;
       line-height: 40px;
       background: #f7f9fc;
       border-radius: 4px;
+
       span {
         @extend %item;
         font-size: 14px;
         color: #686868;
       }
     }
+
     &.third-processed-table {
       span {
         &:nth-of-type(1) {
           width: 25%;
         }
+
         &:nth-of-type(2) {
           width: 15%;
         }
+
         &:nth-of-type(3) {
           width: 15%;
         }
+
         &:nth-of-type(4) {
           width: 30%;
         }
+
         &:nth-of-type(5) {
           width: 15%;
         }
       }
+
       .t-list {
         display: flex;
         align-items: center;
@@ -693,11 +808,13 @@ export default {
     .t-body {
       margin-top: 12px;
     }
+
     .t-list {
       padding: 12px 0;
       font-size: 16px;
       color: #1d1d1d;
       box-shadow: inset 0px -1px 0px rgba(0, 0, 0, 0.05);
+
       span {
         @extend %item;
         font-size: 16px;
@@ -717,26 +834,32 @@ export default {
   border-color: $color_main;
   background: transparent;
 }
+
 .e-card-container {
   padding: 16px 40px;
   background: #fff;
   border-radius: 8px;
+
   .e-card-header {
     @extend %flex;
     justify-content: space-between;
   }
+
   .e-card-title {
     font-size: 16px;
     line-height: 24px;
     color: #1d1d1d;
   }
+
   .e-card-content {
     margin-top: 12px;
   }
 }
+
 .third-activity-rule {
   color: #686868;
 }
+
 .waiting-exchange-container {
   border-radius: 0 0 8px 8px;
 }
@@ -753,9 +876,11 @@ export default {
     color: #1d1d1d;
     border: 1px solid rgba(224, 224, 224, 1);
     cursor: pointer;
+
     &:not(:last-of-type) {
       margin-bottom: 12px;
     }
+
     .el-icon-check {
       font-size: 20px;
       display: none;
@@ -764,10 +889,12 @@ export default {
     &.active {
       color: $color_main;
       border-color: $color_main;
+
       .el-icon-check {
         display: block;
       }
     }
+
     &.disabled {
       color: #999;
       background-color: #f5f6f7;
@@ -775,6 +902,7 @@ export default {
     }
   }
 }
+
 .third-no-stock-tip {
   color: #ff3a20;
   font-size: 14px;

apps/jy-pc/vite.config.js

@@ -107,6 +107,7 @@ export default defineConfig(({ mode }) => {
     css: {
       preprocessorOptions: {
         scss: {
+          silenceDeprecations: ['legacy-js-api', 'import'], // 静默所有相关警告
           additionalData: `
           @import "@/assets/style/_mixin.scss";
           @import "@/assets/style/_variables.scss";

apps/mobile/src/api/modules/equitycode.js

@@ -30,6 +30,31 @@ export function ajaxGetActivityEquityList() {
   })
 }
 
+// 获取三方活动会员兑换信息列表2
+export function ajaxGetNewActivityEquityList() {
+  return request({
+    url: '/publicapply/activity/drawRecords',
+    method: 'post',
+    headers: {
+      activeId: 'Qg=='
+    }
+  })
+}
+
+// 获取三方活动会员可用的兑换列表
+export function ajaxGetNewActivityEquityProductList({ pid, id }) {
+  return request({
+    url: '/publicapply/activity/redeem',
+    method: 'post',
+    headers: {
+      activeId: 'Qg=='
+    },
+    data: qs.stringify({
+      prize_id: pid,
+      account_id: id
+    })
+  })
+}
 // 获取三方活动会员可用的兑换列表
 export function ajaxGetActivityEquityProductList({ id }) {
   return request({

apps/mobile/src/views/equitycenter/index.vue

@@ -17,7 +17,7 @@
               <span class="tip-text">
                 兑换权益与当前用户权益不对等，无法兑换。请直接联系吕经理：
                 <a class="tel" @click="telHandle('15136295365')"
-                  >151 3629 5365</a
+                >151 3629 5365</a
                 >。
               </span>
             </div>
@@ -104,152 +104,244 @@
           </div>
         </div>
       </van-tab>
-      <van-tab name="other" title="第三方会员兑换码">
-        <div class="equity-exchange other-equity-exchange">
-          <div class="list">
-            <div class="title go-to-exchange">
-              <span>待获取兑换码订单列表</span>
-              <span
-                class="go-to-exchange--text highlight-text"
-                @click="goToRule"
-              >
+      <van-tab name="other" title="第三方会员兑换码" style='height: 100%'>
+        <div class='j-container'>
+          <div class='j-header'>
+            <div class='other-equity-exchange-select-group flex-(row items-center)'>
+              <div class='other-equity-exchange-select-item' :class='{"is-active": activeType === 0 }' @click='doSelectType(0)'>购买产品获取</div>
+              <div class='other-equity-exchange-select-item' :class='{"is-active": activeType === 1 }' @click='doSelectType(1)'>抽奖活动获取</div>
+            </div>
+          </div>
+          <div class='j-main'>
+            <div class="equity-exchange other-equity-exchange">
+              <div class="list">
+                <div class="title go-to-exchange">
+                  <span v-if='activeType === 0'>待获取兑换码订单列表</span>
+                  <span v-else>待获取兑换码列表</span>
+                  <span
+                    v-if='activeType === 0'
+                    class="go-to-exchange--text highlight-text"
+                    @click="goToRule"
+                  >
                 活动规则
               </span>
-            </div>
-            <div class="list-content">
-              <van-list
-                v-model="otherListState.loading"
-                :finished="otherListState.finished"
-              >
-                <div
-                  v-for="item in otherInfoList.pending"
-                  :key="item.product_id"
-                  class="records-item"
-                >
-                  <div class="records-line">
-                    <div class="records-line-left">购买产品：</div>
-                    <div class="records-line-right">
-                      {{ item.name }}
-                    </div>
-                  </div>
-                  <div class="records-line">
-                    <div class="records-line-left">购买时间：</div>
-                    <div class="records-line-right">
-                      {{ formatDate(item.create_date) }}
-                    </div>
-                  </div>
-                  <div class="records-line">
-                    <div class="records-line-left">获取状态：</div>
-                    <div class="records-line-right">
+                </div>
+                <div class="list-content">
+                  <van-list
+                    v-model="otherListState.loading"
+                    :finished="otherListState.finished"
+                  >
+                    <div
+                      v-for="item in otherInfoList.pending"
+                      :key="item.product_id"
+                      class="records-item"
+                    >
+                      <div v-if='activeType === 0' class="records-line">
+                        <div class="records-line-left">购买产品：</div>
+                        <div class="records-line-right">
+                          {{ item.name }}
+                        </div>
+                      </div>
+                      <div v-if='activeType === 0' class="records-line">
+                        <div class="records-line-left">购买时间：</div>
+                        <div class="records-line-right">
+                          {{ formatDate(item.create_date) }}
+                        </div>
+                      </div>
+                      <div v-if='activeType === 0' class="records-line">
+                        <div class="records-line-left">获取状态：</div>
+                        <div class="records-line-right">
                       <span
                         class="highlight-text"
                         @click="getOtherProductInfo(item)"
-                        >立即获取</span
+                      >立即获取</span
                       >
+                        </div>
+                      </div>
+
+                      <div v-if='activeType === 1' class="records-line">
+                        <div class="records-line-left">会员名称：</div>
+                        <div class="records-line-right">
+                          {{ item.party_name }}
+                        </div>
+                      </div>
+                      <div v-if='activeType === 1' class="records-line">
+                        <div class="records-line-left">获奖时间：</div>
+                        <div class="records-line-right">
+                          {{ formatDate(item.create_date) }}
+                        </div>
+                      </div>
+                      <div v-if='activeType === 1' class="records-line">
+                        <div class="records-line-left">获取兑换码：</div>
+                        <div class="records-line-right">
+                          <span
+                            class="highlight-text"
+                            @click="getNewOtherProductInfo(item)"
+                          >
+                            立即获取
+                          </span>
+                        </div>
+                      </div>
                     </div>
-                  </div>
-                </div>
-                <div
-                  v-if="
+                    <div
+                      v-if="
                     otherListState.finished && otherInfoList.pending.length == 0
                   "
-                  class="noData"
-                >
-                  <div class="noData-img">
-                    <img
-                      alt=""
-                      src="https://jybx3-webtest.jydev.jianyu360.com/page_jy_pc/img/jy-back.d7b768c2.png"
-                    />
-                  </div>
-                  暂无数据
+                      class="noData"
+                    >
+                      <div class="noData-img">
+                        <img
+                          alt=""
+                          src="https://jybx3-webtest.jydev.jianyu360.com/page_jy_pc/img/jy-back.d7b768c2.png"
+                        />
+                      </div>
+                      暂无数据
+                    </div>
+                  </van-list>
                 </div>
-              </van-list>
-            </div>
-          </div>
-          <div class="list">
-            <div class="title go-to-exchange">
-              <span>我的兑换记录</span>
-              <span
-                v-if="exChangeAddress"
-                class="go-to-exchange--text highlight-text"
-                @click="goToExChange"
-              >
+              </div>
+              <div class="list">
+                <div class="title go-to-exchange">
+                  <span>我的兑换记录</span>
+                  <span
+                    v-if="exChangeAddress"
+                    class="go-to-exchange--text highlight-text"
+                    @click="goToExChange"
+                  >
                 去兑换
               </span>
-            </div>
-            <div class="list-content">
-              <van-list
-                v-model="otherListState.loading"
-                :finished="otherListState.finished"
-              >
-                <div
-                  v-for="item in otherInfoList.processed"
-                  :key="item.product_id"
-                  class="records-item"
-                >
-                  <div class="records-line">
-                    <div class="records-line-left">购买产品：</div>
-                    <div class="records-line-right">
-                      {{ item.name }}
-                    </div>
-                  </div>
-                  <div class="records-line">
-                    <div class="records-line-left">购买时间：</div>
-                    <div class="records-line-right">
-                      {{ formatDate(item.create_date) }}
-                    </div>
-                  </div>
-                  <div class="records-line">
-                    <div class="records-line-left">获取状态：</div>
-                    <div class="records-line-right">
-                      <span v-if="item.state === 1">已获取</span>
-                      <span v-else>超期未获取</span>
-                    </div>
-                  </div>
-                  <div v-if="item.state === 1" class="records-line">
-                    <div class="records-line-left">获取权益：</div>
-                    <div
-                      class="records-line-right"
-                      style="word-break: break-all"
-                    >
-                      <div>
-                        <span>会员名称：</span>
-                        <span>{{ item.party_name }}</span>
-                      </div>
-                      <div>
-                        <span>兑换码：</span>
-                        <span @click="doCopyCode(item.ex_code)">{{
-                          item.ex_code
-                        }}</span>
+                </div>
+                <div class="list-content">
+                  <van-list
+                    v-model="otherListState.loading"
+                    :finished="otherListState.finished"
+                  >
+                    <div v-if='activeType ===0'>
+                      <div
+                        v-for="item in otherInfoList.processed"
+                        :key="item.product_id"
+                        class="records-item"
+                      >
+                        <div class="records-line">
+                          <div class="records-line-left">购买产品：</div>
+                          <div class="records-line-right">
+                            {{ item.name }}
+                          </div>
+                        </div>
+                        <div class="records-line">
+                          <div class="records-line-left">购买时间：</div>
+                          <div class="records-line-right">
+                            {{ formatDate(item.create_date) }}
+                          </div>
+                        </div>
+                        <div class="records-line">
+                          <div class="records-line-left">获取状态：</div>
+                          <div class="records-line-right">
+                            <span v-if="item.state === 1">已获取</span>
+                            <span v-else>超期未获取</span>
+                          </div>
+                        </div>
+                        <div v-if="item.state === 1" class="records-line">
+                          <div class="records-line-left">获取权益：</div>
+                          <div
+                            class="records-line-right"
+                            style="word-break: break-all"
+                          >
+                            <div>
+                              <span>会员名称：</span>
+                              <span>{{ item.party_name }}</span>
+                            </div>
+                            <div>
+                              <span>兑换码：</span>
+                              <span @click="doCopyCode(item.ex_code)">{{
+                                  item.ex_code
+                                }}</span>
+                            </div>
+                          </div>
+                        </div>
+                        <div class="records-line">
+                          <div class="records-line-left">获取时间：</div>
+                          <div class="records-line-right">
+                            {{ formatDate(item.ex_date) }}
+                          </div>
+                        </div>
                       </div>
                     </div>
-                  </div>
-                  <div class="records-line">
-                    <div class="records-line-left">获取时间：</div>
-                    <div class="records-line-right">
-                      {{ formatDate(item.ex_date) }}
+                    <div v-else>
+                      <div
+                        v-for="item in otherInfoList.processed"
+                        :key="item.product_id"
+                        class="records-item"
+                      >
+                        <div class="records-line">
+                          <div class="records-line-left">会员名称：</div>
+                          <div class="records-line-right">
+                            {{ item.party_name }}
+                          </div>
+                        </div>
+                        <div class="records-line">
+                          <div class="records-line-left">获奖时间：</div>
+                          <div class="records-line-right">
+                            {{ formatDate(item.create_date) }}
+                          </div>
+                        </div>
+                        <div class="records-line">
+                          <div class="records-line-left">获取状态：</div>
+                          <div class="records-line-right">
+                            <span v-if="item.state === 1">已获取</span>
+                            <span v-else>超期未获取</span>
+                          </div>
+                        </div>
+                        <div v-if="item.state === 1" class="records-line">
+                          <div class="records-line-left">获取权益：</div>
+                          <div
+                            class="records-line-right"
+                            style="word-break: break-all"
+                          >
+                            <div>
+                              <span>会员名称：</span>
+                              <span>{{ item.party_name }}</span>
+                            </div>
+                            <div>
+                              <span>兑换码：</span>
+                              <span @click="doCopyCode(item.ex_code)">{{
+                                  item.ex_code
+                                }}</span>
+                            </div>
+                          </div>
+                        </div>
+                        <div class="records-line">
+                          <div class="records-line-left">获取时间：</div>
+                          <div class="records-line-right">
+                            {{ formatDate(item.ex_date) }}
+                          </div>
+                        </div>
+                      </div>
                     </div>
-                  </div>
-                </div>
-                <div
-                  v-if="
+
+                    <div
+                      v-if="
                     otherListState.finished &&
                     otherInfoList.processed.length == 0
                   "
-                  class="noData"
-                >
-                  <div class="noData-img">
-                    <img
-                      alt=""
-                      src="https://jybx3-webtest.jydev.jianyu360.com/page_jy_pc/img/jy-back.d7b768c2.png"
-                    />
-                  </div>
-                  暂无兑换记录
+                      class="noData"
+                    >
+                      <div class="noData-img">
+                        <img
+                          alt=""
+                          src="https://jybx3-webtest.jydev.jianyu360.com/page_jy_pc/img/jy-back.d7b768c2.png"
+                        />
+                      </div>
+                      暂无兑换记录
+                    </div>
+                  </van-list>
                 </div>
-              </van-list>
+              </div>
             </div>
+
           </div>
         </div>
+
       </van-tab>
     </van-tabs>
     <van-dialog
@@ -329,6 +421,7 @@ import { callPhone, copyText, openLinkOfOther } from '@/utils'
 import {
   ajaxGetActivityEquityList,
   ajaxGetActivityEquityProductList,
+  ajaxGetNewActivityEquityList, ajaxGetNewActivityEquityProductList,
   ajaxSubmitActivityEquity,
   equityexchange,
   equitylist
@@ -384,7 +477,8 @@ export default {
         default: '三方会员库存不足，请联系客服',
         text: '',
         show: false
-      }
+      },
+      activeType: 0
     }
   },
   computed: {
@@ -399,11 +493,18 @@ export default {
     this.getQuery()
   },
   methods: {
+    doSelectType (type) {
+      this.activeType = type
+      this.getOtherInfo()
+    },
     getQuery() {
-      const { tab } = this.$route.query
+      const { tab, select } = this.$route.query
       if (tab) {
         this.activeName = tab
       }
+      if (select?.length) {
+        this.activeType = Number(select) || 0
+      }
     },
     telHandle(phone) {
       callPhone(phone)
@@ -521,7 +622,8 @@ export default {
     },
     getOtherInfo() {
       this.otherListState.loading = true
-      ajaxGetActivityEquityList()
+      const ajaxFn = this.activeType === 0 ? ajaxGetActivityEquityList : ajaxGetNewActivityEquityList
+      ajaxFn()
         .then((res) => {
           const data = res.data || {
             pending: [],
@@ -541,6 +643,32 @@ export default {
           this.otherListState.finished = true
         })
     },
+    getNewOtherProductInfo ({ prize_id, account_id, product_id }) {
+      ajaxGetNewActivityEquityProductList({
+        pid: prize_id,
+        id: account_id
+      }).then((res) => {
+        const data = res.data || []
+        if (data.length) {
+          this.otherProductList = data.map((v) => {
+            return Object.assign(
+              {
+                id: v.prize_id,
+                aId: account_id,
+                pId: product_id
+              },
+              v
+            )
+          })
+          this.showOtherTipFn(true)
+        } else {
+          this.$toast(res?.error_msg || '获取失败')
+        }
+      })
+        .catch(() => {
+          this.$toast('获取失败')
+        })
+    },
     getOtherProductInfo({ product_id, account_id }) {
       ajaxGetActivityEquityProductList({
         id: product_id
@@ -686,7 +814,7 @@ export default {
     }
 
     .records-line-left {
-      width: 70px;
+      width: 80px;
       color: #5f5e64;
     }
 
@@ -703,6 +831,26 @@ export default {
   }
 }
 
+.other-equity-exchange-select-group {
+  padding: 11px 16px;
+  background-color: #fff;
+  .other-equity-exchange-select-item {
+    display: inline-block;
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    font-size: 13px;
+    line-height: 20px;
+    text-align: center;
+    color: rgba(95, 94, 100, 1);
+    padding: 4px 12px;
+    margin-right: 16px;
+    border-radius: 4px;
+    &.is-active {
+      background-color: #2ABED1;
+      color: #fff;
+    }
+  }
+}
+
 .other-equity-exchange {
   .noData {
     padding-bottom: 16px;