店铺修改

This commit is contained in:
THK3121 2023-06-21 15:12:51 +08:00
parent 03f2047a09
commit 3a77a017aa
3 changed files with 316 additions and 266 deletions

View File

@ -143,48 +143,45 @@
<view class="store-item" v-for="(item,index) in storeList" :key="index">
<view class="head">
<view class="bgc_img" :style="{ backgroundImage: `url(${item.mini_banner})`}">
<view class="head_conent">
<view class="head_conent_l" @click="goStore(item.mer_id)">
<view class="conent_l_top">
<view class="avatar" :style="{backgroundImage:`url(${item.mer_avatar})`}">
</view>
<view class="top_text">
<p>{{item.mer_name}}</p>
<view class="text">
<image src="@/static/images/phone.png" mode=""></image>
<span>
{{item.service_phone}}
</span>
</view>
<view class="text">
<image src="@/static/images/clock.png" mode=""></image>
<span>
{{item.mer_take_time[0]}}-{{item.mer_take_time[1]}}
</span>
</view>
</view>
</view>
<view class="conent_l_bom">
<view class="text">
<image src="@/static/images/dingwei.png" mode=""></image>
<p>
{{item.mer_address}}
</p>
</view>
<view class="text">
<image src="@/static/images/shangpu.png"></image>
<p>
{{item.mer_info}}
</p>
</view>
</view>
</view>
<view class="zhezhao">
</view>
<view class="zhezhao1" @click="goStore(item.mer_id)">
<view class="title">
<view>{{item.mer_name}}
</view>
<view class="head_conent_r" @click="qctail(item)">
<image class="miniban" :src="item.mer_certificate[0]"></image>
<span>
{{item.type_name}}
</span>
</view>
<view class="coent">
<view class="avater">
<image :src="item.mer_avatar" mode=""></image>
</view>
<view class=" text">
<view class="text_one">
<view class="">
<image src="@/static/images/phone.png" mode=""></image>
{{item.service_phone}}
</view>
<view class="text_one_r">
<image src="@/static/images/clock.png" mode=""></image>
{{item.mer_take_time[0]}}-{{item.mer_take_time[1]}}
</view>
</view>
<view class="text_two">
<image src="@/static/images/shangpu.png" mode=""></image>
{{item.mer_info}}
</view>
<view class="text_three">
<image src="@/static/images/dingwei.png" mode=""></image>
{{item.mer_address}}
</view>
</view>
</view>
</view>
</view>
</view>
<view class='loadingicon acea-row row-center-wrapper' v-if='loading'>
@ -219,10 +216,6 @@
<!-- #ifndef H5 -->
<passwordPopup></passwordPopup>
<!-- #endif -->
<u-popup class="pop" :show="show" @close="close" mode="center" bgColor='transparent'>
<image :src="image"></image>
<image src="@/static/images/guanbi.png" class="guanbi" @click="close"></image>
</u-popup>
</view>
</template>
@ -396,8 +389,6 @@
merList: [], //
mTop: 0,
activeIndex: 0,
show: false, //
image: '' //
};
},
onLoad: function(options) {
@ -587,7 +578,7 @@
this.storeList = this.storeList.concat(res.data.list)
this.count = res.data.count
this.loading = false
// console.log(this.storeList);
console.log(this.storeList);
})
},
//
@ -860,18 +851,6 @@
})
}
},
qctail(item) {
// console.log(item);
if (item.mer_certificate == '') {
return
}
this.show = true
this.image = item.mer_certificate[0]
// console.log(this.show);
},
close() {
this.show = false
}
},
onPullDownRefresh() {
@ -1486,109 +1465,117 @@
justify-content: center;
color: #fff;
.bgc_img {
.zhezhao {
position: absolute;
width: 95%;
height: 200px;
height: 150px;
border-radius: 20rpx;
z-index: 0;
opacity: 0.5;
background-color: #999;
}
.bgc_img {
position: absolute;
width: 95%;
height: 150px;
background-size: cover;
border-radius: 20rpx;
z-index: 0;
}
.head_conent {
.zhezhao1 {
width: 100%;
height: 150px;
border-radius: 20rpx;
z-index: 1;
.title {
display: flex;
height: 50px;
align-items: center;
margin-left: 20px;
z-index: 1;
.head_conent_l {
width: 70%;
.conent_l_top {
display: flex;
height: 200rpx;
.avatar {
width: 80px;
height: 180rpx;
background-size: cover;
margin: 10px 0 10px 10px;
border-radius: 10px;
}
.top_text {
margin: 10px 0 0 15px;
.text {
margin: 12.5rpx 0px;
display: flex;
span {
width: 120px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
-o-text-overflow: ellipsis;
}
image {
width: 15px;
height: 15px;
margin-right: 10rpx;
}
}
p {
font-size: 31rpx;
font-weight: 700;
width: 160px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
-o-text-overflow: ellipsis;
margin-bottom: 30rpx;
}
}
}
.conent_l_bom {
margin-top: 40rpx;
.text {
display: flex;
p {
width: 190px;
margin: 10rpx 0 10Rpx 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
-o-text-overflow: ellipsis;
}
image {
margin: 10rpx 0 10px 10px;
width: 15px;
height: 15px;
margin-right: 10rpx;
}
}
}
}
.head_conent_r {
height: 200px;
width: 30%;
.miniban {
width: 100px;
height: 150px;
margin-top: 35px;
}
span {
background-color: #F84221;
color: white;
font-size: 12px;
padding: 3px;
border-radius: 5px;
margin-left: 5px;
}
}
.coent {
display: flex;
margin-left: 20px;
.avater {
width: 60px;
height: 80px;
image {
width: 60px;
height: 80px;
}
}
.text {
.text_one {
display: flex;
height: 30px;
line-height: 30px;
padding-left: 10px;
image {
width: 20px;
height: 20px;
margin-right: 10px;
}
.text_one_r {
margin-left: 10px;
}
}
.text_two {
width: 270px;
height: 30px;
line-height: 30px;
padding-left: 10px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
image {
width: 20px;
height: 20px;
margin-right: 10px;
}
}
.text_three {
width: 270px;
height: 30px;
line-height: 30px;
padding-left: 10px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
image {
width: 20px;
height: 20px;
margin-right: 10px;
}
}
}
}
}
}
.pro-box {

View File

@ -45,45 +45,40 @@
<view class="store-item" v-for="(item,index) in storeList" :key="index">
<view class="head">
<view class="bgc_img" :style="{ backgroundImage: `url(${item.mini_banner})`}">
<view class="head_conent">
<view class="head_conent_l" @click="goStore(item.mer_id)">
<view class="conent_l_top">
<view class="avatar" :style="{backgroundImage:`url(${item.mer_avatar})`}">
</view>
<view class="top_text">
<p>{{item.mer_name}}</p>
<view class="text">
<image src="@/static/images/phone.png" mode=""></image>
<span>
{{item.service_phone}}
</span>
</view>
<view class="text">
<image src="@/static/images/clock.png" mode=""></image>
<span>
{{item.mer_take_time[0]}}-{{item.mer_take_time[1]}}
</span>
</view>
</view>
</view>
<view class="conent_l_bom">
<view class="text">
<image src="@/static/images/dingwei.png" mode=""></image>
<p>
{{item.mer_address}}
</p>
</view>
<view class="text">
<image src="@/static/images/shangpu.png"></image>
<p>
{{item.mer_info}}
</p>
</view>
</view>
</view>
<view class="zhezhao">
</view>
<view class="zhezhao1" @click="goStore(item.mer_id)">
<view class="title">
<view>{{item.mer_name}}
</view>
<view class="head_conent_r" @click="qctail(item)">
<image class="miniban" :src="item.mer_certificate[0]"></image>
<span>
{{item.type_name}}
</span>
</view>
<view class="coent">
<view class="avater">
<image :src="item.mer_avatar" mode=""></image>
</view>
<view class=" text">
<view class="text_one">
<view class="">
<image src="@/static/images/phone.png" mode=""></image>
{{item.service_phone}}
</view>
<view class="text_one_r">
<image src="@/static/images/clock.png" mode=""></image>
{{item.mer_take_time[0]}}-{{item.mer_take_time[1]}}
</view>
</view>
<view class="text_two">
<image src="@/static/images/shangpu.png" mode=""></image>
{{item.mer_info}}
</view>
<view class="text_three">
<image src="@/static/images/dingwei.png" mode=""></image>
{{item.mer_address}}
</view>
</view>
</view>
</view>
@ -870,109 +865,177 @@
justify-content: center;
color: #fff;
.bgc_img {
.zhezhao {
position: absolute;
width: 95%;
height: 200px;
height: 150px;
border-radius: 20rpx;
z-index: 0;
opacity: 0.5;
background-color: #999;
}
.bgc_img {
position: absolute;
width: 95%;
height: 150px;
background-size: cover;
border-radius: 20rpx;
z-index: 0;
}
.head_conent {
.zhezhao1 {
width: 100%;
height: 150px;
border-radius: 20rpx;
z-index: 1;
.title {
display: flex;
height: 50px;
align-items: center;
margin-left: 20px;
z-index: 1;
.head_conent_l {
width: 70%;
span {
background-color: #F84221;
color: white;
font-size: 12px;
padding: 3px;
border-radius: 5px;
margin-left: 5px;
}
}
.coent {
display: flex;
margin-left: 20px;
.conent_l_top {
.avater {
width: 60px;
height: 80px;
image {
width: 60px;
height: 80px;
}
}
.text {
.text_one {
display: flex;
height: 200rpx;
height: 30px;
line-height: 30px;
padding-left: 10px;
.avatar {
width: 80px;
height: 180rpx;
background-size: cover;
margin: 10px 0 10px 10px;
border-radius: 10px;
image {
width: 20px;
height: 20px;
margin-right: 10px;
}
.top_text {
margin: 10px 0 0 15px;
.text {
margin: 12.5rpx 0px;
display: flex;
span {
width: 120px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
-o-text-overflow: ellipsis;
}
image {
width: 15px;
height: 15px;
margin-right: 10rpx;
}
}
p {
font-size: 31rpx;
font-weight: 700;
width: 160px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
-o-text-overflow: ellipsis;
margin-bottom: 30rpx;
}
.text_one_r {
margin-left: 10px;
}
}
.conent_l_bom {
margin-top: 40rpx;
.text_two {
width: 270px;
height: 30px;
line-height: 30px;
padding-left: 10px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
.text {
display: flex;
p {
width: 190px;
margin: 10rpx 0 10Rpx 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
-o-text-overflow: ellipsis;
}
image {
margin: 10rpx 0 10px 10px;
width: 15px;
height: 15px;
margin-right: 10rpx;
}
image {
width: 20px;
height: 20px;
margin-right: 10px;
}
}
.text_three {
width: 270px;
height: 30px;
line-height: 30px;
padding-left: 10px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
image {
width: 20px;
height: 20px;
margin-right: 10px;
}
}
}
.head_conent_r {
height: 200px;
width: 30%;
.miniban {
width: 100px;
height: 150px;
margin-top: 35px;
}
}
}
}
}
.pro-box {
white-space: nowrap;
display: flex;
align-items: center;
padding: 20rpx 20rpx 30rpx;
.pro-item {
display: inline-block;
width: 218rpx;
margin-right: 14rpx;
.picture,
/deep/image,
uni-image {
width: 100%;
height: 214rpx;
border-radius: 8rpx;
position: relative;
}
.price {
margin-top: 5rpx;
font-size: 28rpx;
color: var(--view-priceColor);
font-weight: bold;
text {
font-size: 28rpx;
}
}
&:last-child {
margin-right: 0;
}
}
&.styleType3 {
padding: 20rpx;
.pro-item {
display: inline-block;
background-color: #fff;
border-radius: 16rpx;
text-align: center;
padding: 10rpx 0 20rpx;
.picture,
/deep/image,
uni-image {
width: 194rpx;
height: 194rpx;
text-align: center;
border-radius: 8rpx;
position: relative;
margin: 0 auto;
}
}
}
}
}
}

View File

@ -152,7 +152,7 @@
this.getList(this.mer_id);
},
onPullDownRefresh() {
this.where.page = 1
// this.where.page = 1
this.loading = false
this.loaded = false
this.getList(this.mer_id);