jufubao-base 1.0.311-beta101 → 1.0.311-beta3

package/src/components/JfbBaseCardDetailEntry/JfbBaseCardDetailEntry.vue

@@ -108,6 +108,49 @@
         </view>
       </view>
     </view>
+  <xd-down-drawer
+    :show.sync="showDialog"
+    height="50vh"
+  >
+    <template>
+      <view class="top_title">请务必先关联，否则影响此卡使用</view>
+      <view class="method_item">
+        <view class="method_item_top">
+          <view class="method_title">方法一</view>
+          <view>复制文本，打开支付宝APP</view>
+        </view>
+        <view class="method_item_bottom">
+          <view class="method_item_bottom_left">吱口令：{{share_code}}</view>
+          <view class="method_item_bottom_right" @click="copy(share_code)">复制吱口令</view>
+        </view>
+      </view>
+      <view class="method_item">
+        <view class="method_item_top">
+          <view class="method_title">方法二</view>
+          <view>复制链接，在默认浏览器打开</view>
+        </view>
+        <view class="method_item_bottom">
+          <view class="method_item_bottom_left">{{sign_url}}</view>
+          <view class="method_item_bottom_right" @click="copy(sign_url)">复制链接</view>
+        </view>
+      </view>
+      <view class="method_item">
+        <view class="method_item_top">
+          <view class="method_title">方法三</view>
+          <view>保存图片，使用支付宝APP扫码</view>
+        </view>
+        <view class="method_item_bottom code_img">
+          <view>打开支付宝APP，点击扫一扫直接扫码或点击相册中保存图片</view>
+          <view class="code_box">
+            <view class="qr_code">
+              <image mode="aspectFit" :src="sign_url_qrcode"></image>
+            </view>
+            <view>长按保存二维码</view>
+          </view>
+        </view>
+      </view>
+    </template>
+  </xd-down-drawer>
   </view>
 </template>
 
@@ -126,6 +169,7 @@ import XdPwPay from "./XdPwPay";
 import XdEditPwd from "./XdEditPwd";
 import XdUnit from "@/components/XdUnit/XdUnit";
 import XdButton from '@/components/XdButton/XdButton'
+import XdDownDrawer from "@/components/XdDownDrawer/XdDownDrawer"
 import {parsePath} from "@/utils/linkUrl";
 export default {
   name: "JfbBaseCardDetailEntry",
@@ -134,7 +178,8 @@ export default {
     XdPwPay,
     XdEditPwd,
     XdUnit,
-    XdButton
+    XdButton,
+    XdDownDrawer,
   },
   mixins: [
     componentsMixins,extsMixins,JfbBaseCardDetailEntryMixin,colorCardMixins,
@@ -176,7 +221,13 @@ export default {
       isBrandLogo: false,
       isShowUnbind: false, //是否启动绑定按钮
       headerBg: {},
-      give_url: ""
+      give_url: "",
+      collect_phone_url: "",//收集手机号地址
+      showDialog:false,
+      sign_url:'',
+      share_code:'',
+      sign_url_qrcode:'',
+      toCollectPhoneUrl:'',
     };
   },
   watch: {
@@ -193,6 +244,15 @@ export default {
     },
   },
   created() {
+    // ifDef小程序拼接问题
+    let url = this.$xdUniHelper.parseURL();
+    // #ifdef MP-WEIXIN
+    this.toCollectPhoneUrl = url.relative
+    // #endif
+    // #ifdef H5
+    this.toCollectPhoneUrl = '@site_domain@'+''+url.relative
+    // #endif
+    console.log(this.toCollectPhoneUrl,encodeURIComponent(this.toCollectPhoneUrl),'this.toCollectPhoneUrl')
     this.init(this.container)
   },
   methods: {
@@ -228,6 +288,8 @@ export default {
       this.backUrl = getContainerPropsValue(container,  "content.back_url", { value: "" }).value;
       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;
+      console.log(this.collect_phone_url,'collect_phone_url')
       //'wechat_mini_program|default'
       this.entryGroupId = getContainerPropsValue(container,"content.entryGroupId","default");
     },
@@ -279,6 +341,19 @@ export default {
           this.show = false;
           console.log(this.getCardThemes(res.card_type_name),'this.getCardThemes(res.card_type_name)');
           this.headerBg = this.getCardThemes(res.card_type_name);
+          //支付宝弹框
+          if(res.enterprise_info&&res.enterprise_info.is_need_activate==='Y'){
+            this.share_code = res.enterprise_info.share_code;
+            this.sign_url = res.enterprise_info.sign_url;
+            this.sign_url_qrcode = res.enterprise_info.sign_url_qrcode;
+            if(res.enterprise_info.is_need_collect_phone_number==='Y'){
+              let url = `${this.collect_phone_url}?callback_url=${encodeURIComponent(this.toCollectPhoneUrl)}`
+              this.$xdUniHelper.navigateTo({
+                url:url,
+              });
+            }
+            this.showDialog = true;
+          }
         })
         .catch((err) => {
           // this.$refs["pwPay"].clearPwd();
@@ -558,6 +633,26 @@ export default {
         clearTimeout(this.refrushTimeer);
       }
     },
+    /**
+     *@description 复制功能
+     * @param  text
+     */
+    copy(text) {
+      // #ifdef H5
+      this.$copyText(text).then((res) => {
+        this.$xdAlert({ content: "复制成功" });
+      });
+      // #endif
+      // #ifndef H5
+      uni.setClipboardData({
+        data: text,
+        showToast: false,
+        success: () => {
+          //this.$xdAlert({ content: "复制成功" });
+        },
+      });
+      // #endif
+    },
   },
 };
 </script>
@@ -1008,5 +1103,71 @@ export default {
 
     }
   }
+  .method_item{
+    padding: unit(32, rpx);
+    border-bottom: 1px solid #F8F8F8;
+    color: #333333;
+    font-size: unit(28,rpx);
+    &_top{
+      display: flex;
+      align-items: center;
+    }
+    &_bottom{
+      display: flex;
+      justify-content: space-between;
+      align-items: flex-start;
+      margin-top: unit(16, rpx);
+      height: unit(32,rpx);
+      line-height: unit(32,rpx);
+      font-size: unit(24,rpx);
+      color: #666666;
+      &_right{
+        min-width: unit(180,rpx);
+        text-align: right;
+        color: #FF8D1A;
+      }
+      &_left{
+        color: #666666;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+    }
+    .code_img{
+      height: auto!important;
+    }
+
+  }
+  .method_title{
+    color: #fff;
+    background-color: #FF8D1A;
+    width: unit(120,rpx);
+    height: unit(50,rpx);
+    line-height: unit(50,rpx);
+    border-radius: unit(25,rpx);
+    text-align: center;
+    margin-right: unit(20,rpx);
+    font-size: unit(24,rpx);
+  }
+  .top_title{
+    height: unit(100,rpx);
+    text-align: center;
+    line-height:unit(100,rpx);
+    color:#333333;
+    font-size:unit(32,rpx);
+    border-bottom: 1px solid #F8F8F8;
+  }
+  .code_box{
+    text-align: center;
+    .qr_code{
+      width: unit(168,rpx);
+      height: unit(168,rpx);
+      image{
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+  
 }
 </style>

package/src/components/JfbBaseCardInfo/JfbBaseCardInfo.vue

@@ -248,7 +248,7 @@ export default {
         return;
       }
 
-      let path = this.getUrlCallback(this.my_card_url || this.backUrl);
+      let path = this.getUrlCallback(this.my_card_url || this.backUrl)+`?card_number=${this.card_number}`;
       //有优惠券处理
       if(this.hasCon){
         this.toShowCouponDialog();
@@ -285,7 +285,7 @@ export default {
         showClose: false,
         success: (res) => {
           if (res.confirm) {
-            let path = this.getUrlCallback(this.my_card_url || this.backUrl);
+            let path = this.getUrlCallback(this.my_card_url || this.backUrl)+`?card_number=${this.card_number}`;
             this.$xdUniHelper.redirectTo({ url: path});
           }else{
           }

package/src/components/JfbBaseCardInfoEntry/JfbBaseCardInfoEntry.vue

@@ -271,7 +271,7 @@ export default {
         this.toShowCouponDialog();
         this.$bus.$on("onCloseConDialog",(container_id) => {
           if(container_id === this.hasCon){
-            let path = this.getUrlCallback(this.backUrl)
+            let path = this.getUrlCallback(this.backUrl)+`?card_number=${this.card_number}`
             this.$xdUniHelper.redirectTo({
               url: path,
             });
@@ -281,7 +281,7 @@ export default {
         this.$xdAlert({
           content: "票券绑定成功",
           close: () => {
-            let path = this.getUrlCallback(this.backUrl)
+            let path = this.getUrlCallback(this.backUrl)+`?card_number=${this.card_number}`
             this.$xdUniHelper.redirectTo({
               url: path,
             });
@@ -300,7 +300,7 @@ export default {
         showClose: false,
         success: (res) => {
           if (res.confirm) {
-            let path = this.getUrlCallback(this.my_card_url || this.backUrl)
+            let path = this.getUrlCallback(this.my_card_url || this.backUrl)+`?card_number=${this.card_number}`
             this.$xdUniHelper.redirectTo({
               url: path,
             });

package/src/components/JfbBaseEntry/Attr.js

@@ -1,16 +1,83 @@
 'use strict';
-import content from "./cusAttr/content";
-import style from "./cusAttr/style";
 
 /**
  * @description 当表单组件中有联动操作时候，使用方法进行返回
  */
 export default {
   style: [],
-  content: (data, gValue, gColor, oldData={}) => {
+  content: (data) => {
     return [
-      ...content(data, gValue, gColor, oldData),
-      ...style(data, gValue, gColor, oldData),
+      {
+        label: '选择综合入口类型:',
+        ele: 'xd-site-select-list',
+        valueKey: 'entryType',
+        value: data['entryType'],
+        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);
+            });
+        },
+      },
+      {
+        label: '每行显示数量',
+        ele: 'xd-radio',
+        valueKey: 'rowNum',
+        groupKey: 'content',
+        value: data.rowNum || 1,
+        rules: [
+          {required: true, message: '请选择', trigger: ['blur', 'change']}
+        ],
+        list: [
+          {"label": "一行一列", "value": 1},
+          {"label": "一行二列", "value": 2},
+          {"label": "一行三列", "value": 3},
+        ]
+      },
+      {
+        label: '背景颜色:',
+        ele: 'xd-color',
+        valueKey: 'bgcolor',
+        value: data.bgcolor || '',
+        groupKey: 'style',
+        placeholder: '请输入背景颜色',
+        classNmae: 'input80',
+      },
+      {
+        label: '间隔边距',
+        ele: 'el-input',
+        type: 'number',
+        valueKey: "paddingInput",
+        groupKey: 'style',
+        value: data.paddingInput || '',
+        placeholder: '请输入间隔边距',
+        inline: false,
+        className:'input60',
+        notice: '设置间隔边距，<span style="color: red">单位：像素</span>。默认值：<span style="color: red">20</span>像素',
+      },
+      {
+        label: '边距设置:',
+        ele: 'xd-margin-padding',
+        valueKey: 'margin',
+        groupKey:'style',
+        value: data.margin || null,
+        setting: {
+          type: 'margin',
+        },
+        placeholder: '请设置边距设置',
+        inline: false,
+        notice: '设置边距设置，<span style="color: red">单位：像素</span>。默认值：<span style="color: red">0</span> 像素',
+      },
     ].filter(i=>i)
   },
   advanced: [

package/src/components/JfbBaseEntry/JfbBaseEntry.vue

@@ -13,40 +13,30 @@
       <view class="jfb-base-entry__edit-icon" @click="delEdit">删除</view>
     </view>
     <!-- #endif -->
-    <view class="jfb-base-entry__body">
-      <view class="x-line"></view>
-      <view :style="[contStyleComp]">
-        <view
-          v-if="entryList === null"
-          class="entry_list skeleton-wrap"
-          :class="{rowNum1: rowNum ===1,rowNum2: rowNum ===2,rowNum3: rowNum ===3}"
-        >
-          <view
-            v-for="i in 5"
-            :key="i"
+    <view class="jfb-base-entry__body" :style="bodyStyle">
+      <view :style="{ margin:marginUi}">
+        <view v-if="loadingList" class="entry_list skeleton-wrap" :style="entryStyle">
+          <view v-for="i in 5" :key="i"
             :class="'row_num_'+rowNum"
             class="entry_item"
-            :style="[entryItemSkeStyleComp]"
           >
+            <image v-if="rowNum == 1" style="height: 260rpx;"/>
+            <image v-if="rowNum == 2" style="height: 200rpx;"/>
+            <image v-if="rowNum == 3" style="height: 150rpx;"/>
           </view>
         </view>
-        <view
-          v-else
-          class="entry_list"
-          :class="{rowNum1: rowNum ===1,rowNum2: rowNum ===2,rowNum3: rowNum ===3}"
-        >
+        <view v-else class="entry_list" :style="entryStyle">
           <view
-            :style="[entryItemStyleComp]"
             v-if="entryList.length > 0"
             v-for="(item,i) in entryList"
             :key="i"
             class="entry_item"
-            :class="'row_num_'+ rowNum"
+            :class="'row_num_'+rowNum"
             @click="toLink(item)"
           >
-            <image v-if="rowNum === 1" :src="item.image_url" mode="widthFix"/>
-            <image v-if="rowNum === 2" :src="item.image_url2" mode="widthFix"/>
-            <image v-if="rowNum === 3" :src="item.image_url3" mode="widthFix"/>
+            <image v-if="rowNum == 1" :src="item.image_url" mode="widthFix"/>
+            <image v-if="rowNum == 2" :src="item.image_url2" mode="widthFix"/>
+            <image v-if="rowNum == 3" :src="item.image_url3" mode="widthFix"/>
           </view>
           <xd-no-data
             icon-type="empty"
@@ -63,7 +53,7 @@
   import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
   import { jfbRootExec } from "@/utils/xd.event";
   import JfbBaseEntryMixin from "./JfbBaseEntryMixin";
-  import { gCPVal } from "@/utils/xd.base";
+  import { getContainerPropsValue } from "@/utils/xd.base";
   import componentsMixins from "@/mixins/componentsMixins";
   import extsMixins from "@/mixins/extsMixins";
   import getServiceUrl from "@/common/getServiceUrl";
@@ -80,147 +70,61 @@
     ],
     data() {
       return {
-        closeMask: true,
-        entryList: null,
-        height: 0,
-        width: 0,
-
-        //content
-        rowNum: 1, //列数
+        entryList: [],
+        bgcolor: "",
+        rowNum: 1,
+        paddingInput: 20,
+        loadingList: true,
+        margin: {},
         entryType: '',
-
-        //style
-        radius:0,
-        bgcolor: "", //背景色
-        bgImage:{}, //背景图
-        paddingInput: 20, //间距
-        margin: {}, //边距
-        contRadius:0,//圆角
-        padding:{},//填充
       }
     },
     computed: {
       ...mapState(['brandInfo']),
-      contStyleComp(){
-        let marginTB = this.getPMValue(this.margin, 'TB', 0);
-        let paddingTB = this.getPMValue(this.padding, 'TB', 0);
-        let bodyMinHeight = this.layoutInfo.bodyMinHeightRpx - (marginTB + paddingTB)
-        let url = {};
-        if(this.bgImage && this.bgImage.url) {
-          url = {
-            backgroundImage: `url(${getServiceUrl(this.bgImage.url)})`,
-            backgroundSize: '100%',
-            backgroundRepeat: 'repeat-y',
-            backgroundPosition: 'top center'
-          }
-        }
-        return {
+      bodyStyle(){
+        return this.styleObjectToString({
           backgroundColor: this.bgcolor,
-          minHeight: bodyMinHeight + 'rpx',
-          margin: this.getMarginAndPadding(this.margin, 0),
-          padding: this.getMarginAndPadding(this.padding, 0),
-          borderRadius: this.radius + 'rpx',
-          ...url
-        }
-      },
-      getWidthComp(){
-        let marginRL = this.getPMValue(this.margin, 'RL', 0);
-        let paddingRL = this.getPMValue(this.padding, 'RL', 0);
-        return (750 - (Number(this.paddingInput)*(this.rowNum-1) + marginRL + paddingRL)) / this.rowNum
-      },
-      getMarginRight(){
-        let marginRight = 0;
-        if([2,3].includes(this.rowNum)) marginRight = this.paddingInput + 'rpx';
-        return marginRight
+          minHeight: this.layoutInfo.bodyMinHeight,
+        })
       },
-      entryItemSkeStyleComp(){
-        let width = this.getWidthComp
-        let height = '260rpx';
-        if([2,3].includes(this.rowNum)) height = '300rpx';
-        return {
-          borderRadius: this.contRadius + 'rpx',
-          marginTop: this.paddingInput + 'rpx',
-          marginRight: this.getMarginRight,
-          height,
-          width: width + 'rpx'
-        }
+      entryStyle(){
+        return this.styleObjectToString({
+          gridTemplateColumns: `repeat(${this.rowNum}, 1fr)`,
+          gap: this.paddingInput + 'rpx',
+          padding: this.paddingInput + 'rpx'
+        })
       },
-      entryItemStyleComp(){
-        let width = this.getWidthComp
-        return {
-          borderRadius: this.contRadius + 'rpx',
-          marginTop: this.paddingInput + 'rpx',
-          width: width + 'rpx',
-          marginRight: this.getMarginRight,
-          height: width * this.height/this.width  + 'rpx',
-          overflow: 'hidden'
-        }
+      marginUi(){
+        let str = `${this.checkValue(this.margin.top, 0)}rpx`;
+        str = `${str} ${this.checkValue(this.margin.right, 0)}rpx`;
+        str = `${str} ${this.checkValue(this.margin.bottom, 0)}rpx`;
+        str = `${str} ${this.checkValue(this.margin.left, 0)}rpx`;
+        return str
       }
     },
     watch: {
       container(value,oldValue) {
         if(JSON.stringify(value) === JSON.stringify(oldValue)) return;
-        if (this.$configProject['isPreview']) {
-          this.init(value);
-          this.onJfbLoad()
-        }
+        if (this.$configProject['isPreview']) this.init(value)
       },
     },
     created() {
       this.init(this.container);
     },
     methods: {
-      onJfbLoad() {
+      onJfbLoad(options) {
         this.getEntrySetting();
       },
-
-      getImageInfo(entryList){
-        return new Promise((resolve,reject)=>{
-          let heightAll = 0,widthAll = 0, counter = 0, allCouter = 0;
-          let len = entryList.length;
-          entryList.map(item=>{
-            let imgUrl = item['image_url'];
-            if(this.rowNum === 2) imgUrl = item['image_url2'];
-            if(this.rowNum === 3) imgUrl = item['image_url3'];
-            uni.getImageInfo({
-              src:imgUrl,
-              success:({width,height})=>{
-                heightAll += height;
-                widthAll += width;
-                allCouter++;
-                counter++;
-                if(len === allCouter){
-                  resolve({height:heightAll/counter, width: widthAll/counter})
-                }
-              },fail:()=>{
-                allCouter++;
-                if(len === allCouter){
-                  resolve({height:heightAll/counter, width: widthAll/counter})
-                }
-              }
-            })
-          })
-        })
-      },
-
       /**
        * @description 监听事件变化
        * @param container {object} 业务组件对象自己
        */
       init(container) {
-
-        //content
-        this.rowNum = gCPVal(container, 'rowNum', 1);
-        this.entryType = gCPVal(container, 'entryType', 'default');
-
-        //style
-        this.bgcolor = gCPVal(container, 'bgcolor', 'rgba(0,0,0,0)',{sKey:'bgStatus',fields:['bgcolor','bgImage']});
-        this.bgImage = gCPVal(container, 'bgImage', {},{sKey:'bgStatus',fields:['bgcolor','bgImage']});
-        this.paddingInput = gCPVal(container, 'paddingInput', [16,20], {sKey:'paddingInputStatus',fields:['paddingInput'] });
-        this.margin = gCPVal(container, 'margin', 0, {sKey: 'marginStatus',fields:['margin'], isPMR: true});
-        this.padding = gCPVal(container, 'padding', 0, {sKey: 'paddingStatus',fields:['padding'], isPMR: true});
-        this.contRadius = gCPVal(container, 'contRadius', [this.gStyleValue.radius,0],{sKey: 'contRadiusStatus', fields: ['contRadius']})||0;
-        this.radius = gCPVal(container, 'radius', [this.gStyleValue.radius,0],{sKey: 'radiusStatus', fields: ['radius']})||0;
+        this.bgcolor = getContainerPropsValue(container, 'content.bgcolor', '#fff');
+        this.rowNum = getContainerPropsValue(container, 'content.rowNum', 1);
+        this.paddingInput = getContainerPropsValue(container, 'content.paddingInput', 20);
+        this.margin = getContainerPropsValue(container, 'content.margin', {});
+        this.entryType = getContainerPropsValue(container, 'content.entryType', 'default');
       },
 
       getCardPath(custom_redirect_data = {}){
@@ -248,7 +152,6 @@
         else return null;
         //#endif
       },
-
       getEntrySetting(){
         this.$xdShowLoading({});
         jfbRootExec("getEntrySetting", {
@@ -256,7 +159,8 @@
           data: {
             group_id:this.entryType || 'default'
           }
-        }).then(async (res) => {
+        }).then(res => {
+          this.loadingList = false;
           this.$xdHideLoading();
           let isH5FilterEntryList = [];
           let isMpFilterEntryList = [];
@@ -322,11 +226,6 @@
               return item;
             });
 
-          //获取平均高度
-          let {width, height} = await this.getImageInfo(entryList);
-          this.width = width;
-          this.height = height;
-
           //#ifdef MP-WEIXIN
           console.warn(`微信小程序端被过滤的入口列表：${JSON.stringify(isMpFilterEntryList.map(item=> `${item.redirect_data.appType}:${item.entry_name}:${item.redirect_data['frontPath']}`),null,2)}`)
           //#endif
@@ -340,18 +239,15 @@
             this.toLink(entryList[0]);
             return
           }
-
           //无数据提示
           if(res.list.length === 0) {
             this.$xdAlert({content: '当前票券暂无支持服务'})
             return;
           }
-
           //复制
-          this.entryList = entryList || [];
+          this.entryList = entryList;
         })
       },
-
       toLink(item){
         let path = "";
         try{
@@ -375,43 +271,11 @@
 
 <style scoped lang="less">
   @import "./JfbBaseEntryLess.less";
-//:class="{rowNum1: rowNum ===1,rowNum2: rowNum ===2,rowNum3: rowNum ===3}"
+
   .jfb-base-entry {
     &__body{
       .entry_list{
-        &.rowNum1 {
-          & >view:first-child {
-            margin-top: 0!important;
-          }
-        }
-        &.rowNum2,&.rowNum3 {
-          display: flex;
-          justify-content: flex-start;
-          align-items: center;
-          flex-flow: wrap;
-        }
-
-        &.rowNum2 {
-          & > view:nth-child(1),& > view:nth-child(2) {
-            margin-top: 0!important;
-          }
-        }
-
-        &.rowNum2 > view:nth-child(2n) {
-          margin-right: 0!important;
-        }
-
-        &.rowNum3 > view:nth-child(3n) {
-          margin-right: 0!important;
-        }
-        &.rowNum3 {
-          & > view:nth-child(1),
-          & > view:nth-child(2),
-          & > view:nth-child(3) {
-            margin-top: 0!important;
-          }
-        }
-
+        display: grid;
         &.skeleton-wrap{
           .entry_item{
             .skeleton-item(100%, auto);