diff --git a/src/components/cards/MessageCard.vue b/src/components/cards/MessageCard.vue
index 6d236724..e562d284 100644
--- a/src/components/cards/MessageCard.vue
+++ b/src/components/cards/MessageCard.vue
@@ -45,9 +45,18 @@ function openLink() {
         @error="imageLoadError = true"
       />
     </div>
-    <VCardTitle>{{ props.message?.title }}</VCardTitle>
-
-    <VCardText>
+    <VCardTitle v-if="props.message?.title">
+      {{ props.message?.title }}
+    </VCardTitle>
+    <VAlert
+      v-if="props.message?.text && props.message?.action === 0"
+      variant="tonal"
+      type="success"
+    >
+      <template #prepend />
+      {{ props.message?.text }}
+    </VAlert>
+    <VCardText v-if="props.message?.text && props.message?.action === 1">
       {{ props.message?.text }}
     </VCardText>
   </VCard>
diff --git a/src/views/system/MessageView.vue b/src/views/system/MessageView.vue
index d2e5fbc0..73363bef 100644
--- a/src/views/system/MessageView.vue
+++ b/src/views/system/MessageView.vue
@@ -50,6 +50,10 @@ function startSSEMessager() {
 async function loadMessages() {
   try {
     messages.value = await api.get('message/web')
+    if (messages.value.length > 0) {
+      isLoaded.value = true
+      scrollToEnd()
+    }
   }
   catch (error) {
     console.error(error)
@@ -77,7 +81,7 @@ onMounted(() => {
     <span class="mt-3">正在刷新 ...</span>
   </div>
   <div
-    v-if="messages.length === 0"
+    v-if="messages.length === 0 && isLoaded"
     class="w-full text-center flex flex-col items-center"
   >
     <span class="mb-3">当前没有消息</span>
@@ -86,6 +90,10 @@ onMounted(() => {
     <VRow
       v-for="(msg, index) in messages"
       :key="index"
+      :class="{
+        'justify-end': msg.action === 0,
+        'justify-start': msg.action === 1,
+      }"
     >
       <VCol
         sm="8"