fix

src/views/WalletAccountDetail.vue

@@ -49,6 +49,18 @@
            />
             <span class="d-none d-md-block">Transfer</span>
           </b-button>
+          <b-button
+            v-b-modal.operation-modal
+            variant="primary"
+            size="sm"
+            class="mr-25"
+            @click="setOperationModalType('Transfer')"
+          >
+            <feather-icon
+              icon="SendIcon"
+              class="d-md-none"
+            /><small class="d-none d-md-block">Transfer1</small>
+          </b-button>
           <b-button
             v-b-modal.ibc-transfer-window
             variant="danger"

src/views/components/OperationModal/components/Redelegate.vue

@@ -68,6 +68,7 @@
             :options="valOptions"
             :reduce="val => val.value"
             placeholder="Select a validator"
+            :selectable="(v) => v.value"
           />
         </b-form-group>
       </b-col>
@@ -213,7 +214,6 @@ export default {
       })
       this.$http.getStakingDelegations(this.address).then(res => {
         this.delegations = res.delegation_responses
-        console.log(res)
         this.delegations.forEach(x => {
           if (x.delegation.validator_address === this.validatorAddress) {
             this.token = x.balance.denom

src/views/components/OperationModal/components/Transfer.vue

@@ -0,0 +1,204 @@
+<template>
+  <div>
+    <b-row>
+      <b-col>
+        <b-form-group
+          label="Sender"
+          label-for="sender"
+        >
+          <b-input-group class="mb-25">
+
+            <b-form-input
+              name="sender"
+              :value="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 balanceOptions"
+                :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>
+  </div>
+</template>
+
+<script>
+import { ValidationProvider } from 'vee-validate'
+import {
+  BRow, BCol, BInputGroup, BInputGroupAppend, BFormInput, BFormGroup, BFormSelect, BFormSelectOption,
+} from 'bootstrap-vue'
+import {
+  required, email, url, between, alpha, integer, password, min, digits, alphaDash, length,
+} from '@validations'
+import {
+  formatToken, formatTokenDenom, getUnitAmount,
+} from '@/libs/utils'
+
+export default {
+  name: 'TransforDialogue',
+  components: {
+    BRow,
+    BCol,
+    BInputGroup,
+    BInputGroupAppend,
+    BFormInput,
+    BFormGroup,
+    BFormSelect,
+    BFormSelectOption,
+    ValidationProvider,
+
+  },
+  props: {
+    address: {
+      type: String,
+      default: '',
+    },
+    balance: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  data() {
+    return {
+      token: '',
+      amount: null,
+      recipient: '',
+      IBCDenom: {},
+
+      required,
+      password,
+      email,
+      min,
+      integer,
+      url,
+      alpha,
+      between,
+      digits,
+      length,
+      alphaDash,
+    }
+  },
+  computed: {
+    msg() {
+      return [
+        {
+          typeUrl: '/cosmos.bank.v1beta1.MsgSend',
+          value: {
+            fromAddress: this.address,
+            toAddress: this.recipient,
+            amount: [
+              {
+                amount: getUnitAmount(this.amount, this.token),
+                denom: this.token,
+              },
+            ],
+          },
+        },
+      ]
+    },
+    balanceOptions() {
+      return this.setupBalance()
+    },
+  },
+  mounted() {
+    this.$emit('update', {
+      modalTitle: 'Transfer Tokens',
+      historyName: 'send',
+    })
+  },
+
+  methods: {
+    setupBalance() {
+      if (this.balance && this.balance.length > 0) {
+        this.token = this.balance[0].denom
+        return this.balance
+      }
+      return []
+    },
+    format(v) {
+      return formatToken(v, this.IBCDenom)
+    },
+    printDenom() {
+      return formatTokenDenom(this.IBCDenom[this.token] || this.token)
+    },
+
+  },
+
+}
+</script>

src/views/components/OperationModal/components/Unbond.vue

@@ -105,7 +105,6 @@ export default {
     vSelect,
     BInputGroupAppend,
     ValidationProvider,
-
   },
   props: {
     validatorAddress: {
@@ -123,7 +122,6 @@ export default {
       selectedValidator: this.validatorAddress,
       token: '',
       amount: null,
-      balance: [],
       delegations: [],
 
       required,
@@ -167,24 +165,16 @@ export default {
       modalTitle: 'Unbond Token',
       historyName: 'unbond',
     })
-    this.loadBalance()
+    this.loadData()
   },
 
   methods: {
-    printDenom() {
+    loadData() {
-      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.getStakingDelegations(this.address).then(res => {
         this.delegations = res.delegation_responses
         this.delegations.forEach(x => {
@@ -197,7 +187,9 @@ export default {
         })
       })
     },
-
+    printDenom() {
+      return formatTokenDenom(this.token)
+    },
   },
 }
 </script>

src/views/components/OperationModal/index.vue

@@ -155,6 +155,7 @@ import Delegate from './components/Delegate.vue'
 import Redelegate from './components/Redelegate.vue'
 import Withdraw from './components/Withdraw.vue'
 import Unbond from './components/Unbond.vue'
+import Transfer from './components/Transfer.vue'
 
 export default {
   name: 'DelegateDialogue',
@@ -184,6 +185,7 @@ export default {
     Redelegate,
     Withdraw,
     Unbond,
+    Transfer,
   },
   directives: {
     Ripple,