From 7d242579a0923e7639876797e738a22c45d6e2d0 Mon Sep 17 00:00:00 2001
From: doum <doum>
Date: 星期四, 23 四月 2026 20:07:37 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
app/pages/message/message.vue | 204 +++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 198 insertions(+), 6 deletions(-)
diff --git a/app/pages/message/message.vue b/app/pages/message/message.vue
index 94d9b9c..6301116 100644
--- a/app/pages/message/message.vue
+++ b/app/pages/message/message.vue
@@ -1,6 +1,29 @@
<template>
- <view>
-
+ <view class="message-page">
+ <view class="message-page__nav" :style="{ paddingTop: statusBarHeight + 'px' }">
+ <view class="message-page__nav-inner">
+ <text class="message-page__nav-title">娑堟伅</text>
+ </view>
+ </view>
+
+ <scroll-view class="message-page__body" scroll-y :style="bodyStyle">
+ <view class="message-page__list">
+ <view v-for="item in messageList" :key="item.id" class="message-card">
+ <view class="message-card__icon-wrap">
+ <view class="message-card__icon-bg">
+ <text class="message-card__icon">馃敂</text>
+ </view>
+ <view v-if="item.unread" class="message-card__dot"></view>
+ </view>
+
+ <view class="message-card__content">
+ <text class="message-card__title">{{ item.title }}</text>
+ <text class="message-card__desc">{{ item.desc }}</text>
+ <text class="message-card__time">{{ item.time }}</text>
+ </view>
+ </view>
+ </view>
+ </scroll-view>
</view>
</template>
@@ -8,12 +31,181 @@
export default {
data() {
return {
-
- };
+ statusBarHeight: 0,
+ navHeight: 0,
+ messageList: [
+ {
+ id: 1,
+ title: '璁㈠崟寰呴厤閫�',
+ desc: '鎮ㄥ凡鎶㈠崟鎴愬姛锛岃鍗曪細32728367487367锛岃鎸夋椂鍒般�愪腑閾佸揩杩愬崡绔欐棗鑸板簵銆戝彇璐�',
+ time: '2026-04-12 20:00',
+ unread: true
+ },
+ {
+ id: 2,
+ title: '閰嶉�佷腑',
+ desc: '璁㈠崟锛�32728367487367宸插彇璐э紝璇锋寜鏃堕�佽揪',
+ time: '2026-04-12 20:00',
+ unread: true
+ },
+ {
+ id: 3,
+ title: '宸查�佽揪',
+ desc: '璁㈠崟锛�32728367487367宸查�佽揪锛岃鑱旂郴鐢ㄦ埛纭绛炬敹',
+ time: '2026-04-12 20:00',
+ unread: false
+ },
+ {
+ id: 4,
+ title: '璁㈠崟宸插畬鎴�',
+ desc: '璁㈠崟锛�32728367487367宸插畬鎴愶紝鐩稿叧璁㈠崟缁撶畻浼氬湪3涓伐浣滄棩鍐呭畬鎴�',
+ time: '2026-04-12 20:00',
+ unread: false
+ },
+ {
+ id: 5,
+ title: '璁㈠崟宸茶瘎浠�',
+ desc: '璁㈠崟锛�32728367487367锛岀敤鎴峰凡璇勪环锛屽彲鏌ョ湅璇勪环鍐呭',
+ time: '2026-04-12 20:00',
+ unread: false
+ },
+ {
+ id: 6,
+ title: '閫�娆句腑',
+ desc: '璁㈠崟锛�32728367487367锛岀敤鎴峰凡鎻愪氦閫�娆剧敵璇凤紝璇ヨ鍗曚换鍔″凡鍙栨秷锛岃鍕垮墠寰�銆�',
+ time: '2026-04-12 20:00',
+ unread: false
+ },
+ {
+ id: 7,
+ title: '璁㈠崟宸茬粨绠�',
+ desc: '琛屾潕璁㈠崟锛�3729378487987 骞冲彴宸插畬鎴愮粨绠楋紝閲戦涓篨X鍏冿紝璇锋敞鎰忔煡鏀�',
+ time: '2026-04-12 20:00',
+ unread: false
+ }
+ ]
+ }
+ },
+ computed: {
+ bodyStyle() {
+ return {
+ marginTop: this.navHeight + 'px',
+ height: `calc(100vh - ${this.navHeight}px)`
+ }
+ }
+ },
+ onLoad() {
+ const systemInfo = uni.getSystemInfoSync()
+ this.statusBarHeight = systemInfo.statusBarHeight || 0
+ this.navHeight = this.statusBarHeight + uni.upx2px(88)
}
}
</script>
-<style lang="scss">
+<style lang="scss" scoped>
+ .message-page {
+ height: 100vh;
+ background: #f6f8fc;
+ overflow: hidden;
-</style>
\ No newline at end of file
+ &__nav {
+ position: fixed;
+ left: 0;
+ top: 0;
+ right: 0;
+ z-index: 10;
+ background: linear-gradient(180deg, #1f73f6 0%, #1b6df2 100%);
+ }
+
+ &__nav-inner {
+ height: 88rpx;
+ display: flex;
+ align-items: center;
+ padding: 0 24rpx;
+ }
+
+ &__nav-title {
+ font-size: 36rpx;
+ font-weight: 700;
+ color: #ffffff;
+ }
+
+ &__body {
+ box-sizing: border-box;
+ }
+
+ &__list {
+ padding: 18rpx 18rpx calc(env(safe-area-inset-bottom) + 24rpx);
+ }
+ }
+
+ .message-card {
+ display: flex;
+ align-items: flex-start;
+ gap: 18rpx;
+ padding: 24rpx 20rpx;
+ margin-bottom: 18rpx;
+ border-radius: 18rpx;
+ background: #ffffff;
+ box-shadow: 0 8rpx 20rpx rgba(28, 55, 106, 0.04);
+
+ &__icon-wrap {
+ position: relative;
+ flex-shrink: 0;
+ }
+
+ &__icon-bg {
+ width: 52rpx;
+ height: 52rpx;
+ border-radius: 50%;
+ background: #fff7e3;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ &__icon {
+ font-size: 26rpx;
+ line-height: 1;
+ }
+
+ &__dot {
+ position: absolute;
+ right: 0;
+ top: 0;
+ width: 14rpx;
+ height: 14rpx;
+ border-radius: 50%;
+ background: #ff3b30;
+ border: 2rpx solid #ffffff;
+ }
+
+ &__content {
+ flex: 1;
+ min-width: 0;
+ }
+
+ &__title {
+ display: block;
+ font-size: 36rpx;
+ font-weight: 700;
+ color: #2b3139;
+ line-height: 1.35;
+ }
+
+ &__desc {
+ display: block;
+ margin-top: 10rpx;
+ font-size: 28rpx;
+ line-height: 1.55;
+ color: #8c95a3;
+ }
+
+ &__time {
+ display: block;
+ margin-top: 16rpx;
+ font-size: 26rpx;
+ color: #b1b7c1;
+ }
+ }
+</style>
--
Gitblit v1.9.3