You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
Sports/pages/user/personal.vue

197 lines
4.0 KiB

<template>
<view class="add">
<view class="add-bd">
<view class="item">
<view class="l">用户名</view>
<view class="r">
<input type="text" v-model="info.father" />
</view>
</view>
<view class="item">
<view class="l">密码:</view>
<view class="r">
<input type="password" placeholder="数字加字母" v-model="info.father" />
</view>
</view>
<view class="item">
<view class="l">再次输入密码:</view>
<view class="r">
<input type="password" v-model="info.father" />
</view>
</view>
<view class="item">
<view class="l">注册人员类型:</view>
<view class="r">
<picker mode="selector" :range="range1" :value="info.sex" @change="bindDateChange">
{{info.color?info.color:""}}
<image class="arrow" src="@/static/jiantouxia@2x.png"></image>
</picker>
</view>
</view>
<view class="item">
<view class="l">真实姓名:</view>
<view class="r">
<input type="text" v-model="info.father" />
</view>
</view>
<view class="item">
<view class="l">院系:</view>
<view class="r">
<input type="text" v-model="info.father" />
</view>
</view>
<view class="item">
<view class="l">专业:</view>
<view class="r">
<input type="text" v-model="info.father" />
</view>
</view>
<view class="item">
<view class="l">课题组:</view>
<view class="r">
<input type="text" v-model="info.father" />
</view>
</view>
<view class="item">
<view class="l">导师:</view>
<view class="r">
<input type="text" v-model="info.father" />
</view>
</view>
</view>
<view class="add-fd">
<view class="btn" @click="toReg">修改</view>
</view>
<u-popup :show="show" mode="center" :round="10" :close-on-click-overlay="false" @close="close">
<view class="popup">
<view class="title">提交成功!</view>
<view class="btn" @click="toPage()">确定</view>
</view>
</u-popup>
</view>
</template>
<script>
export default {
data() {
return {
show: false,
tabIndex: 1,
rangeIndex: -1,
range: ['公','母'],
range1: ['黄色','蓝色'],
info: {},
};
},
methods: {
close() {
this.show = false
},
tabItem(e){
this.tabIndex = e;
},
toReg() {
this.show = true
},
toPage(){
uni.navigateBack({
delta: 1
})
},
}
}
</script>
<style lang="scss" scoped>
.add{
padding-bottom: calc(env(safe-area-inset-bottom)+140rpx);
overflow: hidden;
.popup{
width: 670rpx;
height: 380rpx;
text-align: center;
padding: 110rpx 0 30rpx 0;
box-sizing: border-box;
.title{
font-size: 32rpx;
color: #000;
text-align: center;
}
.btn{
width: 210rpx;
line-height: 90rpx;
font-size: 30rpx;
color: #000;
margin: 0 auto;
background-color: #f8b62d;
border-radius: 8rpx;
margin-top: 80rpx;
}
}
&-bd{
padding: 0 35rpx;
overflow: hidden;
.item{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 40rpx 0;
border-bottom: 1px solid #c0c2c2;
.l{
font-size: 28rpx;
color: #000;
}
.r{
flex: 1;
display: flex;
align-items: center;
justify-content: flex-end;
input,picker{
flex: 1;
font-size: 28rpx;
color: #000;
height: 50rpx;
line-height: 50rpx;
text-align: right;
}
.arrow{
width: 32rpx;
height: 19rpx;
margin-left: 20rpx;
vertical-align: middle;
}
.date{
width: 45rpx;
height: 45rpx;
margin-left: 20rpx;
vertical-align: middle;
}
}
}
}
&-fd{
width: 100%;
padding: 20rpx 35rpx;
box-sizing: border-box;
background-color: #f3f5f6;
position: fixed;
left: 0;
bottom: 0;
z-index: 22;
padding-bottom: calc(env(safe-area-inset-bottom));
.btn{
width: 100%;
line-height: 90rpx;
text-align: center;
background-color: #009944;
font-size: 32rpx;
color: #ffffff;
border-radius: 10rpx;
}
}
}
</style>