forked from cerc-io/cosmos-explorer
remove old operation components
This commit is contained in:
parent
161a6d6c67
commit
16f64d4fe1
@ -1,510 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<b-modal
|
|
||||||
id="delegate-window"
|
|
||||||
centered
|
|
||||||
size="md"
|
|
||||||
title="Delegate Token"
|
|
||||||
ok-title="Send"
|
|
||||||
hide-header-close
|
|
||||||
scrollable
|
|
||||||
:ok-disabled="!selectedAddress"
|
|
||||||
@hidden="resetModal"
|
|
||||||
@ok="handleOk"
|
|
||||||
@show="loadBalance"
|
|
||||||
>
|
|
||||||
<b-overlay
|
|
||||||
:show="!selectedAddress"
|
|
||||||
rounded="sm"
|
|
||||||
>
|
|
||||||
<template #overlay>
|
|
||||||
<div class="text-center">
|
|
||||||
<b-avatar
|
|
||||||
icon="stopwatch"
|
|
||||||
font-scale="3"
|
|
||||||
animation="cylon"
|
|
||||||
/>
|
|
||||||
<p id="cancel-label">
|
|
||||||
No available account found.
|
|
||||||
</p>
|
|
||||||
<b-button
|
|
||||||
v-ripple.400="'rgba(255, 255, 255, 0.15)'"
|
|
||||||
variant="outline-primary"
|
|
||||||
to="/wallet/import"
|
|
||||||
>
|
|
||||||
Connect Wallet
|
|
||||||
</b-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<validation-observer ref="simpleRules">
|
|
||||||
<b-form>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Validator"
|
|
||||||
>
|
|
||||||
<b-form-group
|
|
||||||
label="Validator"
|
|
||||||
label-for="validator"
|
|
||||||
>
|
|
||||||
<v-select
|
|
||||||
v-model="selectedValidator"
|
|
||||||
:options="valOptions"
|
|
||||||
:reduce="val => val.value"
|
|
||||||
placeholder="Select a validator"
|
|
||||||
:readonly="validatorAddress"
|
|
||||||
/>
|
|
||||||
</b-form-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Delegator"
|
|
||||||
label-for="Delegator"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Delegator"
|
|
||||||
>
|
|
||||||
<b-form-select
|
|
||||||
v-if="account.length > 0"
|
|
||||||
v-model="selectedAddress"
|
|
||||||
:options="account"
|
|
||||||
text-field="label"
|
|
||||||
@change="onChange"
|
|
||||||
/>
|
|
||||||
<b-form-input
|
|
||||||
v-else
|
|
||||||
v-model="selectedAddress"
|
|
||||||
readonly
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Available Token"
|
|
||||||
label-for="Token"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Token"
|
|
||||||
>
|
|
||||||
<b-form-select
|
|
||||||
v-model="token"
|
|
||||||
text-field="label"
|
|
||||||
>
|
|
||||||
<b-form-select-option
|
|
||||||
v-for="x in balance"
|
|
||||||
:key="x.denom"
|
|
||||||
:value="x.denom"
|
|
||||||
>
|
|
||||||
{{ format(x) }}
|
|
||||||
</b-form-select-option>
|
|
||||||
</b-form-select>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Amount"
|
|
||||||
label-for="Amount"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|regex:^([0-9\.]+)$"
|
|
||||||
name="amount"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input
|
|
||||||
id="Amount"
|
|
||||||
v-model="amount"
|
|
||||||
:state="errors.length > 0 ? false:null"
|
|
||||||
placeholder="Input a number"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<b-input-group-append is-text>
|
|
||||||
{{ printDenom() }}
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Fee"
|
|
||||||
label-for="Fee"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|integer"
|
|
||||||
name="fee"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input v-model="fee" />
|
|
||||||
<b-input-group-append>
|
|
||||||
<b-form-select
|
|
||||||
v-model="feeDenom"
|
|
||||||
:options="feeDenoms"
|
|
||||||
value-field="denom"
|
|
||||||
text-field="denom"
|
|
||||||
/>
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group>
|
|
||||||
<b-form-checkbox
|
|
||||||
v-model="advance"
|
|
||||||
name="advance"
|
|
||||||
value="true"
|
|
||||||
>
|
|
||||||
<small>Advanced</small>
|
|
||||||
</b-form-checkbox>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row v-if="advance">
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Gas"
|
|
||||||
label-for="gas"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="gas"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="gas"
|
|
||||||
v-model="gas"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Memo"
|
|
||||||
label-for="Memo"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="memo"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="Memo"
|
|
||||||
v-model="memo"
|
|
||||||
max="2"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<wallet-input-vue v-model="wallet" />
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-form>
|
|
||||||
</validation-observer>
|
|
||||||
{{ error }}
|
|
||||||
</b-overlay></b-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { ValidationProvider, ValidationObserver } from 'vee-validate'
|
|
||||||
import {
|
|
||||||
BAvatar, BModal, BRow, BCol, BInputGroup, BFormInput, BFormGroup, BFormSelect, BFormSelectOption,
|
|
||||||
BForm, BButton, BInputGroupAppend, BFormCheckbox, BOverlay,
|
|
||||||
} from 'bootstrap-vue'
|
|
||||||
import Ripple from 'vue-ripple-directive'
|
|
||||||
import {
|
|
||||||
required, email, url, between, alpha, integer, password, min, digits, alphaDash, length,
|
|
||||||
} from '@validations'
|
|
||||||
import {
|
|
||||||
abbrAddress, extractAccountNumberAndSequence, formatToken, formatTokenDenom, getLocalAccounts, getUnitAmount, setLocalTxHistory, sign, timeIn,
|
|
||||||
} from '@/libs/utils'
|
|
||||||
import vSelect from 'vue-select'
|
|
||||||
import ToastificationContent from '@core/components/toastification/ToastificationContent.vue'
|
|
||||||
import WalletInputVue from './components/WalletInput.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'DelegateDialogue',
|
|
||||||
components: {
|
|
||||||
BAvatar,
|
|
||||||
BModal,
|
|
||||||
BRow,
|
|
||||||
BCol,
|
|
||||||
BForm,
|
|
||||||
BInputGroup,
|
|
||||||
BFormInput,
|
|
||||||
BFormGroup,
|
|
||||||
BFormSelect,
|
|
||||||
BFormSelectOption,
|
|
||||||
BFormCheckbox,
|
|
||||||
vSelect,
|
|
||||||
BButton,
|
|
||||||
BInputGroupAppend,
|
|
||||||
BOverlay,
|
|
||||||
WalletInputVue,
|
|
||||||
|
|
||||||
ValidationProvider,
|
|
||||||
ValidationObserver,
|
|
||||||
// eslint-disable-next-line vue/no-unused-components
|
|
||||||
ToastificationContent,
|
|
||||||
},
|
|
||||||
directives: {
|
|
||||||
Ripple,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
validatorAddress: {
|
|
||||||
type: String,
|
|
||||||
default: null,
|
|
||||||
},
|
|
||||||
address: {
|
|
||||||
type: String,
|
|
||||||
default: null,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
selectedAddress: this.address,
|
|
||||||
availableAddress: [],
|
|
||||||
validators: [],
|
|
||||||
unbundValidators: [],
|
|
||||||
selectedValidator: null,
|
|
||||||
token: '',
|
|
||||||
amount: null,
|
|
||||||
chainId: '',
|
|
||||||
selectedChain: '',
|
|
||||||
balance: [],
|
|
||||||
delegations: [],
|
|
||||||
IBCDenom: {},
|
|
||||||
memo: '',
|
|
||||||
fee: '900',
|
|
||||||
feeDenom: '',
|
|
||||||
wallet: 'ledgerUSB',
|
|
||||||
error: null,
|
|
||||||
sequence: 1,
|
|
||||||
accountNumber: 0,
|
|
||||||
advance: false,
|
|
||||||
gas: '200000',
|
|
||||||
|
|
||||||
required,
|
|
||||||
password,
|
|
||||||
email,
|
|
||||||
min,
|
|
||||||
integer,
|
|
||||||
url,
|
|
||||||
alpha,
|
|
||||||
between,
|
|
||||||
digits,
|
|
||||||
length,
|
|
||||||
alphaDash,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
valOptions() {
|
|
||||||
const vals = this.validators.map(x => ({ value: x.operator_address, label: `${x.description.moniker} (${Number(x.commission.rate) * 100}%)` }))
|
|
||||||
const unbunded = this.unbundValidators.map(x => ({ value: x.operator_address, label: `* ${x.description.moniker} (${Number(x.commission.rate) * 100}%)` }))
|
|
||||||
return vals.concat(unbunded)
|
|
||||||
},
|
|
||||||
feeDenoms() {
|
|
||||||
if (!this.balance) return []
|
|
||||||
return this.balance.filter(item => !item.denom.startsWith('ibc'))
|
|
||||||
},
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
// console.log('address: ', this.address)
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
printDenom() {
|
|
||||||
return formatTokenDenom(this.IBCDenom[this.token] || this.token)
|
|
||||||
},
|
|
||||||
onChange() {
|
|
||||||
if (this.selectedAddress) {
|
|
||||||
this.$http.getBankBalances(this.selectedAddress).then(res => {
|
|
||||||
if (res && res.length > 0) {
|
|
||||||
this.balance = res.reverse()
|
|
||||||
const token = this.balance.find(i => !i.denom.startsWith('ibc'))
|
|
||||||
this.token = token.denom
|
|
||||||
if (token) this.feeDenom = token.denom
|
|
||||||
this.balance.filter(i => i.denom.startsWith('ibc')).forEach(x => {
|
|
||||||
if (!this.IBCDenom[x.denom]) {
|
|
||||||
this.$http.getIBCDenomTrace(x.denom).then(denom => {
|
|
||||||
this.IBCDenom[x.denom] = denom.denom_trace.base_denom
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getLatestBlock().then(ret => {
|
|
||||||
this.chainId = ret.block.header.chain_id
|
|
||||||
const notSynced = timeIn(ret.block.header.time, 10, 'm')
|
|
||||||
if (notSynced) {
|
|
||||||
this.error = 'Client is not synced or blockchain is halted'
|
|
||||||
} else {
|
|
||||||
this.error = null
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getAuthAccount(this.selectedAddress).then(ret => {
|
|
||||||
const account = extractAccountNumberAndSequence(ret)
|
|
||||||
this.accountNumber = account.accountNumber
|
|
||||||
this.sequence = account.sequence
|
|
||||||
})
|
|
||||||
this.fee = this.$store.state.chains.selected?.min_tx_fee || '1000'
|
|
||||||
this.feeDenom = this.$store.state.chains.selected?.assets[0]?.base || ''
|
|
||||||
}
|
|
||||||
// this.$http.getStakingDelegations(this.selectedAddress).then(res => {
|
|
||||||
// this.delegations = res.delegation_responses
|
|
||||||
// })
|
|
||||||
},
|
|
||||||
computeAccount() {
|
|
||||||
const accounts = getLocalAccounts()
|
|
||||||
const values = accounts ? Object.values(accounts) : []
|
|
||||||
let array = []
|
|
||||||
for (let i = 0; i < values.length; i += 1) {
|
|
||||||
const addrs = values[i].address.filter(x => x.chain === this.$route.params.chain)
|
|
||||||
if (addrs && addrs.length > 0) {
|
|
||||||
array = array.concat(addrs.map(x => ({ value: x.addr, label: values[i].name.concat(' - ', abbrAddress(x.addr)) })))
|
|
||||||
if (!this.selectedAddress) {
|
|
||||||
this.selectedAddress = addrs[0].addr
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
this.selectedValidator = this.validatorAddress
|
|
||||||
return array
|
|
||||||
},
|
|
||||||
loadBalance() {
|
|
||||||
this.account = this.computeAccount()
|
|
||||||
// if (this.account && this.account.length > 0) this.selectedAddress
|
|
||||||
this.$http.getValidatorList().then(v => {
|
|
||||||
this.validators = v
|
|
||||||
})
|
|
||||||
this.$http.getValidatorUnbondedList().then(v => {
|
|
||||||
this.unbundValidators = v
|
|
||||||
})
|
|
||||||
this.onChange()
|
|
||||||
},
|
|
||||||
handleOk(bvModalEvt) {
|
|
||||||
// console.log('send')
|
|
||||||
// Prevent modal from closing
|
|
||||||
bvModalEvt.preventDefault()
|
|
||||||
// Trigger submit handler
|
|
||||||
// this.handleSubmit()
|
|
||||||
this.$refs.simpleRules.validate().then(ok => {
|
|
||||||
if (ok) {
|
|
||||||
this.sendTx().then(ret => {
|
|
||||||
// console.log(ret)
|
|
||||||
this.error = ret
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
resetModal() {
|
|
||||||
this.feeDenom = ''
|
|
||||||
this.error = null
|
|
||||||
},
|
|
||||||
format(v) {
|
|
||||||
return formatToken(v, this.IBCDenom)
|
|
||||||
},
|
|
||||||
async sendTx() {
|
|
||||||
const txMsgs = [{
|
|
||||||
typeUrl: '/cosmos.staking.v1beta1.MsgDelegate',
|
|
||||||
value: {
|
|
||||||
delegatorAddress: this.selectedAddress,
|
|
||||||
validatorAddress: this.selectedValidator,
|
|
||||||
amount: {
|
|
||||||
amount: getUnitAmount(this.amount, this.token),
|
|
||||||
denom: this.token,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}]
|
|
||||||
|
|
||||||
if (txMsgs.length === 0) {
|
|
||||||
this.error = 'No delegation found'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
if (!this.accountNumber) {
|
|
||||||
this.error = 'Account number should not be empty!'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
|
|
||||||
const txFee = {
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: this.fee,
|
|
||||||
denom: this.feeDenom,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
gas: this.gas,
|
|
||||||
}
|
|
||||||
|
|
||||||
const signerData = {
|
|
||||||
accountNumber: this.accountNumber,
|
|
||||||
sequence: this.sequence,
|
|
||||||
chainId: this.chainId,
|
|
||||||
}
|
|
||||||
|
|
||||||
sign(
|
|
||||||
this.wallet,
|
|
||||||
this.chainId,
|
|
||||||
this.selectedAddress,
|
|
||||||
txMsgs,
|
|
||||||
txFee,
|
|
||||||
this.memo,
|
|
||||||
signerData,
|
|
||||||
).then(bodyBytes => {
|
|
||||||
this.$http.broadcastTx(bodyBytes).then(res => {
|
|
||||||
setLocalTxHistory({
|
|
||||||
chain: this.$store.state.chains.selected,
|
|
||||||
op: 'delegate',
|
|
||||||
hash: res.tx_response.txhash,
|
|
||||||
time: new Date(),
|
|
||||||
})
|
|
||||||
this.$bvModal.hide('delegate-window')
|
|
||||||
this.$toast({
|
|
||||||
component: ToastificationContent,
|
|
||||||
props: {
|
|
||||||
title: 'Transaction sent!',
|
|
||||||
icon: 'EditIcon',
|
|
||||||
variant: 'success',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
<style lang="scss">
|
|
||||||
@import '@core/scss/vue/libs/vue-select.scss';
|
|
||||||
</style>
|
|
@ -1,452 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<b-modal
|
|
||||||
id="deposit-window"
|
|
||||||
centered
|
|
||||||
size="md"
|
|
||||||
title="Deposit"
|
|
||||||
ok-title="Send"
|
|
||||||
hide-header-close
|
|
||||||
scrollable
|
|
||||||
:ok-disabled="!voter"
|
|
||||||
@hidden="resetModal"
|
|
||||||
@ok="handleOk"
|
|
||||||
@show="loadBalance"
|
|
||||||
><b-overlay
|
|
||||||
:show="!voter"
|
|
||||||
rounded="sm"
|
|
||||||
>
|
|
||||||
<template #overlay>
|
|
||||||
<div class="text-center">
|
|
||||||
<p id="cancel-label">
|
|
||||||
No available account found.
|
|
||||||
</p>
|
|
||||||
<b-button
|
|
||||||
variant="outline-primary"
|
|
||||||
to="/wallet/import"
|
|
||||||
>
|
|
||||||
Connect Wallet
|
|
||||||
</b-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<validation-observer ref="simpleRules">
|
|
||||||
<b-form>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<h4>{{ proposalId }}. {{ title }}</h4>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Depositor"
|
|
||||||
label-for="Voter"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Voter"
|
|
||||||
>
|
|
||||||
<b-form-select
|
|
||||||
v-model="voter"
|
|
||||||
:options="accounts"
|
|
||||||
text-field="label"
|
|
||||||
placeholder="Select an address"
|
|
||||||
@change="onChange"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Available Token"
|
|
||||||
label-for="Token"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Token"
|
|
||||||
>
|
|
||||||
<b-form-select
|
|
||||||
v-model="token"
|
|
||||||
>
|
|
||||||
<b-form-select-option
|
|
||||||
v-for="item in balance"
|
|
||||||
:key="item.denom"
|
|
||||||
:value="item.denom"
|
|
||||||
>
|
|
||||||
{{ format(item) }}
|
|
||||||
</b-form-select-option>
|
|
||||||
</b-form-select>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Amount"
|
|
||||||
label-for="Amount"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|regex:^([0-9\.]+)$"
|
|
||||||
name="amount"
|
|
||||||
>
|
|
||||||
<b-input-group class="mb-25">
|
|
||||||
<b-form-input
|
|
||||||
id="Amount"
|
|
||||||
v-model="amount"
|
|
||||||
:state="errors.length > 0 ? false:null"
|
|
||||||
placeholder="Input a number"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<b-input-group-append is-text>
|
|
||||||
{{ printDenom() }}
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Fee"
|
|
||||||
label-for="Fee"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|integer"
|
|
||||||
name="fee"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input v-model="fee" />
|
|
||||||
<b-input-group-append>
|
|
||||||
<b-form-select
|
|
||||||
v-model="feeDenom"
|
|
||||||
:options="feeDenoms"
|
|
||||||
value-field="denom"
|
|
||||||
text-field="denom"
|
|
||||||
/>
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group>
|
|
||||||
<b-form-checkbox
|
|
||||||
v-model="advance"
|
|
||||||
name="advance"
|
|
||||||
value="true"
|
|
||||||
>
|
|
||||||
<small>Advanced</small>
|
|
||||||
</b-form-checkbox>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row v-if="advance">
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Gas"
|
|
||||||
label-for="gas"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="gas"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="gas"
|
|
||||||
v-model="gas"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Memo"
|
|
||||||
label-for="Memo"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="memo"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="Memo"
|
|
||||||
v-model="memo"
|
|
||||||
max="2"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<wallet-input-vue v-model="wallet" />
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-form>
|
|
||||||
</validation-observer>
|
|
||||||
{{ error }}
|
|
||||||
</b-overlay></b-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { ValidationProvider, ValidationObserver } from 'vee-validate'
|
|
||||||
import {
|
|
||||||
BModal, BRow, BCol, BInputGroup, BFormInput, BFormGroup, BFormSelect, BFormCheckbox,
|
|
||||||
BForm, BInputGroupAppend, BOverlay, BButton, BFormSelectOption,
|
|
||||||
} from 'bootstrap-vue'
|
|
||||||
import {
|
|
||||||
required, email, url, between, alpha, integer, password, min, digits, alphaDash, length,
|
|
||||||
} from '@validations'
|
|
||||||
import {
|
|
||||||
abbrAddress,
|
|
||||||
extractAccountNumberAndSequence,
|
|
||||||
formatToken, formatTokenDenom, getLocalAccounts, getUnitAmount, setLocalTxHistory, sign, timeIn,
|
|
||||||
} from '@/libs/utils'
|
|
||||||
import ToastificationContent from '@core/components/toastification/ToastificationContent.vue'
|
|
||||||
import WalletInputVue from './components/WalletInput.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'DepositDialogue',
|
|
||||||
components: {
|
|
||||||
BModal,
|
|
||||||
BRow,
|
|
||||||
BCol,
|
|
||||||
BForm,
|
|
||||||
BInputGroup,
|
|
||||||
BFormInput,
|
|
||||||
BFormGroup,
|
|
||||||
BFormSelect,
|
|
||||||
BFormCheckbox,
|
|
||||||
BInputGroupAppend,
|
|
||||||
BOverlay,
|
|
||||||
BButton,
|
|
||||||
BFormSelectOption,
|
|
||||||
|
|
||||||
ValidationProvider,
|
|
||||||
ValidationObserver,
|
|
||||||
|
|
||||||
WalletInputVue,
|
|
||||||
// eslint-disable-next-line vue/no-unused-components
|
|
||||||
ToastificationContent,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
proposalId: {
|
|
||||||
type: Number,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
title: {
|
|
||||||
type: String,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
accounts: [],
|
|
||||||
voter: null,
|
|
||||||
option: null,
|
|
||||||
chainId: '',
|
|
||||||
selectedChain: '',
|
|
||||||
balance: [],
|
|
||||||
memo: '',
|
|
||||||
fee: '',
|
|
||||||
feeDenom: '',
|
|
||||||
wallet: 'ledgerUSB',
|
|
||||||
error: null,
|
|
||||||
sequence: 1,
|
|
||||||
accountNumber: 0,
|
|
||||||
gas: '200000',
|
|
||||||
advance: false,
|
|
||||||
token: null,
|
|
||||||
amount: '',
|
|
||||||
|
|
||||||
required,
|
|
||||||
password,
|
|
||||||
email,
|
|
||||||
min,
|
|
||||||
integer,
|
|
||||||
url,
|
|
||||||
alpha,
|
|
||||||
between,
|
|
||||||
digits,
|
|
||||||
length,
|
|
||||||
alphaDash,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
feeDenoms() {
|
|
||||||
return this.balance.filter(item => !item.denom.startsWith('ibc'))
|
|
||||||
},
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
printDenom() {
|
|
||||||
return formatTokenDenom(this.token)
|
|
||||||
},
|
|
||||||
computeAccount() {
|
|
||||||
let array = []
|
|
||||||
const accounts = getLocalAccounts()
|
|
||||||
if (accounts) {
|
|
||||||
const values = Object.values(accounts)
|
|
||||||
for (let i = 0; i < values.length; i += 1) {
|
|
||||||
const addrs = values[i].address.filter(x => x.chain === this.$route.params.chain)
|
|
||||||
if (addrs && addrs.length > 0) {
|
|
||||||
array = array.concat(addrs.map(x => ({ value: x.addr, label: values[i].name.concat(' - ', abbrAddress(x.addr)) })))
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return array
|
|
||||||
},
|
|
||||||
onChange() {
|
|
||||||
this.fee = this.$store.state.chains.selected?.min_tx_fee || '1000'
|
|
||||||
this.feeDenom = this.$store.state.chains.selected?.assets[0]?.base || ''
|
|
||||||
if (this.voter) {
|
|
||||||
this.$http.getBankBalances(this.voter).then(res => {
|
|
||||||
if (res && res.length > 0) {
|
|
||||||
this.balance = res.reverse().filter(x => !x.denom.startsWith('ibc'))
|
|
||||||
const token = this.balance.find(i => !i.denom.startsWith('ibc'))
|
|
||||||
if (token) {
|
|
||||||
this.feeDenom = token.denom
|
|
||||||
this.token = token.denom
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getLatestBlock().then(ret => {
|
|
||||||
this.chainId = ret.block.header.chain_id
|
|
||||||
const notSynced = timeIn(ret.block.header.time, 10, 'm')
|
|
||||||
if (notSynced) {
|
|
||||||
this.error = 'Client is not synced or blockchain is halted'
|
|
||||||
} else {
|
|
||||||
this.error = null
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getAuthAccount(this.voter).then(ret => {
|
|
||||||
const account = extractAccountNumberAndSequence(ret)
|
|
||||||
this.accountNumber = account.accountNumber
|
|
||||||
this.sequence = account.sequence
|
|
||||||
})
|
|
||||||
this.fee = this.$store.state.chains.selected?.min_tx_fee || '1000'
|
|
||||||
this.feeDenom = this.$store.state.chains.selected?.assets[0]?.base || ''
|
|
||||||
}
|
|
||||||
},
|
|
||||||
loadBalance() {
|
|
||||||
this.accounts = this.computeAccount()
|
|
||||||
// eslint-disable-next-line prefer-destructuring
|
|
||||||
if (this.accounts && this.accounts.length > 0) this.voter = this.accounts[0].value
|
|
||||||
this.onChange()
|
|
||||||
},
|
|
||||||
handleOk(bvModalEvt) {
|
|
||||||
// console.log('send')
|
|
||||||
// Prevent modal from closing
|
|
||||||
bvModalEvt.preventDefault()
|
|
||||||
this.$refs.simpleRules.validate().then(ok => {
|
|
||||||
if (ok) {
|
|
||||||
this.sendTx().then(ret => {
|
|
||||||
// console.log(ret)
|
|
||||||
this.error = ret
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
resetModal() {
|
|
||||||
this.feeDenom = ''
|
|
||||||
this.error = null
|
|
||||||
},
|
|
||||||
format(v) {
|
|
||||||
return formatToken(v)
|
|
||||||
},
|
|
||||||
async sendTx() {
|
|
||||||
const txMsgs = [{
|
|
||||||
typeUrl: '/cosmos.gov.v1beta1.MsgDeposit',
|
|
||||||
value: {
|
|
||||||
depositor: this.voter,
|
|
||||||
proposalId: String(this.proposalId),
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: getUnitAmount(this.amount, this.token),
|
|
||||||
denom: this.token,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
}]
|
|
||||||
|
|
||||||
if (txMsgs.length === 0) {
|
|
||||||
this.error = 'No delegation found'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
if (!this.accountNumber) {
|
|
||||||
this.error = 'Account number should not be empty!'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
|
|
||||||
const txFee = {
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: this.fee,
|
|
||||||
denom: this.feeDenom,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
gas: this.gas,
|
|
||||||
}
|
|
||||||
|
|
||||||
const signerData = {
|
|
||||||
accountNumber: this.accountNumber,
|
|
||||||
sequence: this.sequence,
|
|
||||||
chainId: this.chainId,
|
|
||||||
}
|
|
||||||
|
|
||||||
sign(
|
|
||||||
this.wallet,
|
|
||||||
this.chainId,
|
|
||||||
this.voter,
|
|
||||||
txMsgs,
|
|
||||||
txFee,
|
|
||||||
this.memo,
|
|
||||||
signerData,
|
|
||||||
).then(bodyBytes => {
|
|
||||||
this.$http.broadcastTx(bodyBytes, this.selectedChain).then(res => {
|
|
||||||
setLocalTxHistory({
|
|
||||||
chain: this.$store.state.chains.selected,
|
|
||||||
op: 'deposit',
|
|
||||||
hash: res.tx_response.txhash,
|
|
||||||
time: new Date(),
|
|
||||||
})
|
|
||||||
this.$bvModal.hide('deposit-window')
|
|
||||||
this.$toast({
|
|
||||||
component: ToastificationContent,
|
|
||||||
props: {
|
|
||||||
title: 'Transaction sent!',
|
|
||||||
icon: 'EditIcon',
|
|
||||||
variant: 'success',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
// Send tokens
|
|
||||||
// return client.sendTokens(this.address, this.recipient, sendCoins, this.memo)
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
@import '@core/scss/vue/libs/vue-select.scss';
|
|
||||||
</style>
|
|
@ -1,452 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<b-modal
|
|
||||||
id="redelegate-window"
|
|
||||||
centered
|
|
||||||
size="md"
|
|
||||||
title="Redelegate Token"
|
|
||||||
hide-header-close
|
|
||||||
scrollable
|
|
||||||
ok-title="Send"
|
|
||||||
:ok-disabled="!selectedAddress"
|
|
||||||
@hidden="resetModal"
|
|
||||||
@ok="handleOk"
|
|
||||||
@show="loadBalance"
|
|
||||||
>
|
|
||||||
<validation-observer ref="simpleRules">
|
|
||||||
<b-form>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Delegator"
|
|
||||||
label-for="Account"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Delegator"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
v-model="address"
|
|
||||||
readonly
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="From Validator"
|
|
||||||
label-for="validator"
|
|
||||||
>
|
|
||||||
<v-select
|
|
||||||
:value="validatorAddress"
|
|
||||||
:options="valOptions"
|
|
||||||
:reduce="val => val.value"
|
|
||||||
placeholder="Select a validator"
|
|
||||||
:disabled="true"
|
|
||||||
/>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Current Delegation"
|
|
||||||
label-for="Token"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Token"
|
|
||||||
>
|
|
||||||
<v-select
|
|
||||||
v-model="token"
|
|
||||||
:options="tokenOptions"
|
|
||||||
:reduce="token => token.value"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="To Validator"
|
|
||||||
label-for="validator"
|
|
||||||
>
|
|
||||||
<v-select
|
|
||||||
v-model="toValidator"
|
|
||||||
:options="valOptions"
|
|
||||||
:reduce="val => val.value"
|
|
||||||
placeholder="Select a validator"
|
|
||||||
/>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Amount"
|
|
||||||
label-for="Amount"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|regex:^([0-9\.]+)$"
|
|
||||||
name="amount"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input
|
|
||||||
id="Amount"
|
|
||||||
v-model="amount"
|
|
||||||
:state="errors.length > 0 ? false:null"
|
|
||||||
placeholder="Input a number"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<b-input-group-append is-text>
|
|
||||||
{{ printDenom() }}
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Fee"
|
|
||||||
label-for="Fee"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|integer"
|
|
||||||
name="fee"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input v-model="fee" />
|
|
||||||
<b-input-group-append>
|
|
||||||
<b-form-select
|
|
||||||
v-model="feeDenom"
|
|
||||||
:options="feeDenoms"
|
|
||||||
value-field="denom"
|
|
||||||
text-field="denom"
|
|
||||||
/>
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group>
|
|
||||||
<b-form-checkbox
|
|
||||||
v-model="advance"
|
|
||||||
name="advance"
|
|
||||||
value="true"
|
|
||||||
>
|
|
||||||
<small>Advanced</small>
|
|
||||||
</b-form-checkbox>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row v-if="advance">
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Gas"
|
|
||||||
label-for="gas"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="gas"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="gas"
|
|
||||||
v-model="gas"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Memo"
|
|
||||||
label-for="Memo"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="memo"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="Memo"
|
|
||||||
v-model="memo"
|
|
||||||
max="2"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<wallet-input-vue v-model="wallet" />
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-form>
|
|
||||||
</validation-observer>
|
|
||||||
{{ error }}
|
|
||||||
</b-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { ValidationProvider, ValidationObserver } from 'vee-validate'
|
|
||||||
import {
|
|
||||||
BModal, BRow, BCol, BInputGroup, BFormInput, BFormGroup, BFormSelect,
|
|
||||||
BForm, BFormCheckbox, BInputGroupAppend,
|
|
||||||
} from 'bootstrap-vue'
|
|
||||||
import {
|
|
||||||
required, email, url, between, alpha, integer, password, min, digits, alphaDash, length,
|
|
||||||
} from '@validations'
|
|
||||||
import {
|
|
||||||
extractAccountNumberAndSequence,
|
|
||||||
formatToken, formatTokenDenom, getUnitAmount, setLocalTxHistory, sign, timeIn,
|
|
||||||
} from '@/libs/utils'
|
|
||||||
import vSelect from 'vue-select'
|
|
||||||
import ToastificationContent from '@core/components/toastification/ToastificationContent.vue'
|
|
||||||
import WalletInputVue from './components/WalletInput.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'UnbondDialogue',
|
|
||||||
components: {
|
|
||||||
BModal,
|
|
||||||
BRow,
|
|
||||||
BCol,
|
|
||||||
BForm,
|
|
||||||
BInputGroup,
|
|
||||||
BFormInput,
|
|
||||||
BFormGroup,
|
|
||||||
BFormSelect,
|
|
||||||
vSelect,
|
|
||||||
BFormCheckbox,
|
|
||||||
BInputGroupAppend,
|
|
||||||
|
|
||||||
ValidationProvider,
|
|
||||||
ValidationObserver,
|
|
||||||
|
|
||||||
WalletInputVue,
|
|
||||||
// eslint-disable-next-line vue/no-unused-components
|
|
||||||
ToastificationContent,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
validatorAddress: {
|
|
||||||
type: String,
|
|
||||||
default: null,
|
|
||||||
},
|
|
||||||
address: {
|
|
||||||
type: String,
|
|
||||||
default: null,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
selectedAddress: this.address,
|
|
||||||
availableAddress: [],
|
|
||||||
unbundValidators: [],
|
|
||||||
validators: [],
|
|
||||||
toValidator: null,
|
|
||||||
token: '',
|
|
||||||
amount: null,
|
|
||||||
chainId: '',
|
|
||||||
selectedChain: '',
|
|
||||||
balance: [],
|
|
||||||
delegations: [],
|
|
||||||
memo: '',
|
|
||||||
fee: '800',
|
|
||||||
feeDenom: '',
|
|
||||||
wallet: 'ledgerUSB',
|
|
||||||
error: null,
|
|
||||||
sequence: 1,
|
|
||||||
accountNumber: 0,
|
|
||||||
account: [],
|
|
||||||
advance: false,
|
|
||||||
gas: '200000',
|
|
||||||
|
|
||||||
required,
|
|
||||||
password,
|
|
||||||
email,
|
|
||||||
min,
|
|
||||||
integer,
|
|
||||||
url,
|
|
||||||
alpha,
|
|
||||||
between,
|
|
||||||
digits,
|
|
||||||
length,
|
|
||||||
alphaDash,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
valOptions() {
|
|
||||||
const vals = this.validators.map(x => ({ value: x.operator_address, label: `${x.description.moniker} (${Number(x.commission.rate) * 100}%)` }))
|
|
||||||
const unbunded = this.unbundValidators.map(x => ({ value: x.operator_address, label: `* ${x.description.moniker} (${Number(x.commission.rate) * 100}%)` }))
|
|
||||||
return vals.concat(unbunded)
|
|
||||||
},
|
|
||||||
tokenOptions() {
|
|
||||||
if (!this.delegations) return []
|
|
||||||
return this.delegations.filter(x => x.delegation.validator_address === this.validatorAddress).map(x => ({ value: x.balance.denom, label: formatToken(x.balance) }))
|
|
||||||
},
|
|
||||||
feeDenoms() {
|
|
||||||
if (!this.balance) return []
|
|
||||||
return this.balance.filter(item => !item.denom.startsWith('ibc'))
|
|
||||||
},
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
// console.log('address: ', this.address)
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
printDenom() {
|
|
||||||
return formatTokenDenom(this.token)
|
|
||||||
},
|
|
||||||
loadBalance() {
|
|
||||||
this.$http.getValidatorList().then(v => {
|
|
||||||
this.validators = v
|
|
||||||
})
|
|
||||||
this.$http.getValidatorUnbondedList().then(v => {
|
|
||||||
this.unbundValidators = v
|
|
||||||
})
|
|
||||||
this.$http.getBankBalances(this.address).then(res => {
|
|
||||||
if (res && res.length > 0) {
|
|
||||||
this.balance = res.reverse()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getLatestBlock().then(ret => {
|
|
||||||
this.chainId = ret.block.header.chain_id
|
|
||||||
const notSynced = timeIn(ret.block.header.time, 10, 'm')
|
|
||||||
if (notSynced) {
|
|
||||||
this.error = 'Client is not synced or blockchain is halted'
|
|
||||||
} else {
|
|
||||||
this.error = null
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
this.$http.getAuthAccount(this.address).then(ret => {
|
|
||||||
const account = extractAccountNumberAndSequence(ret)
|
|
||||||
this.accountNumber = account.accountNumber
|
|
||||||
this.sequence = account.sequence
|
|
||||||
})
|
|
||||||
this.fee = this.$store.state.chains.selected?.min_tx_fee || '1000'
|
|
||||||
this.feeDenom = this.$store.state.chains.selected?.assets[0]?.base || ''
|
|
||||||
this.$http.getStakingDelegations(this.address).then(res => {
|
|
||||||
this.delegations = res.delegation_responses
|
|
||||||
this.delegations.forEach(x => {
|
|
||||||
if (x.delegation.validator_address === this.validatorAddress) {
|
|
||||||
this.token = x.balance.denom
|
|
||||||
this.feeDenom = x.balance.denom
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
},
|
|
||||||
handleOk(bvModalEvt) {
|
|
||||||
// console.log('send')
|
|
||||||
// Prevent modal from closing
|
|
||||||
bvModalEvt.preventDefault()
|
|
||||||
this.$refs.simpleRules.validate().then(ok => {
|
|
||||||
if (ok) {
|
|
||||||
this.sendTx().then(ret => {
|
|
||||||
// console.log(ret)
|
|
||||||
this.error = ret
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
resetModal() {
|
|
||||||
this.feeDenom = ''
|
|
||||||
this.error = null
|
|
||||||
},
|
|
||||||
format(v) {
|
|
||||||
return formatToken(v)
|
|
||||||
},
|
|
||||||
async sendTx() {
|
|
||||||
const txMsgs = [{
|
|
||||||
typeUrl: '/cosmos.staking.v1beta1.MsgBeginRedelegate',
|
|
||||||
value: {
|
|
||||||
delegatorAddress: this.address,
|
|
||||||
validatorSrcAddress: this.validatorAddress,
|
|
||||||
validatorDstAddress: this.toValidator,
|
|
||||||
amount: {
|
|
||||||
amount: getUnitAmount(this.amount, this.token),
|
|
||||||
denom: this.token,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}]
|
|
||||||
|
|
||||||
if (txMsgs.length === 0) {
|
|
||||||
this.error = 'No delegation found'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
if (!this.accountNumber) {
|
|
||||||
this.error = 'Account number should not be empty!'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
|
|
||||||
const txFee = {
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: this.fee,
|
|
||||||
denom: this.feeDenom,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
gas: this.gas,
|
|
||||||
}
|
|
||||||
|
|
||||||
const signerData = {
|
|
||||||
accountNumber: this.accountNumber,
|
|
||||||
sequence: this.sequence,
|
|
||||||
chainId: this.chainId,
|
|
||||||
}
|
|
||||||
|
|
||||||
sign(
|
|
||||||
this.wallet,
|
|
||||||
this.chainId,
|
|
||||||
this.address,
|
|
||||||
txMsgs,
|
|
||||||
txFee,
|
|
||||||
this.memo,
|
|
||||||
signerData,
|
|
||||||
).then(bodyBytes => {
|
|
||||||
this.$http.broadcastTx(bodyBytes).then(res => {
|
|
||||||
setLocalTxHistory({
|
|
||||||
chain: this.$store.state.chains.selected,
|
|
||||||
op: 'redelegate',
|
|
||||||
hash: res.tx_response.txhash,
|
|
||||||
time: new Date(),
|
|
||||||
})
|
|
||||||
this.$bvModal.hide('redelegate-window')
|
|
||||||
this.$toast({
|
|
||||||
component: ToastificationContent,
|
|
||||||
props: {
|
|
||||||
title: 'Transaction sent!',
|
|
||||||
icon: 'EditIcon',
|
|
||||||
variant: 'success',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
// Send tokens
|
|
||||||
// return client.sendTokens(this.address, this.recipient, sendCoins, this.memo)
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
<style lang="scss">
|
|
||||||
@import '@core/scss/vue/libs/vue-select.scss';
|
|
||||||
</style>
|
|
@ -1,546 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<b-modal
|
|
||||||
id="ibc-transfer-window"
|
|
||||||
centered
|
|
||||||
size="md"
|
|
||||||
title="IBC Transfer Tokens"
|
|
||||||
:ok-title="actionName"
|
|
||||||
hide-header-close
|
|
||||||
scrollable
|
|
||||||
:ok-disabled="!address || channels.length === 0"
|
|
||||||
@hidden="resetModal"
|
|
||||||
@ok="handleOk"
|
|
||||||
@show="loadBalance"
|
|
||||||
><b-overlay
|
|
||||||
:show="channels.length === 0"
|
|
||||||
rounded="sm"
|
|
||||||
>
|
|
||||||
<template #overlay>
|
|
||||||
<div class="text-center">
|
|
||||||
<b-spinner
|
|
||||||
type="grow"
|
|
||||||
variant="danger"
|
|
||||||
/>
|
|
||||||
<p>
|
|
||||||
This feature is only for experts
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<validation-observer ref="simpleRules">
|
|
||||||
<b-form>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Sender"
|
|
||||||
label-for="Account"
|
|
||||||
>
|
|
||||||
<b-input-group class="mb-25">
|
|
||||||
<b-input-group-prepend is-text>
|
|
||||||
<b-avatar
|
|
||||||
:src="account?account.logo:''"
|
|
||||||
size="18"
|
|
||||||
variant="light-primary"
|
|
||||||
rounded
|
|
||||||
/>
|
|
||||||
</b-input-group-prepend>
|
|
||||||
<b-form-input
|
|
||||||
:value="account?account.addr:address"
|
|
||||||
readonly
|
|
||||||
/>
|
|
||||||
</b-input-group>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Available Token"
|
|
||||||
label-for="Token"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Token"
|
|
||||||
>
|
|
||||||
<b-form-select
|
|
||||||
v-model="token"
|
|
||||||
@change="tokenChange"
|
|
||||||
>
|
|
||||||
<template #first>
|
|
||||||
<b-form-select-option
|
|
||||||
value=""
|
|
||||||
>
|
|
||||||
-- Please select a token --
|
|
||||||
</b-form-select-option>
|
|
||||||
</template>
|
|
||||||
<b-form-select-option
|
|
||||||
v-for="item in balance"
|
|
||||||
:key="item.denom"
|
|
||||||
:value="item.denom"
|
|
||||||
>
|
|
||||||
{{ format(item) }}
|
|
||||||
</b-form-select-option>
|
|
||||||
</b-form-select>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Amount"
|
|
||||||
label-for="Amount"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|regex:^([0-9\.]+)$"
|
|
||||||
name="amount"
|
|
||||||
>
|
|
||||||
<b-input-group class="mb-25">
|
|
||||||
<b-form-input
|
|
||||||
id="Amount"
|
|
||||||
v-model="amount"
|
|
||||||
:state="errors.length > 0 ? false:null"
|
|
||||||
placeholder="Input a number"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<b-input-group-append is-text>
|
|
||||||
{{ printDenom() }}
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
:label="`Destination: ${targetChainId}`"
|
|
||||||
label-for="destination"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="destination"
|
|
||||||
>
|
|
||||||
<v-select
|
|
||||||
v-model="destination"
|
|
||||||
name="destination"
|
|
||||||
:options="destinationOptions"
|
|
||||||
placeholder="Select a channel"
|
|
||||||
@input="onChannelChange()"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Recipient"
|
|
||||||
label-for="Recipient"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="recipient"
|
|
||||||
>
|
|
||||||
<b-input-group class="mb-25">
|
|
||||||
<b-form-input
|
|
||||||
id="Recipient"
|
|
||||||
v-model="recipient"
|
|
||||||
:state="errors.length > 0 ? false:null"
|
|
||||||
:placeholder="placeholder"
|
|
||||||
/>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Fee"
|
|
||||||
label-for="Fee"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|integer"
|
|
||||||
name="fee"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input v-model="fee" />
|
|
||||||
<b-input-group-append>
|
|
||||||
<b-form-select
|
|
||||||
v-model="feeDenom"
|
|
||||||
:options="feeDenoms"
|
|
||||||
value-field="denom"
|
|
||||||
text-field="denom"
|
|
||||||
/>
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group>
|
|
||||||
<b-form-checkbox
|
|
||||||
v-model="advance"
|
|
||||||
name="advance"
|
|
||||||
value="true"
|
|
||||||
>
|
|
||||||
<small>Advanced</small>
|
|
||||||
</b-form-checkbox>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row v-if="advance">
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Gas"
|
|
||||||
label-for="gas"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="gas"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="gas"
|
|
||||||
v-model="gas"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Memo"
|
|
||||||
label-for="Memo"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="memo"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="Memo"
|
|
||||||
v-model="memo"
|
|
||||||
max="2"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<wallet-input-vue v-model="wallet" />
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-form>
|
|
||||||
</validation-observer>
|
|
||||||
{{ error }}
|
|
||||||
</b-overlay></b-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { ValidationProvider, ValidationObserver } from 'vee-validate'
|
|
||||||
import {
|
|
||||||
BModal, BRow, BCol, BInputGroup, BInputGroupAppend, BFormInput, BAvatar, BFormGroup, BFormSelect, BFormSelectOption,
|
|
||||||
BForm, BInputGroupPrepend, BFormCheckbox, BOverlay, BSpinner,
|
|
||||||
} from 'bootstrap-vue'
|
|
||||||
import {
|
|
||||||
required, email, url, between, alpha, integer, password, min, digits, alphaDash, length,
|
|
||||||
} from '@validations'
|
|
||||||
import {
|
|
||||||
extractAccountNumberAndSequence,
|
|
||||||
formatToken, formatTokenDenom, getLocalAccounts, getLocalChains, getUnitAmount, setLocalTxHistory, sign, timeIn,
|
|
||||||
} from '@/libs/utils'
|
|
||||||
import vSelect from 'vue-select'
|
|
||||||
import ToastificationContent from '@core/components/toastification/ToastificationContent.vue'
|
|
||||||
import { coin } from '@cosmjs/amino'
|
|
||||||
import dayjs from 'dayjs'
|
|
||||||
import { toHex } from '@cosmjs/encoding'
|
|
||||||
import { sha256 } from '@cosmjs/crypto'
|
|
||||||
import WalletInputVue from './components/WalletInput.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'TransforDialogue',
|
|
||||||
components: {
|
|
||||||
BModal,
|
|
||||||
BRow,
|
|
||||||
BCol,
|
|
||||||
BForm,
|
|
||||||
BInputGroup,
|
|
||||||
BInputGroupAppend,
|
|
||||||
BInputGroupPrepend,
|
|
||||||
BFormInput,
|
|
||||||
BAvatar,
|
|
||||||
BFormGroup,
|
|
||||||
BFormSelect,
|
|
||||||
BFormSelectOption,
|
|
||||||
BFormCheckbox,
|
|
||||||
BSpinner,
|
|
||||||
vSelect,
|
|
||||||
BOverlay,
|
|
||||||
|
|
||||||
ValidationProvider,
|
|
||||||
ValidationObserver,
|
|
||||||
|
|
||||||
WalletInputVue,
|
|
||||||
// eslint-disable-next-line vue/no-unused-components
|
|
||||||
ToastificationContent,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
address: {
|
|
||||||
type: String,
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
chainId: '',
|
|
||||||
targetChainId: '',
|
|
||||||
selectedChain: '',
|
|
||||||
balance: [],
|
|
||||||
token: '',
|
|
||||||
amount: null,
|
|
||||||
memo: '',
|
|
||||||
recipient: null,
|
|
||||||
fee: '800',
|
|
||||||
feeDenom: '',
|
|
||||||
wallet: 'ledgerUSB',
|
|
||||||
error: null,
|
|
||||||
sequence: 1,
|
|
||||||
accountNumber: 0,
|
|
||||||
account: [],
|
|
||||||
IBCDenom: {},
|
|
||||||
gas: '200000',
|
|
||||||
advance: false,
|
|
||||||
paths: {},
|
|
||||||
destination: {},
|
|
||||||
channels: [],
|
|
||||||
|
|
||||||
required,
|
|
||||||
password,
|
|
||||||
email,
|
|
||||||
min,
|
|
||||||
integer,
|
|
||||||
url,
|
|
||||||
alpha,
|
|
||||||
between,
|
|
||||||
digits,
|
|
||||||
length,
|
|
||||||
alphaDash,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
feeDenoms() {
|
|
||||||
return this.balance.filter(item => !item.denom.startsWith('ibc'))
|
|
||||||
},
|
|
||||||
destinationOptions() {
|
|
||||||
if (!this.token && this.token === '') return []
|
|
||||||
const options = this.channels.map(x => ({ port_id: x.port_id, channel_id: x.channel_id, label: `${x.chain_id ? x.chain_id : ''} ${x.port_id}/${x.channel_id}` }))
|
|
||||||
if (this.token.startsWith('ibc/')) {
|
|
||||||
const query = this.paths[this.token]
|
|
||||||
return query ? options.filter(x => x.channel_id === query.channel_id) : options
|
|
||||||
}
|
|
||||||
return options
|
|
||||||
},
|
|
||||||
placeholder() {
|
|
||||||
return 'Input a destination address'
|
|
||||||
},
|
|
||||||
actionName() {
|
|
||||||
return this.token.startsWith('ibc') ? 'Withdraw' : 'Deposit'
|
|
||||||
},
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
// console.log('address: ', this.address)
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
tokenChange() {
|
|
||||||
// eslint-disable-next-line prefer-destructuring
|
|
||||||
this.destination = this.destinationOptions[0]
|
|
||||||
this.recipient = null
|
|
||||||
this.onChannelChange()
|
|
||||||
},
|
|
||||||
printDenom() {
|
|
||||||
return formatTokenDenom(this.IBCDenom[this.token] || this.token)
|
|
||||||
},
|
|
||||||
computeAccount() {
|
|
||||||
const accounts = getLocalAccounts()
|
|
||||||
const chains = getLocalChains()
|
|
||||||
if (accounts) {
|
|
||||||
const values = Object.values(accounts)
|
|
||||||
for (let i = 0; i < values.length; i += 1) {
|
|
||||||
const addr = values[i].address.find(x => x.addr === this.address)
|
|
||||||
if (addr) {
|
|
||||||
this.selectedChain = chains[addr.chain]
|
|
||||||
return addr
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return null
|
|
||||||
},
|
|
||||||
loadBalance() {
|
|
||||||
this.destination = null
|
|
||||||
this.channels = []
|
|
||||||
this.token = ''
|
|
||||||
this.targetChainId = ''
|
|
||||||
this.account = this.computeAccount()
|
|
||||||
if (this.account && this.account.length > 0) this.address = this.account[0].addr
|
|
||||||
if (this.address) {
|
|
||||||
this.$http.getAllIBCDenoms(this.selectedChain).then(x => {
|
|
||||||
x.denom_traces.forEach(trace => {
|
|
||||||
const hash = toHex(sha256(new TextEncoder().encode(`${trace.path}/${trace.base_denom}`)))
|
|
||||||
const ibcDenom = `ibc/${hash.toUpperCase()}`
|
|
||||||
// add base_denom to cache
|
|
||||||
this.$set(this.IBCDenom, ibcDenom, trace.base_denom)
|
|
||||||
// store channel/part for ibc denoms
|
|
||||||
const path = trace.path.split('/')
|
|
||||||
if (path.length >= 2) {
|
|
||||||
this.paths[ibcDenom] = {
|
|
||||||
channel_id: path[path.length - 1],
|
|
||||||
port_id: path[path.length - 2],
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
this.$http.getBankBalances(this.address, this.selectedChain).then(res => {
|
|
||||||
if (res && res.length > 0) {
|
|
||||||
this.balance = res.reverse()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getLatestBlock(this.selectedChain).then(ret => {
|
|
||||||
this.chainId = ret.block.header.chain_id
|
|
||||||
const notSynced = timeIn(ret.block.header.time, 10, 'm')
|
|
||||||
if (notSynced) {
|
|
||||||
this.error = 'Client is not synced or blockchain is halted'
|
|
||||||
} else {
|
|
||||||
this.error = null
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getAuthAccount(this.address, this.selectedChain).then(ret => {
|
|
||||||
const account = extractAccountNumberAndSequence(ret)
|
|
||||||
this.accountNumber = account.accountNumber
|
|
||||||
this.sequence = account.sequence
|
|
||||||
})
|
|
||||||
this.fee = this.selectedChain?.min_tx_fee || '1000'
|
|
||||||
this.feeDenom = this.selectedChain?.assets[0]?.base || ''
|
|
||||||
|
|
||||||
this.$http.getIBCChannels(this.selectedChain, null).then(ret => {
|
|
||||||
const chans = ret.channels.filter(x => x.state === 'STATE_OPEN').map(x => ({ channel_id: x.channel_id, port_id: x.port_id }))
|
|
||||||
this.$set(this, 'channels', chans)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
handleOk(bvModalEvt) {
|
|
||||||
// console.log('send')
|
|
||||||
// Prevent modal from closing
|
|
||||||
bvModalEvt.preventDefault()
|
|
||||||
// Trigger submit handler
|
|
||||||
// this.handleSubmit()
|
|
||||||
this.send().then(ret => {
|
|
||||||
// console.log(ret)
|
|
||||||
this.error = ret
|
|
||||||
})
|
|
||||||
},
|
|
||||||
resetModal() {
|
|
||||||
this.feeDenom = ''
|
|
||||||
this.error = null
|
|
||||||
},
|
|
||||||
format(v) {
|
|
||||||
return formatToken(v, this.IBCDenom)
|
|
||||||
},
|
|
||||||
onChannelChange() {
|
|
||||||
this.$http.getIBCChannelClientState(this.destination.channel_id, this.destination.port_id, this.selectedChain).then(cs => {
|
|
||||||
this.targetChainId = cs.identified_client_state.client_state.chain_id
|
|
||||||
// this.$store.commit('setChannels', { chain: this.selectedChain.chain_name, channels: chans })
|
|
||||||
})
|
|
||||||
},
|
|
||||||
async send() {
|
|
||||||
if (!this.destination) {
|
|
||||||
this.error = 'You have to select a destination'
|
|
||||||
return
|
|
||||||
}
|
|
||||||
const timeout = dayjs().add(4, 'hour')
|
|
||||||
const txMsgs = [
|
|
||||||
{
|
|
||||||
typeUrl: '/ibc.applications.transfer.v1.MsgTransfer',
|
|
||||||
value: {
|
|
||||||
sourcePort: this.destination.port_id,
|
|
||||||
sourceChannel: this.destination.channel_id,
|
|
||||||
token: coin(Number(getUnitAmount(this.amount, this.token)), this.token),
|
|
||||||
sender: this.address,
|
|
||||||
receiver: this.recipient,
|
|
||||||
// timeoutHeight: undefined, // { revisionHeight: '0', revisionNumber: '0' },
|
|
||||||
timeoutTimestamp: String(timeout.utc().valueOf() * 1000000),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
]
|
|
||||||
|
|
||||||
const txFee = {
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: this.fee,
|
|
||||||
denom: this.feeDenom,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
gas: this.gas,
|
|
||||||
}
|
|
||||||
|
|
||||||
const signerData = {
|
|
||||||
accountNumber: this.accountNumber,
|
|
||||||
sequence: this.sequence,
|
|
||||||
chainId: this.chainId,
|
|
||||||
}
|
|
||||||
|
|
||||||
sign(
|
|
||||||
this.wallet,
|
|
||||||
this.chainId,
|
|
||||||
this.address,
|
|
||||||
txMsgs,
|
|
||||||
txFee,
|
|
||||||
this.memo,
|
|
||||||
signerData,
|
|
||||||
).then(bodyBytes => {
|
|
||||||
this.$http.broadcastTx(bodyBytes, this.selectedChain).then(res => {
|
|
||||||
setLocalTxHistory({
|
|
||||||
chain: this.$store.state.chains.selected,
|
|
||||||
op: 'transfer',
|
|
||||||
hash: res.tx_response.txhash,
|
|
||||||
time: new Date(),
|
|
||||||
})
|
|
||||||
this.$bvModal.hide('ibc-transfer-window')
|
|
||||||
this.$toast({
|
|
||||||
component: ToastificationContent,
|
|
||||||
props: {
|
|
||||||
title: 'Transaction sent!',
|
|
||||||
icon: 'EditIcon',
|
|
||||||
variant: 'success',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
// Send tokens
|
|
||||||
// return client.sendTokens(this.address, this.recipient, sendCoins, this.memo)
|
|
||||||
// return
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
<style lang="scss">
|
|
||||||
@import '@core/scss/vue/libs/vue-select.scss';
|
|
||||||
</style>
|
|
@ -1,444 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<b-modal
|
|
||||||
id="transfer-window"
|
|
||||||
centered
|
|
||||||
size="md"
|
|
||||||
title="Transfer Tokens"
|
|
||||||
ok-title="Send"
|
|
||||||
hide-header-close
|
|
||||||
scrollable
|
|
||||||
:ok-disabled="!address"
|
|
||||||
@hidden="resetModal"
|
|
||||||
@ok="handleOk"
|
|
||||||
@show="loadBalance"
|
|
||||||
>
|
|
||||||
<validation-observer ref="simpleRules">
|
|
||||||
<b-form>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Sender"
|
|
||||||
label-for="sender"
|
|
||||||
>
|
|
||||||
<b-input-group class="mb-25">
|
|
||||||
<b-input-group-prepend is-text>
|
|
||||||
<b-avatar
|
|
||||||
:src="account?account.logo:''"
|
|
||||||
size="18"
|
|
||||||
variant="light-primary"
|
|
||||||
rounded
|
|
||||||
/>
|
|
||||||
</b-input-group-prepend>
|
|
||||||
<b-form-input
|
|
||||||
name="sender"
|
|
||||||
:value="account?account.addr:address"
|
|
||||||
readonly
|
|
||||||
/>
|
|
||||||
</b-input-group>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Recipient"
|
|
||||||
label-for="Recipient"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="recipient"
|
|
||||||
>
|
|
||||||
<b-input-group class="mb-25">
|
|
||||||
<b-form-input
|
|
||||||
id="Recipient"
|
|
||||||
v-model="recipient"
|
|
||||||
:state="errors.length > 0 ? false:null"
|
|
||||||
/>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Available Token"
|
|
||||||
label-for="Token"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Token"
|
|
||||||
>
|
|
||||||
<b-form-select
|
|
||||||
v-model="token"
|
|
||||||
>
|
|
||||||
<b-form-select-option
|
|
||||||
v-for="item in balance"
|
|
||||||
:key="item.denom"
|
|
||||||
:value="item.denom"
|
|
||||||
>
|
|
||||||
{{ format(item) }}
|
|
||||||
</b-form-select-option>
|
|
||||||
</b-form-select>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Amount"
|
|
||||||
label-for="Amount"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|regex:^([0-9\.]+)$"
|
|
||||||
name="amount"
|
|
||||||
>
|
|
||||||
<b-input-group class="mb-25">
|
|
||||||
<b-form-input
|
|
||||||
id="Amount"
|
|
||||||
v-model="amount"
|
|
||||||
:state="errors.length > 0 ? false:null"
|
|
||||||
placeholder="Input a number"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<b-input-group-append is-text>
|
|
||||||
{{ printDenom() }}
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Fee"
|
|
||||||
label-for="Fee"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|integer"
|
|
||||||
name="fee"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input v-model="fee" />
|
|
||||||
<b-input-group-append>
|
|
||||||
<b-form-select
|
|
||||||
v-model="feeDenom"
|
|
||||||
:options="feeDenoms"
|
|
||||||
value-field="denom"
|
|
||||||
text-field="denom"
|
|
||||||
/>
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group>
|
|
||||||
<b-form-checkbox
|
|
||||||
v-model="advance"
|
|
||||||
name="advance"
|
|
||||||
value="true"
|
|
||||||
>
|
|
||||||
<small>Advanced</small>
|
|
||||||
</b-form-checkbox>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row v-if="advance">
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Gas"
|
|
||||||
label-for="gas"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="gas"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="gas"
|
|
||||||
v-model="gas"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Memo"
|
|
||||||
label-for="Memo"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="memo"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="Memo"
|
|
||||||
v-model="memo"
|
|
||||||
max="2"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<wallet-input-vue v-model="wallet" />
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-form>
|
|
||||||
</validation-observer>
|
|
||||||
{{ error }}
|
|
||||||
</b-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { ValidationProvider, ValidationObserver } from 'vee-validate'
|
|
||||||
import {
|
|
||||||
BModal, BRow, BCol, BInputGroup, BInputGroupAppend, BFormInput, BAvatar, BFormGroup, BFormSelect, BFormSelectOption,
|
|
||||||
BForm, BInputGroupPrepend, BFormCheckbox,
|
|
||||||
} from 'bootstrap-vue'
|
|
||||||
import {
|
|
||||||
required, email, url, between, alpha, integer, password, min, digits, alphaDash, length,
|
|
||||||
} from '@validations'
|
|
||||||
import {
|
|
||||||
extractAccountNumberAndSequence,
|
|
||||||
formatToken, formatTokenDenom, getLocalAccounts, getLocalChains, getUnitAmount, setLocalTxHistory, sign, timeIn,
|
|
||||||
} from '@/libs/utils'
|
|
||||||
import ToastificationContent from '@core/components/toastification/ToastificationContent.vue'
|
|
||||||
import WalletInputVue from './components/WalletInput.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'TransforDialogue',
|
|
||||||
components: {
|
|
||||||
BModal,
|
|
||||||
BRow,
|
|
||||||
BCol,
|
|
||||||
BForm,
|
|
||||||
BInputGroup,
|
|
||||||
BInputGroupAppend,
|
|
||||||
BInputGroupPrepend,
|
|
||||||
BFormInput,
|
|
||||||
BAvatar,
|
|
||||||
BFormGroup,
|
|
||||||
BFormSelect,
|
|
||||||
BFormSelectOption,
|
|
||||||
BFormCheckbox,
|
|
||||||
|
|
||||||
ValidationProvider,
|
|
||||||
ValidationObserver,
|
|
||||||
|
|
||||||
WalletInputVue,
|
|
||||||
// eslint-disable-next-line vue/no-unused-components
|
|
||||||
ToastificationContent,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
address: {
|
|
||||||
type: String,
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
recipientAddress: {
|
|
||||||
type: String,
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
chainId: '',
|
|
||||||
selectedChain: '',
|
|
||||||
balance: [],
|
|
||||||
token: '',
|
|
||||||
amount: null,
|
|
||||||
memo: '',
|
|
||||||
recipient: this.recipientAddress,
|
|
||||||
fee: '800',
|
|
||||||
feeDenom: '',
|
|
||||||
wallet: 'ledgerUSB',
|
|
||||||
error: null,
|
|
||||||
sequence: 1,
|
|
||||||
accountNumber: 0,
|
|
||||||
account: [],
|
|
||||||
IBCDenom: {},
|
|
||||||
gas: '200000',
|
|
||||||
advance: false,
|
|
||||||
|
|
||||||
required,
|
|
||||||
password,
|
|
||||||
email,
|
|
||||||
min,
|
|
||||||
integer,
|
|
||||||
url,
|
|
||||||
alpha,
|
|
||||||
between,
|
|
||||||
digits,
|
|
||||||
length,
|
|
||||||
alphaDash,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
feeDenoms() {
|
|
||||||
return this.balance.filter(item => !item.denom.startsWith('ibc'))
|
|
||||||
},
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
// console.log('address: ', this.address)
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
printDenom() {
|
|
||||||
return formatTokenDenom(this.IBCDenom[this.token] || this.token)
|
|
||||||
},
|
|
||||||
computeAccount() {
|
|
||||||
const accounts = getLocalAccounts()
|
|
||||||
const chains = getLocalChains()
|
|
||||||
if (accounts) {
|
|
||||||
const values = Object.values(accounts)
|
|
||||||
for (let i = 0; i < values.length; i += 1) {
|
|
||||||
const addr = values[i].address.find(x => x.addr === this.address)
|
|
||||||
if (addr) {
|
|
||||||
this.selectedChain = chains[addr.chain]
|
|
||||||
return addr
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return null
|
|
||||||
},
|
|
||||||
loadBalance() {
|
|
||||||
this.account = this.computeAccount()
|
|
||||||
if (this.account && this.account.length > 0) this.address = this.account[0].addr
|
|
||||||
if (this.address) {
|
|
||||||
this.$http.getBankBalances(this.address, this.selectedChain).then(res => {
|
|
||||||
if (res && res.length > 0) {
|
|
||||||
this.balance = res.reverse()
|
|
||||||
this.token = this.balance[0].denom
|
|
||||||
this.feeDenom = this.balance.find(x => !x.denom.startsWith('ibc')).denom
|
|
||||||
this.balance.filter(i => i.denom.startsWith('ibc')).forEach(x => {
|
|
||||||
if (!this.IBCDenom[x.denom]) {
|
|
||||||
this.$http.getIBCDenomTrace(x.denom, this.selectedChain).then(denom => {
|
|
||||||
this.IBCDenom[x.denom] = denom.denom_trace.base_denom
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getLatestBlock(this.selectedChain).then(ret => {
|
|
||||||
this.chainId = ret.block.header.chain_id
|
|
||||||
const notSynced = timeIn(ret.block.header.time, 10, 'm')
|
|
||||||
if (notSynced) {
|
|
||||||
this.error = 'Client is not synced or blockchain is halted'
|
|
||||||
} else {
|
|
||||||
this.error = null
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getAuthAccount(this.address, this.selectedChain).then(ret => {
|
|
||||||
const account = extractAccountNumberAndSequence(ret)
|
|
||||||
this.accountNumber = account.accountNumber
|
|
||||||
this.sequence = account.sequence
|
|
||||||
})
|
|
||||||
this.fee = this.selectedChain?.min_tx_fee || '1000'
|
|
||||||
this.feeDenom = this.selectedChain?.assets[0]?.base || ''
|
|
||||||
}
|
|
||||||
},
|
|
||||||
handleOk(bvModalEvt) {
|
|
||||||
// console.log('send')
|
|
||||||
// Prevent modal from closing
|
|
||||||
bvModalEvt.preventDefault()
|
|
||||||
// Trigger submit handler
|
|
||||||
// this.handleSubmit()
|
|
||||||
this.send().then(ret => {
|
|
||||||
// console.log(ret)
|
|
||||||
this.error = ret
|
|
||||||
})
|
|
||||||
},
|
|
||||||
resetModal() {
|
|
||||||
this.feeDenom = ''
|
|
||||||
this.error = null
|
|
||||||
},
|
|
||||||
format(v) {
|
|
||||||
return formatToken(v, this.IBCDenom)
|
|
||||||
},
|
|
||||||
|
|
||||||
async send() {
|
|
||||||
const txMsgs = [
|
|
||||||
{
|
|
||||||
typeUrl: '/cosmos.bank.v1beta1.MsgSend',
|
|
||||||
value: {
|
|
||||||
fromAddress: this.address,
|
|
||||||
toAddress: this.recipient,
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: getUnitAmount(this.amount, this.token),
|
|
||||||
denom: this.token,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
},
|
|
||||||
]
|
|
||||||
|
|
||||||
const txFee = {
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: this.fee,
|
|
||||||
denom: this.feeDenom,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
gas: this.gas,
|
|
||||||
}
|
|
||||||
|
|
||||||
const signerData = {
|
|
||||||
accountNumber: this.accountNumber,
|
|
||||||
sequence: this.sequence,
|
|
||||||
chainId: this.chainId,
|
|
||||||
}
|
|
||||||
|
|
||||||
sign(
|
|
||||||
this.wallet,
|
|
||||||
this.chainId,
|
|
||||||
this.address,
|
|
||||||
txMsgs,
|
|
||||||
txFee,
|
|
||||||
this.memo,
|
|
||||||
signerData,
|
|
||||||
).then(bodyBytes => {
|
|
||||||
this.$http.broadcastTx(bodyBytes, this.selectedChain).then(res => {
|
|
||||||
setLocalTxHistory({
|
|
||||||
chain: this.$store.state.chains.selected,
|
|
||||||
op: 'send',
|
|
||||||
hash: res.tx_response.txhash,
|
|
||||||
time: new Date(),
|
|
||||||
})
|
|
||||||
this.$bvModal.hide('transfer-window')
|
|
||||||
this.$toast({
|
|
||||||
component: ToastificationContent,
|
|
||||||
props: {
|
|
||||||
title: 'Transaction sent!',
|
|
||||||
icon: 'EditIcon',
|
|
||||||
variant: 'success',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
// Send tokens
|
|
||||||
// return client.sendTokens(this.address, this.recipient, sendCoins, this.memo)
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
@ -1,423 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<b-modal
|
|
||||||
id="unbond-window"
|
|
||||||
centered
|
|
||||||
size="md"
|
|
||||||
title="Unbond Token"
|
|
||||||
hide-header-close
|
|
||||||
scrollable
|
|
||||||
ok-title="Send"
|
|
||||||
:ok-disabled="!address"
|
|
||||||
@hidden="resetModal"
|
|
||||||
@ok="handleOk"
|
|
||||||
@show="loadBalance"
|
|
||||||
>
|
|
||||||
<validation-observer ref="simpleRules">
|
|
||||||
<b-form>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Delegator"
|
|
||||||
label-for="Account"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
v-model="address"
|
|
||||||
readonly
|
|
||||||
/>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Validator"
|
|
||||||
label-for="validator"
|
|
||||||
>
|
|
||||||
<v-select
|
|
||||||
:value="validatorAddress"
|
|
||||||
:options="valOptions"
|
|
||||||
:reduce="val => val.value"
|
|
||||||
placeholder="Select a validator"
|
|
||||||
:disabled="true"
|
|
||||||
/>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Current Delegation"
|
|
||||||
label-for="Token"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Token"
|
|
||||||
>
|
|
||||||
<v-select
|
|
||||||
v-model="token"
|
|
||||||
:options="tokenOptions"
|
|
||||||
:reduce="token => token.value"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Amount"
|
|
||||||
label-for="Amount"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|regex:^([0-9\.]+)$"
|
|
||||||
name="amount"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input
|
|
||||||
id="Amount"
|
|
||||||
v-model="amount"
|
|
||||||
:state="errors.length > 0 ? false:null"
|
|
||||||
placeholder="Input a number"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<b-input-group-append is-text>
|
|
||||||
{{ printDenom() }}
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Fee"
|
|
||||||
label-for="Fee"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|integer"
|
|
||||||
name="fee"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input v-model="fee" />
|
|
||||||
<b-input-group-append>
|
|
||||||
<b-form-select
|
|
||||||
v-model="feeDenom"
|
|
||||||
:options="feeDenoms"
|
|
||||||
value-field="denom"
|
|
||||||
text-field="denom"
|
|
||||||
/>
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group>
|
|
||||||
<b-form-checkbox
|
|
||||||
v-model="advance"
|
|
||||||
name="advance"
|
|
||||||
value="true"
|
|
||||||
>
|
|
||||||
<small>Advanced</small>
|
|
||||||
</b-form-checkbox>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row v-if="advance">
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Gas"
|
|
||||||
label-for="gas"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="gas"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="gas"
|
|
||||||
v-model="gas"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Memo"
|
|
||||||
label-for="Memo"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="memo"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="Memo"
|
|
||||||
v-model="memo"
|
|
||||||
max="2"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<wallet-input-vue v-model="wallet" />
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-form>
|
|
||||||
</validation-observer>
|
|
||||||
{{ error }}
|
|
||||||
</b-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { ValidationProvider, ValidationObserver } from 'vee-validate'
|
|
||||||
import {
|
|
||||||
BModal, BRow, BCol, BInputGroup, BFormInput, BFormGroup, BFormSelect, BInputGroupAppend,
|
|
||||||
BForm, BFormCheckbox,
|
|
||||||
} from 'bootstrap-vue'
|
|
||||||
import {
|
|
||||||
required, email, url, between, alpha, integer, password, min, digits, alphaDash, length,
|
|
||||||
} from '@validations'
|
|
||||||
import {
|
|
||||||
extractAccountNumberAndSequence,
|
|
||||||
formatToken, formatTokenDenom, getUnitAmount, setLocalTxHistory, sign, timeIn,
|
|
||||||
} from '@/libs/utils'
|
|
||||||
import vSelect from 'vue-select'
|
|
||||||
import ToastificationContent from '@core/components/toastification/ToastificationContent.vue'
|
|
||||||
import WalletInputVue from './components/WalletInput.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'UnbondDialogue',
|
|
||||||
components: {
|
|
||||||
BModal,
|
|
||||||
BRow,
|
|
||||||
BCol,
|
|
||||||
BForm,
|
|
||||||
BInputGroup,
|
|
||||||
BFormInput,
|
|
||||||
BFormGroup,
|
|
||||||
BFormSelect,
|
|
||||||
vSelect,
|
|
||||||
BInputGroupAppend,
|
|
||||||
BFormCheckbox,
|
|
||||||
|
|
||||||
ValidationProvider,
|
|
||||||
ValidationObserver,
|
|
||||||
|
|
||||||
WalletInputVue,
|
|
||||||
// eslint-disable-next-line vue/no-unused-components
|
|
||||||
ToastificationContent,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
validatorAddress: {
|
|
||||||
type: String,
|
|
||||||
default: null,
|
|
||||||
},
|
|
||||||
address: {
|
|
||||||
type: String,
|
|
||||||
default: null,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
availableAddress: [],
|
|
||||||
validators: [],
|
|
||||||
selectedValidator: this.validatorAddress,
|
|
||||||
token: '',
|
|
||||||
amount: null,
|
|
||||||
chainId: '',
|
|
||||||
selectedChain: '',
|
|
||||||
balance: [],
|
|
||||||
delegations: [],
|
|
||||||
memo: '',
|
|
||||||
fee: '800',
|
|
||||||
feeDenom: '',
|
|
||||||
wallet: 'ledgerUSB',
|
|
||||||
error: null,
|
|
||||||
sequence: 1,
|
|
||||||
accountNumber: 0,
|
|
||||||
account: [],
|
|
||||||
gas: '200000',
|
|
||||||
advance: false,
|
|
||||||
|
|
||||||
required,
|
|
||||||
password,
|
|
||||||
email,
|
|
||||||
min,
|
|
||||||
integer,
|
|
||||||
url,
|
|
||||||
alpha,
|
|
||||||
between,
|
|
||||||
digits,
|
|
||||||
length,
|
|
||||||
alphaDash,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
valOptions() {
|
|
||||||
return this.validators.map(x => ({ value: x.operator_address, label: `${x.description.moniker} (${Number(x.commission.rate) * 100}%)` }))
|
|
||||||
},
|
|
||||||
tokenOptions() {
|
|
||||||
if (!this.delegations) return []
|
|
||||||
return this.delegations.filter(x => x.delegation.validator_address === this.validatorAddress).map(x => ({ value: x.balance.denom, label: formatToken(x.balance) }))
|
|
||||||
},
|
|
||||||
feeDenoms() {
|
|
||||||
if (!this.balance) return []
|
|
||||||
return this.balance.filter(item => !item.denom.startsWith('ibc'))
|
|
||||||
},
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
// console.log('address: ', this.address)
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
printDenom() {
|
|
||||||
return formatTokenDenom(this.token)
|
|
||||||
},
|
|
||||||
loadBalance() {
|
|
||||||
if (this.address) {
|
|
||||||
this.$http.getValidatorList().then(v => {
|
|
||||||
this.validators = v
|
|
||||||
})
|
|
||||||
}
|
|
||||||
this.$http.getBankBalances(this.address).then(res => {
|
|
||||||
if (res && res.length > 0) {
|
|
||||||
this.balance = res.reverse()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getLatestBlock().then(ret => {
|
|
||||||
this.chainId = ret.block.header.chain_id
|
|
||||||
const notSynced = timeIn(ret.block.header.time, 10, 'm')
|
|
||||||
if (notSynced) {
|
|
||||||
this.error = 'Client is not synced or blockchain is halted'
|
|
||||||
} else {
|
|
||||||
this.error = null
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getAuthAccount(this.address).then(ret => {
|
|
||||||
const account = extractAccountNumberAndSequence(ret)
|
|
||||||
this.accountNumber = account.accountNumber
|
|
||||||
this.sequence = account.sequence
|
|
||||||
})
|
|
||||||
this.fee = this.$store.state.chains.selected?.min_tx_fee || '1000'
|
|
||||||
this.feeDenom = this.$store.state.chains.selected?.assets[0]?.base || ''
|
|
||||||
this.$http.getStakingDelegations(this.address).then(res => {
|
|
||||||
this.delegations = res.delegation_responses
|
|
||||||
this.delegations.forEach(x => {
|
|
||||||
if (x.delegation.validator_address === this.validatorAddress) {
|
|
||||||
this.token = x.balance.denom
|
|
||||||
this.feeDenom = x.balance.denom
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
},
|
|
||||||
handleOk(bvModalEvt) {
|
|
||||||
// console.log('send')
|
|
||||||
// Prevent modal from closing
|
|
||||||
bvModalEvt.preventDefault()
|
|
||||||
this.$refs.simpleRules.validate().then(ok => {
|
|
||||||
if (ok) {
|
|
||||||
this.sendTx().then(ret => {
|
|
||||||
// console.log(ret)
|
|
||||||
this.error = ret
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
resetModal() {
|
|
||||||
this.feeDenom = ''
|
|
||||||
this.error = null
|
|
||||||
},
|
|
||||||
format(v) {
|
|
||||||
return formatToken(v)
|
|
||||||
},
|
|
||||||
async sendTx() {
|
|
||||||
const txMsgs = [{
|
|
||||||
typeUrl: '/cosmos.staking.v1beta1.MsgUndelegate',
|
|
||||||
value: {
|
|
||||||
delegatorAddress: this.address,
|
|
||||||
validatorAddress: this.validatorAddress,
|
|
||||||
amount: {
|
|
||||||
amount: getUnitAmount(this.amount, this.token),
|
|
||||||
denom: this.token,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}]
|
|
||||||
|
|
||||||
if (txMsgs.length === 0) {
|
|
||||||
this.error = 'No delegation found'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
if (!this.accountNumber) {
|
|
||||||
this.error = 'Account number should not be empty!'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
|
|
||||||
const txFee = {
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: this.fee,
|
|
||||||
denom: this.feeDenom,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
gas: this.gas,
|
|
||||||
}
|
|
||||||
|
|
||||||
const signerData = {
|
|
||||||
accountNumber: this.accountNumber,
|
|
||||||
sequence: this.sequence,
|
|
||||||
chainId: this.chainId,
|
|
||||||
}
|
|
||||||
|
|
||||||
sign(
|
|
||||||
this.wallet,
|
|
||||||
this.chainId,
|
|
||||||
this.address,
|
|
||||||
txMsgs,
|
|
||||||
txFee,
|
|
||||||
this.memo,
|
|
||||||
signerData,
|
|
||||||
).then(bodyBytes => {
|
|
||||||
this.$http.broadcastTx(bodyBytes, this.selectedChain).then(res => {
|
|
||||||
setLocalTxHistory({
|
|
||||||
chain: this.$store.state.chains.selected,
|
|
||||||
op: 'unbond',
|
|
||||||
hash: res.tx_response.txhash,
|
|
||||||
time: new Date(),
|
|
||||||
})
|
|
||||||
this.$bvModal.hide('unbond-window')
|
|
||||||
this.$toast({
|
|
||||||
component: ToastificationContent,
|
|
||||||
props: {
|
|
||||||
title: 'Transaction sent!',
|
|
||||||
icon: 'EditIcon',
|
|
||||||
variant: 'success',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
// Send tokens
|
|
||||||
// return client.sendTokens(this.address, this.recipient, sendCoins, this.memo)
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
<style lang="scss">
|
|
||||||
@import '@core/scss/vue/libs/vue-select.scss';
|
|
||||||
</style>
|
|
@ -1,426 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<b-modal
|
|
||||||
id="vote-window"
|
|
||||||
centered
|
|
||||||
size="md"
|
|
||||||
title="Vote"
|
|
||||||
ok-title="Send"
|
|
||||||
hide-header-close
|
|
||||||
scrollable
|
|
||||||
:ok-disabled="!voter"
|
|
||||||
@hidden="resetModal"
|
|
||||||
@ok="handleOk"
|
|
||||||
@show="loadBalance"
|
|
||||||
><b-overlay
|
|
||||||
:show="!voter"
|
|
||||||
rounded="sm"
|
|
||||||
>
|
|
||||||
<template #overlay>
|
|
||||||
<div class="text-center">
|
|
||||||
<p id="cancel-label">
|
|
||||||
No available account found.
|
|
||||||
</p>
|
|
||||||
<b-button
|
|
||||||
variant="outline-primary"
|
|
||||||
to="/wallet/import"
|
|
||||||
>
|
|
||||||
Connect Wallet
|
|
||||||
</b-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<validation-observer ref="simpleRules">
|
|
||||||
<b-form>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<h4>{{ proposalId }}. {{ title }}</h4>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Voter"
|
|
||||||
label-for="Account"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
#default="{ errors }"
|
|
||||||
rules="required"
|
|
||||||
name="Voter"
|
|
||||||
>
|
|
||||||
<b-form-select
|
|
||||||
v-model="voter"
|
|
||||||
:options="accounts"
|
|
||||||
text-field="label"
|
|
||||||
placeholder="Select an address"
|
|
||||||
@change="onChange"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }} <strong v-if="!accounts || accounts.length === 0">Please import an account first!</strong> </small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Option"
|
|
||||||
label-for="option"
|
|
||||||
>
|
|
||||||
<div class="demo-inline-spacing">
|
|
||||||
|
|
||||||
<b-form-radio
|
|
||||||
v-model="option"
|
|
||||||
name="option"
|
|
||||||
value="1"
|
|
||||||
class="custom-control-success"
|
|
||||||
>
|
|
||||||
Yes
|
|
||||||
</b-form-radio>
|
|
||||||
<b-form-radio
|
|
||||||
v-model="option"
|
|
||||||
name="option"
|
|
||||||
value="3"
|
|
||||||
class="custom-control-warning"
|
|
||||||
>
|
|
||||||
No
|
|
||||||
</b-form-radio>
|
|
||||||
<b-form-radio
|
|
||||||
v-model="option"
|
|
||||||
name="option"
|
|
||||||
value="4"
|
|
||||||
class="custom-control-danger"
|
|
||||||
>
|
|
||||||
No With Veto
|
|
||||||
</b-form-radio>
|
|
||||||
<b-form-radio
|
|
||||||
v-model="option"
|
|
||||||
name="option"
|
|
||||||
value="2"
|
|
||||||
class="custom-control-secondary"
|
|
||||||
>
|
|
||||||
Abstain
|
|
||||||
</b-form-radio>
|
|
||||||
</div>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Fee"
|
|
||||||
label-for="Fee"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|integer"
|
|
||||||
name="fee"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input v-model="fee" />
|
|
||||||
<b-input-group-append>
|
|
||||||
<b-form-select
|
|
||||||
v-model="feeDenom"
|
|
||||||
:options="feeDenoms"
|
|
||||||
value-field="denom"
|
|
||||||
text-field="denom"
|
|
||||||
/>
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group>
|
|
||||||
<b-form-checkbox
|
|
||||||
v-model="advance"
|
|
||||||
name="advance"
|
|
||||||
value="true"
|
|
||||||
>
|
|
||||||
<small>Advanced</small>
|
|
||||||
</b-form-checkbox>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row v-if="advance">
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Gas"
|
|
||||||
label-for="gas"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="gas"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="gas"
|
|
||||||
v-model="gas"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Memo"
|
|
||||||
label-for="Memo"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="memo"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="Memo"
|
|
||||||
v-model="memo"
|
|
||||||
max="2"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<wallet-input-vue v-model="wallet" />
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-form>
|
|
||||||
</validation-observer>
|
|
||||||
{{ error }}
|
|
||||||
</b-overlay></b-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { ValidationProvider, ValidationObserver } from 'vee-validate'
|
|
||||||
import {
|
|
||||||
BModal, BRow, BCol, BInputGroup, BFormInput, BFormGroup, BFormSelect, BFormCheckbox,
|
|
||||||
BForm, BFormRadio, BInputGroupAppend, BOverlay, BButton,
|
|
||||||
} from 'bootstrap-vue'
|
|
||||||
import {
|
|
||||||
required, email, url, between, alpha, integer, password, min, digits, alphaDash, length,
|
|
||||||
} from '@validations'
|
|
||||||
import {
|
|
||||||
abbrAddress,
|
|
||||||
extractAccountNumberAndSequence,
|
|
||||||
formatToken, getLocalAccounts, setLocalTxHistory, sign, timeIn,
|
|
||||||
} from '@/libs/utils'
|
|
||||||
import ToastificationContent from '@core/components/toastification/ToastificationContent.vue'
|
|
||||||
import WalletInputVue from './components/WalletInput.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'VoteDialogue',
|
|
||||||
components: {
|
|
||||||
BModal,
|
|
||||||
BRow,
|
|
||||||
BCol,
|
|
||||||
BForm,
|
|
||||||
BInputGroup,
|
|
||||||
BFormInput,
|
|
||||||
BFormGroup,
|
|
||||||
BFormSelect,
|
|
||||||
BFormRadio,
|
|
||||||
BFormCheckbox,
|
|
||||||
BInputGroupAppend,
|
|
||||||
BOverlay,
|
|
||||||
BButton,
|
|
||||||
|
|
||||||
ValidationProvider,
|
|
||||||
ValidationObserver,
|
|
||||||
|
|
||||||
WalletInputVue,
|
|
||||||
// eslint-disable-next-line vue/no-unused-components
|
|
||||||
ToastificationContent,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
proposalId: {
|
|
||||||
type: Number,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
title: {
|
|
||||||
type: String,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
accounts: [],
|
|
||||||
voter: null,
|
|
||||||
option: null,
|
|
||||||
chainId: '',
|
|
||||||
selectedChain: '',
|
|
||||||
balance: [],
|
|
||||||
memo: '',
|
|
||||||
fee: '',
|
|
||||||
feeDenom: '',
|
|
||||||
wallet: 'ledgerUSB',
|
|
||||||
error: null,
|
|
||||||
sequence: 1,
|
|
||||||
accountNumber: 0,
|
|
||||||
gas: '200000',
|
|
||||||
advance: false,
|
|
||||||
|
|
||||||
required,
|
|
||||||
password,
|
|
||||||
email,
|
|
||||||
min,
|
|
||||||
integer,
|
|
||||||
url,
|
|
||||||
alpha,
|
|
||||||
between,
|
|
||||||
digits,
|
|
||||||
length,
|
|
||||||
alphaDash,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
feeDenoms() {
|
|
||||||
return this.balance.filter(item => !item.denom.startsWith('ibc'))
|
|
||||||
},
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
computeAccount() {
|
|
||||||
let array = []
|
|
||||||
const accounts = getLocalAccounts()
|
|
||||||
if (accounts) {
|
|
||||||
const values = Object.values(accounts)
|
|
||||||
for (let i = 0; i < values.length; i += 1) {
|
|
||||||
const addrs = values[i].address.filter(x => x.chain === this.$route.params.chain)
|
|
||||||
if (addrs && addrs.length > 0) {
|
|
||||||
array = array.concat(addrs.map(x => ({ value: x.addr, label: values[i].name.concat(' - ', abbrAddress(x.addr)) })))
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return array
|
|
||||||
},
|
|
||||||
onChange() {
|
|
||||||
if (this.voter) {
|
|
||||||
this.$http.getBankBalances(this.voter).then(res => {
|
|
||||||
if (res && res.length > 0) {
|
|
||||||
this.balance = res.reverse()
|
|
||||||
const token = this.balance.find(i => !i.denom.startsWith('ibc'))
|
|
||||||
if (token) this.feeDenom = token.denom
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getLatestBlock().then(ret => {
|
|
||||||
this.chainId = ret.block.header.chain_id
|
|
||||||
const notSynced = timeIn(ret.block.header.time, 10, 'm')
|
|
||||||
if (notSynced) {
|
|
||||||
this.error = 'Client is not synced or blockchain is halted'
|
|
||||||
} else {
|
|
||||||
this.error = null
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getAuthAccount(this.voter).then(ret => {
|
|
||||||
const account = extractAccountNumberAndSequence(ret)
|
|
||||||
this.accountNumber = account.accountNumber
|
|
||||||
this.sequence = account.sequence
|
|
||||||
})
|
|
||||||
this.fee = this.$store.state.chains.selected?.min_tx_fee || '1000'
|
|
||||||
this.feeDenom = this.$store.state.chains.selected?.assets[0]?.base || ''
|
|
||||||
}
|
|
||||||
},
|
|
||||||
loadBalance() {
|
|
||||||
this.accounts = this.computeAccount()
|
|
||||||
// eslint-disable-next-line prefer-destructuring
|
|
||||||
if (this.accounts && this.accounts.length > 0) this.voter = this.accounts[0].value
|
|
||||||
this.onChange()
|
|
||||||
},
|
|
||||||
handleOk(bvModalEvt) {
|
|
||||||
// console.log('send')
|
|
||||||
// Prevent modal from closing
|
|
||||||
bvModalEvt.preventDefault()
|
|
||||||
this.$refs.simpleRules.validate().then(ok => {
|
|
||||||
if (ok) {
|
|
||||||
this.sendTx().then(ret => {
|
|
||||||
// console.log(ret)
|
|
||||||
this.error = ret
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
resetModal() {
|
|
||||||
this.feeDenom = ''
|
|
||||||
this.error = null
|
|
||||||
},
|
|
||||||
format(v) {
|
|
||||||
return formatToken(v)
|
|
||||||
},
|
|
||||||
async sendTx() {
|
|
||||||
const txMsgs = [{
|
|
||||||
typeUrl: '/cosmos.gov.v1beta1.MsgVote',
|
|
||||||
value: {
|
|
||||||
voter: this.voter,
|
|
||||||
proposalId: this.proposalId,
|
|
||||||
option: Number(this.option),
|
|
||||||
},
|
|
||||||
}]
|
|
||||||
|
|
||||||
if (txMsgs.length === 0) {
|
|
||||||
this.error = 'No delegation found'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
if (!this.accountNumber) {
|
|
||||||
this.error = 'Account number should not be empty!'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
|
|
||||||
const txFee = {
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: this.fee,
|
|
||||||
denom: this.feeDenom,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
gas: this.gas,
|
|
||||||
}
|
|
||||||
|
|
||||||
const signerData = {
|
|
||||||
accountNumber: this.accountNumber,
|
|
||||||
sequence: this.sequence,
|
|
||||||
chainId: this.chainId,
|
|
||||||
}
|
|
||||||
|
|
||||||
sign(
|
|
||||||
this.wallet,
|
|
||||||
this.chainId,
|
|
||||||
this.voter,
|
|
||||||
txMsgs,
|
|
||||||
txFee,
|
|
||||||
this.memo,
|
|
||||||
signerData,
|
|
||||||
).then(bodyBytes => {
|
|
||||||
this.$http.broadcastTx(bodyBytes, this.selectedChain).then(res => {
|
|
||||||
setLocalTxHistory({
|
|
||||||
chain: this.$store.state.chains.selected,
|
|
||||||
op: 'vote',
|
|
||||||
hash: res.tx_response.txhash,
|
|
||||||
time: new Date(),
|
|
||||||
})
|
|
||||||
this.$bvModal.hide('vote-window')
|
|
||||||
this.$toast({
|
|
||||||
component: ToastificationContent,
|
|
||||||
props: {
|
|
||||||
title: 'Transaction sent!',
|
|
||||||
icon: 'EditIcon',
|
|
||||||
variant: 'success',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
// Send tokens
|
|
||||||
// return client.sendTokens(this.address, this.recipient, sendCoins, this.memo)
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
@import '@core/scss/vue/libs/vue-select.scss';
|
|
||||||
</style>
|
|
@ -1,327 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<b-modal
|
|
||||||
id="withdraw-commission-window"
|
|
||||||
centered
|
|
||||||
size="md"
|
|
||||||
title="Withdraw Validator Commission"
|
|
||||||
hide-header-close
|
|
||||||
scrollable
|
|
||||||
|
|
||||||
:ok-disabled="!address"
|
|
||||||
@hidden="resetModal"
|
|
||||||
@ok="handleOk"
|
|
||||||
@show="loadBalance"
|
|
||||||
>
|
|
||||||
<validation-observer ref="simpleRules">
|
|
||||||
<b-form>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Sender"
|
|
||||||
label-for="Account"
|
|
||||||
>
|
|
||||||
<b-input-group class="mb-25">
|
|
||||||
<b-form-input
|
|
||||||
:value="address"
|
|
||||||
readonly
|
|
||||||
/>
|
|
||||||
</b-input-group>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Fee"
|
|
||||||
label-for="Fee"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|integer"
|
|
||||||
name="fee"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input v-model="fee" />
|
|
||||||
<b-input-group-append name="xx">
|
|
||||||
<b-form-select
|
|
||||||
v-model="feeDenom"
|
|
||||||
:options="feeDenoms"
|
|
||||||
value-field="denom"
|
|
||||||
text-field="denom"
|
|
||||||
/>
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group>
|
|
||||||
<b-form-checkbox
|
|
||||||
v-model="advance"
|
|
||||||
name="advance"
|
|
||||||
value="true"
|
|
||||||
>
|
|
||||||
<small>Advanced</small>
|
|
||||||
</b-form-checkbox>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row v-if="advance">
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Gas"
|
|
||||||
label-for="gas"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="gas"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="gas"
|
|
||||||
v-model="gas"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Memo"
|
|
||||||
label-for="Memo"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="memo"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="Memo"
|
|
||||||
v-model="memo"
|
|
||||||
max="2"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<wallet-input-vue v-model="wallet" />
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-form>
|
|
||||||
</validation-observer>
|
|
||||||
<small class="text-danger">{{ error }}</small>
|
|
||||||
</b-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { ValidationProvider, ValidationObserver } from 'vee-validate'
|
|
||||||
import {
|
|
||||||
BModal, BRow, BCol, BInputGroup, BFormInput, BFormGroup, BFormSelect, BFormCheckbox,
|
|
||||||
BForm, BInputGroupAppend,
|
|
||||||
} from 'bootstrap-vue'
|
|
||||||
import {
|
|
||||||
required, email, url, between, alpha, integer, password, min, digits, alphaDash, length,
|
|
||||||
} from '@validations'
|
|
||||||
import {
|
|
||||||
extractAccountNumberAndSequence,
|
|
||||||
formatToken, setLocalTxHistory, sign, timeIn,
|
|
||||||
} from '@/libs/utils'
|
|
||||||
import ToastificationContent from '@core/components/toastification/ToastificationContent.vue'
|
|
||||||
import WalletInputVue from './components/WalletInput.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'WithdrawCommissionDialogue',
|
|
||||||
components: {
|
|
||||||
BModal,
|
|
||||||
BRow,
|
|
||||||
BCol,
|
|
||||||
BForm,
|
|
||||||
BInputGroup,
|
|
||||||
BFormInput,
|
|
||||||
BFormGroup,
|
|
||||||
BFormSelect,
|
|
||||||
BFormCheckbox,
|
|
||||||
BInputGroupAppend,
|
|
||||||
|
|
||||||
ValidationProvider,
|
|
||||||
ValidationObserver,
|
|
||||||
|
|
||||||
WalletInputVue,
|
|
||||||
// eslint-disable-next-line vue/no-unused-components
|
|
||||||
ToastificationContent,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
address: {
|
|
||||||
type: String,
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
validatorAddress: {
|
|
||||||
type: String,
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
chainId: '',
|
|
||||||
account: [],
|
|
||||||
selectedChain: '',
|
|
||||||
balance: [],
|
|
||||||
delegations: [],
|
|
||||||
memo: '',
|
|
||||||
fee: '800',
|
|
||||||
feeDenom: '',
|
|
||||||
wallet: 'ledgerUSB',
|
|
||||||
error: null,
|
|
||||||
sequence: 1,
|
|
||||||
accountNumber: 0,
|
|
||||||
gas: '200000',
|
|
||||||
advance: false,
|
|
||||||
|
|
||||||
required,
|
|
||||||
password,
|
|
||||||
email,
|
|
||||||
min,
|
|
||||||
integer,
|
|
||||||
url,
|
|
||||||
alpha,
|
|
||||||
between,
|
|
||||||
digits,
|
|
||||||
length,
|
|
||||||
alphaDash,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
feeDenoms() {
|
|
||||||
return this.balance.filter(item => !item.denom.startsWith('ibc'))
|
|
||||||
},
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
// console.log('address: ', this.address)
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
|
|
||||||
loadBalance() {
|
|
||||||
this.$http.getBankBalances(this.address).then(res => {
|
|
||||||
if (res && res.length > 0) {
|
|
||||||
this.balance = res.reverse()
|
|
||||||
const token = this.balance.find(i => !i.denom.startsWith('ibc'))
|
|
||||||
if (token) this.feeDenom = token.denom
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getLatestBlock().then(ret => {
|
|
||||||
this.chainId = ret.block.header.chain_id
|
|
||||||
const notSynced = timeIn(ret.block.header.time, 10, 'm')
|
|
||||||
if (notSynced) {
|
|
||||||
this.error = 'Client is not synced or blockchain is halted'
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getAuthAccount(this.address).then(ret => {
|
|
||||||
const account = extractAccountNumberAndSequence(ret)
|
|
||||||
this.accountNumber = account.accountNumber
|
|
||||||
this.sequence = account.sequence
|
|
||||||
})
|
|
||||||
this.fee = this.$store.state.chains.selected?.min_tx_fee || '1000'
|
|
||||||
this.feeDenom = this.$store.state.chains.selected?.assets[0]?.base || ''
|
|
||||||
},
|
|
||||||
handleOk(bvModalEvt) {
|
|
||||||
// console.log('send')
|
|
||||||
// Prevent modal from closing
|
|
||||||
bvModalEvt.preventDefault()
|
|
||||||
// Trigger submit handler
|
|
||||||
// this.handleSubmit()
|
|
||||||
this.sendTx().then(ret => {
|
|
||||||
// console.log(ret)
|
|
||||||
this.error = ret
|
|
||||||
})
|
|
||||||
},
|
|
||||||
resetModal() {
|
|
||||||
this.feeDenom = ''
|
|
||||||
this.error = null
|
|
||||||
},
|
|
||||||
format(v) {
|
|
||||||
return formatToken(v)
|
|
||||||
},
|
|
||||||
async sendTx() {
|
|
||||||
const txMsgs = [
|
|
||||||
{
|
|
||||||
typeUrl: '/cosmos.distribution.v1beta1.MsgWithdrawDelegatorReward',
|
|
||||||
value: {
|
|
||||||
delegatorAddress: this.address,
|
|
||||||
validatorAddress: this.validatorAddress,
|
|
||||||
},
|
|
||||||
}, {
|
|
||||||
typeUrl: '/cosmos.distribution.v1beta1.MsgWithdrawValidatorCommission',
|
|
||||||
value: {
|
|
||||||
validatorAddress: this.validatorAddress,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
]
|
|
||||||
|
|
||||||
if (txMsgs.length === 0) {
|
|
||||||
this.error = 'No delegation found'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
if (!this.accountNumber) {
|
|
||||||
this.error = 'Account number should not be empty!'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
|
|
||||||
const txFee = {
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: this.fee,
|
|
||||||
denom: this.feeDenom,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
gas: this.gas,
|
|
||||||
}
|
|
||||||
|
|
||||||
const signerData = {
|
|
||||||
accountNumber: this.accountNumber,
|
|
||||||
sequence: this.sequence,
|
|
||||||
chainId: this.chainId,
|
|
||||||
}
|
|
||||||
|
|
||||||
sign(
|
|
||||||
this.wallet,
|
|
||||||
this.chainId,
|
|
||||||
this.address,
|
|
||||||
txMsgs,
|
|
||||||
txFee,
|
|
||||||
this.memo,
|
|
||||||
signerData,
|
|
||||||
).then(bodyBytes => {
|
|
||||||
this.$http.broadcastTx(bodyBytes, this.selectedChain).then(res => {
|
|
||||||
setLocalTxHistory({
|
|
||||||
chain: this.$store.state.chains.selected,
|
|
||||||
op: 'withdraw',
|
|
||||||
hash: res.tx_response.txhash,
|
|
||||||
time: new Date(),
|
|
||||||
})
|
|
||||||
this.$bvModal.hide('withdraw-commission-window')
|
|
||||||
this.$toast({
|
|
||||||
component: ToastificationContent,
|
|
||||||
props: {
|
|
||||||
title: 'Transaction sent!',
|
|
||||||
icon: 'EditIcon',
|
|
||||||
variant: 'success',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
// Send tokens
|
|
||||||
// return client.sendTokens(this.address, this.recipient, sendCoins, this.memo)
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
@ -1,351 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<b-modal
|
|
||||||
id="withdraw-window"
|
|
||||||
centered
|
|
||||||
size="md"
|
|
||||||
title="Withdraw Rewards"
|
|
||||||
hide-header-close
|
|
||||||
scrollable
|
|
||||||
|
|
||||||
:ok-disabled="!address"
|
|
||||||
@hidden="resetModal"
|
|
||||||
@ok="handleOk"
|
|
||||||
@show="loadBalance"
|
|
||||||
>
|
|
||||||
<validation-observer ref="simpleRules">
|
|
||||||
<b-form>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Sender"
|
|
||||||
label-for="Account"
|
|
||||||
>
|
|
||||||
<b-input-group class="mb-25">
|
|
||||||
<b-input-group-prepend is-text>
|
|
||||||
<b-avatar
|
|
||||||
:src="account?account.logo:''"
|
|
||||||
size="18"
|
|
||||||
variant="light-primary"
|
|
||||||
rounded
|
|
||||||
/>
|
|
||||||
</b-input-group-prepend>
|
|
||||||
<b-form-input
|
|
||||||
:value="account?account.addr:address"
|
|
||||||
readonly
|
|
||||||
/>
|
|
||||||
</b-input-group>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<b-form-group
|
|
||||||
label="Fee"
|
|
||||||
label-for="Fee"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
rules="required|integer"
|
|
||||||
name="fee"
|
|
||||||
>
|
|
||||||
<b-input-group>
|
|
||||||
<b-form-input v-model="fee" />
|
|
||||||
<b-input-group-append>
|
|
||||||
<b-form-select
|
|
||||||
v-model="feeDenom"
|
|
||||||
:options="feeDenoms"
|
|
||||||
value-field="denom"
|
|
||||||
text-field="denom"
|
|
||||||
/>
|
|
||||||
</b-input-group-append>
|
|
||||||
</b-input-group>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group>
|
|
||||||
<b-form-checkbox
|
|
||||||
v-model="advance"
|
|
||||||
name="advance"
|
|
||||||
value="true"
|
|
||||||
>
|
|
||||||
<small>Advanced</small>
|
|
||||||
</b-form-checkbox>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row v-if="advance">
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Gas"
|
|
||||||
label-for="gas"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="gas"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="gas"
|
|
||||||
v-model="gas"
|
|
||||||
type="number"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
<b-col cols="12">
|
|
||||||
<b-form-group
|
|
||||||
label="Memo"
|
|
||||||
label-for="Memo"
|
|
||||||
>
|
|
||||||
<validation-provider
|
|
||||||
v-slot="{ errors }"
|
|
||||||
name="memo"
|
|
||||||
>
|
|
||||||
<b-form-input
|
|
||||||
id="Memo"
|
|
||||||
v-model="memo"
|
|
||||||
max="2"
|
|
||||||
/>
|
|
||||||
<small class="text-danger">{{ errors[0] }}</small>
|
|
||||||
</validation-provider>
|
|
||||||
</b-form-group>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<wallet-input-vue v-model="wallet" />
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-form>
|
|
||||||
</validation-observer>
|
|
||||||
{{ error }}
|
|
||||||
</b-modal>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { ValidationProvider, ValidationObserver } from 'vee-validate'
|
|
||||||
import {
|
|
||||||
BModal, BRow, BCol, BInputGroup, BFormInput, BAvatar, BFormGroup, BFormSelect,
|
|
||||||
BForm, BInputGroupPrepend, BFormCheckbox, BInputGroupAppend,
|
|
||||||
} from 'bootstrap-vue'
|
|
||||||
import {
|
|
||||||
required, email, url, between, alpha, integer, password, min, digits, alphaDash, length,
|
|
||||||
} from '@validations'
|
|
||||||
import {
|
|
||||||
formatToken, getLocalAccounts, getLocalChains, sign, timeIn, setLocalTxHistory, extractAccountNumberAndSequence,
|
|
||||||
} from '@/libs/utils'
|
|
||||||
import ToastificationContent from '@core/components/toastification/ToastificationContent.vue'
|
|
||||||
import WalletInputVue from './components/WalletInput.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'WithdrawDialogue',
|
|
||||||
components: {
|
|
||||||
BModal,
|
|
||||||
BRow,
|
|
||||||
BCol,
|
|
||||||
BForm,
|
|
||||||
BInputGroup,
|
|
||||||
BInputGroupPrepend,
|
|
||||||
BFormInput,
|
|
||||||
BAvatar,
|
|
||||||
BFormGroup,
|
|
||||||
BFormSelect,
|
|
||||||
BFormCheckbox,
|
|
||||||
BInputGroupAppend,
|
|
||||||
|
|
||||||
ValidationProvider,
|
|
||||||
ValidationObserver,
|
|
||||||
|
|
||||||
WalletInputVue,
|
|
||||||
// eslint-disable-next-line vue/no-unused-components
|
|
||||||
ToastificationContent,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
address: {
|
|
||||||
type: String,
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
chainId: '',
|
|
||||||
account: [],
|
|
||||||
selectedChain: '',
|
|
||||||
balance: [],
|
|
||||||
delegations: [],
|
|
||||||
memo: '',
|
|
||||||
fee: '800',
|
|
||||||
feeDenom: '',
|
|
||||||
wallet: 'ledgerUSB',
|
|
||||||
error: null,
|
|
||||||
sequence: 1,
|
|
||||||
accountNumber: 0,
|
|
||||||
gas: '200000',
|
|
||||||
advance: false,
|
|
||||||
|
|
||||||
required,
|
|
||||||
password,
|
|
||||||
email,
|
|
||||||
min,
|
|
||||||
integer,
|
|
||||||
url,
|
|
||||||
alpha,
|
|
||||||
between,
|
|
||||||
digits,
|
|
||||||
length,
|
|
||||||
alphaDash,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
feeDenoms() {
|
|
||||||
return this.balance.filter(item => !item.denom.startsWith('ibc'))
|
|
||||||
},
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
// console.log('address: ', this.address)
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
computeAccount() {
|
|
||||||
const accounts = getLocalAccounts()
|
|
||||||
const chains = getLocalChains()
|
|
||||||
if (accounts) {
|
|
||||||
const values = Object.values(accounts)
|
|
||||||
for (let i = 0; i < values.length; i += 1) {
|
|
||||||
const addr = values[i].address.find(x => x.addr === this.address)
|
|
||||||
if (addr) {
|
|
||||||
this.selectedChain = chains[addr.chain]
|
|
||||||
return addr
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return null
|
|
||||||
},
|
|
||||||
loadBalance() {
|
|
||||||
this.account = this.computeAccount()
|
|
||||||
if (this.account && this.account.length > 0) this.address = this.account[0].addr
|
|
||||||
if (this.address) {
|
|
||||||
this.$http.getBankBalances(this.address).then(res => {
|
|
||||||
if (res && res.length > 0) {
|
|
||||||
this.balance = res.reverse()
|
|
||||||
const token = this.balance.find(i => !i.denom.startsWith('ibc'))
|
|
||||||
if (token) this.feeDenom = token.denom
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getLatestBlock().then(ret => {
|
|
||||||
this.chainId = ret.block.header.chain_id
|
|
||||||
const notSynced = timeIn(ret.block.header.time, 10, 'm')
|
|
||||||
if (notSynced) {
|
|
||||||
this.error = 'Client is not synced or blockchain is halted'
|
|
||||||
} else {
|
|
||||||
this.error = null
|
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$http.getAuthAccount(this.address).then(ret => {
|
|
||||||
const account = extractAccountNumberAndSequence(ret)
|
|
||||||
this.accountNumber = account.accountNumber
|
|
||||||
this.sequence = account.sequence
|
|
||||||
})
|
|
||||||
this.fee = this.$store.state.chains.selected?.min_tx_fee || '1000'
|
|
||||||
this.feeDenom = this.$store.state.chains.selected?.assets[0]?.base || ''
|
|
||||||
}
|
|
||||||
this.$http.getStakingDelegations(this.address).then(res => {
|
|
||||||
this.delegations = res.delegation_responses
|
|
||||||
})
|
|
||||||
},
|
|
||||||
handleOk(bvModalEvt) {
|
|
||||||
// console.log('send')
|
|
||||||
// Prevent modal from closing
|
|
||||||
bvModalEvt.preventDefault()
|
|
||||||
// Trigger submit handler
|
|
||||||
// this.handleSubmit()
|
|
||||||
this.sendTx().then(ret => {
|
|
||||||
// console.log(ret)
|
|
||||||
this.error = ret
|
|
||||||
})
|
|
||||||
},
|
|
||||||
resetModal() {
|
|
||||||
this.feeDenom = ''
|
|
||||||
this.error = null
|
|
||||||
},
|
|
||||||
format(v) {
|
|
||||||
return formatToken(v)
|
|
||||||
},
|
|
||||||
async sendTx() {
|
|
||||||
const txMsgs = []
|
|
||||||
this.delegations.forEach(i => {
|
|
||||||
txMsgs.push({
|
|
||||||
typeUrl: '/cosmos.distribution.v1beta1.MsgWithdrawDelegatorReward',
|
|
||||||
value: {
|
|
||||||
delegatorAddress: this.address,
|
|
||||||
validatorAddress: i.delegation.validator_address,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
if (txMsgs.length === 0) {
|
|
||||||
this.error = 'No delegation found'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
if (!this.accountNumber) {
|
|
||||||
this.error = 'Account number should not be empty!'
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
|
|
||||||
const txFee = {
|
|
||||||
amount: [
|
|
||||||
{
|
|
||||||
amount: this.fee,
|
|
||||||
denom: this.feeDenom,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
gas: this.gas,
|
|
||||||
}
|
|
||||||
|
|
||||||
const signerData = {
|
|
||||||
accountNumber: this.accountNumber,
|
|
||||||
sequence: this.sequence,
|
|
||||||
chainId: this.chainId,
|
|
||||||
}
|
|
||||||
|
|
||||||
sign(
|
|
||||||
this.wallet,
|
|
||||||
this.chainId,
|
|
||||||
this.address,
|
|
||||||
txMsgs,
|
|
||||||
txFee,
|
|
||||||
this.memo,
|
|
||||||
signerData,
|
|
||||||
).then(bodyBytes => {
|
|
||||||
this.$http.broadcastTx(bodyBytes, this.selectedChain).then(res => {
|
|
||||||
setLocalTxHistory({
|
|
||||||
chain: this.$store.state.chains.selected,
|
|
||||||
op: 'withdraw',
|
|
||||||
hash: res.tx_response.txhash,
|
|
||||||
time: new Date(),
|
|
||||||
})
|
|
||||||
this.$bvModal.hide('withdraw-window')
|
|
||||||
this.$toast({
|
|
||||||
component: ToastificationContent,
|
|
||||||
props: {
|
|
||||||
title: 'Transaction sent!',
|
|
||||||
icon: 'EditIcon',
|
|
||||||
variant: 'success',
|
|
||||||
},
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
}).catch(e => {
|
|
||||||
this.error = e
|
|
||||||
})
|
|
||||||
// Send tokens
|
|
||||||
// return client.sendTokens(this.address, this.recipient, sendCoins, this.memo)
|
|
||||||
return ''
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
Loading…
Reference in New Issue
Block a user