修改转账流程
This commit is contained in:
parent
232c0f0f93
commit
acf9a2cf97
@ -7,6 +7,7 @@ import { Message } from 'element-ui'
|
||||
import { Chain } from '@/chain/Chain'
|
||||
import { AVAILABLE_CHAINS, IChainData } from '@/configs/config_chain'
|
||||
import { AllChains } from '@/configs/allchain'
|
||||
import { parsePrice } from '@/utils/chain.util'
|
||||
|
||||
@singleton
|
||||
export default class ChainManager {
|
||||
@ -136,4 +137,28 @@ export default class ChainManager {
|
||||
console.log('balance: ', balance)
|
||||
return balance
|
||||
}
|
||||
|
||||
// 转账
|
||||
public async transferToAccount({ to, amount, chainId, address } : {
|
||||
to: string
|
||||
amount: number
|
||||
chainId: number
|
||||
address: string}) {
|
||||
const self = this
|
||||
if (chainId !== this.bc.currentChain) {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.bc.switchEthereumChain(chainId, function() {
|
||||
self.bc.transferToAccount(to, amount, address)
|
||||
.then(res => {
|
||||
resolve && resolve(res)
|
||||
})
|
||||
.catch(err => {
|
||||
reject && reject(err)
|
||||
})
|
||||
})
|
||||
})
|
||||
} else {
|
||||
return this.bc.transferToAccount(to, amount, address)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -58,7 +58,11 @@ export class Blockchain {
|
||||
}
|
||||
|
||||
public get hexChainId() {
|
||||
return '0x' + this.currentChain.toString(16)
|
||||
return this.toHexChainId(this.currentChain)
|
||||
}
|
||||
|
||||
public toHexChainId(chainId: number) {
|
||||
return '0x' + chainId.toString(16)
|
||||
}
|
||||
|
||||
public async chainSelected(id: number) {
|
||||
@ -213,13 +217,11 @@ export class Blockchain {
|
||||
}
|
||||
|
||||
public async getCoinInstance(address: string) {
|
||||
if (this.coinInstanceMap.has(address)) {
|
||||
return this.coinInstanceMap.get(address)
|
||||
} else {
|
||||
if (!this.coinInstanceMap.has(address)) {
|
||||
const coinInstance = await this.initInstance({ abi: ERC20ABI, address, account: AppModule.accountId })
|
||||
this.coinInstanceMap.set(address, coinInstance)
|
||||
return coinInstance
|
||||
}
|
||||
return this.coinInstanceMap.get(address)
|
||||
}
|
||||
|
||||
public clearCachedProvider() {
|
||||
@ -285,6 +287,8 @@ export class Blockchain {
|
||||
console.log('chainChanged', chainId)
|
||||
const chainIdNum = parseInt(chainId)
|
||||
await this.checkChain(chainIdNum)
|
||||
this.currentChain = chainIdNum
|
||||
this.saveProvider()
|
||||
})
|
||||
|
||||
// Subscribe to session disconnection
|
||||
@ -293,26 +297,35 @@ export class Blockchain {
|
||||
})
|
||||
}
|
||||
|
||||
async switchEthereumChain() {
|
||||
async switchEthereumChain(chainId?: number, cb?: () => void) {
|
||||
chainId = chainId || this.currentChain
|
||||
const hexChainId = this.toHexChainId(chainId)
|
||||
const onChainChange = (chainId: string) => {
|
||||
console.log('switchEthereumChain: ', chainId)
|
||||
this.provider.removeListener('chainChanged', onChainChange)
|
||||
cb && cb()
|
||||
}
|
||||
this.provider.on('chainChanged', onChainChange)
|
||||
try {
|
||||
await this.provider.request({
|
||||
method: 'wallet_switchEthereumChain',
|
||||
params: [{ chainId: this.hexChainId }]
|
||||
params: [{ chainId: hexChainId }]
|
||||
})
|
||||
console.log('switch chain success')
|
||||
} catch (e: any) {
|
||||
console.log('switch chain error: ', e)
|
||||
if (e.code === 4902) {
|
||||
try {
|
||||
const data = this.chainMap.get(this.currentChain)!
|
||||
const data = this.chainMap.get(chainId)!
|
||||
await this.provider.request({
|
||||
method: 'wallet_addEthereumChain',
|
||||
params: [
|
||||
{
|
||||
chainId: this.hexChainId,
|
||||
chainId: hexChainId,
|
||||
chainName: data.name,
|
||||
nativeCurrency: {
|
||||
name: data.symbol,
|
||||
symbol: data.symbol,
|
||||
symbol: data.symbol || 18,
|
||||
decimals: data.decimals
|
||||
},
|
||||
blockExplorerUrls: [data.explorerurl],
|
||||
@ -320,8 +333,10 @@ export class Blockchain {
|
||||
}
|
||||
]
|
||||
})
|
||||
console.log('add chain success')
|
||||
} catch (addError) {
|
||||
console.error('add chain error: ', addError)
|
||||
this.provider.removeListener('chainChanged', onChainChange)
|
||||
}
|
||||
}
|
||||
// console.error(e)
|
||||
@ -382,10 +397,19 @@ export class Blockchain {
|
||||
*/
|
||||
public async getBalance(address: string, account: string | null) {
|
||||
account = account || AppModule.accountId
|
||||
const coinInstance: any = this.getCoinInstance(address)
|
||||
const coinInstance: any = await this.getCoinInstance(address)
|
||||
return await coinInstance.methods.balanceOf(account).call()
|
||||
}
|
||||
|
||||
// 转账
|
||||
public async transferToAccount(account: string, amount: number, address: string) {
|
||||
const amountBN = this.web3.utils.toBN(this.web3.utils.toWei(amount + ''))
|
||||
const coinInstance: any = await this.getCoinInstance(address)
|
||||
return coinInstance.methods
|
||||
.transfer(account, amountBN)
|
||||
.send({ gas: 1000000 })
|
||||
}
|
||||
|
||||
public async signData(signObj: any, signer: string) {
|
||||
const msgParams = JSON.stringify(signObj)
|
||||
const from = signer
|
||||
|
@ -12,7 +12,7 @@
|
||||
alt="coin"
|
||||
class="topRight"></div>
|
||||
<div class="wrongNetwork hide"><span>Wrong network</span></div>
|
||||
<button :disabled="coinData.btnDisable" class="general-btn btn">
|
||||
<button :disabled="coinData.btnDisable" class="general-btn btn" @click="onClick">
|
||||
<span class="title">{{coinData.btnName}}</span>
|
||||
</button>
|
||||
</div>
|
||||
@ -23,6 +23,7 @@ import { Component, Prop, Vue } from 'vue-property-decorator'
|
||||
import { AppModule, DeviceType } from '@/store/modules/app'
|
||||
|
||||
export interface ICoinData{
|
||||
type: number
|
||||
name: string
|
||||
symbol: string
|
||||
amount: number | string
|
||||
@ -30,6 +31,8 @@ export interface ICoinData{
|
||||
price: string|number
|
||||
btnName: string
|
||||
btnDisable: boolean
|
||||
chain?: number
|
||||
address?: string
|
||||
}
|
||||
|
||||
@Component({
|
||||
@ -43,6 +46,10 @@ export default class CoinCard extends Vue {
|
||||
get mobile() {
|
||||
return AppModule.device === DeviceType.Mobile
|
||||
}
|
||||
|
||||
onClick() {
|
||||
this.$emit('coin-card-clicked', this.coinData)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
@ -25,14 +25,22 @@
|
||||
</div>
|
||||
<div class="wallet">
|
||||
<total-balance :currencies="currencies"></total-balance>
|
||||
<coin-card v-for="d in coinList" :coin-data="d" :key="d.symbol"></coin-card>
|
||||
<coin-card
|
||||
v-for="d in coinList"
|
||||
:coin-data="d"
|
||||
@coin-card-clicked = "onCardClicked"
|
||||
:key="d.symbol"></coin-card>
|
||||
</div>
|
||||
<div class="header ingame"><span class="label">Ingame Currency</span>
|
||||
</div>
|
||||
<div class="horizontal-bar"></div>
|
||||
<div class="wallet">
|
||||
<placeholder-panel></placeholder-panel>
|
||||
<coin-card v-for="d in gameCoinList" :coin-data="d" :key="d.symbol"></coin-card>
|
||||
<coin-card
|
||||
v-for="d in gameCoinList"
|
||||
:coin-data="d"
|
||||
@coin-card-clicked = "onGameCardClicked"
|
||||
:key="d.symbol"></coin-card>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -70,7 +78,7 @@ export default class WalletPanel extends Vue {
|
||||
|
||||
@Watch('logined')
|
||||
private accountChange() {
|
||||
this.updateBalanceSet()
|
||||
this.changeNet(this.nets[0].id)
|
||||
this.updateCurrencies()
|
||||
}
|
||||
|
||||
@ -79,6 +87,7 @@ export default class WalletPanel extends Vue {
|
||||
private coinList: ICoinData[] = [
|
||||
{
|
||||
name: 'CEBG Coin',
|
||||
type: 0,
|
||||
symbol: 'cec',
|
||||
amount: '-',
|
||||
icon: require('@/assets/market/cec.png'),
|
||||
@ -88,6 +97,7 @@ export default class WalletPanel extends Vue {
|
||||
},
|
||||
{
|
||||
name: 'CEBG Gem',
|
||||
type: 0,
|
||||
symbol: 'ceg',
|
||||
amount: '-',
|
||||
icon: require('@/assets/market/ceg.png'),
|
||||
@ -100,6 +110,7 @@ export default class WalletPanel extends Vue {
|
||||
private gameCoinList: ICoinData[] = [
|
||||
{
|
||||
name: 'CEBG Coin',
|
||||
type: 1,
|
||||
symbol: 'gCEC',
|
||||
amount: '-',
|
||||
icon: require('@/assets/market/cec.png'),
|
||||
@ -109,6 +120,7 @@ export default class WalletPanel extends Vue {
|
||||
},
|
||||
{
|
||||
name: 'CEBG Gem',
|
||||
type: 1,
|
||||
symbol: 'gCEG',
|
||||
amount: '-',
|
||||
icon: require('@/assets/market/ceg.png'),
|
||||
@ -133,6 +145,7 @@ export default class WalletPanel extends Vue {
|
||||
data.amount = '-'
|
||||
data.price = '-'
|
||||
data.btnDisable = true
|
||||
return data
|
||||
}
|
||||
|
||||
get showAccount() {
|
||||
@ -161,9 +174,12 @@ export default class WalletPanel extends Vue {
|
||||
|
||||
changeNet(net: number) {
|
||||
this.currentNet = net
|
||||
const chainData = CONTRACT_ADDRESS[net]
|
||||
for (let i = 0, l = this.coinList.length; i < l; i++) {
|
||||
this.updateDefaultData(this.coinList[i])
|
||||
this.$set(this.coinList, i, this.coinList[i])
|
||||
const data = this.updateDefaultData(this.coinList[i])
|
||||
data.chain = net
|
||||
data.address = chainData[data.symbol]
|
||||
this.$set(this.coinList, i, data)
|
||||
}
|
||||
this.updateBalanceSet()
|
||||
}
|
||||
@ -184,17 +200,31 @@ export default class WalletPanel extends Vue {
|
||||
const cec = await this.chainManager.getBalance(currentData.cec, this.currentNet)
|
||||
const ceg = await this.chainManager.getBalance(currentData.ceg, this.currentNet)
|
||||
console.log(formatPrice(cec, 18), formatPrice(ceg, 18))
|
||||
const cecData = this.coinList[0]
|
||||
cecData.amount = formatPrice(cec, 18)
|
||||
cecData.btnDisable = cec === 0
|
||||
this.$set(this.coinList, 0, cecData)
|
||||
|
||||
const cegData = this.coinList[1]
|
||||
cegData.amount = formatPrice(ceg, 18)
|
||||
cegData.btnDisable = ceg === 0
|
||||
this.$set(this.coinList, 1, cegData)
|
||||
const updateCoinData = (i: number, amount: number) => {
|
||||
const cecData = this.coinList[i]
|
||||
cecData.amount = formatPrice(amount, 18)
|
||||
cecData.btnDisable = amount === 0
|
||||
this.$set(this.coinList, i, cecData)
|
||||
}
|
||||
updateCoinData(0, cec)
|
||||
updateCoinData(1, ceg)
|
||||
}
|
||||
}
|
||||
|
||||
async onCardClicked(data: ICoinData) {
|
||||
console.log('on coin card clicked: ', data)
|
||||
const res = await this.chainManager.transferToAccount({
|
||||
to: '0x42448C6a38c08637218D8327b748F213fC2c0231',
|
||||
amount: 1,
|
||||
chainId: data.chain!,
|
||||
address: data.address!
|
||||
})
|
||||
console.log(res)
|
||||
}
|
||||
|
||||
async onGameCardClicked(data: ICoinData) {
|
||||
console.log('on game card clicked: ', data)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
@ -75,7 +75,7 @@ export const AllChains = [
|
||||
name: 'Binance Smart Chain',
|
||||
type: 'Mainnet',
|
||||
rpc: 'https://rpc.ankr.com/bsc',
|
||||
logo: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI0LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAzMiAzMiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzIgMzI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojMDA5M0REO30KCS5zdDF7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojRkZGRkZGO30KPC9zdHlsZT4KPGc+Cgk8Y2lyY2xlIGNsYXNzPSJzdDAiIGN4PSIxNiIgY3k9IjE2IiByPSIxNiIvPgoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTEzLjUsMTZsNS4yLDUuM0wyMiwxOGMwLjYtMC42LDEuNS0wLjYsMiwwYzAsMCwwLDAsMCwwYzAuNiwwLjYsMC42LDEuNiwwLDIuMmwtNC4zLDQuNAoJCWMtMC42LDAuNi0xLjUsMC42LTIuMSwwYzAsMCwwLDAsMCwwbC02LjItNi40VjIyYzAsMC44LTAuNywxLjUtMS41LDEuNWMtMC44LDAtMS41LTAuNy0xLjUtMS41VjEwYzAtMC44LDAuNy0xLjUsMS41LTEuNQoJCWMwLjgsMCwxLjUsMC43LDEuNSwxLjV2My44bDYuMi02LjRjMC42LTAuNiwxLjUtMC42LDIuMSwwYzAsMCwwLDAsMCwwbDQuMyw0LjRjMC42LDAuNiwwLjYsMS42LDAsMi4yYy0wLjYsMC42LTEuNSwwLjYtMiwwCgkJYzAsMCwwLDAsMCwwbC0zLjMtMy40TDEzLjUsMTZ6IE0xOC43LDE0LjVjMC44LDAsMS41LDAuNywxLjUsMS41cy0wLjcsMS41LTEuNSwxLjVzLTEuNS0wLjctMS41LTEuNQoJCUMxNy4yLDE1LjIsMTcuOSwxNC41LDE4LjcsMTQuNXoiLz4KPC9nPgo8L3N2Zz4K',
|
||||
logo: 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTAwIiBoZWlnaHQ9IjI1MDAiIHZpZXdCb3g9IjAgMCAyMDAwIDIwMDAiPjxnIGZpbGw9IiNmM2JhMmYiPjxwYXRoIGQ9Ik02MTEuNTkgODQwLjQybDM4OC40LTM4OC4zOSAzODguNiAzODguNTkgMjI2LTIyNkw5OTkuOTkgMCAzODUuNiA2MTQuNDJsMjI1Ljk5IDIyNk0uMDA2IDk5OS45NjlsMjI2LjAwNy0yMjYuMDA3IDIyNS45OTIgMjI1Ljk5M0wyMjYgMTIyNS45NnpNNjExLjU5IDExNTkuNThsMzg4LjQgMzg4LjM5IDM4OC41OS0zODguNTggMjI2LjEyIDIyNS44OC0uMTEuMTJMOTk5Ljk5IDIwMDBsLTYxNC40MS02MTQuNC0uMzItLjMyIDIyNi4zMy0yMjUuN00xNTQ4LjAxMyAxMDAwLjA5M2wyMjYuMDA3LTIyNi4wMDYgMjI1Ljk5MiAyMjUuOTkyLTIyNi4wMDYgMjI2LjAwN3oiLz48cGF0aCBkPSJNMTIyOS4yMiA5OTkuODhoLjFMOTk5Ljk5IDc3MC41NSA4MzAuNTEgOTQwLjAzaC0uMDFsLTE5LjQ3IDE5LjQ4LTQwLjE2IDQwLjE3LS4zMi4zMS4zMi4zMyAyMjkuMTIgMjI5LjEzIDIyOS4zMy0yMjkuMzMuMTEtLjEzLS4yMS0uMTEiLz48L2c+PC9zdmc+',
|
||||
id: 56,
|
||||
symbol: 'BNB',
|
||||
explorerurl: 'https://bscscan.com'
|
||||
@ -101,7 +101,7 @@ export const AllChains = [
|
||||
type: 'Testnet',
|
||||
rpc: 'https://data-seed-prebsc-1-s1.binance.org:8545/',
|
||||
id: 97,
|
||||
logo: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI0LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAzMiAzMiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzIgMzI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojMDA5M0REO30KCS5zdDF7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojRkZGRkZGO30KPC9zdHlsZT4KPGc+Cgk8Y2lyY2xlIGNsYXNzPSJzdDAiIGN4PSIxNiIgY3k9IjE2IiByPSIxNiIvPgoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTEzLjUsMTZsNS4yLDUuM0wyMiwxOGMwLjYtMC42LDEuNS0wLjYsMiwwYzAsMCwwLDAsMCwwYzAuNiwwLjYsMC42LDEuNiwwLDIuMmwtNC4zLDQuNAoJCWMtMC42LDAuNi0xLjUsMC42LTIuMSwwYzAsMCwwLDAsMCwwbC02LjItNi40VjIyYzAsMC44LTAuNywxLjUtMS41LDEuNWMtMC44LDAtMS41LTAuNy0xLjUtMS41VjEwYzAtMC44LDAuNy0xLjUsMS41LTEuNQoJCWMwLjgsMCwxLjUsMC43LDEuNSwxLjV2My44bDYuMi02LjRjMC42LTAuNiwxLjUtMC42LDIuMSwwYzAsMCwwLDAsMCwwbDQuMyw0LjRjMC42LDAuNiwwLjYsMS42LDAsMi4yYy0wLjYsMC42LTEuNSwwLjYtMiwwCgkJYzAsMCwwLDAsMCwwbC0zLjMtMy40TDEzLjUsMTZ6IE0xOC43LDE0LjVjMC44LDAsMS41LDAuNywxLjUsMS41cy0wLjcsMS41LTEuNSwxLjVzLTEuNS0wLjctMS41LTEuNQoJCUMxNy4yLDE1LjIsMTcuOSwxNC41LDE4LjcsMTQuNXoiLz4KPC9nPgo8L3N2Zz4K',
|
||||
logo: 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTAwIiBoZWlnaHQ9IjI1MDAiIHZpZXdCb3g9IjAgMCAyMDAwIDIwMDAiPjxnIGZpbGw9IiNmM2JhMmYiPjxwYXRoIGQ9Ik02MTEuNTkgODQwLjQybDM4OC40LTM4OC4zOSAzODguNiAzODguNTkgMjI2LTIyNkw5OTkuOTkgMCAzODUuNiA2MTQuNDJsMjI1Ljk5IDIyNk0uMDA2IDk5OS45NjlsMjI2LjAwNy0yMjYuMDA3IDIyNS45OTIgMjI1Ljk5M0wyMjYgMTIyNS45NnpNNjExLjU5IDExNTkuNThsMzg4LjQgMzg4LjM5IDM4OC41OS0zODguNTggMjI2LjEyIDIyNS44OC0uMTEuMTJMOTk5Ljk5IDIwMDBsLTYxNC40MS02MTQuNC0uMzItLjMyIDIyNi4zMy0yMjUuN00xNTQ4LjAxMyAxMDAwLjA5M2wyMjYuMDA3LTIyNi4wMDYgMjI1Ljk5MiAyMjUuOTkyLTIyNi4wMDYgMjI2LjAwN3oiLz48cGF0aCBkPSJNMTIyOS4yMiA5OTkuODhoLjFMOTk5Ljk5IDc3MC41NSA4MzAuNTEgOTQwLjAzaC0uMDFsLTE5LjQ3IDE5LjQ4LTQwLjE2IDQwLjE3LS4zMi4zMS4zMi4zMyAyMjkuMTIgMjI5LjEzIDIyOS4zMy0yMjkuMzMuMTEtLjEzLS4yMS0uMTEiLz48L2c+PC9zdmc+',
|
||||
symbol: 'BNB',
|
||||
explorerurl: 'https://testnet.bscscan.com'
|
||||
},
|
||||
|
Loading…
x
Reference in New Issue
Block a user