src/views/dataManagement/threeModelManagement/index.vue

@@ -27,7 +27,7 @@
     <template #header-actions>
       <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
       <el-button @click="resetQuery">重置</el-button>
-      <el-button type="primary" icon="el-icon-plus" @click="openAdd">新建</el-button>
+      <el-button icon="el-icon-plus" @click="openAdd">新建</el-button>
       <!--<el-button type="danger" icon="el-icon-delete" :disabled="!selectedRows.length" @click="handleBatchDelete">-->
       <!--  批量删除-->
       <!--</el-button>-->
@@ -113,11 +113,11 @@
       :title="addOrUpdateTitle"
       :visible.sync="addVisible"
       width="720px"
+      :class="['dark-dialog', null]"
       :close-on-click-modal="false"
-      class="model-dialog"
       @closed="onAddClosed"
     >
-      <el-form ref="addFormRef" :model="addForm" :rules="addRules" label-width="110px" size="small">
+      <el-form style="color: #fff" ref="addFormRef" :model="addForm" :rules="addRules" label-width="110px" size="small">
         <el-row :gutter="16">
           <el-col :span="12">
             <el-form-item label="模型名称" prop="modelName">
@@ -362,15 +362,20 @@ export default {
       this.$message.success('状态已更新')
     },
     handleDelete(row) {
-      // this.allData = this.allData.filter(r => r.code !== row.code)
-      delModel(row.id).then(res => {
-        if (res.code !== 0) {
-          return
-        }
-        this.$message.success('删除成功')
-        this.handleQuery()
-      }).catch(() => {
-      })
+      this.$confirm('确认删除？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        delModel(row.id).then(res => {
+          if (res.code !== 0) {
+            return
+          }
+          this.$message.success('删除成功')
+          this.handleQuery()
+        }).catch(() => {
+        })
+      }).catch(()=>{})
     },
     handleBatchDelete() {
       const ids = new Set(this.selectedRows.map(r => r.code))
@@ -490,6 +495,93 @@ export default {
 }
 </script>
 
+<style lang="scss">
+.el-form-item__label {
+  color: #fff !important;
+}
+.el-dialog__title {
+  color: #e0e6ed !important;
+  font-size: 16px !important;
+  font-weight: bold !important;
+}
+.dark-dialog {
+  .el-dialog {
+    background: var(--dark-dialog-bg, #2d3a4b);
+    border: 1px solid #425163;
+    border-radius: 4px;
+
+    &__header {
+      border-bottom: 1px solid #425163;
+      padding: 15px 20px;
+
+      .el-dialog__title,
+      .dark-dialog-title {
+        color: #e0e6ed !important;
+        font-size: 16px !important;
+        font-weight: bold !important;
+      }
+
+      .el-dialog__headerbtn {
+        .el-dialog__close {
+          color: #8796ad;
+
+          &:hover {
+            color: #e0e6ed;
+          }
+        }
+      }
+    }
+
+    &__body {
+      color: #e0e6ed;
+      padding: 20px;
+
+      .el-descriptions {
+        &__header {
+          .el-descriptions__title {
+            color: #e0e6ed;
+          }
+        }
+
+        &__body {
+          background: transparent;
+
+          .el-descriptions-item__label {
+            color: #8796ad;
+            background: #1e2733;
+          }
+
+          .el-descriptions-item__content {
+            color: #e0e6ed;
+            background: #1e2733;
+          }
+        }
+      }
+    }
+
+    &__footer {
+      border-top: 1px solid #425163;
+      padding: 10px 20px;
+      text-align: right;
+
+      .el-button {
+        &.dark-button {
+          background-color: #425163;
+          border-color: #5a6b7d;
+          color: #e0e6ed;
+
+          &:hover {
+            background-color: #5a6b7d;
+            border-color: #677a8c;
+            color: #ffffff;
+          }
+        }
+      }
+    }
+  }
+}
+</style>
+
 <style>
 /* 统一表格暗色风格，消除白色条纹和容器 */
 .three-model-container .el-table,
@@ -510,9 +602,18 @@ export default {
   color: #e6efff;
 }
 
+.three-model-container .el-table td {
+  color: #ffffff !important;
+}
+
 .three-model-container .el-table th {
   background: rgba(30, 55, 95, 0.85) !important;
-  color: #cfd9e6 !important;
+  color: #ffffff !important;
+}
+
+.three-model-container .el-table th .cell {
+  font-size: 18px !important;
+  font-weight: 700 !important;
 }
 
 .three-model-container .el-table--striped .el-table__body tr.el-table__row--striped td {

src/views/dataManagement/threeModelTypeManagement/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <Container :query-form="queryForm" class="mtm-container">
+  <Container :query-form="queryForm" class="three-model-container">
     <!-- 头部查询表单 -->
     <template #query-form>
       <el-form-item label="模型名称">
@@ -38,7 +38,7 @@
     <template #header-actions>
       <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
       <el-button @click="resetQuery">重置</el-button>
-      <el-button type="primary" icon="el-icon-plus" @click="openAdd">新建</el-button>
+      <el-button icon="el-icon-plus" @click="openAdd">新建</el-button>
       <!--<el-button-->
       <!--  type="danger"-->
       <!--  icon="el-icon-delete"-->
@@ -138,8 +138,8 @@
       :title="addOrUpdateTitle"
       :visible.sync="addVisible"
       width="520px"
+      :class="['dark-dialog', null]"
       :close-on-click-modal="false"
-      class="mtm-dialog"
       @closed="onAddClosed"
     >
       <el-form ref="addFormRef" :model="addForm" :rules="addRules" label-width="110px" size="small">
@@ -338,7 +338,7 @@ export default {
       this.addVisible = true
     },
     handleDelete(row) {
-      this.$confirm(`确认删除「${row.name}」吗？`, '提示', {type: 'warning'})
+      this.$confirm(`确认删除吗？`, '提示', {type: 'warning'})
         .then(() => {
           delModel({id: row.id}).then(res => {
             if (res.code !== 0) {
@@ -443,113 +443,187 @@ export default {
 }
 </script>
 
-<!-- 暗色风格 -->
-<style>
-.mtm-container .el-table {
-  flex: 1;
-  color: var(--dark-text-primary);
-  border-color: var(--dark-border-color);
+<style lang="scss">
+.el-form-item__label {
+  color: #fff !important;
 }
-
-.mtm-container .el-table th {
-  background-color: rgba(30, 55, 95, .3);
-  border-color: var(--dark-border-color);
-  color: var(--dark-text-primary);
+.el-dialog__title {
+  color: #e0e6ed !important;
+  font-size: 16px !important;
+  font-weight: bold !important;
 }
+.dark-dialog {
+  .el-dialog {
+    background: var(--dark-dialog-bg, #2d3a4b);
+    border: 1px solid #425163;
+    border-radius: 4px;
+
+    &__header {
+      border-bottom: 1px solid #425163;
+      padding: 15px 20px;
+
+      .el-dialog__title,
+      .dark-dialog-title {
+        color: #e0e6ed !important;
+        font-size: 16px !important;
+        font-weight: bold !important;
+      }
 
-.mtm-container .el-table tr {
-  background-color: var(--dark-card-bg);
-}
+      .el-dialog__headerbtn {
+        .el-dialog__close {
+          color: #8796ad;
 
-.mtm-container .el-table tr:hover > td {
-  background-color: rgba(45, 75, 120, .2);
-}
+          &:hover {
+            color: #e0e6ed;
+          }
+        }
+      }
+    }
 
-.mtm-container .el-table td {
-  border-color: var(--dark-border-color);
-}
+    &__body {
+      color: #e0e6ed;
+      padding: 20px;
 
-.mtm-container .el-table--striped .el-table__body tr.el-table__row--striped td {
-  background-color: rgba(30, 55, 95, .1);
-}
+      .el-descriptions {
+        &__header {
+          .el-descriptions__title {
+            color: #e0e6ed;
+          }
+        }
+
+        &__body {
+          background: transparent;
 
-.mtm-container .el-table__current-row td {
-  background-color: rgba(64, 150, 255, .15) !important;
+          .el-descriptions-item__label {
+            color: #8796ad;
+            background: #1e2733;
+          }
+
+          .el-descriptions-item__content {
+            color: #e0e6ed;
+            background: #1e2733;
+          }
+        }
+      }
+    }
+
+    &__footer {
+      border-top: 1px solid #425163;
+      padding: 10px 20px;
+      text-align: right;
+
+      .el-button {
+        &.dark-button {
+          background-color: #425163;
+          border-color: #5a6b7d;
+          color: #e0e6ed;
+
+          &:hover {
+            background-color: #5a6b7d;
+            border-color: #677a8c;
+            color: #ffffff;
+          }
+        }
+      }
+    }
+  }
 }
+</style>
 
-.mtm-container .el-pagination {
-  color: var(--dark-text-secondary);
+<style>
+/* 统一表格暗色风格，消除白色条纹和容器 */
+.three-model-container .el-table,
+.three-model-container .el-table__fixed,
+.three-model-container .el-table__fixed-right {
+  background: rgba(15, 31, 56, 0.86) !important;
 }
 
-.mtm-container .el-pagination button,
-.mtm-container .el-pagination span:not([class*='el-icon']),
-.mtm-container .el-pagination .el-pager li {
-  color: var(--dark-text-secondary);
-  background-color: var(--dark-card-bg);
-  border-color: var(--dark-border-color);
+.three-model-container .el-table__body-wrapper,
+.three-model-container .el-table__fixed-body-wrapper {
+  background: rgba(15, 31, 56, 0.86) !important;
 }
 
-.mtm-container .el-pagination .el-pager li.active {
-  background-color: var(--dark-primary-color);
-  color: #fff;
+.three-model-container .el-table td,
+.three-model-container .el-table th.is-leaf {
+  background: rgba(15, 31, 56, 0.86) !important;
+  border-color: rgba(255, 255, 255, 0.08) !important;
+  color: #e6efff;
 }
 
-.mtm-container .el-pagination .el-pager li:hover {
-  color: var(--dark-primary-color);
+.three-model-container .el-table td {
+  color: #ffffff !important;
 }
 
-.mtm-container .el-form-item__label {
-  color: var(--dark-text-secondary);
+.three-model-container .el-table th {
+  background: rgba(30, 55, 95, 0.85) !important;
+  color: #ffffff !important;
 }
 
-.mtm-container .el-input__inner,
-.mtm-container .el-select__inner,
-.mtm-container .el-date-editor .el-input__inner {
-  background-color: var(--dark-bg-color);
-  border-color: var(--dark-border-color);
-  color: var(--dark-text-primary);
+.three-model-container .el-table th .cell {
+  font-size: 18px !important;
+  font-weight: 700 !important;
 }
 
-.mtm-dialog .el-dialog {
-  background-color: var(--dark-card-bg);
-  border: 1px solid var(--dark-border-color);
+.three-model-container .el-table--striped .el-table__body tr.el-table__row--striped td {
+  background: rgba(15, 31, 56, 0.9) !important;
 }
 
-.mtm-dialog .el-dialog__title {
-  color: var(--dark-text-primary);
+.three-model-container .el-table__body tr:hover > td {
+  background: rgba(30, 64, 175, 0.25) !important;
 }
 
-.mtm-dialog .el-dialog__header {
-  border-bottom: 1px solid var(--dark-border-color);
+.three-model-container .el-table__current-row > td {
+  background: rgba(64, 150, 255, 0.2) !important;
 }
 
-.mtm-dialog .el-dialog__footer {
-  border-top: 1px solid var(--dark-border-color);
+.three-model-container .el-table__fixed::before,
+.three-model-container .el-table__fixed-right::before,
+.three-model-container .el-table::before {
+  background-color: rgba(255, 255, 255, 0.08) !important;
 }
-</style>
 
-<style scoped>
-.table-container {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
+.three-model-container .el-table__gutter,
+.three-model-container .el-table__fixed-right .el-table__fixed-header-wrapper,
+.three-model-container .el-table__fixed-right .el-table__fixed-body-wrapper,
+.three-model-container .el-table__fixed .el-table__fixed-header-wrapper,
+.three-model-container .el-table__fixed .el-table__fixed-body-wrapper {
+  background: rgba(15, 31, 56, 0.86) !important;
 }
 
 .pagination-container {
   margin-top: 14px;
   display: flex;
   justify-content: flex-end;
-  align-items: center;
 }
 
 .action-bar {
   display: flex;
   justify-content: space-around;
-  align-items: center;
   width: 100%;
 }
 
+.model-dialog .el-dialog {
+  background: #0b254a;
+  border: 1px solid #364a64;
+}
+
+.model-dialog .el-dialog__title {
+  color: #e6efff;
+}
+
+.model-dialog .el-dialog__header,
+.model-dialog .el-dialog__footer {
+  border-color: #364a64;
+}
+
+.model-dialog .el-upload-list__item {
+  background: rgba(255, 255, 255, 0.04);
+  border-color: #364a64;
+  color: #e6efff;
+}
+
 .footer-tips {
-  color: var(--dark-text-secondary);
+  color: #94a3b8;
+  margin-left: 10px;
 }
 </style>

src/views/equipment/equipment.vue

@@ -22,7 +22,7 @@
     <template #header-actions>
       <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
       <el-button @click="resetQuery">重置</el-button>
-      <el-button type="primary" icon="el-icon-plus" @click="openAdd">新建</el-button>
+      <el-button icon="el-icon-plus" @click="openAdd">新建</el-button>
     </template>
 
     <!-- 表格 -->
@@ -95,8 +95,8 @@
       :title="addOrUpdateTitle"
       :visible.sync="addVisible"
       width="720px"
+      :class="['dark-dialog', null]"
       :close-on-click-modal="false"
-      class="model-dialog"
       @closed="onAddClosed"
     >
       <el-form ref="addFormRef" :model="addForm" :rules="addRules" label-width="110px" size="small">
@@ -311,15 +311,20 @@ export default {
       this.$message.success('状态已更新')
     },
     handleDelete(row) {
-      // this.allData = this.allData.filter(r => r.code !== row.code)
-      delEqu(row.id).then(res => {
-        if (res.code !== 0) {
-          return
-        }
-        this.$message.success('删除成功')
-        this.handleQuery()
-      }).catch(() => {
-      })
+      this.$confirm('确认删除？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        delEqu(row.id).then(res => {
+          if (res.code !== 0) {
+            return
+          }
+          this.$message.success('删除成功')
+          this.handleQuery()
+        }).catch(() => {
+        })
+      }).catch(()=>{})
     },
     /* ====== 新增或修改弹窗 ====== */
     openAdd() {
@@ -368,6 +373,93 @@ export default {
 }
 </script>
 
+<style lang="scss">
+.el-form-item__label {
+  color: #fff !important;
+}
+.el-dialog__title {
+  color: #e0e6ed !important;
+  font-size: 16px !important;
+  font-weight: bold !important;
+}
+.dark-dialog {
+  .el-dialog {
+    background: var(--dark-dialog-bg, #2d3a4b);
+    border: 1px solid #425163;
+    border-radius: 4px;
+
+    &__header {
+      border-bottom: 1px solid #425163;
+      padding: 15px 20px;
+
+      .el-dialog__title,
+      .dark-dialog-title {
+        color: #e0e6ed !important;
+        font-size: 16px !important;
+        font-weight: bold !important;
+      }
+
+      .el-dialog__headerbtn {
+        .el-dialog__close {
+          color: #8796ad;
+
+          &:hover {
+            color: #e0e6ed;
+          }
+        }
+      }
+    }
+
+    &__body {
+      color: #e0e6ed;
+      padding: 20px;
+
+      .el-descriptions {
+        &__header {
+          .el-descriptions__title {
+            color: #e0e6ed;
+          }
+        }
+
+        &__body {
+          background: transparent;
+
+          .el-descriptions-item__label {
+            color: #8796ad;
+            background: #1e2733;
+          }
+
+          .el-descriptions-item__content {
+            color: #e0e6ed;
+            background: #1e2733;
+          }
+        }
+      }
+    }
+
+    &__footer {
+      border-top: 1px solid #425163;
+      padding: 10px 20px;
+      text-align: right;
+
+      .el-button {
+        &.dark-button {
+          background-color: #425163;
+          border-color: #5a6b7d;
+          color: #e0e6ed;
+
+          &:hover {
+            background-color: #5a6b7d;
+            border-color: #677a8c;
+            color: #ffffff;
+          }
+        }
+      }
+    }
+  }
+}
+</style>
+
 <style>
 /* 统一表格暗色风格，消除白色条纹和容器 */
 .three-model-container .el-table,
@@ -388,9 +480,18 @@ export default {
   color: #e6efff;
 }
 
+.three-model-container .el-table td {
+  color: #ffffff !important;
+}
+
 .three-model-container .el-table th {
   background: rgba(30, 55, 95, 0.85) !important;
-  color: #cfd9e6 !important;
+  color: #ffffff !important;
+}
+
+.three-model-container .el-table th .cell {
+  font-size: 18px !important;
+  font-weight: 700 !important;
 }
 
 .three-model-container .el-table--striped .el-table__body tr.el-table__row--striped td {

src/views/equipment/equipmentModel.vue

@@ -17,7 +17,7 @@
     <template #header-actions>
       <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
       <el-button @click="resetQuery">重置</el-button>
-      <el-button type="primary" icon="el-icon-plus" @click="openAdd">新建</el-button>
+      <el-button icon="el-icon-plus" @click="openAdd">新建</el-button>
     </template>
 
     <!-- 表格 -->
@@ -33,16 +33,14 @@
         <!--<el-table-column type="index" label="序号" width="60"/>-->
         <el-table-column prop="zbTypeName" label="所属装备类型" width="120" align="center">
           <template slot-scope="{ row }">
-            <span>{{ row.zbTypeId }}</span>
-            <!--<span v-if="zbTypeList.length > 0">{{ zbTypeList.find(item => Number(item.id) === row.zbTypeId).typeName }}</span>-->
-            <!--<span v-else>-</span>-->
+            <span>{{ row.zbTypeName }}</span>
           </template>
         </el-table-column>
         <el-table-column prop="zbModelName" label="装备型号名称" align="center"/>
         <el-table-column prop="zbModelRemark" label="装备型号备注" align="center"/>
         <el-table-column prop="zbModelIcon" label="美军标图标" align="center">
           <template slot-scope="{row}">
-            <vab-icon :icon="['fas', row.zbModelIcon]" />
+            <vab-icon :icon="['fas', row.zbModelIcon]"/>
           </template>
         </el-table-column>
         <el-table-column prop="createBy" label="创建人" width="120" align="center" sortable/>
@@ -77,8 +75,8 @@
       :title="addOrUpdateTitle"
       :visible.sync="addVisible"
       width="720px"
+      :class="['dark-dialog', null]"
       :close-on-click-modal="false"
-      class="model-dialog"
       @closed="onAddClosed"
     >
       <el-form ref="addFormRef" :model="addForm" :rules="addRules" label-width="110px" size="small">
@@ -235,12 +233,12 @@ export default {
         ],
       },
       addRules: {
-        zbTypeId: [ { required: true, message: '装备类型ID不能为空', trigger: 'change' }],
+        zbTypeId: [{required: true, message: '装备类型ID不能为空', trigger: 'change'}],
         zbModelName: [
-          { required: true, message: '装备型号名称不能为空', trigger: 'blur' },
+          {required: true, message: '装备型号名称不能为空', trigger: 'blur'},
           // { max: 50, message: '装备型号名称长度不能超过 50 个字符', trigger: 'blur' }
         ],
-        zbModelRemark: [{ required: true, max: 200, message: '装备型号备注长度不能超过 200 个字符', trigger: 'blur' }],
+        zbModelRemark: [{required: true, max: 200, message: '装备型号备注长度不能超过 200 个字符', trigger: 'blur'}],
         // zbModelIcon 验证：选填
         zbModelIcon: [],
         // zbModelJson 验证：自定义验证，确保数组至少有一条数据，且每条数据的 sourceName、sourceCode、sourceType 不为空
@@ -289,7 +287,7 @@ export default {
       this.$refs["icon"].showIcon();
     },
     // 选择完 icon 监听事件
-    closeIcon(icon){
+    closeIcon(icon) {
       this.addForm.zbModelIcon = icon;
     },
     dialogEdit(row) {
@@ -352,9 +350,7 @@ export default {
     handleEdit(row) {
       this.addForm = {...row}
       this.addForm.zbTypeId = Number(row.zbTypeId)
-      if (typeof row.zbModelJson != 'string') {
-        this.addForm.zbModelJson = JSON.parse(row.zbModelJson)
-      }
+      this.addForm.zbModelJson = JSON.parse(row.zbModelJson)
       // getEquDetails(row.id).then(res => {
       //   console.log(res)
       // })
@@ -362,13 +358,19 @@ export default {
       this.addVisible = true
     },
     handleDelete(row) {
-      // this.allData = this.allData.filter(r => r.code !== row.code)
-      equModelDel(row.id).then(res => {
-        if (res.code !== 0) {
-          return
-        }
-        this.$message.success('删除成功')
-        this.handleQuery()
+      this.$confirm('确认删除？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        equModelDel(row.id).then(res => {
+          if (res.code !== 0) {
+            return
+          }
+          this.$message.success('删除成功')
+          this.handleQuery()
+        }).catch(() => {
+        })
       }).catch(() => {
       })
     },
@@ -428,6 +430,93 @@ export default {
 }
 </script>
 
+<style lang="scss">
+.el-form-item__label {
+  color: #fff !important;
+}
+.el-dialog__title {
+  color: #e0e6ed !important;
+  font-size: 16px !important;
+  font-weight: bold !important;
+}
+.dark-dialog {
+  .el-dialog {
+    background: var(--dark-dialog-bg, #2d3a4b);
+    border: 1px solid #425163;
+    border-radius: 4px;
+
+    &__header {
+      border-bottom: 1px solid #425163;
+      padding: 15px 20px;
+
+      .el-dialog__title,
+      .dark-dialog-title {
+        color: #e0e6ed !important;
+        font-size: 16px !important;
+        font-weight: bold !important;
+      }
+
+      .el-dialog__headerbtn {
+        .el-dialog__close {
+          color: #8796ad;
+
+          &:hover {
+            color: #e0e6ed;
+          }
+        }
+      }
+    }
+
+    &__body {
+      color: #e0e6ed;
+      padding: 20px;
+
+      .el-descriptions {
+        &__header {
+          .el-descriptions__title {
+            color: #e0e6ed;
+          }
+        }
+
+        &__body {
+          background: transparent;
+
+          .el-descriptions-item__label {
+            color: #8796ad;
+            background: #1e2733;
+          }
+
+          .el-descriptions-item__content {
+            color: #e0e6ed;
+            background: #1e2733;
+          }
+        }
+      }
+    }
+
+    &__footer {
+      border-top: 1px solid #425163;
+      padding: 10px 20px;
+      text-align: right;
+
+      .el-button {
+        &.dark-button {
+          background-color: #425163;
+          border-color: #5a6b7d;
+          color: #e0e6ed;
+
+          &:hover {
+            background-color: #5a6b7d;
+            border-color: #677a8c;
+            color: #ffffff;
+          }
+        }
+      }
+    }
+  }
+}
+</style>
+
 <style>
 /* 统一表格暗色风格，消除白色条纹和容器 */
 .three-model-container .el-table,
@@ -448,9 +537,18 @@ export default {
   color: #e6efff;
 }
 
+.three-model-container .el-table td {
+  color: #ffffff !important;
+}
+
 .three-model-container .el-table th {
   background: rgba(30, 55, 95, 0.85) !important;
-  color: #cfd9e6 !important;
+  color: #ffffff !important;
+}
+
+.three-model-container .el-table th .cell {
+  font-size: 18px !important;
+  font-weight: 700 !important;
 }
 
 .three-model-container .el-table--striped .el-table__body tr.el-table__row--striped td {

src/views/equipment/equipmentType.vue

@@ -17,7 +17,7 @@
     <template #header-actions>
       <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
       <el-button @click="resetQuery">重置</el-button>
-      <el-button type="primary" icon="el-icon-plus" @click="openAdd">新建</el-button>
+      <el-button icon="el-icon-plus" @click="openAdd">新建</el-button>
     </template>
 
     <!-- 表格 -->
@@ -65,8 +65,8 @@
       :title="addOrUpdateTitle"
       :visible.sync="addVisible"
       width="720px"
+      :class="['dark-dialog', null]"
       :close-on-click-modal="false"
-      class="model-dialog"
       @closed="onAddClosed"
     >
       <el-form ref="addFormRef" :model="addForm" :rules="addRules" label-width="110px" size="small">
@@ -171,15 +171,20 @@ export default {
       this.addVisible = true
     },
     handleDelete(row) {
-      // this.allData = this.allData.filter(r => r.code !== row.code)
-      equTypeDel(row.id).then(res => {
-        if (res.code !== 0) {
-          return
-        }
-        this.$message.success('删除成功')
-        this.handleQuery()
-      }).catch(() => {
-      })
+      this.$confirm('确认删除？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        equTypeDel(row.id).then(res => {
+          if (res.code !== 0) {
+            return
+          }
+          this.$message.success('删除成功')
+          this.handleQuery()
+        }).catch(() => {
+        })
+      }).catch(()=>{})
     },
 
     /* ====== 新增或修改弹窗 ====== */
@@ -223,6 +228,93 @@ export default {
 }
 </script>
 
+<style lang="scss">
+.el-form-item__label {
+  color: #fff !important;
+}
+.el-dialog__title {
+  color: #e0e6ed !important;
+  font-size: 16px !important;
+  font-weight: bold !important;
+}
+.dark-dialog {
+  .el-dialog {
+    background: var(--dark-dialog-bg, #2d3a4b);
+    border: 1px solid #425163;
+    border-radius: 4px;
+
+    &__header {
+      border-bottom: 1px solid #425163;
+      padding: 15px 20px;
+
+      .el-dialog__title,
+      .dark-dialog-title {
+        color: #e0e6ed !important;
+        font-size: 16px !important;
+        font-weight: bold !important;
+      }
+
+      .el-dialog__headerbtn {
+        .el-dialog__close {
+          color: #8796ad;
+
+          &:hover {
+            color: #e0e6ed;
+          }
+        }
+      }
+    }
+
+    &__body {
+      color: #e0e6ed;
+      padding: 20px;
+
+      .el-descriptions {
+        &__header {
+          .el-descriptions__title {
+            color: #e0e6ed;
+          }
+        }
+
+        &__body {
+          background: transparent;
+
+          .el-descriptions-item__label {
+            color: #8796ad;
+            background: #1e2733;
+          }
+
+          .el-descriptions-item__content {
+            color: #e0e6ed;
+            background: #1e2733;
+          }
+        }
+      }
+    }
+
+    &__footer {
+      border-top: 1px solid #425163;
+      padding: 10px 20px;
+      text-align: right;
+
+      .el-button {
+        &.dark-button {
+          background-color: #425163;
+          border-color: #5a6b7d;
+          color: #e0e6ed;
+
+          &:hover {
+            background-color: #5a6b7d;
+            border-color: #677a8c;
+            color: #ffffff;
+          }
+        }
+      }
+    }
+  }
+}
+</style>
+
 <style>
 /* 统一表格暗色风格，消除白色条纹和容器 */
 .three-model-container .el-table,
@@ -243,9 +335,18 @@ export default {
   color: #e6efff;
 }
 
+.three-model-container .el-table td {
+  color: #ffffff !important;
+}
+
 .three-model-container .el-table th {
   background: rgba(30, 55, 95, 0.85) !important;
-  color: #cfd9e6 !important;
+  color: #ffffff !important;
+}
+
+.three-model-container .el-table th .cell {
+  font-size: 18px !important;
+  font-weight: 700 !important;
 }
 
 .three-model-container .el-table--striped .el-table__body tr.el-table__row--striped td {