From 007d574eec952f59bd0b4bc280a16cdeef527f4c Mon Sep 17 00:00:00 2001
From: tone <3341154833@qq.com>
Date: Tue, 15 Oct 2024 23:43:05 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=20=E5=89=8D=E7=AB=AF?=
 =?UTF-8?q?=E6=8E=A7=E5=88=B6=E5=8F=B0=E7=95=8C=E9=9D=A2=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 tonecn/index.html                            |  2 +-
 tonecn/src/components/Console/Blogs.vue      | 11 ++++++-----
 tonecn/src/components/Console/FileOnline.vue |  5 +++--
 tonecn/src/components/Console/Resources.vue  | 11 ++++++-----
 tonecn/src/components/Console/Utils.vue      |  4 ++--
 tonecn/src/views/Console/Dashboard.vue       |  7 ++++---
 6 files changed, 22 insertions(+), 18 deletions(-)
diff --git a/tonecn/index.html b/tonecn/index.html
index cff56db..8d53ec1 100644
--- a/tonecn/index.html
+++ b/tonecn/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8">
     <link rel="icon" href="./src/assets/logo.jpg">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
     <link rel="stylesheet" href="./src/assets/tailwind.css">
     <title>特恩(TONE)</title>
   </head>
diff --git a/tonecn/src/components/Console/Blogs.vue b/tonecn/src/components/Console/Blogs.vue
index eb29804..74bb191 100644
--- a/tonecn/src/components/Console/Blogs.vue
+++ b/tonecn/src/components/Console/Blogs.vue
@@ -111,11 +111,12 @@ const formatTime = (row: any, _column: any, _cellValue: any, _index: any) => {
 }
 </script>
 <template>
-    <div style="padding: 15px 20px;">
+    <div class="px-[20px] py-[15px]">
         <el-text>总数量：{{ tableData.length }}</el-text>
-        <el-button type="primary" style="width: 120px;margin-left: 20px;" @click="addHandle">添加</el-button>
+        <el-button type="primary" class="w-[120px] ml-[20px]" @click="addHandle">添加</el-button>
     </div>
-    <el-table :data="tableData" border style="width: 100%">
+    <!-- 数据列表 -->
+    <el-table :data="tableData" border class="w-full">
         <el-table-column prop="id" label="id" width="50" />
         <el-table-column prop="uuid" label="uuid" width="120" show-overflow-tooltip />
         <el-table-column prop="title" label="标题" width="240" />
@@ -124,14 +125,14 @@ const formatTime = (row: any, _column: any, _cellValue: any, _index: any) => {
         <el-table-column prop="access_level" label="可访问级别" width="100" />
         <el-table-column prop="visit_count" label="访问量" width="80" />
         <el-table-column prop="like_count" label="点赞量" width="80" />
-        <el-table-column fixed="right" label="操作" width="120">
+        <el-table-column fixed="right" label="操作" min-width="110">
             <template #default="scope">
                 <el-button link type="primary" size="small" @click="editHandle(scope.row)">编辑</el-button>
                 <el-button link type="primary" size="small" @click="delHandle(scope.row)">删除</el-button>
             </template>
         </el-table-column>
     </el-table>
-
+    <!-- 编辑、添加博客对话框 -->
     <el-dialog v-model="dialogEditFormVisible" title="编辑" width="800">
         <el-form :model="editForm" label-width="auto" style="margin: 0 30px;">
             <el-form-item label="id">
diff --git a/tonecn/src/components/Console/FileOnline.vue b/tonecn/src/components/Console/FileOnline.vue
index 2efa4e3..731cc62 100644
--- a/tonecn/src/components/Console/FileOnline.vue
+++ b/tonecn/src/components/Console/FileOnline.vue
@@ -363,7 +363,7 @@ const aceEditorTheme = ref('github');
 </script>
 <template>
     <div class="container w-full">
-        <div class="flex items-center p-[10px]">
+        <div class="flex items-center p-[10px] flex-wrap">
             <el-button class="mr-[-15px]" @click="() => { loadFullFileList(); loadFileListShow(); }" circle link>
                 <el-icon>
                     <Refresh />
@@ -394,6 +394,7 @@ const aceEditorTheme = ref('github');
             <el-button type="danger" :disabled="false" @click="deleteChosenFile">删除</el-button>
         </el-button-group>
     </div>
+    <!-- 文件列表 -->
     <el-table :data="fileListShow" @cell-click="fileClick" @selection-change="fileListSelectionChange" border
         class="mt-[10px]">
         <el-table-column type="selection" width="55" />
@@ -401,7 +402,7 @@ const aceEditorTheme = ref('github');
         <el-table-column prop="lastModified" :formatter="fileListTableLastModifiedFormatter" label="最后修改时间"
             width="180" />
         <el-table-column prop="size" :formatter="fileListTableSizeFormatter" label="文件大小" width="130" />
-        <el-table-column label="操作" width="200">
+        <el-table-column label="操作" width="180">
             <template #default="scope">
                 <el-button v-if="!scope.row.dir" size="small" text
                     @click.prevent="fileListHandleEdit(scope.row)">编辑</el-button>
diff --git a/tonecn/src/components/Console/Resources.vue b/tonecn/src/components/Console/Resources.vue
index 1ae622f..538dd10 100644
--- a/tonecn/src/components/Console/Resources.vue
+++ b/tonecn/src/components/Console/Resources.vue
@@ -106,11 +106,12 @@ const delHandle = async (data: { id: string, [key: string]: any }) => {
 }
 </script>
 <template>
-    <div style="padding: 15px 20px;">
+    <div class="py-[15px] px-[20px]">
         <el-text>总数量：{{ tableData.length }}</el-text>
         <el-button type="primary" style="width: 120px;margin-left: 20px;" @click="addHandle">添加</el-button>
     </div>
-    <el-table :data="tableData" border style="width: 100%">
+    <!-- 数据列表 -->
+    <el-table :data="tableData" border class="w-full">
         <el-table-column prop="id" label="id" width="50" />
         <el-table-column prop="type" label="类型" width="80" sortable>
             <template #default="scope">
@@ -133,16 +134,16 @@ const delHandle = async (data: { id: string, [key: string]: any }) => {
             </template>
         </el-table-column>
         <el-table-column prop="src" label="资源" width="180" />
-        <el-table-column fixed="right" label="操作" min-width="120">
+        <el-table-column fixed="right" label="操作" min-width="110">
             <template #default="scope">
                 <el-button link type="primary" size="small" @click="editHandle(scope.row)">编辑</el-button>
                 <el-button link type="primary" size="small" @click="delHandle(scope.row)">删除</el-button>
             </template>
         </el-table-column>
     </el-table>
-
+    <!-- 编辑、添加资源对话框 -->
     <el-dialog v-model="dialogEditFormVisible" title="编辑" width="800">
-        <el-form :model="editForm" label-width="auto" style="margin: 0 30px;">
+        <el-form :model="editForm" label-width="auto" class="mx-[30px]">
             <el-form-item label="id">
                 <el-input v-model="editForm.id" disabled />
             </el-form-item>
diff --git a/tonecn/src/components/Console/Utils.vue b/tonecn/src/components/Console/Utils.vue
index 5e0d1bb..daa7616 100644
--- a/tonecn/src/components/Console/Utils.vue
+++ b/tonecn/src/components/Console/Utils.vue
@@ -13,7 +13,7 @@ const generateUUID = () => {
 }
 </script>
 <template>
-    <el-col style="padding: 20px;">
+    <el-col class="p-[20px]">
         <el-row>
             <el-text>随机数生成</el-text>
         </el-row>
@@ -27,7 +27,7 @@ const generateUUID = () => {
                     @click="() => { copyText(randomNum + ''); ElMessage.success('复制成功') }">复制</el-button>
             </el-button-group>
         </el-row>
-        <el-row style="margin-top: 15px;">
+        <el-row class="mt-[15px]">
             <el-text>32位UUID生成</el-text>
         </el-row>
         <el-row>
diff --git a/tonecn/src/views/Console/Dashboard.vue b/tonecn/src/views/Console/Dashboard.vue
index a7c042c..b3efd5a 100644
--- a/tonecn/src/views/Console/Dashboard.vue
+++ b/tonecn/src/views/Console/Dashboard.vue
@@ -33,6 +33,7 @@ const logout = () => {
     })
 }
 onMounted(async () => {
+    handleResize()
     window.addEventListener('resize', handleResize);
 })
 onUnmounted(async () => {
@@ -40,8 +41,8 @@ onUnmounted(async () => {
 })
 </script>
 <template>
-    <div class="flex">
-        <el-menu default-active="1" :collapse="menuCollapse" class="menu">
+    <div class="flex w-[100vw]">
+        <el-menu default-active="1" :collapse="menuCollapse">
             <el-menu-item index="1" @click="tabComponent = Resources">
                 <el-icon><icon-menu /></el-icon>
                 <span style="width: 140px;">资源及下载</span>
@@ -71,7 +72,7 @@ onUnmounted(async () => {
                 <span>退出登录</span>
             </el-menu-item>
         </el-menu>
-        <div style="flex: 1;min-height: calc(100vh - 90px);">
+        <div class="flex-1 overflow-x-scroll sm:min-h-[calc(100vh-90px)] min-h-[calc(100vh-77px)]">
             <KeepAlive>
                 <component :is="tabComponent" />
             </KeepAlive>
