From 78929be215190bede08c7390a2d9a8cdfcee9aa5 Mon Sep 17 00:00:00 2001
From: xy <271556543@qq.com>
Date: Mon, 17 Apr 2023 17:31:55 +0800
Subject: [PATCH] 2023-4-17

---
 src/api/dashboard/notice.js                   |  10 +-
 src/layout/components/worker/index.vue        |  46 +--
 src/store/modules/app.js                      |  97 ++++--
 src/views/achievements/evaluate.vue           | 212 +++++++------
 src/views/budget/budgetList.vue               |  21 +-
 src/views/budget/components/addEvaluate.vue   |  28 +-
 src/views/system/worker.vue                   |  56 ++--
 src/views/system/workerComponents/card1.vue   |  38 ---
 src/views/system/workerComponents/card2.vue   |  37 ---
 src/views/system/workerComponents/card3.vue   |  33 ---
 .../system/workerComponents/department.vue    | 154 ++++++++++
 .../{card4.vue => lineChart.vue}              |   5 +-
 src/views/system/workerComponents/toDo.vue    | 177 +++++++++++
 src/views/system/workerComponents/total.vue   | 103 +++++++
 src/views/system/workerComponents/type.vue    | 279 ++++++++++++++++++
 15 files changed, 988 insertions(+), 308 deletions(-)
 delete mode 100644 src/views/system/workerComponents/card1.vue
 delete mode 100644 src/views/system/workerComponents/card2.vue
 delete mode 100644 src/views/system/workerComponents/card3.vue
 create mode 100644 src/views/system/workerComponents/department.vue
 rename src/views/system/workerComponents/{card4.vue => lineChart.vue} (98%)
 create mode 100644 src/views/system/workerComponents/toDo.vue
 create mode 100644 src/views/system/workerComponents/total.vue
 create mode 100644 src/views/system/workerComponents/type.vue

diff --git a/src/api/dashboard/notice.js b/src/api/dashboard/notice.js
index 6be0d2c..9983bd0 100644
--- a/src/api/dashboard/notice.js
+++ b/src/api/dashboard/notice.js
@@ -1,10 +1,11 @@
 import request from "@/utils/request";
 
-export function getNotice(params){
+export function getNotice(params,noLoading = false){
   return request({
     method:'get',
     url:'/api/admin/notice/index',
-    params
+    params,
+    noLoading
   })
 }
 
@@ -16,10 +17,11 @@ export function readNotice(params){
   })
 }
 
-export function statistic(params){
+export function statistic(params,noLoading = false){
   return request({
     method:'get',
     url:'/api/admin/notice/statistic',
-    params
+    params,
+    noLoading
   })
 }
diff --git a/src/layout/components/worker/index.vue b/src/layout/components/worker/index.vue
index 3cec04d..7440000 100644
--- a/src/layout/components/worker/index.vue
+++ b/src/layout/components/worker/index.vue
@@ -27,6 +27,7 @@
         <component
           style="position: absolute; inset: 0 0 0 0"
           :is="item.component"
+          @send-data="sendData"
         ></component>
       </grid-item>
     </grid-layout>
@@ -44,20 +45,6 @@ const files = require.context(
 let cpns = files.keys().map((key) => {
   return files(key).default || files(key);
 });
-const componentsRegister = () => {
-  let obj = {};
-  cpns.forEach((cpn) => {
-    Object.defineProperty(obj, cpn.name, {
-      value: cpn,
-      enumerable: true,
-      writable: true,
-      configurable: true,
-    });
-  });
-  obj["GridLayout"] = VueGridLayout.GridLayout;
-  obj["GridItem"] = VueGridLayout.GridItem;
-  return obj;
-};
 let layout = cpns.map((item) => {
   return {
     ...item.layout,
@@ -65,20 +52,37 @@ let layout = cpns.map((item) => {
   };
 });
 export default {
-  components: componentsRegister(),
+  components: {
+    "GridLayout": VueGridLayout.GridLayout,
+    "GridItem": VueGridLayout.GridItem
+  },
+  provide() {
+    return {
+      getStatistic: () => this.data
+    }
+  },
   data() {
     return {
-      layoutList:[]
+      layoutList:[],
+      data: {
+        statistic: {}
+      }
+    }
+  },
+  methods: {
+    sendData(data) {
+      this.data.statistic = data
     }
   },
-  methods: {},
   computed: {},
   created() {
-    this.layoutList = this.$store.state.app.workerLayout.map(item => {
-      layout.forEach(lay => {
-        lay.i === item.i ? item.component = lay.component : ''
+    this.$store.dispatch('app/getLayout').then(res => {
+      this.layoutList = res.map(item => {
+        layout.forEach(lay => {
+          lay.i === item.i ? item.component = lay.component : ''
+        })
+        return item
       })
-      return item
     })
   },
 }
diff --git a/src/store/modules/app.js b/src/store/modules/app.js
index 575e593..fdc70de 100644
--- a/src/store/modules/app.js
+++ b/src/store/modules/app.js
@@ -1,52 +1,93 @@
-import Cookies from 'js-cookie'
-
+import Cookies from "js-cookie";
+import { Message } from "element-ui";
+import { show, save } from "@/api/system/expand";
+import store from "@/store";
 const state = {
   sidebar: {
-    opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true,
-    withoutAnimation: false
+    opened: Cookies.get("sidebarStatus")
+      ? !!+Cookies.get("sidebarStatus")
+      : true,
+    withoutAnimation: false,
   },
-  device: 'desktop',
-  workerLayout:[],
-}
-
+  device: "desktop",
+  workerLayout: {},
+};
+const getter = {
+  layout: (state) => {
+    return state["app/workerLayout"]?.config || [];
+  },
+};
 const mutations = {
-  TOGGLE_SIDEBAR: state => {
-    state.sidebar.opened = !state.sidebar.opened
-    state.sidebar.withoutAnimation = false
+  TOGGLE_SIDEBAR: (state) => {
+    state.sidebar.opened = !state.sidebar.opened;
+    state.sidebar.withoutAnimation = false;
     if (state.sidebar.opened) {
-      Cookies.set('sidebarStatus', 1)
+      Cookies.set("sidebarStatus", 1);
     } else {
-      Cookies.set('sidebarStatus', 0)
+      Cookies.set("sidebarStatus", 0);
     }
   },
   CLOSE_SIDEBAR: (state, withoutAnimation) => {
-    Cookies.set('sidebarStatus', 0)
-    state.sidebar.opened = false
-    state.sidebar.withoutAnimation = withoutAnimation
+    Cookies.set("sidebarStatus", 0);
+    state.sidebar.opened = false;
+    state.sidebar.withoutAnimation = withoutAnimation;
   },
   TOGGLE_DEVICE: (state, device) => {
-    state.device = device
+    state.device = device;
+  },
+  SET_LAYOUT: (state, layout) => {
+    state.workerLayout = layout;
   },
-  SET_LAYOUT:(state,layout) => {
-    state.workerLayout = layout
-  }
-}
+};
 
 const actions = {
   toggleSideBar({ commit }) {
-    commit('TOGGLE_SIDEBAR')
+    commit("TOGGLE_SIDEBAR");
   },
   closeSideBar({ commit }, { withoutAnimation }) {
-    commit('CLOSE_SIDEBAR', withoutAnimation)
+    commit("CLOSE_SIDEBAR", withoutAnimation);
   },
   toggleDevice({ commit }, device) {
-    commit('TOGGLE_DEVICE', device)
-  }
-}
+    commit("TOGGLE_DEVICE", device);
+  },
+  getLayout({ commit, state }) {
+    return state.workerLayout.config
+      ? JSON.parse(state.workerLayout.config)
+      : new Promise((resolve, reject) => {
+        show({
+          admin_id: store.state.user.userId,
+        }).then((res) => {
+          commit("SET_LAYOUT", res);
+          resolve(JSON.parse(res?.config) || [])
+        });
+      });
+  },
+  setLayout({ commit }) {
+    show({
+      admin_id: store.state.user.userId,
+    }).then((res) => {
+      commit("SET_LAYOUT", res);
+    });
+  },
+  saveLayout({ commit, dispatch, state }, layout) {
+    save({
+      id: state.workerLayout.id,
+      name: "1",
+      config: JSON.stringify(layout),
+    }).then((res) => {
+      dispatch("setLayout");
+      Message({
+        type: "success",
+        message: "保存成功",
+      });
+    });
+  },
+};
 
 export default {
   namespaced: true,
   state,
+  getter,
   mutations,
-  actions
-}
+  actions,
+};
diff --git a/src/views/achievements/evaluate.vue b/src/views/achievements/evaluate.vue
index cf55ab7..99ad22d 100644
--- a/src/views/achievements/evaluate.vue
+++ b/src/views/achievements/evaluate.vue
@@ -1,47 +1,72 @@
 <template>
-  <div style="padding: 0 20px;">
-    <lx-header icon="md-apps" style="margin-bottom: 10px; border: 0px; margin-top: 15px" text="绩效自评自审">
+  <div style="padding: 0 20px">
+    <lx-header
+      icon="md-apps"
+      style="margin-bottom: 10px; border: 0px; margin-top: 15px"
+      text="绩效自评自审"
+    >
       <div slot="content"></div>
       <slot>
         <div class="selects">
-
           <div>
-            <span style="padding: 0 6px;word-break: keep-all;">
-              关键字
-            </span>
-            <Input v-model="select.keyword" placeholder="请输入关键字" style="width: 180px"></Input>
+            <span style="padding: 0 6px; word-break: keep-all"> 关键字 </span>
+            <Input
+              v-model="select.keyword"
+              placeholder="请输入关键字"
+              style="width: 180px"
+            ></Input>
           </div>
 
-          <Button style="margin-left: 10px" type="primary"
-                  @click="">重置
+          <Button style="margin-left: 10px" type="primary" @click=""
+            >重置
           </Button>
-          <Button style="margin-left: 10px" type="primary" @click="select.page = 1,getList()">查询</Button>
+          <Button
+            style="margin-left: 10px"
+            type="primary"
+            @click="(select.page = 1), getList()"
+            >查询</Button
+          >
         </div>
       </slot>
     </lx-header>
 
     <xy-table :list="list" :table-item="table" @delete="destroy" @editor="edit">
       <template v-slot:btns>
-        <el-table-column label="操作" header-align="center" fixed="right" width="120">
+        <el-table-column
+          label="操作"
+          header-align="center"
+          fixed="right"
+          width="170"
+        >
           <template v-slot:default="scope">
-            <el-dropdown
-              @command="
-                  (command) => {
-                    $refs['addPlanEvaluate'].type = command;
-                    $refs['addPlanEvaluate'].setPlanId(scope.row.id);
-                    $refs['addPlanEvaluate'].show();
-                  }
-                "
+            <Button
+              size="small"
+              type="primary"
+              class="slot-btns-item"
+              @click="
+                () => {
+                  $refs['addPlanEvaluate'].type = 1;
+                  $refs['addPlanEvaluate'].setPlanId(scope.row.id);
+                  $refs['addPlanEvaluate'].show();
+                }
+              "
             >
-              <Button size="small" type="primary" class="slot-btns-item">
-                绩效审核<i class="el-icon-arrow-down el-icon--right"></i>
-              </Button>
-
-              <el-dropdown-menu slot="dropdown">
-                <el-dropdown-item :command="1">年中目标</el-dropdown-item>
-                <el-dropdown-item :command="2">年末目标</el-dropdown-item>
-              </el-dropdown-menu>
-            </el-dropdown>
+              年中目标
+            </Button>
+            <Button
+              size="small"
+              type="primary"
+              class="slot-btns-item"
+              @click="
+                () => {
+                  $refs['addPlanEvaluate'].type = 2;
+                  $refs['addPlanEvaluate'].setPlanId(scope.row.id);
+                  $refs['addPlanEvaluate'].show();
+                }
+              "
+            >
+              年末目标
+            </Button>
           </template>
         </el-table-column>
       </template>
@@ -56,138 +81,141 @@
 </template>
 
 <script>
-import { getBudget } from "@/api/budget/budget"
-import { index,destroy } from "@/api/achievements/evaluate"
-import { moneyFormatter, parseTime } from '@/utils'
-import { getparameter } from '@/api/system/dictionary'
+import { getBudget } from "@/api/budget/budget";
+import { index, destroy } from "@/api/achievements/evaluate";
+import { moneyFormatter, parseTime } from "@/utils";
+import { getparameter } from "@/api/system/dictionary";
 
-import addEvaluate from '@/views/achievements/components/addEvaluate.vue'
-import addPlanEvaluate from '@/views/achievements/components/addPlanEvaluate.vue'
+import addEvaluate from "@/views/achievements/components/addEvaluate.vue";
+import addPlanEvaluate from "@/views/achievements/components/addPlanEvaluate.vue";
 export default {
-  components:{
+  components: {
     addEvaluate,
-    addPlanEvaluate
+    addPlanEvaluate,
   },
   data() {
     return {
       budgetTypes: [],
-      select:{
+      select: {
         keyword: "",
         page: 1,
-        page_size: 10
+        page_size: 10,
       },
       total: 0,
-      table: [{
-        label: "项目名称",
-        prop: 'name',
-        width: 200,
-        sortable: false,
-        fixed: 'left'
-      },
+      table: [
+        {
+          label: "项目名称",
+          prop: "name",
+          width: 200,
+          sortable: false,
+          fixed: "left",
+        },
         {
           label: "预算类型",
-          prop: 'type',
+          prop: "type",
           width: 115,
           formatter: (cell, data, value) => {
-            let res = this.types.filter(item => {
-              return item.id === value
-            })
-            return res[0]?.value || '未知'
-          }
+            let res = this.types.filter((item) => {
+              return item.id === value;
+            });
+            return res[0]?.value || "未知";
+          },
         },
         {
           label: "所属年份",
-          prop: 'year',
-          width: 105
+          prop: "year",
+          width: 105,
         },
         {
           label: "相关科室",
-          prop: 'plan_department.name',
-          width: 110
+          prop: "plan_department.name",
+          width: 110,
         },
         {
-          label: '年初预算金额（元）',
-          prop: 'money',
-          align: 'right',
+          label: "年初预算金额（元）",
+          prop: "money",
+          align: "right",
           width: 180,
           formatter: (cell, data, value) => {
-            if (value == 0) return '--'
-            else
-              return moneyFormatter(value)
-          }
+            if (value == 0) return "--";
+            else return moneyFormatter(value);
+          },
         },
         {
-          label: '调整后预算金额（元）',
-          prop: 'update_money',
-          align: 'right',
+          label: "调整后预算金额（元）",
+          prop: "update_money",
+          align: "right",
           width: 200,
           formatter: (cell, data, value) => {
-            return moneyFormatter(value)
-          }
+            return moneyFormatter(value);
+          },
         },
         {
           label: "创建信息",
-          prop: 'created_at',
+          prop: "created_at",
           width: 160,
           formatter: (cell, data, value) => {
-            return this.$moment(value).format('YYYY-MM-DD')
-          }
+            return this.$moment(value).format("YYYY-MM-DD");
+          },
         },
         {
           label: "描述",
           minWidth: 300,
-          prop: 'content',
-          align: 'left',
-          sortable: false
+          prop: "content",
+          align: "left",
+          sortable: false,
         },
       ],
       list: [],
-    }
+    };
   },
   methods: {
     async getBudgetTypes() {
       const res = await getparameter({
-        number: 'money_way'
-      })
-      this.types = res.detail
+        number: "money_way",
+      });
+      this.types = res.detail;
     },
 
     async getList() {
-      const res = await getBudget(this.select)
-      this.list = res.list.data
+      const res = await getBudget(this.select);
+      this.list = res.list.data;
     },
 
-    edit(row,type) {
+    edit(row, type) {
       this.$refs["addEvaluate"].id = row.id;
-      this.$refs["addEvaluate"].setForm("type",type);
+      this.$refs["addEvaluate"].setForm("type", type);
       this.$refs["addEvaluate"].type = "add";
       this.$refs["addEvaluate"].show();
     },
     destroy(row) {
       destroy({
-        id: row.id
-      }).then(res => {
+        id: row.id,
+      }).then((res) => {
         this.$message({
           type: "success",
-          message: "删除成功"
-        })
+          message: "删除成功",
+        });
         this.getList();
-      })
-    }
-  },
-  computed: {
+      });
+    },
   },
+  computed: {},
   created() {
     this.getBudgetTypes();
     this.getList();
-  }
-}
+  },
+};
 </script>
 
 <style scoped lang="scss">
-.selects{
+.selects {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
 }
+
+Button + Button {
+  margin-left: 4px;
+}
 </style>
diff --git a/src/views/budget/budgetList.vue b/src/views/budget/budgetList.vue
index 6692c0e..1b00328 100644
--- a/src/views/budget/budgetList.vue
+++ b/src/views/budget/budgetList.vue
@@ -164,24 +164,19 @@
                 "
                 >绩效指标</Button
               >
-              <el-dropdown
-                @command="
-                  (command) => {
-                    $refs['addEvaluate'].type = command;
+              <Button
+                size="small"
+                type="primary"
+                class="slot-btns-item"
+                @click="
+                  () => {
                     $refs['addEvaluate'].setId(scope.row.id);
                     $refs['addEvaluate'].show();
                   }
                 "
               >
-                <Button size="small" type="primary" class="slot-btns-item">
-                  绩效目标<i class="el-icon-arrow-down el-icon--right"></i>
-                </Button>
-
-                <el-dropdown-menu slot="dropdown">
-                  <el-dropdown-item :command="1">年中目标</el-dropdown-item>
-                  <el-dropdown-item :command="2">年末目标</el-dropdown-item>
-                </el-dropdown-menu>
-              </el-dropdown>
+                绩效目标
+              </Button>
             </div>
           </template>
         </el-table-column>
diff --git a/src/views/budget/components/addEvaluate.vue b/src/views/budget/components/addEvaluate.vue
index 968abb1..b7718bc 100644
--- a/src/views/budget/components/addEvaluate.vue
+++ b/src/views/budget/components/addEvaluate.vue
@@ -1,12 +1,18 @@
 <template>
   <div>
-    <el-dialog :title="type === 1 ? '年中绩效目标' : '年末绩效目标'" :visible.sync="isShow" width="54%">
-      <el-input :value="type === 1 ? form.year_midst : form.year_end"
+    <el-dialog :title="form.name" :visible.sync="isShow" width="54%">
+      <div class="title">年中绩效目标</div>
+      <el-input v-model="form.year_midst"
                 type="textarea"
                 :autosize="{ minRows:6 }"
-                :placeholder="type === 1 ? '请填写年中绩效目标' : '请填写年末绩效目标'"
-                @input="input"></el-input>
-
+                placeholder="请填写年中绩效目标"
+                ></el-input>
+      <div class="title" style="margin-top: 20px;">年末绩效目标</div>
+      <el-input v-model="form.year_end"
+                type="textarea"
+                :autosize="{ minRows:6 }"
+                placeholder="请填写年末绩效目标"
+                ></el-input>
       <span slot="footer" class="dialog-footer">
         <el-button @click="hidden">取 消</el-button>
         <el-button type="primary" @click="submit">确 定</el-button>
@@ -22,7 +28,6 @@ export default {
     return {
       id: "",
       isShow: false,
-      type: 1,//1年中 2年末
       form: {
       }
     }
@@ -38,10 +43,6 @@ export default {
       this.id = id;
     },
 
-    input(e) {
-      this.type === 1 ? this.form.year_midst = e : this.form.year_end = e
-    },
-
     submit() {
       editorBudget(this.form).then(res => {
         this.$message({
@@ -66,4 +67,11 @@ export default {
 </script>
 
 <style scoped lang="scss">
+.title {
+  font-size: 16px;
+  font-weight: 600;
+  letter-spacing: 4px;
+
+  padding: 10px 6px;
+}
 </style>
diff --git a/src/views/system/worker.vue b/src/views/system/worker.vue
index b1ab30c..aeaec44 100644
--- a/src/views/system/worker.vue
+++ b/src/views/system/worker.vue
@@ -15,7 +15,7 @@
             @dragend="dragEnd(item, $event)"
           >
             <i class="el-icon-folder-remove"></i>
-            <span>{{ item.component.name }}</span>
+            <span>{{ item.name }}</span>
             <Button
               v-show="statusFormat(item.i)"
               type="error"
@@ -29,10 +29,11 @@
       </el-col>
 
       <el-col :span="20">
-        <Card >
+        <Card :class="{'drag-body':isDrag}">
           <template v-slot:title>
             <div style="display: flex;justify-content: space-between;align-items: center;">
               <p>布局</p>
+              <Button type="primary" style="float: right;margin-right: 10px;" @click="sync">同步</Button>
               <Button type="primary" style="float: right;" @click="save">保存</Button>
             </div>
           </template>
@@ -62,7 +63,7 @@
               style="touch-action: none"
             >
               <component
-                style="position: absolute; inset: 0 0 0 0"
+                style="position: absolute; inset: 0 0 0 0;"
                 :is="item.component"
               ></component>
             </grid-item>
@@ -74,6 +75,8 @@
 </template>
 
 <script>
+import { save } from "@/api/system/expand"
+
 import VueGridLayout from "vue-grid-layout";
 import path from "path";
 const files = require.context(
@@ -84,20 +87,6 @@ const files = require.context(
 let cpns = files.keys().map((key) => {
   return files(key).default || files(key);
 });
-const componentsRegister = () => {
-  let obj = {};
-  cpns.forEach((cpn) => {
-    Object.defineProperty(obj, cpn.name, {
-      value: cpn,
-      enumerable: true,
-      writable: true,
-      configurable: true,
-    });
-  });
-  obj["GridLayout"] = VueGridLayout.GridLayout;
-  obj["GridItem"] = VueGridLayout.GridItem;
-  return obj;
-};
 let layout = cpns.map((item) => {
   return {
     ...item.layout,
@@ -105,7 +94,10 @@ let layout = cpns.map((item) => {
   };
 });
 export default {
-  components: componentsRegister(),
+  components: {
+    "GridLayout": VueGridLayout.GridLayout,
+    "GridItem": VueGridLayout.GridItem
+  },
   data() {
     return {
       layout,
@@ -136,6 +128,10 @@ export default {
       this.layoutList.splice(temp, 1);
     },
 
+    async sync() {
+      await this.$store.dispatch("app/setLayout")
+
+    },
     save(){
       let layout = this.layoutList.map(item => {
         return {
@@ -146,13 +142,7 @@ export default {
           i:item.i
         }
       })
-      this.$store.commit('app/SET_LAYOUT',layout)
-      console.log(layout)
-      this.$message({
-        type:'success',
-        message:'保存成功',
-        offset:60
-      })
+      this.$store.dispatch('app/saveLayout',layout)
     }
   },
   computed: {
@@ -167,11 +157,13 @@ export default {
     this.grid = document.getElementById("grid-card").getBoundingClientRect();
   },
   created() {
-    this.layoutList = this.$store.state.app.workerLayout.map(item => {
-      layout.forEach(lay => {
-        lay.i === item.i ? item.component = lay.component : ''
+    this.$store.dispatch('app/getLayout').then(res => {
+      this.layoutList = res.map(item => {
+        layout.forEach(lay => {
+          lay.i === item.i ? item.component = lay.component : ''
+        })
+        return item
       })
-      return item
     })
   }
 };
@@ -206,7 +198,11 @@ export default {
     background-color: rgba(218, 94, 98, 0.3);
   }
 }
-
+.drag-body{
+  transition: all .4s;
+  background: rgba(32, 160, 255, 0.3);
+  opacity: .7;
+}
 
 
 .fade-in {
diff --git a/src/views/system/workerComponents/card1.vue b/src/views/system/workerComponents/card1.vue
deleted file mode 100644
index d7c8566..0000000
--- a/src/views/system/workerComponents/card1.vue
+++ /dev/null
@@ -1,38 +0,0 @@
-<template>
-  <el-card class="box-card" shadow="hover">
-    <div slot="header">
-      <span style="border-left: 3px solid #338DE3FF;padding-left: 6px;">进度</span>
-      <i class="el-icon-more" style="float: right;font-size: 20px;"></i>
-    </div>
-
-    <div style="display: flex;flex-wrap: wrap;align-items: center;justify-content: space-evenly;align-content: center;">
-      <el-progress type="circle" :percentage="25"></el-progress>
-      <el-progress type="circle" :percentage="100" status="success"></el-progress>
-      <el-progress type="circle" :percentage="70" status="warning"></el-progress>
-      <el-progress type="circle" :percentage="50" status="exception"></el-progress>
-    </div>
-  </el-card>
-</template>
-
-<script>
-export default {
-  name:"card1",
-  layout:{
-    x:0,
-    y:0,
-    w:4,
-    h:5,
-    i:"card1"
-  },
-  data() {
-    return {
-
-    }
-  },
-  methods: {},
-  computed: {},
-}
-</script>
-
-<style scoped lang="scss">
-</style>
diff --git a/src/views/system/workerComponents/card2.vue b/src/views/system/workerComponents/card2.vue
deleted file mode 100644
index 2c9f51f..0000000
--- a/src/views/system/workerComponents/card2.vue
+++ /dev/null
@@ -1,37 +0,0 @@
-<template>
-  <el-card class="box-card" shadow="hover">
-    <div slot="header">
-      <span style="border-left: 3px solid #338DE3FF;padding-left: 6px;">卡片名称</span>
-      <i class="el-icon-more" style="float: right;font-size: 20px;"></i>
-    </div>
-    <div>
-      <el-progress :percentage="50"></el-progress>
-      <el-progress :percentage="100" status="success"></el-progress>
-      <el-progress :percentage="100" status="warning"></el-progress>
-      <el-progress :percentage="50" status="exception"></el-progress>
-    </div>
-  </el-card>
-</template>
-
-<script>
-export default {
-  name:'card2',
-  layout:{
-    x:4,
-    y:0,
-    w:6,
-    h:4,
-    i:"card2"
-  },
-  data() {
-    return {
-
-    }
-  },
-  methods: {},
-  computed: {},
-}
-</script>
-
-<style scoped lang="scss">
-</style>
diff --git a/src/views/system/workerComponents/card3.vue b/src/views/system/workerComponents/card3.vue
deleted file mode 100644
index 0f7c3d6..0000000
--- a/src/views/system/workerComponents/card3.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<template>
-  <el-card class="box-card" shadow="hover">
-    <div slot="header">
-      <span style="border-left: 3px solid #338DE3FF;padding-left: 6px;">待办事项（4）</span>
-      <i class="el-icon-more" style="float: right;font-size: 20px;"></i>
-    </div>
-
-    <div v-for="o in 4" :key="o">
-      {{'待办事项 ' + o }}
-    </div>
-  </el-card>
-</template>
-
-<script>
-export default {
-  name:'card3',
-  layout:{
-    x:0,
-    y:5,
-    w:6,
-    h:4,
-    i:"card3"
-  },
-  data() {
-    return {}
-  },
-  methods: {},
-  computed: {},
-}
-</script>
-
-<style scoped lang="scss">
-</style>
diff --git a/src/views/system/workerComponents/department.vue b/src/views/system/workerComponents/department.vue
new file mode 100644
index 0000000..d8f5ceb
--- /dev/null
+++ b/src/views/system/workerComponents/department.vue
@@ -0,0 +1,154 @@
+<template>
+  <el-card class="box-card" shadow="hover" id="department-card">
+    <div slot="header">
+      <span style="border-left: 3px solid #338de3ff; padding-left: 6px"
+        >科室进展情况</span
+      >
+      <i class="el-icon-more" style="float: right; font-size: 20px"></i>
+    </div>
+
+    <div>
+      <Table :height="tableHeight" size="small" :data="departmentList" :columns="table"></Table>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import { moneyFormatter } from "@/utils";
+import ElementResize from 'element-resize-detector'
+
+export default {
+  name: "card3",
+  layout: {
+    x: 0,
+    y: 5,
+    w: 6,
+    h: 4,
+    i: "3",
+    name: "科室进展情况",
+  },
+  inject: {
+    getStatistic: {
+      default: () => {
+        return () => {
+          return {
+            statistic: {
+              departmentList: [
+                {
+                  money_total_1: "1900000.00",
+                  money_total_2: "0.00",
+                  ids: "11",
+                  plan_department_id: 2,
+                  use_money_total: 0,
+                  money_total: "0.00",
+                  end_money: 0,
+                  plan_department: {
+                    id: 2,
+                    pid: 0,
+                    name: "办公室（党建作风办）",
+                    manager_id: 7,
+                    leader_id: 4,
+                    sortnumber: 1,
+                    created_at: "2021-06-22 07:01:41",
+                    updated_at: "2023-03-22 14:56:51",
+                    deleted_at: null,
+                  },
+                },
+              ],
+            },
+          };
+        }
+      },
+    },
+  },
+  data() {
+    return {
+      tableHeight: 200,
+      table: [
+        {
+          title: "科室",
+          width: 100,
+          key: "plan_department.name",
+          fixed: "left",
+          render:(h,{row}) => {
+            return h('span',{},row.plan_department?.name)
+          }
+        },
+        {
+          title: "进展情况",
+          minWidth: 160,
+          fixed: "right",
+          render: (h, { row }) => {
+            let m2 = row?.money_total_2 || 0;
+            let m1 = row?.money_total_1 || 0;
+            let m3 = row?.use_money_total || 0;
+            let per = 0;
+
+            if (m2 != 0) {
+              per = ((m3 / m2) * 100).toFixed(2);
+            } else if (m1 != 0) {
+              per = ((m3 / m1) * 100).toFixed(2);
+            }
+            return h("el-progress", {
+              props: {
+                percentage: Number(per),
+              },
+            });
+          },
+        },
+        {
+          title: "年初预算合计金额(元)",
+          width: 170,
+          align: "right",
+          key: "money_total_1",
+          render: (h, { row }) => {
+            return h("span", {}, moneyFormatter(row.money_total_1));
+          },
+        },
+        {
+          title: "调整后预算合计金额(元)",
+          width: 170,
+          align: "right",
+          key: "money_total_2",
+          render: (h, { row }) => {
+            return h("span", {}, moneyFormatter(row.money_total_2));
+          },
+        },
+        {
+          title: "已使用(元)",
+          width: 120,
+          align: "right",
+          key: "use_money_total",
+          render: (h, { row }) => {
+            return h("span", {}, moneyFormatter(row.use_money_total));
+          },
+        },
+      ],
+    };
+  },
+  methods: {
+    init() {
+      let cardDom = document.getElementById('department-card');
+      let cardTitleH = 58;
+      const elementResize = ElementResize({
+        strategy:'scroll'
+      })
+      elementResize.listenTo(cardDom,ele => {
+        this.tableHeight = cardDom.getBoundingClientRect().height - 40 - cardTitleH
+      })
+    }
+  },
+  computed: {
+    departmentList() {
+      if (this.getStatistic)
+        return this.getStatistic()?.statistic?.departmentList || [];
+    },
+  },
+  created() {},
+  mounted() {
+    this.init();
+  }
+};
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/system/workerComponents/card4.vue b/src/views/system/workerComponents/lineChart.vue
similarity index 98%
rename from src/views/system/workerComponents/card4.vue
rename to src/views/system/workerComponents/lineChart.vue
index fe71321..16a1b4a 100644
--- a/src/views/system/workerComponents/card4.vue
+++ b/src/views/system/workerComponents/lineChart.vue
@@ -1,7 +1,7 @@
 <template>
   <el-card id="line-chart-card" class="box-card" shadow="hover">
     <div slot="header">
-      <span style="border-left: 3px solid #338DE3FF;padding-left: 6px;">图表1</span>
+      <span style="border-left: 3px solid #338DE3FF;padding-left: 6px;">lineChart</span>
       <i class="el-icon-more" style="float: right;font-size: 20px;"></i>
     </div>
 
@@ -23,7 +23,8 @@ export default {
     y:5,
     w:6,
     h:4,
-    i:"card4"
+    i:"4",
+    name: "lineChart"
   },
   data() {
     return {
diff --git a/src/views/system/workerComponents/toDo.vue b/src/views/system/workerComponents/toDo.vue
new file mode 100644
index 0000000..53a9d9f
--- /dev/null
+++ b/src/views/system/workerComponents/toDo.vue
@@ -0,0 +1,177 @@
+<template>
+  <el-card class="box-card" shadow="hover" id="todo-card">
+    <div slot="header">
+      <span style="border-left: 3px solid #338de3ff; padding-left: 6px"
+        >待办事项</span
+      >
+      <i class="el-icon-more" style="float: right; font-size: 20px"></i>
+    </div>
+
+    <div>
+      <Table :height="tableHeight" :loading="loading" size="small" :data="/^\/system/.test(this.$route.path) ? example : list" :columns="table"></Table>
+
+      <div ref="todo-page" style="display: flex; justify-content: center; margin: 10px 0">
+        <Page :total="/^\/system/.test(this.$route.path) ? example.length : total"
+              size="small"
+              show-elevator
+              show-total
+              @on-change="e => {
+                select.page = e;
+                getNotices();
+              }"/>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import { getNotice, readNotice } from '@/api/dashboard/notice'
+import ElementResize from 'element-resize-detector'
+
+export default {
+  name: "card2",
+  layout: {
+    x: 4,
+    y: 0,
+    w: 6,
+    h: 4,
+    i: "2",
+    name: "待办事项",
+  },
+  data() {
+    return {
+      example:[
+        {
+          type: 1,
+          content: "示例1",
+          created_at:this.$moment().format("YYYY-MM-DD HH:mm:ss"),
+          read_count: true
+        },
+        {
+          type: 2,
+          content: "示例2",
+          created_at:this.$moment().format("YYYY-MM-DD HH:mm:ss"),
+          read_count: false
+        }
+      ],
+      select:{
+        page: 1,
+        page_size: 10
+      },
+      tableHeight: 120,
+      loading: false,
+      list: [],
+      total: 0,
+      table: [
+        {
+          type: "index",
+          title: "序号",
+          align: "center",
+          width: 64
+        },
+        {
+          title: "类型",
+          align: "center",
+          width: 100,
+          render: (h, { row }) => {
+            return h("span", {}, row.type === 1 ? "合同流程" : "付款计划");
+          },
+        },
+        {
+          title: "内容",
+          key: "content",
+          align: "left",
+          ellipsis: true,
+          tooltip: true,
+          minWidth: 120
+        },
+        {
+          title: "下发时间",
+          key: "created_at",
+          width: 180,
+          align: "center"
+        },
+        {
+          title: "状态",
+          key: "read_count",
+          width: 120,
+          render: (h, { row }) => {
+            return row.read_count
+              ? h(
+                  "el-link",
+                  {
+                    props: {
+                      type: "success",
+                      underline: false,
+                    },
+                  },
+                  "已读"
+                )
+              : h(
+                  "Button",
+                  {
+                    props: {
+                      type: "error",
+                      size: "small",
+                      ghost: true
+                    },
+                    on: {
+                      ['click']:e => {
+                        if(/^\/system/.test(this.$route.path)) return
+
+                        readNotice({
+                          id: row.id
+                        }).then(res => {
+                          this.$message({
+                            type: 'success',
+                            message: '已读'
+                          })
+                          this.getNotices()
+                        })
+                      }
+                    }
+                  },
+                  "未读"
+                );
+          },
+        },
+      ],
+    };
+  },
+  methods: {
+    async getNotices() {
+      if(/^\/system/.test(this.$route.path)) return
+      try{
+        this.loading = true
+        const res = await getNotice(this.select,true);
+        this.list = res.data;
+        this.total = res.total;
+        this.loading = false
+      }catch (e) {
+        this.loading = false
+      }
+    },
+
+    init() {
+      let cardDom = document.getElementById('todo-card');
+      let cardTitleH = 58;
+      let page = this.$refs['todo-page']
+      const elementResize = ElementResize({
+        strategy:'scroll'
+      })
+      elementResize.listenTo(cardDom,ele => {
+        this.tableHeight = cardDom.getBoundingClientRect().height - 40 - cardTitleH - page.getBoundingClientRect().height
+      })
+    }
+  },
+  computed: {},
+  created() {
+    this.getNotices();
+  },
+  mounted() {
+    this.init();
+  }
+};
+</script>
+
+<style scoped lang="scss"></style>
diff --git a/src/views/system/workerComponents/total.vue b/src/views/system/workerComponents/total.vue
new file mode 100644
index 0000000..3030869
--- /dev/null
+++ b/src/views/system/workerComponents/total.vue
@@ -0,0 +1,103 @@
+<template>
+  <el-card class="box-card" shadow="hover">
+    <div slot="header" class="clearfix">
+      <span style="border-left: 3px solid #338DE3FF;padding-left: 6px;">预算总体进展情况</span>
+      <DatePicker transfer :value="select.year" placeholder="选择所属年份" placement="bottom" style="width: 130px;float: right;"
+                  type="year" @on-change="changeYear"></DatePicker>
+    </div>
+    <div class="progress-card">
+      <div class="progress-card-item">
+        <div class="progress-card-item__num">{{moneyFormatter(statistic.progress.money_total_1 || 0)}}</div>
+        <div class="progress-card-item__label">年初预算合计金额</div>
+      </div>
+      <div class="progress-card-item">
+        <div class="progress-card-item__num">{{moneyFormatter(statistic.progress.money_total_2 || 0)}}</div>
+        <div class="progress-card-item__label">调整后预算合计金额</div>
+      </div>
+      <div class="progress-card-item">
+        <div class="progress-card-item__num">{{moneyFormatter(statistic.progress.use_money_total || 0)}}</div>
+        <div class="progress-card-item__label">已支付金额</div>
+      </div>
+      <div class="progress-card-item">
+        <div class="progress-card-item__num">
+          {{toper(statistic.progress.money_total_1 || 0,statistic.progress.money_total_2 || 0,statistic.progress.use_money_total || 0)}}%
+        </div>
+        <div class="progress-card-item__label">进展率</div>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import { moneyFormatter } from "@/utils"
+import { statistic } from '@/api/dashboard/notice'
+export default {
+  name:"card1",
+  layout:{
+    x:0,
+    y:0,
+    w:4,
+    h:5,
+    i:"1",
+    name:"预算统计",
+  },
+  data() {
+    return {
+      select: {
+        year: new Date().getFullYear().toString()
+      },
+      statistic: {
+        progress: {}
+      }
+    }
+  },
+  methods: {
+    moneyFormatter,
+    toper(m1, m2, m3) {
+      if (m2 != 0) {
+        return ((m3 / m2) * 100).toFixed(2);
+      } else if (m1 != 0) {
+        return ((m3 / m1) * 100).toFixed(2);
+      } else
+        return 0
+    },
+    changeYear(e) {
+      this.select.year = e;
+      this.getStatistic()
+    },
+    async getStatistic() {
+      if(/^\/system/.test(this.$route.path)) return
+
+      const res = await statistic(this.select,true)
+      this.statistic = res
+      this.$emit('send-data',res)
+    },
+  },
+  computed: {},
+  created() {
+    this.getStatistic();
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.progress-card {
+  display: flex;
+
+  &-item {
+    text-align: center;
+    flex: 1;
+
+    &__label {
+      font-size: 14px;
+    }
+
+    &__num {
+      font-size: 20px;
+      font-weight: 600;
+
+      padding: 6px 0;
+    }
+  }
+}
+</style>
diff --git a/src/views/system/workerComponents/type.vue b/src/views/system/workerComponents/type.vue
new file mode 100644
index 0000000..f08ac24
--- /dev/null
+++ b/src/views/system/workerComponents/type.vue
@@ -0,0 +1,279 @@
+<template>
+  <el-card class="box-card" shadow="hover" id="type-card">
+    <div slot="header">
+      <span style="border-left: 3px solid #338de3ff; padding-left: 6px"
+        >预算类型进展情况</span
+      >
+      <i class="el-icon-more" style="float: right; font-size: 20px"></i>
+    </div>
+
+    <div id="type-card-body">
+      <Table :height="tableHeight" size="small" :data="departmentList" :columns="table"></Table>
+    </div>
+  </el-card>
+</template>
+
+<script>
+import ElementResize from "element-resize-detector";
+import { moneyFormatter } from "@/utils";
+import echarts from 'echarts'
+
+export default {
+  name: "card3",
+  layout: {
+    x: 0,
+    y: 5,
+    w: 6,
+    h: 4,
+    i: "5",
+    name: "预算类型进展情况",
+  },
+  inject: {
+    getStatistic: {
+      default: () => {
+        return () => {
+          return {
+            statistic: {
+              typeList: [
+                {
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },{
+                  money_total_1: "17549700.00",
+                  money_total_2: "0.00",
+                  ids: "23,39,38,36,35,33,32,30,28,26,25,6,22,20,17,16,14,13,12,11,9,8",
+                  type: 7,
+                  use_money_total: "50000.00",
+                  type_text: "项目经费",
+                  money_total: "0.00",
+                  end_money: 0,
+                },
+              ],
+            },
+          };
+        };
+      },
+    },
+  },
+  data() {
+    return {
+      tableHeight: 200,
+      table: [
+        {
+          title: "预算类别",
+          width: 100,
+          key: "type_text",
+          ellipsis: true,
+          tooltip: true,
+          fixed: "left",
+        },
+        {
+          title: "进展情况",
+          minWidth: 160,
+          fixed: "right",
+          render: (h, { row }) => {
+            let m2 = row?.money_total_2 || 0;
+            let m1 = row?.money_total_1 || 0;
+            let m3 = row?.use_money_total || 0;
+            let per = 0;
+
+            if (m2 != 0) {
+              per = ((m3 / m2) * 100).toFixed(2);
+            } else if (m1 != 0) {
+              per = ((m3 / m1) * 100).toFixed(2);
+            }
+            return h("el-progress", {
+              props: {
+                percentage: Number(per),
+              },
+            });
+          },
+        },
+        {
+          title: "年初预算合计金额(元)",
+          width: 170,
+          align: "right",
+          key: "money_total_1",
+          render: (h, { row }) => {
+            return h("span", {}, moneyFormatter(row.money_total_1));
+          },
+        },
+        {
+          title: "调整后预算合计金额(元)",
+          width: 170,
+          align: "right",
+          key: "money_total_2",
+          render: (h, { row }) => {
+            return h("span", {}, moneyFormatter(row.money_total_2));
+          },
+        },
+        {
+          title: "已使用(元)",
+          width: 120,
+          align: "right",
+          key: "use_money_total",
+          render: (h, { row }) => {
+            return h("span", {}, moneyFormatter(row.use_money_total));
+          },
+        },
+      ],
+    };
+  },
+  methods: {
+    init() {
+      let cardDom = document.getElementById('type-card');
+      let cardTitleH = 58;
+      const elementResize = ElementResize({
+        strategy:'scroll'
+      })
+      elementResize.listenTo(cardDom,ele => {
+        this.tableHeight = cardDom.getBoundingClientRect().height - 40 - cardTitleH
+      })
+    }
+  },
+  computed: {
+    departmentList() {
+      if (this.getStatistic)
+        return this.getStatistic()?.statistic?.typeList || [];
+    },
+  },
+  created() {},
+  mounted() {
+    this.init();
+  }
+};
+</script>
+
+<style scoped lang="scss"></style>