1

jhzh

2025-04-20 d157d0892f1ab5517dbe3a08328ccb9c4e446615

 pages/assets/recharge.vue

@@ -1,474 +1,524 @@
<template>
  <view class="layout-page bg-panel-1" :style="themeStyle">
   <view >
    <v-header>
      <template #title>        
        <span  style="color: #000;">{{$t('assets.e5')}}{{coin}}</span>
      </template>
      <!-- <template #right>
   <view class="layout-page bg-panel-1" :style="themeStyle">
      <view>
         <v-header>
            <template #title>
               <span style="color: #000;">{{$t('assets.e5')}}{{coin}}</span>
            </template>
            <!-- <template #right>
        <v-link to="/pages/assets/paypal">
          Bank Transfer
        </v-link>
      </template> -->
    </v-header>
   </view>
    <view class="layout-main">
      <view style="margin: 20px; margin-bottom: 0px;">{{$t('common.select')}}</view>
      <view class="coin border-b p-x-lg  d-flex justify-between m-t-md" style="border: 2px solid #f3f3f3;margin: 20px;padding:10px; border-radius: 4px;" @click="coinListShow=true">
        <view class=" color-light" style="color: #000;
         </v-header>
      </view>
      <view class="layout-main">
         <view style="margin: 20px; margin-bottom: 0px;">{{$t('common.select')}}</view>
         <view class="coin border-b p-x-lg  d-flex justify-between m-t-md"
            style="border: 2px solid #f3f3f3;margin: 20px;padding:10px; border-radius: 4px;"
            @click="coinListShow=true">
            <view class=" color-light" style="color: #000;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 118.99%; /* 28.558px */
text-transform: uppercase;">{{coin}}</view>
        <view class="d-flex align-center" style="color: var(--100, #2B303C);
            <view class="d-flex align-center" style="color: var(--100, #2B303C);
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: normal;">
          <van-icon name="arrow" />
        </view>
      </view>
      <view class="bg-panel-3">
            <view class="rounded-md">
            <view style="margin: 20px; margin-bottom: 0px;">{{$t('assets.b7')}}</view>
              <view
                class="d-flex flex-wrap justify-between align-center p-x-lg p-y-md color-light"
                v-if="coin=='USDT'"
              >
                <!-- <span>{{$t('assets.b7')}}</span> -->
                <view class="group d-flex fn-12 color-light">
               <!--  <view class="rounded-xs p-x-lg p-y-ms m-r-md"
               <van-icon name="arrow" />
            </view>
         </view>
         <view class="bg-panel-3">
            <view class="rounded-md">
               <view style="margin: 20px; margin-bottom: 0px;">{{$t('assets.b7')}}</view>
               <view class="d-flex flex-wrap justify-between align-center p-x-lg p-y-md color-light"
                  v-if="coin=='USDT'">
                  <!-- <span>{{$t('assets.b7')}}</span> -->
                  <view class="group d-flex fn-12 color-light">
                     <!--  <view class="rounded-xs p-x-lg p-y-ms m-r-md"
                    :class="rechargeType==1?'bor-active':'bg-panel-3 border'"
                    size="mini"
                    @click="changeRechargeType(1)"
                  >OMNI</view> -->
                  <view class="rounded-xs p-x-lg p-y-ms m-r-md"
                    size="mini"
                    @click="changeRechargeType(2)"
                    :class="rechargeType==2?'bor-active':'bg-panel-3 border'"
                  >ERC20</view>
                  <view class="rounded-xs p-x-lg p-y-ms"
                    size="mini"
                    @click="changeRechargeType(3)"
                    :class="rechargeType==3?'bor-active':'bg-panel-3 border'"
                  >TRC20</view>
                </view>
              </view>
              <!-- <view class="color-sell fn-12 p-x-lg"  style="color: #DB7A20;
                     <view class="rounded-xs p-x-lg p-y-ms m-r-md" size="mini" @click="changeRechargeType(2)"
                        :class="rechargeType==2?'bor-active':'bg-panel-3 border'">ERC20</view>
                     <view class="rounded-xs p-x-lg p-y-ms" size="mini" @click="changeRechargeType(3)"
                        :class="rechargeType==3?'bor-active':'bg-panel-3 border'">TRC20</view>
                  </view>
               </view>
               <!-- <view class="color-sell fn-12 p-x-lg"  style="color: #DB7A20;
font-size: 11px;
font-style: normal;
font-weight: 400;
line-height: normal;"></view> -->
              <view class="p-t-md  p-b-md ">
                <view class="fn-center">
                  <v-qr v-if="form.address" class="qr-box" :text="form.address||' '"></v-qr>
                </view>
                <view class="tips fn-center color-light m-y-xs" style="color: rgba(39, 42, 49, 0.60);
               <view class="p-t-md  p-b-md ">
                  <view class="fn-center">
                     <v-qr v-if="form.address" class="qr-box" :text="form.address||' '"></v-qr>
                  </view>
                  <view class="tips fn-center color-light m-y-xs" style="color: rgba(39, 42, 49, 0.60);
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: normal;">{{$t('assets.e6')}}</view>
                <!-- <view class="tips fn-center color-theme-1 m-t-md">{{$t('recharge.a3')}}</view> -->
              </view>
            </view>
            <view class="info p-b-md rounded-md">
              <view class="address p-t-xs">
                <!-- <view class="label w-100">{{$t('assets.e7')}}</view> -->
                <view class="border-r w-10/12 autowidth p-x-md p-y-ms address-txt p-x-xs flex-fill color-light fn-center bg-form-panel-3 rounded-xs">{{form.address}}</view>
                <!-- #ifndef H5 -->
                <view style="border-radius: 10px;
                  <!-- <view class="tips fn-center color-theme-1 m-t-md">{{$t('recharge.a3')}}</view> -->
               </view>
            </view>
            <view class="info p-b-md rounded-md">
               <view class="address p-t-xs">
                  <!-- <view class="label w-100">{{$t('assets.e7')}}</view> -->
                  <view
                     class="border-r w-10/12 autowidth p-x-md p-y-ms address-txt p-x-xs flex-fill color-light fn-center bg-form-panel-3 rounded-xs">
                     {{form.address}}
                  </view>
                  <!-- #ifndef H5 -->
                  <view style="border-radius: 10px;
background: linear-gradient(180deg, #ED493B 0%, #FA6D4A 100%);
box-shadow: 0px 4px 9px 0px rgba(239, 78, 61, 0.40);" class="w-9/12 bg-lin p-y-ms rounded-xs m-t-md autowidth color-white p-x-xs fn-16 fn-center" @click="$copy(form.address)">
                  {{$t('recharge.a4')}}<i class="iconfont color-white m-l-xs">&#xe706;</i>
                </view>
                <!-- #endif -->
                <!-- #ifdef H5 -->
                <view style="border-radius: 10px;" class="w-9/12 bg-lin p-y-ms rounded-xs m-t-md autowidth color-white p-x-xs fn-16 fn-center" @click="copy(form.address)">
                  {{$t('recharge.a4')}}<i class="iconfont color-white m-l-xs">&#xe706;</i>
                </view>
                <!-- #endif -->
              </view>
             <!-- <view class="address d-flex align-center justify-between p-t-xs m-b-md" style="    width: 70%;
box-shadow: 0px 4px 9px 0px rgba(239, 78, 61, 0.40);"
                     class="w-9/12 bg-lin p-y-ms rounded-xs m-t-md autowidth color-white p-x-xs fn-16 fn-center"
                     @click="$copy(form.address)">
                     {{$t('recharge.a4')}}<i class="iconfont color-white m-l-xs">&#xe706;</i>
                  </view>
                  <!-- #endif -->
                  <!-- #ifdef H5 -->
                  <view style="border-radius: 10px;"
                     class="w-9/12 bg-lin p-y-ms rounded-xs m-t-md autowidth color-white p-x-xs fn-16 fn-center"
                     @click="copy(form.address)">
                     {{$t('recharge.a4')}}<i class="iconfont color-white m-l-xs">&#xe706;</i>
                  </view>
                  <!-- #endif -->
               </view>
               <view class="address d-flex align-center justify-between p-t-xs m-b-md" style="    width: 90%;
    margin: auto;
    text-align: center;">
                <view class="label w-30">
                           <img src="static/img/icon/num.png" alt="" class="h-20" /></view>
                <v-input
                  type="number"
              :placeholder="$t('assets.e8')"
                  class="border-b flex-fill p-y-xs color-light"
                  v-model="form.amount"
                />
              </view>
           <view class="address d-flex align-center justify-between p-t-xs m-b-md" style="    width: 70%;
    text-align: center;margin-top: 20px;">
                  <view class="label w-30" style="background-color: #fff;">
                     <img src="static/img/icon/num.png" alt="" class="h-20" />
                  </view>
                  <v-input type="number" :placeholder="$t('assets.e8')"
                     class="border-b flex-fill p-y-xs color-light" v-model="form.amount" />
               </view>
               <!-- <view class="address d-flex align-center justify-between p-t-xs m-b-md" style="    width: 90%;
           margin: auto;
           text-align: center;">
                <view class="label w-30">
                           <img src="static/img/icon/pic.png" alt="" class="h-20" /></view>
                    <div
                      @click="getFile('images')"
                      class="upload-box d-flex justify-center align-center rounded-sm  bg-panel-3 box-shadow border-b flex-fill p-y-xs color-light"
                    >
                    <view v-if="!form.images">{{$t('common.a8')}}</view>
                      <img v-else :src="form.images" alt style="max-width:100%" />
                    </div>
                     </view> -->
			  
         <!-- <view @click="recharge" style="width: 80% !important;border-radius: 10px;
border: 1px solid #EA4338;color: #EE4A3C;line-height: 38px;height: 38px;
font-size: 16px;
font-style: normal;
font-weight: 400;
box-shadow: 0px 4px 9px 0px rgba(23, 138, 255, 0.20);    text-align: center;    border-radius: 6px;margin: auto;">
            {{$t('common.confirm')}}
         </view> -->
              
            </view>
            <view class="m-y-md rounded-md">
              <ul class="p-md fn-sm rounded-md m-y-xs p-x-lg">
                <li>·
                    <span v-if="coin=='USDT'">{{$t('common.c0',{num:'10  '+coin})}}</span>
                    <span v-if="coin=='BTC'">{{$t('common.c0',{num:'0.0005 '+coin})}}</span>
                    <span v-if="coin=='ETH'">{{$t('common.c0',{num:'0.01 '+coin})}}</span>。
               {{$t('recharge.a1')}}<span v-if="coin=='USDT'">{{text}}</span> {{coin}}{{$t('recharge.a2')}}
                </li>
                <li>·{{$t('assets.f0')}}。{{$t('assets.f1',{num:10,name:coin})}}。</li>
                <li>·{{$t('assets.f3',{name:coin})}}。</li>
              </ul>
			  
            </view>
			
          </view>
          <view class="m-b-lg" v-if="list.length">
            <view class="title d-flex justify-between p-x-md p-y-xs align-center color-light">
              <span class="fn-lg">{{$t('assets.f4')}}</span>
            </view>
            <view class="">
              <table class="w-max">
                <thead class="p-x-md">
                  <tr class="fn-sm p-x-md " >
                    <th class=" p-b-md fn-left p-l-md">{{$t('assets.c9')}}</th>
                    <th class=" p-b-md fn-left">{{$t('assets.d0')}}</th>
                    <th class=" p-b-md fn-right p-r-md">{{$t('assets.c0')}}</th>
                  </tr>
                </thead>
                <tbody class="">
                  <tr class="color-light trChange p-x-md"  v-for="(item) in list" :key="item.id">
                    <td class="p-y-xs p-l-md rounded-tl-sm rounded-bl-sm">{{item.datetime|parseTime}}</td>
                    <td >
                      <view v-if="item.status==0">{{$t('assets.d1')}}</view>
                      <view v-if="item.status==1" class="color-buy">{{$t('assets.d2')}}</view>
                      <view v-if="item.status==2" class="color-sell">{{$t('assets.d3')}}</view>
                    </td>
                    <td class="fn-right p-r-md rounded-tr-sm rounded-br-sm">
                      {{item.amount}}
                      <span class="color-default">({{item.coin_name}})</span>
                    </td>
                  </tr>
                  <tr v-if="loadMore">
                    <td colspan="3" class="fn-center p-xs link-active" @click="more">{{$t('assets.d4')}}</td>
                  </tr>
                </tbody>
              </table>
            </view>
      </view>
    </view>
    <coin-list @imgs="change" ref="coinList" v-model="coin" @close="coinListShow=false" v-show="coinListShow" />
    <van-toast id="van-toast" />
  </view>
                  <view class="label w-30">
                     <img src="static/img/icon/pic.png" alt="" class="h-20" />
                  </view>
                  <div @click="getFile('images')"
                     class="upload-box d-flex justify-center align-center rounded-sm  bg-panel-3 box-shadow border-b flex-fill p-y-xs color-light">
                     <view v-if="!form.images">{{$t('common.a8')}}</view>
                     <img v-else :src="form.images" alt style="max-width:100%" />
                  </div>
               </view> -->

               <view @click="recharge" style="border-radius: 10px;
background: linear-gradient(to right, #f6c769, #f3b644);
box-shadow: 0px 4px 9px 0px rgba(239, 78, 61, 0.40);"
                  class="w-9/12 bg-lin p-y-ms rounded-xs m-t-md autowidth color-white p-x-xs fn-16 fn-center">
                  {{$t('common.confirm')}}
               </view>

            </view>
            <view class="m-y-md rounded-md">
               <ul class="p-md fn-sm rounded-md m-y-xs p-x-lg">
                  <li>·
                     <span v-if="coin=='USDT'">{{$t('common.c0',{num:'10 '+coin})}}</span>
                     <span v-if="coin=='BTC'">{{$t('common.c0',{num:'0.0005 '+coin})}}</span>
                     <span v-if="coin=='ETH'">{{$t('common.c0',{num:'0.01 '+coin})}}</span>。
                     {{$t('recharge.a1')}}<span v-if="coin=='USDT'">{{text}}</span> {{coin}}{{$t('recharge.a2')}}
                  </li>
                  <li>·{{$t('assets.f0')}}。{{$t('assets.f1',{num:10,name:coin})}}。</li>
                  <li>·{{$t('assets.f3',{name:coin})}}。</li>
               </ul>

            </view>

         </view>
         <view class="m-b-lg" v-if="list.length">
            <view class="title d-flex justify-between p-x-md p-y-xs align-center color-light">
               <span class="fn-lg">{{$t('assets.f4')}}</span>
            </view>
            <view class="">
               <table class="w-max">
                  <thead class="p-x-md">
                     <tr class="fn-sm p-x-md ">
                        <th class=" p-b-md fn-left p-l-md">{{$t('assets.c9')}}</th>
                        <th class=" p-b-md fn-left">{{$t('assets.d0')}}</th>
                        <th class=" p-b-md fn-right p-r-md">{{$t('assets.c0')}}</th>
                     </tr>
                  </thead>
                  <tbody class="">
                     <tr class="color-light trChange p-x-md" v-for="(item) in list" :key="item.id">
                        <td class="p-y-xs p-l-md rounded-tl-sm rounded-bl-sm">{{item.datetime|parseTime}}</td>
                        <td>
                           <view v-if="item.status==0">{{$t('assets.d1')}}</view>
                           <view v-if="item.status==1" class="color-buy">{{$t('assets.d2')}}</view>
                           <view v-if="item.status==2" class="color-sell">{{$t('assets.d3')}}</view>
                        </td>
                        <td class="fn-right p-r-md rounded-tr-sm rounded-br-sm">
                           {{item.amount}}
                           <span class="color-default">({{item.coin_name}})</span>
                        </td>
                     </tr>
                     <tr v-if="loadMore">
                        <td colspan="3" class="fn-center p-xs link-active" @click="more">{{$t('assets.d4')}}
                        </td>
                     </tr>
                  </tbody>
               </table>
            </view>
         </view>
      </view>
      <coin-list @imgs="change" ref="coinList" v-model="coin" @close="coinListShow=false" v-show="coinListShow" />
      <van-toast id="van-toast" />
   </view>
</template>
<script>
import coinList from "./coin-list";
import Wallet from "@/api/wallet";
import formData from "@/utils/class/date";
import Member from "@/api/member";
import {mapGetters} from 'vuex'
import {handleClipboard} from '../../utils/class/copy.js'
export default {
  components: {
    coinList,
  },
  data() {
    return {
      coinListShow: false,
      coin: "",
      rechargeType: 3,
      address: "",
      form: {
        coin_id: "",
        amount: "",
        address: "",
      images:"",
      },
     btc:"1HkmZkNtsMjqdD2HLw3sqou9pcRZYCe5z6",
     eth:"0xc1B086BdD33Bc1153546839640020b3Af87fdFF7",
     trx:"TAvopq1vkb2GLHx6qkkVHseoXKjYw1r5Yr",
     coinaddress:{
        'USDT':'TAvopq1vkb2GLHx6qkkVHseoXKjYw1r5Yr',
        'USDC':'TAvopq1vkb2GLHx6qkkVHseoXKjYw1r5Yr',
        'BTC':'1HkmZkNtsMjqdD2HLw3sqou9pcRZYCe5z6',
        'ETH':'0xc1B086BdD33Bc1153546839640020b3Af87fdFF7',
        'DOT':'13YLS7DTuB2az7KgVqQudeqztXNbyYATTPd9iKHpB5cZUxoo',
        'LTC':'LXcRUb5Z9NXadrs5S9BaChrhhacBUmTYMC',
        'TRX':'TAvopq1vkb2GLHx6qkkVHseoXKjYw1r5Yr',
        'ARB':'0xfd2e5dd25bf2b316b685aa932cb2a2555f5654ba',
        'AGIX':'0xfd2e5dd25bf2b316b685aa932cb2a2555f5654ba',
        'DOGE':'DGrMeZx7xWTV5PdpjzanCxjKiEExyUD',
        'SOL':'CKxeBTCLdMc7jCfkq8NXxQMRjq4GZKWWwBoasYrpHrRF',
        'BCH':'14NToMd523DQwp3QfDYztkbroHdXoouSmw',
        'ETC':'0xfd2e5dd25bf2b316b685aa932cb2a2555f5654ba',
     },
      list: [],
      page: 1,
      loadMore: true,
      text:'TRC20_'
    };
  },
  computed: {
    activeCoin() {
      if (!this.coin) return {};
      return this.$refs.coinList.coinList.find(
        (item) => item.coin_name == this.coin
      );
    },
    ...mapGetters(['themeStyle'])
  },
  filters: {
    parseTime(val) {
      return formData.parseTime(val);
    },
  },
  watch: {
    coin(n) {
      if (n) {
        this.form.address = "";
        if (this.coin != "USDT") {
          this.rechargeType = 1;
        }
        this.walletImageGet();
      }
    },
    rechargeType(e){
        if(e==1){
            // this.text='OMIN_'
         this.rechargeType = 3;
         this.text='TRC20_'
        }else if(e==2){
            this.text='ERC20_'
        }else{
            this.text='TRC20_'
        }
    }
  },
  methods: {
      copy(data){
        handleClipboard(data, event, () => {
          this.$toast.success(this.$t('common.a1'));
        }, () => {
          this.$toast.error(this.$t('common.a2'));
        })
      },
     getFile(name) {
       this.$getFile({count:9}).then((res) => {
         this.upLoadImg(res, name);
       })
     },
     // 上传图片
     upLoadImg(chooseImageRes, name) {
       Member.uploadImage(chooseImageRes).then((res) => {
         this.form[name] = res.data.url;
         this.$toast.success(this.$t('auth.c1'));
       });
     },
    changeRechargeType(idx) {
      this.rechargeType = idx ? idx : 3;
      this.form.address = "";
      this.walletImage(idx);
     this.walletImage(idx);
    },
    // 获取充币地址
    walletImage(idx) {
      // let data = {
      //   coin_id: this.activeCoin.coin_id,
      //   address_type: idx ? idx : this.rechargeType,
      // };
	  
     let coin_id = this.activeCoin.coin_id;
     let address_type = idx ? idx : this.rechargeType;
	  
    // console.log(coin_id);
     if(coin_id == 1) {
        if(address_type == 2) {
           this.form.address = this.eth;
        } else {
           this.form.address = this.trx;
        }
     } else if(coin_id == 3){
      this.form.address = this.eth;
     } else if(coin_id == 13) {
        this.form.address = this.trx;
     } else if(coin_id == 2) {
        this.form.address = this.btc;
     }
	  
     this.form.address = this.coinaddress[this.coin];
   import coinList from "./coin-list";
   import Wallet from "@/api/wallet";
   import formData from "@/utils/class/date";
   import Member from "@/api/member";
   import {
      mapGetters
   } from 'vuex'
   import {
      handleClipboard
   } from '../../utils/class/copy.js'
   export default {
      components: {
         coinList,
      },
      data() {
         return {
            coinListShow: false,
            coin: "",
            rechargeType: 3,
            address: "",
            form: {
               coin_id: "",
               amount: "",
               address: "",
               images: "",
            },
            btc: "1HkmZkNtsMjqdD2HLw3sqou9pcRZYCe5z6",
            eth: "TAvopq1vkb2GLHx6qkkVHseoXKjYw1r5Yr",
            trx: "TAvopq1vkb2GLHx6qkkVHseoXKjYw1r5Yr",
            coinaddress: {
               'USDT': 'TAvopq1vkb2GLHx6qkkVHseoXKjYw1r5Yr',
               'USDC': 'TAvopq1vkb2GLHx6qkkVHseoXKjYw1r5Yr',
               'BTC': '1HkmZkNtsMjqdD2HLw3sqou9pcRZYCe5z6',
               'ETH': 'TAvopq1vkb2GLHx6qkkVHseoXKjYw1r5Yr',
               // 'DOT': '13YLS7DTuB2az7KgVqQudeqztXNbyYATTPd9iKHpB5cZUxoo',
               // 'LTC': 'LXcRUb5Z9NXadrs5S9BaChrhhacBUmTYMC',
               // 'TRX': 'TAvopq1vkb2GLHx6qkkVHseoXKjYw1r5Yr',
               // 'ARB': '0xfd2e5dd25bf2b316b685aa932cb2a2555f5654ba',
               // 'AGIX': '0xfd2e5dd25bf2b316b685aa932cb2a2555f5654ba',
               // 'DOGE': 'DGrMeZx7xWTV5PdpjzanCxjKiEExyUD',
               // 'SOL': 'CKxeBTCLdMc7jCfkq8NXxQMRjq4GZKWWwBoasYrpHrRF',
               // 'BCH': '14NToMd523DQwp3QfDYztkbroHdXoouSmw',
               // 'ETC': '0xfd2e5dd25bf2b316b685aa932cb2a2555f5654ba',
            },
            list: [],
            page: 1,
            loadMore: true,
            text: 'TRC20_'
         };
      },
      computed: {
         activeCoin() {
            // if (!this.coin) return {};
            return this.$refs.coinList.coinList.find(
               (item) => item.coin_name == this.coin
            );
         },
         ...mapGetters(['themeStyle'])
      },
      filters: {
         parseTime(val) {
            return formData.parseTime(val);
         },
      },
      watch: {
         coin(n) {
            console.log(n);
            if (n == 'ETC') {
               this.coin = 'USDC'
            }
            if (n) {
               this.form.address = "";
               // if (this.coin != "USDT") {
               //    this.rechargeType = 1;
               // }
               this.walletImageGet();
            }
         },
         rechargeType(e) {
            if (e == 1) {
               // this.text='OMIN_'
               this.rechargeType = 3;
               this.text = 'TRC20_'
            } else if (e == 2) {
               this.text = 'ERC20_'
            } else {
               this.text = 'TRC20_'
            }
         }
      },
      methods: {
         copy(data) {
            handleClipboard(data, event, () => {
               this.$toast.success(this.$t('common.a1'));
            }, () => {
               this.$toast.error(this.$t('common.a2'));
            })
         },
         getFile(name) {
            this.$getFile({
               count: 9
            }).then((res) => {
               this.upLoadImg(res, name);
            })
         },
         // 上传图片
         upLoadImg(chooseImageRes, name) {
            Member.uploadImage(chooseImageRes).then((res) => {
               this.form[name] = res.data.url;
               this.$toast.success(this.$t('auth.c1'));
            });
         },
         changeRechargeType(idx) {
            this.rechargeType = idx ? idx : 3;
            this.form.address = "";
            // this.walletImage(idx);
            // this.walletImage(idx);

  //     Wallet.walletImage(data).then((res1) => {
  //       this.form.address = res1.data.address;
		
      // console.log(res1.data.address);
  //     });
    },
	
   walletImageGet(idx) {
      let data = {
        coin_id: this.activeCoin.coin_id,
        address_type: idx ? idx : this.rechargeType,
      };
     Wallet.walletImage(data).then((res1) => {
    //    this.eth = res1.data.eth;
      // this.btc = res1.data.btc;
      // this.trx = res1.data.trx;
      this.walletImage();
      //this.form.address = this.trx;
      //console.log(res1.data.address);
     });
   },
    // 充值
    recharge() {
      this.form.coin_id = this.activeCoin.coin_id;
     console.log(this.form)
     if(this.form.amount == ""){
        return
     }
     if(this.form.amount <= 0){
        return
     }
     if(this.form.images == ""){
             return
     }
      Wallet.recharge(this.form, { btn: this.$refs.btn })
        .then(() => {
          this.$back();
          this.$toast.success(this.$t('assets.d5')+"！");
          this.reset();
        })
        .catch(() => {});
    },
    reset() {
      this.loadMore = true;
      this.page = 1;
      this.depositHistory();
    },
    more() {
      this.page++;
      this.depositHistory();
    },
    // 获取充值记录
    depositHistory() {
      let data = {
        page: this.page,
      };
      Wallet.depositHistory(data).then((res) => {
        if (res.data.current_page == 1) this.list = [];
        this.list = [...this.list, ...res.data.data];
        if (res.data.data.length < res.data.per_page) this.loadMore = false;
      });
    },
    change(e){
      let coin_id = e.coin_id;
      let address_type = this.rechargeType;
       if(coin_id == 1) {
              if(address_type == 2) {
                 this.form.address = this.eth;
              } else {
                 this.form.address = this.trx;
              }
       } else if(coin_id == 3){
            this.rechargeType = 1;
            this.form.address = this.eth;
       } else if(coin_id == 13) {
          this.rechargeType = 1;
              this.form.address = this.trx;
       } else if(coin_id == 2) {
          this.rechargeType = 1;
              this.form.address = this.btc;
       }
		
    }
  },
  created() {
    this.depositHistory();
  },
};
            this.walletImageGet()
         },
         // 获取充币地址
         walletImage(idx) {
            // let data = {
            //   coin_id: this.activeCoin.coin_id,
            //   address_type: idx ? idx : this.rechargeType,
            // };
            console.log('res', this.rechargeType);
            console.log('aa', this.activeCoin.coin_name);

            // return
            let coin_id = this.activeCoin.coin_id;
            let address_type = idx ? idx : this.rechargeType;

            // console.log(coin_id);
            if (coin_id == 1) {
               if (address_type == 2) {
                  this.form.address = this.eth;
               } else {
                  this.form.address = this.trx;
               }
            } else if (coin_id == 3) {
               this.form.address = this.eth;
            } else if (coin_id == 13) {
               this.form.address = this.trx;
            } else if (coin_id == 2) {
               this.form.address = this.btc;
            }

            this.form.address = this.coinaddress[this.coin];



            //     Wallet.walletImage(data).then((res1) => {
            //       this.form.address = res1.data.address;

            // console.log(res1.data.address);
            //     });
         },

         walletImageGet(idx) {
            var newtype = ''
            if (this.activeCoin.coin_name == 'USDC') {
               newtype = 'USDCERC'
            } else if (this.activeCoin.coin_name == 'BTC') {
               newtype = 'BTC'
            } else if (this.activeCoin.coin_name == 'ETH') {
               newtype = 'ETH'
            }else if (this.activeCoin.coin_name == 'USDT') {
               newtype = 'USDCERC'
               if (this.rechargeType == 2) {
                  newtype = 'USDTERC'
               } else {
                  newtype = 'USDTTRC'
               }
            }
            let data = {
               coin_id: this.activeCoin.coin_id,
               // address_type: idx ? idx : this.rechargeType,
               address_type: newtype ? newtype : 'USDCERC',
            };
            Wallet.walletImage(data).then((res1) => {
               //    this.eth = res1.data.eth;
               // this.btc = res1.data.btc;
               // this.trx = res1.data.trx;
               // this.walletImage();
               this.form.address = res1.data.address;
               //this.form.address = this.trx;
               //console.log(res1.data.address);
            });
         },
         // 充值
         recharge() {
            this.form.coin_id = this.activeCoin.coin_id;
            console.log(this.form)
            if (this.form.amount == "") {
               return
            }
            if (this.form.amount <= 0) {
               return
            }
            // if (this.form.images == "") {
            //    return
            // }
            Wallet.recharge(this.form, {
                  btn: this.$refs.btn
               })
               .then(() => {
                  this.$toast.success(this.$t('assets.d5') + "！");
                  setTimeout(()=>{
                     this.$back();
                     this.reset();
                  },1000)
               })
               .catch(() => {});
         },
         reset() {
            this.loadMore = true;
            this.page = 1;
            this.depositHistory();
         },
         more() {
            this.page++;
            this.depositHistory();
         },
         // 获取充值记录
         depositHistory() {
            let data = {
               page: this.page,
            };
            Wallet.depositHistory(data).then((res) => {
               if (res.data.current_page == 1) this.list = [];
               this.list = [...this.list, ...res.data.data];
               if (res.data.data.length < res.data.per_page) this.loadMore = false;
            });
         },
         change(e) {
            let coin_id = e.coin_id;
            let address_type = this.rechargeType;
            if (coin_id == 1) {
               if (address_type == 2) {
                  this.form.address = this.eth;
               } else {
                  this.form.address = this.trx;
               }
            } else if (coin_id == 3) {
               this.rechargeType = 1;
               this.form.address = this.eth;
            } else if (coin_id == 13) {
               this.rechargeType = 1;
               this.form.address = this.trx;
            } else if (coin_id == 2) {
               this.rechargeType = 1;
               this.form.address = this.btc;
            }

         }
      },
      created() {
         this.depositHistory();
         this.$refs.coinList.coinList.find(
            (item) => item.coin_name == 'USDC'
         );
         this.walletImageGet()
      },
   };
</script>
<style lang="scss" scoped>
.address {
  .label {
    white-space: nowrap;
  }
  .address-txt {
    word-break: break-all;
  }
}
.qr-box {
  height: 150px;
  width: 150px;
  margin: 0 auto;
  border: 4px solid $white;
}
.trChange:nth-child(2n-1){
   box-shadow: $shadow;
    border-radius: $border-radius-xs;
   td{
      background: $panel-3;
      padding-top: $padding-sm;
      padding-bottom: $padding-sm;
   .address {
      .label {
         white-space: nowrap;
      }

      .address-txt {
         word-break: break-all;
      }
   }
}
.bor-active{
    border: 1px solid $theme-1;
    position: relative;
    overflow: hidden;
    color: $theme-1;
}
.bor-active::before{
    content: '';
    position: absolute;
    right: 0;
    bottom:-2px;
    height: 0;
    width: 0;
    border: 10px solid;
    border-color:transparent $theme-1 $theme-1 transparent;
    text-align: center;
}
.bor-active::after{
    content: '√';
    position: absolute;
    right: -4px;
    bottom: -1px;
    height: 15px;
    width: 15px;
    width: 20px;
    transform: scale(0.7);
    text-align: center;
    color: white;
}
.border-b{
    border-bottom: 5px solid $panel-3;
}
.autowidth{
    margin: 0 auto;
}
.bg-lin{
    background: linear-gradient(to right,#f6c769,#f3b644);
}
.color-black{
    color: black;
}
button{
   width: 80%;
}

   .qr-box {
      height: 150px;
      width: 150px;
      margin: 0 auto;
      border: 4px solid $white;
   }

   .trChange:nth-child(2n-1) {
      box-shadow: $shadow;
      border-radius: $border-radius-xs;

      td {
         background: $panel-3;
         padding-top: $padding-sm;
         padding-bottom: $padding-sm;
      }
   }

   .bor-active {
      border: 1px solid $theme-1;
      position: relative;
      overflow: hidden;
      color: $theme-1;
   }

   .bor-active::before {
      content: '';
      position: absolute;
      right: 0;
      bottom: -2px;
      height: 0;
      width: 0;
      border: 10px solid;
      border-color: transparent $theme-1 $theme-1 transparent;
      text-align: center;
   }

   .bor-active::after {
      content: '√';
      position: absolute;
      right: -4px;
      bottom: -1px;
      height: 15px;
      width: 15px;
      width: 20px;
      transform: scale(0.7);
      text-align: center;
      color: white;
   }

   .border-b {
      border-bottom: 5px solid $panel-3;
   }

   .autowidth {
      margin: 0 auto;
   }

   .bg-lin {
      background: linear-gradient(to right, #f6c769, #f3b644);
   }

   .color-black {
      color: black;
   }

   button {
      width: 80%;
   }
</style>