From f3267023bf95167c2858f2e095f330aca68ffbb8 Mon Sep 17 00:00:00 2001
From: Tim <nagisa12164@163.com>
Date: Fri, 18 Jul 2025 16:39:25 +0800
Subject: [PATCH] feat: message page mobile

---
 open-isle-cli/src/components/DropdownMenu.vue    |  2 +-
 .../src/components/NotificationContainer.vue     | 16 +++++++++++++++-
 open-isle-cli/src/views/MessagePageView.vue      |  6 ++++++
 3 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/open-isle-cli/src/components/DropdownMenu.vue b/open-isle-cli/src/components/DropdownMenu.vue
index 13ac1ca0c..a7eae6f3b 100644
--- a/open-isle-cli/src/components/DropdownMenu.vue
+++ b/open-isle-cli/src/components/DropdownMenu.vue
@@ -75,7 +75,7 @@ export default {
   border: 1px solid var(--normal-border-color);
   border-radius: 4px;
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
-  z-index: 10;
+  z-index: 1000;
   border-radius: 8px;
   min-width: 100px;
 }
diff --git a/open-isle-cli/src/components/NotificationContainer.vue b/open-isle-cli/src/components/NotificationContainer.vue
index 19deee089..2bb645986 100644
--- a/open-isle-cli/src/components/NotificationContainer.vue
+++ b/open-isle-cli/src/components/NotificationContainer.vue
@@ -5,7 +5,7 @@
     </div>
     <slot name="actions">
       <div v-if="!item.read" class="mark-read-button" @click="markRead(item.id)">
-        标记为已读
+        {{ isMobile ? 'OK' : '标记为已读' }}
       </div>
       <div v-else class="has-read-button">已读</div>
     </slot>
@@ -13,11 +13,17 @@
 </template>
 
 <script>
+import { isMobile } from '../utils/screen'
 export default {
   name: 'NotificationContainer',
   props: {
     item: { type: Object, required: true },
     markRead: { type: Function, required: true }
+  },
+  setup() {
+    return {
+      isMobile
+    }
   }
 }
 </script>
@@ -37,6 +43,7 @@ export default {
   color: var(--primary-color);
   font-size: 12px;
   cursor: pointer;
+  margin-left: 10px;
 }
 
 .mark-read-button:hover {
@@ -46,4 +53,11 @@ export default {
 .has-read-button {
   font-size: 12px;
 }
+
+@media (max-width: 768px) {
+  .has-read-button {
+    display: none;
+  }
+}
+
 </style>
diff --git a/open-isle-cli/src/views/MessagePageView.vue b/open-isle-cli/src/views/MessagePageView.vue
index ccf8ae191..fcc220565 100644
--- a/open-isle-cli/src/views/MessagePageView.vue
+++ b/open-isle-cli/src/views/MessagePageView.vue
@@ -659,4 +659,10 @@ export default {
   color: var(--primary-color);
   border-bottom: 2px solid var(--primary-color);
 }
+
+@media (max-width: 768px) {
+  .has_read_button {
+    display: none;
+  }
+}
 </style>