接入转账和提款相关接口
This commit is contained in:
cebgcontract
parent
003d8dd4d2
commit
df750fb43d
@ -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" @click="onClick">
|
||||
<button :disabled="coinData.btnDisable || process" class="general-btn btn" @click="onClick">
|
||||
<span class="title">{{coinData.btnName}}</span>
|
||||
</button>
|
||||
</div>
|
||||
@ -43,6 +43,7 @@ export interface ICoinData{
|
||||
})
|
||||
export default class CoinCard extends Vue {
|
||||
@Prop() private coinData: ICoinData
|
||||
@Prop() private process = false
|
||||
|
||||
get mobile() {
|
||||
return AppModule.device === DeviceType.Mobile
|
||||
|
||||
@ -28,6 +28,7 @@
|
||||
<coin-card
|
||||
v-for="d in coinList"
|
||||
:coin-data="d"
|
||||
:process = "showOrderStatus"
|
||||
@coin-card-clicked = "onCardClicked"
|
||||
:key="d.symbol"></coin-card>
|
||||
</div>
|
||||
@ -39,10 +40,16 @@
|
||||
<coin-card
|
||||
v-for="d in gameCoinList"
|
||||
:coin-data="d"
|
||||
:process = "showOrderStatus"
|
||||
@coin-card-clicked = "onGameCardClicked"
|
||||
:key="d.symbol"></coin-card>
|
||||
</div>
|
||||
<price-picker-modal></price-picker-modal>
|
||||
<div class="order-status" v-show="showOrderStatus">
|
||||
<el-tooltip class="item" effect="light" content="Transaction in progress" placement="right">
|
||||
<time-loader></time-loader>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
@ -57,12 +64,16 @@ import { CONTRACT_ADDRESS } from '@/configs/config_chain'
|
||||
import { formatPrice } from '@/utils/chain.util'
|
||||
import { getUserInfo } from '@/api/User'
|
||||
import PricePickerModal, { SHOW_AMOUNT_MODAL } from '@/components/market/PricePickerModal.vue'
|
||||
import { EventBus, SHOW_CHAIN_MODAL } from '@/utils/event-bus'
|
||||
import { queryRechargeResult, queryWithdrawalResult } from '@/api/Market'
|
||||
import { EventBus } from '@/utils/event-bus'
|
||||
import { queryRechargeResult, queryWithdrawalResult, withdrawal } from '@/api/Market'
|
||||
import { ElLoadingComponent } from 'element-ui/types/loading'
|
||||
import TimeLoader from '@/components/main/TimeLoader.vue'
|
||||
|
||||
const TMP_ORDER_ID = 'tmp_coin_order_id'
|
||||
@Component({
|
||||
name: 'WalletPanel',
|
||||
components: {
|
||||
TimeLoader,
|
||||
PricePickerModal,
|
||||
PlaceholderPanel,
|
||||
GameCoinCard,
|
||||
@ -73,6 +84,10 @@ import { queryRechargeResult, queryWithdrawalResult } from '@/api/Market'
|
||||
export default class WalletPanel extends Vue {
|
||||
private currentNet: number = this.nets[0].id
|
||||
chainManager = new ChainManager()
|
||||
orderTimer: any = null
|
||||
showOrderStatus = false
|
||||
historyOrderId: string | null = ''
|
||||
loadingInstance: ElLoadingComponent
|
||||
|
||||
get nets() {
|
||||
return [...new ChainManager().availableChains.values()]
|
||||
@ -85,8 +100,11 @@ export default class WalletPanel extends Vue {
|
||||
@Watch('logined')
|
||||
private accountChange() {
|
||||
this.changeNet(this.nets[0].id)
|
||||
this.updateCurrencies()
|
||||
this.updateGameCoins()
|
||||
if (this.account) {
|
||||
this.updateCurrencies()
|
||||
this.updateGameCoins()
|
||||
this.checkOrderHistory()
|
||||
}
|
||||
}
|
||||
|
||||
private currencies: ICurrentData[] = []
|
||||
@ -152,6 +170,10 @@ export default class WalletPanel extends Vue {
|
||||
}
|
||||
}
|
||||
|
||||
mounted() {
|
||||
this.checkOrderHistory()
|
||||
}
|
||||
|
||||
updateDefaultData(data: ICoinData) {
|
||||
data.amount = '-'
|
||||
data.price = '-'
|
||||
@ -240,11 +262,13 @@ export default class WalletPanel extends Vue {
|
||||
if (!value) {
|
||||
return
|
||||
}
|
||||
|
||||
this.loadingInstance = this.$loading({})
|
||||
try {
|
||||
const res = await this.beginTransfer(data, value)
|
||||
console.log(res)
|
||||
const txHash = res.transactionHash
|
||||
this.saveTmpOrderInfo(txHash, 0)
|
||||
this.beginTraceOrderStatus(txHash, 0)
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
this.$message({
|
||||
@ -252,11 +276,12 @@ export default class WalletPanel extends Vue {
|
||||
message: 'error transfer'
|
||||
})
|
||||
}
|
||||
this.loadingInstance?.close()
|
||||
}
|
||||
|
||||
async beginTransfer(data: ICoinData, amount: number) {
|
||||
return this.chainManager.transferToAccount({
|
||||
to: '0x42448C6a38c08637218D8327b748F213fC2c0231',
|
||||
to: '0x50A8e60041A206AcaA5F844a1104896224be6F39',
|
||||
amount: amount,
|
||||
chainId: data.chain!,
|
||||
address: data.address!
|
||||
@ -281,29 +306,33 @@ export default class WalletPanel extends Vue {
|
||||
if (!value) {
|
||||
return
|
||||
}
|
||||
const postData = {
|
||||
account: AppModule.accountId,
|
||||
type: data.id === 'gold' ? 1 : 2,
|
||||
amount: value + '000000000000000000'
|
||||
}
|
||||
this.loadingInstance = this.$loading({})
|
||||
try {
|
||||
const res: any = await withdrawal(postData)
|
||||
console.log('withdrawal result: ', res)
|
||||
const seqId = res.seq_id
|
||||
this.saveTmpOrderInfo(seqId, 1)
|
||||
this.beginTraceOrderStatus(seqId, 1)
|
||||
this.loadingInstance?.close()
|
||||
} catch (err) {
|
||||
this.loadingInstance?.close()
|
||||
}
|
||||
console.log('begin claim')
|
||||
}
|
||||
|
||||
async updateGameCoins() {
|
||||
const data = { account: AppModule.accountId }
|
||||
const res: any = await getUserInfo(data)
|
||||
// const res: any = {
|
||||
// errcode: 0, // 错误码
|
||||
// errmsg: '', // 错误描述
|
||||
// info: { // struct BcUserInfo, 用户信息
|
||||
// account: '', // 账号
|
||||
// gold: 1000, // 金币
|
||||
// diamond: 2000 // 钻石
|
||||
// }
|
||||
// }
|
||||
if (res.info) {
|
||||
const info = res.info
|
||||
for (let i = 0, l = this.gameCoinList.length; i < l; i++) {
|
||||
const data = this.gameCoinList[i]
|
||||
data.amount = info[data.id] || 0
|
||||
data.btnDisable = data.amount === 0
|
||||
this.$set(this.gameCoinList, i, data)
|
||||
}
|
||||
const info: any = await getUserInfo(data)
|
||||
for (let i = 0, l = this.gameCoinList.length; i < l; i++) {
|
||||
const data = this.gameCoinList[i]
|
||||
data.amount = info[data.id] || 0
|
||||
data.btnDisable = data.amount === 0
|
||||
this.$set(this.gameCoinList, i, data)
|
||||
}
|
||||
}
|
||||
|
||||
@ -337,7 +366,15 @@ export default class WalletPanel extends Vue {
|
||||
txhash
|
||||
}
|
||||
try {
|
||||
const res = await queryRechargeResult(data)
|
||||
const res: any = await queryRechargeResult(data)
|
||||
console.log('queryRechargeResult: ', res)
|
||||
if (res.state === 1) {
|
||||
this.resetTmpOrderId()
|
||||
this.showOrderStatus = false
|
||||
this.updateGameCoins()
|
||||
this.updateBalanceSet()
|
||||
this.$alert('Congratulations', 'Deposit Success', { type: 'success', confirmButtonText: 'OK' })
|
||||
}
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
}
|
||||
@ -354,11 +391,68 @@ export default class WalletPanel extends Vue {
|
||||
seq_id: seqId
|
||||
}
|
||||
try {
|
||||
const res = await queryWithdrawalResult(data)
|
||||
const res: any = await queryWithdrawalResult(data)
|
||||
console.log('queryWithdrawalResult: ', res)
|
||||
if (res.state === 1) {
|
||||
this.resetTmpOrderId()
|
||||
this.showOrderStatus = false
|
||||
this.updateGameCoins()
|
||||
this.updateBalanceSet()
|
||||
this.$alert('Congratulations', 'Claim Success', { type: 'success', confirmButtonText: 'OK' })
|
||||
}
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
}
|
||||
}
|
||||
|
||||
checkOrderHistory() {
|
||||
const data = this.getTmpOrderInfo()
|
||||
if (data && this.account) {
|
||||
this.beginTraceOrderStatus(data.orderId, data.type)
|
||||
}
|
||||
}
|
||||
|
||||
resetTmpOrderId() {
|
||||
if (this.orderTimer !== null) {
|
||||
clearInterval(this.orderTimer)
|
||||
this.orderTimer = null
|
||||
}
|
||||
this.removeTmpOrderInfo()
|
||||
this.loadingInstance?.close()
|
||||
}
|
||||
|
||||
saveTmpOrderInfo(orderId: string, type: number) {
|
||||
const data = { orderId, type }
|
||||
localStorage.setItem(TMP_ORDER_ID, JSON.stringify(data))
|
||||
}
|
||||
|
||||
removeTmpOrderInfo() {
|
||||
localStorage.removeItem(TMP_ORDER_ID)
|
||||
}
|
||||
|
||||
getTmpOrderInfo() {
|
||||
const dataStr = localStorage.getItem(TMP_ORDER_ID)
|
||||
if (dataStr) {
|
||||
try {
|
||||
return JSON.parse(dataStr)
|
||||
} catch (err) {
|
||||
return null
|
||||
}
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
beginTraceOrderStatus(orderId: string, type: number) {
|
||||
this.showOrderStatus = true
|
||||
this.loadingInstance?.close()
|
||||
this.orderTimer = setInterval(() => {
|
||||
if (type === 0) {
|
||||
this.queryRechargeOrder(orderId)
|
||||
} else {
|
||||
this.queryWithdrawOrder(orderId)
|
||||
}
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@ -463,6 +557,20 @@ export default class WalletPanel extends Vue {
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
.order-status {
|
||||
transform: scale(0.3);
|
||||
width: 220px;
|
||||
height: 220px;
|
||||
border-radius: 110px;
|
||||
background: white;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
transform-origin: top;
|
||||
position: fixed;
|
||||
left: 100px;
|
||||
top: 100px;
|
||||
}
|
||||
@include media('<wide') {
|
||||
.wallet-container{
|
||||
width: 1024px;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user