diff --git a/components/couponList/couponList.vue b/components/couponList/couponList.vue
index 0db611d..21d1ee4 100644
--- a/components/couponList/couponList.vue
+++ b/components/couponList/couponList.vue
@@ -2,45 +2,23 @@
 	<scroll-view scroll-y="true" :style="{height: height}" @scrolltolower="moreCoupon()">
 		<!-- 优惠券列表 -->
 		<view class="list">
-			<view class="item" v-for="item in couponList" @click="select(item)" :key="item.id"
-				:class="['status-' + item.state]">
-				<image src="@/pages_order/static/coupon/coupon-bg.png" mode="widthFix" class="coupon-bg"></image>
-
-				<view class="item-con">
-					<view class="price-time">
-						<view class="price">
-							<view class="num">
-								<view class="icon">
-									￥
-								</view>
-								{{ item.money }}
-							</view>
-						</view>
-
-						<view class="date-tiao">
-							<view class="time">
-								限{{ formatDate(item.stateTime) }} - {{ formatDate(item.endTime) }}
-							</view>
-							<view class="tiao">
-								满{{ item.useMoney }}可用
-							</view>
-						</view>
-					</view>
-
-					<view class="status">
-						<view class="order-status">
-							<image src="@/pages_order/static/coupon/status.png" mode="widthFix" class="status-img">
-							</image>
-							<view class="text">
-								{{ status[item.state] }}
-							</view>
-						</view>
-
-						<!-- <view class="surplus">
-							剩余28天过期
-						</view> -->
-					</view>
-				</view>
+			<view class="list-item" v-for="item in couponList" @click="select(item)" :key="item.id">
+				
+				<!-- 已领取 -->
+				<template v-if="item.state === 0">
+					<image class="list-item-bg" src="@/pages_order/static/coupon/coupon-bg-useful.png" ></image>
+				</template>
+				<!-- 已使用 -->
+				<template v-else-if="item.state === 1">
+					<image class="list-item-bg" src="@/pages_order/static/coupon/coupon-bg-used.png" ></image>
+				</template>
+				<!-- 已过期 -->
+				<template v-else-if="item.state === 2">
+					<image class="list-item-bg" src="@/pages_order/static/coupon/coupon-bg-overtime.png" ></image>
+				</template>
+
+				<text class="list-item-count">{{ item.money }}</text>
+				<text class="list-item-deadline">{{ `有效期至${item.endTime}` }}</text>
 			</view>
 		</view>
 
@@ -69,6 +47,26 @@
 
 			//获取优惠券列表
 			getCouponList() {
+				// todo: delte test data
+
+				this.couponList = [
+					{
+						state: 0,
+						money: 40,
+						endTime: '2025-06-12',
+					},
+					{
+						state: 1,
+						money: 40,
+						endTime: '2025-06-12',
+					},
+					{
+						state: 2,
+						money: 40,
+						endTime: '2025-06-12',
+					},
+				]
+				return
 				let requestData = {
 					...this.queryParams,
 					state: this.state ? this.state : 0
@@ -120,147 +118,35 @@
 
 <style lang="scss" scoped>
 	.list {
+		padding: 32rpx 50rpx;
 
-		.item {
-			color: #FDDFCD;
+		&-item {
+			width: 100%;
+			height: 211rpx;
 			position: relative;
-			width: calc(100% - 40rpx);
-			height: 220rpx;
-			background-size: 100% 100%;
-			margin: 20rpx;
-			box-sizing: border-box;
-			padding: 30rpx;
 
-			.coupon-bg {
+			&-bg {
 				width: 100%;
-				position: absolute;
-				left: 0rpx;
-				top: 0rpx;
+				height: 100%;
 			}
 
-			.item-con {
-				display: flex;
-				align-items: center;
-				flex-wrap: wrap;
+			&-count {
 				position: absolute;
-				top: 50%;
-				left: 0rpx;
-				transform: translateY(-50%);
-				z-index: 99;
-				width: 100%;
-
-				.price-time {
-					display: flex;
-					width: 65%;
-
-					.price {
-						display: flex;
-						align-items: center;
-
-						.num {
-							color: #FFF8E9;
-							font-weight: 900;
-							font-size: 70rpx;
-							display: flex;
-							align-items: flex-end;
-
-							.icon {
-								color: #FFF8E9;
-								width: 30rpx;
-								height: 30rpx;
-								display: flex;
-								justify-content: center;
-								align-items: center;
-								font-size: 20rpx;
-								border-radius: 14rpx;
-								margin-bottom: 14rpx;
-								margin-right: 10rpx;
-							}
-						}
-					}
-
-					.date-tiao {
-						display: flex;
-						flex-direction: column;
-						align-items: center;
-						font-size: 24rpx;
-						box-sizing: border-box;
-						padding-left: 20rpx;
-
-						.time {}
-
-						.tiao {
-							display: flex;
-							justify-content: center;
-							background: #FDE5BA;
-							border-radius: 40rpx;
-							color: #FF2E34;
-							padding: 5rpx 20rpx;
-							margin-top: 15rpx;
-						}
-					}
-				}
-
-				.status {
-					display: flex;
-					flex-direction: column;
-					align-items: center;
-					justify-content: center;
-					width: 35%;
-					color: #FD4231;
-					padding-top: 30rpx;
-
-					.order-status {
-						position: relative;
-						width: 180rpx;
-
-						.status-img {
-							position: absolute;
-							left: 0;
-							width: 100%;
-						}
-
-						.text {
-							height: 90rpx;
-							display: flex;
-							justify-content: center;
-							align-items: center;
-							position: relative;
-							z-index: 100;
-							font-size: 34rpx;
-							font-weight: bold;
-						}
-					}
-
-					.surplus {
-						font-size: 22rpx;
-						text-align: center;
-						margin-top: 10rpx;
-					}
-				}
+				top: 40rpx;
+				left: 48rpx;
+				color: $uni-color-light;
+				font-size: 78rpx;
+				font-weight: 900;
+				line-height: 110rpx;
 			}
-		}
 
-		.status-0 {
-			opacity: 1;
-		}
-
-		.status-1 {
-			opacity: .9;
-		}
-
-		.status-2 {
-			opacity: .6;
-		}
-
-		.del {
-			position: absolute;
-			top: 0;
-			left: 0;
-			width: 100%;
-			height: 100%;
-			background-color: #ffffff99;
-			z-index: 99;
+			&-deadline {
+				position: absolute;
+				bottom: 58rpx;
+				left: 156rpx;
+				color: $uni-color-light;
+				font-size: 22rpx;
+			}
 		}
 	}
 </style>
\ No newline at end of file
diff --git a/pages.json b/pages.json
index 80c1151..259d95b 100644
--- a/pages.json
+++ b/pages.json
@@ -73,6 +73,15 @@
 			{
 				"path": "mine/withdraw"
 			},
+			{
+				"path": "mine/runningWater"
+			},
+			{
+				"path": "mine/promotion"
+			},
+			{
+				"path": "mine/coupon"
+			},
 			{
 				"path": "mine/verifyRecord"
 			},
@@ -82,9 +91,6 @@
 			{
 				"path": "mine/purse"
 			},
-			{
-				"path": "mine/runningWater"
-			},
 			{
 				"path": "mine/address"
 			},
@@ -118,9 +124,6 @@
 			{
 				"path": "mine/recharge"
 			},
-			{
-				"path": "mine/promotion"
-			},
 			{
 				"path": "home/notice"
 			},
@@ -136,9 +139,6 @@
 			{
 				"path": "mine/moreCommodity"
 			},
-			{
-				"path": "mine/coupon"
-			},
 			{
 				"path": "mine/updateUser"
 			},
diff --git a/pages/index/center.vue b/pages/index/center.vue
index 110035e..a868c79 100644
--- a/pages/index/center.vue
+++ b/pages/index/center.vue
@@ -98,13 +98,11 @@
 					<image class="fun-common-icon" src="@/static/image/center/icon-team.png" mode="widthFix"></image>
 					<text class="fun-common-label">我的团队</text>
 				</view>
-				<!-- todo: navigateTo -->
 				<view class="flex flex-column" @click="$utils.navigateTo('/pages_order/mine/promotion')">
 					<image class="fun-common-icon" src="@/static/image/center/icon-invite.png" mode="widthFix"></image>
 					<text class="fun-common-label">邀请好友</text>
 				</view>
-				<!-- todo: navigateTo -->
-				<view class="flex flex-column" @click="$utils.navigateTo('/pages_order/mine/memberCenter')">
+				<view class="flex flex-column" @click="$utils.navigateTo('/pages_order/mine/coupon')">
 					<image class="fun-common-icon" src="@/static/image/center/icon-coupon.png" mode="widthFix"></image>
 					<text class="fun-common-label">优惠券</text>
 				</view>
diff --git a/pages_order/mine/coupon.vue b/pages_order/mine/coupon.vue
index 4f33ee5..811becf 100644
--- a/pages_order/mine/coupon.vue
+++ b/pages_order/mine/coupon.vue
@@ -1,12 +1,35 @@
 <template>
-	<view class="coupon">
+	<view class="page">
 		<!-- 导航栏 -->
-		<navbar title="优惠券" leftClick @leftClick="$utils.navigateBack" bgColor="#E3441A" color="#fff" />
+		<navbar title="优惠券" leftClick @leftClick="$utils.navigateBack" color="#fff" />
 
 		<!-- 优惠券筛选 -->
 		<view class="tabs">
-			<uv-tabs :list="filtrationMenu" @click="hadleFiltrationMenuEvent" lineColor="#E3441A"
-				:activeStyle="{ color : '#E3441A' }"></uv-tabs>
+			<uv-tabs 
+				:list="filtrationMenu" 
+				@click="hadleFiltrationMenuEvent" 
+				:customStyle="{
+					backgroundColor: '#FFFFFF',
+				}"
+				:activeStyle="{
+					color: '#84A73F',
+					fontSize: '28rpx',
+					whiteSpace: 'nowrap',
+					paddingTop: '29rpx',
+					paddingBottom: '21rpx',
+				}"
+				:inactiveStyle="{
+					color: '#000000',
+					fontSize: '28rpx',
+					whiteSpace: 'nowrap',
+					paddingTop: '29rpx',
+					paddingBottom: '21rpx',
+				}"
+				lineHeight="5rpx" 
+				lineWidth="92rpx" 
+				lineColor="linear-gradient(to right, #84A73F, #D8FF8F)"
+				:scrollable="false"
+			></uv-tabs>
 		</view>
 
 		<couponList ref="couponList" :list="list" :state="state"></couponList>
@@ -99,16 +122,33 @@
 </script>
 
 <style scoped lang="scss">
-	// 优惠券筛选
-	.tabs {
-		&::v-deep .uv-tabs__wrapper__nav {
-			background: white;
 
-			.uv-tabs__wrapper__nav__item {
-				width: 33.33%;
-				text-align: center;
-				box-sizing: border-box;
-			}
+	.page {
+		background-color: $uni-bg-color;
+		min-height: 100vh;
+				
+		/deep/ .nav-bar__view {
+			background-image: linear-gradient(#84A73F, #D8FF8F);
+		}
+	}
+	
+
+	.tabs {
+		/deep/ .uv-tabs__wrapper__nav__line {
+			bottom: 0;
 		}
 	}
+
+	// // 优惠券筛选
+	// .tabs {
+	// 	&::v-deep .uv-tabs__wrapper__nav {
+	// 		background: white;
+
+	// 		.uv-tabs__wrapper__nav__item {
+	// 			width: 33.33%;
+	// 			text-align: center;
+	// 			box-sizing: border-box;
+	// 		}
+	// 	}
+	// }
 </style>
\ No newline at end of file
diff --git a/pages_order/static/coupon/coupon-bg-overtime.png b/pages_order/static/coupon/coupon-bg-overtime.png
new file mode 100644
index 0000000..3dc69e3
Binary files /dev/null and b/pages_order/static/coupon/coupon-bg-overtime.png differ
diff --git a/pages_order/static/coupon/coupon-bg-used.png b/pages_order/static/coupon/coupon-bg-used.png
new file mode 100644
index 0000000..d6a0d9d
Binary files /dev/null and b/pages_order/static/coupon/coupon-bg-used.png differ
diff --git a/pages_order/static/coupon/coupon-bg-useful.png b/pages_order/static/coupon/coupon-bg-useful.png
new file mode 100644
index 0000000..e2b3f2f
Binary files /dev/null and b/pages_order/static/coupon/coupon-bg-useful.png differ