From 6e250d7e0d8345f3c685988015f559d9a0a5ed02 Mon Sep 17 00:00:00 2001
From: wangfukang <15630117759@163.com>
Date: Mon, 11 May 2026 15:22:08 +0800
Subject: [PATCH] 1
---
pages/index/index.vue | 173 +++++++++++++++++++++++++++++++++---------
1 file changed, 136 insertions(+), 37 deletions(-)
diff --git a/pages/index/index.vue b/pages/index/index.vue
index d8cdf09..0e89ac7 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -22,7 +22,7 @@
![]()
-
+
@@ -281,7 +281,7 @@
+ :style="{'background':checkYongjin==true?'linear-gradient(135deg, rgba(255, 247, 215, 0.95), rgba(166, 255, 234, 0.72))':'rgba(248, 255, 250, 0.86)','border':checkYongjin==true?'1px solid rgba(255, 188, 119, 0.72)':'1px solid rgba(166, 255, 234, 0.46)'}">
佣金
@@ -1309,7 +1309,7 @@
width: 100%;
height: 100%;
font-size: 28rpx;
- background: #F5F8F5;
+ background: linear-gradient(180deg, #f2fff8 0%, #fffdf4 32%, #f7fbf6 100%);
color: #00231C;
}
@@ -1317,6 +1317,9 @@
width: 100%;
height: 100%;
font-size: 28rpx;
+ background:
+ radial-gradient(circle at 12% 12%, rgba(166, 255, 234, 0.34) 0, rgba(166, 255, 234, 0) 240rpx),
+ radial-gradient(circle at 90% 36%, rgba(255, 216, 168, 0.26) 0, rgba(255, 216, 168, 0) 260rpx);
}
.swiper-container {
@@ -1342,22 +1345,42 @@
z-index: 99 !important;
}
+ .order-notice-wrap {
+ background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(250, 255, 250, 0.72) 100%);
+ position: relative;
+ }
+
.order-msg-box {
width: 95%;
height: 146rpx;
- border-radius: 40rpx;
- border: 4rpx solid #A6FFEA;
- background: #fff;
+ border-radius: 36rpx;
+ border: 1px solid rgba(166, 255, 234, 0.86);
+ background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(242, 255, 250, 0.96) 100%);
+ box-shadow: 0 18rpx 36rpx rgba(0, 35, 28, 0.08);
z-index: 99;
position: absolute;
left: 2.5%;
bottom: 0;
display: flex;
+ overflow: hidden;
+ }
+
+ .order-msg-box::after {
+ content: '';
+ width: 180rpx;
+ height: 180rpx;
+ border-radius: 50%;
+ background: rgba(255, 216, 168, 0.22);
+ position: absolute;
+ right: -72rpx;
+ top: -96rpx;
}
.order-msg-left {
width: 20%;
height: 100%;
+ position: relative;
+ z-index: 1;
}
.order-msg-left img {
@@ -1372,11 +1395,15 @@
display: flex;
flex-direction: column;
padding-left: 5%;
+ position: relative;
+ z-index: 1;
}
.order-msg-right {
width: 30%;
height: 100%;
+ position: relative;
+ z-index: 1;
}
.order-msg-right img {
@@ -1454,37 +1481,72 @@
}
.menu-box {
- width: 100%;
- height: 160rpx;
+ width: 95%;
+ height: 172rpx;
display: flex;
- margin-top: 40rpx;
- background: #F5F8F5;
+ align-items: center;
+ margin: 30rpx auto 0;
+ padding: 14rpx 10rpx;
+ box-sizing: border-box;
+ border-radius: 38rpx;
+ border: 1px solid rgba(255, 255, 255, 0.9);
+ background: linear-gradient(135deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 250, 235, 0.92) 48%, rgba(239, 255, 248, 0.96) 100%);
+ box-shadow: 0 18rpx 42rpx rgba(0, 35, 28, 0.07);
position: relative;
- z-index: 99
+ z-index: 99;
+ overflow: hidden;
+ }
+
+ .menu-box::after {
+ content: '';
+ width: 210rpx;
+ height: 210rpx;
+ border-radius: 50%;
+ background: rgba(166, 255, 234, 0.28);
+ position: absolute;
+ right: -92rpx;
+ top: -122rpx;
}
.menu-list {
flex: 1;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ position: relative;
+ z-index: 1;
+ border-radius: 28rpx;
+ transition: transform 0.2s cubic-bezier(0.2, 0.9, 0.3, 1.2), background 0.2s ease;
+ }
+
+ .menu-list:active {
+ background: rgba(255, 255, 255, 0.72);
+ transform: translateY(-4rpx) scale(0.96);
}
.menu-list img {
- width: 70%;
- height: 70%;
+ width: 82rpx;
+ height: 82rpx;
display: block;
margin: 0 auto;
+ filter: drop-shadow(0 10rpx 14rpx rgba(0, 35, 28, 0.08));
}
.menu-name {
text-align: center;
font-size: 24rpx;
- font-weight: 700;
- margin-top: 15rpx;
+ font-weight: 800;
+ margin-top: 12rpx;
+ color: #40534d;
+ line-height: 30rpx;
}
.like-box,
.daimai-box {
width: 95%;
- margin: 20rpx auto;
+ margin: 24rpx auto;
}
.daimai-tab {
@@ -1636,6 +1698,7 @@
.like-title {
width: 218rpx;
height: 64rpx;
+ filter: drop-shadow(0 8rpx 10rpx rgba(0, 35, 28, 0.06));
}
.like-title img {
@@ -1650,14 +1713,20 @@
background-size: 100%;
margin-top: 20rpx;
display: flex;
+ border-radius: 34rpx;
+ overflow: hidden;
+ box-shadow: 0 18rpx 42rpx rgba(81, 139, 91, 0.1);
}
.like-left {
width: 45%;
- background: #fff;
- border-radius: 20rpx;
+ background: rgba(255, 255, 255, 0.92);
+ border: 1px solid rgba(255, 255, 255, 0.86);
+ border-radius: 26rpx;
height: 340rpx;
margin: 50rpx 0 0 3.3%;
+ box-shadow: 0 12rpx 28rpx rgba(0, 35, 28, 0.05);
+ overflow: hidden;
}
.like-content-title {
@@ -1676,6 +1745,11 @@
.content-list {
display: flex;
margin-bottom: 10rpx;
+ transition: transform 0.18s ease;
+ }
+
+ .content-list:active {
+ transform: scale(0.98);
}
.list-img {
@@ -1688,6 +1762,7 @@
.list-img img {
width: 100%;
height: 100%;
+ border-radius: 14rpx;
}
.list-product {
@@ -1704,12 +1779,13 @@
display: inline;
font-size: 18rpx;
padding: 4rpx 6rpx;
- background: #A6FFEA;
- border-radius: 5rpx;
+ background: linear-gradient(135deg, #a6ffea 0%, #fff2c6 100%);
+ border-radius: 10rpx;
position: absolute;
top: 10rpx;
left: 10rpx;
font-weight: 700;
+ box-shadow: 0 4rpx 10rpx rgba(0, 35, 28, 0.08);
}
.list-text {
@@ -1732,22 +1808,25 @@
.list-1 {
width: 98%;
max-height: 640rpx;
- background: #fff;
- border-radius: 20rpx;
- margin: 20rpx auto 0;
+ background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(253, 255, 250, 0.96) 100%);
+ border: 1px solid rgba(255, 255, 255, 0.86);
+ border-radius: 34rpx;
+ margin: 22rpx auto 0;
overflow: hidden;
+ box-shadow: 0 16rpx 38rpx rgba(0, 35, 28, 0.07);
}
.daoda-time {
width: 242rpx;
height: 48rpx;
font-size: 24rpx;
- padding-left: 10rpx;
+ padding-left: 14rpx;
font-weight: 700;
- border-radius: 10rpx;
+ border-radius: 14rpx;
line-height: 48rpx;
text-align: left;
- background: rgba(166, 255, 234, 0.3);
+ background: rgba(166, 255, 234, 0.42);
+ color: #125e50;
margin: 20rpx 0 20rpx 20rpx;
}
@@ -1778,8 +1857,10 @@
width: 95%;
position: relative;
height: 200rpx;
- border-radius: 40rpx;
- border: 1px solid #A6FFEA;
+ border-radius: 32rpx;
+ border: 1px solid rgba(166, 255, 234, 0.78);
+ background: rgba(255, 255, 255, 0.74);
+ box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7);
margin: 0 auto;
}
@@ -1862,12 +1943,15 @@
flex: 1;
height: 50rpx;
line-height: 50rpx;
+ color: #40534d;
}
.qu-left {
width: 80%;
padding-left: 10rpx;
overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
}
.qu-right {
@@ -1884,12 +1968,18 @@
line-height: 50rpx;
width: 95%;
margin: 20rpx auto;
+ color: #40534d;
}
.qiangdan-btn {
width: 95%;
height: 100rpx;
margin: 20rpx auto;
+ transition: transform 0.18s ease;
+
+ &:active {
+ transform: scale(0.97);
+ }
img {
width: 100%;
@@ -1973,8 +2063,10 @@
position: sticky;
top: 0;
z-index: 90;
- background: #fff;
- padding-top: 20rpx;
+ background: rgba(255, 255, 255, 0.96);
+ padding: 20rpx 10rpx 0;
+ box-sizing: border-box;
+ box-shadow: 0 12rpx 26rpx rgba(0, 35, 28, 0.05);
}
.sort-text {
@@ -1983,17 +2075,23 @@
position: sticky;
top: 0;
z-index: 90;
- background: #fff;
+ background: rgba(255, 255, 255, 0.96);
+ padding: 0 10rpx 4rpx;
+ box-sizing: border-box;
}
.sort-member {
height: 60rpx;
line-height: 60rpx;
text-align: center;
- background: rgba(247, 248, 248, 0.6);
+ background: rgba(248, 255, 250, 0.86);
width: 24%;
margin-right: 4%;
- border-radius: 10rpx;
+ border: 1px solid rgba(166, 255, 234, 0.46);
+ border-radius: 24rpx;
+ color: #40534d;
+ font-weight: 700;
+ box-shadow: 0 8rpx 18rpx rgba(0, 35, 28, 0.04);
}
.sort-value {
@@ -2001,13 +2099,14 @@
height: auto;
max-height: 300rpx;
overflow: scroll;
- background: rgba(0, 0, 0, 0.7);
+ background: rgba(0, 35, 28, 0.82);
position: absolute;
top: 145rpx;
right: 0;
- border-radius: 20rpx;
+ border-radius: 24rpx;
color: #fff;
font-size: 22rpx;
+ box-shadow: 0 16rpx 34rpx rgba(0, 35, 28, 0.16);
}
.sort-value1 {
@@ -2022,7 +2121,7 @@
.qusong1 {
width: 40rpx;
height: 40rpx;
- background: rgba(0, 35, 28, 1);
+ background: linear-gradient(135deg, #0d4d42 0%, #38d9b8 100%);
color: #fff;
border-radius: 40rpx;
text-align: center;
@@ -2036,7 +2135,7 @@
font-size: 24rpx;
line-height: 38rpx;
text-align: center;
- background: rgba(166, 255, 234, 0.5);
+ background: rgba(166, 255, 234, 0.62);
padding: 0 20rpx;
margin-left: -10rpx;
font-weight: 700;