118 lines
2.5 KiB
Vue
118 lines
2.5 KiB
Vue
<template>
|
|
<view class="container">
|
|
<view class="row-input">
|
|
<view class="tip">當前密碼</view>
|
|
<view class="input-box">
|
|
<input v-model="paykey" placeholder="BTC-1" placeholder-class="placeholder" />
|
|
</view>
|
|
</view>
|
|
<view class="row-input">
|
|
<view class="tip">設置密碼</view>
|
|
<view class="input-box" style="margin-bottom: 30rpx;">
|
|
<input v-model="paykey" placeholder="密碼不少於8位數" placeholder-class="placeholder" />
|
|
</view>
|
|
<view class="input-box">
|
|
<input v-model="paykey" placeholder="確認密碼" placeholder-class="placeholder" />
|
|
</view>
|
|
</view>
|
|
<!-- tishi -->
|
|
<view class="row-input">
|
|
<view class="tip">提示信息</view>
|
|
<view class="input-box">
|
|
<input v-model="paykey" placeholder="選填" placeholder-class="placeholder" />
|
|
</view>
|
|
</view>
|
|
<view class="checkbox" style="margin: 60rpx 0 40rpx 0;">
|
|
<checkbox-group @change="payXieyiChange" v-model="xieChecked">
|
|
<checkbox :disabled="isDisable" style="font-size: 30rpx;" value="1"><text
|
|
style="color: #fff;">我已仔細閱讀並同意用戶協議</text></checkbox>
|
|
</checkbox-group>
|
|
</view>
|
|
<!-- save -->
|
|
<view class="login-btn" @tap="submitEdit">
|
|
創建錢包
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
paykey: '',
|
|
isDisable: false,
|
|
xieChecked: ''
|
|
};
|
|
},
|
|
methods: {
|
|
payXieyiChange(i) {
|
|
console.log('iiii', i);
|
|
},
|
|
submitEdit() {}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.container {
|
|
border-top: 1px solid dimgrey;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
font-size: 30rpx;
|
|
padding: 30rpx;
|
|
box-sizing: border-box;
|
|
background: linear-gradient(to bottom, #000033, #51599b);
|
|
|
|
.row-input {
|
|
margin-bottom: 20rpx;
|
|
align-items: center;
|
|
}
|
|
|
|
.tip {
|
|
width: 100px;
|
|
height: 40rpx;
|
|
padding-top: 20rpx;
|
|
font-size: 26rpx;
|
|
color: #e2e3eb;
|
|
margin-bottom: 30rpx;
|
|
}
|
|
|
|
.input-box {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 120rpx;
|
|
color: #e2e3eb;
|
|
font-size: 20rpx;
|
|
background-color: #383D84;
|
|
padding: 20rpx;
|
|
box-sizing: border-box;
|
|
border-radius: 20rpx;
|
|
|
|
image {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
}
|
|
|
|
.placeholder {
|
|
color: #ccc;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
}
|
|
|
|
.login-btn {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 90rpx;
|
|
color: #FFFFFF;
|
|
border-radius: 50rpx;
|
|
font-size: 35rpx;
|
|
background: #4F5AD8;
|
|
box-shadow: 0rpx 10rpx 20rpx 0rpx rgba(98, 92, 236, 0.4);
|
|
}
|
|
|
|
}
|
|
</style> |