47 lines
3.6 KiB
Plaintext
47 lines
3.6 KiB
Plaintext
.msg-page { background: #f5f5f5; min-height: 100vh; }
|
|
|
|
.header { display: flex; align-items: center; padding: 20rpx 24rpx; background: #fff; border-bottom: 1rpx solid #e8e8e8; }
|
|
.search-bar { flex: 1; display: flex; align-items: center; background: #f0f0f0; border-radius: 40rpx; padding: 0 20rpx; height: 68rpx; }
|
|
.search-input { flex: 1; height: 68rpx; font-size: 28rpx; }
|
|
.search-icon { font-size: 32rpx; margin-left: 10rpx; color: #999; }
|
|
.notify-switch { margin-left: 20rpx; }
|
|
.notify-text { font-size: 26rpx; color: #666; padding: 10rpx 16rpx; background: #f0f0f0; border-radius: 30rpx; }
|
|
|
|
.tab-row { display: flex; background: #fff; border-bottom: 1rpx solid #e8e8e8; }
|
|
.tab-item { flex: 1; display: flex; justify-content: center; align-items: center; padding: 24rpx 0; position: relative; color: #666; font-size: 28rpx; }
|
|
.tab-item.active { color: #07c160; font-weight: 600; }
|
|
.tab-item.active::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 60rpx; height: 6rpx; background: #07c160; border-radius: 3rpx; }
|
|
.tab-badge { background: #fa5151; color: #fff; font-size: 20rpx; border-radius: 20rpx; padding: 2rpx 12rpx; margin-left: 8rpx; min-width: 32rpx; text-align: center; }
|
|
|
|
.conversation-list { background: #fff; }
|
|
.conversation-item { display: flex; align-items: flex-start; padding: 24rpx 24rpx; border-bottom: 1rpx solid #f0f0f0; }
|
|
.order-group-item { min-height: 160rpx; padding: 28rpx 24rpx; }
|
|
.has-unread { background: #fafafa; }
|
|
.avatar { width: 96rpx; height: 96rpx; border-radius: 12rpx; margin-right: 20rpx; background: #eee; flex-shrink: 0; }
|
|
.avatar-round { border-radius: 50%; }
|
|
.info { flex: 1; min-width: 0; }
|
|
.top-line { display: flex; justify-content: space-between; margin-bottom: 8rpx; }
|
|
.name { font-size: 30rpx; color: #1a1a1a; font-weight: 500; }
|
|
.time { font-size: 22rpx; color: #999; flex-shrink: 0; margin-left: 12rpx; }
|
|
.user-meta-row { margin-bottom: 4rpx; }
|
|
.user-meta { font-size: 24rpx; color: #333; }
|
|
.user-meta.sub { color: #666; font-size: 22rpx; }
|
|
.order-block { background: #f7f8fa; border-radius: 12rpx; padding: 16rpx 18rpx; margin-bottom: 10rpx; }
|
|
.order-id { display: block; font-size: 24rpx; color: #576b95; margin-bottom: 6rpx; }
|
|
.order-desc { display: block; font-size: 26rpx; color: #333; line-height: 1.5; word-break: break-all; }
|
|
.order-status { display: inline-block; font-size: 22rpx; color: #07c160; margin-top: 8rpx; padding: 2rpx 12rpx; background: #e8f8ef; border-radius: 8rpx; }
|
|
.bottom-line { display: flex; justify-content: space-between; align-items: center; }
|
|
.last-msg { font-size: 26rpx; color: #888; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
.unread-dot { background: #fa5151; color: #fff; font-size: 20rpx; border-radius: 50%; min-width: 36rpx; height: 36rpx; line-height: 36rpx; text-align: center; margin-left: 12rpx; }
|
|
.load-tip { text-align: center; padding: 24rpx; color: #999; font-size: 24rpx; }
|
|
.empty { text-align: center; padding: 200rpx 0; color: #bbb; font-size: 28rpx; }
|
|
|
|
/* 客服入口 */
|
|
.kefu-entry { text-align: center; padding: 100rpx 0; }
|
|
.kefu-btn { width: 300rpx; background: #07c160; color: #fff; border-radius: 40rpx; font-size: 28rpx; }
|
|
|
|
/* 操作弹窗 */
|
|
.action-mask { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.4); z-index: 10000; }
|
|
.action-sheet { position: absolute; bottom: 0; left: 0; right: 0; background: #fff; border-radius: 24rpx 24rpx 0 0; padding: 20rpx 20rpx 150rpx 20rpx; }
|
|
.action-btn { text-align: center; padding: 28rpx 0; font-size: 32rpx; border-bottom: 1rpx solid #eee; }
|
|
.cancel { color: #999; margin-top: 12rpx; border-bottom: none; } |