Skip to content

N
NFT
Commit 124ada16 authored by salitedfish's avatar salitedfish
Browse files
Options

bug修复

parents b9c1e7d6 1106bc79
Show whitespace changes
Inline Side-by-side
Showing with 496 additions and 176 deletions
.env
View file @ 124ada16
NODE_ENV = DEVELOPMENT
VUE_APP_ENV = DEVELOPMENT
VUE_APP_TITLE=开发版本
VUE_APP_URL = http://172.16.101.135:8001
\ No newline at end of file
VUE_APP_URL = http://172.16.101.136:8001
\ No newline at end of file
src/components/CardList.vue
View file @ 124ada16
<template>
<div class="list-container font-light">
<div class="list-row flex justify-start relative text-font-white text-sm mb-3" v-for="(i,index) in outputData" :key="index" :id="i.id">
<div class='item flex flex-col w-4/12 items-center z-10' v-for="(k,kindex) in i" :key="kindex" @click="itemOnclick(k.id)">
<div class='w-full '>
<div class='item flex flex-col w-4/12 items-center z-10 h-44' v-for="(k,kindex) in i" :key="kindex" @click="itemOnclick(k.id)">
<div class='w-full h-full flex items-center '>
<!-- <img src='/img/cover.png' class=" w-11/12 mx-auto rounded-xl shadow-md"> -->
<img :src="k.cover?k.cover :'/img/cover.png'" class="rounded-md max-h-36 mx-auto" />
<img :src="k.cover?k.cover :'/img/cover.png'" class="rounded-md max-h-32 mx-auto" />
</div>
<div class='mt-3'>
{{k.name}}
......
src/components/common/ScrollBar.vue
View file @ 124ada16
<template>
<div class="w-full flex justify-between py-3 items-center" >
<div class="flex-grow flex flex-row ">
<van-tabs v-model="indexValue" class='w-11/12' swipeable @change="tabChange" lazy-render>
<van-tabs :value="active" class='w-11/12' swipeable @click="tabChange" lazy-render>
<van-tab v-for='i in list' :key="i.id" :title='i.categoryName' :id='i.id'>
</van-tab>
</van-tabs>
......@@ -32,43 +32,26 @@ export default Vue.extend({
type:Array as PropType<Category[]>,
required: true
},
defaultActive:Number
defaultIndex:Number
},
// watch:{
// 'defaultActive'(newv,oldv){
// console.log(newv,oldv);
// }
// },
data(){
return{
// active: this.defaultActive,
listData:this.list
active: 0
}
},
components:{
'app-icon':()=>import('@/components/common/Icon.vue')
},
computed:{
indexValue:{
get():number{
return this.defaultActive
},
set(id:any){
this.$emit('indexOnchange',id)
}
async created() {
if(this.defaultIndex){
this.active = this.defaultIndex
}
},
methods:{
tabChange(item:any){
console.log(item);
this.$emit('tabChange',{data:this.list[item],activeIndex:item})
this.$emit('tabChange',{data:this.list[item],activeIndex:item+1})
},
// indexChange(index:any){
// this.$emit('indexCahge',this.active)
// }
}
});
......
src/layout/Child.vue
View file @ 124ada16
<template>
<div id="Child" class="bg-font-black">
<van-overlay :show="CodeData.show" class='z-50'>
<div class="code-confirm flex flex-row item-center content-center justify-center text-font-white h-full" @click.stop>
<div class="self-center bg-font-light-black rounded-lg">
<div class=" flex flex-col text-font-white p-6 ">
<div class=' text-font-dark-blue'>安全验证</div>
<div class='text-xs my-1'>验证码已发送到您绑定的手机</div>
<input type="number" class=" bg-font-black py-2 px-1 w-48 my-3" v-model="codeValue" placeholder="请输入验证码">
<div class=' text-font-dark-blue text-xs self-end'> <span v-if="CodeData.resend"> {{CodeData.count}}秒后,重新发送</span> <span v-else class='text-font-blue'> 重新发送</span></div>
</div>
<!-- <div class='flex w-10/12 mx-auto justify-between'>
<app-btn text="取消" class=" text-font-gray"></app-btn>
<app-btn text="确认" class=' text-font-blue'></app-btn>
</div> -->
</div>
</div>
</van-overlay>
<div class="fixed top-0 left-0 w-full bg-font-black bg-opacity-75 z-40">
<NavHeader></NavHeader>
</div>
......@@ -14,9 +31,30 @@
import Vue from 'vue';
import NavHeader from './NavHeader.vue'
export default Vue.extend({
data(){
return{
codeValue:null
}
},
watch:{
codeValue(newV,oldV){
console.log(newV.length);
if(newV.length==4){
console.log('send');
}else if(newV.length>4){
this.codeValue = oldV
}
}
},
computed:{
CodeData:function(){
return this.$store.state.codeConfirmer
}
},
name: 'layout_child',
components:{
NavHeader
NavHeader,
// 'app-btn':()=>import('@/components/common/Btn.vue')
}
});
</script>
src/router/index.ts
View file @ 124ada16
......@@ -61,9 +61,25 @@ const routes: Array<RouteConfig> = [
path:'/Nft/transfer',
name:'NftTransfer',
component: () => import('@/view/NFT/Transfer/index.vue'),
redirect:'/Nft/transfer/form',
children:[
{
path:'/Nft/transfer/form',
name:'NftTransfer_form',
component: () => import('@/view/NFT/Transfer/form.vue'),
meta:{
title: 'NFT转让'
}
},
},
{
path:'/Nft/transfer/confirm',
name:'NftTransfer_confirm',
component: () => import('@/view/NFT/Transfer/confirm.vue'),
meta:{
title: '确认信息'
},
},
]
},
{
path:'/Nft/transfer/camera',
......
src/service/nftService/nftService.ts
View file @ 124ada16
......@@ -2,6 +2,7 @@ import { Service } from '../Service'
import { token } from '@/util/userInfoUtils'
import { iSaveData } from './types'
import { NftTransferDTO } from '@/types/Dto'
export class NFTService extends Service {
router = {
getMyList: {
......@@ -59,7 +60,13 @@ export class NFTService extends Service {
path:'/commemorate/nft/receive',
dataType: 'application/x-www-form-urlencoded'
},
nftTransfer:{
path:'/nft/transfer'
},
sendTransferCode:{
path:'/verificationCode/send/Sms/transferNft',
dataType: 'application/x-www-form-urlencoded'
}
}
constructor() {
super()
......@@ -337,4 +344,27 @@ export class NFTService extends Service {
params:{id}
})
}
/**
* 转让NFT
* @param data NftTransferDTO
* @returns
*/
async nftTransfer(data:NftTransferDTO){
return this.service.post(this.router.nftTransfer.path,data,{
headers: {
Authorization: this.getAuth()
}
})
}
async sendTransferCode(){
return await this.service.post(this.router.sendTransferCode.path,{},{
headers: {
Authorization: this.getAuth(),
'Content-Type': this.router.officialNFTDetail.dataType,
}
})
}
}
src/service/userService.ts
View file @ 124ada16
......@@ -11,7 +11,8 @@ export class UserService extends Service {
isPwdSet:{ path:'/user/isSetPassword', dataType:'application/x-www-form-urlencoded'},
userInfo:{ path:'/user/detail',dataType:'application/x-www-form-urlencoded'},
editUser:{path:'/user/update'},
avatar:{ path:'/user/upload/avatar',dataType:'multipart/form-data'}
avatar:{ path:'/user/upload/avatar',dataType:'multipart/form-data'},
getUserInfoByAddr:{ path:'/user/getUserByWallet', dataType:'application/x-www-form-urlencoded'}
}
constructor(){
super()
......@@ -83,6 +84,14 @@ export class UserService extends Service {
})
}
async getUserInfoByAddr(addr:string):Promise<any>{
return await this.service.get(this.router.getUserInfoByAddr.path,{
headers:{
Authorization: this.getAuth()
},
params:{"wallet":addr}
})
}
/**
* 编辑用户的相关信息
......
src/store/codeConfimer.ts 0 → 100644
View file @ 124ada16
import {NFTService} from '@/service/nftService/nftService'
const nftService = new NFTService()
const stateData = {
show:false,
count:30,
counter:null as any,
value:null as any,
resend:false,
}
export type CodeType = typeof stateData
export const codeConfirmer = {
namespaced: true,
state: () => ({
...stateData,
}),
mutations: {
CountDown(state:CodeType):void{
console.log(state.count);
if(!state.counter){
state.counter = setInterval(()=>{
if(state.count>-1){
state.resend = false
state.count--
}else{
state.count = 30
state.resend = true
clearInterval(state.counter)
}
},1000)
}
},
SET_CODE(state:CodeType,payload:any){
state.value = payload
},
ToggleCode(state:CodeType){
state.show = !state.show;
},
},
actions: {
async openCodeConfirm({commit,state} :any){
if(!state.show){
commit('ToggleCode')
console.log(state.count);
commit('CountDown')
await nftService.sendTransferCode()
}
},
},
getters: {},
}
src/store/index.ts
View file @ 124ada16
......@@ -2,11 +2,15 @@ import Vue from 'vue'
import Vuex from 'vuex'
import {appStore} from './app'
import {create} from "./create"
import {codeConfirmer} from "./codeConfimer"
import {nftTransfer} from "./transfer"
Vue.use(Vuex)
export default new Vuex.Store({
modules: {
app:appStore,
codeConfirmer:codeConfirmer,
transfer:nftTransfer,
create
}
})
src/store/transfer.ts 0 → 100644
View file @ 124ada16
const stateData = {
count:0,
receiveWallet:'',
receiveName:'',
nftid:0,
nftname:'',
feeCost:0,
senderName:'',
senderWallet:'',
}
export type TransferType = typeof stateData
export const nftTransfer = {
namespaced: true,
state: () => ({
...stateData,
}),
mutations: {
SET_STATE(state: TransferType, payload: any) {
Object.assign(state, payload)
},
}
}
\ No newline at end of file
src/types/Dto.ts
View file @ 124ada16
......@@ -35,6 +35,15 @@ export interface PersonalCertifyDto{
}
export interface NftTransferDTO{
code:string,
codeType:string,
count: number,
id: number,
receiveWallet:string
}
export interface UserInfo{
authStatus?: number;
authType?: number;
......
src/view/NFT/Create/components/certificate/index.vue
View file @ 124ada16
......@@ -10,9 +10,10 @@
<div class="pt-6 xs:text-sm text-xs">
<div>影视区块链版权电子数据确权书</div>
</div>
<div class=" h-40 flex items-center ">
<div class=" h-40 flex items-center relative">
<img id="coverImg" v-if="!coverName" src="/img/cover.png" class=" max-w-20 xs:max-w-24 mx-auto mt-4 mb-4 max-h-32" />
<img id="coverImg" :src="showUploadFile" v-else class=" max-w-20 xs:max-w-24 mx-auto mt-4 mb-4 max-h-32" />
<img src="./mark.png" class=" absolute right-20 bottom-0"/>
</div>
<div class="float-box w-full absolute -bottom-10 text-3xs xs:text-2xs">
<div class="w-11/12 p-2 flex-wrap mx-auto flex break-all bg-font-white shadow-md rounded text-font-black">
......@@ -68,7 +69,7 @@ import { mapState } from "vuex";
export default Vue.extend({
data(){
return {
createTime: moment(new Date()).format('YYYY-MM-DD hh:mm:ss')
createTime: moment(new Date()).format('YYYY-MM-DD HH:mm:ss')
}
},
computed:{
......
src/view/NFT/Detail/index.vue
View file @ 124ada16
......@@ -169,12 +169,30 @@
flex
items-center
px-5
mb-7
pb-7
bg-font-black bg-opacity-80
shadow-nav
flex-col
"
v-if="!$route.query.officia"
>
<div class="w-10/12 pt-8" v-if="showoverlay">
<app-cell text="文件类型" value="png" class="my-1"></app-cell>
<app-cell
text="文件名"
:value="nftData.fileName"
class="my-1"
></app-cell>
<div class="flex justify-center">
<van-image
class="my-3 self-center text-center"
width="180"
lazy-load
:src="nftData.fileUrl"
/>
</div>
</div>
<div class='flex w-full items-center'>
<div class="flex-grow-0">
<div @click="editCollection">
<app-icon
......@@ -188,6 +206,7 @@
</div>
<div class="flex-grow pl-8">
<app-btn
@click.native="confirmBtn"
text="查看内容"
class="w-full mx-auto text-font-white rounded-2xl bg-font-blue"
border="none"
......@@ -195,6 +214,8 @@
</div>
</div>
</div>
<div
class="
fixed
......@@ -205,7 +226,7 @@
flex
items-center
px-5
mb-7
pb-7
bg-font-black bg-opacity-95
shadow-nav
flex-col
......@@ -363,6 +384,10 @@ export default Vue.extend({
}
}else if(this.nftData.status == 0){
this.$router.push({name:'myListNft',query:{category:this.nftData.category}})
}else{
console.log(11);
this.showoverlay = true;
}
},
async setMyCollection(): Promise<void> {
......
src/view/NFT/Mynft/index.vue
View file @ 124ada16
......@@ -37,8 +37,7 @@
<app-scrollbar
:list="categoryTypes"
@tabChange="getDataByCategory"
@indexOnchange='indexOnchange'
:defaultActive='defaultActive'
:defaultIndex='defaultIndex'
></app-scrollbar>
<div class="myNFT-list-scroll">
<div v-if="listData.length > 0">
......@@ -74,18 +73,20 @@ export default Vue.extend({
qrcode:'',
srcData:'' as any,
showAction:false,
defaultActive:0
defaultIndex:0
};
},
async created() {
this.categoryTypes = await this.$service.nftService.getCategory();
const cates = await this.$service.nftService.getCategory()
if(this.$route.query.category){
const index = await this.categoryTypes.findIndex(i=>{
const index = await cates.findIndex(i=>{
return i.categoryName == this.$route.query.category
})
this.defaultActive = index
}
this.defaultIndex = index
}
console.log(this.defaultIndex);
this.categoryTypes = cates
},
async mounted() {
let data = await this.$service.nftService.getMyList();
......@@ -113,8 +114,6 @@ export default Vue.extend({
},
openAction(){
console.log(11);
this.showAction = true;
},
copyAddr(addr:any){
......
src/view/NFT/Transfer/camera.vue
View file @ 124ada16
<template>
<div id="scanner">
<div class="model">
<div class="scanner-view" v-if="showScannerView">
<div class="scanner-view">
<div class="scanner-view-arrow arrow1"></div>
<div class="scanner-view-arrow arrow2"></div>
<div class="scanner-view-arrow arrow3"></div>
......@@ -29,10 +29,11 @@
import Vue from 'vue';
import jsQR from "jsqr";
import Quagga from "quagga";
import testImg from "@/assets/img/testCode.jpg"
export default Vue.extend({
name: "",
data() {
return { cameraWidth: 0, cameraHeight: 0, timerID: 0,showScannerView:false};
return { cameraWidth: 0, cameraHeight: 0, timerID: 0};
},
beforeDestroy(){
console.log('clearInterval');
......@@ -142,7 +143,7 @@ export default Vue.extend({
if (result.codeResult) {
console.log(result.codeResult);
clearInterval(timer);
_this.$router.push({name:'NftTransfer',query:{codeData:result.codeResult.code}})
_this.$emit("ondata", result.codeResult.code);
// alert("扫码成功，结果是..." + result.codeResult.code);
} else {
console.log("正在扫条形码...not detected 1");
......@@ -160,7 +161,8 @@ export default Vue.extend({
});
if (code) {
clearInterval(timer);
_this.$router.push({name:'NftTransfer',query:{codeData:code.data}})
_this.$emit("ondata", code.data);
//
// alert("扫码成功，结果是..." + code.data);
} else {
......@@ -169,6 +171,7 @@ export default Vue.extend({
},
},
mounted() {
console.log(navigator, "show navigator");
if (
(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) ||
......@@ -176,7 +179,6 @@ export default Vue.extend({
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia
) {
this.showScannerView = true
//调用用户媒体设备，访问摄像头
this.initVideo({
video: {
......@@ -191,14 +193,13 @@ export default Vue.extend({
});
} else {
// alert("你的浏览器不支持访问用户媒体设备");
this.$router.push({name:'NftTransfer',query:{codeData:'扫描失败'}})
this.$toast('不支持访问用户媒体设备')
this.$emit("onerror", "你的浏览器不支持访问用户媒体设备");
}
},
});
</script>
<style scoped>
<style>
body {
margin: 0;
padding: 0;
......
src/view/NFT/Transfer/confirm.vue 0 → 100644
View file @ 124ada16
<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(){
this.$store.dispatch('codeConfirmer/openCodeConfirm')
}
},
computed:{
transferFormData():TransferType{
return this.$store.state.transfer
}
}
});
</script>
src/view/NFT/Transfer/form.vue 0 → 100644
View file @ 124ada16
<template>
<div>
<Layout-Child v-show="showTransfer">
<div class='mt-6 w-11/12 mx-auto break-all' @click="pageOnclick">
<div class="flex flex-col mb-6 text-font-dark-blue">
<div class="label">
NFT名称
</div>
<div class="value-container h-11 leading-10 bg-font-light-black px-3 mt-2 rounded">
{{this.$route.query.nftName}}
</div>
</div>
<div class="flex flex-col text-font-dark-blue">
<div class="label">
转出地址
</div>
<div class="value-container h-24 flex flex-row items-center bg-font-light-black px-3 mt-2 rounded">
<div>
<van-image
width="45"
height="45"
lazy-load
show-loading
show-error
round
fit="cover"
:src='this.$route.query.avatar?this.$route.query.avatar:"/img/mokeImg/avatar.png"'
/>
</div>
<div class="pl-3 pr-8">
<div>张丽莉</div>
<div class=" text-xs">cbdusbvudbvubdvu45656464646bduvbduvbud</div>
</div>
</div>
</div>
<div class="flex flex-col text-font-dark-blue mt-6">
<div class="label">
收款地址
</div>
<div class="value-container h-24 flex flex-row items-center relative bg-font-light-black px-3 mt-2 rounded " :class='receiveOnfocus?"border border-font-blue":""' @click='inputOnclick' >
<div >
<div class=" absolute right-3 top-10">
<app-icon name="icon-a-saoma1" size='24px' @click.native="goScalePage"></app-icon>
</div>
<van-image
width="45"
height="45"
lazy-load
show-loading
show-error
round
fit="cover"
:src='this.receiver.avatar?this.receiver.avatar:"/img/mokeImg/avatar.png"'
/>
</div>
<div class=" pl-3 pr-8 w-10/12 ">
<input class="text-base bg-transparent bg-opacity-0 text-font-white w-6/12" placeholder='接受人姓名' :value="receiver.name" disabled/>
<input v-model="receiver.addr" class=" text-xs bg-transparent bg-opacity-0 text-font-white w-full" placeholder='接受人地址' ref="addrInput" @blur="searchUser"/>
</div>
</div>
</div>
<div class=" text-font-dark-blue my-3">
<div>转让须知</div>
<ol class=" text-xs">
<li class="my-1">1. 由持有人发起NFT转让，不涉及线上现金交易 </li>
<li class="my-1">2. NFT成功转让后，无法撤销</li>
</ol>
</div>
<div class="py-60"></div>
</div>
<div class="fixed bottom-3 w-full left-0 z-30">
<app-btn
@click.native="submitTransfer"
text="下一步"
class="w-11/12 mx-auto text-font-white rounded-2xl bg-font-blue"
border="none"
></app-btn>
</div>
</Layout-Child>
<camera v-if="showCamera" @onData="getData" @onerror="getError"/>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
data(){
return{
receiveOnfocus:false,
receiver:{
name:'',
addr:'',
avatar:''
},
showTransfer: true,
showCamera: false,
codeData:''
}
},
components:{
'Layout-Child':()=>import('@/layout/Child.vue'),
'app-icon':()=>import('@/components/common/Icon.vue'),
'app-btn':()=>import('@/components/common/Btn.vue'),
"camera":()=>import('./camera.vue')
},
methods:{
inputOnclick(e:Event){
e.preventDefault();
e.stopPropagation();
const input = this.$refs.addrInput as HTMLInputElement;
if(!this.receiveOnfocus){
this.receiveOnfocus = true;
input.focus()
}
},
pageOnclick(){
const input = this.$refs.addrInput as HTMLInputElement;
if(this.receiveOnfocus){
this.receiveOnfocus = false;
input.blur()
}
},
goScalePage(e:Event){
e.stopPropagation();
this.showTransfer = false
this.showCamera = true
},
getData(codeData:any){
this.receiver.addr = codeData
this.showTransfer = true
this.showCamera = false
},
getError(errorMes:any){
this.showTransfer = true
this.showCamera = false
this.$toast(errorMes)
// this.showCamera = false
},
submitTransfer(){
const input = this.$refs.addrInput as HTMLInputElement;
if( this.receiveOnfocus){
this.receiveOnfocus = false;
input.blur()
}else{
let data = {
count:1,
receiveWallet:this.receiver.addr,
receiveName:this.receiver.name,
nftid:Number(this.$route.query.nftId),
nftname:this.$route.query.nftName,
senderWallet:this.$route.query.from
}
this.$store.commit('transfer/SET_STATE',data)
console.log(this.$store.state.transfer);
this.$router.push({ name:'NftTransfer_confirm'})
}
},
async searchUser(){
const {addr} = this.receiver
if(addr.length>30){
const req = await this.$service.userService.getUserInfoByAddr(addr)
console.log(req);
if(req.wallet){
this.receiver.name = req.nickname?req.nickname:req.telephone
this.receiver.avatar = req.avatar
}else{
this.$toast.fail('没有找到该用户')
}
}else{
this.$toast.fail('请输入合法地址')
}
}
},
computed:{
getUserInfo():any{
return this.$util.userMsg.getUserMsg()
}
}
});
</script>
src/view/NFT/Transfer/index.vue
View file @ 124ada16
<template>
<Layout-Child>
<div class='mt-6 w-11/12 mx-auto break-all' @click="pageOnclick">
<div class="flex flex-col mb-6 text-font-dark-blue">
<div class="label">
NFT名称
</div>
<div class="value-container h-11 leading-10 bg-font-light-black px-3 mt-2 rounded">
{{this.$route.query.nftName}}
</div>
</div>
<div class="flex flex-col text-font-dark-blue">
<div class="label">
转出地址
</div>
<div class="value-container h-24 flex flex-row items-center bg-font-light-black px-3 mt-2 rounded">
<div>
<van-image
width="45"
height="45"
lazy-load
show-loading
show-error
round
fit="cover"
:src='this.$route.query.avatar?this.$route.query.avatar:"/img/mokeImg/avatar.png"'
/>
</div>
<div class="pl-3 pr-8">
<div>张丽莉</div>
<div class=" text-xs">cbdusbvudbvubdvu45656464646bduvbduvbud</div>
</div>
</div>
</div>
<div class="flex flex-col text-font-dark-blue mt-6">
<div class="label">
收款地址
</div>
<div class="value-container h-24 flex flex-row items-center relative bg-font-light-black px-3 mt-2 rounded " :class='receiveOnfocus?"border border-font-blue":""' @click='inputOnclick'>
<div >
<div class=" absolute right-3 top-10">
<app-icon name="icon-a-saoma1" size='24px' @click.native="goScalePage"></app-icon>
</div>
<van-image
width="45"
height="45"
lazy-load
show-loading
show-error
round
fit="cover"
:src='this.$route.query.avatar?this.$route.query.avatar:"/img/mokeImg/avatar.png"'
/>
</div>
<div class=" pl-3 pr-8 w-10/12 ">
<input class="text-base bg-transparent bg-opacity-0 text-font-white w-6/12" placeholder='接受人姓名' disabled/>
<input v-model="receiver.addr" class=" text-xs bg-transparent bg-opacity-0 text-font-white w-full" placeholder='接受人地址' ref="addrInput"/>
</div>
</div>
</div>
<div class="py-60"></div>
</div>
<div class="fixed bottom-3 w-full left-0 z-30">
<app-btn
text="转出"
class="w-11/12 mx-auto text-font-white rounded-2xl bg-font-blue"
border="none"
></app-btn>
<keep-alive>
<router-view></router-view>
</keep-alive>
</div>
</Layout-Child>
</template>
\ No newline at end of file
<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
data(){
return{
receiveOnfocus:false,
receiver:{
name:'',
addr:''
}
}
},
components:{
'Layout-Child':()=>import('@/layout/Child.vue'),
'app-icon':()=>import('@/components/common/Icon.vue'),
'app-btn':()=>import('@/components/common/Btn.vue')
},
methods:{
inputOnclick(e:Event){
e.preventDefault();
e.stopPropagation();
const input = this.$refs.addrInput as HTMLInputElement;
if(!this.receiveOnfocus){
this.receiveOnfocus = true;
input.focus()
}
},
pageOnclick(e:Event){
console.log(e.target);
const input = this.$refs.addrInput as HTMLInputElement;
if(this.receiveOnfocus){
this.receiveOnfocus = false;
input.blur()
}
},
goScalePage(e:Event){
e.stopPropagation();
this.$router.push({name:'NftTransferCamera'})
// console.log(e.target,'去相机扫描页面');
}
},
computed:{
getUserInfo(){
return this.$util.userMsg.getUserMsg()
}
}
});
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment