From db3870fdbd810ca968218968fdad87de6942cd37 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=90=B4=E6=98=8A=E5=A4=A9?= <442384644@qq.com> Date: Sat, 10 Oct 2026 11:23:19 +0800 Subject: [PATCH] =?UTF-8?q?fix(=E7=A7=BB=E5=8A=A8=E7=AB=AF):=20=E8=AE=A2?= =?UTF-8?q?=E5=8D=95=E8=BF=9B=E5=BA=A6=E6=9D=A1=E8=BF=9E=E7=BA=BF=E4=B8=8E?= =?UTF-8?q?=E8=8A=82=E7=82=B9=E6=96=87=E5=AD=97=E5=AF=B9=E9=BD=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 节点图标 flex:1 均分与文字行同轴,连线改绝对定位按 nth-child 对准相邻点中心; 自提 4 节点场景以 :has 规则修正(仅 H5 编译) --- .../components/order/detail/ProgressBar.vue | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/frontend/uni-app/src/dynamic-pages/components/order/detail/ProgressBar.vue b/frontend/uni-app/src/dynamic-pages/components/order/detail/ProgressBar.vue index 163dfda2b..21f08018a 100644 --- a/frontend/uni-app/src/dynamic-pages/components/order/detail/ProgressBar.vue +++ b/frontend/uni-app/src/dynamic-pages/components/order/detail/ProgressBar.vue @@ -68,9 +68,22 @@ const nodes = computed(() => p.value.nodes || []); .navCon { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20rpx; } .navCon > view { font-size: 24rpx; color: #999; text-align: center; flex: 1; } .navCon > view.on { color: var(--view-theme, #e93323); font-weight: 500; } -.progress { display: flex; justify-content: space-between; align-items: center; } +.progress { display: flex; justify-content: space-between; align-items: center; position: relative; } +.progress > .iconfont { flex: 1; text-align: center; position: relative; z-index: 2; } .iconfont { font-size: 32rpx; color: #ddd; } .iconfont.font-num { color: var(--view-theme, #e93323); } -.line { flex: 1; height: 4rpx; background: #ddd; margin: 0 8rpx; } +/* 连线为覆盖段:从上一个点中心连到下一个点中心(两端各留约 2% 间隙)。 + 点与文字同用 flex:1 均分格,5 节点时点中心在 10/30/50/70/90%,与 navCon 文字对齐 */ +.line { position: absolute; top: 50%; margin: -2rpx 0 0 0; height: 4rpx; background: #ddd; } .line.bg-color { background: var(--view-theme, #e93323); } +.line:nth-child(2) { left: 12%; width: 16%; } +.line:nth-child(4) { left: 32%; width: 16%; } +.line:nth-child(6) { left: 52%; width: 16%; } +.line:nth-child(8) { left: 72%; width: 16%; } +/* #ifdef H5 */ +/* 到店自提为 4 节点:点中心在 12.5/37.5/62.5/87.5% */ +.progress:not(:has(.line:nth-child(8))) .line:nth-child(2) { left: 14.5%; width: 21%; } +.progress:not(:has(.line:nth-child(8))) .line:nth-child(4) { left: 39.5%; width: 21%; } +.progress:not(:has(.line:nth-child(8))) .line:nth-child(6) { left: 64.5%; width: 21%; } +/* #endif */