Browse Source

feat(eoeg): 实现待办事项列表展示与分页功能

- 添加待办任务表格展示流程名称和任务名称
- 集成分页组件支持数据分页加载
- 实现"去处理"按钮跳转至待办页面
- 引入接口获取待办任务数据
- 添加加载状态提示提升用户体验
- 完善查询参数配置支持多条件筛选
jiangbiao 2 months ago
parent
commit
3337d79845
1 changed files with 61 additions and 6 deletions
  1. 61 6
      ui/src/views/eoeg/home/dashboard/pending.vue

+ 61 - 6
ui/src/views/eoeg/home/dashboard/pending.vue

@@ -1,14 +1,33 @@
 <template>
   <div :style="{height:height,width:width}">
-    <h3>我的待办</h3>
-    <div class="text-container">
-      <el-table border>
+    <h3>我的待办
+      <el-button
+        size="mini"
+        type="text"
+        icon="el-icon-top-right"
+        @click="toPending"
+      >去处理
+      </el-button>
+    </h3>
+    <el-table :data="approvedangerList" v-loading="loading">
+      <el-table-column label="流程名称" align="center" prop="processName" :show-overflow-tooltip="true"/>
+      <el-table-column label="待办任务名称" align="center" prop="taskName" :show-overflow-tooltip="true"/>
+    </el-table>
 
-      </el-table>
-    </div>
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      layout="prev, pager, next"
+      :background="false"
+      @pagination="getList"
+    />
   </div>
 </template>
 <script>
+import {getPendinglist} from "@/api/ehs/approvedanger";
+
 export default {
   name: 'pendingChart',
   props: {
@@ -23,9 +42,45 @@ export default {
   },
   data() {
     return {
+      // 总条数
+      total: 0,
+      // 遮罩层
+      loading: true,
+      approvedangerList: [],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 20,
+        plantCode: null,
+        recorderId: null,
+        hiddendangerLevel: null,
+        hiddendangerContent: null,
+        measures: null,
+        completeTime: null,
+        status: null,
+        creattime: null,
+        endtime: null,
+        processId: null,
+        approveNo: null,
+        deptId: null,
+      },
     }
   },
-  mounted() {
+  created() {
+    this.getList()
+  },
+  methods: {
+    /** 查询隐患申请列表 */
+    getList() {
+      this.loading = true;
+      getPendinglist(this.queryParams).then(response => {
+        this.approvedangerList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    toPending() {
+      this.$router.push({path: '/approve/pending'})
+    }
   }
 }
 </script>