jufubao-base 1.0.395 → 1.0.397

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jufubao-base",
-  "version": "1.0.395",
+  "version": "1.0.397",
   "private": false,
   "description": "聚福宝业务组件基础插件包",
   "main": "index.js",

package/src/components/JfbBaseCardDetailEntry/Api.js

@@ -55,4 +55,13 @@ module.exports = [
     },
     disabled: true,
   },
+  {
+    mapFnName: 'getListEntryCardBind',
+    isRule: false,
+    title: '获得绑定卡',
+    prefix: 'list',
+    path: '/card/v1/card-bind/list-bind-card',
+    params: {},
+    disabled: true,
+  },
 ];

package/src/components/JfbBaseCardDetailEntry/Attr.js

@@ -37,6 +37,17 @@ export default {
         {label: "隐藏", value: "N"},
       ]
     },
+    {
+      label: "详情样式",
+      ele: "xd-radio",
+      valueKey: "styleType",
+      groupKey: "content",
+      value: '1',
+      list: [
+        {label: "样式一", value: '1'},
+        {label: "样式二", value: '2'},
+      ]
+    },
     {
       label: '票券解绑成功回跳地址:',
       ele: 'xd-select-pages-path',
@@ -85,5 +96,17 @@ export default {
       },
       inline: false,
     },
+    {
+      label: '绑定票券地址:',
+      ele: 'xd-select-pages-path',
+      valueKey: 'bindCardUrl',
+      groupKey:'advanced',
+      placeholder: '请选择绑定票券地址',
+      value: null,
+      setting: {
+        router: XdBus.getParentApi('getPagesTree'),
+      },
+      inline: false,
+    },
   ],
 };

package/src/components/JfbBaseCardDetailEntry/JfbBaseCardDetailEntry.vue

@@ -45,7 +45,7 @@
               ></xd-font-icon>
             </view>
           </view>
-          <view class="card_bottom"></view>
+          <view class="card_bottom" :style="[cardBottomStyle]"></view>
           <!-- <view class="refresh_wrap" @click="handleRefresh">
             <xd-font-icon
               icon="iconshuaxin"
@@ -54,8 +54,22 @@
             ></xd-font-icon> 刷新二维码</view> -->
         </view>
         <view class="card_info">
-          <view class="card_type">{{ info['card_type_name'] }}</view>
-          <view class="card_sec">券号：{{ info.card_number }}</view>
+          <template v-if="styleType === '1'">
+            <view class="card_type">{{ info['card_type_name'] }}</view>
+            <view class="card_sec">券号：{{ info.card_number }}</view>
+          </template>
+          <view v-else class="card_item" @click="toShowTicketDialog">
+            <view class="item_icon">
+              <xd-font-icon icon="iconkaquan" size="42" color="#FFCD5F"></xd-font-icon>
+            </view>
+            <view class="item_cont">
+              <view class="item_name">{{ info['card_type_name'] }}</view>
+              <view>{{ info.card_number }}</view>
+            </view>
+            <view class="item_down">
+              <xd-font-icon icon="iconxia_down" size="28"></xd-font-icon>
+            </view>
+          </view>
           <view class="card_sec">有效期：{{ info.end_time }}</view>
           <view class="card_sec">
             <text>{{isShowBuss==='Y'?info.main_business_code_name:''}}剩余：{{ info.card_point }}{{ info.unit }}</text>
@@ -115,6 +129,66 @@
         </view>
       </view>
     </view>
+    <xd-down-drawer :show.sync="showTicketDialog" height="50vh">
+      <view class="drawer_title">使用票券</view>
+      <view class="drawer_content">
+        <view class="tab_header">
+          <view class="tab_menu">
+            <view class="tab_item" :class="{active: show_type === 'normal'}" @click="switchCardType('normal')">我的票券</view>
+            <view class="tab_item" :class="{active: show_type === 'coupon'}" @click="switchCardType('coupon')">优惠券</view>
+          </view>
+          <view>
+            <xd-button width="210rpx" type="primary" size="small" @click="handleBindNewTicket">绑定票券</xd-button>
+          </view>
+        </view>
+        <view class="ticket_list">
+          <view
+            class="ticket_item"
+            v-for="ticket in ticketList"
+            :key="ticket.card_number"
+            @click="handleTicketSelect(ticket)"
+          >
+            <view class="_header">
+              <view class="flex align-center">
+                <xd-font-icon icon="iconkaquan" color="#ffc65d" size="32" style="margin-right: 8rpx;"></xd-font-icon>
+                <text>{{ticket.card_type_name}}</text>
+              </view>
+              <xd-radio
+                size="mini"
+                :isClickEvent="false"
+                :value="selectedTicket && selectedTicket.card_number === ticket.card_number"
+                :disabled="ticket.is_valid === 'N' || ticket.card_point == 0"
+              ></xd-radio>
+            </view>
+            <view class="_cont">
+              <view style="margin-right: 30rpx;">ID：{{ticket.show_card_number || ticket.card_number}}</view>
+              <view>有效期至：{{formatTime(ticket.end_time)}}</view>
+            </view>
+            <view class="_footer">
+              <view class="_item">
+                <text>剩余：</text>
+                <xd-unit
+                  :price="ticket.card_point"
+                  :isOld="false"
+                  :font-size="28"
+                  :icon-size="0.3"
+                  :unit="ticket.unit || ''"
+                ></xd-unit>
+              </view>
+            </view>
+            <view v-if="ticket.is_show_other_card_point === 'Y'" class="orther_pay">
+              购买其他物品可抵：{{ticket.other_card_point}} {{ticket.unit}}
+            </view>
+          </view>
+          <view class="ticket_empty" v-if="!ticketList || ticketList.length === 0">
+            <xd-no-data :scaleSize="2.5" height="100%"></xd-no-data>
+          </view>
+        </view>
+      </view>
+      <view class="drawer_footer">
+        <xd-button width="300rpx" type="primary" @click="handleTicket">确定</xd-button>
+      </view>
+    </xd-down-drawer>
   <xd-down-drawer
     :show.sync="showDialog"
     height="50vh"
@@ -177,6 +251,8 @@ import XdEditPwd from "./XdEditPwd";
 import XdUnit from "@/components/XdUnit/XdUnit";
 import XdButton from '@/components/XdButton/XdButton'
 import XdDownDrawer from "@/components/XdDownDrawer/XdDownDrawer"
+import XdRadio from "@/components/XdRadio/XdRadio"
+import XdNoData from "@/components/XdNoData/XdNoData";
 import {parsePath} from "@/utils/linkUrl";
 export default {
   name: "JfbBaseCardDetailEntry",
@@ -187,6 +263,8 @@ export default {
     XdUnit,
     XdButton,
     XdDownDrawer,
+    XdRadio,
+    XdNoData
   },
   mixins: [
     componentsMixins,extsMixins,JfbBaseCardDetailEntryMixin,colorCardMixins,
@@ -217,6 +295,7 @@ export default {
       qrcode: "",
       backUrl: "",
       shift_url: "",
+      showTicketDialog: false,
 
       //品牌logo
       //#ifdef H5
@@ -230,11 +309,18 @@ export default {
       headerBg: {},
       give_url: "",
       collect_phone_url: "",//收集手机号地址
+      bindCardUrl: "",
       showDialog:false,
       sign_url:'',
       share_code:'',
       sign_url_qrcode:'',
       toCollectPhoneUrl:'',
+      styleType: '1',
+      show_type: 'normal', //normal:已绑定卡券 coupon: 优惠券
+      ticketList: [], //票券列表
+      selectedTicket: null, //当前选中的票券对象
+      renderChecked: 'renderChecked', //刷新key
+      currentTab: 'my', //当前tab: my/my_coupon
     };
   },
   watch: {
@@ -249,6 +335,13 @@ export default {
     prod_bottom() {
       return this.fixedStyle({height: 0, zIndex: 111});
     },
+    cardBottomStyle(){
+      let style = {};
+      if(this.styleType === '2'){
+        style.borderRadius = '16rpx'
+      }
+      return style;
+    }
   },
   created() {
     // ifDef小程序拼接问题
@@ -273,7 +366,6 @@ export default {
           console.warn(options["x-params"]);
         }
       }
-
       this.card_number = options.card_number;
       this.dataInit();
     },
@@ -296,9 +388,15 @@ export default {
       this.shift_url = getContainerPropsValue(container,  "content.shift_url", { value: "" }).value;
       this.give_url = getContainerPropsValue(container,  "content.give_url", { value: "" }).value;
       this.collect_phone_url = getContainerPropsValue(container,  "content.collect_phone_url", { value: "" }).value;
+      this.bindCardUrl = getContainerPropsValue(container,  "content.bindCardUrl", { value: "" }).value;
       console.log(this.collect_phone_url,'collect_phone_url')
       //'wechat_mini_program|default'
       this.entryGroupId = getContainerPropsValue(container,"content.entryGroupId","default");
+      this.styleType = getContainerPropsValue(container,"content.styleType","1");
+    },
+    toShowTicketDialog(){
+      this.showTicketDialog = true;
+      this.fetchTicketList();
     },
     /**
      * @description 获取卡详情
@@ -608,6 +706,94 @@ export default {
         url: `${this.shift_url}?card_number=${this.info["card_number"]}`,
       });
     },
+    /**
+     * @description 获取票券列表（mock数据）
+     */
+    fetchTicketList() {
+
+      let params = {is_all: 'Y', is_show_entry_settings: 'N', show_type: this.show_type};
+
+      jfbRootExec('getListEntryCardBind', {
+        vm: this,
+        data: params,
+      }).then(res => {
+        this.ticketList = res.list.map((item) => {
+          return {
+            ...item,
+            other_card_point: this.$xdUniHelper.divisionFloatNumber(
+              item.other_card_point,
+              100
+            ),
+          };
+        });
+        this.selectedTicket = null;
+        // 重新打开时自动选中当前正在使用的票券
+        const curTicket = this.ticketList.find(item => item.card_number === this.card_number);
+        if (curTicket) {
+          this.selectedTicket = curTicket;
+        }
+      });
+    },
+    /**
+     * @description 选择/取消票券（单选）- 点相同取消，点其他切换
+     * @param ticket {object} 票券
+     */
+    handleTicketSelect(ticket) {
+      if (ticket.is_valid === 'N' || ticket.card_point == 0) return;
+      this.selectedTicket = this.selectedTicket && this.selectedTicket.card_number === ticket.card_number ? null : ticket;
+      this.renderChecked = Date.now();
+    },
+    switchCardType(type){
+      this.show_type = type;
+      this.fetchTicketList();
+    },
+    /**
+     * @description 使用新票券（绑定）
+     */
+    handleBindNewTicket() {
+      // TODO: 打开绑定新票券弹窗或跳转绑定页
+      // this.$xdAlert({ content: '请通过绑定功能添加票券' });
+      let inCallback = encodeURIComponent(this.toCollectPhoneUrl)
+      this.$xdUniHelper.navigateTo({
+        url: `${this.bindCardUrl}`,
+      });
+    },
+    /**
+     * @description 确定-提交所选票券
+     */
+    handleTicket() {
+      if (!this.selectedTicket) {
+        this.$xdAlert({ content: '请先选择票券' });
+        return;
+      }
+      // 切换卡券前清除旧定时器，避免定时器叠加
+      this.timeStr = '';
+      if (this.timeer) {
+        clearInterval(this.timeer);
+        this.timeer = null;
+      }
+      if (this.refrushTimeer) {
+        clearTimeout(this.refrushTimeer);
+        this.refrushTimeer = null;
+      }
+      this.card_number = this.selectedTicket.card_number;
+      this.dataInit();
+      this.showTicketDialog = false;
+    },
+    /**
+     * @description 格式化时间
+     * @param time {string|number}
+     */
+    formatTime(time) {
+      if (!time) return '';
+      let date = null;
+      if (time == +time) {
+        if ((time + '').length <= 10) date = new Date(+time * 1000);
+        else date = new Date(+time);
+        return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
+      }
+      return time;
+    },
     onJfbBack(options) {
       if (this.timeer) {
         clearTimeout(this.timeer);
@@ -684,14 +870,33 @@ export default {
       .card_info{
         color: #FFFFFF;
         font-size: 28rpx;
-        padding-left: 40rpx;
+        margin-top: 60rpx;
+        .card_item{
+          background-color: #FFFFFF;
+          border-radius: 16rpx;
+          color: #666666;
+          display: flex;
+          align-items: center;
+          padding: 16rpx 40rpx;
+          font-size: 24rpx;
+          .item_cont{
+            flex: 1;
+            padding-left: 20rpx;
+          }
+          .item_name{
+            color: #333333;
+            font-size: 28rpx;
+            margin-bottom: 10rpx;
+          }
+        }
         .card_type{
           font-size: 40rpx;
           font-weight: 600;
-          margin-top: 60rpx;
+          padding-left: 40rpx;
         }
         .card_sec{
           margin: 10rpx 0;
+          padding-left: 40rpx;
           &:last-child{
             margin-bottom: 0rpx;
           }
@@ -1121,6 +1326,135 @@ export default {
 
     }
   }
+  .drawer_title{
+    line-height: 100rpx;
+    text-align: center;
+    font-size: 32rpx;
+  }
+  .drawer_content{
+    padding: 20rpx;
+    .tab_header{
+      display: flex;
+    }
+    .tab_menu{
+      flex: 1;
+      display: flex;
+      .tab_item{
+        color: #333;
+        font-size: 32rpx;
+        height: 72rpx;
+        line-height: 72rpx;
+        margin: 0 20rpx;
+        &.active{
+          color: var(--g-theme-mainColor);
+          border-bottom: 4rpx solid var(--g-theme-mainColor);
+        }
+      }
+    }
+  }
+  .drawer_footer{
+    padding: 24rpx;
+    background: #fff;
+    border-top: 1px solid #EEEEEE;
+  }
+  .ticket_list{
+    margin-top: 20rpx;
+    height: 800rpx;
+    overflow: auto;
+    .flex{
+      display: flex;
+    }
+    .align_center{
+      display: flex;
+      align-items: center;
+    }
+    .ticket_item{
+      width: 100%;
+      border-radius: 10rpx;
+      background: rgba(255, 255, 255, 1);
+      box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
+      margin: 20rpx auto;
+      padding: 30rpx 0 20rpx;
+
+      ._header{
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 0rpx 30rpx;
+        font-size: 28rpx;
+        color: #333333;
+        font-weight: 500;
+        .login_card{
+          padding: 8rpx 20rpx;
+          border-radius: 8px;
+          font-size: 28rpx;
+        }
+      }
+      ._cont{
+        display: flex;
+        font-size: 28rpx;
+        padding: 24rpx 30rpx;
+        border-bottom: 1px solid rgba(242, 242, 242, 1);
+        color: #666666;
+        font-weight: 400;
+      }
+      ._footer{
+        display: flex;
+        justify-content: space-between;
+        padding: 24rpx 30rpx 12rpx;
+        font-size: 28rpx;
+        color: #333333;
+        ._item{
+          display: flex;
+          align-items: center;
+        }
+      }
+      .orther_pay{
+        display: inline-block;
+        background: #F5F5F5;
+        font-size: 24rpx;
+        font-weight: 400;
+        border-radius: 8rpx;
+        color: #999999;
+        padding: 8rpx 20rpx;
+        margin: 16rpx 0 0 30rpx;
+      }
+    }
+    .ticket_add_new{
+      width: 100%;
+      height: 88rpx;
+      border-radius: 10rpx;
+      background: rgba(255, 255, 255, 1);
+      box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
+      margin: 20rpx auto;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 28rpx;
+      color: #CCCCCC;
+      .plus_icon{
+        background-color: #CCCCCC;
+        color: #FFFFFF;
+        border-radius: 8rpx;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 24rpx;
+        width: 40rpx;
+        height: 40rpx;
+        margin-right: 24rpx;
+      }
+    }
+    .ticket_empty{
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      padding: 80rpx 0;
+      color: #CCCCCC;
+      font-size: 28rpx;
+    }
+  }
   .method_item{
     padding: unit(32, rpx) 0;
     margin: 0 unit(32, rpx);

package/src/components/JfbBaseCardInfoEntry/Attr.js

@@ -58,7 +58,7 @@ export default {
       ]
     },
     {
-      label: "配置套餐描述是否默认展开:",
+      label: "配置套餐描述是否默认展开",
       ele: "xd-radio",
       valueKey: "isExpandDesc",
       value: "Y",
@@ -79,6 +79,17 @@ export default {
         {label: "隐藏", value: "N"},
       ]
     },
+    {
+      label: "绑定后跳转路径",
+      ele: "xd-radio",
+      valueKey: "jumpType",
+      groupKey: "content",
+      value: "list",
+      list: [
+        { label: "卡列表", value: "list" },
+        { label: "卡详情", value: "info" },
+      ]
+    },
     {
       label: '票券绑定成功回跳票券列表地址:', 
       ele: 'xd-select-pages-path',

package/src/components/JfbBaseCardInfoEntry/JfbBaseCardInfoEntry.vue

@@ -262,6 +262,8 @@ export default {
       multiple_scene: '', // 多场景场景
       isExpandDesc: "Y", // 配置套餐描述是否默认展开
       isItemExpanded: null, // 当前展开的项目ID
+
+      jumpType: "list", // 绑定后跳转路径
     };
   },
   watch: {
@@ -366,8 +368,9 @@ export default {
       if(this.qrcode&&this.info.card_number){
         card_number = this.info.card_number;
       }
+      //res.jump_page==='detail'优先级最高
       let path = this.getUrlCallback(this.my_card_url || this.backUrl);
-      if(res.jump_page==='detail'){
+      if(this.jumpType === 'info' || res.jump_page==='detail'){
         path = this.getUrlCallback(this.back_detail_url)+`?card_number=${card_number}`;
       }
       if(this.hasCon){
@@ -422,6 +425,7 @@ export default {
       this.isExpandDesc = getContainerPropsValue(container, 'content.isExpandDesc', "Y");
       //'wechat_mini_program|default'
       this.entryGroupId = getContainerPropsValue(container,"content.entryGroupId","default");
+      this.jumpType = getContainerPropsValue(container, 'content.jumpType', "list");
     },
     onJfbLoad(options) {
       this.qrcode = options.qrcode || options.pa;

package/src/components/JfbBaseFooter/JfbBaseFooter.vue

@@ -276,10 +276,12 @@
             if (isShowTitle === 'Y') router['name'] = item.name ? item.name.slice(0, 5) : '';
             if (iconType === 'icon') {
               router['icon'] = item.icon;
+              if(item.size) router['size'] = item.size;
               router['image'] = '';
               router['actImage'] = '';
             }
             if (iconType === 'image') {
+              if(item.size) router['size'] = item.size;
               router['icon'] = '';
               router['image'] = image;
               router['actImage'] = actImage;