胡铖茏
4 years ago
8 changed files with 369 additions and 1131 deletions
File diff suppressed because it is too large
@ -0,0 +1,134 @@ |
|||
.main{ |
|||
padding: 0 32rpx; |
|||
padding-bottom: 100rpx; |
|||
} |
|||
.main .title{ |
|||
text-align: center; |
|||
margin-top: 80rpx; |
|||
color: #000; |
|||
font-size: 32rpx; |
|||
line-height: 48rpx; |
|||
} |
|||
.main .title2{ |
|||
text-align: center; |
|||
margin-top: 32rpx; |
|||
color: #7D87A6; |
|||
font-size: 28rpx; |
|||
line-height: 48rpx; |
|||
} |
|||
.mnemonic{ |
|||
margin-top: 40rpx; |
|||
overflow: hidden; |
|||
} |
|||
.mnemonicBlock{ |
|||
width: 212rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
height: 80rpx; |
|||
margin-bottom: 10rpx; |
|||
background-color: #E0E5F2; |
|||
border-radius: 10rpx; |
|||
text-align: center; |
|||
position: relative; |
|||
color: #000000; |
|||
float: left; |
|||
margin-left: 10rpx; |
|||
} |
|||
.mnemonicBlock .number{ |
|||
position: absolute; |
|||
right: 14rpx; |
|||
font-size: 24rpx; |
|||
bottom: 10rpx; |
|||
color: #7D87A6; |
|||
} |
|||
.main .textareaa{ |
|||
min-height: 364rpx; |
|||
border: 2rpx solid #E9EDF7; |
|||
border-radius: 10rpx; |
|||
margin-top: 60rpx; |
|||
padding: 20rpx; |
|||
overflow: hidden; |
|||
} |
|||
.main .textareaa .item{ |
|||
float: left; |
|||
} |
|||
.main .textareaa .item{ |
|||
margin-left: 10rpx; |
|||
} |
|||
.mnemonicBlock .item{ |
|||
display: flex; |
|||
width: 100%; |
|||
justify-content: center; |
|||
align-items: center; |
|||
height: 100%; |
|||
} |
|||
.info_con{ |
|||
background-color: #fff; |
|||
width: 95%; |
|||
position: absolute; |
|||
top: 50%; |
|||
left: 50%; |
|||
transform: translate(-50%,-50%); |
|||
border-radius: 24rpx; |
|||
z-index: 999; |
|||
padding-top: 128rpx; |
|||
padding-bottom: 64rpx; |
|||
} |
|||
.info_con .img{ |
|||
display: block; |
|||
margin: 0 auto; |
|||
width: 124rpx; |
|||
height: 124rpx; |
|||
} |
|||
.info_con .info{ |
|||
text-align: center; |
|||
font-size: 36rpx; |
|||
margin-top: 20rpx; |
|||
} |
|||
.info_con .text{ |
|||
color: #7D87A6; |
|||
text-align: center; |
|||
font-size: 30rpx; |
|||
margin-top: 40rpx; |
|||
} |
|||
.info_con .btn{ |
|||
margin: 0 auto; |
|||
background-color: #5B53FF; |
|||
width: 480rpx; |
|||
line-height: 96rpx; |
|||
border-radius: 32rpx; |
|||
color: #fff; |
|||
text-align: center; |
|||
margin-top: 104rpx; |
|||
|
|||
} |
|||
.info_con .img2{ |
|||
width: 48rpx; |
|||
height: 48rpx; |
|||
position: absolute; |
|||
right: 30rpx; |
|||
top: 30rpx; |
|||
} |
|||
.info_con .btncon{ |
|||
margin-top: 64rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
padding: 0 24rpx; |
|||
} |
|||
.info_con .btncon .can{ |
|||
width: 314rpx; |
|||
line-height: 96rpx; |
|||
border-radius: 32rpx; |
|||
text-align: center; |
|||
color: #F16063; |
|||
border: 2rpx solid #F16063; |
|||
} |
|||
.info_con .btncon .con{ |
|||
width: 314rpx; |
|||
line-height: 96rpx; |
|||
border-radius: 32rpx; |
|||
text-align: center; |
|||
color: #fff; |
|||
background-color: #5B53FF; |
|||
} |
|||
@ -0,0 +1,165 @@ |
|||
<template> |
|||
<view class=""> |
|||
<navigation :showBack="true"> |
|||
Backup mnemonics |
|||
</navigation> |
|||
<view class="main"> |
|||
<view class="title"> |
|||
Confirm your wallet mnemonic |
|||
</view> |
|||
|
|||
<textarea class="textareaa" placeholder="Enter mnemonic words separated by spaces" placeholder-style="color:rgb(224,229,242)"> |
|||
|
|||
</textarea> |
|||
|
|||
|
|||
<u-button class="custom-style" @click="confirm">Confirm</u-button> |
|||
|
|||
|
|||
<view class="info_con" v-if="show"> |
|||
<image src="../../../../static/tongyonh/xg.png" mode="aspectFit" class="img2" @click="show=false"></image> |
|||
<image src="../../../../static/tongyonh/Frame60.png" mode="aspectFit" class="img"></image> |
|||
<view class="info"> |
|||
Successful |
|||
</view> |
|||
<view class="text"> |
|||
Backup mnemonic completed! |
|||
</view> |
|||
<view class="btn" @click="goTranPaw"> |
|||
Confirm |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="info_con" v-if="show2"> |
|||
<image src="../../../../static/tongyonh/xg.png" mode="aspectFit" class="img2" @click="show2=false"></image> |
|||
<image src="../../../../static/tongyonh/Subtract.png" mode="aspectFit" class="img"></image> |
|||
<view class="info"> |
|||
Invalid Seed |
|||
</view> |
|||
<view class="text"> |
|||
You entered the wrong booster words, <br>please try again. |
|||
</view> |
|||
<view class="btncon"> |
|||
<view class="can" @click="show2=false"> |
|||
Cancel |
|||
</view> |
|||
<view class="con" @click="restart"> |
|||
Confirm |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
<u-mask :show="show" z-index="10"></u-mask> |
|||
<u-mask :show="show2" z-index="10"></u-mask> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import cont from "@/components/navigation/navigation.vue" |
|||
export default { |
|||
data() { |
|||
return { |
|||
mnemonics:[], |
|||
wordArr:[], |
|||
show: false, |
|||
index:0, |
|||
returnIndex:0, |
|||
// 拿来对比的 |
|||
mnemonics2:[], |
|||
show2:false, |
|||
}; |
|||
}, |
|||
methods: { |
|||
// 成功去到设置交易密码 |
|||
goTranPaw(){ |
|||
uni.navigateTo({ |
|||
url:'/pages/menu/backUp/transPaw/index' |
|||
}) |
|||
}, |
|||
// 失败重刷新 |
|||
restart(){ |
|||
uni.redirectTo({ |
|||
url:'../backUp3/index' |
|||
}) |
|||
}, |
|||
// 提交 |
|||
confirm(){ |
|||
var go=false; |
|||
for(var i=0;i<this.mnemonics2.length;i++){ |
|||
if(this.mnemonics2[i]==this.wordArr[i]){ |
|||
go=true; |
|||
}else{ |
|||
go=false; |
|||
} |
|||
|
|||
}; |
|||
if(go){ |
|||
this.show=true; |
|||
}else{ |
|||
this.show2=true |
|||
} |
|||
}, |
|||
// 获取词语 |
|||
getWrod(){ |
|||
var walletInfo = uni.getStorageSync('word'); |
|||
|
|||
this.mnemonics=walletInfo.mnemonic.split(' ') |
|||
// 词语数组打乱顺序 |
|||
this.mnemonics.sort(function() { |
|||
return (0.5-Math.random()); |
|||
}); |
|||
this.mnemonics2=walletInfo.mnemonic.split(' ') |
|||
}, |
|||
returnWord(item,index){ |
|||
this.wordArr.splice(index,1); |
|||
this.mnemonics.splice(this.returnIndex,0,item); |
|||
console.log(this.mnemonics,'return') |
|||
console.log(this.returnIndex,'return') |
|||
this.index-- |
|||
}, |
|||
// 给词到文本框 |
|||
toWrod(word,index){ |
|||
console.log(word,index,11111) |
|||
this.mnemonics.splice(index,1); |
|||
console.log(this.mnemonics,'to') |
|||
this.wordArr[this.index]=word |
|||
this.returnIndex=index |
|||
console.log(this.wordArr) |
|||
this.index++ |
|||
this.$forceUpdate() |
|||
} |
|||
}, |
|||
onLoad() { |
|||
this.getWrod() |
|||
}, |
|||
}; |
|||
</script> |
|||
<style scoped> |
|||
.custom-style { |
|||
height: 112rpx; |
|||
text-align: center; |
|||
color: #fff; |
|||
background-color: #5B53FF !important; |
|||
border-radius: 40rpx; |
|||
margin-top: 50rpx; |
|||
} |
|||
.u-default-hover{ |
|||
background-color: #5B53FF !important; |
|||
border-radius: 40rpx !important; |
|||
color: #fff !important; |
|||
border: none; |
|||
} |
|||
</style> |
|||
|
|||
<style> |
|||
|
|||
@import './index.css'; |
|||
|
|||
</style> |
|||
Loading…
Reference in new issue