fix: 优化页面UI及修复安全区域占位符问题

- 将“进展状态”文案统一改为“活动进展”以提升一致性
- 在商品详情页添加安全区域占位符,防止底部内容被遮挡
- 优化用户功德组件样式,调整日期显示格式和布局
- 更新构建产物引用路径
This commit is contained in:
wenfp
2026-04-23 20:25:13 +08:00
parent d9d8100e4a
commit 0265cfe27c
4 changed files with 35 additions and 24 deletions
+13 -20
View File
@@ -5,14 +5,13 @@
<div>
<div class="name">
<span>{{ data.merit_name || data.nickname || data.user_info.nickname }}</span>
<!-- <span>{{data.user_info.region}}</span>-->
</div>
<p class="goods_name">{{ data.goods_name }}</p>
</div>
</div>
<div class="result">
<p class="money">已参与</p>
<span class="date">{{ data.paid_at }}</span>
<span class="date">{{ format(data.paid_at) }}</span>
</div>
</div>
</template>
@@ -26,6 +25,11 @@ export default {
avatar: "/touxiang.png",
};
},
methods: {
format(time) {
return time ? time.slice(0, 10) : "";
},
},
};
</script>
@@ -45,27 +49,16 @@ export default {
.name {
display: flex;
align-items: flex-end;
margin-bottom: 0.27rem;
span:first-child {
margin-bottom: 0.2rem;
font-size: 0.4rem;
color: #222;
vertical-align: top;
display: inline-block;
margin-right: 0.4rem;
line-height: 1.3;
}
span:last-child {
font-size: 0.32rem;
color: #666;
vertical-align: text-bottom;
display: inline-block;
}
}
p.goods_name {
font-size: 0.32rem;
max-width: 4rem;
font-size: 0.34rem;
max-width: 8rem;
line-height: 1.2;
overflow-x: hidden;
color: #666;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
@@ -82,7 +75,7 @@ export default {
font-weight: bold;
}
.date {
font-size: 0.3rem;
font-size: 0.34rem;
color: #888;
}
}
+18
View File
@@ -41,6 +41,7 @@
</div>
</div>
</div>
<div class="safe-inset-placeholder"></div>
<fixed-bottom ref="fixedBottom">
<div class="customer-absolute">
@@ -151,6 +152,9 @@ export default {
}
return (parseInt(this.priceUnit * 100, 10) * this.quantity) / 100;
},
safeInsetBottomHeight() {
return this.$store.state.safeInsetBottomHeight;
},
},
mounted() {
this.getGoodsDetail("common");
@@ -159,6 +163,15 @@ export default {
this.observer.disconnect();
},
methods: {
checkPlaceholderHeight() {
const el = document.querySelector(".safe-inset-placeholder");
const rect = el.getBoundingClientRect();
if (rect.height > 0) {
el.parentNode.removeChild(el);
} else {
el.style.height = "1rem";
}
},
initObserver() {
this.observer = new ObserverInteraction();
@@ -242,6 +255,7 @@ export default {
this.$nextTick(() => {
this.paddingBottom = this.$refs.fixedBottom.getOffsetHeight() - 50;
this.initObserver();
this.checkPlaceholderHeight();
});
this.wechatReady({
...this.data.shareConfig,
@@ -272,6 +286,10 @@ export default {
<style lang="scss">
$lightWidth: 1.3rem;
.goods-detail {
.safe-inset-placeholder {
padding-bottom: env(safe-area-inset-bottom);
padding-bottom: constant(safe-area-inset-bottom);
}
.goods-content {
padding-left: 0.3rem;
padding-right: 0.3rem;
+2 -2
View File
@@ -69,13 +69,13 @@
<div class="divider"></div>
<div class="panel temple-home-activity">
<div class="panel-head">
<span class="title">进展状态</span>
<span class="title">活动进展</span>
<arrow-more @click="onMoreProcess"></arrow-more>
</div>
<div class="panel-body goods-panel-body">
<buddha-process v-for="process in data.dynamic_data" :key="process.id" :data="process"></buddha-process>
<div class="process-more" @click="onMoreProcess">
<span>查看更多进展状态</span>
<span>查看更多活动进展</span>
<i class="iconfont icon-arrow-right"></i>
</div>
</div>
+1 -1
View File
File diff suppressed because one or more lines are too long