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.
yanzong_qianduan/pages/news/park/personal.vue

144 lines
2.9 KiB

<template>
<view class="addressList">
<view class="addressList-hd">
<view class="item">
<view class="a">店铺名称</view>
<view class="b">
<input type="text" placeholder="请输入店铺名称" />
</view>
</view>
<view class="item">
<view class="a">店铺地址</view>
<view class="b">
<input type="text" placeholder="请输入店铺地址" />
</view>
</view>
<view class="item">
<view class="a">联系方式</view>
<view class="b">
<input type="number" placeholder="请输入手机号" />
</view>
</view>
<view class="items">
<view class="a">微信二维码</view>
<view class="c">
<u-upload :action="action" width="160" height="160" :file-list="fileList" :custom-btn="true" max-count="5">
<template v-slot:addBtn>
<view class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
<image src="/static/news/icon-upload.png"></image>
<view class="1">上传图片</view>
</view>
</template>
</u-upload>
</view>
</view>
</view>
<view class="addressList-fd">
<view class="btn">保存</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
checked: false,
value: "",
fileList: [
{
url: 'http://pics.sc.chinaz.com/files/pic/pic9/201912/hpic1886.jpg',
}
],
};
}
}
</script>
<style lang="scss" scoped>
.addressList{
padding: 0 0 20rpx;
overflow: hidden;
&-hd{
background-color: #fff;
padding: 0 25rpx 25rpx;
overflow: hidden;
.item{
padding: 20rpx 0;
line-height: 50rpx;
font-size: 28rpx;
color: #212121;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #F7F7F7;
.b{
font-size: 28rpx;
color: #9D9D9D;
flex: 1;
text-align: right;
input{
width: 100%;
line-height: 50rpx;
font-size: 28rpx;
color: #212121;
}
.select{
color: #C7C7C7;
&-on{
color: #212121;
}
}
}
}
.items{
padding: 20rpx 0;
line-height: 50rpx;
font-size: 28rpx;
color: #212121;
.c{
padding-top: 20rpx;
overflow: hidden;
.slot-btn{
width: 80px;
height: 80px;
background: #FFFFFF;
border-radius: 10rpx;
border: 1px solid #C0C0C0;
text-align: center;
font-size: 24rpx;
font-weight: 500;
color: #D1D1D1;
image{
width: 50rpx;
height: 50rpx;
margin-top: 20rpx;
}
}
}
}
}
&-fd{
width: 100%;
position: fixed;
left: 0;
bottom: 0;
padding: 30rpx;
background-color: #fafafa;
box-sizing: border-box;
.btn{
width: 100%;
line-height: 96rpx;
background: #F34A40;
border-radius: 8rpx;
text-align: center;
font-size: 28rpx;
font-weight: 500;
color: #FFFFFF;
}
}
}
</style>