jufubao-base 1.0.176-beta1 → 1.0.177-beta1

package/src/components/JfbBaseCardEntry/JfbBaseCardEntry.vue

@@ -110,18 +110,31 @@
           }"
         >已绑定票券</view>
         <view
-          v-if="hasChangeStatus"
           @click="tabIndex = 2"
           :style="{
             color: tabIndex === 2 ? '#fff' : '#B8B7BE',
             background: tabIndex === 2 ? mainColor : '#fff',
           }"
-        >可转换票券</view>
+        >优惠券</view>
+      </view>
+      <view class="jfb-base-card-entry__body-sub-tab" v-if="tabIndex === 1">
+        <view :style="{
+          color: subTabIndex === 1 ? mainColor : '#fff',
+          background: subTabIndex === 1 ? noticeBackgroundColor : '#DDDDDD',
+        }" @click="subTabIndex=1" class="jfb-base-card-entry__body-sub-tab-item">可用票券</view>
+        <view :style="{
+          color: subTabIndex === 2 ? mainColor : '#fff',
+          background: subTabIndex === 2 ? noticeBackgroundColor : '#DDDDDD',
+        }" @click="subTabIndex=2" class="jfb-base-card-entry__body-sub-tab-item">可转票券</view>
+        <view :style="{
+          color: subTabIndex === 3 ? mainColor : '#fff',
+          background: subTabIndex === 3 ? noticeBackgroundColor : '#DDDDDD',
+        }" @click="subTabIndex=3" class="jfb-base-card-entry__body-sub-tab-item">赠送中</view>
       </view>
       <view
         class="jfb-base-card-entry__body-tips"
         :style="{ color: warningColor }"
-        v-if="tabIndex === 2"
+        v-if="subTabIndex === 2"
       >* 目前仅支持电影票兑换券进行转换</view>
       <view class="card-content">
         <view v-if="loadingCardList" class="jfb-base-card-entry__body-card skeleton-card">
@@ -154,7 +167,7 @@
 
         <template v-else>
           <view
-            v-if="tabIndex === 2 || tabIndex === 1 && (cardList && cardList.length > 0)"
+            v-if="tabIndex === 1 && (cardList && cardList.length > 0)"
             class="jfb-base-card-entry__body-card"
           >
             <view
@@ -169,7 +182,7 @@
               :style="{
                 background: item['theme']['color'],
                 backgroundSize: '100%',
-                height: item.height + 'px'
+                height: subTabIndex !== 3 ? item.height + 'px' : '300rpx'
               }"
             >
               <view class="card-list-warp" :style="{backgroundImage: 'url('+ item['theme']['image'] +')'}">
@@ -184,7 +197,7 @@
                     <text>券号：</text>
                     <text>{{item.card_number}}{{showIndex?(':' + index):''}}</text>
                   </view>
-                  <view @click.stop="toDetail(item)" v-if="isShowCode === 'Y'">
+                  <view @click.stop="toDetail(item)" v-if="subTabIndex !== 3&&isShowCode === 'Y'&&!force">
                     <view>
                       <xd-font-icon icon="iconerweima" width="56" height="56" size="50" color="#fff"></xd-font-icon>
                     </view>
@@ -202,15 +215,25 @@
                 <view class="card-list__other" v-if="item.other_card_point && item.card_point_type === 2">
                   <view><text>购买其他物品可抵：</text><text>{{item.other_card_point}} {{ item.unit }}</text></view>
                 </view>
-                <template v-if="tabIndex === 1">
-                  <view class="card-list__entry" v-if="item.entries.length === 1">
+                <template v-if="subTabIndex === 1">
+                  <view class="card-list__entry" v-if="item.is_login==='N'&&force">
+                    <view 
+                      @click.stop="handleBindLogin(item,item['entries'][0])"
+                      :style="{
+                        background: '#fff',
+                        color: item['theme']['color']}"
+                    >
+                      登录
+                    </view>
+                  </view>
+                  <view class="card-list__entry" v-if="item.entries.length === 1&&!force">
                     <view
                       @click.stop="handleBindLogin(item,item['entries'][0])"
                       :style="{color: item['theme']['color']}"
                     >进入{{item['entries'][0]['entry_name']}}</view>
                   </view>
-                  <view class="card-list__nodata" v-if="item.entries.length === 0">暂无支持服务列表</view>
-                  <view class="card-list__entrys" v-if="item.entries.length > 1" @click.stop>
+                  <view class="card-list__nodata" v-if="item.entries.length === 0&&!force">暂无支持服务列表</view>
+                  <view class="card-list__entrys" v-if="item.entries.length > 1&&!force" @click.stop>
                     <view class="card-list__entrys-title">
                       <view>可兑换权益</view>
                       <view @click.stop="toDetail(item, false)">
@@ -238,7 +261,7 @@
                     </view>
                   </view>
                 </template>
-                <view class="card-list__entry" v-else>
+                <view class="card-list__entry" v-else-if="subTabIndex===2">
                   <view
                     @click.stop="handleBindLogin(item,item['entries'][0])"
                     :style="{color: item['theme']['color']}"
@@ -258,6 +281,25 @@
               }"
             ></view>
           </view>
+          <view v-if="tabIndex===2&&(couponList&&couponList.length)">
+            <view v-if="couponList.length" class="coupon_list">
+            <xd-coupon-item v-for="(item, i) in couponList" :key="i"
+              style="margin-bottom:20rpx"
+              :couponRadius="couponRadius"
+              :couponImageUrl="couponImageUrl"
+              :couponTitleBgColor="couponTitleBgColor"
+              :couponUseBtnPadding="couponUseBtnPadding"
+              :couponBtnRadius="couponBtnRadius"
+              :couponBtnTextStyle="couponBtnTextStyle"
+              :couponLeftBgColor="couponLeftBgColor"
+              :item="item"
+              @useCoupon="handleBindLogin(item,item['entries'][0])"
+            ></xd-coupon-item>
+          </view>
+          <view v-else>
+            暂无数据
+          </view>
+          </view>
           <view v-else-if="cardList !== null && cardList.length === 0">
             <view class="jfb-base-card-entry__body-empty">
               <view class="jfb-base-card-entry__body-empty-wrap">
@@ -292,7 +334,6 @@
           ></xd-font-icon>
         </view>
       </view>
-
       <view class="computed-height" >
         <view
           v-for="(item,index) in cardComputedList"
@@ -329,7 +370,7 @@
             <view class="card-list__other" v-if="item.other_card_point && item.card_point_type === 2">
               <view><text>购买其他物品可抵：</text><text>{{item.other_card_point}} {{ item.unit }}</text></view>
             </view>
-            <template v-if="tabIndex === 1">
+            <template v-if="subTabIndex === 1">
               <view class="card-list__entry" v-if="item.entries.length === 1">
                 <view
                   @click.stop="handleBindLogin(item,item['entries'][0])"
@@ -345,7 +386,7 @@
                     <xd-font-icon icon="iconxiangyou_xian" color="#999" size="20"></xd-font-icon>
                   </view>
                 </view>
-                <view class="card-list__entrys-list">
+                <view v-if="!force" class="card-list__entrys-list">
                   <scroll-view scroll-x class="card-list__entrys-scroll">
                     <view class="card-list__entrys-item">
                       <view
@@ -392,6 +433,7 @@ import { mapState, mapActions } from "vuex";
 import { getContainerPropsValue, isWechat,isQrCode } from "@/utils/xd.base";
 import XdNoticeBar from "@/components/XdNoticeBar/XdNoticeBar";
 import { Base64 } from "js-base64";
+import XdCouponItem from "@/components/XdCouponItem/XdCouponItem";
 import getServiceUrl from "@/common/getServiceUrl";
 import {parsePath} from "@/utils/linkUrl";
 const Color = require("color");
@@ -402,7 +444,8 @@ export default {
     XdFontIcon,
     XdButton,
     XdNoticeBar,
-    XdCardV2
+    XdCardV2,
+    XdCouponItem
   },
   mixins: [componentsMixins, extsMixins, JfbBaseCardEntryMixin, colorCardMixins, cardListMixins],
   computed: {
@@ -429,6 +472,11 @@ export default {
       this.clearDefault();
       this.cardPageNum = 0;
       this.onJfbLoad(this.options);
+    },
+    subTabIndex() {
+      this.clearDefault();
+      this.cardPageNum = 0;
+      this.onJfbLoad(this.options);
     }
   },
   data() {
@@ -469,6 +517,43 @@ export default {
       //活动
       dialogEvent: false,
       popup: "https://img.zcool.cn/community/01784158abe781a801219c77e981ee.jpg?x-oss-process=image/auto-orient,1/resize,m_lfit,w_1280,limit_1/sharpen,100",
+      subTabIndex: 1,
+      force: false, //是否强制卡登录
+      give_url: '',
+      couponList: [],
+      isShowCoupon: 'N',
+      couponBtnRadius: 16,
+      couponLeftBgColor: "",
+      couponTitleBgColor: "",
+      couponBtnTextStyle: {}, //优惠券包登录按钮文字背景色设置
+      couponUseBtnPadding: {},
+      couponImageUrl: "",
+      testCouponList: [
+         {
+          card_number: '10001000001168',
+          card_point: 5000,
+          card_type: '0',
+          card_type_name: '满50减50',
+          unit: '点',
+          end_time: '2024-11-23',
+          is_valid: 'Y',
+          main_business_code_name: '',
+          other_card_point: 0,
+          is_exchange: 'N',
+          card_point_type: 1,
+          business_codes: [
+            'cake',
+            'movie',
+            'video',
+            'market',
+            'book'
+          ],
+          is_login: 'N',
+          consume_type: '2',
+          card_use_rule: '满50减1',
+          is_transfering: 'N'
+        },
+      ]
     };
   },
   created() {
@@ -502,11 +587,28 @@ export default {
       this.bindUrl = getContainerPropsValue(container,"content.bind_url",{value: ""}).value;
       this.detailUrl = getContainerPropsValue(container,"content.detail_url",{value: ""}).value;
       this.confirmUrl = getContainerPropsValue(container,"content.confirm_url",{value: ""}).value;
+      this.get_url = getContainerPropsValue(container,"content.get_url",{value: ""}).value;
       this.login_name = getContainerPropsValue(container, "content.login_name", "登录");
       this.isShowCode = getContainerPropsValue(container, "content.isShowCode", "Y");
+      this.isShowCoupon = getContainerPropsValue(container, "content.isShowCoupon", "N");
       this.bindCard = getContainerPropsValue(container,"content.bindCard","1");
       //'wechat_mini_program|default'
       this.entryGroupId = getContainerPropsValue(container,"content.entryGroupId","default");
+      this.couponBtnRadius = getContainerPropsValue(container, "content.couponBtnRadius", 16);
+      this.couponUseBtnPadding = getContainerPropsValue(container, "content.couponUseBtnPadding", {top: 20, left: 20, right: 20, bottom: 20});
+      this.couponBtnTextStyle = getContainerPropsValue(container, "content.couponBtnTextStyle", {
+        color: '#fff',
+        bgColor: '#ff5722',
+        fontSize: '30rpx',
+        fontWeight: 'normal'
+      });
+      this.couponTitleBgColor = getContainerPropsValue(container, "content.couponTitleBgColor", 'rgba(255, 87, 51, 0.1)');
+      this.couponRadius = getContainerPropsValue(container, "content.couponRadius", 16);
+      this.couponLeftBgColor = getContainerPropsValue(container, "content.couponLeftBgColor", "linear-gradient(180deg, #FFA852 0%, #FF5733 100%)");
+      this.couponImageUrl = getContainerPropsValue(container, "content.couponImageUrl", "");
+      if(this.isPreview) {
+        this.tabIndex = this.isShowCoupon==='Y'?2:1;
+      }
     },
 
     handleToLink(path) {
@@ -592,12 +694,19 @@ export default {
      */
     handleBindLogin(item , entry) {
       //卡券登录
-      if (this.tabIndex === 1) {
+      if (this.tabIndex === 1||this.tabIndex === 2) {
         if (item["is_valid"] !== "Y") {
           return;
         }
 
         this.$xdShowLoading({});
+        //转换卡跳转
+        if(this.subTabIndex===2){
+          this.$xdUniHelper.navigateTo({
+            url: `${this.changeUrl}?card_number=${item["card_number"]}`
+          }, false);
+          return
+        }
         jfbRootExec("loginEntryCardBind", {
           vm: this,
           data: { card_number: item["card_number"] },
@@ -624,13 +733,6 @@ export default {
             this.$xdHideLoading();
           });
       }
-
-      //转换卡跳转
-      else {
-        this.$xdUniHelper.navigateTo({
-          url: `${this.changeUrl}?card_number=${item["card_number"]}`
-        }, false);
-      }
     },
 
 
@@ -713,15 +815,22 @@ export default {
     },
 
     toDetail(item, out=true) {
-      this.$xdUniHelper.navigateTo({
-        url: `${this.detailUrl}?card_number=${item["card_number"]}`,
-      }, false);
+      if(this.subTabIndex===3) {
+        this.$xdUniHelper.navigateTo({
+          url: `${this.get_url}?card_number=${item["card_number"]}`,
+        }, false);
+      } else {
+        this.$xdUniHelper.navigateTo({
+          url: `${this.detailUrl}?card_number=${item["card_number"]}`,
+        }, false);
+      }
     },
 
     onJfbLoad(options) {
       if(options['x-test'] === 'jfb-console') this.showIndex = true;
       this.options = options;
       let { inCallback } = options;
+      this.force = inCallback?true:false;
       if(!inCallback) this.$storage.remove("inCallback"); //作为入口
       else {
         this.$storage.set("inCallback", inCallback);
@@ -738,12 +847,43 @@ export default {
       //登录成功调整地址优先级
       this.inCallback = inCallback || this.allEntryPath || this.settings.index;
       this.getContent();
+      if(this.tabIndex===1) {
+        this.getCardList(options);
+      } else {
+        this.getCouponList(options);
+      }
+    },
 
-      this.getCardList(options);
+    getCouponList(options) {
+      let params = {is_all: 'Y', is_show_entry_settings: 'Y', show_type: 'coupon'};
+      if(options['jfb_business_code']) {
+        params['card_business_code'] = options['jfb_business_code'];
+      }
+      if(this.entryGroupId) params['group_id'] = this.entryGroupId;
+      this.$xdShowLoading({});
+      jfbRootExec("getListEntryCardBind", {
+        vm: this,
+        data: params
+      }).then(res=>{
+        this.loadingCardList = false;
+          this.showDisabled = res.is_show_invalid_card_entrance;
+          if(this.isPreview) {
+            res.list = this.testCouponList
+          }
+          //过滤入口配置          
+          res['site_entry_settings'] = this.filterNotSupportEntry(res['site_entry_settings']);
+          let newCardList = this.$xdUniHelper.cloneDeep(res.list);
+          this.couponList = this.getCardGroupItem(newCardList, res['site_entry_settings']);
+          console.log(this.couponList,'this.couponList');
+          
+          this.$xdHideLoading({});
+
+      }) .catch(() => this.$xdHideLoading());
+        
     },
 
     getCardList(options) {
-      let params = {is_all: 'Y', is_show_entry_settings: 'Y'};
+      let params = {is_all: 'Y', is_show_entry_settings: 'Y', show_type: 'normal'};
       if(options['jfb_business_code']) {
         params['card_business_code'] = options['jfb_business_code'];
       }
@@ -777,7 +917,15 @@ export default {
           this.hasChangeStatus = this.getCardGroupItem(this.ajaxCardList.list.filter((item) => {
             return item["is_exchange"] === "Y";
           }), res['site_entry_settings']).length > 0;
-          this.handleCardInit(this.ajaxCardList, this.tabIndex === 1);
+          let type = ""
+          if(this.subTabIndex === 1) {
+            type = 'is_valid'
+          } else if(this.subTabIndex === 2) {
+            type = 'is_exchange'
+          } else {
+            type = 'is_transfering'
+          }
+          this.handleCardInit(this.ajaxCardList, type);
           this.cardPageNum = 1;
           this.$xdHideLoading();
         })
@@ -910,6 +1058,19 @@ export default {
 
     }
 
+    &-sub-tab {
+      display: flex;
+      align-items: center;
+      margin-bottom: 32rpx;
+
+      &-item {
+        font-size: 28rpx;
+        padding: 8rpx 16rpx;
+        border-radius: 8rpx;
+        margin-right: 24rpx
+      }
+    }
+
     &-tab {
       display: flex;
       align-items: center;
@@ -1221,6 +1382,18 @@ export default {
   }
 }
 
+.coupon_list{
+  ::v-deep .xd-coupon_item{
+    margin: var(--card-list-margin) 0;
+  }
+}
+.no_more_card{
+  text-align: center;
+  padding: 20rpx 0;
+  color: #CCCCCC;
+  font-size: 28rpx;
+}
+
 .computed-height {
   position: fixed;
   top:-999999px;

package/src/components/JfbBaseCardGive/Api.js

@@ -6,53 +6,37 @@
  */
 module.exports = [
   {
-    //设置方法名字当别忘记加上【模块名字】：Card
-    mapFnName: 'getCardByIdFilmSquate',
-    title: '获取电影广场列表',
-    path: '/api/account/film/list-film-square',
+    mapFnName: 'getBaseByIdCardDetailGive',
     isRule: false,
+    title: '获得绑定的卡详情',
+    prefix: 'detal',
+    path: '/card/v1/card-transfer/get-bind-card',
     params: {
-      last_key: ['当前页', 'Number', '必选'],
-      page_size: ['每页数量', 'Number', '必选'],
+      card_number: ['卡号', 'String', '必选'],
     },
-    isConsole: true,
     disabled: true,
   },
   {
-    //设置方法名字当别忘记加上【模块名字】：Card
-    mapFnName: 'updateCardFilmPaiqiDate',
-    title: '更新排期',
-    path: '/api/account/film/paiqi-date',
+    mapFnName: 'confirmGiveCard',
     isRule: false,
-    params: {
-      film_id: ['电影id', 'Number', '必选'],
-      cinema_id: ['影院id', 'Number', '必选'],
-    },
-    isConsole: true,
-    disabled: true,
-  },
-  {
-    //设置方法名字当别忘记加上【模块名字】：Card
-    mapFnName: 'removeCardFilmAddress',
-    title: '删除我的配送地址',
-    path: '/api/account/film/paiqi-date',
-    isRule: false,
-    params: {
-      film_id: ['电影id', 'Number', '必选'],
+    title: '确认赠送',
+    prefix: 'detal',
+    path: '/card/v1/card-transfer/create',
+    data: {
+      card_number: ['卡号', 'String', '必选'],
+      greeting: ['祝福语', 'String', '必选'],
     },
-    isConsole: true,
     disabled: true,
   },
   {
-    //设置方法名字当别忘记加上【模块名字】：Card
-    mapFnName: 'addCardFilmcart',
-    title: '添加购物车',
-    path: '/api/account/film/paiqi-date',
+    mapFnName: 'cancelGiveCard',
     isRule: false,
-    params: {
-      film_id: ['电影id', 'Number', '必选'],
+    title: '取消赠送',
+    prefix: 'detal',
+    path: '/card/v1/card-transfer/cancel',
+    data: {
+      transfer_auth_code: ['授权码', 'String', '必选'],
     },
-    isConsole: true,
     disabled: true,
   },
 ];

package/src/components/JfbBaseCardGive/Attr.js

@@ -8,49 +8,42 @@ export default {
   content: (data) => {
     return [
       {
-        label: '背景颜色:',
-        ele: 'xd-color',
-        valueKey: 'bgcolor',
-        value: data.bgcolor || '',
-        placeholder: '请输入占位框背景颜色',
-        classNmae: 'input80',
-        rules: [
-          {
-            required: true,
-            message: '请输入占位框背景颜色',
-            trigger: 'blur'
-          },
-        ]
-      },
-      {
-        label: '选中路径:',
+        label: '领取地址:',
         ele: 'xd-select-pages-path',
-        valueKey: 'select-pages-path',
-        value: data['select-pages-path'] || null,
+        valueKey: 'get_url',
+        groupKey:'advanced',
+        placeholder: '请选择领取地址',
+        value: null,
         setting: {
-          router: XdBus.getParentApi('getPagesTree')
+          router: XdBus.getParentApi('getPagesTree'),
         },
-      },
-      data.bgcolor && {
-        label: '高度:',
-        ele: 'el-input',
-        type: 'number',
-        valueKey: 'height',
-        value: data.height || 100,
-        placeholder: '请输入占位框高度，单位像素，默认：10px',
-        className: 'input80',
+        inline: false,
         rules: [
-          {
-            required: true,
-            message: '请输入占位框高度',
-            trigger: 'blur'
-          },
+          { required: true, message: '请选择领取地址', trigger: ['blur', 'change'] },
         ]
       },
       {
-        label: '', //label
-        ele: 'slot', //package 名称
-        slot: 'is_reference',
+        label: '分享图片:', //label
+        ele: 'xd-upload', //package 名称
+        valueKey: 'shareImage', //form[valueKey]
+        value: data.shareImage || null, //v-model
+        defaultValue: data.shareImage || null, //默认图片对象
+        groupKey: "style",
+        slot: true, //按钮是否使用slot
+        oneWidth: 200, //单个图片显示宽度
+        oneHeight: 200, //单个图片显示高度
+        elinputClassName: 'input40',
+        tipsformet: '上传文件格式：@imageType@，不超过@size@MB.',
+        type: ['jpg', 'png', 'jpeg'],
+        styleType: 'one', //其值：one=>单文件上传 auth=>证件正反面上传 list=>多文件上传
+        uploadType: 'aliyun', //''=>API服务上传  qiniu=>七牛云OSS上传  aliyun=> 阿里云OSS上传
+        size: 5, //5M
+        action: 'aliyun',
+        sort: true, //当上传图片列表时候，是否启用排序
+        maxlen: 100, //当上传图片列表时候，最大数量数量
+        rules: [
+          { required: true, message: '请上传图片', trigger: ['blur', 'change'] },
+        ]
       },
     ].filter(i=>i)
   },