界面修改补充

src/views/archivesConfig/commonFields/index.vue

@@ -1,14 +1,15 @@
 <template>
-  <div class="app-container">
+  <div class="app-container  container-wrap">
+    <span class="right-top-line" />
+    <span class="left-bottom-line" />
     <!--工具栏-->
     <div class="head-container">
       <crudOperation :permission="permission" />
-      说明
     </div>
     <!--表格渲染-->
     <el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
       <el-table-column type="selection" width="55" />
-      <el-table-column type="index" label="序号" />
+      <el-table-column type="index" label="序号" width="100" />
       <el-table-column prop="field_cn_name" label="中文名称" />
       <el-table-column prop="field_name" label="字段标识" />
       <el-table-column label="数据类型">

src/views/archivesConfig/dict/index.vue

@@ -19,18 +19,22 @@
       </div>
     </el-dialog>
     <!-- 字典列表 -->
-    <el-row :gutter="10">
-      <el-col :xs="24" :sm="24" :md="6" :lg="6" :xl="5" style="margin-bottom: 10px">
+    <el-row class="container-main" :gutter="10">
+      <el-col :xs="24" :sm="24" :md="6" :lg="6" :xl="5">
         <el-card class="box-card">
+          <span class="right-top-line" />
+          <span class="left-bottom-line" />
           <crudOperation :permission="permission" />
           <!--字典树状结构-->
-          <el-tree ref="tree" v-loading="crud.loading" :data="crud.data" :props="defaultProps" node-key="id" :default-expand-all="true" style="height:calc(100vh - 285px);" highlight-current @node-click="handleNodeClick" />
+          <el-tree ref="tree" v-loading="crud.loading" :data="crud.data" :props="defaultProps" node-key="id" :default-expand-all="true" highlight-current @node-click="handleNodeClick" />
         </el-card>
       </el-col>
       <!-- 字典详情列表 -->
       <el-col :xs="24" :sm="24" :md="18" :lg="18" :xl="19">
         <el-card class="box-card">
-          <dictDetail ref="dictDetail" :permission="permission" style="height:calc(100vh - 248px);" :active-add-btn="activeAddBtn" @treeRefresh="treeRefresh" />
+          <span class="right-top-line" />
+          <span class="left-bottom-line" />
+          <dictDetail ref="dictDetail" :permission="permission" :active-add-btn="activeAddBtn" @treeRefresh="treeRefresh" />
         </el-card>
       </el-col>
     </el-row>
@@ -124,9 +128,13 @@ export default {
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
+.el-card{
+  min-height: calc(100vh - 210px);
+}
+
 .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
-  background-color: rgb(158, 213, 250) !important;
+  /* background-color: rgb(158, 213, 250) !important; */
 }
 .el-card__body .crud-opts {
   justify-content: space-around;