171 lines
3.9 KiB
Vue
171 lines
3.9 KiB
Vue
<template>
|
|
<div class="add">
|
|
<div class="item">
|
|
<span class="tips">*</span>
|
|
<div class="border">
|
|
<span class="label">店名</span>
|
|
<span class="value">
|
|
<input type="text" placeholder="请输入" v-model="name" maxlength="6">
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="item mar-b0">
|
|
<span class="tips">*</span>
|
|
<div class="border">
|
|
<span class="label">地址</span>
|
|
</div>
|
|
</div>
|
|
<div class="text-area">
|
|
<textarea placeholder="请输入" maxlength="30" v-model="name"></textarea>
|
|
</div>
|
|
<div class="item">
|
|
<span class="tips">*</span>
|
|
<div class="border">
|
|
<span class="label">店长</span>
|
|
<span class="value">
|
|
<input type="text" placeholder="请输入" v-model="name" maxlength="6">
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="item">
|
|
<span class="tips"></span>
|
|
<div class="border">
|
|
<span class="label">电话</span>
|
|
<span class="value">
|
|
<input type="text" placeholder="请输入" v-model="name" maxlength="6">
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="item">
|
|
<span class="tips"></span>
|
|
<div class="border">
|
|
<span class="label">身份证号</span>
|
|
<span class="value">
|
|
<input type="text" placeholder="请输入" v-model="name" maxlength="6">
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="item mar-b0">
|
|
<span class="tips"></span>
|
|
<div class="border">
|
|
<span class="label">门店照片</span>
|
|
</div>
|
|
</div>
|
|
<div class="text-area">
|
|
<AiUploader v-model="files" :limit="1" multiple action="/admin/file/add2" style="padding-bottom:16px;"></AiUploader>
|
|
</div>
|
|
<!-- <AiUploader v-model="form.files" :limit="9" multiple action="/admin/file/add2"></AiUploader> -->
|
|
<div class="item">
|
|
<span class="tips"></span>
|
|
<div class="border">
|
|
<span class="label">地图标注</span>
|
|
<span class="value" style="color:#3D94FB;">地图标绘</span>
|
|
</div>
|
|
</div>
|
|
<AiGap h="112"/>
|
|
<div class="btn">保存</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {mapState} from 'vuex'
|
|
|
|
export default {
|
|
name: 'add',
|
|
data() {
|
|
return {
|
|
name: '',
|
|
files: []
|
|
}
|
|
},
|
|
computed: {...mapState(['user'])},
|
|
created() {
|
|
|
|
},
|
|
onShow() {
|
|
document.title = "新增商户"
|
|
},
|
|
methods: {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.add {
|
|
.item{
|
|
width: 100%;
|
|
padding-left: 14px;
|
|
background: #FFF;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
margin-bottom: 16px;
|
|
.tips{
|
|
width: 18px;
|
|
font-size: 32px;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
color: #FF4466;
|
|
line-height: 44px;
|
|
padding: 34px 0 34px 0;
|
|
}
|
|
.border{
|
|
width: calc(100% - 18px);
|
|
padding: 34px 32px 34px 0;
|
|
line-height: 44px;
|
|
line-height: 44px;
|
|
font-size: 32px;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
color: #333;
|
|
display: flex;
|
|
box-sizing: border-box;
|
|
.label{
|
|
width: 170px;
|
|
}
|
|
.value{
|
|
width: calc(100% - 170px);
|
|
text-align: right;
|
|
img{
|
|
width: 32px;
|
|
height: 32px;
|
|
margin-left: 8px;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
.color-999{
|
|
color: #999;
|
|
}
|
|
}
|
|
}
|
|
.mar-b0{
|
|
margin-bottom: 0;
|
|
}
|
|
.text-area{
|
|
width: 100%;
|
|
background-color: #fff;
|
|
padding: 0 32px;
|
|
margin-bottom: 16px;
|
|
box-sizing: border-box;
|
|
textarea{
|
|
width: 100%;
|
|
height: 88px;
|
|
padding-bottom: 32px;
|
|
}
|
|
}
|
|
.btn{
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
text-align: center;
|
|
height: 112px;
|
|
line-height: 112px;
|
|
background: #3975C6;
|
|
box-shadow: inset 0px 2px 0px 0px #EEEEEE;
|
|
font-size: 32px;
|
|
font-family: PingFangSC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #FFF;
|
|
}
|
|
}
|
|
</style>
|