64 lines
1.5 KiB
Vue
64 lines
1.5 KiB
Vue
<template>
|
|
<view class='card'>
|
|
<up-input v-model="code" placeholder="手机号" border="none"></up-input>
|
|
<up-line color="#D3E3FD" style="margin: 30rpx 0;"></up-line>
|
|
<view style="display: flex;justify-content: space-between;align-items: center;">
|
|
<up-input v-model="code" placeholder="验证码" border="none"></up-input>
|
|
<view class="code-btn">
|
|
<up-line color="grey" direction="col" length="30rpx" style="margin: 0 20rpx;"></up-line>
|
|
<text class='btn-text'>获取验证码</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class='card'>
|
|
<up-input v-model="code" placeholder="请输入你的密码" border="none" type='password' readonly></up-input>
|
|
<up-line color="#D3E3FD" style="margin: 30rpx 0;"></up-line>
|
|
<up-input v-model="code" placeholder="请再次输入你的密码" border="none" type='password' readonly></up-input>
|
|
</view>
|
|
|
|
<view class='submit-btn'>
|
|
<up-button color="#20B128" shape="circle" @click="submit">确认</up-button>
|
|
</view>
|
|
|
|
</template>
|
|
|
|
<script setup>
|
|
import pwdKeyBord from '@/components/pwdKeyBord.vue'
|
|
import {
|
|
ref
|
|
} from "vue"
|
|
|
|
|
|
|
|
|
|
const code = ref('')
|
|
const submit = () => {
|
|
|
|
}
|
|
</script>
|
|
|
|
<style lang='scss'>
|
|
.card {
|
|
padding: 50rpx;
|
|
background-color: white;
|
|
margin-bottom: 30rpx;
|
|
padding-bottom: 30rpx;
|
|
}
|
|
|
|
.submit-btn {
|
|
position: absolute;
|
|
bottom: 100rpx;
|
|
width: 710rpx;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
}
|
|
|
|
.code-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.btn-text {
|
|
color: #20B128;
|
|
}
|
|
</style> |