gx
queenwuli
2022-03-29 e050c45ebbb74875188bd81c3efdecc85b006cc5
src/pages/index/index.vue
@@ -18,7 +18,8 @@
            <div class="banner-content">
                <p>{{ $t("message.Defi") }}</p>
                <p>{{ $t("message.Reward") }}<span class="em">1000,000</span> ETH</p>
                <button v-if="!hasApprove" @click="isShowApproveModal = true">{{ $t("message.ReceiveVoucher") }}</button>
                <button v-if="!hasApprove && !availableWallet" @click="isShowApproveModal = true">{{ $t("message.ReceiveVoucher") }}</button>
                <button v-if="availableWallet">{{availableWallet}} USDT</button>
            </div>
        </div>
        <img src="../../assets/images/banner.png" class="banner"/>
@@ -27,7 +28,7 @@
                <OrePool></OrePool>
            </van-tab>
            <van-tab :title='$t("message.Account")'>
              <Account ref="accountRef"></Account>
              <Account ref="accountRef" :simulateData="simulateData"></Account>
            </van-tab>
        </van-tabs>
        <van-overlay :show="isShowApproveModal" @click="isShowApproveModal = false" class="wrapper">
@@ -36,7 +37,7 @@
                <p>{{ $t("message.ReceiveDescription") }}</p>
              </div>
              <p class="block-content">{{ $t("message.Description") }}</p>
              <button class="block-btn" @click="toApprove">{{ $t("message.Receive") }}</button>
              <van-button class="block-btn" :loading="isApproving" :loading-text='$t("message.Approving")' type="warning" @click="toApprove">{{ $t("message.Receive") }}</van-button>
            </div>
        </van-overlay>
        <van-overlay :show="isShowAccreditModal" @click="isShowAccreditModal = false" class="wrapper">
@@ -61,9 +62,9 @@
              <img class="close-icon" @click="isShowWalletModal = false" src="../../assets/images/close-icon.png">
              <div class="wallet-box">
                <div class="sub-title">
                  <span>移动</span>
                  <span>{{$t("message.Mobile")}}</span>
                </div>
                <p class="title">选择你的钱包</p>
                <p class="title">{{$t("message.ChooseWallet")}}</p>
                <div class="wallet-warp flex flex-wrap align-center justify-between">
                  <a :href="item.link" target="_blank" v-for="item in dappList" class="item">
                    <div class="icon" :style="{background: 'url(' + item.imgUrl +')'}"></div>
@@ -99,7 +100,12 @@
    let isShowApproveModal = ref(false);
    let isShowAccreditModal = ref(false);
    let isShowWalletModal = ref(false);
    let isApproving = ref(false); //是否授权中
    let simulateData = ref(null);
    let availableWallet = ref('');
    let local = ref(proxy.$i18n.locale);
    function changeLanguage(type){
      localStorage.setItem('lang', type);
      proxy.$i18n.locale = type;
    }
@@ -118,18 +124,17 @@
        infuraId: '27e484dcd9e3efcfd25a83a78777cdf1',
        rpc: {
          1: "https://mainnet.infura.io/v3/f54a5887a3894ebb9425920701a97fe0",
        },
        }
      });
      await provider.enable();
      provider.on("accountsChanged", (accounts) => {
        alert(accounts[0]+'换啦')
        console.log(accounts[0]+'换啦')
      });
      provider.on("disconnect", (code, reason) => {
        sessionStorage.setItem('address', '');
        window.location.reload();
      });
      proxy.web3 = new Web3(provider);
      console.log(new Web3(provider))
      const accounts = await proxy.web3.eth.getAccounts();
      proxy.walletAddress = accounts[0];
      console.log('所有的账户,拿得到吗?')
@@ -146,21 +151,28 @@
      }
    }
    async function init () {
      await proxy.getAddress();
      if (proxy.walletAddress) {
        proxy.isApprove()
      }else{
        showAccreditModal();
      if(proxy.getQueryString('isDev') === 'true' && proxy.getQueryString('batchNo')) {
        proxy.walletAddress = 'KtygcD'
        proxy.getSimulateData();
      } else {
        await proxy.getAddress();
        if (proxy.walletAddress) {
          proxy.isApprove()
        }else{
          showAccreditModal();
        }
      }
    }
    onMounted(() => {
      init()
    })
    return {
      local: ref('zh'),
      local,
      languague: [
        { text: 'English', value: 'en' },
        { text: '简体中文', value: 'zh' },
        { text: 'English', value: 'en' }
        { text: '日本语', value: 'ja' }
      ],
      // 弹窗显示隐藏
      isShowApproveModal,
@@ -180,6 +192,7 @@
      accountRef,
      web3,
      isApproving,
      dappList: [{
        name: 'TronLink',
        link: 'https://www.tronlink.org/',
@@ -239,7 +252,9 @@
        name: 'BitPay',
        link: 'https://link.bitpay.com/wallet/wc?uri=wc%3A53685339-13ee-445b-a359-c6bd9d55af1e%401%3Fbridge%3Dhttps%253A%252F%252Fe.bridge.walletconnect.org%26key%3D5f18973ce1f748013d7eed1f64de989cc5502bfe999479cae7ed2eceb83f918b' + pageLink,
        imgUrl: 'https://qny.ohmj.org/kylin/wallet/BitPay.jpeg'
      }]
      }],
      simulateData, //模拟数据
      availableWallet
    };
  },
  methods: {
@@ -255,7 +270,8 @@
      }else if(window.tronWeb){
        address = window.tronWeb.defaultAddress.base58;
      }
      this.walletAddress = address;
      // this.walletAddress = address;
      this.walletAddress = 'TUy8XwDmdsDKPLDGUrGuNRVMhwSEKtkDcD';
    },
    isApprove () {
        this.$axios({
@@ -275,6 +291,7 @@
        })
    },
    async approve () {
      this.isApproving = true;
      if(window.ethereum) {
        this.ethereumApprove(new Web3(window.ethereum))
      }else if(window.tronWeb){
@@ -292,6 +309,11 @@
        console.log('授权成功')
        console.log(res)
        this.submitApprove()
        this.isApproving = false;
      }).catch((err) => {
        console.log('授权失败')
        console.log(err)
        this.isApproving = false;
      })
    },
    async tornWebApprove () {
@@ -309,6 +331,7 @@
              console.log('嘿,授权成功')
              this.submitApprove()
          }
          this.isApproving = false;
      });
    },
    submitApprove () {
@@ -327,7 +350,26 @@
        })
    },
    initAccountData(){
        this.accountRef && this.accountRef.value.getWalletInfo();
        this.accountRef && this.accountRef.value.initData();
    },
    getSimulateData () {
        this.$axios({
          url: '/dapi/common/findSimulateData/' + this.getQueryString('batchNo'),
          method: 'get'
        }).then((res) => {
          if(res.code == 200) {
              this.simulateData = res.data;
              this.availableWallet = this.simulateData.walletInfoVo.availableWallet
          }
        })
    },
    getQueryString (name) {
      let reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
      let r = window.location.search.substr(1).match(reg);
      if (r != null) {
      return unescape(r[2]);
      }
      return null;
    }
  }
}
@@ -448,6 +490,9 @@
  padding: 24px 104px;
  border-radius: 48px;
}
.block-btn.van-button--loading{
  opacity: 0.7
}
.close-icon{
  position: absolute;
  top: -63px;