jufubao-base 1.0.169-beta5 → 1.0.169-beta7

package/src/components/JfbBaseTfkCardDetail/JfbBaseTfkCardDetail.vue

@@ -48,7 +48,9 @@
             <view class="bus_title">进入业务板块</view>
             <view class="bus_list">
               <view class="bus_item" v-for="(item, i) in businessList" :key="i"
-                :style="businessItemBox">
+                :style="businessItemBox"
+                @click="handleBusinessLogin(item)"
+              >
                 <view class="bus_img">
                   <image :src="item.image_url" />
                 </view>
@@ -57,17 +59,17 @@
             </view>
           </view>
           <view v-else>
-            <xd-button type="primary">立即使用</xd-button>
+            <xd-button type="primary" @click="doCardLogin">立即使用</xd-button>
           </view>
         </view>
         <view class="list_col_wrap" :style="listColWrapBoxStyle">
-          <view class="list_item" :style="listColItemStyle">
+          <view class="list_item" :style="listColItemStyle" @click="switchModule('rule')">
             <view class="list_title">使用规则</view>
             <view class="list_icon">
               <xd-font-icon icon="iconxiangyou_xian" size="24"></xd-font-icon>
             </view>
           </view>
-          <view class="list_item" :style="listColItemStyle">
+          <view class="list_item" :style="listColItemStyle" @click="switchModule('pickup')">
             <view class="list_title">提货码</view>
             <view class="list_icon">
               <xd-font-icon icon="iconxiangyou_xian" size="24"></xd-font-icon>
@@ -114,7 +116,9 @@
   import { getContainerPropsValue } from "@/utils/xd.base";
   import componentsMixins from "@/mixins/componentsMixins";
   import extsMixins from "@/mixins/extsMixins";
+  import colorCardMixins from "@/mixins/colorCardMixins";
   import getServiceUrl from '@/common/getServiceUrl'
+  import { mapState, mapActions } from "vuex";
   export default {
     name: "JfbBaseTfkCardDetail",
     components: {
@@ -123,7 +127,7 @@
       XdUnit,
     },
     mixins: [
-      componentsMixins, extsMixins, JfbBaseTfkCardDetailMixin
+      componentsMixins, extsMixins, JfbBaseTfkCardDetailMixin, colorCardMixins
     ],
     data() {
       return {
@@ -163,9 +167,18 @@
         payPreIcon: "",
         refreshIcon: "",
         bussWidth: 100,
+        codeDetailRadius: 16,
+        codeDetailBorder: {},
+        codeDetailShadow: {},
+        ruleDetailFontColor: "",
+        ruleDetailRadius: 0,
       }
     },
     computed: {
+      ...mapState({
+        jwxSDK: (state) => state.jwxSDK,
+        jfbAuthorize: (state) => state.jfbAuthorize,
+      }),
       cardWrapBoxStyle(){
         let padding = `${this.checkValue(this.cardInfoMargin.top, 20)}rpx`;
         padding = `${padding} ${this.checkValue(this.cardInfoMargin.right, 20)}rpx`;
@@ -266,9 +279,21 @@
           margin: margin,
           padding: padding,
           backgroundColor: this.ruleDetailBgColor,
+          color: this.ruleDetailFontColor,
+          borderRadius: this.ruleDetailRadius + 'rpx',
         })
       },
       codeDetailBoxStyle(){
+        let border = "none";
+        let boxShadow = "none";
+        if(this.codeDetailBorder && this.codeDetailBorder.type === 'Y'){
+          let { width, color } = this.codeDetailBorder.value || {};
+          border = `${width || 0}rpx solid ${color || 'transparent'}`;
+        }
+        if(this.codeDetailShadow && this.codeDetailShadow.type === 'Y'){
+          let { width, color } = this.codeDetailShadow.value || {};
+          boxShadow = `0 0 ${width || 0}rpx ${color || 'transparent'}`;
+        }
         let padding = `${this.checkValue(this.codeDetailPadding.top, 20)}rpx`;
         padding = `${padding} ${this.checkValue(this.codeDetailPadding.right, 20)}rpx`;
         padding = `${padding} ${this.checkValue(this.codeDetailPadding.bottom, 20)}rpx`;
@@ -281,6 +306,9 @@
           margin: margin,
           padding: padding,
           backgroundColor: this.codeDetailBgColor,
+          borderRadius: this.codeDetailRadius + 'rpx',
+          border: border,
+          boxShadow: boxShadow,
         })
       },
       qrcodeBoxStyle(){
@@ -338,25 +366,69 @@
         this.payPreIcon = getContainerPropsValue(value, 'content.payPreIcon', '');
         this.refreshIcon = getContainerPropsValue(value, 'content.refreshIcon', '');
         this.bussWidth = getContainerPropsValue(value, 'content.bussWidth', 100);
+        this.codeDetailRadius = getContainerPropsValue(value, 'content.codeDetailRadius', 16);
+        this.codeDetailBorder = getContainerPropsValue(value, 'content.codeDetailBorder', {});
+        this.codeDetailShadow = getContainerPropsValue(value, 'content.codeDetailShadow', {});
+        this.ruleDetailFontColor = getContainerPropsValue(value, 'content.ruleDetailFontColor', '');
+        this.ruleDetailRadius = getContainerPropsValue(value, 'content.ruleDetailRadius', 0);
+
+        console.log(this.codeDetailBorder, 'codeDetailBorder')
 
         if(this.$configProject.isPreview){
           this.curModule = this.previewCurrent;
         }
       },
+      switchModule(module){
+        this.curModule = module;
+      },
+      handleBusinessLogin(item){
+        this.doCardLogin(() => {
+          this.handleClick(item);
+        })
+      },
+      doCardLogin(cb){
+        this.$xdShowLoading({});
+        jfbRootExec("loginTfkCardBind", {
+          vm: this,
+          data: {
+            card_number: this.card_number
+          }
+        }).then(res => {
+          this.$xdHideLoading();
+          //#ifdef MP-WEIXIN
+          if (this.jfbAuthorize !== null) {
+            this.jfbAuthorize.setCardToken(res);
+          }
+          //#endif
+
+          if(cb) return cb();
+
+          if (this.$configProject.isPreview) {
+            console.log("handleBindLogin", "预览模式不跳转", this.inCallback);
+          } else {
+            this.$xdUniHelper.redirectTo({
+              url: this.settings.index
+            });
+          }
+        }).catch((res) => {
+          this.$xdHideLoading();
+        });
+      },
       getCardDetail(){
         jfbRootExec("getTfkCardDetail", {
           vm: this,
           data: {
             card_number: this.card_number,
-            is_show_entry_settings: this.showBusinessList,
+            is_show_entry_settings: this.curModule === 'main' ? this.showBusinessList : "N",
           }
         }).then(res => {
           this.cardInfo = Object.assign({}, res, {
             other_card_point: res.other_card_point ? this.$xdUniHelper.divisionFloatNumber(res.other_card_point, 100) : 0
           });
-          this.businessList = res.site_entry_settings.map(item => {
+          let businessList = this.filterNotSupportEntry(res.site_entry_settings);
+          this.businessList = businessList.filter(item => {
             item['image_url'] = getServiceUrl(item.image_url);
-            return item;
+            return res.business_codes.includes(item.business_code);
           })
           if(!this.$configProject.isPreview) {
             this.setIntval(res.card_qrcode_expire);
@@ -365,6 +437,56 @@
           }
         })
       },
+      handleClick(entry){
+        const {dir, path, host, appType} = entry['redirect_data'];
+        let regHttp = /^(\/\/|http:\/\/|https:\/\/).+$/;
+        let regSp = /(-apiuri\/v)/;
+
+        if(!appType) entry.redirect_data.appType = 'h5';
+        let nsp = Base64.encodeURI(JSON.stringify({business_code: entry['business_code']}));
+
+        //外站配置地址
+        if(entry.redirect_type === 'URL') {
+          if(regHttp.test(entry.redirect_data['path']) || regSp.test(entry.redirect_data['path'])) {
+            this.$xdUniHelper.redirectTo({
+              url:`${entry.redirect_data['path']}?x-common=${nsp}&vs=${new Date().getTime()}${cardPathStr}`
+            }, false)
+          }
+          else {
+            console.error(`配置错误：${entry.redirect_data['path']}`);
+            throw new Error(`配置错误：${entry.redirect_data['path']}`)
+          }
+          return
+        }
+
+        //站内应用处理
+        let jumpUrl = path;
+        let cardPathStr = '';
+        const {deploy_dir} = this.projectAttr;
+        if(host === this.projectAttr.host && deploy_dir !== dir){
+          jumpUrl = `//${host}/${dir}${path}`;
+          //#ifdef MP-WEIXIN
+          jumpUrl = `https:${jumpUrl}`;
+          //#endif
+        }
+
+        //#ifdef MP-WEIXIN
+        //获取自定义卡券登录地址(微信小程序跳转到H5平台起作用)
+        if(entry.redirect_data.appType === 'h5') {
+          const custom_redirect_data = this.$xdUniHelper.checkVarType(entry['custom_redirect_data']) === 'object'?entry['custom_redirect_data']:{};
+          const cardPathObject = this.getCardPath(custom_redirect_data);
+          if(cardPathObject !== null) {
+            const {cardPath, cardSelf} =cardPathObject
+            if(cardPath) cardPathStr = `&card-login=${encodeURIComponent(cardPath)}&cardSelf=${cardSelf}`
+          }
+        }
+        //#endif
+
+        jumpUrl = `${jumpUrl}?x-common=${nsp}&vs=${new Date().getTime()}${cardPathStr}`;
+        console.warn(`entry.path:${jumpUrl}`);
+        if(regHttp.test(jumpUrl)) this.$xdUniHelper.redirectTo({url:jumpUrl}, false)
+        else this.$xdUniHelper.navigateTo({url:jumpUrl}, false)
+      },
       getContent() {
         jfbRootExec("getListBaseNewsContent", {
           vm: this,
@@ -449,6 +571,7 @@
         display: flex;
         flex-direction: column;
         justify-content: space-between;
+        font-size: 26rpx;
         .card_top{
           display: flex;
           flex-direction: column;
@@ -459,6 +582,14 @@
             ._point{
               font-size: 40rpx;
               font-weight: bold;
+              ::v-deep .xd-unit{
+                height: auto !important;
+                font-weight: bold;
+                align-items: flex-end;
+                .xd-unit__unit{
+                  line-height: 1.5 !important;
+                }
+              }
               ._unit{
                 font-size: 24rpx;
                 margin-left: 4rpx;
@@ -539,11 +670,13 @@
       .code_wrap{
         display: flex;
         flex-direction: column;
+        font-size: 28rpx;
         .code_title{
           display: flex;
           align-items: center;
           ._title{
             margin-left: 30rpx;
+            font-size: 32rpx;
           }
         }
         .barcode{

package/src/components/JfbBaseTfkCardLogin/Attr.js

@@ -18,6 +18,28 @@ export default {
           { label: '我的优惠券', value: 'coupon' },
         ],
       },
+      // {
+      //   label: '选择综合入口类型:',
+      //   ele: 'xd-site-select-list',
+      //   valueKey: 'entryGroupId',
+      //   value: data.entryGroupId || 'default',
+      //   placeholder: '请选择综合入口类型',
+      //   multiple: false,
+      //   groupKey:'content',
+      //   className: 'input50',
+      //   rules: [
+      //     {required: true, message: '请选择综合入口类型', trigger: ['blur', 'change']}
+      //   ],
+      //   handleCustom({action, data}) {
+      //     XdBus.getParentApi('getEntryGroupOption')({key: Date.now()})
+      //       .then(res => {
+      //         data.cb(res.list)
+      //       })
+      //       .catch(error => {
+      //         console.error(error);
+      //       });
+      //   },
+      // },
       {
         ele: "title",
         label: "公告内容配置 - 通用",
@@ -276,6 +298,18 @@ export default {
         maxlen: 100,
         hidden: data.previewCurrent !== 'card'
       },
+      {
+        label: "背景图裁剪、缩放模式:",
+        ele: "xd-select-list",
+        valueKey: "cardImageMode",
+        groupKey:'content',
+        value: data.cardImageMode || '',
+        className: "input70",
+        list: [
+          {label: '铺满背景，裁剪掉多余', value: 'cover'},
+          {label: '图像缩放成适合背景区域的最大大小', value: 'contain'}
+        ],
+      },
       {
         ele: "title",
         label: "我的优惠券内容配置",
@@ -304,6 +338,21 @@ export default {
         maxlen: 100,
         hidden: data.previewCurrent !== 'coupon'
       },
+      {
+        label: '顶部菜单配置 - 通用:',
+        ele: "title",
+        size: "small",
+        groupKey: "content",
+      },
+      {
+        label: "顶部菜单右侧文案:",
+        ele: "el-input",
+        valueKey: "bindCardText",
+        value: data.bindCardText || "",
+        placeholder: "请输入内容",
+        groupKey:'content',
+        className: "input70",
+      },
       {
         ele: "title",
         label: "列表容器配置 - 通用",
@@ -410,6 +459,67 @@ export default {
         groupKey: "style",
         type: "number",
       },
+      {
+        label: "顶部菜单右侧配置 - 通用:",
+        ele: "title",
+        size: "small",
+        groupKey: "style",
+      },
+      {
+        label: "展示方式:",
+        ele: "xd-radio",
+        valueKey: "bindCardShowType",
+        value: data.bindCardShowType || 'text',
+        groupKey:'style',
+        list: [
+          {label: '文本', value: 'text'},
+          {label: '按钮', value: 'button'}
+        ],
+      },
+      {
+        label: "按钮圆角",
+        ele: 'xd-site-select-list',
+        valueKey: 'bindCardBtnRadius',
+        value: data['bindCardBtnRadius'] || 16,
+        groupKey:'style',
+        placeholder: '请选择内容圆角设置',
+        multiple: false,
+        className: 'input80',
+        handleCustom({ action, data }) {
+          XdBus.getParentApi('getOptionsSettingList')({ setting_id: 'edtix_style_radius' })
+            .then(res => {
+              data.cb(res.list)
+            })
+            .catch(error => {
+              console.error(error);
+            });
+        },
+        hidden: data.bindCardShowType !== 'button'
+      },
+      {
+        label: "右侧文案字体样式:",
+        ele: "xd-font",
+        valueKey: "bindCardTextStyle",
+        value: data.bindCardTextStyle || {},
+        groupKey:'style',
+        setting: {
+          align: false,
+          lineHeight: false,
+        },
+        handleCustom({action, data}) {
+          XdBus.getParentApi('getOptionsSettingList')({setting_id: 'edtix_style_font_size'})
+            .then(res => {
+              data.cb(res.list)
+            })
+            .catch(error => {
+              data.cb([])
+              console.error(error);
+            });
+        },
+        inline: false,
+        notice: '填充设置，单位：<span style="color: red">像素</span>。默认值：<span style="color: red">20</span> 像素',
+        hidden: data.bindCardText === ''
+      },
       {
         label: "右侧图标(跳转票券绑定):",
         ele: "xd-font",
@@ -513,6 +623,43 @@ export default {
         groupKey: "style",
         hidden: data.previewCurrent !== 'card'
       },
+      {
+        label: "边框设置:",
+        ele: "xd-border",
+        groupKey:'style',
+        valueKey: "cardBorder",
+        value: data.cardBorder || null,
+        hidden: data.previewCurrent !== 'card'
+      },
+      {
+        label: "边框阴影设置:",
+        ele: "xd-shadow",
+        groupKey:'style',
+        valueKey: "cardShadow",
+        value: data.cardShadow || null,
+        handleCustom({action, data}) {
+          XdBus.getParentApi('getOptionsSettingList')({setting_id: 'edtix_style_radius'})
+            .then(res => {
+              data.cb(res.list)
+            })
+            .catch(error => {
+              console.error(error);
+              data.cb([])
+            });
+        },
+        hidden: data.previewCurrent !== 'card'
+      },
+      {
+        label: "票券高度设置:",
+        ele: "el-input",
+        valueKey: "cardHeight",
+        value: data.cardHeight || 270,
+        groupKey:'style',
+        placeholder: '请输入票券高度',
+        inline: false,
+        notice: '设置票券高度，<span style="color: red">单位：像素</span>。默认值：<span style="color: red">100</span> 像素',
+        hidden: data.previewCurrent !== 'card'
+      },
       {
         label: "单项内边距设置:",
         groupKey:'style',
@@ -547,6 +694,17 @@ export default {
         },
         hidden: data.previewCurrent !== 'card'
       },
+      {
+        label: "按钮最小宽度设置:",
+        ele: "el-input",
+        valueKey: "cardBtnMinWidth",
+        value: data.cardBtnMinWidth || 100,
+        groupKey:'style',
+        placeholder: '请输入按钮最小宽度',
+        inline: false,
+        notice: '设置按钮最小宽度，<span style="color: red">单位：像素</span>。默认值：<span style="color: red">100</span> 像素',
+        hidden: data.previewCurrent !== 'card'
+      },
       {
         label: "登录按钮文字背景色设置:",
         ele: "xd-text-and-bgc",
@@ -722,6 +880,30 @@ export default {
         },
         inline: false,
       },
+      {
+        label: '票券详情地址:',
+        ele: 'xd-select-pages-path',
+        valueKey: 'cardDetailPath',
+        groupKey:'advanced',
+        placeholder: '请选择票券详情地址',
+        value: data.cardDetailPath || null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree'),
+        },
+        inline: false,
+      },
+      {
+        label: '综合福利入口页:',
+        ele: 'xd-select-pages-path',
+        valueKey: 'allEntryPath',
+        groupKey: 'advanced',
+        placeholder: '请选择综合福利入口页',
+        value: data.allEntryPath || null,
+        setting: {
+          router: XdBus.getParentApi('getPagesTree'),
+        },
+        inline: false,
+      },
     ].filter(i=>i)
   },
   advanced: [],