144 lines
2.9 KiB
Vue
144 lines
2.9 KiB
Vue
<template>
|
||
<view class="content">
|
||
<view class="header">
|
||
<view class="title">企业注册</view>
|
||
<view class="subtitle">填写企业基础行业，获取企业/商家权益</view>
|
||
</view>
|
||
<view class="white-box">
|
||
<view class="inputs">
|
||
<label>企业名称</label>
|
||
<input type="text" v-model="name" placeholder="输入企业名称" />
|
||
</view>
|
||
<view class="inputs">
|
||
<label>企业类型</label>
|
||
<picker @change="changePicker" data-type="type">
|
||
<view class="picker-text nowrap">
|
||
选择企业类型
|
||
<uni-icons class="picker-icon" type="arrowdown"></uni-icons>
|
||
</view>
|
||
</picker>
|
||
</view>
|
||
<view class="inputs">
|
||
<label>企业行业</label>
|
||
<picker @change="changePicker" data-type="industry">
|
||
<view class="picker-text nowrap">
|
||
选择企业行业
|
||
<uni-icons class="picker-icon" type="arrowdown"></uni-icons>
|
||
</view>
|
||
</picker>
|
||
</view>
|
||
<view class="btns">
|
||
<button type="default" size="default" @click="next">下一步</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
name : "",
|
||
type : [],
|
||
industry : [],
|
||
typeIndex : 0,
|
||
industryIndex: 0
|
||
};
|
||
},
|
||
methods:{
|
||
// 提交信息
|
||
next(){
|
||
console.log(this.name)
|
||
console.log('提交信息')
|
||
this.$Router.push({name: 'Prompt'})
|
||
},
|
||
|
||
//选择器
|
||
changePicker(e){
|
||
let changeType = e.target.dataset.type,
|
||
changeVlae = e.target.dataset.value
|
||
switch(changeType){
|
||
case 'type':
|
||
this.typeIndex = changeVlae
|
||
break
|
||
case 'industry':
|
||
this.industryIndex = changeVlae
|
||
break
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.content{
|
||
.header{
|
||
height: 20vh;
|
||
@extend .vertical;
|
||
.title{
|
||
text-align: center;
|
||
font-size: $title-size + 14;
|
||
font-weight: bold;
|
||
line-height: 90rpx;
|
||
}
|
||
.subtitle{
|
||
font-size: $title-size-m;
|
||
color: $text-gray;
|
||
text-align: center;
|
||
}
|
||
}
|
||
.white-box{
|
||
background-color: white;
|
||
border-radius: $radius $radius 0 0;
|
||
min-height: 80vh;
|
||
padding: $padding * 2;
|
||
box-sizing: border-box;
|
||
.inputs{
|
||
position: relative;
|
||
margin-top: $margin;
|
||
background: white;
|
||
border-bottom: solid 1rpx $border-color;
|
||
padding-left: 200rpx;
|
||
line-height: 90rpx;
|
||
min-height: 90rpx;
|
||
label{
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 200rpx;
|
||
font-size: $title-size;
|
||
}
|
||
input{
|
||
height: 90rpx;
|
||
line-height: 90rpx;
|
||
font-size: $title-size;
|
||
}
|
||
.picker-text{
|
||
position: relative;
|
||
padding-right: 90rpx;
|
||
.picker-icon{
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
}
|
||
}
|
||
}
|
||
.btns{
|
||
padding-top: $padding * 2;
|
||
button{
|
||
background: $text-price;
|
||
border-radius: 0;
|
||
height: 90rpx;
|
||
line-height: 90rpx;
|
||
font-size: $title-size;
|
||
color: white;
|
||
font-weight: bold;
|
||
&::after{
|
||
border: none;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|