From 2f7e097e6c0d438baea99cd847156fdec8392bfe Mon Sep 17 00:00:00 2001 From: huangzhenbao <17818024429@163.com> Date: Thu, 14 May 2026 17:30:19 +0800 Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E6=9C=8D=E5=8A=A1=E9=A1=B5UI?= =?UTF-8?q?=E5=85=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/home/JdLikeHomeHeader.uvue | 85 ++++++++++++++++----------- pages/main/index.uvue | 10 ++-- 2 files changed, 58 insertions(+), 37 deletions(-) diff --git a/components/home/JdLikeHomeHeader.uvue b/components/home/JdLikeHomeHeader.uvue index 28253beb..b06ebaea 100644 --- a/components/home/JdLikeHomeHeader.uvue +++ b/components/home/JdLikeHomeHeader.uvue @@ -12,19 +12,21 @@ - + - ⌕ - + + ⌕ + + 搜索 @@ -127,28 +129,29 @@ function handleSearch() { .jd2-module-row { flex-direction: row; - align-items: flex-end; - padding-left: 24rpx; + align-items: center; + padding-left: 20rpx; padding-right: 24rpx; - height: 78rpx; + height: 62rpx; gap: 36rpx; + box-sizing: border-box; } .jd2-module-item { align-items: center; - justify-content: flex-end; - height: 78rpx; + justify-content: center; + height: 62rpx; } .jd2-module-text { - font-size: 30rpx; + font-size: 32rpx; font-weight: 400; color: #222222; - line-height: 40rpx; + line-height: 42rpx; } .jd2-module-text-active { - font-size: 34rpx; + font-size: 36rpx; font-weight: 700; color: #e2231a; } @@ -162,25 +165,40 @@ function handleSearch() { } .jd2-search-wrap { - padding-left: 24rpx; - padding-right: 24rpx; - padding-bottom: 10rpx; + width: 100%; + margin-top: 18rpx; + padding-left: 16rpx; + padding-right: 16rpx; + box-sizing: border-box; } .jd2-search-box { + width: 100%; height: 68rpx; border-width: 2rpx; border-style: solid; border-color: #ff2d2f; - border-radius: 14rpx; + border-radius: 12rpx; background: #ffffff; flex-direction: row; align-items: center; overflow: hidden; + box-sizing: border-box; +} + +.jd2-search-input-wrap { + flex: 1; + min-width: 0; + height: 100%; + flex-direction: row; + align-items: center; + padding-left: 18rpx; + padding-right: 18rpx; + box-sizing: border-box; } .jd2-search-icon { - width: 52rpx; + width: 40rpx; text-align: center; font-size: 28rpx; color: #999999; @@ -189,21 +207,21 @@ function handleSearch() { .jd2-search-input { flex: 1; height: 68rpx; - font-size: 26rpx; + font-size: 28rpx; color: #222222; - padding-right: 12rpx; + min-width: 0; } .jd2-search-btn { - width: 100rpx; - height: 68rpx; + width: 104rpx; + height: 100%; align-items: center; justify-content: center; background: #ff2d2f; } .jd2-search-btn-text { - font-size: 28rpx; + font-size: 30rpx; font-weight: 700; color: #ffffff; } @@ -211,8 +229,9 @@ function handleSearch() { .jd2-category-scroll { height: 56rpx; white-space: nowrap; - padding-left: 24rpx; - padding-right: 24rpx; + margin-top: 12rpx; + padding-left: 16rpx; + padding-right: 16rpx; box-sizing: border-box; } @@ -229,7 +248,7 @@ function handleSearch() { } .jd2-category-text { - font-size: 26rpx; + font-size: 28rpx; color: #444444; } diff --git a/pages/main/index.uvue b/pages/main/index.uvue index e6ac2b2f..9f49f339 100644 --- a/pages/main/index.uvue +++ b/pages/main/index.uvue @@ -1281,8 +1281,10 @@ const initPage = () => { const systemInfo = uni.getSystemInfoSync() statusBarHeight.value = systemInfo.statusBarHeight != null ? systemInfo.statusBarHeight : 20 const searchContentHeight = Math.round(68 * systemInfo.screenWidth / 750) - const searchRowVerticalPadding = Math.round(18 * systemInfo.screenWidth / 750) - const moduleRowHeight = Math.round(78 * systemInfo.screenWidth / 750) + const searchTopGap = Math.round(14 * systemInfo.screenWidth / 750) + const categoryTopGap = Math.round(12 * systemInfo.screenWidth / 750) + const headerBottomPadding = Math.round(10 * systemInfo.screenWidth / 750) + const moduleRowHeight = Math.round(62 * systemInfo.screenWidth / 750) const categoryRowHeight = Math.round(56 * systemInfo.screenWidth / 750) let menuInfo: CapsuleButtonInfo | null = null @@ -1302,13 +1304,13 @@ const initPage = () => { // 计算右边距避让 const rightReserve = systemInfo.screenWidth - menuInfo.left + 8 navBarRight.value = rightReserve - const searchRowTotalH = statusBarHeight.value + Math.max(navHeight, moduleRowHeight) + searchContentHeight + searchRowVerticalPadding + categoryRowHeight + Math.round(18 * systemInfo.screenWidth / 750) + const searchRowTotalH = statusBarHeight.value + Math.max(navHeight, moduleRowHeight) + searchTopGap + searchContentHeight + categoryTopGap + categoryRowHeight + headerBottomPadding searchRowStyle.value = `padding-top:${statusBarHeight.value}px;height:${searchRowTotalH}px;padding-right:${rightReserve}px;` navbarTotalHeight.value = searchRowTotalH } else { navBarHeight.value = 44 navBarRight.value = 0 - const searchRowTotalH = statusBarHeight.value + Math.max(44, moduleRowHeight) + searchContentHeight + searchRowVerticalPadding + categoryRowHeight + Math.round(18 * systemInfo.screenWidth / 750) + const searchRowTotalH = statusBarHeight.value + Math.max(44, moduleRowHeight) + searchTopGap + searchContentHeight + categoryTopGap + categoryRowHeight + headerBottomPadding searchRowStyle.value = `padding-top:${statusBarHeight.value}px;height:${searchRowTotalH}px;` navbarTotalHeight.value = searchRowTotalH }