Merge pull request #133 from HXSecurity/issue4+

Feature:HXSecurity/DongTai#348

Author: 奇淼（piexlmax

src/views/setting/AgentManage.vue

@@ -56,6 +56,7 @@
     <el-table
       :data="tableData"
       class="agentManageTable"
+      border
       header-align="center"
       @selection-change="handleSelectionChange"
     >
@@ -785,4 +786,12 @@ export default class AgentManage extends VueBase {
     padding-right: 60px;
   }
 }
+
+.agentManageTable {
+  &.el-table {
+    /deep/th {
+      background: #f6f8fa;
+    }
+  }
+}
 </style>

src/views/setting/LogManage.vue

@@ -17,7 +17,7 @@
         </el-button>
       </div>
     </div>
-    <el-table class="logListTable" :data="tableData">
+    <el-table class="logListTable" :data="tableData" border>
       <el-table-column width="40px">
         <template slot-scope="{ row }">
           <div @click.prevent="selectIdChange(row.log_id)">
@@ -285,4 +285,12 @@ main {
   border: 1px solid #4a72ae;
   color: #4a72ae;
 }
+
+.logListTable {
+  &.el-table {
+    /deep/th {
+      background: #f6f8fa;
+    }
+  }
+}
 </style>

src/views/setting/StrategyManage.vue

@@ -21,11 +21,11 @@
         </el-button>
       </div>
     </div>
-    <el-table :data="tableData" class="strategyManageTable">
+    <el-table :data="tableData" class="strategyManageTable" border>
       <el-table-column
         :label="$t('views.strategyManage.name')"
         prop="vul_name"
-        width="160px"
+        min-width="260px"
       >
         <template slot-scope="{ row }">
           <div class="two-line vul_name" @click="toPath(1, row.id)">
@@ -37,7 +37,7 @@
       <el-table-column
         :label="$t('views.strategyManage.level')"
         prop="level_id"
-        min-width="200px"
+        width="200px"
         align="center"
       >
         <template slot-scope="{ row }">
@@ -51,7 +51,8 @@
         v-if="userInfo.role === 1 || userInfo.role === 2"
         :label="$t('views.strategyManage.status')"
         prop="state"
-        width="100px"
+        width="140px"
+        align="center"
       >
         <template slot-scope="{ row }">
           <div @click="stateChange(row.id, row.state)">
@@ -68,18 +69,27 @@
         v-if="userInfo.role === 1 || userInfo.role === 2"
         :label="$t('views.strategyManage.settings')"
         width="160px"
+        align="center"
       >
         <template slot-scope="{ row }">
-          <el-button
-            v-if="!row.isEdit"
-            size="small"
-            class="btn"
-            @click="toPath(undefined, row.id)"
-            >{{ $t('views.strategyManage.edit') }}</el-button
-          >
-          <el-button size="small" class="btn" @click="deleteManage(row)">{{
-            $t('views.strategyManage.del')
-          }}</el-button>
+          <div class="table-btn-box">
+            <el-button
+              v-if="!row.isEdit"
+              type="text"
+              size="small"
+              style="color: #4a72ae"
+              @click="toPath(undefined, row.id)"
+              >{{ $t('views.strategyManage.edit') }}</el-button
+            >
+            <span class="l"> | </span>
+            <el-button
+              style="color: #f56262"
+              size="small"
+              type="text"
+              @click="deleteManage(row)"
+              >{{ $t('views.strategyManage.del') }}</el-button
+            >
+          </div>
         </template>
       </el-table-column>
     </el-table>
@@ -409,4 +419,26 @@ export default class StrategyManage extends VueBase {
   color: #4a72ae;
   border-color: #4a72ae;
 }
+.strategyManageTable {
+  margin-top: 16px;
+  &.el-table {
+    /deep/th {
+      background: #f6f8fa;
+    }
+  }
+}
+.table-btn-box {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  .l {
+    color: #38435a;
+    line-height: 13px;
+    padding: 10px 4px;
+    display: inline-block;
+  }
+  .el-button + .el-button {
+    margin-left: 0;
+  }
+}
 </style>

src/views/setting/components/dangerTable.vue

@@ -76,8 +76,10 @@
       </div>
     </div>
     <el-table
+      class="hookTable"
       :data="tableData"
       style="width: 100%"
+      border
       :header-row-style="{
         color: '#000',
         fontWeight: 600,
@@ -858,4 +860,12 @@ export default class HookTable extends VueBase {
 /deep/.el-table th {
   background: #f8f9fb;
 }
+
+.hookTable {
+  &.el-table {
+    /deep/th {
+      background: #f6f8fa;
+    }
+  }
+}
 </style>

src/views/setting/components/hookTable.vue

@@ -77,6 +77,8 @@
     </div>
     <el-table
       :data="tableData"
+      class="hookTable"
+      border
       :header-row-style="{
         color: '#000',
         fontWeight: 600,
@@ -909,4 +911,11 @@ export default class HookTable extends VueBase {
 /deep/.el-table th {
   background: #f8f9fb;
 }
+.hookTable {
+  &.el-table {
+    /deep/th {
+      background: #f6f8fa;
+    }
+  }
+}
 </style>

src/views/setting/sensitiveManage.vue

@@ -45,7 +45,7 @@
           </el-button>
         </div>
       </div>
-      <el-table :data="tableData" class="sensitiveManageTable">
+      <el-table :data="tableData" class="sensitiveManageTable" border>
         <el-table-column
           :label="$t('views.sensitiveManage.name')"
           prop="vul_name"
@@ -60,7 +60,7 @@
         <el-table-column
           :label="$t('views.sensitiveManage.detail')"
           prop="vul_desc"
-          min-width="300px"
+          min-width="140px"
         >
           <template slot-scope="{ row }">
             <div>
@@ -75,8 +75,7 @@
         <el-table-column
           :label="$t('views.sensitiveManage.fix')"
           prop="vul_fix"
-          min-width="200px"
-          align="center"
+          min-width="140px"
         >
           <template slot-scope="{ row }">
             <div>
@@ -88,7 +87,8 @@
         <el-table-column
           :label="$t('views.sensitiveManage.status')"
           prop="state"
-          width="100px"
+          width="140px"
+          align="center"
         >
           <template slot-scope="{ row }">
             <div style="cursor: pointer" @click="stateChange(row)">
@@ -106,21 +106,26 @@
           v-if="userInfo.role === 1 || userInfo.role === 2"
           :label="$t('views.sensitiveManage.settings')"
           width="160px"
+          align="center"
         >
           <template slot-scope="{ row }">
-            <el-button
-              size="small"
-              class="btn"
-              @click="sensitiveDialogEdit(row)"
-              >{{ $t('views.sensitiveManage.edit') }}</el-button
-            >
-
-            <el-button
-              size="small"
-              class="btn"
-              @click="sensitiveDialogDelete(row)"
-              >{{ $t('views.sensitiveManage.del') }}</el-button
-            >
+            <div class="table-btn-box">
+              <el-button
+                size="small"
+                style="color: #4a72ae"
+                type="text"
+                @click="sensitiveDialogEdit(row)"
+                >{{ $t('views.sensitiveManage.edit') }}</el-button
+              >
+              <span class="l"> | </span>
+              <el-button
+                size="small"
+                type="text"
+                style="color: #f56262"
+                @click="sensitiveDialogDelete(row)"
+                >{{ $t('views.sensitiveManage.del') }}</el-button
+              >
+            </div>
           </template>
         </el-table-column>
       </el-table>
@@ -349,4 +354,25 @@ export default class sensitiveManage extends VueBase {
   display: flex;
   justify-content: flex-end;
 }
+.sensitiveManageTable {
+  margin-top: 16px;
+  &.el-table {
+    /deep/th {
+      background: #f6f8fa;
+    }
+  }
+}
+.table-btn-box {
+  justify-content: center;
+  align-items: center;
+  .l {
+    color: #38435a;
+    line-height: 13px;
+    padding: 10px 4px;
+    display: inline-block;
+  }
+  .el-button + .el-button {
+    margin-left: 0;
+  }
+}
 </style>