From 0d857d2f0cb8cb4ae77fbefffca8f497e0e595e6 Mon Sep 17 00:00:00 2001
From: ChengPlay <31820853+zhengkunwang223@users.noreply.github.com>
Date: Mon, 21 Apr 2025 16:10:49 +0800
Subject: [PATCH] style: Optimize page styles. (#8436)

---
 frontend/src/views/app-store/apps/index.vue   |  2 +-
 .../src/views/app-store/installed/index.vue   |  2 +-
 .../src/views/host/file-management/index.vue  |  2 +-
 .../src/views/host/process/network/index.vue  |  2 +-
 .../src/views/host/process/process/index.vue  | 34 +++++++++----------
 frontend/src/views/host/ssh/ssh/index.vue     |  2 +-
 .../views/website/runtime/dotnet/index.vue    |  2 +-
 .../src/views/website/runtime/go/index.vue    |  2 +-
 .../src/views/website/runtime/java/index.vue  |  2 +-
 .../src/views/website/runtime/node/index.vue  |  2 +-
 .../src/views/website/runtime/php/index.vue   |  2 +-
 .../views/website/runtime/python/index.vue    |  2 +-
 frontend/src/views/website/ssl/index.vue      |  1 +
 .../views/website/website/config/index.vue    |  2 +-
 frontend/src/views/website/website/index.vue  |  2 +-
 15 files changed, 31 insertions(+), 30 deletions(-)

diff --git a/frontend/src/views/app-store/apps/index.vue b/frontend/src/views/app-store/apps/index.vue
index edad8c81d..f3fbb3323 100644
--- a/frontend/src/views/app-store/apps/index.vue
+++ b/frontend/src/views/app-store/apps/index.vue
@@ -77,7 +77,7 @@
         </template>
         <template #main>
             <div>
-                <MainDiv :heightDiff="350">
+                <MainDiv :heightDiff="300">
                     <el-alert type="info" :title="$t('app.appHelper')" :closable="false" />
                     <el-row :gutter="5">
                         <el-col
diff --git a/frontend/src/views/app-store/installed/index.vue b/frontend/src/views/app-store/installed/index.vue
index 3244e87d7..fb4ca26a6 100644
--- a/frontend/src/views/app-store/installed/index.vue
+++ b/frontend/src/views/app-store/installed/index.vue
@@ -62,7 +62,7 @@
         </template>
         <template #main>
             <div>
-                <MainDiv :heightDiff="mode === 'upgrade' ? 320 : 350">
+                <MainDiv :heightDiff="mode === 'upgrade' ? 270 : 300">
                     <el-alert
                         type="info"
                         :title="$t('app.upgradeHelper')"
diff --git a/frontend/src/views/host/file-management/index.vue b/frontend/src/views/host/file-management/index.vue
index 2c94fa8b6..3eed7f555 100644
--- a/frontend/src/views/host/file-management/index.vue
+++ b/frontend/src/views/host/file-management/index.vue
@@ -179,7 +179,7 @@
                     :data="data"
                     @search="search"
                     @sort-change="changeSort"
-                    :heightDiff="350"
+                    :heightDiff="300"
                 >
                     <el-table-column type="selection" width="30" />
                     <el-table-column
diff --git a/frontend/src/views/host/process/network/index.vue b/frontend/src/views/host/process/network/index.vue
index 5da1f09da..59f3ef9fc 100644
--- a/frontend/src/views/host/process/network/index.vue
+++ b/frontend/src/views/host/process/network/index.vue
@@ -37,7 +37,7 @@
                     @sort-change="changeSort"
                     @filter-change="changeFilter"
                     ref="tableRef"
-                    :heightDiff="300"
+                    :heightDiff="220"
                 >
                     <el-table-column :label="$t('commons.table.type')" fix prop="type"></el-table-column>
                     <el-table-column :label="'PID'" fix prop="PID" max-width="60px" sortable></el-table-column>
diff --git a/frontend/src/views/host/process/process/index.vue b/frontend/src/views/host/process/process/index.vue
index 650738e42..28adfaf81 100644
--- a/frontend/src/views/host/process/process/index.vue
+++ b/frontend/src/views/host/process/process/index.vue
@@ -37,42 +37,43 @@
                     @sort-change="changeSort"
                     @filter-change="changeFilter"
                     ref="tableRef"
-                    :heightDiff="300"
+                    :heightDiff="220"
                 >
-                    <el-table-column :label="'PID'" fix prop="PID" max-width="60px" sortable></el-table-column>
-                    <el-table-column
-                        :label="$t('commons.table.name')"
-                        fix
-                        prop="name"
-                        min-width="120px"
-                    ></el-table-column>
+                    <el-table-column :label="'PID'" prop="PID" max-width="60px" sortable></el-table-column>
+                    <el-table-column :label="$t('commons.table.name')" prop="name" min-width="120px"></el-table-column>
                     <el-table-column
                         :label="$t('process.ppid')"
-                        min-width="120px"
-                        fix
+                        max-width="60px"
                         prop="PPID"
                         sortable
                     ></el-table-column>
-                    <el-table-column :label="$t('process.numThreads')" fix prop="numThreads"></el-table-column>
-                    <el-table-column :label="$t('commons.table.user')" fix prop="username"></el-table-column>
+                    <el-table-column
+                        :label="$t('process.numThreads')"
+                        max-width="60px"
+                        prop="numThreads"
+                    ></el-table-column>
+                    <el-table-column
+                        :label="$t('commons.table.user')"
+                        max-width="60px"
+                        prop="username"
+                    ></el-table-column>
                     <el-table-column
                         :label="'CPU'"
-                        fix
+                        max-width="60px"
                         prop="cpuValue"
                         :formatter="cpuFormatter"
                         sortable
                     ></el-table-column>
                     <el-table-column
                         :label="$t('process.memory')"
-                        fix
+                        max-width="60px"
                         prop="rssValue"
                         :formatter="memFormatter"
                         sortable
                     ></el-table-column>
-                    <el-table-column :label="$t('process.numConnections')" fix prop="numConnections"></el-table-column>
+                    <el-table-column :label="$t('process.numConnections')" prop="numConnections"></el-table-column>
                     <el-table-column
                         :label="$t('commons.table.status')"
-                        fix
                         prop="status"
                         column-key="status"
                         :filters="[
@@ -93,7 +94,6 @@
                     </el-table-column>
                     <el-table-column
                         :label="$t('process.startTime')"
-                        fix
                         prop="startTime"
                         min-width="140px"
                     ></el-table-column>
diff --git a/frontend/src/views/host/ssh/ssh/index.vue b/frontend/src/views/host/ssh/ssh/index.vue
index f9c9624fb..597cde53e 100644
--- a/frontend/src/views/host/ssh/ssh/index.vue
+++ b/frontend/src/views/host/ssh/ssh/index.vue
@@ -39,7 +39,7 @@
 
         <LayoutContent>
             <template #main>
-                <MainDiv :heightDiff="3200">
+                <MainDiv :heightDiff="320">
                     <el-radio-group v-model="confShowType" @change="changeMode">
                         <el-radio-button value="base">{{ $t('database.baseConf') }}</el-radio-button>
                         <el-radio-button value="all">{{ $t('database.allConf') }}</el-radio-button>
diff --git a/frontend/src/views/website/runtime/dotnet/index.vue b/frontend/src/views/website/runtime/dotnet/index.vue
index 28097f729..593a2d313 100644
--- a/frontend/src/views/website/runtime/dotnet/index.vue
+++ b/frontend/src/views/website/runtime/dotnet/index.vue
@@ -21,7 +21,7 @@
                 <TableSetting title="dotnet-runtime-refresh" @search="search()" />
             </template>
             <template #main>
-                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()">
+                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="260">
                     <el-table-column
                         :label="$t('commons.table.name')"
                         fix
diff --git a/frontend/src/views/website/runtime/go/index.vue b/frontend/src/views/website/runtime/go/index.vue
index f33d0224f..ff56d3d28 100644
--- a/frontend/src/views/website/runtime/go/index.vue
+++ b/frontend/src/views/website/runtime/go/index.vue
@@ -21,7 +21,7 @@
                 <TableSetting title="go-runtime-refresh" @search="search()" />
             </template>
             <template #main>
-                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="350">
+                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="260">
                     <el-table-column
                         :label="$t('commons.table.name')"
                         fix
diff --git a/frontend/src/views/website/runtime/java/index.vue b/frontend/src/views/website/runtime/java/index.vue
index 32045edbb..f29ea7c66 100644
--- a/frontend/src/views/website/runtime/java/index.vue
+++ b/frontend/src/views/website/runtime/java/index.vue
@@ -21,7 +21,7 @@
                 <TableSetting title="java-runtime-refresh" @search="search()" />
             </template>
             <template #main>
-                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="350">
+                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="260">
                     <el-table-column
                         :label="$t('commons.table.name')"
                         fix
diff --git a/frontend/src/views/website/runtime/node/index.vue b/frontend/src/views/website/runtime/node/index.vue
index d72fc97f7..6fdc36ce9 100644
--- a/frontend/src/views/website/runtime/node/index.vue
+++ b/frontend/src/views/website/runtime/node/index.vue
@@ -21,7 +21,7 @@
                 <TableSetting title="node-runtime-refresh" @search="search()" />
             </template>
             <template #main>
-                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="350">
+                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="260">
                     <el-table-column
                         :label="$t('commons.table.name')"
                         fix
diff --git a/frontend/src/views/website/runtime/php/index.vue b/frontend/src/views/website/runtime/php/index.vue
index 3a33e462e..0dfd615a8 100644
--- a/frontend/src/views/website/runtime/php/index.vue
+++ b/frontend/src/views/website/runtime/php/index.vue
@@ -21,7 +21,7 @@
                 <TableSetting title="php-runtime-refresh" @search="search()" />
             </template>
             <template #main>
-                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="350">
+                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="260">
                     <el-table-column
                         :label="$t('commons.table.name')"
                         fix
diff --git a/frontend/src/views/website/runtime/python/index.vue b/frontend/src/views/website/runtime/python/index.vue
index 1856bf041..4e9a9a218 100644
--- a/frontend/src/views/website/runtime/python/index.vue
+++ b/frontend/src/views/website/runtime/python/index.vue
@@ -21,7 +21,7 @@
                 <TableSetting title="python-runtime-refresh" @search="search()" />
             </template>
             <template #main>
-                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="350">
+                <ComplexTable :pagination-config="paginationConfig" :data="items" @search="search()" :heightDiff="260">
                     <el-table-column
                         :label="$t('commons.table.name')"
                         fix
diff --git a/frontend/src/views/website/ssl/index.vue b/frontend/src/views/website/ssl/index.vue
index 024c61885..669bd753b 100644
--- a/frontend/src/views/website/ssl/index.vue
+++ b/frontend/src/views/website/ssl/index.vue
@@ -42,6 +42,7 @@
                     v-loading="loading"
                     :columns="columns"
                     localKey="sslColumn"
+                    :height-diff="260"
                 >
                     <el-table-column type="selection" width="30" />
                     <el-table-column
diff --git a/frontend/src/views/website/website/config/index.vue b/frontend/src/views/website/website/config/index.vue
index 7b211ced2..99c6546bf 100644
--- a/frontend/src/views/website/website/config/index.vue
+++ b/frontend/src/views/website/website/config/index.vue
@@ -29,7 +29,7 @@
                 </el-button>
             </template>
             <template #main>
-                <MainDiv :heightDiff="320">
+                <MainDiv :heightDiff="260">
                     <Basic :website="website" v-if="index === 'basic'" :heightDiff="320"></Basic>
                     <Log :id="id" v-if="index === 'log'"></Log>
                     <Resource :id="id" v-if="index === 'resource'"></Resource>
diff --git a/frontend/src/views/website/website/index.vue b/frontend/src/views/website/website/index.vue
index d33246e70..19bcdc9e9 100644
--- a/frontend/src/views/website/website/index.vue
+++ b/frontend/src/views/website/website/index.vue
@@ -77,7 +77,7 @@
                     @sort-change="changeSort"
                     @search="search()"
                     :class="{ mask: nginxStatus != 'Running' }"
-                    :heightDiff="370"
+                    :heightDiff="310"
                     :columns="columns"
                     localKey="websiteColumn"
                 >