jufubao-base 1.0.208 → 1.0.209-beta2

package/package.json

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

package/src/components/JfbBaseCardInfo/JfbBaseCardInfo.vue

@@ -198,11 +198,11 @@ export default {
   },
   methods: {
     handleLabel(el){
-      this.card_password_focus = false;
-      this.card_number_focus = false;
-      setTimeout(()=>{
-        this[`${el}_focus`] = true;
-      },50)
+      // this.card_password_focus = false;
+      // this.card_number_focus = false;
+      // setTimeout(()=>{
+      //   this[`${el}_focus`] = true;
+      // },50)
     },
     handleIcon(){
       this.isPassword = !this.isPassword

package/src/components/JfbBaseConList/JfbBaseConList.vue

@@ -280,7 +280,8 @@ export default {
       btn_txt: "",
       btn_style: {},
       btnTextSize: '',
-      is_blank_page: 'Y'
+      is_blank_page: 'Y',
+      foreign_id: null
     };
   },
   computed: {
@@ -533,6 +534,7 @@ export default {
           namespace: this.pageBusinessCode,
           activity_id: this.activity_id,
           prize_id: item.prize_id,
+          foreign_id: this.foreign_id
         },
       })
         .then((res) => {
@@ -566,6 +568,7 @@ export default {
           distribution_method: this.method,
           namespace: this.pageBusinessCode,
           activity_id: this.activity_id,
+          foreign_id: this.foreign_id
         },
       })
         .then((res) => {
@@ -660,6 +663,7 @@ export default {
       console.log(this.pageBusinessCode, "pageNamespace");
       this.options = options;
       this.activity_id = options.activity_id;
+      this.foreign_id = options.foreign_id;
       this.method = options.distribution_method
         ? options.distribution_method
         : "entry";

package/src/components/JfbBaseNotice/Attr.js

@@ -291,7 +291,6 @@ export default {
         groupKey:'content',
         value: data['btnConfirmBgColor'] || '',
         placeholder: '请选择按钮背景颜色',
-        groupKey: "content",
       },
       {
         label: "按钮文字颜色:",

package/src/components/JfbBaseRecharge/Api.js

@@ -50,4 +50,25 @@ module.exports = [
     isConsole: true,
     disabled: true,
   },
+  {
+    mapFnName: "cardRechargeNew",
+    title: "获取卡券套餐列表",
+    path: "/card/v1/new-card-recharge/create-order",
+    isRule: false,
+    data: {
+      package_id: ['套餐ID', "String", "必填"]
+    },
+    isConsole: true,
+    disabled: true
+  },
+  {
+    mapFnName: "cardRechargeList",
+    title: "卡券充值下单",
+    path: "/card/v1/new-card-recharge/list",
+    isRule: false,
+    params: {},
+    isConsole: true,
+    disabled: true
+  },
+
 ];

package/src/components/JfbBaseRecharge/Attr.js

@@ -27,7 +27,6 @@ export default {
         placeholder: '请输入票券充值点数自定义文案',
         className: 'input80'
       },
-
       {
         label: '注意事项:',
         ele: 'xd-site-news',

package/src/components/JfbBaseRecharge/JfbBaseRecharge.vue

@@ -14,43 +14,47 @@
     </view>
     <!-- #endif -->
     <view class="jfb-base-recharge__body">
-      <view class="jfb-base-recharge__body-card">
-        <view>
-          <view class="jfb-base-recharge__body-form">
-            <input v-model="cardNumber" :placeholder="card_num_placeholder" />
+      <view class="recharge">
+        <view class="recharge-list">
+          <view class="recharge-item">
+            <view class="jfb-base-recharge__body-card">
+              <view>
+                <view class="jfb-base-recharge__body-form">
+                  <input v-model="cardNumber" :placeholder="card_num_placeholder" />
+                </view>
+                <view class="jfb-base-recharge__body-form">
+                  <input v-model="card_point" :placeholder="point_placeholder" />
+                </view>
+                <view
+                  v-if="amount && card_point"
+                  :style="{
+                    color: mainColor,
+                    fontSize: '24rpx',
+                    paddingBottom: '32rpx',
+                  }"
+                >支付金额：{{ amount }} 元</view>
+                <xd-button
+                  size="medium"
+                  type="primary"
+                  :bgColor="mainColor"
+                  @click="handleToRecharge"
+                  :disabled="!amount || !card_point || !cardNumber"
+                >提交</xd-button>
+              </view>
+            </view>
           </view>
-          <view class="jfb-base-recharge__body-form">
-            <input v-model="card_point" :placeholder="point_placeholder" />
-          </view>
-          <view
-            v-if="amount&&card_point"
-            :style="{
-              color: mainColor,
-              fontSize: '24rpx',
-              paddingBottom: '32rpx',
-            }"
-          >
-            支付金额：{{ amount }} 元
-          </view>
-          <xd-button
-            size="medium"
-            type="primary"
-            :bgColor="mainColor"
-            @click="handleToRecharge"
-            :disabled="!amount || !card_point || !cardNumber"
-            >提交</xd-button>
         </view>
+        <view class="xd-notice-content" v-if="content">
+          <view>注意事项:</view>
+          <view v-html="content" class="prod_info"></view>
+        </view>
+        <view
+          v-if="isPreview && statusContent === true && content === '' "
+          class="xd-notice"
+          :style="{ color: dangerColor,fontSize: 24 + 'rpx',backgroundColor:noticeBgc }"
+        >注意事项未配置数据，因此改模块在正式环境将不显示</view>
+        <view class="bottom_btn-mask"></view>
       </view>
-      <view class="xd-notice-content" v-if="content">
-        <view>注意事项:</view>
-        <view v-html="content" class="prod_info"></view>
-      </view>
-      <view
-        v-if="isPreview && statusContent === true && content === '' "
-        class="xd-notice"
-        :style="{ color: dangerColor,fontSize: 24 + 'rpx',backgroundColor:noticeBgc }"
-      >注意事项未配置数据，因此改模块在正式环境将不显示</view>
-      <view class="bottom_btn-mask"></view>
     </view>
   </view>
 </template>
@@ -58,24 +62,27 @@
 <script>
 import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
 import XdButton from "@/components/XdButton/XdButton";
+import XdUnit from "@/components/XdUnit/XdUnit.vue";
 import { jfbRootExec } from "@/utils/xd.event";
 import JfbBaseRechargeMixin from "./JfbBaseRechargeMixin";
 import { getContainerPropsValue } from "@/utils/xd.base";
 import componentsMixins from "@/mixins/componentsMixins";
 import extsMixins from "@/mixins/extsMixins";
 import Color from "color";
+import getServiceUrl from "@/common/getServiceUrl";
 export default {
   name: "JfbBaseRecharge",
   components: {
     XdFontIcon,
     XdButton,
+    XdUnit
   },
   mixins: [componentsMixins, extsMixins, JfbBaseRechargeMixin],
   data() {
     return {
+      closeMask: true,
       card_num_placeholder: "",
       point_placeholder: "",
-
       cardNumber: "",
       card_point: "",
       payPath: "",
@@ -117,20 +124,12 @@ export default {
      * @param container {object} 业务组件对象自己
      */
     init(container) {
-      this.card_num_placeholder = getContainerPropsValue(
-        this.container,
-        "content.card_num_placeholder",
-        "输入券号"
-      );
-      this.point_placeholder = getContainerPropsValue(
-        this.container,
-        "content.point_placeholder",
-        "充值点数"
-      );
-      this.payPath = getContainerPropsValue(container, "content.payPath", {
-        value: "",
-      }).value;
+      this.card_num_placeholder = getContainerPropsValue(this.container, "content.card_num_placeholder", "输入券号");
+      this.point_placeholder = getContainerPropsValue(this.container, "content.point_placeholder", "充值点数");
+      this.payPath = getContainerPropsValue(container, "content.payPath", {value: "",}).value;
     },
+
+
     getContent() {
       jfbRootExec("getListRechargeNewsContent", {
         vm: this,
@@ -149,6 +148,13 @@ export default {
           console.error(error);
         });
     },
+
+    toLink(pay_order_id, order_id){
+      this.$xdUniHelper.redirectTo({
+        url: `${this.payPath}?order_id=${pay_order_id}&main_order_id=${order_id}&type=recharge`,
+      }, false, true);
+    },
+
     handleToRecharge() {
       if (!this.cardNumber) {
         this.$xdAlert({ content: "请输入卡券号" });
@@ -158,7 +164,12 @@ export default {
         this.$xdAlert({ content: "请输入充值点数" });
         return;
       }
-      // this.$xdShowLoading({})
+
+      if( this.$configProject.isPreview) {
+        return;
+      }
+
+      this.$xdShowLoading({});
       jfbRootExec("cardRecharge", {
         vm: this,
         data: {
@@ -168,41 +179,47 @@ export default {
       })
         .then((res) => {
           this.$xdHideLoading();
-          this.$xdUniHelper.navigateTo({
-            url: `${this.payPath}?order_id=${res.pay_order_id}&main_order_id=${res.order_id}&type=recharge`,
-          });
+          this.toLink(res.pay_order_id, res.order_id)
         })
         .catch((err) => {
           this.$xdHideLoading();
           console.log(err, "err");
         });
     },
+
     handleGetPrice(e) {
+      //未填写值
       if (!this.cardNumber || !this.card_point) {
         return;
       }
-      this.$xdShowLoading({});
+
+      //预览模式
+      if( this.$configProject.isPreview) {
+        this.amount = this.card_point;
+        return;
+      }
+
       jfbRootExec("getRechargeAmount", {
         vm: this,
         data: {
           card_number: this.cardNumber, //页面ID
-          card_point: this.card_point * 100, //组件ID
+          card_point: this.$xdUniHelper.multiplyFloatNumber(Number(this.card_point),100), //组件ID
         },
       })
         .then((res) => {
-          this.$xdHideLoading();
-          this.amount = res.amount / 100;
+          this.amount = this.$xdUniHelper.divisionFloatNumber(res.amount ,100);
         })
         .catch((err) => {
-          this.$xdHideLoading();
         });
     },
+
     onJfbUpdate(data) {
-      this.getContent();
-    },
-    onJfbScroll(options) {
-      console.log("event.onJfbScroll", options);
+      if( this.$configProject.isPreview) {
+        this.getContent();
+      }
+
     },
+
     onJfbShow(options) {
       this.onJfbLoad(options);
     },
@@ -219,17 +236,16 @@ export default {
 .jfb-base-recharge {
   &__body {
     &-card {
-      box-shadow: 0px unit(16, rpx) unit(60, rpx) 0px rgba(227, 227, 227, 0.37);
-      background: #ffffff;
-      padding: unit(48, rpx);
-      margin: unit(40, rpx);
+      box-shadow: 0 unit(16, rpx) unit(60, rpx) 0 rgba(227, 227, 227, 0.37);
       border-radius: unit(20, rpx);
+      background: #fff;
+      padding: 30rpx;
     }
     &-form {
       input {
         background: #eeeeee;
         border-radius: unit(16, rpx);
-        padding: unit(30, rpx) unit(40, rpx);
+        padding: unit(30, rpx);
         margin-bottom: unit(30, rpx);
       }
     }
@@ -258,10 +274,96 @@ export default {
       }
     }
     .xd-notice {
-      margin-top: unit(20, rpx);
+      margin-top: unit(40, rpx);
       padding: unit(40, rpx);
       border-radius: unit(15, rpx)
     }
   }
 }
+
+.recharge {
+  padding: 30rpx;
+
+  &-tab {
+    height: 100rpx;
+    margin-bottom: 15rpx;
+    display:flex;
+    justify-content: flex-start;
+    align-items: center;
+    & > view {
+      margin: 0 50rpx 0 0;
+      font-size: 32rpx;
+      position: relative;
+      height: 100%;
+      line-height: 100rpx;
+      cursor: pointer;
+    }
+
+    &-index {
+      height: 6rpx;
+      overflow: hidden;
+      border-radius: 4rpx;
+      position: absolute;
+      left: 0;
+      right: 0;
+      bottom: 16rpx;
+    }
+  }
+
+  .recharge-pack {
+    height: 330rpx;
+    background-position: top left;
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+    color: #fff;
+    padding: 30rpx;
+    box-sizing: border-box;
+    border-radius: 16rpx;
+    margin-bottom: 30rpx;
+    &:last-child {
+      margin-bottom: 0;
+    }
+
+    & .name {
+      font-size: 32rpx;
+      font-weight: 500;
+    }
+
+    & .price {
+      font-size: 28rpx;
+      font-weight: 400;
+      padding: 20rpx 0 10rpx;
+    }
+
+    & .time {
+      font-size: 28rpx;
+      font-weight: 400;
+    }
+
+    & .line {
+      margin: 20rpx 0;
+      height: 2rpx;
+      background: rgba(255,255,255,.2);
+    }
+
+    & .buy {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+
+      & > view:nth-child(2) {
+        height: 60rpx;
+        min-width: 120rpx;
+        text-align: center;
+        border-radius: 40rpx;
+        line-height: 60rpx;
+        border: 4rpx solid #fff;
+        padding: 0 25rpx;
+        font-size: 28rpx;
+
+      }
+    }
+
+  }
+}
 </style>

package/src/components/JfbBaseRechargeNew/Api.js

@@ -0,0 +1,35 @@
+'use strict';
+
+/**
+ * @description API模型
+ * 建议：Ffff=>模块  Xxxx=>自定义名字
+ * 获取单记录(getByIdFfffXxxx)
+ * 获取列表记录(getByListFfffXxxx)
+ * 添加列表记录(addFfffXxxxx)
+ * 删除列表记录(removeFfffXxxxx|deleteFfffXxxx)
+ * 更新列表记录(updateFfffXxxxx)
+ * @type {*[]}
+ */
+module.exports = [
+  {
+    mapFnName: "cardRechargeNew",
+    title: "获取卡券套餐列表",
+    path: "/card/v1/new-card-recharge/create-order",
+    isRule: false,
+    data: {
+      package_id: ['套餐ID', "String", "必填"]
+    },
+    isConsole: true,
+    disabled: true
+  },
+  {
+    mapFnName: "cardRechargeList",
+    title: "卡券充值下单",
+    path: "/card/v1/new-card-recharge/list",
+    isRule: false,
+    params: {},
+    isConsole: true,
+    disabled: true
+  },
+
+];

package/src/components/JfbBaseRechargeNew/Attr.js

@@ -0,0 +1,35 @@
+'use strict';
+
+/**
+ * @description 当表单组件中有联动操作时候，使用方法进行返回
+ */
+export default {
+  style: [],
+  content: (data) => {
+    return [
+      0&&{
+        label: '立即购买自定义文案:',
+        ele: 'el-input',
+        type: 'text',
+        valueKey: 'buyBtnName',
+        groupKey:'content',
+        value: data.buyBtnName || '',
+        placeholder: '请输入立即购买自定义文案',
+        className: 'input80'
+      },
+      {
+        label: '票券支付路径:',
+        ele: 'xd-select-pages-path',
+        valueKey: 'payPath',
+        groupKey:'advanced',
+        placeholder: '请选择票券支付路径',
+        value: data['payPath'] || {},
+        setting: {
+          router: XdBus.getParentApi('getPagesTree'),
+        },
+        inline: false,
+      },
+    ].filter(i=>i)
+  },
+  advanced: [ ],
+};

package/src/components/JfbBaseRechargeNew/JfbBaseRechargeNew.vue

@@ -0,0 +1,285 @@
+<template>
+  <view
+    class="jfb-base-recharge-new"
+    @click="handleEditxSelect"
+    :class="{ editx: isEditx && active }"
+  >
+    <!--#ifdef H5-->
+    <view
+      class="jfb-base-recharge-new__edit"
+      :class="{ editx: isEditx && active }"
+      v-if="isEditx && active"
+    >
+      <view class="jfb-base-recharge-new__edit-icon" @click="delEdit">删除</view>
+    </view>
+    <!-- #endif -->
+    <view class="jfb-base-recharge-new__body">
+      <view class="recharge">
+        <view class="recharge-list">
+          <view class="recharge-item">
+            <view
+              class="recharge-pack"
+              v-for="item in newCardList"
+              :key="item.package_id"
+              :style="{
+                backgroundImage: 'url('+  item['package_image'] +')',
+                color: item['package_color'] ? item['package_color']:'#fff'
+              }"
+            >
+              <view class="name">{{item.package_name}}</view>
+              <view class="price">面值：{{item.card_point}}</view>
+              <view class="time">有效期：{{item['valid_date']}}</view>
+              <view class="line"></view>
+              <view class="buy">
+                <view>
+                  <xd-unit
+                    :is-old="false"
+                    :price="item.card_amount"
+                    :color-new="item['package_color'] ? item['package_color']:'#fff'"
+                    :font-size="40"
+                    :icon-size=".3"
+                  ></xd-unit>
+                </view>
+                <view @click="handleNewBuy(item)">{{buyBtnName}}</view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
+import XdButton from "@/components/XdButton/XdButton";
+import XdUnit from "@/components/XdUnit/XdUnit.vue";
+import { jfbRootExec } from "@/utils/xd.event";
+import JfbBaseRechargeNewMixin from "./JfbBaseRechargeNewMixin";
+import { getContainerPropsValue } from "@/utils/xd.base";
+import componentsMixins from "@/mixins/componentsMixins";
+import extsMixins from "@/mixins/extsMixins";
+import Color from "color";
+import getServiceUrl from "@/common/getServiceUrl";
+export default {
+  name: "JfbBaseRechargeNew",
+  components: {
+    XdFontIcon,
+    XdButton,
+    XdUnit
+  },
+  mixins: [componentsMixins, extsMixins, JfbBaseRechargeNewMixin],
+  data() {
+    return {
+      closeMask: true,
+      isPreview: false,
+      buyBtnName: '立即购买' ,
+      newCardList:[],
+    };
+  },
+  watch: {
+    container(value,oldValue) {
+      if(JSON.stringify(value) === JSON.stringify(oldValue)) return;
+      if (this.$configProject['isPreview']) this.init(value)
+    },
+  },
+  created() {
+    this.isPreview = this.$configProject.isPreview;
+    this.init(this.container);
+  },
+  methods: {
+    onJfbLoad(options) {
+      this.getNewCardList();
+    },
+    /**
+     * @description 监听事件变化
+     * @param container {object} 业务组件对象自己
+     */
+    init(container) {
+      this.payPath = getContainerPropsValue(container, "content.payPath", {value: "",}).value;
+      this.buyBtnName = getContainerPropsValue(container, 'content.buyBtnName', '立即购买')
+    },
+
+    //==套餐购买=============
+    /**
+     * @description 获取套餐列表
+     */
+    getNewCardList(){
+      jfbRootExec("cardRechargeList", {
+        vm: this,
+        data: {},
+      })
+        .then((res) => {
+          this.newCardList = (res.list || []).map(item=>{
+            item['package_image'] = getServiceUrl(item['package_image']);
+            item['card_point'] = `${this.$xdUniHelper.divisionFloatNumber(item['card_point'],100)}`
+            if(item['card_unit']){
+              item['card_point'] = `${item['card_point']} ${item['card_unit']}`
+            }
+            return item;
+          });
+        })
+        .catch((error) => {
+          console.error(error);
+        });
+    },
+
+    handleNewBuy(item){
+      this.$xdShowLoading({});
+      jfbRootExec("cardRechargeNew", {
+        vm: this,
+        data: {
+          package_id: item.package_id,
+        },
+      })
+        .then((res) => {
+          this.$xdHideLoading();
+          this.toLink(res.pay_order_id, res.order_id)
+        })
+        .catch((err) => {
+          this.$xdHideLoading();
+          console.log(err, "err");
+        });
+
+    },
+    //==套餐购买=============
+
+    getContent() {
+      jfbRootExec("getListRechargeNewsContent", {
+        vm: this,
+        data: {
+          page_id: this.pageAttr["page_id"], //页面ID
+          container_id: this.containerId, //组件ID
+        },
+      })
+        .then((res) => {
+          if(res && res.list && res.list.length > 0) {
+            this.content = res.list[0].content;
+          }
+          this.statusContent = true;
+        })
+        .catch((error) => {
+          console.error(error);
+        });
+    },
+
+    toLink(pay_order_id, order_id){
+      if(!this.payPath) {
+        this.$xdAlert({
+          time: 3000,
+          content: '支付路径未设置，清检查配置',
+          type: 'error',
+          isClose: false
+        })
+        return;
+      }
+      this.$xdUniHelper.redirectTo({
+        url: `${this.payPath}?order_id=${pay_order_id}&main_order_id=${order_id}&type=recharge`,
+      }, false, true);
+    },
+
+    onJfbShow(options) {
+      this.onJfbLoad(options);
+    },
+    onJfbCustomEvent(options) {
+      console.log("event.onJfbReachBottom", options);
+    },
+  },
+};
+</script>
+
+<style scoped lang="less">
+@import "./JfbBaseRechargeNewLess.less";
+
+.jfb-base-recharge-new {
+  &__body {
+    .recharge {
+      padding: 30rpx;
+
+      &-tab {
+        height: 100rpx;
+        margin-bottom: 15rpx;
+        display:flex;
+        justify-content: flex-start;
+        align-items: center;
+        & > view {
+          margin: 0 50rpx 0 0;
+          font-size: 32rpx;
+          position: relative;
+          height: 100%;
+          line-height: 100rpx;
+          cursor: pointer;
+        }
+
+        &-index {
+          height: 6rpx;
+          overflow: hidden;
+          border-radius: 4rpx;
+          position: absolute;
+          left: 0;
+          right: 0;
+          bottom: 16rpx;
+        }
+      }
+
+      .recharge-pack {
+        height: 330rpx;
+        background-position: top left;
+        background-size: 100% 100%;
+        background-repeat: no-repeat;
+        color: #fff;
+        padding: 30rpx;
+        box-sizing: border-box;
+        border-radius: 16rpx;
+        margin-bottom: 30rpx;
+        &:last-child {
+          margin-bottom: 0;
+        }
+
+        & .name {
+          font-size: 32rpx;
+          font-weight: 500;
+        }
+
+        & .price {
+          font-size: 28rpx;
+          font-weight: 400;
+          padding: 20rpx 0 10rpx;
+        }
+
+        & .time {
+          font-size: 28rpx;
+          font-weight: 400;
+        }
+
+        & .line {
+          margin: 20rpx 0;
+          height: 2rpx;
+          background: rgba(255,255,255,.2);
+        }
+
+        & .buy {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+
+          & > view:nth-child(2) {
+            height: 60rpx;
+            min-width: 120rpx;
+            text-align: center;
+            border-radius: 40rpx;
+            line-height: 60rpx;
+            border: 4rpx solid #fff;
+            padding: 0 25rpx;
+            font-size: 28rpx;
+
+          }
+        }
+
+      }
+    }
+  }
+}
+
+
+</style>

package/src/components/JfbBaseRechargeNew/JfbBaseRechargeNewLess.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-recharge-new {
+  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-recharge-new {
+  //&:before {
+    //content: " ";
+    //display: table;
+  //}
+}
+/**endNotPreview**/

package/src/components/JfbBaseRechargeNew/JfbBaseRechargeNewMixin.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-recharge-new'
+    }
+  },
+  created() {
+    
+    //@AttrDataCreated
+    this.Attr = this.$xdUniHelper.customClone(Attr);
+    //@EndAttrDataCreated
+    
+
+  },
+}

package/src/components/JfbBaseRechargeNew/Mock.js

@@ -0,0 +1,5 @@
+'use strict';
+
+module.exports = {
+  cardRecharge: {"amount":10000,"request_id":"1d4ab6e96e7fd54d"}
+}