<template>
<Layout-Child>
    <div class=" w-10/12 mx-auto mt-6  text-font-white">
        <app-cell text='NFT名称' boxType='border' :value='transferFormData.nftname'></app-cell>
         <app-cell text='接收人姓名' boxType='border' :value='transferFormData.receiveName'></app-cell>
        <app-cell text='接收地址' boxType='border' :value='transferFormData.receiveWallet'></app-cell>
        <app-cell text='手续费' boxType='border' value='限时免费'></app-cell>
        <app-cell text='数量' boxType='border' :value='transferFormData.count'></app-cell>
    </div>
    <div class="fixed flex bottom-3 w-full left-0 z-30">
            <app-btn
            @click.native="$router.go(-1)"
            text="上一步"
            class="w-5/12 mx-auto text-font-white rounded-2xl bg-font-blue"
            border="none"
          ></app-btn>
          <app-btn
            @click.native="submitTransfer"
            text="确认转出"
            class="w-5/12 mx-auto text-font-white rounded-2xl bg-font-blue"
            border="none"
          ></app-btn>
    </div>
    
</Layout-Child>
</template>

<script lang="ts">

import Vue from 'vue';
import { TransferType } from '@/store/transfer'
export default Vue.extend({
    data(){
        return{

        }
    },
 
  components:{
       'Layout-Child':()=>import('@/layout/Child.vue'),
        'app-cell':()=>import('@/components/common/Cell.vue'),
       'app-btn':()=>import('@/components/common/Btn.vue')
  },
  methods:{
      submitTransfer(){
          if(!this.$store.state.codeConfirmer.show){
            this.$store.commit('codeConfirmer/ToggleCode')
            this.$store.dispatch('codeConfirmer/getVertiryCode')
          } 
      }
  },
  computed:{
      transferFormData():TransferType{
          return this.$store.state.transfer
      }
  }

});
</script>
