From 11bea6b8c92ee5b94c2e52b3adba69b4ad036d46 Mon Sep 17 00:00:00 2001
From: yanghao05 <yanghao05@qianxin.com>
Date: Fri, 25 Apr 2025 11:43:34 +0800
Subject: [PATCH] feat: update

---
 frontend/wechat/src/views/ArticleDetail.vue | 31 ++++++++-------------
 1 file changed, 11 insertions(+), 20 deletions(-)

diff --git a/frontend/wechat/src/views/ArticleDetail.vue b/frontend/wechat/src/views/ArticleDetail.vue
index c0c3d46..8fb8af0 100644
--- a/frontend/wechat/src/views/ArticleDetail.vue
+++ b/frontend/wechat/src/views/ArticleDetail.vue
@@ -1,6 +1,5 @@
 <script setup>
 import { onMounted, ref } from 'vue'
-import { AiOutlineLeft } from 'vue-icons-plus/ai'
 import { useRoute, useRouter } from 'vue-router'
 import { postApi } from '../api/postApi'
 
@@ -61,27 +60,19 @@ onMounted(async () => {
 </script>
 
 <template>
-    <div class="min-h-screen bg-gray-50 pb-20">
-        <header class="fixed top-0 left-0 right-0 h-14 bg-white border-b border-gray-200 flex items-center px-4 z-50">
-            <button @click="router.back()"
-                class="flex items-center justify-center w-10 h-10 mr-2 rounded-full hover:bg-gray-100 active:bg-gray-200 transition-colors">
-                <AiOutlineLeft class="h-5 w-5" />
-            </button>
-            <h2 class="text-lg font-medium">{{ article?.title || '文章详情' }}</h2>
-        </header>
-
-        <main class="pt-14">
-            <div v-if="article" class="px-4 pt-4">
-                <video controls :poster="article.head_images[0]"
-                    class="w-full rounded aspect-video object-cover border border-gray-200">
-                    Your browser does not support the video tag.
-                </video>
+    <div class="min-h-screen bg-gray-50">
+        <div v-if="article">
+            <video controls :poster="article.head_images[0]" class="w-full aspect-video object-cover">
+                Your browser does not support the video tag.
+            </video>
+            <div class="p-4">
+                <h1 class="text-2xl my-1.5">{{ article.title }}</h1>
             </div>
+        </div>
 
-            <div v-else class="flex justify-center items-center py-8">
-                <div class="animate-spin rounded-full h-8 w-8 border-4 border-gray-200 border-t-blue-600"></div>
-            </div>
-        </main>
+        <div v-else class="flex justify-center items-center py-8">
+            <div class="animate-spin rounded-full h-8 w-8 border-4 border-gray-200 border-t-blue-600"></div>
+        </div>
 
         <div v-if="article && !article.purchased"
             class="fixed bottom-0 left-0 right-0 bg-white border-t border-gray-200 p-4">