From e6e969ad460293d3e14ca5ed89fd3b1df82e37c3 Mon Sep 17 00:00:00 2001
From: zxl <763096477@qq.com>
Date: 星期四, 15 一月 2026 10:45:54 +0800
Subject: [PATCH] 页面调整优化
---
pages/kitchen/KitchenCustomize.vue | 20 +++++++++++++-------
1 files changed, 13 insertions(+), 7 deletions(-)
diff --git a/pages/kitchen/KitchenCustomize.vue b/pages/kitchen/KitchenCustomize.vue
index b1a4701..76bd733 100644
--- a/pages/kitchen/KitchenCustomize.vue
+++ b/pages/kitchen/KitchenCustomize.vue
@@ -9,7 +9,7 @@
<scroll-view class="tags-scroll" scroll-x="true" :show-scrollbar="false">
<view class="tags">
<view v-for="tag in tags" :key="tag.value" class="tag" :class="{ active: tag.selected }"
- @click="toggleTag(tag)">
+ :style="{ width: tags.length <= 4 ? (100 / tags.length) + '%' : '25%' }" @click="toggleTag(tag)">
<text>{{ tag.label }}</text>
</view>
</view>
@@ -27,7 +27,7 @@
<view class="product-info">
<view class="product-remark">{{ item.remark }}</view>
<view class="product-bottom">
- <view class="product-orign-price">
+ <view class="product-orign-price" v-if="item.orginPrice > item.price">
<text class="symbol">鍘熶环锟�</text>
<text class="value">{{ item.orginPrice }}</text>
</view>
@@ -218,7 +218,7 @@
}
.content {
- padding: 24rpx;
+ padding: 0 24rpx 0 24rpx;
}
.tags-scroll {
@@ -230,11 +230,12 @@
display: flex;
flex-wrap: nowrap;
padding: 10rpx 0;
+ width: 100%;
}
.tag {
height: 80rpx;
- display: inline-flex;
+ display: flex;
align-items: center;
justify-content: center;
font-size: 30rpx;
@@ -244,6 +245,7 @@
background-color: #f7f7f7;
white-space: nowrap;
flex-shrink: 0;
+ box-sizing: border-box;
}
.tag.active {
@@ -275,16 +277,15 @@
.product-info {
flex: 1;
- margin-left: 20rpx;
display: flex;
- align-items: center;
+ align-items: flex-end;
justify-content: space-between;
overflow: hidden; // 纭繚瀛愬厓绱犳孩鍑洪殣钘�
+ margin-top: 10rpx;
}
.product-top {
flex: 1;
- margin-left: 20rpx;
display: flex;
// flex-direction: column;
// justify-content: space-between;
@@ -333,14 +334,19 @@
.product-price {
color: #ff573e;
+ display: flex;
+ align-items: flex-end;
.symbol {
font-size: 24rpx;
+ line-height: 1.2; // 绋嶅井璋冩暣琛岄珮浠ュ榻�
+ margin-bottom: 6rpx; // 绗﹀彿閫氬父杈冨皬锛屾墜鍔ㄥ井璋冧娇鍏剁湅璧锋潵鏇磋创鍚堝簳閮�
}
.value {
font-size: 50rpx;
font-weight: bold;
+ line-height: 1;
}
}
--
Gitblit v1.8.0