jufubao-base 1.0.439 → 1.0.440

package/get.package.path.js

@@ -8,11 +8,11 @@
  */
 const getPackagePath = (threePackagePath, packname = 'gxd-commands-bussiness')=>{
   if(packname === 'gxd-commands-bussiness') {
-    return `/Users/shiyonggao/Desktop/code/BASE/UNIAPP/xd-commands-bussiness/${threePackagePath}`;
+    return `/Users/shiyonggao/home/root/Base-Jufubao/xd-commands-bussiness/${threePackagePath}`;
   }
 
   if (packname === 'gxd-uni-library-editx') {
-    return `/Users/shiyonggao/Desktop/code/BASE/UNIAPP/xd-uni-library-editx/${threePackagePath}`;
+    return `/Users/shiyonggao/home/root/Base-Jufubao/xd-uni-library-editx/${threePackagePath}`;
   }
 
 };

package/package.json

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

package/src/components/JfbBaseCardConsumpCode/Api.js

@@ -0,0 +1,39 @@
+'use strict';
+/**
+ * @description  接口配置，
+ * 在设置方法名字当时候，别忘记加上【模块名字】：Card
+ * @type {*[]}
+ */
+module.exports = [
+  {
+    mapFnName: 'getListEntryCardBind',
+    isRule: false,
+    title: '获得绑定卡',
+    prefix: 'list',
+    path: '/card/v1/card-bind/list-bind-card',
+    params: {},
+    disabled: true,
+  },
+  {
+    mapFnName: 'getBaseByIdCardDetail',
+    isRule: false,
+    title: '获得绑定的卡详情',
+    prefix: 'detal',
+    path: '/card/v1/card-bind/get-bind-card',
+    params: {
+      card_number: ['卡号', 'String', '必选'],
+    },
+    disabled: true,
+  },
+  {
+    mapFnName: 'getCardYue',
+    isRule: false,
+    title: '获得绑定的卡剩余点数',
+    prefix: 'yue',
+    path: '/card/v1/card-bind/get-bind-card-points',
+    params: {
+      card_number: ['卡号', 'String', '必选'],
+    },
+    disabled: true,
+  },
+];

package/src/components/JfbBaseCardConsumpCode/Attr.js

@@ -0,0 +1,31 @@
+'use strict';
+import { dataVal } from "@/utils/AttrTools";
+
+/**
+ * @description 当表单组件中有联动操作时候，使用方法进行返回
+ */
+export default {
+  style: [],
+  content: (data, gValue, gColor, oldData={}) => {
+    return [
+      {
+        ele: 'title',
+        label: '展示内容',
+        size: 'small',
+        groupKey:'content',
+      },
+      {
+        label: '消费标题',
+        ele: 'el-input',
+        valueKey: 'takeTitleName',
+        value: dataVal({ data, key: 'takeTitleName', dValue: '提货二维码', gValue }),
+        groupKey: 'content',
+        className: 'input80',
+        labelInline: true,
+        inline: false,
+        placeholder: "输入消费标题"
+      },
+    ].filter(i=>i)
+  },
+  advanced: [],
+};

package/src/components/JfbBaseCardConsumpCode/JfbBaseCardConsumpCode.vue

@@ -0,0 +1,802 @@
+<template>
+  <view
+    class="jfb-base-card-consump-code"
+    @click="handleEditxSelect"
+    :class="{ editx : isEditx && active }"
+  >
+    <!--#ifdef H5-->
+    <view
+      class="jfb-base-card-consump-code__edit"
+      :class="{ editx : isEditx && active }"
+      v-if="isEditx && active"
+    >
+      <view class="jfb-base-card-consump-code__edit-icon" @click="delEdit">删除</view>
+    </view>
+    <!-- #endif -->
+    <view class="jfb-base-card-consump-code__body">
+      <view class="card-code">
+        <view class="card-code__title">
+          <xd-font-icon icon="icondaifahuo-main" :size="38"></xd-font-icon>
+          <text>{{ takeTitleName }}</text>
+        </view>
+
+        <template v-if="info">
+          <view class="barcode_wrap">
+            <view>
+              <image mode="aspectFit" :src="info.barcode"></image>
+            </view>
+          </view>
+
+          <view class="qrcode_wrap">
+            <image :src="info.card_qrcode"></image>
+            <image v-if="isBrandLogo" class="logo-icon" :src="brandLogo"></image>
+          </view>
+
+          <view class="card-code__refresh">
+            <view class="refresh-text" v-if="timeStr">{{ timeStr }}后自动刷新</view>
+            <view class="refresh-btn" @click="handleRefresh">
+              <xd-font-icon icon="iconmian-loading" :size="32" color="#333333"></xd-font-icon>
+              <text>刷新二维码</text>
+            </view>
+          </view>
+
+          <view class="card-code__choose" @click="handleChooseCard">
+            <view class="choose-left">
+              <xd-font-icon icon="iconkaquan" color="#FFCD5F" :size="34"></xd-font-icon>
+              <text>{{ card_number }}</text>
+            </view>
+            <view class="choose-right">
+              <text>切换票券</text>
+              <xd-font-icon icon="iconxiangyou_xian" :size="22"></xd-font-icon>
+            </view>
+          </view>
+
+          <view class="card-code__info">
+            <view class="info-row">有效期：{{ info.end_time }}</view>
+            <view class="info-row">
+              余　额：{{ info.card_point }}{{ info.unit || '' }}
+              <text
+                v-if="info.other_card_point && info.card_point_type === 2"
+                class="info-tip"
+              >（购买其他物品可抵：{{ info.other_card_point }}）</text>
+            </view>
+          </view>
+        </template>
+
+        <view class="card-code__empty" v-else>
+          <xd-no-data height="600rpx" :scaleSize="2">
+            <view class="empty_txt">
+              {{ card_number ? '卡券信息加载失败，请稍后重试' : '暂无可用票券' }}
+            </view>
+          </xd-no-data>
+        </view>
+      </view>
+
+      <xd-down-drawer
+        :show.sync="showCardDialog"
+        height="50vh"
+      >
+          <view class="drawer_content">
+            <view class="ticket_title">使用票券</view>
+            <view class="ticket_tab">
+              <view
+                v-for="item in cardTypeData"
+                :key="item.value"
+                :style="[show_type === item.value ? activityType : '']"
+                @click="handleChangeType(item.value)"
+              >{{ item.label }}</view>
+            </view>
+            <view class="ticket_content">
+              <view class="ticket_list" :key="renderChecked" v-if="showCardList.length">
+                <view
+                  class="ticket_item"
+                  v-for="ticket in showCardList"
+                  @click="handlerTicketSelect(!checkedCards.includes(ticket.card_number), ticket)"
+                  :key="ticket.card_number"
+                >
+                  <view class="_header">
+                    <view class="flex align-center">
+                      <xd-font-icon
+                        style="margin-right: 8rpx;"
+                        icon="iconkaquan"
+                        color="#ffc65d"
+                        size="32"
+                      ></xd-font-icon>
+                      {{ ticket.card_type_name }}
+                    </view>
+                    <xd-radio
+                      :isClickEvent="false"
+                      :isOld="false"
+                      :value="checkedCards.includes(ticket.card_number)"
+                      :disabled="isTicketDisabled(ticket)"
+                    ></xd-radio>
+                  </view>
+                  <view class="_cont">
+                    <view style="margin-right: 30rpx;">ID：{{ ticket.card_number }}</view>
+                    <view>有效期至：{{ ticket.end_time }}</view>
+                  </view>
+                  <view class="_footer">
+                    <view class="_item">
+                      <text>剩余：</text>
+                      <xd-unit
+                        :price="ticket.card_point"
+                        :isOld="false"
+                        :font-size="24"
+                        :icon-size="0.3"
+                        :unit="ticket.unit || ''"
+                      ></xd-unit>
+                    </view>
+                    <view
+                      v-if="ticket.card_use_point"
+                      class="_item text-primary"
+                    >
+                      <text>使用：</text>
+                      <xd-unit
+                        :price="ticket.card_use_point"
+                        :isOld="false"
+                        :font-size="24"
+                        :icon-size="0.3"
+                        :unit="ticket.unit || ''"
+                      ></xd-unit>
+                      <view v-if="ticket['card_discount_use_point'] > 0" class="discount">已优惠:{{ ticket['card_discount_use_point'] }}</view>
+                    </view>
+                  </view>
+                </view>
+              </view>
+              <view v-else>
+                <xd-no-data height="600rpx" :scaleSize="2">
+                  <view class="empty_txt">
+                    暂无可用票券
+                  </view>
+                </xd-no-data>
+              </view>
+              <view class="bottom_btn" v-if="showCardDialog" :style="{bottom: (layoutInfo.bottom || 0) + 'rpx'}">
+                <xd-button
+                  width="670rpx"
+                  type="primary"
+                  radius="40rpx"
+                  v-if="checkedCards.length"
+                  @click="handleChooseConfirm"
+                >确定</xd-button>
+                <xd-button
+                  width="670rpx"
+                  type="primary"
+                  radius="40rpx"
+                  v-else
+                  :disabled="true"
+                  @click="handleChooseConfirm"
+                >确定</xd-button>
+              </view>
+            </view>
+          </view>
+        </xd-down-drawer>
+    </view>
+  </view>
+</template>
+
+<script>
+  import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
+  import XdNoData from "@/components/XdNoData/XdNoData";
+  import XdDownDrawer from "@/components/XdDownDrawer/XdDownDrawer";
+  import XdRadio from "@/components/XdRadio/XdRadio";
+  import XdUnit from "@/components/XdUnit/XdUnit";
+  import XdButton from "@/components/XdButton/XdButton";
+  import { jfbRootExec } from "@/utils/xd.event";
+  import JfbBaseCardConsumpCodeMixin from "./JfbBaseCardConsumpCodeMixin";
+  import { gCPVal } from "@/utils/xd.base";
+  import componentsMixins from "@/mixins/componentsMixins";
+  import extsMixins from "@/mixins/extsMixins";
+  import { Base64 } from "js-base64";
+
+  export default {
+    name: "JfbBaseCardConsumpCode",
+    components: {
+      XdFontIcon,
+      XdNoData,
+      XdDownDrawer,
+      XdRadio,
+      XdUnit,
+      XdButton
+    },
+    mixins: [
+      componentsMixins, extsMixins, JfbBaseCardConsumpCodeMixin
+    ],
+    data() {
+      return {
+        takeTitleName: '提货二维码',
+        info: null,
+        timeStr: "",
+        timeer: null,
+        date: 2, //时间底数
+        time: 2, //时间幂指数
+        refrushTimeer: null,
+        maxTime: 30, //最大执行时间幂指数
+        showCardList: [],
+        showCardDialog: false,
+        renderChecked: 'renderChecked',
+        chooseData: [],
+        checkedCards: [],
+        cardTypeData: [
+          {label: '已绑票券', value: 'normal'},
+          {label: '优惠券', value: 'coupon'},
+        ],
+        show_type: 'normal', //normal:已绑定卡券 coupon: 优惠券
+        card_number: '',
+
+        //品牌logo
+        //#ifdef H5
+        brandLogo: '//img.jufubao.cn/common/jufubao_logo.png?v=1.0.0',
+        //#endif
+        //#ifdef MP-WEIXIN
+        brandLogo: 'https://img.jufubao.cn/common/jufubao_logo.png?v=1.0.0',
+        //#endif
+        isBrandLogo: false,
+      }
+    },
+    computed: {
+      activityType() {
+        return {
+          color: '#E5010E',
+          borderBottom: '6rpx solid #E5010E'
+        }
+      }
+    },
+    watch: {
+      container(value, oldValue) {
+        if (JSON.stringify(value) === JSON.stringify(oldValue)) return;
+        if (this.$configProject['isPreview']) this.init(value)
+      },
+    },
+    created() {
+      this.init(this.container);
+    },
+    methods: {
+      /**
+       * @description 监听页面进入，开始拉取展码数据
+       * @param options {object} 页面参数
+       */
+      onJfbLoad(options) {
+        if (options["x-params"]) {
+          try {
+            let params = JSON.parse(Base64.decode(options["x-params"]));
+            if (params["qrcode_logo"]) this.brandLogo = params["qrcode_logo"];
+          } catch (e) {
+            console.warn(options["x-params"]);
+          }
+        }
+        this.card_number = options.card_number;
+        if (this.card_number) {
+          this.dataInit();
+        } else {
+          //未带卡号入参时，拉取可用票券列表并默认选中登录卡
+          this.autoSelectCard();
+        }
+      },
+      /**
+       * @description 拉取当前卡号的展码数据
+       */
+      dataInit() {
+        if (!this.card_number) return;
+        this.detail();
+        this.refrush();
+        if (this.$configProject.isPreview) {
+          this.timeStr = "01分19秒"
+        }
+      },
+      /**
+       * @description 监听事件变化
+       * @param container {object} 业务组件对象自己
+       */
+      init(container) {
+        this.takeTitleName = gCPVal(container, 'takeTitleName', '提货二维码');
+      },
+      /**
+       * @description 未带卡号入参时，拉取可用票券列表并默认选中登录卡
+       */
+      autoSelectCard() {
+        this.fetchCardList('normal').then(normalList => {
+          let ticket = this.findDefaultTicket(normalList);
+          if (ticket) {
+            this.setCardList('normal', normalList);
+            this.useTicket(ticket);
+            return;
+          }
+          //已绑票券里没有可用的默认票券时，登录卡可能是一张优惠券（如满减券），切到优惠券再找一次
+          this.fetchCardList('coupon').then(couponList => {
+            let couponTicket = this.findDefaultTicket(couponList);
+            if (couponTicket) {
+              this.setCardList('coupon', couponList);
+              this.useTicket(couponTicket);
+              return;
+            }
+            //两处都没有可使用的票券：优先展示已绑票券，没有已绑票券时才展示优惠券
+            let isCoupon = !this.getVisibleCardList(normalList).length
+              && this.getVisibleCardList(couponList).length > 0;
+            this.setCardList(isCoupon ? 'coupon' : 'normal', isCoupon ? couponList : normalList);
+          });
+        });
+      },
+      /**
+       * @description 取列表中的默认票券：优先登录卡，其次第一张可使用的票券
+       * @param list {Array} 票券列表
+       */
+      findDefaultTicket(list) {
+        let usableList = list.filter(item => !this.isTicketDisabled(item));
+        return usableList.find(item => item.is_login === 'Y') || usableList[0];
+      },
+      /**
+       * @description 拉取指定类型的可用票券列表
+       * @param type {String} normal:已绑票券 coupon:优惠券
+       */
+      fetchCardList(type) {
+        return jfbRootExec("getListEntryCardBind", {
+          vm: this,
+          data: {
+            is_all: 'Y',
+            is_show_entry_settings: 'N',
+            show_type: type
+          }
+        }).then(res => (res && res.list) || []).catch(() => []);
+      },
+      /**
+       * @description 设置当前展示的票券列表
+       * @param type {String} 列表对应的票券类型
+       * @param list {Array} 票券列表
+       */
+      setCardList(type, list) {
+        this.show_type = type;
+        this.showCardList = this.getVisibleCardList(list);
+        this.renderChecked = Date.now();
+      },
+      /**
+       * @description 过滤出可展示的票券列表（已失效、已作废的票券不展示）
+       * @param list {Array} 票券列表
+       */
+      getVisibleCardList(list) {
+        return list.filter(item => this.isCardVisible(item));
+      },
+      /**
+       * @description 票券是否可展示
+       * @param ticket {Object} 票券
+       */
+      isCardVisible(ticket) {
+        return ticket.is_valid !== 'N' && ticket.card_status !== 'F';
+      },
+      /**
+       * @description 获取可切换的票券列表
+       * @param type {String} 指定拉取的票券类型，默认取当前选中tab
+       */
+      getCardList(type) {
+        if (type) this.show_type = type;
+        this.fetchCardList(this.show_type).then(list => {
+          this.setCardList(this.show_type, list);
+          //回显当前正在使用的票券
+          let curTicket = this.showCardList.find(item => item.card_number === this.card_number);
+          this.chooseData = curTicket ? [curTicket] : [];
+          this.checkedCards = this.chooseData.map(item => item.card_number);
+        });
+      },
+      /**
+       * @description 选中并启用指定票券
+       * @param ticket {Object} 票券
+       */
+      useTicket(ticket) {
+        this.handlerTicketSelect(true, ticket);
+        this.handleChooseConfirm();
+      },
+      handleRefresh() {
+        this.clearAllTimer();
+        this.dataInit();
+      },
+      handleChooseCard() {
+        this.showCardDialog = true;
+        this.getCardList();
+      },
+      /**
+       * @description 票券是否不可选中（不可展示或无可用点数）
+       * @param ticket {Object} 票券
+       */
+      isTicketDisabled(ticket) {
+        return !this.isCardVisible(ticket) || ticket.card_point == 0;
+      },
+      handlerTicketSelect(flat, ticket) {
+        //不可使用的票券不允许选中
+        if (flat && this.isTicketDisabled(ticket)) return;
+        if (flat) {
+          this.chooseData = [ticket];
+        }
+        else {
+          this.chooseData = [];
+        }
+        this.checkedCards = this.chooseData.map(item => item.card_number);
+      },
+      handleChangeType(type) {
+        if (this.show_type === type) return;
+        this.show_type = type;
+        this.getCardList();
+      },
+      handleChooseConfirm() {
+        if (!this.chooseData.length) return;
+        this.clearAllTimer();
+        this.card_number = this.chooseData[0].card_number;
+        this.dataInit();
+        this.showCardDialog = false;
+      },
+      /**
+       * @description 获取卡详情
+       */
+      detail() {
+        jfbRootExec("getBaseByIdCardDetail", {
+          vm: this,
+          data: {card_number: this.card_number},
+        })
+          .then((res) => {
+            if (res && res.card_point) {
+              res["card_point"] = this.$xdUniHelper.divisionFloatNumber(res.card_point, 100);
+            }
+            if (res && res.other_card_point) {
+              res["other_card_point"] = this.$xdUniHelper.divisionFloatNumber(res.other_card_point, 100);
+            }
+            //展示品牌logo
+            if (res["is_show_qrcode_logo"] === "Y") {
+              this.isBrandLogo = true;
+            }
+            this.info = res;
+            this.showCardDialog = false;
+            if (!this.$configProject.isPreview) {
+              this.setInval(this.info.card_qrcode_expire);
+            }
+          })
+          .catch((err) => {
+            console.error(err);
+          });
+      },
+      /**
+       * @description 二维码过期倒计时
+       * @param time {Number} 过期秒数
+       */
+      setInval(time) {
+        if (this.timeer) clearInterval(this.timeer);
+        this.timeer = setInterval(() => {
+          if (time <= 0) {
+            this.timeStr = "00分00秒";
+            clearInterval(this.timeer);
+            this.detail();
+          } else {
+            time--;
+            let f = Math.floor(time / 60);
+            f = f < 10 ? "0" + f : f;
+            let m = time % 60;
+            m = m < 10 ? "0" + m : m;
+            this.timeStr = `${f}分${m}秒`;
+          }
+        }, 1000);
+      },
+      /**
+       * @description 轮询刷新卡剩余点数
+       */
+      refrush() {
+        if (this.time >= this.maxTime) {
+          clearTimeout(this.refrushTimeer);
+          return;
+        }
+        this.time++;
+        let time = this.time >= 5 ? 32 * 1000 : Math.pow(this.date, this.time) * 1000;
+        this.refrushTimeer = setTimeout(() => {
+          jfbRootExec("getCardYue", {
+            vm: this,
+            data: {
+              card_number: this.card_number,
+            },
+          })
+            .then((res) => {
+              let refrushInfo = this.$xdUniHelper.cloneDeep(this.info);
+              if (res && res !== null && Object.keys(res).length > 0) {
+                if (res.card_point) {
+                  refrushInfo.card_point = this.$xdUniHelper.divisionFloatNumber(
+                    res.card_point,
+                    100
+                  );
+                }
+                if (res.other_card_point) {
+                  refrushInfo.other_card_point =
+                    this.$xdUniHelper.divisionFloatNumber(
+                      res.other_card_point,
+                      100
+                    );
+                }
+              }
+
+              this.info = refrushInfo;
+              this.refrush();
+            })
+            .catch();
+        }, time);
+      },
+      /**
+       * @description 清除所有定时器
+       */
+      clearAllTimer() {
+        this.timeStr = "";
+        if (this.timeer) {
+          clearInterval(this.timeer);
+          this.timeer = null;
+        }
+        if (this.refrushTimeer) {
+          clearTimeout(this.refrushTimeer);
+          this.refrushTimeer = null;
+        }
+      },
+      onJfbScroll(options) {
+        console.log('event.onJfbScroll', options)
+      },
+      onJfbReachBottom(options) {
+        console.log('event.onJfbReachBottom', options)
+      },
+      onJfbShow(options) {
+        console.log('event.onJfbShow', options)
+        //从其他页面返回时，二维码已失效且定时器已被清理，重新拉取展码数据
+        if (!this.card_number) return;
+        this.clearAllTimer();
+        this.dataInit();
+      },
+      onJfbHide(options) {
+        this.clearAllTimer();
+      },
+      onJfbUnload(options) {
+        this.clearAllTimer();
+      },
+      onJfbBack(options) {
+        this.clearAllTimer();
+      },
+      onJfbUpdate(...data) {
+        console.log('event.onJfbUpdate', data)
+      },
+      onJfbCustomEvent(options) {
+        console.log('event.onJfbReachBottom', options)
+      },
+    }
+  }
+
+</script>
+
+<style scoped lang="less">
+  @import "./JfbBaseCardConsumpCodeLess.less";
+
+  .jfb-base-card-consump-code {
+    &__body {
+      color: #333;
+      padding: unit(24, rpx);
+
+      .card-code {
+        background: #FFFFFF;
+        border-radius: unit(24, rpx);
+        padding: unit(32, rpx);
+
+        &__title {
+          display: flex;
+          align-items: center;
+          font-size: unit(32, rpx);
+          font-weight: 500;
+
+          & > text {
+            margin-left: unit(12, rpx);
+          }
+        }
+
+        .barcode_wrap {
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          box-sizing: border-box;
+          padding-top: unit(40, rpx);
+
+          & > view {
+            width: 100%;
+            height: unit(160, rpx);
+            display: flex;
+            justify-content: center;
+            align-items: center;
+
+            & > image {
+              width: 100%;
+              max-height: unit(160, rpx);
+            }
+          }
+        }
+
+        .qrcode_wrap {
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          position: relative;
+          padding: unit(40, rpx) 0;
+
+          & > image:first-child {
+            width: unit(280, rpx);
+            height: unit(280, rpx);
+          }
+        }
+
+        .logo-icon {
+          width: unit(64, rpx) !important;
+          height: unit(64, rpx) !important;
+          position: absolute;
+          top: 50%;
+          left: 50%;
+          transform: translate(unit(-32, rpx), unit(-32, rpx));
+        }
+
+        &__refresh {
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+          padding-bottom: unit(30, rpx);
+          border-bottom: 1px solid #F2F2F2;
+
+          .refresh-text {
+            font-size: unit(28, rpx);
+            color: #333333;
+          }
+
+          .refresh-btn {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: unit(72, rpx);
+            margin-top: unit(24, rpx);
+            padding: 0 unit(44, rpx);
+            border: 1px solid #999;
+            border-radius: unit(36, rpx);
+            font-size: unit(28, rpx);
+            color: #333333;
+
+            & > text {
+              margin-left: unit(12, rpx);
+            }
+          }
+        }
+
+        &__choose {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          padding: unit(30, rpx) 0;
+          font-size: unit(30, rpx);
+
+          .choose-left {
+            display: flex;
+            align-items: center;
+
+            & > text {
+              margin-left: unit(16, rpx);
+            }
+          }
+
+          .choose-right {
+            display: flex;
+            align-items: center;
+            color: #999999;
+            font-size: unit(26, rpx);
+
+            & > text {
+              margin-right: unit(4, rpx);
+            }
+          }
+        }
+
+        &__info {
+          background: #F7F7F7;
+          border-radius: unit(12, rpx);
+          padding: unit(24, rpx) unit(28, rpx);
+          font-size: unit(28, rpx);
+
+          .info-row + .info-row {
+            margin-top: unit(16, rpx);
+          }
+
+          .info-tip {
+            color: #999999;
+            font-size: unit(26, rpx);
+          }
+        }
+
+        &__empty {
+          .empty_txt {
+            padding: unit(30, rpx) 0;
+            color: #999999;
+          }
+        }
+      }
+
+      .drawer_content {
+        .ticket_title {
+          line-height: unit(100, rpx);
+          text-align: center;
+          font-size: unit(32, rpx);
+        }
+
+        .ticket_tab {
+          display: flex;
+          font-weight: 500;
+          font-size: unit(28, rpx);
+
+          & > view {
+            margin: 0 unit(24, rpx);
+            height: unit(72, rpx);
+            line-height: unit(72, rpx);
+          }
+        }
+
+        .ticket_content {
+          padding-bottom: unit(150, rpx);
+          overflow: auto;
+          position: relative;
+
+          .ticket_list {
+            max-height: 42vh;
+            overflow: auto;
+
+            .ticket_item {
+              width: unit(690, rpx);
+              border-radius: unit(10, rpx);
+              background: rgba(255, 255, 255, 1);
+              box-shadow: 0 0 6rpx 0 rgba(0, 0, 0, 0.1);
+              margin: unit(30, rpx) auto;
+              padding: unit(30, rpx) 0 unit(20, rpx);
+
+              ._header {
+                display: flex;
+                justify-content: space-between;
+                padding: 0 unit(30, rpx);
+                font-size: unit(28, rpx);
+              }
+
+              ._cont {
+                display: flex;
+                font-size: unit(18, rpx);
+                padding: unit(24, rpx) unit(30, rpx);
+                border-bottom: 1px solid rgba(242, 242, 242, 1);
+                color: #777777;
+              }
+
+              ._footer {
+                display: flex;
+                justify-content: space-between;
+                padding: unit(24, rpx) unit(30, rpx) unit(12, rpx);
+                font-size: unit(24, rpx);
+
+                ._item {
+                  display: flex;
+                  align-items: center;
+                }
+              }
+            }
+          }
+
+          .bottom_btn {
+            position: fixed;
+            width: 100%;
+            padding: unit(24, rpx) 0;
+            background: #FFFFFF;
+            box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
+            box-sizing: border-box;
+          }
+        }
+      }
+
+      .flex {
+        display: flex;
+      }
+
+      .align-center {
+        align-items: center;
+      }
+    }
+  }
+
+  ::v-deep .xd-up-drawer {
+    z-index: 9999 !important;
+  }
+</style>

package/src/components/JfbBaseCardConsumpCode/JfbBaseCardConsumpCodeLess.less

@@ -0,0 +1,79 @@
+/**
+* @desc 获取绝对路径完整地址
+* @param @path
+**/
+//例如：https://image.jufubao.cn/20220501010108/image/bg/default_gonghui_bg.png
+@basePath: 'business/';
+@doMain: '//sandbox-img.jufubao.cn/';
+
+.getBusinessImageUrl(@path, @size: 'size8') {
+  @url: "@{doMain}@{basePath}@{path}?x-oss-process=style/@{size}";
+  background-image: url(@url);
+}
+
+//start
+.jfb-base-card-consump-code {
+  box-sizing: border-box;
+
+  &__body{
+      position: relative;
+      overflow: hidden;
+      z-index: 2
+  }
+
+  &.editx,&.editx:hover {
+    position: relative;
+    min-height: unit(100, rpx);
+    z-index: 3;
+    &::after {
+      border: 2rpx dashed blue;
+      content: " ";
+      position: absolute;
+      top:0;
+      left:0;
+      bottom:0;
+      right:0;
+      z-index: 4;
+      cursor: pointer;
+    }
+
+  }
+
+
+  &__edit {
+    cursor: pointer;
+    position: absolute;
+    right: unit(0, rpx);
+    top: unit(-52, rpx);
+    height: unit(50, rpx);
+    line-height: unit(50, rpx);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background: rgba(0, 0, 0, .6);
+    border-radius: unit(10, rpx);
+    box-shadow: 0 0 10px rbga(0, 0, 0, 0.3);
+    color: #fff;
+    font-size: unit(22, rpx);
+
+    &-icon{
+      padding: 0 unit(20, rpx);
+    }
+
+    &.editx {
+      box-sizing: border-box;
+
+    }
+  }
+}
+//end
+
+
+/**notPreview**/
+.jfb-base-card-consump-code {
+  //&:before {
+    //content: " ";
+    //display: table;
+  //}
+}
+/**endNotPreview**/

package/src/components/JfbBaseCardConsumpCode/JfbBaseCardConsumpCodeMixin.js

@@ -0,0 +1,30 @@
+'use strict';
+
+
+//@AttrImport
+import Attr from "./Attr";
+//@EndAttrImport
+
+
+export default {
+  data() {
+    return {
+      //#ifdef H5
+      
+      //@AttrData
+      Attr:{}, //对外开发编辑属性
+      //@EndAttrData
+      
+      // #endif
+      cssRoot: 'jfb-base-card-consump-code'
+    }
+  },
+  created() {
+    
+    //@AttrDataCreated
+    this.Attr = this.$xdUniHelper.customClone(Attr);
+    //@EndAttrDataCreated
+    
+
+  },
+}

package/src/components/JfbBaseCardConsumpCode/Mock.js

@@ -0,0 +1,71 @@
+"use strict";
+
+module.exports = {
+  getCardYue: {},
+  getListEntryCardBind: {
+    list: [
+      {
+        card_number: "101001000008586",
+        card_type_name: "聚福宝福卡测试蛋糕",
+        end_time: "2027-07-31",
+        card_point: 99432830,
+        is_bind_card: true,
+        is_valid: "Y",
+        is_login: "Y",
+        unit: "点",
+        show_name: "聚福宝福卡测试蛋糕",
+        card_use_rule: "可凭本券到蛋糕(勿改)、电影(勿改)使用",
+        consume_type: "1",
+        is_auto_use: "N"
+      },
+      {
+        card_number: "101001000009318",
+        card_type_name: "聚福宝福卡（点12位）",
+        end_time: "2027-03-31",
+        card_point: 98700,
+        is_bind_card: true,
+        is_valid: "Y",
+        is_login: "N",
+        unit: "点",
+        show_name: "聚福宝福卡（点12位）",
+        card_use_rule: "可凭本券到电影(勿改)、商城(对应百货)(勿改)、蛋糕(勿改)使用",
+        consume_type: "1",
+        is_auto_use: "N"
+      },
+      {
+        card_number: "101001000009382",
+        card_type_name: "满50减50",
+        end_time: "2030-08-31",
+        card_point: 848815,
+        is_bind_card: true,
+        is_valid: "N",
+        is_login: "N",
+        unit: "点",
+        show_name: "满50减50",
+        card_use_rule: "满50减50",
+        consume_type: "2",
+        is_auto_use: "N"
+      }
+    ]
+  },
+  getBaseByIdCardDetail: {
+    is_show_qrcode_logo: "Y",
+    card_number: "101001000008586",
+    card_point: 99432830,
+    card_type_name: "聚福宝福卡测试蛋糕",
+    end_time: "2027-07-31",
+    card_status: "Y",
+    card_status_name: "开启",
+    card_qrcode: "//sandbox-apis.jufubao.cn/common/v1/image/qrcode?code_content=h.161.ktrd9ie2jnbkdb8",
+    barcode: "//sandbox-apis.jufubao.cn/common/v1/image/barcode?code_content=h.161.ktrd9ie2jnbkdb8",
+    card_qrcode_expire: 600,
+    unit: "点",
+    main_business_code_name: "蛋糕(勿改)",
+    other_card_point: 4073,
+    is_exchange: "N",
+    exchange_card_type_name: "福券",
+    exchange_card_point: 18330,
+    card_point_type: 2,
+    request_id: "ce26274fa52c8412"
+  }
+}

package/src/components/JfbBaseOrderDetail/JfbBaseOrderDetail.vue

@@ -179,7 +179,9 @@
               <view :style="{ color: mainColor }">{{item.status.status_name}}</view>
             </view>
             <view
-              style="border-bottom: 1px solid #eeeeee"
+              :style="{
+                borderBottom: info.is_ride_order ? '': '1px solid #eeeeee'
+              }"
               v-for="(Sitem, Sindex) in item.products"
               :key="Sindex"
             >
@@ -238,7 +240,7 @@
             </view>
             <view
               class="jfb-base-order-detail__body-delivery-bottom"
-              v-if="item.info && item.info.length > 0"
+              v-if="item.info && item.info.length > 0 && !info.is_ride_order"
             >
               <view class="jfb-base-order-detail__body-delivery-bottom-title">{{item.service_name}}</view>
               <view
@@ -259,6 +261,30 @@
           </view>
         </view>
         <!--mall code orders info-->
+
+        <view
+          v-if="info.is_ride_order"
+          :style="{
+            background: backgroundColor,
+            border: borderBox,
+            borderRadius: radius + 'rpx',
+            boxShadow: shadowBox,
+            marginBottom: padding + 'rpx',
+          }"
+          class="jfb-base-order-detail__body-card jfb-base-order-detail__body-booking"
+        >
+          <view class="jfb-base-order-detail__body-delivery-bottom-title">{{info.contacts_v2['title']}}</view>
+          <view class="jfb-base-order-detail__body-line"></view>
+          <view class="jfb-base-order-detail__body-booking-list">
+            <view v-for="(item,index) in info.contacts_v2['data']" :key="index" class="jfb-base-order-detail__body-booking-list-item">
+              <!-- <view :style="{color:mainColor,background:bgColor}" class="jfb-base-order-detail__body-booking-list-item-num">{{item.sub_title}}</view> -->
+              <view class="jfb-base-order-detail__body-booking-list-item-info">
+                <view class="jfb-base-order-detail__body-booking-list-item-info-item" v-for="(ls,index) in item['contact']" :key="index">{{ls.label}}：{{ls.value}}</view>
+              </view>
+            </view>
+          </view>
+        </view>
+        
         <view
           v-if="info.settle_tag_info"
           class="jfb-base-order-detail__body-card jfb-base-order-detail__body-settle"
@@ -913,7 +939,8 @@
           v-if="info.contacts_v2 &&
           info.contacts_v2['title'] &&
           info.contacts_v2['data'] &&
-          info.contacts_v2['data'].length > 0"
+          info.contacts_v2['data'].length > 0 &&
+          !info.is_ride_order"
           :style="{
             background: backgroundColor,
             border: borderBox,