红娘工作台系统通知

LiangZhiYUMao/pages/matchmaker-workbench/message.vue

@@ -628,7 +628,8 @@
 <style lang="scss" scoped>
 	.matchmaker-message {
 		min-height: 100vh;
-		background: #FFF9F9;
+		/* 顶部淡粉，中部淡紫，越到底部越接近白色 */
+		background: linear-gradient(180deg, #fff1f7 0%, #f6ebff 45%, #fbf7ff 75%, #ffffff 100%);
 		display: flex;
 		flex-direction: column;
 	}
@@ -640,8 +641,8 @@
 		justify-content: space-between;
 		padding: 25rpx 30rpx;
 		padding-top: calc(25rpx + env(safe-area-inset-top));
-		background: #FFF9F9;
-		border-bottom: 1rpx solid #F0F0F0;
+		background: transparent;
+		border-bottom-width: 0;
 
 		.back-btn {
 			width: 70rpx;
@@ -670,62 +671,63 @@
 
 	.content {
 		flex: 1;
-		padding: 20rpx 20rpx 120rpx;
+		padding: 20rpx 24rpx 140rpx;
+		box-sizing: border-box;
 	}
 
 	/* 消息项 */
 	.message-item {
-		background: #FFFFFF;
-		border-radius: 20rpx;
-		padding: 25rpx;
+		background: #ffffff;
+		border-radius: 24rpx;
+		padding: 28rpx;
 		margin-bottom: 20rpx;
-		box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+		box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.05);
 		position: relative;
 
 		&.system-notification {
-			background: linear-gradient(135deg, #FFEBEE 0%, #FFCDD2 100%);
-			border: 2rpx solid #F8BBD0;
-
-			&.active {
-				border-color: #E91E63;
-			}
+			background: #ffffff;
+			border-radius: 28rpx;
+			border: 2rpx solid rgba(255, 128, 171, 0.85);
+			box-shadow: 0 10rpx 26rpx rgba(255, 128, 171, 0.28);
+			padding: 26rpx 30rpx;
 
 			.message-type {
 				display: block;
 				font-size: 32rpx;
-				font-weight: bold;
+				font-weight: 600;
 				color: #333;
-				margin-bottom: 15rpx;
+				margin-bottom: 12rpx;
 			}
 
 			.message-time {
-				display: block;
+				position: absolute;
+				top: 26rpx;
+				right: 30rpx;
 				font-size: 24rpx;
-				color: #999;
-				margin-bottom: 15rpx;
-				text-align: right;
+				color: #b88bb0;
 			}
 
 			.message-content {
 				display: block;
-				font-size: 28rpx;
-				color: #333;
-				line-height: 1.5;
-				margin-bottom: 15rpx;
+				font-size: 26rpx;
+				color: #555;
+				line-height: 1.6;
+				margin-bottom: 12rpx;
 			}
 
 			.message-footer {
 				display: block;
 				font-size: 24rpx;
-				color: #666;
+				color: #b27aa0;
 				line-height: 1.4;
 			}
 		}
 
 		&.match-success {
 			display: flex;
-			background: linear-gradient(135deg, #F3E5F5 0%, #E1BEE7 100%);
-			border: 2rpx solid #D1C4E9;
+			background: linear-gradient(135deg, #f8f3ff 0%, #f4e6ff 45%, #ffeaf7 100%);
+			border: 0;
+			box-shadow: 0 8rpx 20rpx rgba(186, 104, 200, 0.25);
 
 			.message-icon {
 				width: 60rpx;
@@ -738,8 +740,8 @@
 			}
 
 			.message-icon.heart {
-				background-color: #F8BBD0;
-				background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23E91E63"><path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/></svg>');
+				background-color: #f8d9ef;
+				background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23e573ab"><path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/></svg>');
 			}
 
 			.message-body {
@@ -749,7 +751,7 @@
 			.message-type {
 				display: block;
 				font-size: 30rpx;
-				font-weight: bold;
+				font-weight: 600;
 				color: #333;
 				margin-bottom: 10rpx;
 			}
@@ -763,22 +765,25 @@
 
 			.message-time {
 				font-size: 24rpx;
-				color: #999;
+				color: #a691c0;
 				margin-top: auto;
 			}
 		}
 
 		&.user-message {
 			display: flex;
-			background: #FFFFFF;
-			border: 2rpx solid #E0E0E0;
+			background: #ffffff;
+			border: 0;
+			box-shadow: 0 8rpx 20rpx rgba(0, 0, 0, 0.04);
+
 			align-items: center;
 
 			.message-avatar {
 				width: 60rpx;
 				height: 60rpx;
 				border-radius: 50%;
-				background: linear-gradient(135deg, #9C27B0 0%, #BA68C8 100%);
+				background: linear-gradient(135deg, #b39ddb 0%, #ce93d8 100%);
+
 				color: #FFFFFF;
 				font-size: 28rpx;
 				font-weight: bold;
@@ -788,7 +793,7 @@
 				margin-right: 20rpx;
 				flex-shrink: 0;
 			}
-			
+
 			.message-avatar-img {
 				width: 60rpx;
 				height: 60rpx;
@@ -805,21 +810,21 @@
 			.message-type {
 				display: block;
 				font-size: 30rpx;
-				font-weight: bold;
+				font-weight: 500;
 				color: #333;
-				margin-bottom: 10rpx;
+				margin-bottom: 6rpx;
 			}
 
 			.message-content {
 				display: block;
 				font-size: 26rpx;
-				color: #666;
+				color: #777;
 				line-height: 1.4;
 				overflow: hidden;
 				text-overflow: ellipsis;
 				white-space: nowrap;
 			}
-			
+
 			.message-right {
 				display: flex;
 				flex-direction: column;
@@ -829,12 +834,12 @@
 
 			.message-time {
 				font-size: 24rpx;
-				color: #999;
+				color: #b0a6c5;
 				margin-bottom: 10rpx;
 			}
-			
+
 			.unread-badge {
-				background: #E91E63;
+				background: #ff5c9a;
 				color: #FFFFFF;
 				font-size: 20rpx;
 				padding: 4rpx 10rpx;
@@ -844,7 +849,7 @@
 			}
 		}
 	}
-	
+
 	/* 加载和空状态 */
 	.loading-container,
 	.empty-container {
@@ -864,8 +869,8 @@
 
 		.time-label {
 			display: inline-block;
-			background: #FFF3E0;
-			color: #FF9800;
+			background: #ffe6f0;
+			color: #e573ab;
 			font-size: 24rpx;
 			padding: 8rpx 20rpx;
 			border-radius: 20rpx;

LiangZhiYUMao/pages/matchmaker-workbench/system-messages.vue

@@ -139,7 +139,8 @@ export default {
 <style lang="scss" scoped>
 .matchmaker-system-page {
   min-height: 100vh;
-  background: #FFF9F9;
+  /* 与红娘消息页保持一致：顶部淡粉 -> 中部淡紫 -> 底部趋近白色 */
+  background: linear-gradient(180deg, #fff1f7 0%, #f6ebff 45%, #fbf7ff 75%, #ffffff 100%);
   display: flex;
   flex-direction: column;
 }
@@ -150,8 +151,8 @@ export default {
   justify-content: space-between;
   padding: 25rpx 30rpx;
   padding-top: calc(25rpx + env(safe-area-inset-top));
-  background: #FFF9F9;
-  border-bottom: 1rpx solid #F0F0F0;
+  background: transparent;
+  border-bottom-width: 0;
 
   .back-btn {
     width: 70rpx;
@@ -197,16 +198,16 @@ export default {
 
 .content {
   flex: 1;
-  padding: 20rpx 20rpx 40rpx;
+  padding: 20rpx 20rpx 120rpx;
 }
 
 .system-item {
   display: flex;
-  padding: 24rpx 20rpx;
+  padding: 26rpx 24rpx;
   margin-bottom: 20rpx;
-  border-radius: 20rpx;
+  border-radius: 24rpx;
   background: #FFFFFF;
-  box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
+  box-shadow: 0 8rpx 20rpx rgba(0, 0, 0, 0.04);
 }
 
 .item-left {
@@ -216,7 +217,7 @@ export default {
     width: 64rpx;
     height: 64rpx;
     border-radius: 50%;
-    background: linear-gradient(135deg, #FCE4EC 0%, #F8BBD0 100%);
+    background: linear-gradient(135deg, #b39ddb 0%, #ce93d8 100%);
     display: flex;
     align-items: center;
     justify-content: center;
@@ -251,13 +252,13 @@ export default {
 
     .item-title {
       font-size: 30rpx;
-      font-weight: bold;
+      font-weight: 500;
       color: #333;
     }
 
     .item-time {
       font-size: 24rpx;
-      color: #999;
+      color: #b0a6c5;
       margin-left: 20rpx;
       flex-shrink: 0;
     }
@@ -265,7 +266,7 @@ export default {
 
   .item-content {
     font-size: 26rpx;
-    color: #666;
+    color: #777;
     line-height: 1.5;
   }
 }