From f7da6e337097e4266a7796ede10b5aad159bfb2f Mon Sep 17 00:00:00 2001
From: "271556543@qq.com" <271556543@qq.com>
Date: Tue, 20 Sep 2022 10:54:45 +0800
Subject: [PATCH] 2022-9-20
---
.../pages/careCenter/careCenter.vue | 25 +-
.../pages/careCenter/productDetail.vue | 140 ++++----
.../pages/careCenter/serviceDetail.vue | 339 ++++++++++--------
3 files changed, 282 insertions(+), 222 deletions(-)
diff --git a/packages/packageCarecenter/pages/careCenter/careCenter.vue b/packages/packageCarecenter/pages/careCenter/careCenter.vue
index e76358c..331e753 100644
--- a/packages/packageCarecenter/pages/careCenter/careCenter.vue
+++ b/packages/packageCarecenter/pages/careCenter/careCenter.vue
@@ -74,14 +74,15 @@
推荐
- {{item.name}}
+ {{nameComputed(item.name)}}
{{tag}}
- {{addressComputed(item.address)}}{{distanceComputed(item.distance)}}
+ {{addressComputed(item.address)}}{{distanceComputed(item.distance)}}
￥30200 -
￥45000
@@ -110,13 +111,13 @@
推荐
- {{item.name}}
+ {{nameComputed(item.name)}}
{{tag}}
- {{item.service.name}}
+ {{addressComputed(item.service.name)}}
￥{{item.price}}
@@ -240,9 +241,23 @@
}
},
computed: {
+ nameComputed() {
+ return function(name) {
+ if (!name) {
+ return '未知'
+ }
+ if (name.length > 12) {
+ return name.slice(0, 11) + '..'
+ }
+ return name
+ }
+ },
addressComputed() {
return function(address) {
- if (address&&(address.length > 12)) {
+ if (!address) {
+ return '无'
+ }
+ if (address && (address.length > 12)) {
return address.slice(0, 11) + '..'
}
return address
diff --git a/packages/packageCarecenter/pages/careCenter/productDetail.vue b/packages/packageCarecenter/pages/careCenter/productDetail.vue
index e08fe29..4693072 100644
--- a/packages/packageCarecenter/pages/careCenter/productDetail.vue
+++ b/packages/packageCarecenter/pages/careCenter/productDetail.vue
@@ -1,92 +1,98 @@
-
-
-
-
-
-
-
-
-
- {{swiperIndex}} / {{detail.confinement_picture.length}}
-
-
+
+
+
+
+
+
+
+
-
- ￥ {{detail.price}}
-
+
+ {{swiperIndex}} / {{detail.confinement_picture.length}}
+
+
-
-
- {{detail.name}}
+
+ ￥ {{detail.price}}
-
-
- {{item}}
+
+
+ {{detail.name}}
-
-
-
-
-
-
-
-
- {{detail.service.name}}
- {{detail.service.subheading}}
-
-
- 更多
-
+
+
+ {{item}}
-
-
-
-
-
-
- {{detail.service.address}}
+
+
+
+
+
+
+
+ {{detail.service.name}}
+ {{detail.service.subheading}}
+
+
+ 更多
+
+
-
-
+
+
+
+
+
+
+
+ {{detail.service.address}}
+
+
+
+
-
-
-
- 套餐介绍
-
-
-
- {{item.name}}
- {{item.content}}
+
+
+ 套餐介绍
+
+
+
+ {{item.name}}
+ {{item.content}}
+
-
-
-
- 设备详情
-
-
-
-
- {{item.value}}
+
+
+ 设备详情
+
+
+
+
+ {{item.value}}
+
+
+
+
+
-
+
@@ -97,6 +103,7 @@
export default {
data() {
return {
+ loading: true,
swiperIndex: 1,
detail: {},
}
@@ -133,6 +140,7 @@
},
utilSuccess: (res) => {
this.detail = res
+ this.loading = false
console.log(res);
}
})
diff --git a/packages/packageCarecenter/pages/careCenter/serviceDetail.vue b/packages/packageCarecenter/pages/careCenter/serviceDetail.vue
index 34a4ccd..348f0e9 100644
--- a/packages/packageCarecenter/pages/careCenter/serviceDetail.vue
+++ b/packages/packageCarecenter/pages/careCenter/serviceDetail.vue
@@ -1,192 +1,204 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
- {{detail.confinement_picture.length}}
-
-
-
-
- 1
-
-
-
-
-
-
-
-
-
-
-
- {{detail.name}}
-
- {{detail.subheading}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{detail.confinement_picture.length}}
-
-
-
-
-
-
- {{item1}}
+
+
+
+ 1
+
-
-
-
+
+
+
+
-
- {{detail.address}}
-
-
-
+
+ {{detail.name}}
+
+ {{detail.subheading}}
+
-
-
-
-
-
-
- {{detail.work_time}}
+
+
+
+ {{item1}}
+
-
-
-
-
-
+
+
+
+
+
+
+ {{detail.address || '无'}}
+
+
+
+
-
- 人工客服
+
+
+
+
+
+
+
+ {{detail.work_time || '无'}}
+
-
-
+
+
+
+
+
+
+
+ 人工客服
+
+
+
+
-
-
-
-
+
+
+
-
-
-
- 孕育帮探店
+
+
+
+ 孕育帮探店
+
-
-
-
- {{item.label}}
-
+
+
+
+ {{item.label}}
+
+
+
-
-
-
- {{item.label}}
-
+
+
+
+ {{item.label}}
+
+
+
-
-
-
- 本店商品
-
- 更多
-
+
+
+ 本店商品
+
+ 更多
+
+
-
-
-
-
-
+
+
+
+
-
- {{item.name}}
-
+
+ {{item.name}}
+
-
- {{label}}
+
+
+ {{label}}
+
-
-
- ￥
- {{item.price}}
+
+ ￥
+ {{item.price}}
+
-
-
-
- 本店活动
-
- 更多
-
+
+
+ 本店活动
+
+ 更多
+
+
+
+
+
-
-
-
-
-
-
- 商户简介
-
-
+
+
+ 商户简介
+
+
+
-
-
-
- {{item.name}}
- {{item.content}}
+
+
+ {{item.name}}
+ {{item.content}}
+
-
-
-
+
+
+
-
- 预约探店
+
+
+
@@ -197,6 +209,7 @@
export default {
data() {
return {
+ loading: true,
showFlag: 1,
barIndex: 0,
barTop: 667,
@@ -231,13 +244,15 @@
},
methods: {
init() {
+ let barHeight;
const query = uni.createSelectorQuery().in(this);
query.select(".service-bar").boundingClientRect(res => {
this.barTop = res.top
+ barHeight = res.height
}).exec();
for (let i = 0; i < this.bar.length; i++) {
query.select(this.bar[i].class).boundingClientRect(res => {
- this.bar[i].height = res.top
+ this.bar[i].height = res.top - (barHeight - 20)
}).exec();
}
},
@@ -281,29 +296,32 @@
},
utilSuccess: (res) => {
this.detail = res
+ this.loading = false
+
}
})
}
},
computed: {
- },
- onLoad(option) {
- this.getServiceDetail(option.id)
},
mounted() {
this.$nextTick(() => {
this.init()
})
},
+ onLoad(option) {
+ this.getServiceDetail(option.id)
+ },
onPageScroll(e) {
+ console.log(e);
this.$u.throttle(() => {
if (e.scrollTop > this.barTop) {
this.barFixed = true
} else {
this.barFixed = false
}
- }, 100)
+ }, 50)
}
}
@@ -417,15 +435,17 @@
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
+
+ padding-top: 17rpx;
}
&__sub {
+ display: inline-block;
background: #FF578A;
border-radius: 12rpx;
color: #fff;
padding: 6rpx 11rpx;
- margin-left: 10rpx;
margin-top: 9rpx;
}
}
@@ -456,11 +476,18 @@
&-address {
display: flex;
+ align-items: center;
margin-top: 34rpx;
padding: 0 36rpx;
- &__img {}
+ &__img {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 26rpx;
+ height: 26rpx;
+ }
&__text {
flex: 1;
@@ -473,11 +500,18 @@
&-time {
display: flex;
+ align-items: center;
margin-top: 15rpx;
padding: 0 36rpx;
- &__img {}
+ &__img {
+ width: 26rpx;
+ height: 26rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
&__text {
flex: 1;
@@ -552,6 +586,8 @@
margin-top: -20rpx;
&-fixed {
+ border-bottom: 1rpx solid rgba(180, 180, 180, 0.4);
+
z-index: 4;
position: fixed;
top: 0;
@@ -723,6 +759,7 @@
}
.service-imageinfo {
+ width: 100%;
padding-bottom: 100rpx;
}