diff --git a/miniprogram/pages/meeting/reservationRecord/approve/approve.wxml b/miniprogram/pages/meeting/reservationRecord/approve/approve.wxml index a16bfe2..e8d8810 100644 --- a/miniprogram/pages/meeting/reservationRecord/approve/approve.wxml +++ b/miniprogram/pages/meeting/reservationRecord/approve/approve.wxml @@ -35,19 +35,17 @@ {{item.staffTip}} - - - - - - 会务({{item.serviceReadCount}}/{{item.serviceTotalCount}}) - - - - - 音控({{item.musicReadCount}}/{{item.musicTotalCount}}) - - + + + 会务 + + + + 音控 + + + + 取消预约 修改信息 diff --git a/miniprogram/pages/meeting/reservationRecord/approve/approve.wxss b/miniprogram/pages/meeting/reservationRecord/approve/approve.wxss index 38e8b29..5f79457 100644 --- a/miniprogram/pages/meeting/reservationRecord/approve/approve.wxss +++ b/miniprogram/pages/meeting/reservationRecord/approve/approve.wxss @@ -147,12 +147,15 @@ .itemView .btnView { display: flex; - flex-direction: column; - align-items: flex-end; - padding-top: 10rpx; - padding-bottom: 10rpx; + flex-direction: row; + align-items: center; + justify-content: flex-end; + padding: 10rpx 0; border-top: 1rpx solid rgba(0, 0, 0, 0.05); - min-height: 90rpx; + min-height: 70rpx; + overflow-x: auto; + flex-wrap: nowrap; + gap: 0; } .itemView .btnView .btn { @@ -181,8 +184,8 @@ /* 通过按钮绿色样式 */ .approve-btn-success { - color: #000000 !important; - border-color: #000000 !important; + color: #909399 !important; + border-color: #dcdfe6 !important; } /* 会务负责人按钮容器 */ @@ -221,18 +224,39 @@ /* 操作按钮样式 */ .action-btn { - margin-left: 16rpx !important; - margin-bottom: 12rpx !important; + margin-left: 0 ; + margin-right: 0 ; + margin-bottom: 0 ; + font-size: 30rpx; +} + +.staff-btn-container { + display: inline-flex; + margin: 0 5rpx; } /* 按钮组样式 */ -.action-buttons { +.action-row { + display: flex; + flex-wrap: nowrap; + justify-content: space-between; + align-items: center; + width: 100%; +} + +.notification-container { + display: flex; + flex-wrap: nowrap; + gap: 10rpx; + align-items: center; + flex-shrink: 0; +} + +.button-container { display: flex; flex-wrap: wrap; justify-content: flex-end; - margin-top: 16rpx; - width: 100%; - position: relative; + flex-grow: 1; } /* 会务服务人员阅读状态容器 */ @@ -260,9 +284,9 @@ /* 已读状态 */ .staff-read { - color: #07c160; - background-color: rgba(7, 193, 96, 0.1); - border: 1rpx solid rgba(7, 193, 96, 0.2); + color: #909399; + background-color: rgba(144, 147, 153, 0.1); + border: 1rpx solid rgba(144, 147, 153, 0.2); } /* 未读状态 */ @@ -319,11 +343,11 @@ font-size: 22rpx; } -/* 已读标签 - 绿色 */ +/* 已读标签 - 灰色 */ .read-tag { - background-color: #f6ffed; - color: #52c41a; - border: 1px solid #b7eb8f; + background-color: #f5f5f5; + color: #909399; + border: 1px solid #dcdfe6; } /* 未读标签 - 红色 */ @@ -386,11 +410,11 @@ text-align: center; } -/* 已读标签 - 绿色 */ +/* 已读标签 - 灰色 */ .read-tag { - background-color: #f6ffed; - color: #52c41a; - border: 1px solid #b7eb8f; + background-color: #f5f5f5; + color: #909399; + border: 1px solid #dcdfe6; } /* 未读标签 - 红色 */ @@ -437,9 +461,9 @@ } .notification-status.read { - background-color: rgba(76, 175, 80, 0.1); - color: #4CAF50; - border: 1px solid #4CAF50; + background-color: rgba(144, 147, 153, 0.1); + color: #909399; + border: 1px solid #dcdfe6; } .notification-status.unread { @@ -611,9 +635,9 @@ } .vertical-notification-status.read { - background-color: rgba(76, 175, 80, 0.1); - color: #4CAF50; - border: 1px solid #4CAF50; + background-color: rgba(144, 147, 153, 0.1); + color: #909399; + border: 1px solid #909399; } .vertical-notification-status.unread { @@ -650,4 +674,87 @@ .status-alert { color: #F44336; +} + +/* 通知标签样式 */ +.tag-notification { + display: inline-flex; + align-items: center; + padding: 4rpx 10rpx; + border-radius: 6rpx; + font-size: 22rpx; + min-height: 28rpx; + line-height: 28rpx; + margin-bottom: 6rpx; + white-space: nowrap; +} + +.tag-notification.read { + background-color: #f0f9eb; + color: #67c23a; + border: 1rpx solid #c2e7b0; +} + +.tag-notification.unread { + background-color: #fef0f0; + color: #f56c6c; + border: 1rpx solid #fbc4c4; +} + +/* 按钮固定一行显示 */ +.fixed-buttons-row { + display: flex; + flex-direction: row; + justify-content: flex-start; + align-items: center; + width: 100%; + flex-wrap: nowrap; + overflow-x: auto; + padding: 4rpx 0; +} + +.left-buttons { + display: flex; + gap: 8rpx; + flex-wrap: nowrap; + margin-right: 10rpx; + flex-shrink: 0; +} + +.right-buttons { + display: flex; + flex-wrap: nowrap; + justify-content: flex-end; + align-items: center; + flex-grow: 1; + white-space: nowrap; + margin-left: auto; + gap: 0; +} + +.meeting-btn, .music-btn { + padding: 10rpx 20rpx; + border-radius: 8rpx; + font-size: 30rpx; + display: inline-block; + text-align: center; + height: 72rpx; + line-height: 52rpx; + box-sizing: border-box; + margin-bottom: 0; + font-weight: 500; + min-width: 100rpx; + margin-right: 8rpx; +} + +.meeting-btn.read, .music-btn.read { + background-color: #f5f5f5; + color: #909399; + border: 1rpx solid #dcdfe6; +} + +.meeting-btn.unread, .music-btn.unread { + background-color: #fef0f0; + color: #f56c6c; + border: 1rpx solid #fbc4c4; } \ No newline at end of file