<template>

  <div class="home">
  

<div>
   <button style="" @click="addUSDT()">add USDT  address</button>
   <input type="text" style="width: 400px;" v-model="USDT">
    <br />
   <button style="" @click="addMMB()">add MMB  address</button>
   <input type="text" style="width: 400px;" v-model="MMB">
    <br />
   <button style="" @click="addKIT()">add KIT address</button>
   <input type="text" style="width: 400px;" v-model="KIT">
    <br />
    <br />
    <br />
    <button style="" @click="setApprovalForAll()">setApprovalForAll</button>
    <input type="text" style="width: 400px;" v-model="approvalAddress">
    <br />
    <button style="" @click="isApprovalForAll()">isApprovalForAll</button>
    <input type="text" style="width: 400px;" v-model="approvalAddress">
    <input type="text" style="width: 50px;" v-model="isApproval">
    <br />
    <br />
    <br />
    <button style="" @click="checkAddLiquidity()">checkAddLiquidity</button>
    <br />
    <span style="color:#000;">tokenA</span>
    <input type="text" style="width: 400px;" v-model="tokenA">
    <br />
    <span style="color:#000;">tokenB</span>
    <input type="text" style="width: 400px;" v-model="tokenB">
    <br />
    <span style="color:#000;">amountA</span>
    <input type="text" v-model="amountA" @click="this.amountA='';this.amountB=''" >
    <br />
    <span style="color:#000;">amountB</span>
    <input type="text" v-model="amountB"  @click="this.amountA='';this.amountB=''">
    <br />
    <br />
    <br />
    <button style="" @click="addLiquidity()">addLiquidity</button>
    <br />
    <span style="color:#000;">tokenA</span>
    <input type="text" style="width: 400px;" v-model="tokenA">
    <br />
    <span style="color:#000;">tokenB</span>
    <input type="text" style="width: 400px;" v-model="tokenB">
    <br />
    <span style="color:#000;">amountA</span>
    <input type="text" v-model="amountA">
    <br />
    <span style="color:#000;">amountB</span>
    <input type="text" v-model="amountB">
    <br />
    <span style="color:#000;">toAddress</span>
    <input type="text" style="width: 400px;" v-model="liquidityTo">
    <br />
    <br />
    <br />
    <button style="" @click="removeLiquidity()">removeLiquidity</button>
    <br />
    <span style="color:#000;">tokenA</span>
    <input type="text" style="width: 400px;" v-model="tokenA">
    <br />
    <span style="color:#000;">tokenB</span>
    <input type="text" style="width: 400px;" v-model="tokenB">
    <br />
    <span style="color:#000;">LPAmount</span>
    <input type="text" v-model="liquidityAmount">
    <br />
    <span style="color:#000;">toAddress</span>
    <input type="text" style="width: 400px;" v-model="liquidityTo">
    <br />
    <br />
    <br />
    <button style="" @click="checkoutTokens()">checkoutTokens</button>
    <br />
    <span style="color:#000;">tokenA</span>
    <input type="text" style="width: 400px;" v-model="tokenA_2">
    <br />
    <span style="color:#000;">tokenB</span>
    <input type="text" style="width: 400px;" v-model="tokenB_2">
    <br />
    <span style="color:#000;">tokensAddress</span>
    <input type="text" style="width: 400px;" v-model="tokensAddress">
    <br />
    <span style="color:#000;">tokenAAmount</span>
    <input type="text" style="width: 300px;" v-model="tokenAAmount">
    <input type="text" style="width: 100px;" v-model="tokenAName">
    <input type="text" style="width: 300px;" v-model="priceA">
    <br />
    <span style="color:#000;">tokenBAmount</span>
    <input type="text" style="width: 300px;" v-model="tokenBAmount">
    <input type="text" style="width: 100px;" v-model="tokenBName">
    <input type="text" style="width: 300px;" v-model="priceB">
    <br />
    <br />
    <br />
    <button style="" @click="checkBuyTokens()">checkBuyTokens</button>===========
    <button style="" @click="buyTokens()">buyTokens</button>===========
    <button style="" @click="exchange()">exchange</button>
    <br />
    <span style="color:#000;">tokenA</span>
    <input type="text" style="width: 400px;" v-model="tokenA_3">
    <br />
    <span style="color:#000;">tokenB</span>
    <input type="text" style="width: 400px;" v-model="tokenB_3">
    <br />
    <span style="color:#000;">amountA_in</span>
    <input type="text" v-model="amountA" @click="this.amountA='';this.amountB=''" >
    <br />
    <span style="color:#000;">amountB_out</span>
    <input type="text" v-model="amountB"  @click="this.amountA='';this.amountB=''">
    <br />
    <span style="color:#000;">toAddress</span>
    <input type="text" style="width: 400px;" v-model="buyAddress">
<br />
   <!-- <button style="" @click="aaaa()">add token to metaMask</button>
   <input type="text" v-model="aaa" @click="this.aaa=''"> -->
</div>

   


   

  
  </div>
</template>

<script>
// @ is an alias to /srcf-nav-icon1
import walletMgr from '../wallet/WalletMgr.js'
import Erc20 from '../wallet/contract/Erc20'
import address from '../wallet/Address'
import uniswapV2Router02 from '../wallet/contract/UniswapV2Router02'
import UniswapV2Library from '../wallet/contract/UniswapV2Library'
import { ethers } from 'ethers'
export default {
  name: "Home",
  components: {},
  data() {
    return {
        USDT:"0x563629bA101745864271Bc2cdD6C575Dd68393Fd",
        MMB:"0xd094FE68Ab1196a644A80a2A5687ed42c7B9d2e9",
        KIT:"0x975a6eE5B33CB29B0fF5d5F3CE238f31D19643EE",
        approvalAddress:"",
        tokenA:"0x563629bA101745864271Bc2cdD6C575Dd68393Fd",
        tokenB:"0xd094FE68Ab1196a644A80a2A5687ed42c7B9d2e9",
        amountA:"",
        amountB:"",
        liquidityTo:"",
        liquidityAmount:"",
        isApproval:"false",
        tokensAddress:"",
        tokenAAmount:"",
        tokenBAmount:"",
        tokenAName:"",
        tokenBName:"",
        priceA:"",
        priceB:"",
        tokenA_2:"0x563629bA101745864271Bc2cdD6C575Dd68393Fd",
        tokenB_2:"0xd094FE68Ab1196a644A80a2A5687ed42c7B9d2e9",
        tokenA_3:"0x563629bA101745864271Bc2cdD6C575Dd68393Fd",
        tokenB_3:"0xd094FE68Ab1196a644A80a2A5687ed42c7B9d2e9",
        buyAddress:"",
        isTokenA:false,
    }
  },
  methods: {
    exchange(){
        let a = this.tokenA_3;
        this.tokenA_3 = this.tokenB_3
        this.tokenB_3 = a;
        a =  this.amountA;
        this.amountA = this.amountB;
        this.amountB = a;
        this.isTokenA = !this.isTokenA
    },
    buyTokens(){
        if(this.isTokenA){
            uniswapV2Router02.swapExactTokensForTokens(this.amountA,0,[this.tokenA_3,this.tokenB_3],this.buyAddress,100000000000);
        }else{
            let amountInMax = ethers.BigNumber.from("10000000000000000000000000")
            uniswapV2Router02.swapTokensForExactTokens(this.amountB,amountInMax,[this.tokenA_3,this.tokenB_3],this.buyAddress,100000000000);
        }
    },
    checkBuyTokens(){
        this.isTokenA = false;
        if(this.tokenA_3 < this.tokenB_3){
            if (this.amountA != ""){
                this.isTokenA = true;
                uniswapV2Router02.getAmountsOut(this.amountA,[this.tokenA_3,this.tokenB_3],(x)=>{
                    console.log(x);
                    this.amountB = x.data[1];
                });
            }else{
                uniswapV2Router02.getAmountsIn(this.amountB,[this.tokenA_3,this.tokenB_3],(x)=>{
                    this.amountA = x.data[0];
                });
            }
        }else{
            if (this.amountA != ""){
                this.isTokenA = true;
                uniswapV2Router02.getAmountsIn(this.amountA,[this.tokenA_3,this.tokenB_3],(x)=>{
                        this.amountB = x.data[0];
                });
            }else{
                 uniswapV2Router02.getAmountsOut(this.amountB,[this.tokenA_3,this.tokenB_3],(x)=>{
                    console.log(x);
                    this.amountA = x.data[1];
                });
            }
        }
    },
    addUSDT(){
        walletMgr.addTokensToMetaMask(this.USDT);
    },
    addMMB(){
        walletMgr.addTokensToMetaMask(this.MMB);
    },
    addKIT(){
        walletMgr.addTokensToMetaMask(this.KIT);
    },
    checkAddLiquidity(){
        UniswapV2Library.getReserves(this.tokenA,this.tokenB,(x)=>{
            let tokenAAmount = x.data.tokenAAmount;
            let tokenBAmount = x.data.tokenBAmount;
            if(this.amountA == ""){
                UniswapV2Library.quote(this.amountB,tokenBAmount,tokenAAmount,(x)=>{
                    this.amountA =  x.data;
                })
            }else{
                 UniswapV2Library.quote(this.amountA,tokenAAmount,tokenBAmount,(x)=>{
                    this.amountB =  x.data;
                })
            }
           
        })
    },
    addLiquidity(){
        uniswapV2Router02.addLiquidity(this.tokenA,this.tokenB,this.amountA,this.amountB,1000,10000,this.liquidityTo,100000000000000,
            (x)=>{
                console.log("fun1:",x);
            },(x)=>{
                console.log("fun2:",x);
                alert(x.code);
            }
        )
    },
    removeLiquidity(){
        uniswapV2Router02.removeLiquidity(this.tokenA,this.tokenB,this.liquidityAmount,0,0,this.liquidityTo,100000000000000,
            (x)=>{
                console.log("fun1:",x);
            },(x)=>{
                console.log("fun2:",x);
                alert(x.code);
            }
        )
    },
    setApprovalForAll(){
        Erc20.setApprovalForAll(this.approvalAddress,address.address.UniswapV2Router02, 
            (x)=>{
                console.log("fun1:",x);
            },(x)=>{
                console.log("fun2:",x);
                alert(x.code);
        })
    },
    isApprovalForAll(){
        this.isApproval = false;
        Erc20.isApprovalForAll(this.approvalAddress,address.address.UniswapV2Router02,(x)=>{
            this.isApproval = x.data;
            console.log("bool:",x);
        })
    },
    async checkoutTokens(){
        this.tokensAddress = "";
        this.tokenAAmount = "";
        this.tokenBAmount = "";
        UniswapV2Library.pairFor(this.tokenA_2,this.tokenB_2,(x)=>{
            this.tokensAddress = x.data;
        })
        UniswapV2Library.getReserves(this.tokenA_2,this.tokenB_2,(x)=>{
            this.tokenAAmount = x.data.tokenAAmount;
            this.tokenBAmount = x.data.tokenBAmount;
            this.priceA = ethers.FixedNumber.fromValue(this.tokenBAmount,2).divUnsafe( ethers.FixedNumber.fromValue(this.tokenAAmount,2))
            this.priceB = ethers.FixedNumber.fromValue(this.tokenAAmount,2).divUnsafe( ethers.FixedNumber.fromValue(this.tokenBAmount,2))
        })
          
        let info = await Erc20.getTokenInfo(this.tokenA_2);
        this.tokenAName =  info.symbol+"   "+info.decimals
        info = await Erc20.getTokenInfo(this.tokenB_2);
        this.tokenBName =  info.symbol+"   "+info.decimals
        console.log(this.tokenBName)

    },
  },
  beforeDestroy() {

  },
  mounted() {
   
  },
};
</script>
<style lang="less">

</style>
