diff --git a/vue/src/views/iot/group/index.vue b/vue/src/views/iot/group/index.vue
index 5225ae87..bc2a63f8 100644
--- a/vue/src/views/iot/group/index.vue
+++ b/vue/src/views/iot/group/index.vue
@@ -26,7 +26,7 @@
                         <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
                     </template>
                 </el-table-column>
-                <el-table-column v-if="isAdmin" :label="$t('iot.group.index.637432-8')" align="center" prop="userName" width="100" />
+                <el-table-column v-if="isAdmin" :label="$t('iot.group.index.637432-8')" align="center" prop="userName" width="150" />
                 <el-table-column :label="$t('iot.group.index.637432-9')" align="left" header-align="center" prop="remark" />
                 <el-table-column :label="$t('iot.group.index.637432-10')" align="center" class-name="small-padding fixed-width" width="320">
                     <template slot-scope="scope">
diff --git a/vue/src/views/iot/product/index.vue b/vue/src/views/iot/product/index.vue
index f5f47c88..9117f362 100644
--- a/vue/src/views/iot/product/index.vue
+++ b/vue/src/views/iot/product/index.vue
@@ -48,10 +48,12 @@
                                     <dict-tag :options="dict.type.iot_device_type" :value="item.deviceType" size="mini" />
                                 </span>
                             </div>
-                            <div class="info-row">
+                            <div class="info-row" style="width: 150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis">
                                 <span class="info-value" style="display: flex">
                                     {{ $t('product.index.091251-18') }}：
-                                    <dict-tag :options="dict.type.iot_network_method" :value="item.networkMethod" size="mini" />
+                                    <el-tooltip :content="item.networkMethod" placement="top">
+                                        <dict-tag :options="dict.type.iot_network_method" :value="item.networkMethod" size="mini" />
+                                    </el-tooltip>
                                 </span>
                             </div>
                             <div class="info-row">
diff --git a/vue/src/views/iot/sip/mediaServer.vue b/vue/src/views/iot/sip/mediaServer.vue
index 075bc384..d233e5c7 100644
--- a/vue/src/views/iot/sip/mediaServer.vue
+++ b/vue/src/views/iot/sip/mediaServer.vue
@@ -30,14 +30,19 @@
                                 </div>
                             </el-col>
                         </el-row>
-                        <el-button-group style="margin-top: 10px">
-                            <el-button type="danger" size="mini" style="padding: 5px 10px" icon="el-icon-delete" v-hasPermi="['iot:video:remove']" @click="del(item)">{{ $t('del') }}</el-button>
-                            <el-button type="primary" size="mini" style="padding: 5px 15px" icon="el-icon-view" @click="view(item)" v-hasPermi="['iot:video:query']">{{ $t('look') }}</el-button>
-                            <el-button v-if="!istrue" type="success" size="mini" style="padding: 5px 15px" icon="el-icon-odometer" @click.native.prevent="edit(item)" v-hasPermi="['iot:video:edit']">
-                                {{ $t('edit') }}
-                            </el-button>
-                            <el-button v-else type="success" size="mini" style="padding: 5px 15px" icon="el-icon-odometer" :loading="true" disabled>{{ $t('sip.mediaServer.998535-5') }}</el-button>
-                        </el-button-group>
+                        <div class="card-footer">
+                            <div class="footer-left"></div>
+                            <div class="footer-actions">
+                                <el-button-group style="float: right; margin-top: 10px">
+                                    <el-button type="text" size="mini" style="padding: 5px 10px" icon="el-icon-delete" v-hasPermi="['iot:video:remove']" @click="del(item)">{{ $t('del') }}</el-button>
+                                    <el-button type="text" size="mini" style="padding: 5px 15px" icon="el-icon-view" @click="view(item)" v-hasPermi="['iot:video:query']">{{ $t('look') }}</el-button>
+                                    <el-button v-if="!istrue" type="text" size="mini" style="padding: 5px 15px" icon="el-icon-odometer" @click.native.prevent="edit(item)" v-hasPermi="['iot:video:edit']">
+                                        {{ $t('edit') }}
+                                    </el-button>
+                                    <el-button v-else type="text" size="mini" style="padding: 5px 15px" icon="el-icon-odometer" :loading="true" disabled>{{ $t('sip.mediaServer.998535-5') }}</el-button>
+                                </el-button-group>
+                            </div>
+                        </div>
                     </el-card>
                 </el-col>
             </el-row>
@@ -165,7 +170,7 @@ export default {
 };
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .card-item {
     border-radius: 10px;
     padding: 15px 0px;
@@ -179,4 +184,31 @@ export default {
 ::v-deep .pagination-container[data-v-72233bcd] {
     background: none;
 }
+.card-footer {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    border-top: 1px solid #f0f0f0;
+    margin-top: 10px;
+    .footer-actions {
+        display: flex;
+        align-items: center;
+        gap: 12px;
+
+        i {
+            font-size: 18px;
+            color: #606266;
+            cursor: pointer;
+            transition: all 0.3s;
+
+            &:hover {
+                color: #409eff;
+            }
+
+            &.el-icon-delete:hover {
+                color: #f56c6c;
+            }
+        }
+    }
+}
 </style>
diff --git a/vue/src/views/monitor/server/index.vue b/vue/src/views/monitor/server/index.vue
index c34177ee..756ec92b 100644
--- a/vue/src/views/monitor/server/index.vue
+++ b/vue/src/views/monitor/server/index.vue
@@ -1,236 +1,375 @@
 <template>
-  <div class="app-container">
-    <el-row>
-      <el-col :span="12" class="card-box">
-        <el-card>
-          <div slot="header"><span><i class="el-icon-cpu"></i> CPU</span></div>
-          <div class="el-table el-table--enable-row-hover el-table--medium">
-            <table cellspacing="0" style="width: 100%;">
-              <thead>
-                <tr>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-0') }}</div></th>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-1') }}</div></th>
-                </tr>
-              </thead>
-              <tbody>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-2') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.cpuNum }}</div></td>
-                </tr>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-3') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.used }}%</div></td>
-                </tr>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-4') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.sys }}%</div></td>
-                </tr>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-5') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.free }}%</div></td>
-                </tr>
-              </tbody>
-            </table>
-          </div>
-        </el-card>
-      </el-col>
+    <div class="app-container">
+        <el-row>
+            <el-col :span="12" class="card-box">
+                <el-card>
+                    <div slot="header">
+                        <span>
+                            <i class="el-icon-cpu"></i>
+                            CPU
+                        </span>
+                    </div>
+                    <div class="el-table el-table--enable-row-hover el-table--medium">
+                        <table cellspacing="0" style="width: 100%">
+                            <thead>
+                                <tr>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-0') }}</div>
+                                    </th>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-1') }}</div>
+                                    </th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-2') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.cpu">{{ server.cpu.cpuNum }}</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-3') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.cpu">{{ server.cpu.used }}%</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-4') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.cpu">{{ server.cpu.sys }}%</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-5') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.cpu">{{ server.cpu.free }}%</div>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </el-card>
+            </el-col>
 
-      <el-col :span="12" class="card-box">
-        <el-card>
-          <div slot="header"><span><i class="el-icon-tickets"></i> {{ $t('monitor.server.index.501236-6') }}</span></div>
-          <div class="el-table el-table--enable-row-hover el-table--medium">
-            <table cellspacing="0" style="width: 100%;">
-              <thead>
-                <tr>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-0') }}</div></th>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-6') }}</div></th>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-7') }}</div></th>
-                </tr>
-              </thead>
-              <tbody>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-8') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.total }}G</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.total }}M</div></td>
-                </tr>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-9') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.used}}G</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.used}}M</div></td>
-                </tr>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-10') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.free }}G</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.free }}M</div></td>
-                </tr>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-11') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem" :class="{'text-danger': server.mem.usage > 80}">{{ server.mem.usage }}%</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm" :class="{'text-danger': server.jvm.usage > 80}">{{ server.jvm.usage }}%</div></td>
-                </tr>
-              </tbody>
-            </table>
-          </div>
-        </el-card>
-      </el-col>
+            <el-col :span="12" class="card-box">
+                <el-card>
+                    <div slot="header">
+                        <span>
+                            <i class="el-icon-tickets"></i>
+                            {{ $t('monitor.server.index.501236-6') }}
+                        </span>
+                    </div>
+                    <div class="el-table el-table--enable-row-hover el-table--medium">
+                        <table cellspacing="0" style="width: 100%">
+                            <thead>
+                                <tr>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-0') }}</div>
+                                    </th>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-6') }}</div>
+                                    </th>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-7') }}</div>
+                                    </th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-8') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.mem">{{ server.mem.total }}G</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.jvm">{{ server.jvm.total }}M</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-9') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.mem">{{ server.mem.used }}G</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.jvm">{{ server.jvm.used }}M</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-10') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.mem">{{ server.mem.free }}G</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.jvm">{{ server.jvm.free }}M</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-11') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.mem" :class="{ 'text-danger': server.mem.usage > 80 }">{{ server.mem.usage }}%</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.jvm" :class="{ 'text-danger': server.jvm.usage > 80 }">{{ server.jvm.usage }}%</div>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </el-card>
+            </el-col>
 
-      <el-col :span="24" class="card-box">
-        <el-card>
-          <div slot="header">
-            <span><i class="el-icon-monitor"></i> {{ $t('monitor.server.index.501236-12') }}</span>
-          </div>
-          <div class="el-table el-table--enable-row-hover el-table--medium">
-            <table cellspacing="0" style="width: 100%;">
-              <tbody>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-13') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.computerName }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-14') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.osName }}</div></td>
-                </tr>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-15') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.computerIp }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-16') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.osArch }}</div></td>
-                </tr>
-              </tbody>
-            </table>
-          </div>
-        </el-card>
-      </el-col>
+            <el-col :span="24" class="card-box">
+                <el-card>
+                    <div slot="header">
+                        <span>
+                            <i class="el-icon-monitor"></i>
+                            {{ $t('monitor.server.index.501236-12') }}
+                        </span>
+                    </div>
+                    <div class="el-table el-table--enable-row-hover el-table--medium">
+                        <table cellspacing="0" style="width: 100%">
+                            <tbody>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-13') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.sys">{{ server.sys.computerName }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-14') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.sys">{{ server.sys.osName }}</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-15') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.sys">{{ server.sys.computerIp }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-16') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.sys">{{ server.sys.osArch }}</div>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </el-card>
+            </el-col>
 
-      <el-col :span="24" class="card-box">
-        <el-card>
-          <div slot="header">
-            <span><i class="el-icon-coffee-cup"></i> {{ $t('monitor.server.index.501236-17') }}</span>
-          </div>
-          <div class="el-table el-table--enable-row-hover el-table--medium">
-            <table cellspacing="0" style="width: 100%;table-layout:fixed;">
-              <tbody>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-18') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.name }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-19') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.version }}</div></td>
-                </tr>
-                <tr>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-20') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.startTime }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-21') }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.runTime }}</div></td>
-                </tr>
-                <tr>
-                  <td colspan="1" class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-22') }}</div></td>
-                  <td colspan="3" class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.home }}</div></td>
-                </tr>
-                <tr>
-                  <td colspan="1" class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-23') }}</div></td>
-                  <td colspan="3" class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.userDir }}</div></td>
-                </tr>
-                <tr>
-                  <td colspan="1" class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-24') }}</div></td>
-                  <td colspan="3" class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.inputArgs }}</div></td>
-                </tr>
-              </tbody>
-            </table>
-          </div>
-        </el-card>
-      </el-col>
+            <el-col :span="24" class="card-box">
+                <el-card>
+                    <div slot="header">
+                        <span>
+                            <i class="el-icon-coffee-cup"></i>
+                            {{ $t('monitor.server.index.501236-17') }}
+                        </span>
+                    </div>
+                    <div class="el-table el-table--enable-row-hover el-table--medium">
+                        <table cellspacing="0" style="width: 100%; table-layout: fixed">
+                            <tbody>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-18') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.jvm">{{ server.jvm.name }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-19') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.jvm">{{ server.jvm.version }}</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-20') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.jvm">{{ server.jvm.startTime }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-21') }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.jvm">{{ server.jvm.runTime }}</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td colspan="1" class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-22') }}</div>
+                                    </td>
+                                    <td colspan="3" class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.jvm">{{ server.jvm.home }}</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td colspan="1" class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-23') }}</div>
+                                    </td>
+                                    <td colspan="3" class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.sys">{{ server.sys.userDir }}</div>
+                                    </td>
+                                </tr>
+                                <tr>
+                                    <td colspan="1" class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-24') }}</div>
+                                    </td>
+                                    <td colspan="3" class="el-table__cell is-leaf">
+                                        <div class="cell" v-if="server.jvm">{{ server.jvm.inputArgs }}</div>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </el-card>
+            </el-col>
 
-      <el-col :span="24" class="card-box">
-        <el-card>
-          <div slot="header">
-            <span><i class="el-icon-receiving"></i> {{ $t('monitor.server.index.501236-25') }}</span>
-          </div>
-          <div class="el-table el-table--enable-row-hover el-table--medium">
-            <table cellspacing="0" style="width: 100%;">
-              <thead>
-                <tr>
-                  <th class="el-table__cell el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-26') }}</div></th>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-27') }}</div></th>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-28') }}</div></th>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-29') }}</div></th>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-30') }}</div></th>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-31') }}</div></th>
-                  <th class="el-table__cell is-leaf"><div class="cell">{{ $t('monitor.server.index.501236-32') }}</div></th>
-                </tr>
-              </thead>
-              <tbody v-if="server.sysFiles">
-                <tr v-for="(sysFile, index) in server.sysFiles" :key="index">
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.dirName }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.sysTypeName }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.typeName }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.total }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.free }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.used }}</div></td>
-                  <td class="el-table__cell is-leaf"><div class="cell" :class="{'text-danger': sysFile.usage > 80}">{{ sysFile.usage }}%</div></td>
-                </tr>
-              </tbody>
-            </table>
-          </div>
-        </el-card>
-      </el-col>
-    </el-row>
-  </div>
+            <el-col :span="24" class="card-box">
+                <el-card>
+                    <div slot="header">
+                        <span>
+                            <i class="el-icon-receiving"></i>
+                            {{ $t('monitor.server.index.501236-25') }}
+                        </span>
+                    </div>
+                    <div class="el-table el-table--enable-row-hover el-table--medium">
+                        <table cellspacing="0" style="width: 100%">
+                            <thead>
+                                <tr>
+                                    <th class="el-table__cell el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-26') }}</div>
+                                    </th>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-27') }}</div>
+                                    </th>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-28') }}</div>
+                                    </th>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-29') }}</div>
+                                    </th>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-30') }}</div>
+                                    </th>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-31') }}</div>
+                                    </th>
+                                    <th class="el-table__cell is-leaf">
+                                        <div class="cell">{{ $t('monitor.server.index.501236-32') }}</div>
+                                    </th>
+                                </tr>
+                            </thead>
+                            <tbody v-if="server.sysFiles">
+                                <tr v-for="(sysFile, index) in server.sysFiles" :key="index">
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ sysFile.dirName }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ sysFile.sysTypeName }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ sysFile.typeName }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ sysFile.total }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ sysFile.free }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell">{{ sysFile.used }}</div>
+                                    </td>
+                                    <td class="el-table__cell is-leaf">
+                                        <div class="cell" :class="{ 'text-danger': sysFile.usage > 80 }">{{ sysFile.usage }}%</div>
+                                    </td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </el-card>
+            </el-col>
+        </el-row>
+    </div>
 </template>
 
 <script>
-import { getServer } from "@/api/monitor/server";
+import { getServer } from '@/api/monitor/server';
 
 export default {
-  name: "Server",
-  data() {
-    return {
-      // 服务器信息
-      server: []
-    };
-  },
-  created() {
-    this.getList();
-    this.openLoading();
-  },
-  methods: {
-    /** 查询服务器信息 */
-    getList() {
-      getServer().then(response => {
-        this.server = response.data;
-        this.$modal.closeLoading();
-      });
+    name: 'Server',
+    data() {
+        return {
+            // 服务器信息
+            server: [],
+        };
+    },
+    created() {
+        this.getList();
+        this.openLoading();
+    },
+    methods: {
+        /** 查询服务器信息 */
+        getList() {
+            getServer().then((response) => {
+                this.server = response.data;
+                this.$modal.closeLoading();
+            });
+        },
+        // 打开加载层
+        openLoading() {
+            this.$modal.loading(this.$i18n.t('monitor.server.index.501236-33'));
+        },
     },
-    // 打开加载层
-    openLoading() {
-      this.$modal.loading(this.$i18n.t('monitor.server.index.501236-33'));
-    }
-  }
 };
 </script>
 
-</script>
-
 <style lang="scss" scoped>
 .table-header {
-  background-color: #f5f7fa !important;
-  color: #606266;
-  font-weight: 600;
-  text-align: center;
-}
-
-::v-deep .el-table {
-  th {
-    background-color: #f5f7fa;
+    background-color: #f5f7fa !important;
     color: #606266;
     font-weight: 600;
     text-align: center;
-  }
-  
-  td {
-    padding: 12px 0;
-  }
-  
-  .el-table__body tr:hover > td {
-    background-color: #f5f7fa !important;
-  }
+}
+
+::v-deep .el-table {
+    th {
+        background-color: #f5f7fa;
+        color: #606266;
+        font-weight: 600;
+        text-align: center;
+    }
+
+    td {
+        padding: 12px 0;
+    }
+
+    .el-table__body tr:hover > td {
+        background-color: #f5f7fa !important;
+    }
 }
 
 .pagination-container {
@@ -241,7 +380,7 @@ export default {
 }
 
 ::v-deep .el-pagination {
-  padding: 0;
-  text-align: right;
+    padding: 0;
+    text-align: right;
 }
 </style>