域名改成https://bcar.barcblays.com/

dcc

2024-05-31 27601483c5031b5358368d08e4babed6d31c1d0e

 src/page/user/recharge-sure.vue

@@ -1,468 +1,468 @@
<template>
  <div class="wrapper">
    <!-- <div class="header">
      <mt-header title="充值说明">
        <router-link to="/recharge" slot="left">
          <mt-button icon="back">充值</mt-button>
        </router-link>
      </mt-header>
    </div> -->
    <div class="box1">
      <div class="form-block page-part">
        <mt-field label="充值金额" placeholder="充值金额" disabled type="number" v-model="selectNumber"></mt-field>
        <div v-if="type == 0">
          <mt-field label="支付宝名称" placeholder="支付宝名称" disabled type="text" v-model="payInfo.channelName">
          </mt-field>
          <mt-field label="支付宝账号" placeholder="支付宝账号" disabled type="text" v-model="payInfo.channelAccount">
                    <span v-clipboard:copy="payInfo.channelAccount"
                          v-clipboard:success="onCopy"
                          v-clipboard:error="onError">
                        <i class="iconfont icon-fuzhi"></i>复制
                    </span>
          </mt-field>
          <div class="text-right" style="padding: 0.2rem 0.3rem 0;" @click="popupVisible2 = true">查看支付宝限额说明</div>
        </div>
        <div v-else-if="type == 1">
          <mt-field label="收款名称" placeholder="收款名称" disabled type="text" v-model="payInfo.channelName">
                    <span v-clipboard:copy="payInfo.channelName"
                          v-clipboard:success="onCopy"
                          v-clipboard:error="onError">
                        <i class="iconfont icon-fuzhi"></i>复制
                    </span>
          </mt-field>
          <mt-field label="收款银行" placeholder="收款银行" disabled type="text" v-model="payInfo.channelDesc">
                    <span v-clipboard:copy="payInfo.channelDesc"
                          v-clipboard:success="onCopy"
                          v-clipboard:error="onError">
                        <i class="iconfont icon-fuzhi"></i>复制
                    </span>
          </mt-field>
          <!-- <mt-field label="收款支行" placeholder="收款支行" disabled type="text" v-model="payInfo.payBankAddress">
              <span v-clipboard:copy="info.payBankAddress"
                  v-clipboard:success="onCopy"
                  v-clipboard:error="onError">
                  <i class="iconfont icon-fuzhi"></i>复制
              </span>
          </mt-field> -->
          <mt-field label="收款账号" placeholder="收款账号" disabled type="text" v-model="payInfo.channelAccount">
                    <span v-clipboard:copy="payInfo.channelAccount"
                          v-clipboard:success="onCopy"
                          v-clipboard:error="onError">
                        <i class="iconfont icon-fuzhi"></i>复制
                    </span>
          </mt-field>
        </div>
        <div v-else>
          <mt-field label="收款方" placeholder="收款方" disabled type="text" v-model="payInfo.channelName">
          </mt-field>
          <mt-field label="收款账号" placeholder="收款账号" disabled type="text" v-model="payInfo.channelAccount">
                    <span v-clipboard:copy="payInfo.channelAccount"
                          v-clipboard:success="onCopy"
                          v-clipboard:error="onError">
                        <i class="iconfont icon-fuzhi"></i>复制
                    </span>
          </mt-field>
          <mt-field v-if="payInfo.channelDesc" label="备注" placeholder="备注" disabled type="text"
                    v-model="payInfo.channelDesc">
                    <span v-clipboard:copy="payInfo.channelDesc"
                          v-clipboard:success="onCopy"
                          v-clipboard:error="onError">
                        <i class="iconfont icon-fuzhi"></i>复制
                    </span>
          </mt-field>
          <div v-if="payInfo.channelImg" class="eq-code-img">
            <img :src="payInfo.channelImg" alt="">
  <div>
    <van-nav-bar :placeholder="true" :safe-area-inset-top="true" :title="$t('提款')" left-arrow @click-left="onClickLeft">
      <template #right>
        <van-icon @click="$router.push('/cashlist')" name="orders-o" size="20" />
      </template>
    </van-nav-bar>
    <main>

      <div class="main-title">{{ $t("提款帐户") }}</div>
      <van-cell is-link :title="rechargeAccountData.name || $t('請選擇')" @click="rechargeAccountShow = true" />
      <van-action-sheet v-model="rechargeAccountShow" :actions="rechargeAccountActions" :cancel-text="$t('hj106')"
        close-on-click-action @select="rechargeAccountSelect" />
      <div class="main-title">{{ $t("姓名") }}</div>
      <div class="white-input">
        <input type="text" :disabled="true" :placeholder="$t('请将姓名设置为')" :value="actualName"
          @input="actualNameInputValue" />
        <!--        <van-icon class="myr" name="arrow" />-->
      </div>
      <div class="main-title">{{ $t("hj213") }}</div>
      <div class="white-input">
        <input type="text" :disabled="true" :placeholder="$t('请设置银行名称')" :value="bankCard.bankName"
          @input="bankNameInputValue" />
        <!--        <van-icon class="myr" name="arrow" />-->
        <i class="iconfont icon-fuzhi fuzhi" @click="(e) => copyText(e, bankCard.bankName)"></i>
      </div>
      <div class="main-title">{{ $t("银行帐号") }}</div>
      <div class="white-input">
        <input type="number" :disabled="true" :placeholder="$t('请将银行账户设置为')" :value="bankCard.bankNo"
          @input="bankNoInputValue" />
        <!--        <van-icon class="myr" name="arrow" />-->
        <i class="iconfont icon-fuzhi fuzhi" @click="(e) => copyText(e, bankCard.bankNo)"></i>
      </div>
      <div class="main-title">IFSC</div>
      <div class="white-input">
        <input type="text" :disabled="true" :placeholder="$t('请设置ifsc')" :value="bankCard.bankAddress"
          @input="ifscInputValue" />
        <!--        <van-icon class="myr" name="arrow" />-->
        <i class="iconfont icon-fuzhi fuzhi" @click="(e) => copyText(e, bankCard.bankAddress)"></i>
      </div>
      <!--      <van-cell-->
      <!--        is-link-->
      <!--        :title="paymentSelectData.channelAccount || $t('请设置ifsc')"-->
      <!--        @click="paymentShow = true"-->
      <!--      />-->
      <!--      <van-action-sheet-->
      <!--        v-model="paymentShow"-->
      <!--        :actions="paymentActions"-->
      <!--        :cancel-text="$t('qx')"-->
      <!--        close-on-click-action-->
      <!--        @select="paymentSelect"-->
      <!--      />-->

      <!--      <van-cell-->
      <!--        is-link-->
      <!--        :title="rechargeAccountData.name || $t('请将银行账户设置为')"-->
      <!--        @click="rechargeAccountShow = true"-->
      <!--      />-->
      <!--      <van-action-sheet-->
      <!--        v-model="rechargeAccountShow"-->
      <!--        :actions="rechargeAccountActions"-->
      <!--        :cancel-text="$t('hj106')"-->
      <!--        close-on-click-action-->
      <!--        @select="rechargeAccountSelect"-->
      <!--      />-->

      <!--      <van-cell is-link :title="bankCard.bankName || $t('请设置银行名称')" />-->

      <!--      <van-cell is-link :title="paymentSelectData.channelName || $t('请将姓名设置为')" />-->
      <!--      <div class="main-title">{{ $t("支持得提款渠道") }}</div>-->
      <!--      <van-cell-->
      <!--        is-link-->
      <!--        :title="rechargeSelect.name || $t('請選擇')"-->
      <!--        @click="show = true"-->
      <!--      />-->
      <!--      <van-action-sheet-->
      <!--        v-model="show"-->
      <!--        :actions="actions"-->
      <!--        :cancel-text="$t('hj106')"-->
      <!--        close-on-click-action-->
      <!--        @select="select"-->
      <!--      />-->
      <!--      <div v-if="rechargeSelect.key !== undefined">-->
      <!--        <div class="main-title">{{ $t("請選擇銀行卡") }}</div>-->
      <!--        <van-cell is-link :title="bankCard.bankNo || $t('請選擇')" />-->
      <!--      </div>-->
      <div class="main-title">{{ $t("請選擇充值金額") }}</div>
      <div class="white-input">
        <input type="number" :value="value" @input="inputValue" />
        <span class="myr" @click="value = availableBalanceUSD">{{
          $t("最大")
        }}</span>
      </div>
      <div>
        <div class="dz-title" v-if="rechargeAccountData.key !== undefined">
          <div>{{ $t("可用餘額") }}</div>
          <div class="balance-text">
            {{ availableBalanceUSD }} {{ symbolCode }}
            <!-- {{ symbolCode }} -->
          </div>
        </div>
      </div>
      <div v-if="type == 0">
        <div class="tips-group">
          <p><i class="iconfont icon-jinggao1"></i>注意事项：</p>
          <p class="tip-text"><i class="iconfont icon-jingpaibuzhou"></i>由于支付收款上限限制，每次收款公户可能不一样，<span class="red">请每次充值前获取最新的二维码完成支付</span>
          </p>
          <p class="tip-text"><i class="iconfont icon-jingpaibuzhou3"></i>如果您的网络环境不稳定，或由于设备、环境、偏好、行为、关系、账户、身份等维度问题，<span
            class="red">可能导致支付宝风控系统提示风险，请您在安全的环境下发起支付</span></p>
          <p class="tip-text"><i class="iconfont icon-jingpaibuzhou2"></i>为确保入金及时到账，<span class="red">请确认您输入的金额和提交的充值金额一致</span>.
          </p>
          <p class="tip-text"><i class="iconfont icon-jingpaibuzhou1"></i>受支付宝到账通知时间影响,入金时间到账时间可能会延迟，请耐心等待.</p>
        </div>
        <div v-if="payInfo.channelImg" class="btnbox">
          <span class="text-center btnok" @click="toSure">点击获取二维码</span>
        </div>
        <div v-if="false" class="tips-group">
          <p><i class="iconfont icon-liucheng"></i>充值方式：</p>
          <p class="tip-text"><i class="iconfont icon-buzhou"></i>将二维码保存到本地，打开支付宝扫描二维码，转账到平台指定对公账户</p>
          <p class="tip-text"><i class="iconfont icon-buzhou2"></i>点击“复制”，复制支付宝账号，打开支付宝点击转账，转账到平台指定对公账户</p>
        </div>
      </div>
      <div v-else-if="type == 1">
        <div class="tips-group">
          <p><i class="iconfont icon-liucheng"></i>操作流程：</p>
          <p class="tip-text"><i class="iconfont icon-buzhou"></i>点击“复制”，复制信息</p>
          <p class="tip-text"><i class="iconfont icon-buzhou2"></i>完成复制，打开手机银行进行转账</p>
        </div>
        <div class="tips-group red">
          <p><i class="iconfont icon-jinggao1"></i>注意事项：</p>
          <p class="tip-text"><i class="iconfont icon-jingpaibuzhou"></i>为确保入金及时到账，请确认您输入的金额和提交的充值金额一致.</p>
        </div>
      </div>
      <div v-else>

      </div>

    </div>

    <!-- 倒计时弹框 -->
    <mt-popup v-model="popupVisible" pop-transition='popup-fade' :closeOnClickModal="false" class="mint-popup-white">
      <div class="clearfix">
        <a @click="closePopup" class="pull-right"><i class="iconfont icon-weitongguo"></i></a>
      </div>
      <div class="box-block">
        <p class="text-center">
          <i v-if="type == 0" class="iconfont icon-umidd17"></i>
          <i v-if="type == 1" class="iconfont icon-02"></i>
        </p>
        <div class="prompt-box text-center">
          扫码后请输入以下金额支付
        </div>
        <p class="text-center money">
          ₹<span class="number">{{selectNumber}}</span>
        </p>
        <div class="qrCode">
          <!-- <img src="../../assets/img/timg.png" alt="二维码"> -->
          <img :src="payInfo.channelImg" alt="二维码">
          <div v-if="stopTime" class="alert-box">
            <i class="iconfont icon-jinggao2"></i>
            支付已过期
      <div>
        <div class="dz-title" v-if="rechargeAccountData.key !== undefined">
          <div>{{ $t("最低取款金额") }}</div>
          <div class="balance-text">
            {{ withMinAmt }} {{ symbolCode }}
          </div>
        </div>
        <div class="timer-box">
          {{time.minutes}}:{{time.seconds}}
        </div>
        <div class="scan">
          <span v-if="type == 0">打开支付宝扫一扫</span>
          <span v-if="type == 1">打开微信扫一扫</span>
        </div>
      </div>
    </mt-popup>
    <mt-popup v-model="popupVisible2" pop-transition='popup-fade' :closeOnClickModal="false"
              class="mint-popup-white mint-popup-white1">
      <div class="clearfix">
        <a @click="popupVisible2 = false" class="pull-right"><i class="iconfont icon-weitongguo"></i></a>
      </div>
      <img width="100%" src="../../assets/img/xiane.png" alt="">
    </mt-popup>
      <!--      <van-cell-group v-if="rechargeAccountData.key !== undefined">-->
      <!--        <van-cell :title="$t('最低取款金额')" :value="withMinAmt + symbolCode" />-->
      <!--      </van-cell-group>-->
      <van-button class="but" type="primary" style="margin-top: 1.04rem; margin-bottom: 1.04rem"
        @click="setOutMoney">{{ $t("提款") }}</van-button>
    </main>
  </div>
</template>

<script>
import * as api from '@/axios/api'
import { Toast } from 'mint-ui'
  import {
    ActionSheet,
    Notify,
    Cell,
    CellGroup
  } from "vant";
  import ClipboardJS from "clipboard";
  import {
    getBankCard,
    getMoney,
    getSetting,
    outMoney,
    siteGetPayInfo
  } from "../../axios/api";

export default {
  components: {},
  props: {},
  data () {
    return {
      type: '0', // 0 支付宝扫码 1 对公转账
      selectNumber: 500,
      popupVisible: false, // 二维码倒计时
      minutes: 5,
      seconds: 0,
      time: {
        minutes: 5,
        seconds: '00'
  export default {
    components: {
      ActionSheet,
      [Notify.Component.name]: Notify.Component,
      Cell,
      CellGroup
    },
    data() {
      return {
        value: 0,
        paymentActions: [],
        paymentSelectData: "US",
        actualName: this.$store.state.userInfo.realName,
        show: false,

        // 提款聚到
        rechargeSelect: {},
        actions: [{
          name: this.$t("hj215"),
          key: "YHK"
        }],
        paymentShow: false,

        rechargeAccountShow: false,
        //  请选择提款账户
        rechargeAccountData: {},
        rechargeAccountActions: [{
            name: this.$t("US"),
            key: "US",
          },
          {
            name: this.$t("IN"),
            key: "IN",
          },
          // {
          //   name: this.$t("MAS"),
          //   key: "MAS",
          // },
          // {
          //   name: this.$t("HK"),
          //   key: "HK",
          // },
        ],

        bankCard: {},
        availableBalanceUSD: "0.0000",
        getMoneyList: [],
        assetsType: "",
        symbolCode: "",
        withMinAmt: ''
      };
    },
    mounted() {
      this.getykh();
      this.getMoneys();
      this.getPayInfos();
      this.setSetting()
    },
    methods: {
      async setSetting() {
        const res = await getSetting();
        if (res.status === 0) {
          this.withMinAmt = res.data.withMinAmt
        }
      },
      stopTime: false, // 倒计时结束提示
      timer: null, // 定时器
      info: {
        account: '收款账号',
        payName: '收款名称',
        payBank: '收款银行',
        payBankAddress: '收款支行',
        zhifubaoAccount: 'jintongxue2018@163.com',
        zhifubaoName: '中山市金有米信息咨询有限公司'
      async getPayInfos() {
        const res = await siteGetPayInfo();
        if (res.status === 0) {
          res.data.map((item) => {
            item.name = item.channelType;
          });
          this.paymentActions = res.data;
          console.log(this.paymentActions)
        }
        console.log(res);
      },
      popupVisible2: false, // 限额说明
      payInfo: {
        channelImg: ''
      } // 支付渠道的相关信息
    }
  },
  computed: {},
  created () {},
  mounted () {
    this.type = this.$route.query.type
    this.selectNumber = this.$route.query.selectNumber
    this.getPayInfo()
  },
  beforeDestroy () {
    window.clearInterval(this.timer)
  },
  watch: {},
  methods: {
    async getPayInfo () {
      // 获取支付渠道 详细信息
      let data = await api.getPayInfoDetail({ payId: this.$route.query.id })
      if (data.status === 0) {
        this.payInfo = data.data
      } else {
        Toast(data.msg)
      }
    },
    onCopy: function (e) {
      Toast('复制成功！')
    },
    onError: function (e) {
      Toast('复制失败，请重试！')
    },
    toSure () {
      // 充值
      if (this.selectNumber > this.payInfo.channelMaxLimit || this.selectNumber < this.payInfo.channelMinLimit) {
        Toast('一次最高充值' + this.payInfo.channelMaxLimit + ',最低充值' + this.payInfo.channelMinLimit)
      } else {
        this.popupVisible = true
        this.minutes = 5
        this.seconds = 0
        this.time.minutes = 5
        this.time.seconds = '00'
        this.stopTime = false
        this.timerInterval()
        // this.recharge()
      }
    },
    async recharge () {
      let opts = {
        amt: this.selectNumber,
        payType: this.type
      }
      let data = await api.inMoney(opts)
      if (data.status === 0) {
        // 成功
        Toast(data.msg ? data.msg : '充值成功!')
      } else {
        Toast(data.msg ? data.msg : '充值失败,请重新充值')
      }
    },
    closePopup () {
      // 关闭弹窗
      this.popupVisible = false
      this.$router.push('/recharge')
      window.clearInterval(this.timer)
    },
    goBack () {
      this.$router.back(-1)
    },
    num (n) {
      return n < 10 ? '0' + n : '' + n
    },
    timerInterval () {
      var _this = this
      _this.timer = window.setInterval(function () {
        if (_this.seconds === 0 && _this.minutes !== 0) {
          _this.seconds = 59
          _this.minutes -= 1
        } else if (_this.minutes === 0 && _this.seconds === 0) {
          // 倒计时结束
          _this.seconds = 0
          _this.stopTime = true
          this.$router.push('/recharge')
          window.clearInterval(_this.timer)
      async setOutMoney() {
        const res = await outMoney({
          amt: this.value,
          assetsType: this.accectType,
        });
        if (res.status === 0) {
          Notify({
            type: "success",
            message: this.$t("hj182")
          });
          setTimeout(() => {
            this.$router.push("/cashlist");
          }, 500);
        } else {
          _this.seconds -= 1
          Notify(res.msg);
        }
        _this.time.minutes = _this.num(_this.minutes)
        _this.time.seconds = _this.num(_this.seconds)
      }, 1000)
    }
  }
}
</script>
<style lang="less" scoped>
  .pay-img {
    padding: 0 0.2rem;
    padding-top: 0.417rem;

    img {
      width: 100%;
    }
  }

  .pay-radio {
    /* padding: 0.2rem 0.1rem; */

    margin-bottom: 0.2rem;
    height: 0.8rem;
    line-height: 0.75rem;

    .pay-icon {
      .iconfont {
        margin-right: 0.2rem;
      }
    }

    .pay-list {
      border: 0.02rem solid #4e4d4d;
      border-radius: 0.2rem;
    }

    .pay-weixin {
      border-color: #36ae55;
    }

    .pay-zhifubao {
      // border-color:#1296db;
    }

    .icon-on {
      color: #b60c0d;
    }

  }

  .btn-default {
    border: 0.02rem solid #4e4d4d;
    border-radius: 0.2rem;
    display: inline-block;
    height: 0.8rem;
    width: 100%;
    text-indent: 0.2rem;
    background: none;
    color: #ddd;
  }

  .tips-group {
    padding: 0.2rem 0.417rem;

    .iconfont {
      margin-right: 0.2rem;
    }

    p {
      line-height: 2;
      font-size: 0.25rem;
    }

    .tip-text {
      text-indent: 0.28rem;
    }
  }

  .radio-group li {
    width: 19%;
    margin-right: 1%;
  }

  .mint-popup-white {
    color: #333;
    width: 80%;
    padding: 0.2rem 0.3rem 0;
    // bottom: 30%;
    border-radius: 0.1rem;
    box-shadow: 0.014rem 0.014rem 0.014rem rgba(103, 107, 111, 0.38);

    .popup-silide-bottom-leave-active {
      // bottom: -10%;
    }

    .box-block {
      .qrCode {
        border: 1px solid #f3f3f3;
        padding: 0.1rem;
        height: 3rem;
        width: 3rem;
        margin: 0.3rem auto;
        position: relative;

        img {
          width: 100%;
          height: 100%;
        //  Notify("请上传文件");
      },
      inputValue(e) {
        this.value = e.target.value;
      },
      ifscInputValue(e) {
        this.bankCard.bankAddress = e.target.value;
      },
      bankNoInputValue(e) {
        this.bankCard.bankNo = e.target.value;
      },
      bankNameInputValue(e) {
        this.bankCard.bankName = e.target.value;
      },
      actualNameInputValue(e) {
        this.actualName = e.target.value;
      },
      async getykh() {
        const res = await getBankCard();
        if (res.status === 0) {
          this.bankCard = res.data;
        }
      },
      async getMoneys() {
        const res = await getMoney();
        if (res.status === 0) {
          this.getMoneyList = res.data;
          res.data.map((item) => {
            if (item.accectType === this.rechargeAccountData.key) {
              this.availableBalanceUSD = item.availableBalance;
              this.symbolCode = item.symbolCode;
              this.accectType = item.accectType;
            }
          });
        }
      },
      afterRead(file) {
        // 此时可以自行将文件上传至服务器
        console.log(file);
      },
      copyText(e, data) {
        var clipboard = new ClipboardJS(".copy-button", {
          text: () => data,
        });

        .alert-box {
          width: 100%;
          height: 100%;
          background: rgba(255, 255, 255, 0.9);
          position: absolute;
          left: 0;
          top: 0;
          color: #333;
          text-align: center;
        clipboard.on("success", () => {
          // alert("已复制到剪贴板");
          clipboard.destroy();
        });

          .iconfont {
            color: #f98700;
            font-size: 0.6rem;
            display: block;
            margin-top: 0.8rem;
            margin-bottom: 0.4rem;
        clipboard.onClick(e);
      },
      onClickLeft() {
        this.$router.push("/user");
      },
      select(e) {
        this.rechargeSelect = e;
        console.log(e);
      },
      rechargeAccountSelect(e) {
        console.log(e)
        this.rechargeAccountData = e;
        (this.getMoneyList || []).map((item) => {
          if (item.accectType === this.rechargeAccountData.key) {
            this.availableBalanceUSD = item.availableBalance;
            this.symbolCode = item.symbolCode;
            this.accectType = item.accectType;
          }
        }
      }
        });
      },
      paymentSelect(e) {
        this.paymentSelectData = e;
        this.accectType = e.assetsType;
        console.log(e);
        this.rechargeAccountActions.map((item) => {
          if (item.key === e.assetsType) {
            console.log(item)
            this.rechargeAccountData = item;
            this.rechargeAccountSelect(item)
          }
        });
      },
    },
  };
</script>

      .prompt-box {
        padding: 0.2rem;
        margin: 0.2rem 0;
        color: #666;
      }
<style lang="less" scoped>
  .but {
    width: 100%;
    color: #ffffff;
    background-color: #1989fa;
    border-radius: 8px;
    height: 66px;
    font-size: 22px;
  }

      .money {
        font-weight: bold;
        font-size: 0.5rem;
  .bottom-text {
    width: 100%;
    background-color: #fff;
    padding: 0.26667rem 0.37333rem;
    box-sizing: border-box;
    margin-top: 0.26667rem;

        .number {
          margin-left: 0.1rem;
        }
      }
    // margin-bottom: 80px;
    .balance {
      display: flex;
      justify-content: space-between;
      color: #181818;
      font-family: PingFang SC;
      font-size: 0.32rem;
      font-style: normal;
      font-weight: 500;
      box-sizing: border-box;

      .timer-box {
        text-align: center;
        font-size: 0.5rem;
      }

      .number {
        font-size: 0.6rem;
      .balance-text {
        color: #181818;
        font-family: PingFang SC;
        font-size: 0.32rem;
        font-style: normal;
        font-weight: 500;
        line-height: 0.37333rem;
        margin-bottom: 0.37333rem;
      }
    }

    .scan {
      border-top: 0.02rem dashed #ddd;
      margin-top: 0.5rem;
      padding: 0.3rem;
      text-align: center;
      color: #ff1100;
    .division {
      width: 100%;
      height: 0.02667rem;
      flex-shrink: 0;
      background-color: #e5e8ed;
      margin: 0.37333rem 0;
    }

    // 微信支付宝icon设置
    .icon-umidd17 {
      color: #1296db;
      font-size: 0.6rem;
    }

    .icon-02 {
      color: #36ae55;
      font-size: 0.6rem;
    .upload-text {
      color: #181818;
      font-family: PingFang SC;
      font-size: 0.32rem;
      font-style: normal;
      font-weight: 500;
    }
  }

  .mint-popup-white1 {
    background: #eaeaea;
    padding-bottom: 0.3rem;
  /deep/ .van-nav-bar__content {
    height: 65px;
  }

  .box1 {
    // margin-top: 0.4rem;
    .icon-fuzhi {
      font-size: 0.24rem;
      margin-right: 0.1rem;
    }
  /deep/ .van-nav-bar__title {
    font-family: "DINPro";
    width: 100%;
    height: 1.17333rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-style: normal;
    font-weight: 500;
    font-size: 0.48rem;
    color: #14181f;
  }

  .eq-code-img {
    text-align: center;
    margin-top: 0.2rem;
  /deep/ .van-cell {
    list-style: none;
    width: 100%;
    margin-top: 0.26667rem;
    background: #fff;
    border-radius: 0.10667rem;
    list-style: none;
    border: none;
    font-family: Arial, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 0.37333rem;
    line-height: 0.53333rem;
    padding: 0.32rem 0.4rem;
    box-sizing: border-box;
    margin-top: 0.26667rem;
    box-shadow: 0 0.16rem 0.32rem #eaeaea99;
  }

    img {
      width: 60%
  main {
    padding: 0 0.4rem 0.53333rem;
    box-sizing: border-box;
  }

  .main-title {
    font-style: normal;
    font-weight: 400;
    font-size: 0.37333rem;
    color: #8c9fad;
    margin-top: 0.53333rem;
  }

  .white-input {
    width: 100%;
    background: #fff;
    border-radius: 0.10667rem;
    list-style: none;
    border: none;
    font-family: Arial, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 0.37333rem;
    line-height: 0.53333rem;
    padding: 0.32rem 0.4rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: 0.26667rem;
    -webkit-box-shadow: 0 0.16rem 0.32rem #eaeaea99;
    box-shadow: 0 0.16rem 0.32rem #eaeaea99;
    display: flex;
    justify-content: space-between;
  }

  .fuzhi {
    font-size: 28px;
    cursor: pointer;
  }

  .myr {
    color: rgb(5, 106, 239);
    cursor: pointer;
  }

  .dz-title {
    display: flex;
    justify-content: space-between;
    font-style: normal;
    font-weight: 400;
    font-size: 0.37333rem;
    color: #8c9fad;
    margin-top: 0.31333rem;
    padding: 0 0.13333rem;
    box-sizing: border-box;

    .balance-text {
      font-style: normal;
      font-weight: 500;
      font-size: 0.37333rem;
      color: #4f5257;
    }
  }
</style>