jufubao-base 1.0.21 → 1.0.23-beta2

package/src/components/JfbBaseCardDetail/JfbBaseCardDetail.vue

@@ -1,549 +1,599 @@
 <template>
   <view
     class="jfb-base-card-detail"
-    @click="handleSelect"
-    :class="{ editx : isEditx && active }"
+    @click="handleEditxSelect"
+    :class="{
+      editx: isEditx && active,
+      noBorder: noBorder,
+    }"
   >
     <!--#ifdef H5-->
     <view
       class="jfb-base-card-detail__edit"
-      :class="{ editx : isEditx && active }"
-      v-if="isEditx && active"
+      :class="{ editx: isEditx && active }"
+      v-if="isEditx && active && !noBorder"
     >
       <view class="jfb-base-card-detail__edit-icon" @click="delEdit">删除</view>
     </view>
     <!-- #endif -->
-    <view class="jfb-base-card-detail__body">
-      <view class="jfb-base-card-detail__body-info" v-for="(item,index) in valueKey" :key="index">
-        <view class="jfb-base-card-detail__body-info-label">{{item.label}}</view>
-        <view class="jfb-base-card-detail__body-info-value">{{info[item.key]}}</view>
-        <view class="jfb-base-card-detail__body-info-relieve" @click="handleUnBindCard" v-if="item.key==='card_number'">解除绑定</view>
+    <view class="jfb-base-card-detail__body" v-if="info !== null">
+      <view class="jfb-base-card-detail__body-tips">提示：满减券仅支持微信补差，不接受现金补差</view>
+      <view
+        class="jfb-base-card-detail__body-info"
+        v-for="(item, index) in valueKey"
+        :key="index"
+      >
+        <view class="jfb-base-card-detail__body-info-label">{{item.label }}</view>
+        <view class="jfb-base-card-detail__body-info-value">{{info[item.key] }}</view>
+        <view
+          class="jfb-base-card-detail__body-info-relieve"
+          @click="handleUnBindCard"
+          v-if="item.key === 'card_number' && isShowUnbind"
+        >解除绑定</view>
       </view>
       <view class="jfb-base-card-detail__body-residue">
-        <view class="jfb-base-card-detail__body-residue-label">
-          <view>商城</view>
-          <view>剩余元宝</view>
-        </view>
-        <view class="jfb-base-card-detail__body-residue-value">
-          <view>{{info.card_point}}</view>
-          <xd-font-icon size="30" icon="iconyuanbao_mian"></xd-font-icon>
+        <view class="jfb-base-card-detail__body-residue-wrap">
+          <view class="jfb-base-card-detail__body-residue-label">
+            <view :style="{ color: '#242424', fontSize: '28rpx' }">剩余元宝</view>
+          </view>
+          <view class="jfb-base-card-detail__body-residue-value">
+            <xd-unit
+              iconSize="0.32"
+              :fontSize="28"
+              :price="info.card_point"
+              :is-old="true"
+              :unit="info.unit || ''"
+            ></xd-unit>
+          </view>
+          <view
+            v-if="info.other_card_point && info.card_point_type !== 1"
+            class="jfb-base-card-detail__body-residue-reach"
+          >购买其他物品可抵：{{ info.other_card_point }}</view>
         </view>
-      </view>
-      <view class="jfb-base-card-detail__body-tips">
-        提示：满减券仅支持微信补差，不接受现金补差
+        <view
+          class="jfb-base-card-detail__body-residue-business"
+          v-if="info.card_point_type !== 1"
+        >所属业务线：{{ info.main_business_code_name }}</view>
       </view>
       <view class="jfb-base-card-detail__body-qrcode">
         <view>
           <view>
-            <image mode="aspectFit" :src="info.card_qrcode"></image>
+            <image mode="aspectFit" :src="info.barcode"></image>
           </view>
         </view>
-        <view>
-          <view>
-            <image mode="aspectFit" :src="qrcode"></image>
-          </view>
+        <view style="position: relative">
+          <image
+            :style="{width: '300rpx', height: '300rpx'}"
+            :src="info.card_qrcode"
+          ></image>
+          <image v-if="isBrandLogo" class="logo-icon" :src="brandLogo"></image>
         </view>
-        <view v-if="timeStr" >消费二维码，有效期为{{info['card_qrcode_expire']/60}}分钟</view>
-        <view v-if="timeStr" >距离刷新还有{{timeStr}}</view>
+        <view :style="{marginTop: '20rpx'}" v-if="timeStr">消费二维码，有效期为{{ info["card_qrcode_expire"] / 60 }}分钟</view>
+        <view v-if="timeStr">距离刷新还有{{ timeStr }}</view>
       </view>
-<!--      <xd-edit-pwd-->
-<!--        :show.sync="editShow"-->
-<!--        :title="editTitle"-->
-<!--        :editPhone="editPhone"-->
-<!--        :showClose="true"-->
-<!--        @onGetCode="handleOnGetCode"-->
-<!--        @onSubmit="handleOnSubmit"-->
-<!--        @onClose="handleOnClose"-->
-<!--      ></xd-edit-pwd>-->
-<!--      <xd-pw-pay-->
-<!--        ref="pwPay"-->
-<!--        :input_len="6"-->
-<!--        :password="true"-->
-<!--        width="90%"-->
-<!--        :title="pwdTitle"-->
-<!--        :show.sync="show"-->
-<!--        :textList="textList"-->
-<!--        :showClose="true"-->
-<!--        @onSubmit="handlePwdOnSubmit"-->
-<!--        @onForget="handleOnForget"-->
-<!--        @onClose="handlePwdClose"-->
-<!--      ></xd-pw-pay>-->
+      <!--      <xd-edit-pwd-->
+      <!--        :show.sync="editShow"-->
+      <!--        :title="editTitle"-->
+      <!--        :editPhone="editPhone"-->
+      <!--        :showClose="true"-->
+      <!--        @onGetCode="handleOnGetCode"-->
+      <!--        @onSubmit="handleOnSubmit"-->
+      <!--        @onClose="handleOnClose"-->
+      <!--      ></xd-edit-pwd>-->
+      <!--      <xd-pw-pay-->
+      <!--        ref="pwPay"-->
+      <!--        :input_len="6"-->
+      <!--        :password="true"-->
+      <!--        width="90%"-->
+      <!--        :title="pwdTitle"-->
+      <!--        :show.sync="show"-->
+      <!--        :textList="textList"-->
+      <!--        :showClose="true"-->
+      <!--        @onSubmit="handlePwdOnSubmit"-->
+      <!--        @onForget="handleOnForget"-->
+      <!--        @onClose="handlePwdClose"-->
+      <!--      ></xd-pw-pay>-->
     </view>
   </view>
 </template>
 
 <script>
-  import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
-  import {jfbRootExec} from "@/utils/xd.event";
-  import JfbBaseCardDetailMixin from "./JfbBaseCardDetailMixin";
-  import XdPwPay from "@/components/XdPwPay/XdPwPay";
-  import XdEditPwd from "@/components/XdEditPwd/XdEditPwd";
-  import getBusinessImageUrl from "@/common/getBusinessImageUrl";
-
-  export default {
-    name: "JfbBaseCardDetail",
-    components: {
-      XdFontIcon,
-      XdPwPay,
-      XdEditPwd
-    },
-    mixins: [
-      JfbBaseCardDetailMixin
-    ],
-    data() {
-      return {
-        info: null,
-        valueKey: [
-          {
-            label: '票券号码',
-            key: 'card_number'
-          },
-          {
-            label: '票券类型',
-            key: 'card_type_name'
-          },
-          {
-            label: '票券状态',
-            key: 'card_status_name'
-          },
-          {
-            label: '有效期到',
-            key: 'end_time'
-          },
-        ],
-        timeStr: '',
-        timeer: null,
-        date: 2, //时间底数
-        time: 2, //时间幂指数
-        refrushTimeer: null,
-        maxTime: 30, //最大执行时间幂指数
-        editShow: false,
-        pwdTitle: '',
-        editPhone: '',
-        editTitle: '',
-        show: false,
-        textList: [],
-        password: '',
-        card_number: '',
-
-        userInfo: null, //用户信息
-        brandInfo: null, //brand
-
-        download: '',
-        qrcode: '',
-
-        //todo
+import XdFontIcon from "@/components/XdFontIcon/XdFontIcon";
+import { jfbRootExec } from "@/utils/xd.event";
+import JfbBaseCardDetailMixin from "./JfbBaseCardDetailMixin";
+import componentsMixins from "@/mixins/componentsMixins";
+import extsMixins from "@/mixins/extsMixins";
+import XdUnit from "@/components/XdUnit/XdUnit";
+import XdPwPay from "./XdPwPay";
+import XdEditPwd from "./XdEditPwd";
+import getBusinessImageUrl from "@/common/getBusinessImageUrl";
+import { Base64 } from "js-base64";
+import { getContainerPropsValue } from "@/utils/xd.base";
+import {mapState} from 'vuex';
+
+export default {
+  name: "JfbBaseCardDetail",
+  components: {
+    XdFontIcon,
+    XdPwPay,
+    XdEditPwd,
+    XdUnit,
+  },
+  mixins: [componentsMixins, extsMixins, JfbBaseCardDetailMixin],
+  computed:{
+    ...mapState(['brandInfo'])
+  },
+  data() {
+    return {
+      userInfo: null, //用户信息（暂时不可用）
+
+      info: null,
+      valueKey: [
+        {
+          label: "票券号码",
+          key: "card_number",
+        },
+        {
+          label: "票券类型",
+          key: "card_type_name",
+        },
+        {
+          label: "票券状态",
+          key: "card_status_name",
+        },
+        {
+          label: "有效期到",
+          key: "end_time",
+        },
+      ],
+      timeStr: "",
+      timeer: null,
+      date: 2, //时间底数
+      time: 2, //时间幂指数
+      refrushTimeer: null,
+      maxTime: 30, //最大执行时间幂指数
+      editShow: false,
+      pwdTitle: "",
+      editPhone: "",
+      editTitle: "",
+      show: false,
+      textList: [],
+      password: "",
+      card_number: "",
+      stopTimer: false, //停止轮询
+      download: "",
+      qrcode: "",
+      backUrl: "",
+
+      //品牌logo
+      brandLogo:
+        "data:image/png;base64,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",
+      isBrandLogo: false,
+
+      isShowUnbind: false, //是否启动绑定按钮
+    };
+  },
+  created() {},
+  methods: {
+    onJfbLoad(options) {
+      if (options["x-params"]) {
+        try {
+          let params = JSON.parse(Base64.decode(options["x-params"]));
+          this.brandLogo = params["qrcode_logo"];
+        } catch (e) {
+          console.warn(options["x-params"]);
+        }
       }
+
+      this.$nextTick(() => {
+        this.card_number = options.card_number;
+        this.init();
+
+        // if (card_number) {
+        //   this.card_number = card_number;
+        //   if (this.brandInfo['is_enable_pay_password'] === 'N') {
+        //     this.init();
+        //   } else if (this.brandInfo['is_enable_pay_password'] === 'Y' && this.userInfo['has_user_set_password'] === 'N') {
+        //     this.editShow = true
+        //     this.pwdTitle = '您还未设置支付密码，请设置您的平台支付密码'
+        //   } else if (this.brandInfo['is_enable_pay_password'] === 'Y' && this.userInfo['has_user_set_password'] === 'Y') {
+        //     this.show = true
+        //     this.textList = [
+        //       {
+        //         label: '查看卡详情',
+        //       },
+        //       {
+        //         label: '请输入支付密码',
+        //       }
+        //     ]
+        //   }
+        //   this.first = true;
+        // } else {
+        //   setTimeout(() => {
+        //     this.$xdUniHelper.navigateTo({
+        //       url: `/pages/index/index`
+        //     }, false)
+        //   }, 2000)
+        // }
+      });
     },
-    created() {
-      //todo
+    onJfbShow(options) {
+      console.log("event.onJfbShow", options);
+      this.onJfbLoad(options)
+      // if (this.first) {
+      //   if (this.brandInfo["is_enable_pay_password"] === "N") {
+      //     this.init();
+      //   } else if (
+      //     this.brandInfo["is_enable_pay_password"] === "Y" &&
+      //     this.userInfo["has_user_set_password"] === "N"
+      //   ) {
+      //     this.editShow = true;
+      //     this.pwdTitle = "您还未设置支付密码，请设置您的平台支付密码";
+      //   } else if (
+      //     this.brandInfo["is_enable_pay_password"] === "Y" &&
+      //     this.userInfo["has_user_set_password"] === "Y"
+      //   ) {
+      //     this.show = true;
+      //     this.textList = [
+      //       {
+      //         label: "查看卡详情",
+      //       },
+      //       {
+      //         label: "请输入支付密码",
+      //       },
+      //     ];
+      //   }
+      // }
     },
-    methods: {
-
-      onJfbLoad(options) {
-        this.$nextTick(() => {
-          this.userInfo = getApp().globalData.$xd['userInfo'];
-          this.brandInfo = getApp().globalData.$xd['brandInfo']
-          // this.download = getBusinessImageUrl('base_download.png')
-          // this.qrcode = getBusinessImageUrl('base_qr.png')
-          // this.editPhone = this.userInfo.mobile
-          let card_number = options.card_number;
-          this.card_number = card_number
-          this.init();
-          console.log(this.card_number,'options')
-          // if (card_number) {
-          //   this.card_number = card_number;
-          //   if (this.brandInfo['is_enable_pay_password'] === 'N') {
-          //     this.init();
-          //   } else if (this.brandInfo['is_enable_pay_password'] === 'Y' && this.userInfo['has_user_set_password'] === 'N') {
-          //     this.editShow = true
-          //     this.pwdTitle = '您还未设置支付密码，请设置您的平台支付密码'
-          //   } else if (this.brandInfo['is_enable_pay_password'] === 'Y' && this.userInfo['has_user_set_password'] === 'Y') {
-          //     this.show = true
-          //     this.textList = [
-          //       {
-          //         label: '查看卡详情',
-          //       },
-          //       {
-          //         label: '请输入支付密码',
-          //       }
-          //     ]
-          //   }
-          //   this.first = true;
-          // } else {
-          //   setTimeout(() => {
-          //     this.$xdUniHelper.navigateTo({
-          //       url: `/pages/index/index`
-          //     }, false)
-          //   }, 2000)
-          // }
-
-        });
 
-        // jfbRootExec('baiduUserLogin', {
-
-        //   vm: this,//   data: {
+    onJfbUnload() {
+      this.timeStr = ""
+      if (this.timeer) {
+        clearTimeout(this.timeer);
+      }
+      if (this.refrushTimeer) {
+        clearTimeout(this.refrushTimeer);
+      }
+    },
 
-        //     account: 'gaoshiyong',//     password: '123456789',//     type: 3,//     ...options
+    onJfbHide(options) {
+      this.timeStr = ""
+      if (this.timeer) {
+        clearTimeout(this.timeer);
+      }
+      if (this.refrushTimeer) {
+        clearTimeout(this.refrushTimeer);
+      }
+    },
 
-        //   }
+    onJfbBack(options) {
+      if (this.timeer) {
+        clearTimeout(this.timeer);
+      }
+      if (this.refrushTimeer) {
+        clearTimeout(this.refrushTimeer);
+      }
+      this.$xdUniHelper.navigateBack();
+    },
 
-        // }).then().catch()
-      },
-      onJfbScroll(options) {
-        console.log('event.onJfbScroll', options)
-      },
-      onJfbReachBottom(options) {
-        console.log('event.onJfbReachBottom', options)
-      },
-      onJfbShow(options) {
-        console.log('event.onJfbShow', options)
-        if (this.first) {
-          if (this.brandInfo['is_enable_pay_password'] === 'N') {
-            this.init();
-          } else if (this.brandInfo['is_enable_pay_password'] === 'Y' && this.userInfo['has_user_set_password'] === 'N') {
-            this.editShow = true
-            this.pwdTitle = '您还未设置支付密码，请设置您的平台支付密码'
-          } else if (this.brandInfo['is_enable_pay_password'] === 'Y' && this.userInfo['has_user_set_password'] === 'Y') {
-            this.show = true
-            this.textList = [
-              {
-                label: '查看卡详情',
-              },
-              {
-                label: '请输入支付密码',
-              }
-            ]
-          }
-        }
-      },
-      onJfbHide(options) {
-        console.log('event.onJfbHide', options)
-      },
-      onJfbBack(options) {
-        console.log('event.onJfbBack', options)
-        this.$xdUniHelper.navigateBack()
-      },
-      setInval(time) {
+    setInval(time) {
+      console.log("pppppp", time);
+      this.timeer = setInterval(() => {
         if (time === 0) {
-          this.timeStr = '00分00秒'
+          this.timeStr = "00分00秒";
+          clearInterval(this.timeer);
+          if (!this.stopTimer) this.detail();
         } else {
-          this.timeer = setInterval(() => {
-            if (time === 0) {
-              this.timeStr = '';
-              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);
+          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}秒`;
         }
-      },
-      handleUnBindCard() {
-        this.$xdConfirm({
-          content: '您确定要解除绑定卡券吗',
-          title: '系统提示',
-          width: '80%',
-          isTitle: true,
-          zIndex:2000,
-          success: (res) => {
-            if (res.confirm) {
-              jfbRootExec('deleteCardUnbind', {
-
-                vm: this,
-                data: {
-                  card_number: this.card_number
-                }
-
-              }).then(res => {
-                this.$xdUniHelper.navigateTo({
-                  url: `/pages/card/card`
-                }, false)
-              }).catch()
-            }
-          }
-        })
-
-      },
-      refrush() {
-        if (this.time >= this.maxTime) {
-          clearTimeout(this.refrushTimeer);
-          console.log('refrushTimeer.end');
-          return
-        }
-
-        this.time++;
-        let time = this.time >= 5 ? 32 * 1000 : Math.pow(this.date, this.time) * 1000;
-        this.refrushTimeer = setTimeout(() => {
-          jfbRootExec('getByIdCardDetail', {
-            vm: this,
-            data: {
-              card_number: this.card_number,
-            }
+      }, 1000);
+    },
 
-          }).then(res => {
-            this.info.card_qrcode = res.card_qrcode;
-            this.show = false
-          })
-            .catch(err => {
-              this.$refs['pwPay'].clearPwd()
+    handleUnBindCard() {
+      this.$xdConfirm({
+        styles: this.styles,
+        content: "您确定要解除绑定卡券吗",
+        title: "系统提示",
+        width: "80%",
+        isTitle: true,
+        zIndex: 2000,
+        success: (res) => {
+          if (res.confirm) {
+            this.timeStr = ""
+            clearTimeout(this.timeer);
+            clearTimeout(this.refrushTimeer);
+            this.stopTimer = true;
+            jfbRootExec("deleteCardUnbind", {
+              vm: this,
+              data: {
+                card_number: this.card_number + "",
+              },
             })
-          // this.getCardYue({card_number: this.card_number, password: this.password})
-          //   .then(res => {
-          //     //res[4]['value'] = this.$xdUniHelper.random(20,30);
-          //     let lists = this.$xdUniHelper.cloneDeep(this.card_info);
-          //     if (res && res.length > 0) {
-          //       res.map(yue => {
-          //         let key = yue['key'];
-          //         lists.map((list, index) => {
-          //           if (key === list['key']) {
-          //             lists.splice(index, 1, yue);
-          //           }
-          //         })
-          //       })
-          //     }
-          //     this.card_info = lists;
-          //
-          //     this.refrush();
-          //
-          //     this.show = false
-          //   })
-          //   .catch()
-
-        }, time);
-      },
-      init() {
-        this.detail();
-        this.refrush()
-      },
-      /**
-       * @description 获取卡详情
-       */
-      detail() {
-        jfbRootExec('getByIdCardDetail', {
+              .then((res) => {
+                this.$xdAlert({
+                  content: "解绑成功",
+                  close: () => {
+                    this.$xdUniHelper.redirectTo({
+                      url: this.backUrl || this.settings.index,
+                    });
+                  },
+                });
+              })
+              .catch((err) => {
+                console.log(err, "err");
+                this.stopTimer = false;
+              });
+          }
+        },
+      });
+    },
+
+    refrush() {
+      if (this.stopTimer) return;
+      if (this.time >= this.maxTime) {
+        clearTimeout(this.refrushTimeer);
+        console.log("refrushTimeer.end");
+        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) => {
+            //res[4]['value'] = this.$xdUniHelper.random(20,30);
+            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
+                  );
+              }
+            }
 
-        }).then(res => {
-            this.info = res;
-            this.setInval(Number(this.info['card_qrcode_expire']))
-            this.show = false
-          })
-          .catch(err => {
-            this.$refs['pwPay'].clearPwd()
+            this.info = refrushInfo;
+            this.refrush();
+            this.show = false;
           })
-      },
-      // handleOnGetCode(phone, callback) {
-      //   let params = {
-      //     phone,
-      //     send_type: this.userInfo['has_user_set_password'] === 'N' ? "set_password" : 'reset_password'
-      //   }
-      //   // this.sendCode(params).then(res => {
-      //   //   callback()
-      //   // }).catch(err => {
-      //   //
-      //   // })
-      // },
-      // handleOnSubmit(form) {
-      //   if (this.userInfo['has_user_set_password'] === 'N') {
-      //     let params = {
-      //       ...form
-      //     }
-      //     // this.setPassword(params).then(res => {
-      //     //   this.$xdAlert({
-      //     //     content: '设置密码成功',
-      //     //     time: 1500,
-      //     //     isClose: false,
-      //     //     zIndex: 5000
-      //     //   });
-      //     //   this.editShow = false
-      //     //   this.show = true
-      //     // })
-      //   } else {
-      //     let params = {
-      //       ...form
-      //     }
-      //     // this.editPassword(params).then(res => {
-      //     //   this.$xdAlert({
-      //     //     content: '修改密码成功',
-      //     //     time: 1500,
-      //     //     isClose: false,
-      //     //     zIndex: 5000
-      //     //   });
-      //     //   this.editShow = false
-      //     //   this.show = true
-      //     // })
-      //   }
-      // },
-      handleOnClose() {
-        this.editShow = false
-      },
-      handlePwdOnSubmit(val) {
-        this.password = val
-        this.init()
-      },
-
-      handleOnForget() {
-        this.editShow = true
-        this.editTitle = '请验证您的手机并修改支付密码'
-      },
-
-      handlePwdClose() {
-        this.$helper.navigateBack()
-      },
-    }
-  }
+          .catch();
+      }, time);
+    },
+
+    init() {
+      this.detail();
+      this.refrush();
+      if(this.$configProject.isPreview) {
+        this.timeStr = "01分19秒"
+      }
+      this.backUrl = getContainerPropsValue( this.container,  "content.back_url", { value: "" }).value;
+    },
+
+    /**
+     * @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.card_point) {
+            res["other_card_point"] = this.$xdUniHelper.divisionFloatNumber(res.other_card_point, 100);
+          }
+          this.info = res;
+          if(!this.$configProject.isPreview) {
+            this.setInval(this.info.card_qrcode_expire);
+          }
+          this.show = false;
+
+          //显示按钮
+          if (res["is_show_qrcode_logo"] === "Y") {
+            this.isBrandLogo = true;
+          }
 
+          this.isShowUnbind = (res["is_can_unbind"] === 'Y' || res["is_can_unbind"] === undefined);
+        })
+        .catch((err) => {
+          // this.$refs["pwPay"].clearPwd();
+        });
+    },
+
+    handleOnClose() {
+      this.editShow = false;
+    },
+
+    handlePwdOnSubmit(val) {
+      this.password = val;
+      this.init();
+    },
+
+    handleOnForget() {
+      this.editShow = true;
+      this.editTitle = "请验证您的手机并修改支付密码";
+    },
+
+    handlePwdClose() {
+      this.$helper.navigateBack();
+    },
+  },
+};
 </script>
 
 <style scoped lang="less">
-  @import "./JfbBaseCardDetailLess.less";
+@import "./JfbBaseCardDetailLess.less";
+
+.jfb-base-card-detail {
+  border: 1px dashed rgba(0, 0, 0, 0);
+  box-sizing: border-box;
+
+  &__body {
+    color: #333;
+    .logo-icon {
+      width: unit(100, rpx) !important;
+      height: unit(100, rpx) !important;
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50rpx, -50rpx);
+    }
+    &-info {
+      display: flex;
+      align-items: center;
+      justify-content: flex-start;
+      font-size: unit(26, rpx);
+      padding: unit(40, rpx);
+      border-bottom: unit(2, rpx) solid #eeeeee;
+      background: #fff;
+
+      &-label {
+        width: unit(120, rpx);
+        color: #a6a6a6;
+        margin-right: unit(48, rpx);
+        text-align: center;
+      }
 
-  .jfb-base-card-detail {
-    border: 1px dashed rgba(0, 0, 0, 0);
-    box-sizing: border-box;
+      &-value {
+        flex: 1;
+      }
 
-    &__body {
-      &-info {
+      &-relieve {
+        // width: unit(100, rpx);
+        // height: unit(30, rpx);
+        border-radius: unit(20, rpx);
+        border: unit(1, rpx) solid #999;
+        font-size: unit(24, rpx);
+        color: #999;
+        text-align: center;
+        line-height: unit(32, rpx);
+        padding: unit(6, rpx) unit(16, rpx);
+      }
+    }
+
+    &-residue {
+      padding: unit(40, rpx);
+      background: #fffdf5;
+
+      &-wrap {
         display: flex;
         align-items: center;
-        justify-content: flex-start;
-        font-size: unit(30, rpx);
-        padding: unit(60, rpx);
-        border-bottom: unit(2, rpx) solid #EEEEEEFF;
-
-        &-label {
-          width: unit(120, rpx);
-          color: #A6A6A6;
-          margin-right: unit(70, rpx);
-          text-align: center;
-        }
-
-        &-value {
-          flex: 1;
-        }
+      }
 
-        &-relieve {
-          width: unit(100, rpx);
-          height: unit(30, rpx);
-          border-radius: unit(10, rpx);
-          border: unit(1, rpx) solid #CCCCCC;
-          font-size: unit(18, rpx);
-          color: #CCCCCC;
-          text-align: center;
-        }
+      &-reach {
+        color: #777777;
+        font-size: unit(20, rpx);
+        flex: 1;
+        text-align: right;
       }
 
-      &-residue {
-        display: flex;
-        padding: unit(60, rpx);
-        background: #FCFCFC;
-
-        &-label {
-          margin-right: unit(70, rpx);
-
-          & > view:nth-child(1) {
-            width: unit(60, rpx);
-            height: unit(30, rpx);
-            border-radius: unit(10, rpx);
-            color: #8D5F18;
-            font-size: unit(18, rpx);
-            background: #FFE786;
-            text-align: center;
-          }
+      &-business {
+        padding-top: unit(20, rpx);
+        border-radius: unit(10, rpx);
+        color: #ba9968;
+        font-size: unit(20, rpx);
+        line-height: unit(30, rpx);
+      }
 
-          & > view:nth-child(2) {
-            color: #242424;
-            font-size: unit(32, rpx);
-          }
-        }
+      &-label {
+        margin-right: unit(48, rpx);
+      }
 
-        &-value {
-          display: flex;
-          /*align-items: center;*/
-          padding-top: unit(25, rpx);
+      &-value {
+        display: flex;
+        /*align-items: center;*/
+        // padding-top: unit(25, rpx);
 
-          & > view:nth-child(1) {
-            color: #FF5733;
-            font-size: unit(40, rpx);
-            margin-right: unit(10, rpx);
-          }
+        & > view:nth-child(1) {
+          color: #ff5733;
+          font-size: unit(40, rpx);
+          margin-right: unit(10, rpx);
         }
       }
+    }
 
-      &-tips {
-        background: #FDFCEC;
-        font-size: unit(24, rpx);
-        text-align: center;
-        color: #F86E21;
-        padding: unit(20, rpx) 0;
-      }
+    &-tips {
+      background: #fdfcec;
+      font-size: unit(24, rpx);
+      text-align: center;
+      color: #f86e21;
+      padding: unit(20, rpx) 0;
+    }
 
-      &-qrcode {
-        text-align: center;
-        font-size: @xd-font-size-base;
-        line-height: unit(36, rpx);
+    &-qrcode {
+      text-align: center;
+      font-size: @xd-font-size-base;
+      line-height: unit(36, rpx);
 
-        & > view {
-          margin-bottom: unit(20, rpx);
+      & > view {
+        // margin-bottom: unit(20, rpx);
 
-          & > view {
-            margin-bottom: 0;
-          }
+        & > view {
+          margin-bottom: 0;
         }
+      }
 
-        & > view:nth-child(1) {
+      & > view:nth-child(1) {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        box-sizing: border-box;
+        height: unit(200, rpx);
+        width: 100%;
+        margin-top: unit(20, rpx);
+
+        & > view {
+          width: 100%;
+          height: unit(200, rpx);
+          padding: unit(10, rpx);
           display: flex;
           justify-content: center;
           align-items: center;
-          box-sizing: border-box;
-          height: unit(200, rpx);
-          width: 100%;
-          margin-top: unit(100, rpx);
-
-          & > view {
-            width: 100%;
-            height: unit(200, rpx);
-            padding: unit(10, rpx);
-            display: flex;
-            justify-content: center;
-            align-items: center;
-
-            & > image {
-              max-width: 100%;
-              max-height: unit(200, rpx);
-            }
+
+          & > image {
+            max-width: 100%;
+            max-height: unit(200, rpx);
           }
         }
+      }
+
+      & > view:nth-child(2) {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        padding: unit(20, rpx);
 
-        & > view:nth-child(2) {
+        & > view {
+          width: unit(450, rpx);
           height: unit(450, rpx);
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          padding: unit(20, rpx);
+          padding: unit(10, rpx);
 
-          & > view {
+          & > image {
             width: unit(450, rpx);
             height: unit(450, rpx);
-            padding: unit(10, rpx);
-
-            & > image {
-              width: unit(450, rpx);
-              height: unit(450, rpx);
-            }
           }
-
-
         }
       }
     }
   }
+}
 </style>