Merge branch 'V0.0.4' of http://10.87.21.221:8000/jzyd_yyds/soc_web into V0.0.4

src/api/login.js

@@ -67,6 +67,22 @@ export function tokenLogin(token) {
     method: "get",
   });
 }
+
+export function homeData() {
+  return request({
+    url: `/core/panel/data`,
+    method: "get",
+  });
+}
+
+export function fileList() {
+  return request({
+    url: `/core/materials/list`,
+    method: "get",
+  });
+}
+
+
 //
 // // 获取验证码
 // export function getCodeImg() {

src/assets/styles/ruoyi.scss

@@ -314,9 +314,11 @@
   line-height: 36px!important;
 }
 .el-submenu__title,.el-menu-item{
+   display: flex;
    font-size: 16px!important;
    height: 42px!important;
-   line-height: 42px!important;
+   align-items: center;
+  justify-content: flex-start;
 }
 
  .el-form-item__label{

src/layout/components/Sidebar/index.vue

@@ -72,9 +72,6 @@ export default {
       return !this.sidebar.opened;
     },
   },
-  mounted(){
-    console.log(this.sidebarRouters,'sidebarRouters');
-  },
   methods: {
     toggleSideBar() {
       this.$store.dispatch("app/toggleSideBar");

src/views/dashboard/PanelGroup.vue

@@ -1,23 +1,21 @@
 <template>
-  <el-card>
     <div class="panel-group">
-        <div class="card-panel" @click="handleClick(v)" v-for="(v,i) in menuList" :key="i">
-          <div class="card-panel-icon-wrapper icon-people">
-            <svg-icon class-name="card-panel-icon" v-if="v.icon" :icon-class="v.icon"/>
+        <div class="card-panel" @click="handleClick(v)" v-for="(v,i) in menusList" :key="i">
+          <div class="card-panel-icon-wrapper" :class="`color${v.meta.colorIndex}`" :style="{color:v.meta.color}">
+            <svg-icon class-name="card-panel-icon" v-if="v.meta.icon" :icon-class="v.meta.icon"/>
           </div>
           <div class="card-panel-description">
             <div class="card-panel-text">
-              {{v.name}}
+              {{v.meta.title}}
             </div>
           </div>
         </div>
     </div>
-  </el-card>
 </template>
 
 <script>
 import CountTo from 'vue-count-to'
-
+import {mapGetters} from 'vuex'
 export default {
   components: {
     CountTo
@@ -25,63 +23,63 @@ export default {
   data(){
     return {
       menuList:[
-        {
-          name:'履职任务下发',
-          icon:'education',
-          url:'',
-        },
-        {
-          name:'调阅任务下发',
-          icon:'//',
-          url:'',
-        },
-        {
-          name:'培训任务下发',
-          icon:'//',
-          url:'',
-        },
-        {
-          name:'演练任务下发',
-          icon:'//',
-          url:'',
-        },
-        {
-          name:'检查任务下发',
-          icon:'//',
-          url:'',
-        },
-        {
-          name:'履职情况跟踪',
-          icon:'//',
-          url:'',
-        },
-        {
-          name:'调阅情况跟踪',
-          icon:'//',
-          url:'',
-        },
-        {
-          name:'培训登记跟踪',
-          icon:'//',
-          url:'',
-        },
-        {
-          name:'检查登记跟踪',
-          icon:'//',
-          url:'',
-        },
-        {
-          name:'演练登记跟踪',
-          icon:'//',
-          url:'',
-        }
+       '履职任务下发',
+       '调阅任务下发',
+       '培训任务下发',
+       '演练任务下发',
+       '检查任务下发',
+       '履职情况跟踪',
+       '调阅情况跟踪',
+       '培训登记跟踪',
+       '检查登记跟踪',
+       '演练登记跟踪',
+       '介绍信管理'
       ],
     }
   },
+  computed:{
+    ...mapGetters(["sidebarRouters"]),
+    menusList(){
+      let arr = [];
+      let childrenArr = this.sidebarRouters.filter(v=>{return v.children}).map(v=>{return v.children});
+      let flatArr = childrenArr.reduce((acc, val) => acc.concat(val), []);  //扁平化数组
+      this.menuList.forEach(v=>{
+        flatArr.forEach(item=>{
+          if(item.meta && item.meta.title && item.meta.title === v){
+            let colorObj = this.getColor();
+            item.meta.color = colorObj.color;
+            item.meta.colorIndex = colorObj.index;
+            arr.push(item)
+          }
+        })
+      })
+      return arr;
+    }
+  },
   methods: {
+    getColor(){
+      let color = [
+        '#008CD6',
+        '#F56C6C',
+        '#67C23A',
+        '#34bfa3',
+        '#40c9c6',
+        '#36a3f7',
+        '#f4516c',
+        '#dec744',
+        '#00a0b0',
+        '#E6A23C'
+      ];
+      let index = Math.floor( Math.random()*10);
+      return {
+        color:color[index],
+        index:index+1,
+      }
+    },
     handleClick(v) {
       this.$router.push({
-        path:'/resumption/plan'
+        name:v.name,
+        path:v.path
       })
     }
   }
@@ -90,10 +88,10 @@ export default {
 
 <style lang="scss" scoped>
 .panel-group {
-  display: grid;
-  grid-template-columns:repeat(auto-fill, 140px);
-  grid-row-gap: 20px;
-  grid-column-gap: 20px;
+  display: flex;
+  //grid-template-columns:repeat(auto-fill, 130px);
+  //grid-row-gap: 20px;
+  //grid-column-gap: 20px;
   justify-content: space-between;
   .card-panel {
     cursor: pointer;
@@ -104,50 +102,42 @@ export default {
     background: #fff;
     box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
     border-color: rgba(0, 0, 0, .05);
-    //&:first-child{
-    //  margin-left: 0;
-    //}
-    //&:last-child{
-    //  margin-right: 0;
-    //}
     &:hover {
       .card-panel-icon-wrapper {
-        color: #fff;
+        color: #fff!important;
       }
-
-      .icon-people {
-        background: #40c9c6;
+      .color1 {
+        background-color: #008CD6;
       }
-
-      .icon-message {
-        background: #36a3f7;
+      .color2 {
+        background-color: #F56C6C;
       }
-
-      .icon-money {
-        background: #f4516c;
+      .color3 {
+        background-color: #67C23A;
       }
-
-      .icon-shopping {
-        background: #34bfa3
+      .color4 {
+        background-color: #34bfa3;
       }
-    }
-
-    .icon-people {
-      color: #40c9c6;
-    }
-
-    .icon-message {
-      color: #36a3f7;
-    }
-
-    .icon-money {
-      color: #f4516c;
-    }
+      .color5 {
+        background-color: #40c9c6;
+      }
+      .color6 {
+        background-color: #36a3f7;
+      }
+      .color7 {
+        background-color: #f4516c;
+      }
+      .color8 {
+        background-color: #dec744;
 
-    .icon-shopping {
-      color: #34bfa3
+      }
+      .color9 {
+        background-color: #00a0b0;
+      }
+      .color10 {
+        background-color: #E6A23C;
+      }
     }
-
     .card-panel-icon-wrapper {
       height: 80px;
       margin: 14px;

src/views/index.vue

@@ -1,25 +1,29 @@
 <template>
   <div class="home-container">
-
-    <panel-group />
-
     <el-row :gutter="20">
+      <el-col :span="24">
+        <el-card>
+          <p class="card-title">快捷菜单</p>
+          <panel-group />
+        </el-card>
+      </el-col>
       <el-col :xs="24" :sm="12" :md="13"  :lg="10">
         <el-card class="card-group">
+          <p class="card-title">待办事项</p>
           <el-row :gutter="20">
-            <el-col :xs="24" :sm="24" :md="12"  :lg="12" v-for="(v,i) in menuList" :key="i">
+            <el-col :xs="24" :sm="24" :md="12"  :lg="12" v-for="(v,i) in dataList" :key="i">
               <div class="card-panel"  >
                 <div class="card-panel-icon-wrapper icon-people">
                   <svg-icon icon-class="peoples" class-name="card-panel-icon" />
                   <div class="card-icon-text">
-                    访客管理菜单
+                    {{v.taskTypeText}}
                   </div>
                 </div>
                 <div class="card-panel-description">
                   <div class="card-panel-text">
-                    访客管理菜单
+                    {{v.statusText}}
                   </div>
-                  <count-to :start-val="0" :end-val="81212" :duration="3000" class="card-panel-num" />
+                  <count-to :start-val="0" :end-val="v.nums" :duration="3000" class="card-panel-num" />
                 </div>
               </div>
             </el-col>
@@ -30,11 +34,10 @@
       </el-col>
       <el-col :xs="24" :sm="12" :md="11"  :lg="14">
         <el-card class="chart-wrapper">
+          <p class="card-title">其他</p>
           <el-tabs type="border-card">
-            <el-tab-pane label="用户管理">用户管理</el-tab-pane>
-            <el-tab-pane label="配置管理">配置管理</el-tab-pane>
-            <el-tab-pane label="角色管理">角色管理</el-tab-pane>
-            <el-tab-pane label="定时任务补偿">定时任务补偿</el-tab-pane>
+            <el-tab-pane label="通知公告">通知公告</el-tab-pane>
+            <el-tab-pane label="知识库">知识库</el-tab-pane>
           </el-tabs>
         </el-card>
       </el-col>
@@ -47,6 +50,7 @@
 <script>
 import PanelGroup from './dashboard/PanelGroup'
 import CountTo from 'vue-count-to'
+import {homeData} from '../api/login'
 export default {
   name: 'Index',
   components: {
@@ -55,25 +59,34 @@ export default {
   },
   data() {
     return {
-      menuList:[1,2,3,4,5,6],
+      dataList:[],
     }
   },
+  mounted(){
+    this.getData();
+  },
   methods: {
-
+    getData(){
+      homeData().then(res=>{
+        this.dataList = res.data;
+      })
+    }
   }
 }
 </script>
-<style lang="scss" scoped>
-::v-deep{
+<style lang="scss">
+.home-container{
   .el-card__body{
-    padding: 20px;
+    padding: 10px 20px 20px 20px;
   }
   .card-group{
     .el-card__body {
-      padding: 10px 20px;
+      padding-bottom: 10px;
     }
   }
 }
+</style>
+<style lang="scss" scoped>
 .home-container {
   padding: 20px;
   background-color: rgb(240, 242, 245);
@@ -82,7 +95,14 @@ export default {
     margin-top: 20px;
   }
 }
-
+.card-title{
+  margin: 0 0 10px 0;
+}
+.card-group{
+  .card-title{
+    margin: 0;
+  }
+}
 .card-group {
   margin-top: 20px;
   .card-panel {
@@ -96,47 +116,11 @@ export default {
     box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
     border-color: rgba(0, 0, 0, .05);
     margin: 10px 0;
-    &:hover {
-      .card-panel-icon-wrapper {
-        color: #fff;
-      }
-      .card-icon-text{
-        color: #fff;
-      }
-      .icon-people {
-        background: #40c9c6;
-
-      }
-
-      .icon-message {
-        background: #36a3f7;
-      }
-
-      .icon-money {
-        background: #f4516c;
-      }
-
-      .icon-shopping {
-        background: #34bfa3
-      }
-    }
 
     .icon-people {
       color: #40c9c6;
     }
 
-    .icon-message {
-      color: #36a3f7;
-    }
-
-    .icon-money {
-      color: #f4516c;
-    }
-
-    .icon-shopping {
-      color: #34bfa3
-    }
-
     .card-panel-icon-wrapper {
       height: 120px;
       margin: 10px;

src/views/system/dict/data.vue

@@ -1,284 +1,281 @@
 <template>
-  <div class="app-container">
-    <el-form
-      :model="queryParams"
-      ref="queryForm"
-      size="small"
-      :inline="true"
-      v-show="showSearch"
-      label-width="100px"
-    >
-      <el-form-item label="字典名称" prop="dictType">
-        <el-select v-model="queryParams.dictType">
-          <el-option
-            v-for="item in typeOptions"
-            :key="item.dictId"
-            :label="item.dictName"
-            :value="item.dictType"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="字典标签" prop="dictLabel">
-        <el-input
-          v-model="queryParams.dictLabel"
-          placeholder="请输入字典标签"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="状态" prop="status">
-        <el-select
-          v-model="queryParams.status"
-          placeholder="数据状态"
-          clearable
+    <div class="app-container">
+      <div class="main-search-box">
+        <el-form
+          :model="queryParams"
+          ref="queryForm"
+          size="small"
+          :inline="true"
+          v-show="showSearch"
         >
-          <el-option
-            v-for="dict in dict.type.sys_normal_disable"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button
-          type="primary"
-          icon="el-icon-search"
-          size="mini"
-          @click="handleQuery"
-          >搜索</el-button
-        >
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
-          >重置</el-button
-        >
-      </el-form-item>
-    </el-form>
-
-    <el-row :gutter="10" >
-      <el-col :span="1.5">
-        <el-button
-          type="primary"
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['system:dict:add']"
-          >新增</el-button
-        >
-      </el-col>
-      <!-- <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit-outline"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['system:dict:edit']"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['system:dict:remove']"
-        >删除</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
-          v-hasPermi="['system:dict:export']"
-        >导出</el-button>
-      </el-col> -->
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-close"
-          size="mini"
-          @click="handleClose"
-          >关闭</el-button
-        >
-      </el-col>
-      <right-toolbar
-        :showSearch.sync="showSearch"
-        @queryTable="getList"
-      ></right-toolbar>
-    </el-row>
+          <el-form-item label="字典名称" prop="dictType">
+            <el-select v-model="queryParams.dictType">
+              <el-option
+                v-for="item in typeOptions"
+                :key="item.dictId"
+                :label="item.dictName"
+                :value="item.dictType"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="字典标签" prop="dictLabel">
+            <el-input
+              v-model="queryParams.dictLabel"
+              placeholder="请输入字典标签"
+              clearable
+              @keyup.enter.native="handleQuery"
+            />
+          </el-form-item>
+          <el-form-item label="状态" prop="status">
+            <el-select
+              v-model="queryParams.status"
+              placeholder="数据状态"
+              clearable
+            >
+              <el-option
+                v-for="dict in dict.type.sys_normal_disable"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+        </el-form>
 
-    <el-table
-      border
-      height="700"
-      size="small"
-      v-loading="loading"
-      :data="dataList"
-      @selection-change="handleSelectionChange"
-    >
-      <!-- <el-table-column type="selection" width="55" align="center" /> -->
-      <el-table-column label="字典编码" align="center" prop="dictCode" />
-      <el-table-column label="字典标签" align="center" prop="dictLabel">
-        <template slot-scope="scope">
+        <el-row :gutter="10" >
+          <el-col :span="1.5">
+            <el-button
+              type="primary"
+              icon="el-icon-search"
+              size="mini"
+              @click="handleQuery">搜索</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button type="primary" icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button
+              type="primary"
+              icon="el-icon-plus"
+              size="mini"
+              @click="handleAdd"
+              v-hasPermi="['system:dict:add']"
+            >新增</el-button
+            >
+          </el-col>
+          <!-- <el-col :span="1.5">
+            <el-button
+              type="success"
+              plain
+              icon="el-icon-edit-outline"
+              size="mini"
+              :disabled="single"
+              @click="handleUpdate"
+              v-hasPermi="['system:dict:edit']"
+            >修改</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button
+              type="danger"
+              plain
+              icon="el-icon-delete"
+              size="mini"
+              :disabled="multiple"
+              @click="handleDelete"
+              v-hasPermi="['system:dict:remove']"
+            >删除</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button
+              type="warning"
+              plain
+              icon="el-icon-download"
+              size="mini"
+              @click="handleExport"
+              v-hasPermi="['system:dict:export']"
+            >导出</el-button>
+          </el-col> -->
+          <el-col :span="1.5">
+            <el-button
+              type="primary"
+              icon="el-icon-close"
+              size="small"
+              @click="handleClose"
+            >关闭</el-button
+            >
+          </el-col>
+          <right-toolbar
+            :showSearch.sync="showSearch"
+            @queryTable="getList"
+          ></right-toolbar>
+        </el-row>
+      </div>
+      <el-table
+        border
+        height="646"
+        size="small"
+        v-loading="loading"
+        :data="dataList"
+        @selection-change="handleSelectionChange"
+      >
+        <!-- <el-table-column type="selection" width="55" align="center" /> -->
+        <el-table-column label="字典编码" align="center" prop="dictCode" />
+        <el-table-column label="字典标签" align="center" prop="dictLabel"  :show-overflow-tooltip="true" width="340">
+          <template slot-scope="scope">
           <span
             v-if="scope.row.listClass == '' || scope.row.listClass == 'default'"
-            >{{ scope.row.dictLabel }}</span
+          >{{ scope.row.dictLabel }}</span
           >
-          <el-tag
-            v-else
-            :type="scope.row.listClass == 'primary' ? '' : scope.row.listClass"
+            <el-tag
+              v-else
+              :type="scope.row.listClass == 'primary' ? '' : scope.row.listClass"
             >{{ scope.row.dictLabel }}</el-tag
-          >
-        </template>
-      </el-table-column>
-      <el-table-column label="字典键值" align="center" prop="dictValue" />
-      <el-table-column label="字典排序" align="center" prop="dictSort" />
-      <el-table-column label="状态" align="center" prop="status">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.sys_normal_disable"
-            :value="scope.row.status"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="备注"
-        align="center"
-        prop="remark"
-        :show-overflow-tooltip="true"
-      >
-      </el-table-column>
+            >
+          </template>
+        </el-table-column>
+        <el-table-column label="字典键值" align="center" prop="dictValue"  width="140"/>
+        <el-table-column label="字典排序" align="center" prop="dictSort" width="140"/>
+        <el-table-column label="状态" align="center" prop="status" width="140">
+          <template slot-scope="scope">
+            <dict-tag
+              :options="dict.type.sys_normal_disable"
+              :value="scope.row.status"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="备注"
+          align="center"
+          prop="remark"
+          :show-overflow-tooltip="true"
+        >
+        </el-table-column>
 
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        width="180"
-      >
-        <template slot-scope="scope">
-          <span>{{ parseTime(scope.row.createTime) }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column
-        label="操作"
-        align="center"
-        class-name="small-padding fixed-width"
-      >
-        <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit-outline"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['system:dict:edit']"
+        <el-table-column
+          label="创建时间"
+          align="center"
+          prop="createTime"
+          width="180"
+        >
+          <template slot-scope="scope">
+            <span>{{ parseTime(scope.row.createTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          align="center"
+          class-name="small-padding fixed-width"
+        >
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-edit-outline"
+              @click="handleUpdate(scope.row)"
+              v-hasPermi="['system:dict:edit']"
             >编辑</el-button
-          >
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['system:dict:remove']"
+            >
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-delete"
+              @click="handleDelete(scope.row)"
+              v-hasPermi="['system:dict:remove']"
             >删除</el-button
-          >
-        </template>
-      </el-table-column>
-    </el-table>
+            >
+          </template>
+        </el-table-column>
+      </el-table>
 
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
+      <pagination
+        v-show="total > 0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
 
-    <!-- 添加或修改参数配置对话框 -->
-    <DialogCom :title="title" :visible.sync="open" width="700px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="字典类型">
-              <el-input v-model="form.dictType" :disabled="true" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="字典标签" prop="dictLabel">
-              <el-input v-model="form.dictLabel" placeholder="请输入字典标签" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="字典键值" prop="dictValue">
-              <el-input v-model="form.dictValue" placeholder="请输入字典键值" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="样式属性" prop="cssClass">
-              <el-input v-model="form.cssClass" placeholder="请输入样式属性" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="字典排序" prop="dictSort">
-              <el-input-number
-                style="width: 100%"
-                v-model="form.dictSort"
-                controls-position="right"
-                :min="0"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="回显样式" prop="listClass">
-              <el-select style="width: 100%" v-model="form.listClass">
-                <el-option
-                  v-for="item in listClassOptions"
-                  :key="item.value"
-                  :label="item.label + '(' + item.value + ')'"
-                  :value="item.value"
-                ></el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
+      <!-- 添加或修改参数配置对话框 -->
+      <DialogCom :title="title" :visible.sync="open" width="700px" append-to-body>
+        <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="字典类型">
+                <el-input v-model="form.dictType" :disabled="true" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="字典标签" prop="dictLabel">
+                <el-input v-model="form.dictLabel" placeholder="请输入字典标签" />
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="字典键值" prop="dictValue">
+                <el-input v-model="form.dictValue" placeholder="请输入字典键值" />
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="样式属性" prop="cssClass">
+                <el-input v-model="form.cssClass" placeholder="请输入样式属性" />
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="字典排序" prop="dictSort">
+                <el-input-number
+                  style="width: 100%"
+                  v-model="form.dictSort"
+                  controls-position="right"
+                  :min="0"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="回显样式" prop="listClass">
+                <el-select style="width: 100%" v-model="form.listClass">
+                  <el-option
+                    v-for="item in listClassOptions"
+                    :key="item.value"
+                    :label="item.label + '(' + item.value + ')'"
+                    :value="item.value"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
 
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="状态" prop="status">
-              <el-radio-group v-model="form.status">
-                <el-radio
-                  v-for="dict in dict.type.sys_normal_disable"
-                  :key="dict.value"
-                  :label="dict.value"
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="状态" prop="status">
+                <el-radio-group v-model="form.status">
+                  <el-radio
+                    v-for="dict in dict.type.sys_normal_disable"
+                    :key="dict.value"
+                    :label="dict.value"
                   >{{ dict.label }}</el-radio
-                >
-              </el-radio-group>
-            </el-form-item>
-          </el-col>
-        </el-row>
+                  >
+                </el-radio-group>
+              </el-form-item>
+            </el-col>
+          </el-row>
 
-        <el-form-item label="备注" prop="remark">
-          <el-input
-            v-model="form.remark"
-            type="textarea"
-            placeholder="请输入内容"
-          ></el-input>
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </DialogCom>
-  </div>
+          <el-form-item label="备注" prop="remark">
+            <el-input
+              v-model="form.remark"
+              type="textarea"
+              placeholder="请输入内容"
+            ></el-input>
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </DialogCom>
+    </div>
 </template>
 
 <script>
@@ -520,10 +517,3 @@ export default {
   width: 300px;
 }
 </style>
-<style >
-.el-tooltip__popper {
-  max-width: 200px;
-
-  overflow: hidden;
-}
-</style>