bug修改,界面显示优化

src/styles/variables.scss

@@ -9,7 +9,7 @@ $menuHover:#263445;
 $subMenuBg:#1f2d3d;
 $subMenuHover:#001528;
 
-$sideBarWidth: 210px;
+$sideBarWidth: 190px;
 
 // the :export directive is the magic sauce for webpack
 // https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass

src/views/system/dept.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
+    <el-form :model="queryParams" ref="queryForm" size="mini" :inline="true">
       <el-form-item label="部门名称" prop="deptName">
         <el-input
           v-model="queryParams.deptName"
@@ -49,7 +49,7 @@
       v-if="refreshTable"
       :data="deptList"
       row-key="id"
-      size="small"
+      size="mini"
       :default-expand-all="isExpandAll"
       :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
       <el-table-column prop="deptName" label="部门名称" width="260"></el-table-column>

src/views/system/menu.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
+    <el-form :model="queryParams" ref="queryForm" size="mini" :inline="true">
       <el-form-item label="菜单名称" prop="menuName">
         <el-input
           v-model="queryParams.menuName"
@@ -49,7 +49,7 @@
       v-if="refreshTable"
       :data="menuList"
       row-key="id"
-      size="small"
+      size="mini"
       :default-expand-all="isExpandAll"
       :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
       <el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column>

src/views/system/role.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
+    <el-form :model="queryParams" ref="queryForm" size="mini" :inline="true">
       <el-form-item label="角色名称" prop="roleName">
         <el-input
           v-model="queryParams.roleName"
@@ -40,7 +40,7 @@
       </el-col>
     </el-row>
 
-    <el-table :data="roleList" size="small">
+    <el-table :data="roleList" size="mini">
       <el-table-column label="角色编号" prop="id" width="100"/>
       <el-table-column label="角色名称" prop="roleName" :show-overflow-tooltip="true"/>
       <el-table-column label="权限字符" prop="roleKey" :show-overflow-tooltip="true"/>

src/views/system/user.vue

@@ -2,13 +2,13 @@
   <div class="app-container">
     <el-row :gutter="20">
       <!--部门数据-->
-      <el-col :span="4" :xs="24">
+      <el-col :span="5" :xs="24">
         <div class="head-container">
           <el-input
             v-model="deptName"
             placeholder="请输入部门名称"
             clearable
-            size="small"
+            size="mini"
             prefix-icon="el-icon-search"
             style="margin-bottom: 20px"
           />
@@ -28,8 +28,8 @@
         </div>
       </el-col>
       <!--用户数据-->
-      <el-col :span="20" :xs="24">
-        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true"
+      <el-col :span="19" :xs="24">
+        <el-form :model="queryParams" ref="queryForm" size="mini" :inline="true"
                  label-width="68px">
           <el-form-item label="用户名称" prop="userName">
             <el-input
@@ -70,7 +70,7 @@
           </el-col>
         </el-row>
 
-        <el-table :data="userList" size="small">
+        <el-table :data="userList" size="mini">
           <el-table-column label="用户编号" align="center" key="id" prop="id"/>
           <el-table-column label="用户名称" align="center" key="userName" prop="userName"
                            :show-overflow-tooltip="true"/>
@@ -376,11 +376,11 @@ export default {
       this.reset();
     },
     handleSizeChange(val) {
-      this.pageSize = val;
+      this.queryParams.pageSize = val;
       this.getList();
     },
     handleCurrentChange(val) {
-      this.pageNum = val;
+      this.queryParams.pageNum = val;
       this.getList();
     },
     // 表单重置

src/views/task/category.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
+    <el-form :model="queryParams" ref="queryForm" size="mini" :inline="true">
       <el-form-item label="分类名称" prop="categoryName">
         <el-input
           v-model="queryParams.categoryName"

src/views/task/project.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
+    <el-form :model="queryParams" ref="queryForm" size="mini" :inline="true">
       <el-form-item label="项目名称" prop="projectName">
         <el-input
           v-model="queryParams.projectName"

src/views/task/task.vue

@@ -1,14 +1,6 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
-      <el-form-item label="所属分类" prop="categoryId">
-        <el-select
-          v-model="queryParams.categoryId"
-          clearable
-          style="width: 200px">
-          <el-option v-for="item in categoryList" :key="item.id" :label="item.categoryName" :value="item.id"/>
-        </el-select>
-      </el-form-item>
+    <el-form :model="queryParams" ref="queryForm" size="mini" :inline="true">
       <el-form-item label="所属项目" prop="projectId">
         <el-select
           v-model="queryParams.projectId"
@@ -23,7 +15,7 @@
           type="month"
           value-format="yyyy-MM"
           placeholder="选择月份"
-          clearable
+          :clearable="false"
           style="width: 200px">
         </el-date-picker>
       </el-form-item>
@@ -299,7 +291,6 @@ import {
   auditTask,
   splitTask
 } from "@/api/task/task";
-import {getCategoryList} from "@/api/task/category";
 import {getProjectList} from "@/api/task/project";
 import {getDeptUserTree} from "@/api/system/user";
 import {getHosInfos, getHsystems} from '@/api/meeting/enforce'
@@ -380,9 +371,6 @@ export default {
   methods: {
     /** 查询项目列表 */
     getList() {
-      getCategoryList("").then(res => {
-        this.categoryList = res.data;
-      })
       getProjectList("").then(res => {
         this.projectList = res.data;
       })

src/views/task/view.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
+    <el-form :model="queryParams" ref="queryForm" size="mini" :inline="true">
       <el-form-item label="所属项目" prop="projectId">
         <el-select
           v-model="queryParams.projectId"
@@ -16,6 +16,7 @@
           @change="getList"
           type="month"
           value-format="yyyy-MM"
+          :clearable="false"
           style="width: 200px">
         </el-date-picker>
       </el-form-item>
@@ -34,7 +35,6 @@
     <el-table
       ref="view-table"
       :data="tableData"
-      stripe
       size="mini"
       :cell-style="cellStyle"
       @cell-click="cellClick"
@@ -43,8 +43,8 @@
       height="calc(100vh - 140px)"
       border>
       <el-table-column fixed prop="id" label="编号" align="center" width="50"/>
-      <el-table-column fixed prop="taskName" label="任务名称" align="center" width="180"/>
-      <el-table-column fixed prop="executorName" label="主负责人" align="center" width="100">
+      <el-table-column fixed prop="taskName" label="任务名称" align="center" class="task-name-cell" width="180"/>
+      <el-table-column fixed prop="executorName" label="主负责人" align="center" width="90">
         <template slot-scope="scope">
           <div style="line-height: 15px">{{ scope.row.executorName }}</div>
           <el-tag size="mini" :type="statusMap[scope.row.status].type">
@@ -52,12 +52,12 @@
           </el-tag>
         </template>
       </el-table-column>
-      <el-table-column fixed prop="" label="上月延期" width="50">
+      <el-table-column fixed prop="" label="上月延期" width="40">
         <template slot-scope="scope">
           <span v-if="scope.row.formLastMonth" style="color: red">是</span>
         </template>
       </el-table-column>
-      <el-table-column align="center" v-for="(item,index) in tableHeaders" :key="index" :prop="item.day" width="50">
+      <el-table-column align="center" v-for="(item,index) in tableHeaders" :key="index" :prop="item.day" width="37">
         <template slot="header" slot-scope="scope">
           <div style="width: 20px">{{ item.day }}</div>
           <div v-if="item.week=='周六'" style="width: 24px;font-size: 12px;color: #1c84c6">{{ item.week }}</div>
@@ -80,7 +80,7 @@
               <el-table-column width="60" property="userName" label="反馈人"></el-table-column>
               <el-table-column width="60" label="完成度">
                 <template slot-scope="scope">
-                  <div>{{scope.row.feedbackType==='4'?'': scope.row.value + '%' }}</div>
+                  <div>{{ scope.row.feedbackType === '4' ? '' : scope.row.value + '%' }}</div>
                 </template>
               </el-table-column>
               <el-table-column width="140" property="createTime" label="反馈时间"></el-table-column>
@@ -97,7 +97,7 @@
                 </template>
               </el-table-column>
             </el-table>
-            <div slot="reference">{{ scope.row[item.day].value }}</div>
+            <div slot="reference" style="font-size: 10px">{{ scope.row[item.day].value }}</div>
           </el-popover>
         </template>
       </el-table-column>
@@ -357,4 +357,13 @@ export default {
   padding-left: 5px;
   padding-right: 5px;
 }
+
+::v-deep.el-table th.el-table__cell > .cell {
+  padding-left: 5px;
+  padding-right: 5px;
+}
+
+::v-deep.task-name-cell:hover {
+  text-decoration: underline;
+}
 </style>