Merge remote-tracking branch 'origin/master'

src/App.vue

@@ -14,10 +14,10 @@
       // 恢复主题
       this.$store.dispatch('theme/recoverTheme');
       if (!sessionStorage.filePath) {
-        // getPathAddress().then((res) => {
-        //   console.log(res);
-        //   sessionStorage.filePath = res;
-        // });
+        getPathAddress().then((res) => {
+          console.log(res);
+          sessionStorage.filePath = res;
+        });
       }
     },
     methods: {

src/api/home/index.js

@@ -1,4 +1,4 @@
-import request from "@/utils/request";
+import request from '@/utils/request';
 
 /**
  * 查询项目列表
@@ -28,7 +28,9 @@ export async function projectsTaskPageAPI(data) {
  * @data data
  */
 export async function getAllResourceByCurrentUserAPI() {
-  const res = await request.get('/sys/indexuserresource/getAllResourceByCurrentUser');
+  const res = await request.get(
+    '/sys/indexuserresource/getAllResourceByCurrentUser'
+  );
   if (res.data.code == 0) {
     return res.data.data;
   }
@@ -39,7 +41,7 @@ export async function getAllResourceByCurrentUserAPI() {
  * @data data
  */
 export async function userResourceSaveAPI(data) {
-  const res = await request.post('/sys/indexuserresource/save',data);
+  const res = await request.post('/sys/indexuserresource/save', data);
   if (res.data.code == 0) {
     return res.data.data;
   }
@@ -61,10 +63,21 @@ export async function userResourceListAPI() {
  * @data data
  */
 export async function userResourceDeleteAPI(data) {
-  const res = await request.delete('/sys/indexuserresource/delete',{data});
+  const res = await request.delete('/sys/indexuserresource/delete', { data });
   if (res.data.code == 0) {
     return res.data.data;
   }
   return Promise.reject(new Error(res.data.message));
 }
 
+/**
+ * 统一门户
+ * @params params
+ */
+export async function getList(params) {
+  const res = await request.get(`/sys/system/page`, { params });
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}

src/utils/dict/warehouse.js

@@ -132,3 +132,33 @@ export const wh_equStatus = [
   { code: 3, label: '盘盈', color: '#70B603' },
   { code: 4, label: '正常', color: '' }
 ];
+
+// 质检状态 0未检 1已检
+export const qualityStatus = {
+  0: '未质检',
+  1: '待检',
+  2: '已质检'
+};
+
+// 质检结果 0无 1合格 2不合格
+export const qualityResults = {
+  0: '无',
+  1: '合格',
+  2: '不合格'
+};
+
+// 质检结果下拉选项
+export const qualityResultsOptions = [
+  {
+    label: '无',
+    value: 0
+  },
+  {
+    label: '合格',
+    value: 1
+  },
+  {
+    label: '不合格',
+    value: 2
+  }
+];

src/utils/file.js

@@ -2,7 +2,7 @@ import { getToken } from './token-util';
 import { TOKEN_HEADER_NAME } from '@/config/setting';
 
 // 获取图片反显url
-export function getImageUrl (path) {
+export function getImageUrl(path) {
   return `${sessionStorage.filePath}${path}`;
   // if (process.env.NODE_ENV === 'development') {
   //   return `http://192.168.3.51:18086/main/file/getFile?${TOKEN_HEADER_NAME}=${getToken()}&objectName=${path}`;
@@ -13,7 +13,7 @@ export function getImageUrl (path) {
   // }
 }
 // 从反显url上获取接口需要path
-export function getImagePath (url) {
+export function getImagePath(url) {
   if (!url) {
     return '';
   }
@@ -24,7 +24,7 @@ export function getImagePath (url) {
 }
 
 // 下载方法
-export function download (data, name) {
+export function download(data, name) {
   const a = document.createElement('a');
   const url = window.URL.createObjectURL(data);
   const filename = name;

src/views/bpm/handleTask/components/outBound/submit.vue

@@ -24,6 +24,7 @@
         icon="el-icon-edit-outline"
         type="success"
         size="mini"
+        :loading="isLoading"
         @click="handleAudit(1)"
         >通过
       </el-button>
@@ -32,6 +33,7 @@
         icon="el-icon-circle-close"
         type="danger"
         size="mini"
+        :loading="isLoading"
         @click="handleAudit(0)"
         >驳回
       </el-button>
@@ -43,7 +45,8 @@
   export default {
     data() {
       return {
-        form: {}
+        form: {},
+        isLoading: false
       };
     },
     props: {
@@ -78,12 +81,18 @@
             reason: this.form.reason,
             variables: { pass: true }
           };
-          const data = await approveTaskWithVariables(params);
-          if (data.data.code != '-1') {
-            this.$emit('handleAudit', {
-              status,
-              title: '通过'
-            });
+          try {
+            this.isLoading = true;
+            const data = await approveTaskWithVariables(params);
+            if (data.data.code != '-1') {
+              this.$emit('handleAudit', {
+                status,
+                title: '通过'
+              });
+            }
+            this.isLoading = false;
+          } catch (error) {
+            this.isLoading = false;
           }
         } else {
           const params = {
@@ -91,12 +100,18 @@
             reason: this.form.reason,
             outInId: this.businessId
           };
-          const data = await outApproveNotPass(params);
-          if (data.data.code != '-1') {
-            this.$emit('handleAudit', {
-              status,
-              title: '驳回'
-            });
+          try {
+            this.isLoading = true;
+            const data = await outApproveNotPass(params);
+            if (data.data.code != '-1') {
+              this.$emit('handleAudit', {
+                status,
+                title: '驳回'
+              });
+            }
+            this.isLoading = false;
+          } catch (error) {
+            this.isLoading = false;
           }
         }
       }

src/views/bpm/outgoingManagement/details.vue

@@ -446,7 +446,12 @@
   import { getFile } from '@/api/system/file/index.js';
   import storageApi from '@/api/warehouseManagement';
   import { allCategoryLevel } from '@/api/classifyManage';
-  import { useDictLabel, outputSceneState } from '@/utils/dict/index';
+  import {
+    useDictLabel,
+    outputSceneState,
+    qualityResults,
+    qualityStatus
+  } from '@/utils/dict/index';
   import { mapGetters, mapActions } from 'vuex';
   export default {
     directives: {
@@ -465,14 +470,8 @@
     data() {
       return {
         newColumns: [], // 动态表头
-        qualityStatus: {
-          0: '未质检',
-          1: '已质检'
-        }, // 质检状态 0未检 1已检
-        qualityResults: {
-          1: '合格',
-          2: '不合格'
-        }, // 质检结果 1合格 2不合格
+        qualityStatus, // 质检状态 0未检 1已检
+        qualityResults, // 质检结果 0无 1合格 2不合格
         productList: [], // 产品列表
         showPackingList: [], // 展示的包装列表
         packingList: [], // 包装列表

src/views/bpm/outgoingManagement/outbound.vue

@@ -519,7 +519,11 @@
   import elTableInfiniteScroll from 'el-table-infinite-scroll';
   import warehouseDefinition from '@/api/warehouseManagement/warehouseDefinition';
   import { getTreeByGroup } from '@/api/classifyManage';
-  import { outputSceneState } from '@/utils/dict/index';
+  import {
+    outputSceneState,
+    qualityStatus,
+    qualityResults
+  } from '@/utils/dict/index';
 
   import selectTree from '@/components/selectTree';
   import AssetsDialog from './components/AssetsDialog.vue';
@@ -546,14 +550,8 @@
       return {
         newColumns: [], // 动态表头
         goodsLists: [], // 商品列表
-        qualityStatus: {
-          0: '未质检',
-          1: '已质检'
-        }, // 质检状态 0未检 1已检
-        qualityResults: {
-          1: '合格',
-          2: '不合格'
-        }, // 质检结果 1合格 2不合格
+        qualityStatus, // 质检状态 0未检 1已检
+        qualityResults, // 质检结果 0无 1合格 2不合格
         productList: [], // 产品列表
         showPackingList: [], // 展示的包装列表
         packingList: [], // 包装列表

src/views/bpm/stockManagement/details.vue

@@ -377,7 +377,12 @@
   import { getFile } from '@/api/system/file/index.js';
   import storageApi from '@/api/warehouseManagement';
   import { allCategoryLevel } from '@/api/classifyManage';
-  import { useDictLabel, sceneState } from '@/utils/dict/index';
+  import {
+    useDictLabel,
+    sceneState,
+    qualityStatus,
+    qualityResults
+  } from '@/utils/dict/index';
   import { mapGetters, mapActions } from 'vuex';
   export default {
     directives: {
@@ -402,14 +407,8 @@
       return {
         newColumns: [], // 动态表头
         qualityFile: [], // 回执附件
-        qualityStatus: {
-          0: '未质检',
-          1: '已质检'
-        }, // 质检状态 0未检 1已检
-        qualityResults: {
-          1: '合格',
-          2: '不合格'
-        }, // 质检结果 1合格 2不合格
+        qualityStatus, // 质检状态 0未检 1已检
+        qualityResults, // 质检结果 0无 1合格 2不合格
         productList: [], // 产品列表
         showPackingList: [], // 展示的包装列表
         packingList: [], // 包装列表

src/views/bpm/stockManagement/quality.vue

@@ -602,7 +602,13 @@
   import { getFile } from '@/api/system/file/index.js';
   import storageApi from '@/api/warehouseManagement';
   import { allCategoryLevel } from '@/api/classifyManage';
-  import { useDictLabel, sceneState } from '@/utils/dict/index';
+  import {
+    useDictLabel,
+    sceneState,
+    qualityResultsOptions,
+    qualityResults,
+    qualityStatus
+  } from '@/utils/dict/index';
   import { mapGetters, mapActions } from 'vuex';
   import fileUpload from '@/components/upload/fileUpload';
   import { deepClone } from '@/utils';
@@ -627,24 +633,9 @@
       return {
         newColumns: [], // 动态表头
         qualityFile: [], // 回执附件
-        qualityResultsOptions: [
-          {
-            label: '合格',
-            value: 1
-          },
-          {
-            label: '不合格',
-            value: 2
-          }
-        ],
-        qualityStatus: {
-          0: '未质检',
-          1: '已质检'
-        }, // 质检状态 0未检 1已检
-        qualityResults: {
-          1: '合格',
-          2: '不合格'
-        }, // 质检结果 1合格 2不合格
+        qualityResultsOptions, // 质检结果选项
+        qualityStatus, // 质检状态 0未检 1已检
+        qualityResults, // 质检结果 0无 1合格 2不合格
         productList: [], // 产品列表
         showPackingList: [], // 展示的包装列表
         packingList: [], // 包装列表
@@ -871,13 +862,13 @@
       changeWrapStatus(resultValue, row, type) {
         console.log(resultValue);
         switch (resultValue) {
-          case '0':
+          case 0:
             // 清空质检状态
             row.status = 0;
             break;
           default:
             // 默认已检质检状态
-            row.status = 1;
+            row.status = 2;
             break;
         }
         if (type === '包装') {
@@ -899,13 +890,13 @@
       materialResultCahnge(value, row) {
         // 修改包装质检结果
         let filterMaterialList = this.materialList.filter((item) => {
-          return item.parentIndex === row.parentIndex;
+          return item.parentIndex == row.parentIndex;
         });
         let packingIndex = this.packingList.findIndex((item) => {
-          return item.index === row.parentIndex;
+          return item.index == row.parentIndex;
         });
         let boolen = filterMaterialList.every((item) => {
-          return item.result === 1;
+          return item.result == 1;
         });
         this.$set(this.packingList[packingIndex], 'result', boolen ? 1 : 2);
       },

src/views/bpm/stockManagement/storage.vue

@@ -654,7 +654,12 @@
             </template>
           </el-table-column>
 
-          <el-table-column label="质检结果" prop="result" width="120">
+          <el-table-column
+            v-if="form.isQmsCheck == 0"
+            label="质检结果"
+            prop="result"
+            width="120"
+          >
             <template slot-scope="{ row }">
               <el-select
                 v-if="!row.isPack"
@@ -902,7 +907,12 @@
   import WarehousingDialog from './components/WarehousingDialog.vue';
   import { getCode } from '@/api/codeManagement/index.js';
   import selectType from './components/selectType_new.vue';
-  import { sceneState } from '@/utils/dict/index';
+  import {
+    sceneState,
+    qualityResultsOptions,
+    qualityResults,
+    qualityStatus
+  } from '@/utils/dict/index';
   import { getTreeByGroup } from '@/api/classifyManage';
   import { deepClone } from '@/utils';
   import { getDetails } from '@/api/classifyManage/itemInformation';
@@ -953,24 +963,9 @@
             trigger: 'change'
           }
         },
-        qualityResultsOptions: [
-          {
-            label: '合格',
-            value: 1
-          },
-          {
-            label: '不合格',
-            value: 2
-          }
-        ],
-        qualityStatus: {
-          0: '未质检',
-          1: '已质检'
-        }, // 质检状态 0未检 1已检
-        qualityResults: {
-          1: '合格',
-          2: '不合格'
-        }, // 质检结果 1合格 2不合格
+        qualityResultsOptions, // 质检结果下拉选项 0无 1合格 2不合格
+        qualityStatus, // 质检状态 0未检 1已检
+        qualityResults, // 质检结果 0无 1合格 2不合格
         productList: [], // 产品列表
         packingList: [], // 包装列表
         showPackingList: [], // 包装列表(虚拟列表)
@@ -1797,7 +1792,7 @@
       },
       // 包装质检结果修改
       packingResultCahnge(value, row) {
-        // 修改物料质检结果( 1合格 2不合格)
+        // 修改物料质检结果(0无 1合格 2不合格)
         this.materialList.map((item, index) => {
           if (item.parentIndex === row.index) {
             this.$set(this.materialList[index], 'result', value);
@@ -1808,13 +1803,13 @@
       materialResultCahnge(value, row) {
         // 修改包装质检结果
         let filterMaterialList = this.materialList.filter((item) => {
-          return item.parentIndex === row.parentIndex;
+          return item.parentIndex == row.parentIndex;
         });
         let packingIndex = this.packingList.findIndex((item) => {
-          return item.index === row.parentIndex;
+          return item.index == row.parentIndex;
         });
         let boolen = filterMaterialList.every((item) => {
-          return item.result === 1;
+          return item.result == 1;
         });
         this.$set(this.packingList[packingIndex], 'result', boolen ? 1 : 2);
       },
@@ -2640,8 +2635,8 @@
             isUnpack: row.isUnpack, // 是否允许拆包
             productionDate: productionDate, // 生产日期
             purchaseDate: purchaseDate, // 采购时间
-            result: 1, // 结果(1合格 2不合格)
-            status: 1 // 状态(0=未质检 1已质检)
+            result: this.formData.bizType == 2 && this.form.isQmsCheck ? 0 : 1, // 结果(0无 1合格 2不合格) 是否质检isQmsCheck(0否 1是) bizType(2采购入库)
+            status: this.formData.bizType == 2 && this.form.isQmsCheck ? 0 : 2 // 状态(0未质检 1待检 2已质检)
           };
           let outBoolen = !!this.getDict('不拆物料层规格', item.measureUnit)
             .dictValue;
@@ -2772,15 +2767,15 @@
       },
       // 选择质检结果改变质检状态
       changeWrapStatus(resultValue, row, type) {
-        console.log(resultValue);
+        console.log('resultValue--------------', resultValue);
         switch (resultValue) {
-          case '0':
+          case 0:
             // 清空质检状态
             row.status = 0;
             break;
           default:
             // 默认已检质检状态
-            row.status = 1;
+            row.status = 2;
             break;
         }
         if (type === '包装') {

src/views/bpm/stockManagement/storage_2.vue

@@ -660,7 +660,12 @@
             </template>
           </el-table-column>
 
-          <el-table-column label="质检结果" prop="result" width="120">
+          <el-table-column
+            v-if="!Number(form.isQmsCheck)"
+            label="质检结果"
+            prop="result"
+            width="120"
+          >
             <template slot-scope="{ row }">
               <el-select
                 v-if="!row.isPack"
@@ -834,7 +839,12 @@
             prop="weightUnit"
             width="100"
           ></el-table-column>
-          <el-table-column label="质检结果" prop="result" width="120">
+          <el-table-column
+            v-if="!Number(form.isQmsCheck)"
+            label="质检结果"
+            prop="result"
+            width="120"
+          >
             <template slot-scope="{ row }">
               <el-select
                 v-if="!row.isPack"
@@ -913,7 +923,12 @@
   import WarehousingDialog from './components/WarehousingDialog.vue';
   import { getCode } from '@/api/codeManagement/index.js';
   import selectType from './components/selectType_new.vue';
-  import { sceneState } from '@/utils/dict/index';
+  import {
+    sceneState,
+    qualityResultsOptions,
+    qualityResults,
+    qualityStatus
+  } from '@/utils/dict/index';
   import { getTreeByGroup } from '@/api/classifyManage';
   import { deepClone } from '@/utils';
   import BigNumber from 'bignumber.js';
@@ -962,24 +977,9 @@
             trigger: 'change'
           }
         },
-        qualityResultsOptions: [
-          {
-            label: '合格',
-            value: 1
-          },
-          {
-            label: '不合格',
-            value: 2
-          }
-        ],
-        qualityStatus: {
-          0: '未质检',
-          1: '已质检'
-        }, // 质检状态 0未检 1已检
-        qualityResults: {
-          1: '合格',
-          2: '不合格'
-        }, // 质检结果 1合格 2不合格
+        qualityResultsOptions, // 质检结果选项
+        qualityStatus, // 质检状态 0未检 1已检
+        qualityResults, // 质检结果 0无 1合格 2不合格
         productList: [], // 产品列表
         packingList: [], // 包装列表
         showPackingList: [], // 包装列表(虚拟列表)
@@ -1111,8 +1111,8 @@
                 supplierName: '', // 供应商名称
                 approvalNumber: item.approvalNumber, // 批准文号
                 packingSpecification: item.packingSpecification, // 包装规格
-                minPackingQuantity: 1, // 最小包装单元数量
-                packingQuantity: packingQuantity, // 包装数量
+                minPackingQuantity: packingQuantity, // 最小包装单元数量
+                packingQuantity: 1, // 包装数量
                 packingUnit: packingUnit, // 包装单位
                 measureQuantity: measureQuantity, // 计量数量
                 measureUnit: item.measuringUnit, // 计量单位
@@ -1721,13 +1721,13 @@
       materialResultCahnge(value, row) {
         // 修改包装质检结果
         let filterMaterialList = this.materialList.filter((item) => {
-          return item.parentIndex === row.parentIndex;
+          return item.parentIndex == row.parentIndex;
         });
         let packingIndex = this.packingList.findIndex((item) => {
-          return item.index === row.parentIndex;
+          return item.index == row.parentIndex;
         });
         let boolen = filterMaterialList.every((item) => {
-          return item.result === 1;
+          return item.result == 1;
         });
         this.$set(this.packingList[packingIndex], 'result', boolen ? 1 : 2);
       },
@@ -2186,8 +2186,8 @@
             isUnpack: row.isUnpack, // 是否允许拆包
             productionDate: productionDate, // 生产日期
             purchaseDate: purchaseDate, // 采购时间
-            result: 1, // 结果(1合格 2不合格)
-            status: 1 // 状态(0=未质检 1已质检)
+            result: this.formData.bizType == 2 && this.form.isQmsCheck ? 0 : 1, // 结果(0无 1合格 2不合格) 是否质检isQmsCheck(0否 1是) bizType(2采购入库)
+            status: this.formData.bizType == 2 && this.form.isQmsCheck ? 0 : 2 // 状态(0未质检 1待检 2已质检)
           };
           packingList.push(item);
         }
@@ -2275,8 +2275,8 @@
             clientCode: '', // 客户代号
             materielDesignation: '', // 物料代号
             engrave: '', // 刻码
-            result: 1, // 结果(1合格 2不合格)
-            status: 1 // 状态(0=未质检 1已质检)
+            result: this.formData.bizType == 2 && this.form.isQmsCheck ? 0 : 1, // 结果(0无 1合格 2不合格) 是否质检isQmsCheck(0否 1是) bizType(2采购入库)
+            status: this.formData.bizType == 2 && this.form.isQmsCheck ? 0 : 2 // 状态(0未质检 1待检 2已质检)
           });
         }
         return materialList;
@@ -2296,13 +2296,13 @@
       changeWrapStatus(resultValue, row, type) {
         console.log(resultValue);
         switch (resultValue) {
-          case '0':
+          case 0:
             // 清空质检状态
             row.status = 0;
             break;
           default:
             // 默认已检质检状态
-            row.status = 1;
+            row.status = 2;
             break;
         }
         if (type === '包装') {

src/views/bpm/stockManagement/storage_3.vue

@@ -654,7 +654,12 @@
             </template>
           </el-table-column>
 
-          <el-table-column label="质检结果" prop="result" width="120">
+          <el-table-column
+            v-if="form.isQmsCheck == 0"
+            label="质检结果"
+            prop="result"
+            width="120"
+          >
             <template slot-scope="{ row }">
               <el-select
                 v-if="!row.isPack"
@@ -902,7 +907,12 @@
   import WarehousingDialog from './components/WarehousingDialog.vue';
   import { getCode } from '@/api/codeManagement/index.js';
   import selectType from './components/selectType_new.vue';
-  import { sceneState } from '@/utils/dict/index';
+  import {
+    sceneState,
+    qualityResultsOptions,
+    qualityResults,
+    qualityStatus
+  } from '@/utils/dict/index';
   import { getTreeByGroup } from '@/api/classifyManage';
   import { deepClone } from '@/utils';
   import { getDetails } from '@/api/classifyManage/itemInformation';
@@ -953,24 +963,9 @@
             trigger: 'change'
           }
         },
-        qualityResultsOptions: [
-          {
-            label: '合格',
-            value: 1
-          },
-          {
-            label: '不合格',
-            value: 2
-          }
-        ],
-        qualityStatus: {
-          0: '未质检',
-          1: '已质检'
-        }, // 质检状态 0未检 1已检
-        qualityResults: {
-          1: '合格',
-          2: '不合格'
-        }, // 质检结果 1合格 2不合格
+        qualityResultsOptions, // 质检结果选项
+        qualityStatus, // 质检状态 0未检 1已检
+        qualityResults, // 质检结果 0无 1合格 2不合格
         productList: [], // 产品列表
         packingList: [], // 包装列表
         showPackingList: [], // 包装列表(虚拟列表)
@@ -1797,7 +1792,7 @@
       },
       // 包装质检结果修改
       packingResultCahnge(value, row) {
-        // 修改物料质检结果( 1合格 2不合格)
+        // 修改物料质检结果(0无 1合格 2不合格)
         this.materialList.map((item, index) => {
           if (item.parentIndex === row.index) {
             this.$set(this.materialList[index], 'result', value);
@@ -1808,13 +1803,13 @@
       materialResultCahnge(value, row) {
         // 修改包装质检结果
         let filterMaterialList = this.materialList.filter((item) => {
-          return item.parentIndex === row.parentIndex;
+          return item.parentIndex == row.parentIndex;
         });
         let packingIndex = this.packingList.findIndex((item) => {
-          return item.index === row.parentIndex;
+          return item.index == row.parentIndex;
         });
         let boolen = filterMaterialList.every((item) => {
-          return item.result === 1;
+          return item.result == 1;
         });
         this.$set(this.packingList[packingIndex], 'result', boolen ? 1 : 2);
       },
@@ -2640,8 +2635,8 @@
             isUnpack: row.isUnpack, // 是否允许拆包
             productionDate: productionDate, // 生产日期
             purchaseDate: purchaseDate, // 采购时间
-            result: 1, // 结果(1合格 2不合格)
-            status: 1 // 状态(0=未质检 1已质检)
+            result: this.formData.bizType == 2 && this.form.isQmsCheck ? 0 : 1, // 结果(0无 1合格 2不合格) 是否质检isQmsCheck(0否 1是) bizType(2采购入库)
+            status: this.formData.bizType == 2 && this.form.isQmsCheck ? 0 : 2 // 状态(0未质检 1待检 2已质检)
           };
           let outBoolen = !!this.getDict('不拆物料层规格', item.measureUnit)
             .dictValue;
@@ -2772,15 +2767,15 @@
       },
       // 选择质检结果改变质检状态
       changeWrapStatus(resultValue, row, type) {
-        console.log(resultValue);
+        console.log('resultValue--------------', resultValue);
         switch (resultValue) {
-          case '0':
+          case 0:
             // 清空质检状态
             row.status = 0;
             break;
           default:
             // 默认已检质检状态
-            row.status = 1;
+            row.status = 2;
             break;
         }
         if (type === '包装') {

src/views/home/index.vue

@@ -6,21 +6,30 @@
           <span>数据概览</span>
         </div>
         <div class="card-cell-content">
-          <div class="card-cell-value" @click="handelRouterTo('/page-pro/project-initiation')">
+          <div
+            class="card-cell-value"
+            @click="handelRouterTo('/page-pro/project-initiation')"
+          >
             <div class="img-box img1-url"></div>
             <div class="text-box">
               <span>{{ projectNum }}</span>
               <span>我的项目</span>
             </div>
           </div>
-          <div class="card-cell-value" @click="handelRouterTo('/page-pro/task-manage')">
+          <div
+            class="card-cell-value"
+            @click="handelRouterTo('/page-pro/task-manage')"
+          >
             <div class="img-box img2-url"></div>
             <div class="text-box">
               <span>{{ taskNum }}</span>
               <span>我的任务</span>
             </div>
           </div>
-          <div class="card-cell-value" @click="handelRouterTo('/page-wt/tickets')">
+          <div
+            class="card-cell-value"
+            @click="handelRouterTo('/page-wt/tickets')"
+          >
             <div class="img-box img3-url"></div>
             <div class="text-box">
               <span>{{ workOrderNum }}</span>
@@ -43,8 +52,13 @@
         <div class="card-cell-info">
           <div class="card-cell-value">
             <div>
-              <el-avatar shape="square" :size="80" src="https://empty" @error="errorHandler">
-                <img :src="user.info.avatarAddress"/>
+              <el-avatar
+                shape="square"
+                :size="80"
+                src="https://empty"
+                @error="errorHandler"
+              >
+                <img :src="user.info.avatarAddress" />
               </el-avatar>
             </div>
             <div class="text-box">
@@ -66,20 +80,24 @@
         <div slot="header" class="clearfix">
           <span>流程待办</span>
         </div>
-        <div>
+        <div style="height: 100%">
           <ele-pro-table
             ref="table"
+            class="table-box"
             :columns="columns"
             :need-page="false"
             :toolkit="[]"
-            style="padding: 10px"
             height="calc(38vh)"
             :datasource="datasource"
             cache-key="systemHomeTable5"
           >
             <template v-slot:status="{ row }">
-              <el-tag type="success" v-if="row.suspensionState === 1">激活</el-tag>
-              <el-tag type="warning" v-if="row.suspensionState === 2">挂起</el-tag>
+              <el-tag type="success" v-if="row.suspensionState === 1"
+                >激活</el-tag
+              >
+              <el-tag type="warning" v-if="row.suspensionState === 2"
+                >挂起</el-tag
+              >
             </template>
             <template v-slot:name="{ row }">
               <el-link
@@ -88,8 +106,7 @@
                 @click="handleAudit('', row)"
               >
                 {{ row.name }}
-              </el-link
-              >
+              </el-link>
             </template>
             <!-- 操作列 -->
             <template v-slot:action="{ row }">
@@ -98,9 +115,8 @@
                 type="text"
                 icon="el-icon-edit"
                 @click="handleAudit('audit', row)"
-              >处理
-              </el-button
-              >
+                >处理
+              </el-button>
               <!-- <el-button
                 size="mini"
                 type="text"
@@ -112,33 +128,19 @@
           </ele-pro-table>
         </div>
       </el-card>
+
       <el-card class="card-cell middle-cell">
         <div slot="header" class="clearfix">
-          <span>消息提醒</span>
+          <span>统一门户</span>
         </div>
-        <div>
-          <vue-seamless-scroll class="scroll-box"
-                               v-if="messageScrollList.length"
-                               :data="messageScrollList"
-                               :class-option="defineScroll">
-            <el-timeline class="scroll-box-content">
-              <el-timeline-item :hide-timestamp="false" v-for="o in messageScrollList" :key="o.id">
-                <template slot="dot">
-                  <span class="scroll-box-content-dot"></span>
-                </template>
-                <div class="scroll-box-content-item">
-                  <span class="item-date">{{ o.createTime }}</span>
-                  <span class="item-text" :title="`${ o.templateNickname + ':'+o.templateContent}`">
-                    <span style="font-size: 0.8vw;">{{o.templateNickname +':'}}</span>
-                    {{
-                       o.templateContent
-                    }}</span>
-                </div>
-              </el-timeline-item>
-            </el-timeline>
-
-          </vue-seamless-scroll>
-          <el-empty v-else description="暂无"></el-empty>
+        <div class="list">
+          <div
+            v-for="(item, index) in list"
+            :class="[(index + 1) % 3 == 0 ? 'item margin_0' : 'item']"
+          >
+            <div><img :src="item.img" /></div>
+            <div>{{ item.name }}</div>
+          </div>
         </div>
       </el-card>
     </div>
@@ -148,11 +150,18 @@
           <span>常用功能</span>
         </div>
         <draggable v-model="commonList" class="card-cell-content">
-
-          <!--                   @click="handleCommonListDel(item,index)"></i>-->
-          <div v-for="(item,index) in commonList" :key="item.id" class="card-cell-content-box"
-               @click="handleAdd(item,index)" :title="!['-999','-1'].includes(item.id)&&isDelFlag?'点击删除':''"
-               :class="!['-999','-1'].includes(item.id)&&isDelFlag?'div-del':''">
+          <div
+            v-for="(item, index) in commonList"
+            :key="item.id"
+            class="card-cell-content-box"
+            @click="handleAdd(item, index)"
+            :title="
+              !['-999', '-1'].includes(item.id) && isDelFlag ? '点击删除' : ''
+            "
+            :class="
+              !['-999', '-1'].includes(item.id) && isDelFlag ? 'div-del' : ''
+            "
+          >
             <!--            <el-popover-->
             <!--              v-if="item.id !=='-1'"-->
             <!--              placement="top-start"-->
@@ -177,598 +186,836 @@
             <!--              </div>-->
             <!--            </el-tooltip>-->
             <div class="card-cell-content-div">
-              <i :class="item.icon||'el-icon-s-opportunity'"></i>
+              <i :class="item.icon || 'el-icon-s-opportunity'"></i>
               <span>{{ item.name }}</span>
             </div>
           </div>
-
         </draggable>
       </el-card>
+      <el-card class="card-cell middle-cell">
+        <div slot="header" class="clearfix">
+          <span>消息提醒</span>
+        </div>
+        <div>
+          <vue-seamless-scroll
+            class="scroll-box"
+            v-if="messageScrollList.length"
+            :data="messageScrollList"
+            :class-option="defineScroll"
+          >
+            <el-timeline class="scroll-box-content">
+              <el-timeline-item
+                :hide-timestamp="false"
+                v-for="o in messageScrollList"
+                :key="o.id"
+              >
+                <template slot="dot">
+                  <span class="scroll-box-content-dot"></span>
+                </template>
+                <div class="scroll-box-content-item">
+                  <span class="item-date">{{ o.createTime }}</span>
+                  <span
+                    class="item-text"
+                    :title="`${o.templateNickname + ':' + o.templateContent}`"
+                  >
+                    <span style="font-size: 0.8vw">{{
+                      o.templateNickname + ':'
+                    }}</span>
+                    {{ o.templateContent }}</span
+                  >
+                </div>
+              </el-timeline-item>
+            </el-timeline>
+          </vue-seamless-scroll>
+          <el-empty v-else description="暂无"></el-empty>
+        </div>
+      </el-card>
     </div>
     <handleTask ref="handleTaskRef" @reload="reload"></handleTask>
     <detail ref="detailRef"></detail>
-    <commonDialog ref="commonDialogRef" v-if="commonDialogFlag"
-                  :common-dialog-flag.sync="commonDialogFlag" @reload="getUserResourceList"></commonDialog>
-    <handleFormParserTask v-if="formParserDialogFlag"  @reload="reload" :formParserDialogFlag.sync="formParserDialogFlag" ref="formParserDialogRef" ></handleFormParserTask>
+    <commonDialog
+      ref="commonDialogRef"
+      v-if="commonDialogFlag"
+      :common-dialog-flag.sync="commonDialogFlag"
+      @reload="getUserResourceList"
+    ></commonDialog>
+    <handleFormParserTask
+      v-if="formParserDialogFlag"
+      @reload="reload"
+      :formParserDialogFlag.sync="formParserDialogFlag"
+      ref="formParserDialogRef"
+    ></handleFormParserTask>
   </div>
 </template>
 
 <script>
-
-
-import {getTodoTaskPage, notifyMessagePageAPI} from "@/api/bpm/task";
-import {mapGetters} from "vuex";
-import detail from "@/views/bpm/processInstance/detail.vue";
-import handleTask from "@/views/bpm/handleTask/index.vue";
-import {deepClone} from "ele-admin/lib/utils/core";
-import vueSeamlessScroll from 'vue-seamless-scroll'
-import {projectsPageAPI, projectsTaskPageAPI, userResourceDeleteAPI, userResourceListAPI} from "@/api/home";
-import {getWorkOrderPage} from "@/api/tickets";
-import {statistics} from "@/api/bpm/components/inspectionManage";
-import commonDialog from "@/views/home/common-dialog.vue";
-import xyy from '@/assets/xyy.jpg'
-import draggable from 'vuedraggable';
-import handleFormParserTask from "@/views/bpm/handleTask/formParser/formParserDialog.vue";
-
-export default {
-  name: "index",
-  components: {handleFormParserTask, handleTask, detail, vueSeamlessScroll, commonDialog, draggable},
-  data() {
-    return {
-      xyy,
-      time: '',
-      date: '',
-      week: '',
-      commonDialogFlag: false,
-      formParserDialogFlag: false,
-      updateTimer: null,
-      projectNum: 0,
-      taskNum: 0,
-      workOrderNum: 0,
-      messageScrollList: [],
-      defineScroll: {
-        step: 0.2, // 数值越大速度滚动越快
-        limitMoveNum: 5, // 开始无缝滚动的数据量 this.dataList.length
-        hoverStop: true, // 是否开启鼠标悬停stop
-        direction: 1, // 0向下 1向上 2向左 3向右
-        openWatch: true, // 开启数据实时监控刷新dom
-        singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
-        singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
-        waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
-      },
-      commonList: [],
-      isDelFlag: false,
-      columns: [
-        {
-          columnKey: 'index',
-          label: '序号',
-          type: 'index',
-          width: 55,
-          align: 'center',
-          showOverflowTooltip: true,
-          fixed: 'left'
-        },
-        {
-          prop: 'processInstance.processTypeName',
-          label: '流程分类',
-          align: 'center',
-          showOverflowTooltip: true,
-          minWidth: 120
-        },
-        {
-          prop: 'processInstance.name',
-          label: '流程名称',
-          align: 'center',
-          showOverflowTooltip: true,
-          minWidth: 200
-        },
-        {
-          prop: 'name',
-          label: '任务名称',
-          align: 'center',
-          slot: 'name',
-
-          showOverflowTooltip: true,
-          minWidth: 200
-        },
-        {
-          prop: 'processInstance.startUserNickname',
-          label: '流程发起人',
-          align: 'center',
-          showOverflowTooltip: true,
-          minWidth: 120
-        },
-        // {
-        //   prop: 'suspensionState',
-        //   slot: 'suspensionState',
-        //   label: '状态',
-        //   align: 'center',
-        //   showOverflowTooltip: true,
-        //   minWidth: 200
-        // },
-
-        {
-          prop: 'createTime',
-          label: '创建时间',
-          align: 'center',
-          showOverflowTooltip: true,
-          minWidth: 180
-        },
-
-        {
-          columnKey: 'action',
-          label: '操作',
-          width: 200,
-          align: 'center',
-          resizable: false,
-          slot: 'action',
-          showOverflowTooltip: true,
-          fixed: 'right'
-        }
-      ]
-    };
-  },
-  computed: {
-    ...mapGetters(['user'])
-  },
-  created() {
-    // window.isFullscreen = false
-    this.updateTimer = setInterval(this.updateTime, 1000);
-    this.getMessageList();
-    this.getProjectNum();
-    this.getTaskNum();
-    this.getWorkOrderNum();
-    this.getUserResourceList();
-    console.log(this.user);
-  },
-  methods: {
-    async getProjectNum() {
-      const {count} = await projectsPageAPI({size: 1, pageNum: 1, parentId: "0"})
-      this.projectNum = count;
-    },
-    async getTaskNum() {
-      const {count} = await projectsTaskPageAPI({size: 1, pageNum: 1})
-      this.taskNum = count;
+  import { getImageUrl } from '@/utils/file';
+  import { getTodoTaskPage, notifyMessagePageAPI } from '@/api/bpm/task';
+  import { mapGetters } from 'vuex';
+  import detail from '@/views/bpm/processInstance/detail.vue';
+  import handleTask from '@/views/bpm/handleTask/index.vue';
+  import { deepClone } from 'ele-admin/lib/utils/core';
+  import vueSeamlessScroll from 'vue-seamless-scroll';
+  import {
+    projectsPageAPI,
+    projectsTaskPageAPI,
+    userResourceDeleteAPI,
+    userResourceListAPI,
+    getList
+  } from '@/api/home';
+  import { getWorkOrderPage } from '@/api/tickets';
+  import { statistics } from '@/api/bpm/components/inspectionManage';
+  import commonDialog from '@/views/home/common-dialog.vue';
+  import xyy from '@/assets/xyy.jpg';
+  import draggable from 'vuedraggable';
+  import handleFormParserTask from '@/views/bpm/handleTask/formParser/formParserDialog.vue';
+
+  export default {
+    name: 'index',
+    components: {
+      handleFormParserTask,
+      handleTask,
+      detail,
+      vueSeamlessScroll,
+      commonDialog,
+      draggable
     },
-    async getWorkOrderNum() {
-      const {total} = await statistics()
-
-      this.workOrderNum = total;
+    data() {
+      return {
+        xyy,
+        list: [],
+        time: '',
+        date: '',
+        week: '',
+        commonDialogFlag: false,
+        formParserDialogFlag: false,
+        updateTimer: null,
+        projectNum: 0,
+        taskNum: 0,
+        workOrderNum: 0,
+        messageScrollList: [],
+        defineScroll: {
+          step: 0.2, // 数值越大速度滚动越快
+          limitMoveNum: 5, // 开始无缝滚动的数据量 this.dataList.length
+          hoverStop: true, // 是否开启鼠标悬停stop
+          direction: 1, // 0向下 1向上 2向左 3向右
+          openWatch: true, // 开启数据实时监控刷新dom
+          singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
+          singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
+          waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
+        },
+        commonList: [],
+        isDelFlag: false,
+        columns: [
+          {
+            columnKey: 'index',
+            label: '序号',
+            type: 'index',
+            width: 55,
+            align: 'center',
+            showOverflowTooltip: true,
+            fixed: 'left'
+          },
+          {
+            prop: 'processInstance.processTypeName',
+            label: '流程分类',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 120
+          },
+          {
+            prop: 'processInstance.name',
+            label: '流程名称',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 200
+          },
+          {
+            prop: 'name',
+            label: '任务名称',
+            align: 'center',
+            slot: 'name',
+
+            showOverflowTooltip: true,
+            minWidth: 200
+          },
+          {
+            prop: 'processInstance.startUserNickname',
+            label: '流程发起人',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 120
+          },
+          // {
+          //   prop: 'suspensionState',
+          //   slot: 'suspensionState',
+          //   label: '状态',
+          //   align: 'center',
+          //   showOverflowTooltip: true,
+          //   minWidth: 200
+          // },
+
+          {
+            prop: 'createTime',
+            label: '创建时间',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 180
+          },
+
+          {
+            columnKey: 'action',
+            label: '操作',
+            width: 200,
+            align: 'center',
+            resizable: false,
+            slot: 'action',
+            showOverflowTooltip: true,
+            fixed: 'right'
+          }
+        ]
+      };
     },
-    async getUserResourceList() {
-      this.commonList = await userResourceListAPI()
-      this.commonList.unshift({
-        name: '添加',
-        id: '-1',
-        icon: 'el-icon-edit',
-      })
-      this.commonList.push({
-        name: '删除',
-        id: '-999',
-        icon: 'el-icon-delete',
-      })
+    computed: {
+      ...mapGetters(['user'])
     },
-    handelRouterTo(path) {
-      window.history.pushState(null, '', path)
-      // this.$router.push(path);
+    created() {
+      // window.isFullscreen = false
+      this.updateTimer = setInterval(this.updateTime, 1000);
+      this.getMessageList();
+      this.getProjectNum();
+      this.getTaskNum();
+      this.getWorkOrderNum();
+      this.getUserResourceList();
+      this.getPages();
+      console.log(this.user);
     },
-    handleAdd(item, index) {
-      if (item.id == -1) {
-        this.commonDialogFlag = true
-        this.$nextTick(() => {
-          this.$refs.commonDialogRef.init()
-        })
-      } else if (item.id == -999) {
-        this.isDelFlag = !this.isDelFlag
-        this.commonList.pop()
+    methods: {
+      async getPages() {
+        let { list } = await getList({ pageNum: 1, size: 9999 });
+        this.list = list.map((item) => {
+          return {
+            ...item,
+            img: getImageUrl(item.iconPath)
+          };
+        });
+      },
+      async getProjectNum() {
+        const { count } = await projectsPageAPI({
+          size: 1,
+          pageNum: 1,
+          parentId: '0'
+        });
+        this.projectNum = count;
+      },
+      async getTaskNum() {
+        const { count } = await projectsTaskPageAPI({ size: 1, pageNum: 1 });
+        this.taskNum = count;
+      },
+      async getWorkOrderNum() {
+        const { total } = await statistics();
+
+        this.workOrderNum = total;
+      },
+      async getUserResourceList() {
+        this.commonList = await userResourceListAPI();
+        this.commonList.unshift({
+          name: '添加',
+          id: '-1',
+          icon: 'el-icon-edit'
+        });
         this.commonList.push({
-          name: `${this.isDelFlag ? '取消删除' : '删除'}`,
+          name: '删除',
           id: '-999',
-          icon: 'el-icon-delete',
-        })
-      } else {
-        if (this.isDelFlag) return this.handleCommonListDel(item, index)
-
-        let urlPath = item.topUrl + item.url
-        this.handelRouterTo(urlPath)
-      }
-    },
-    async handleCommonListDel(item, index) {
-      await userResourceDeleteAPI([item.id])
-      this.commonList.splice(index, 1)
-    },
-    /* 表格数据源 */
-    datasource({page, limit, where, order}) {
-      return getTodoTaskPage({
-        pageNo: page,
-        pageSize: limit,
-        ...this.params
-      });
-    },
-    async getMessageList() {
-      const {list} = await notifyMessagePageAPI({
-        pageNum: 1,
-        size: 9999,
-        userId: this.user.info.userId
-      });
-      this.messageScrollList = deepClone(list);
-
-    },
-    errorHandler(err, vm) {
-      console.log("图片加载失败");
-    },
-    //实时更新日期
-    updateTime() {
-      let now = new Date();
-      let hours = now.getHours();
-      let minutes = now.getMinutes();
-      let seconds = now.getSeconds();
-      this.time =
-        hours.toString().padStart(2, '0') +
-        ':' +
-        minutes.toString().padStart(2, '0') +
-        ':' +
-        seconds.toString().padStart(2, '0');
-
-      let year = now.getFullYear();
-      let month = now.getMonth() + 1;
-      let day = now.getDate();
-      this.date = year + '年' + month + '月' + day + '日';
-
-      let weekInfo = {
-        1: '一',
-        2: '二',
-        3: '三',
-        4: '四',
-        5: '五',
-        6: '六',
-        0: '日'
-      };
-      this.week = '星期' + weekInfo[now.getDay()];
-    },
-    /** 处理审批按钮 */
-
-    handleAudit(type, row) {
-
-      if(Object.keys(row.formJson).length){
-        this.formParserDialogFlag = true
-        this.$nextTick(()=>{
-          this.$refs.formParserDialogRef.open({
-            // id: row.processInstance.id,
-            // taskId: row.id,
-            // taskDefinitionKey: row.taskDefinitionKey,
-            // formJson:row.formJson,
-            // valueJsom:row.formJson,
-            ...row
+          icon: 'el-icon-delete'
+        });
+      },
+      handelRouterTo(path) {
+        window.history.pushState(null, '', path);
+        // this.$router.push(path);
+      },
+      handleAdd(item, index) {
+        if (item.id == -1) {
+          this.commonDialogFlag = true;
+          this.$nextTick(() => {
+            this.$refs.commonDialogRef.init();
+          });
+        } else if (item.id == -999) {
+          this.isDelFlag = !this.isDelFlag;
+          this.commonList.pop();
+          this.commonList.push({
+            name: `${this.isDelFlag ? '取消删除' : '删除'}`,
+            id: '-999',
+            icon: 'el-icon-delete'
           });
-        })
-      }else if (type == 'audit') {
-        this.$refs.handleTaskRef.open({
-          id: row.processInstance.id,
-          businessId: row.businessId,
-          taskId: row.id,
-          taskDefinitionKey: row.taskDefinitionKey,
-          pcHandleRouter: row.pcHandleRouter,
-          pcViewRouter: row.pcViewRouter
+        } else {
+          if (this.isDelFlag) return this.handleCommonListDel(item, index);
+
+          let urlPath = item.topUrl + item.url;
+          this.handelRouterTo(urlPath);
+        }
+      },
+      async handleCommonListDel(item, index) {
+        await userResourceDeleteAPI([item.id]);
+        this.commonList.splice(index, 1);
+      },
+      /* 表格数据源 */
+      datasource({ page, limit, where, order }) {
+        return getTodoTaskPage({
+          pageNo: page,
+          pageSize: limit,
+          ...this.params
         });
-      } else {
-        this.$refs.detailRef.open(row.processInstance.id);
-      }
-    },
+      },
+      async getMessageList() {
+        const { list } = await notifyMessagePageAPI({
+          pageNum: 1,
+          size: 9999,
+          userId: this.user.info.userId
+        });
+        this.messageScrollList = deepClone(list);
+      },
+      errorHandler(err, vm) {
+        console.log('图片加载失败');
+      },
+      //实时更新日期
+      updateTime() {
+        let now = new Date();
+        let hours = now.getHours();
+        let minutes = now.getMinutes();
+        let seconds = now.getSeconds();
+        this.time =
+          hours.toString().padStart(2, '0') +
+          ':' +
+          minutes.toString().padStart(2, '0') +
+          ':' +
+          seconds.toString().padStart(2, '0');
+
+        let year = now.getFullYear();
+        let month = now.getMonth() + 1;
+        let day = now.getDate();
+        this.date = year + '年' + month + '月' + day + '日';
+
+        let weekInfo = {
+          1: '一',
+          2: '二',
+          3: '三',
+          4: '四',
+          5: '五',
+          6: '六',
+          0: '日'
+        };
+        this.week = '星期' + weekInfo[now.getDay()];
+      },
+      /** 处理审批按钮 */
+
+      handleAudit(type, row) {
+        if (Object.keys(row.formJson).length) {
+          this.formParserDialogFlag = true;
+          this.$nextTick(() => {
+            this.$refs.formParserDialogRef.open({
+              // id: row.processInstance.id,
+              // taskId: row.id,
+              // taskDefinitionKey: row.taskDefinitionKey,
+              // formJson:row.formJson,
+              // valueJsom:row.formJson,
+              ...row
+            });
+          });
+        } else if (type == 'audit') {
+          this.$refs.handleTaskRef.open({
+            id: row.processInstance.id,
+            businessId: row.businessId,
+            taskId: row.id,
+            taskDefinitionKey: row.taskDefinitionKey,
+            pcHandleRouter: row.pcHandleRouter,
+            pcViewRouter: row.pcViewRouter
+          });
+        } else {
+          this.$refs.detailRef.open(row.processInstance.id);
+        }
+      },
 
-    /* 刷新表格 */
-    reload(where) {
-      this.$refs.table.reload({page: 1, where});
+      /* 刷新表格 */
+      reload(where) {
+        this.$refs.table.reload({ page: 1, where });
+      }
     },
-  },
-  deactivated() {
-    clearInterval(this.updateTimer);
-  },
-}
+    deactivated() {
+      clearInterval(this.updateTimer);
+    }
+  };
 </script>
 
-
 <style scoped lang="scss">
-.box-container {
-  padding: 10px;
-  display: flex;
-  flex-direction: column;
-  height: calc(100vh - 116px);
-  width: calc(100%);
-
-  .box-container-top {
-    height: 22%;
+  .box-container {
+    height: 100%;
     width: 100%;
-    min-height: 180px;
+    padding: 10px;
+    box-sizing: border-box;
     display: flex;
-    justify-content: space-between;
-
-    .middle-cell:nth-child(1) {
-      flex: 0 0 70%;
+    flex-direction: column;
+    // height: calc(100vh - 116px);
+    // width: calc(100%);
 
-      .card-cell-content {
-        padding: 0;
-        height: 100%;
-        background: #2e80ee;
-        display: flex;
-        align-items: center;
+    .box-container-top {
+      height: 22%;
+      width: 100%;
+      min-height: 180px;
+      display: flex;
+      justify-content: space-between;
 
-        :hover {
-          background: #79aef5;
-        }
+      .middle-cell:nth-child(1) {
+        flex: 0 0 70%;
 
-        .card-cell-value {
-          cursor: pointer;
+        .card-cell-content {
+          padding: 0;
           height: 100%;
+          background: #2e80ee;
           display: flex;
-          flex: 0 0 25%;
           align-items: center;
-          justify-content: center;
 
-          .img1-url {
-            background-image: url("@/assets/home-logo-1.png");
+          :hover {
+            background: #79aef5;
           }
 
-          .img2-url {
-            background-image: url("@/assets/home-logo-2.png");
-          }
+          .card-cell-value {
+            cursor: pointer;
+            height: 100%;
+            display: flex;
+            flex: 0 0 25%;
+            align-items: center;
+            justify-content: center;
 
-          .img3-url {
-            background-image: url("@/assets/home-logo-3.png");
-          }
+            .img1-url {
+              background-image: url('@/assets/home-logo-1.png');
+            }
+
+            .img2-url {
+              background-image: url('@/assets/home-logo-2.png');
+            }
+
+            .img3-url {
+              background-image: url('@/assets/home-logo-3.png');
+            }
+
+            .img4-url {
+              background-image: url('@/assets/home-logo-4.png');
+            }
+
+            .img-box {
+              width: 60px;
+              height: 60px;
+              position: relative;
+              background-size: contain;
+              background-repeat: no-repeat;
+            }
 
-          .img4-url {
-            background-image: url("@/assets/home-logo-4.png");
+            .text-box {
+              height: 70px;
+              display: flex;
+              flex-direction: column;
+              justify-content: space-around;
+              color: #ffffff;
+              padding: 0 10px;
+
+              :nth-child(1) {
+                font-size: 1.5vw;
+                font-family: fantasy;
+              }
+
+              :nth-child(2) {
+                font-size: 1vw;
+              }
+            }
           }
+        }
+      }
+
+      .middle-cell:nth-child(2) {
+        flex: 0 0 29.2%;
+        .card-cell-info {
+          padding: 0 10px;
+          height: 100%;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          font-weight: bold;
 
-          .img-box {
-            width: 60px;
-            height: 60px;
-            position: relative;
-            background-size: contain;
-            background-repeat: no-repeat;
+          .card-cell-value {
+            display: flex;
+            height: 80px;
+
+            .text-box {
+              margin: 0 10px;
+              display: flex;
+              flex-direction: column;
+              justify-content: space-around;
+              font-size: 0.7vw;
+              color: #000000;
+            }
           }
 
-          .text-box {
-            height: 70px;
+          .card-cell-date {
+            height: 80px;
             display: flex;
             flex-direction: column;
             justify-content: space-around;
-            color: #ffffff;
-            padding: 0 10px;
+            align-items: flex-end;
+            color: #000000;
+            font-size: 0.7vw;
+            margin: 0 10px;
+          }
+        }
+      }
+    }
 
-            :nth-child(1) {
-              font-size: 1.5vw;
-              font-family: fantasy;
-            }
+    .box-container-middle {
+      margin: 10px 0;
+      flex: 1;
+      display: flex;
+      min-height: 280px;
+      justify-content: space-between;
+      .middle-cell:nth-child(1) {
+        flex: 0 0 70%;
+      }
 
-            :nth-child(2) {
-              font-size: 1vw;
+      .middle-cell:nth-child(2) {
+        flex: 0 0 29.2%;
+        :deep(.el-card__body) {
+          overflow: auto;
+          .list {
+            flex: 1;
+            padding: 10px;
+            box-sizing: border-box;
+            .item {
+              display: inline-block;
+              width: 32%;
+              margin-right: 2%;
+              height: 200px;
+              padding: 10px;
+              box-sizing: border-box;
+              margin-bottom: 10px;
+              border-radius: 5px;
+              border: 1px solid #ddd;
+              cursor: pointer;
+              > div:first-child {
+                flex: 1;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                > img {
+                  width: 100%;
+                  aspect-ratio: 32/16;
+                }
+              }
+              > div:last-child {
+                height: 20px;
+                font-size: 16px;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+              }
+            }
+            .margin_0 {
+              margin-right: 0;
             }
           }
         }
       }
-
-
+      // > div:first-child {
+      //   flex: 0 0 70%;
+      //   display: flex;
+      //   flex-direction: column;
+      //   .table-box {
+      //     height: 100%;
+      //     padding: 10px;
+      //     box-sizing: border-box;
+      //     display: flex;
+      //     flex-direction: column;
+      //   }
+      //   .middle-cell:nth-child(1) {
+      //     flex: 1;
+      //     margin-bottom: 10px;
+      //   }
+      //   .middle-cell:nth-child(2) {
+      //     width: 100%;
+      //     display: flex;
+      //     flex-direction: column;
+      //     height: 200px;
+      //     // min-height: 100px;
+      //     // min-width: 400px;
+
+      //     .card-cell-content {
+      //       display: flex;
+      //       align-items: center;
+      //       justify-content: flex-start;
+      //       flex-wrap: nowrap;
+      //       align-content: center;
+      //       height: 100%;
+      //       overflow-x: auto;
+      //       padding: 0 10px;
+
+      //       .card-cell-content-box {
+      //         display: flex;
+      //         flex-direction: column;
+      //         align-items: center;
+      //         height: 80%;
+      //         width: 100%;
+      //         border: 1px solid #e3e5e4;
+      //         justify-content: space-evenly;
+      //         flex: 0 0 5.5%;
+      //         padding: 8px 0;
+      //         border-radius: 5px;
+      //         margin-right: 10px;
+      //         cursor: pointer;
+
+      //         &:hover {
+      //           background: #dee4e9;
+      //         }
+      //       }
+
+      //       .card-cell-content-div {
+      //         height: 100%;
+      //         width: 100%;
+      //         display: flex;
+      //         flex-direction: column;
+      //         align-items: center;
+      //         justify-content: space-evenly;
+      //       }
+
+      //       .card-cell-content-div i {
+      //         font-size: 2vw;
+      //       }
+
+      //       .card-cell-content-div span {
+      //         letter-spacing: 2px;
+      //         font-weight: 600;
+      //       }
+      //     }
+
+      //     .middle-cell {
+      //       flex: 0 0 100%;
+      //     }
+      //   }
+      // }
+
+      // > div:nth-child(2) {
+      //   flex: 0 0 29.2%;
+      //   display: flex;
+      //   flex-direction: column;
+      //   .middle-cell:nth-child(1) {
+      //     flex: 1;
+      //     margin-bottom: 10px;
+      //     display: flex;
+      //     flex-direction: column;
+      //     .list {
+      //       flex: 1;
+      //       padding: 10px;
+      //       box-sizing: border-box;
+      //       .item {
+      //         display: inline-block;
+      //         width: 32%;
+      //         margin-right: 2%;
+      //         padding: 5px;
+      //         box-sizing: border-box;
+      //         margin-bottom: 10px;
+      //         border-radius: 5px;
+      //         border: 1px solid #ddd;
+      //         cursor: pointer;
+      //         > div:first-child {
+      //           flex: 1;
+      //           display: flex;
+      //           align-items: center;
+      //           justify-content: center;
+      //           > img {
+      //             height: 60px;
+      //             width: 60px;
+      //           }
+      //         }
+      //         > div:last-child {
+      //           height: 30px;
+      //           font-size: 16px;
+      //           display: flex;
+      //           align-items: center;
+      //           justify-content: center;
+      //         }
+      //       }
+      //       .margin_0 {
+      //         margin-right: 0;
+      //       }
+      //     }
+      //   }
+      //   .middle-cell:nth-child(2) {
+      //     width: 100%;
+      //     display: flex;
+      //     flex-direction: column;
+      //     height: 250px;
+      //   }
+      // }
     }
 
-    .middle-cell:nth-child(2) {
-      flex: 0 0 29.2%;
+    .box-container-bottom {
+      width: 100%;
+      display: flex;
+      min-height: 200px;
+      justify-content: space-between;
+      .middle-cell:nth-child(1) {
+        flex: 0 0 70%;
+      }
 
-      .card-cell-info {
-        padding: 0 10px;
-        height: 100%;
+      .middle-cell:nth-child(2) {
+        flex: 0 0 29.2%;
+      }
+      .card-cell-content {
         display: flex;
         align-items: center;
-        justify-content: space-between;
-        font-weight: bold;
+        justify-content: flex-start;
+        flex-wrap: nowrap;
+        align-content: center;
+        height: 100%;
+        overflow-x: auto;
+        padding: 0 10px;
 
-        .card-cell-value {
+        .card-cell-content-box {
           display: flex;
-          height: 80px;
+          flex-direction: column;
+          align-items: center;
+          height: 80%;
+          width: 100%;
+          border: 1px solid #e3e5e4;
+          justify-content: space-evenly;
+          flex: 0 0 5.5%;
+          padding: 8px 0;
+          border-radius: 5px;
+          margin-right: 10px;
+          cursor: pointer;
 
-          .text-box {
-            margin: 0 10px;
-            display: flex;
-            flex-direction: column;
-            justify-content: space-around;
-            font-size: 0.7vw;
-            color: #000000;
+          &:hover {
+            background: #dee4e9;
           }
         }
 
-        .card-cell-date {
-          height: 80px;
+        .card-cell-content-div {
+          height: 100%;
+          width: 100%;
           display: flex;
           flex-direction: column;
-          justify-content: space-around;
-          align-items: flex-end;
-          color: #000000;
-          font-size: 0.7vw;
-          margin: 0 10px;
+          align-items: center;
+          justify-content: space-evenly;
+        }
+
+        .card-cell-content-div i {
+          font-size: 2vw;
+        }
+
+        .card-cell-content-div span {
+          letter-spacing: 2px;
+          font-weight: 600;
         }
       }
 
+      .middle-cell {
+        flex: 0 0 100%;
+      }
     }
   }
 
-  .box-container-middle {
-    margin: 10px 0;
-    height: 63%;
-    width: 100%;
-    display: flex;
-    min-height: 280px;
-    justify-content: space-between;
+  .el-card + .el-card {
+    margin-top: 0;
+  }
 
-    .middle-cell:nth-child(1) {
-      flex: 0 0 70%;
-    }
+  ::v-deep .el-card__header {
+    padding: 10px !important;
 
-    .middle-cell:nth-child(2) {
-      flex: 0 0 29.2%;
+    span {
+      font-weight: bold;
     }
   }
 
-  .box-container-bottom {
-    height: 10%;
+  ::v-deep .el-card__body {
+    height: calc(100% - 40px);
+    padding: 0;
+  }
+
+  .scroll-box {
+    height: 80%;
     width: 100%;
-    display: flex;
-    min-height: 150px;
-    min-width: 400px;
+    padding: 25px 0 0 0;
+    overflow: hidden;
 
-    .card-cell-content {
-      display: flex;
-      align-items: center;
-      justify-content: flex-start;
-      flex-wrap: nowrap;
-      align-content: center;
-      height: 100%;
-      overflow-x: auto;
-      padding: 0 10px;
-
-      .card-cell-content-box {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        height: 80%;
-        width: 100%;
-        border: 1px solid #e3e5e4;
-        justify-content: space-evenly;
-        flex: 0 0 5.5%;
-        padding: 8px 0;
-        border-radius: 5px;
-        margin-right: 10px;
-        cursor: pointer;
-
-        &:hover {
-          background: #dee4e9;
-        }
+    .scroll-box-content {
+      height: 80%;
+      width: 100%;
+      position: relative;
+      left: 10px;
+
+      .scroll-box-content-dot {
+        width: 10px;
+        height: 10px;
+        background: #ffffff;
+        border-radius: 15px;
+        border: 2px solid #2d80ee;
       }
 
-      .card-cell-content-div {
-        height: 100%;
+      .scroll-box-content-item {
+        margin-top: 5px;
         width: 100%;
         display: flex;
         flex-direction: column;
-        align-items: center;
-        justify-content: space-evenly;
-      }
+        align-items: flex-start;
+        justify-content: flex-start;
 
-      .card-cell-content-div i {
-        font-size: 2vw;
-      }
+        .item-date {
+          width: 30%;
+          color: #979c9e;
+          font-size: 0.7vw;
+          line-height: 16px;
+          display: inline-block;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
 
-      .card-cell-content-div span {
-        letter-spacing: 2px;
-        font-weight: 600;
-      }
-    }
+        .item-text {
+          width: 80%;
+          color: #555555;
+          font-size: 0.7vw;
 
-    .middle-cell {
-      flex: 0 0 100%;
+          line-height: 16px;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          margin: 5px 0 0 0px;
+        }
+      }
     }
   }
-}
 
-.el-card + .el-card {
-  margin-top: 0;
-}
-
-::v-deep .el-card__header {
-  padding: 10px !important;
-
-  span {
-    font-weight: bold;
+  .el-timeline-item {
+    list-style-type: none;
+    line-height: 19px;
   }
-}
 
-::v-deep .el-card__body {
-  height: calc(100% - 40px);
-  padding: 0;
-}
+  .el-timeline-item__wrapper {
+    padding-left: 17px;
+  }
 
-.scroll-box {
-  height: 80%;
-  width: 100%;
-  padding: 25px 0 0 0;
-  overflow: hidden;
+  .el-empty {
+    padding: 0;
+  }
 
-  .scroll-box-content {
-    height: 80%;
-    width: 100%;
+  .div-del {
+    background: #cccccc !important;
     position: relative;
-    left: 10px;
-
-    .scroll-box-content-dot {
-      width: 10px;
-      height: 10px;
-      background: #FFFFFF;
-      border-radius: 15px;
-      border: 2px solid #2D80EE;
-    }
-
-    .scroll-box-content-item {
-      margin-top: 5px;
-      width: 100%;
-      display: flex;
-      flex-direction: column;
-      align-items: flex-start;
-      justify-content: flex-start;
-
-      .item-date {
-        width: 30%;
-        color: #979C9E;
-        font-size: 0.7vw;
-        line-height: 16px;
-        display: inline-block;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-
-      .item-text {
-        width: 80%;
-        color: #555555;
-        font-size: 0.7vw;
-
-        line-height: 16px;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        margin: 5px 0 0 0px;
-      }
-    }
   }
-}
-
-.el-timeline-item {
-  list-style-type: none;
-  line-height: 19px;
-
-}
-
-.el-timeline-item__wrapper {
-  padding-left: 17px;
-}
-
-.el-empty {
-  padding: 0;
-}
-
-
-.div-del {
-  background: #cccccc !important;
-  position: relative;
-}
-
-.div-del::after {
-  content: "—";
-  position: absolute;
-  padding: 5px; /* 按钮的内边距 */
-  background-color: rgba(255, 0, 0, 0.91);
-  color: white;
-  border-radius: 50%;
-
-}
 
+  .div-del::after {
+    content: '—';
+    position: absolute;
+    padding: 5px; /* 按钮的内边距 */
+    background-color: rgba(255, 0, 0, 0.91);
+    color: white;
+    border-radius: 50%;
+  }
 </style>