update code

src/api/flow/index.js

@@ -13,8 +13,32 @@ const groupByUnit=(projectId,deptId)=> {
       method: 'get'
     })
   }
+const listByUnit=(projectId,deptId,unit,pageNum,pageSize)=>{
+  return request({
+    url: `bgscreen/flow/listByUnit?pageNum=${pageNum}&pageSize=${pageSize}`,
+    method: 'post',
+    data:{
+      taskId:unit,
+      deptId:deptId,
+      projectId:projectId
+    }
+  })
+}
+const listByState=(projectId,deptId,state,pageNum,pageSize)=>{
+  return request({
+    url: `bgscreen/flow/listByState?pageNum=${pageNum}&pageSize=${pageSize}`,
+    method: 'post',
+    data:{
+      taskId:state,
+      deptId:deptId,
+      projectId:projectId
+    }
+  })
+}
 
 export default{
     groupByCategory,
-    groupByUnit
+    groupByUnit,
+    listByUnit,
+    listByState
 }

src/pages/components/AttendanceDetailDialog.vue

@@ -33,7 +33,7 @@
       </el-table-column>
         </el-table>
        
-        <el-pagination  layout="prev, pager, next" :hide-on-single-page="true" @current-change="handleCurrentChange" :total="total"  :page-size="size"  :current-page.sync="index" class="bg-pagination"></el-pagination>
+        <el-pagination  layout="total,prev, pager, next" :hide-on-single-page="true" @current-change="handleCurrentChange" :total="total"  :page-size="size"  :current-page.sync="index" class="bg-pagination"></el-pagination>
 
     </MyDialog>
 </template>
@@ -61,12 +61,7 @@ export default {
     },
 
     mounted() {
-        this.tableData = [
+       
-            { prj: '项目一', node: '招采', days: 5, date: '2023.06.04',username:'haha' },
-            { prj: '项目二', node: '报建审批及地勘施工', days: 10, date: '2023.05.31' },
-            { prj: '项目三', node: '前期工作', days: 3, date: '2023.06.06' },
-            { prj: '项目四', node: '市政道路施工', days: 4, date: '2023.06.05' }
-        ]
     },
 
     methods: {

src/pages/engin/flowDetailByStateDialog.vue

@@ -0,0 +1,105 @@
+<template>
+    <MyDialog v-if="show" v-model="show" width="1600px"  height="650px" class="flow-detail-state-dialog">
+        <template slot="title">质量-审批进度</template>
+        <div class="head-title-tab" style="padding: 10px 0px;">
+                <div :class="nav == 1 ? 'head-nav active' : 'head-nav'" @click="doNav(1)">全部审批</div>
+                <div :class="nav == 2 ? 'head-nav active' : 'head-nav'" @click="doNav(2)">进行中</div>
+                <div :class="nav == 3 ? 'head-nav active' : 'head-nav'" @click="doNav(3)">已完成</div>
+        </div>
+
+        <el-table :data="tableData" class="mytable" height="450" style="width: 100%;background: transparent;"  ref="fbsubordinateUnit">
+            <el-table-column prop="procDefName" label="审批类型"> </el-table-column>
+            <el-table-column prop="businessKeyName" label="申请项目" class-name="text-left">
+            </el-table-column>
+            <el-table-column prop="startDeptName" label="申请单位" class-name="text-left">
+            </el-table-column>
+            <el-table-column prop="startUserName" label="申请人" width="150">
+            </el-table-column>
+            <el-table-column prop="startUserName" label="当前状态" width="150">           
+                <template slot-scope="{row}">
+                    <span v-if="row.finishTime" style="color: greenyellow;">已完成</span>
+                    <span v-else style="color: red;">进行中</span>
+                </template>
+            </el-table-column>
+            <el-table-column prop="taskName" label="当前节点" width="150">
+            </el-table-column>
+            <el-table-column prop="createTime" label="接收时间" width="150">
+            </el-table-column>
+        </el-table>
+        <el-pagination  layout="total,prev, pager, next" :hide-on-single-page="true" @current-change="handleCurrentChange" :total="total"  :page-size="size"  :current-page.sync="index" class="bg-pagination"></el-pagination>
+    </MyDialog>
+</template>
+
+<script>
+
+import MyDialog from '../components/MyDialog'
+export default {
+    components: {
+        MyDialog,
+    },
+    name: 'JhbigscreenIndexDlg1',
+
+    data() {
+        return {
+            show: false,
+            tableData: [],
+            nav:1,
+            index:1,
+            size:10,
+            deptId:0,
+            projectId:0,
+            total:0,
+        };
+    },
+
+    mounted() {        
+        this.tableData = [
+            { prj: '项目一', node: '招采', days: 5, date: '2023.06.04',username:'haha' },
+            { prj: '项目二', node: '报建审批及地勘施工', days: 10, date: '2023.05.31' },
+            { prj: '项目三', node: '前期工作', days: 3, date: '2023.06.06' },
+            { prj: '项目四', node: '市政道路施工', days: 4, date: '2023.06.05' }
+        ]
+    },
+
+    methods: {
+        handleCurrentChange(n){
+            this.index=n;
+            this.loadData();
+        },
+        doNav(n){
+            this.nav=n;
+            this.index=1;
+            this.loadData();
+        },
+        showDialog(data) {
+            this.deptId=data.deptId;
+            this.projectId=data.projectId;
+            this.nav=1;
+            this.index=1;
+            this.loadData();
+            this.show = true
+        },
+        loadData(){
+            this.$api.flow.listByState(this.projectId,this.deptId,this.nav,this.index,this.size).then(d=>{
+                this.tableData=d.rows||[];
+                this.total=d.total;
+            })
+        }
+    },
+};
+</script>
+
+<style lang="less" scoped>
+.mytable{
+    /deep/ th .cell{
+        color: aquamarine;
+    }
+}
+</style>
+<style lang="less">
+.flow-detail-state-dialog{
+    .bg-pagination{
+            margin-top:20px;
+        }
+}
+</style>

src/pages/engin/flowDetailByUnitDialog.vue

@@ -0,0 +1,101 @@
+<template>
+    <MyDialog v-if="show" v-model="show" width="1600px"  height="650px" class="flow-detail-unit-dialog">
+        <template slot="title">待审批</template>
+        <div class="head-title-tab" style="padding: 10px 0px;width:unset;">
+                <div :class="nav == 1 ? 'head-nav active' : 'head-nav'" @click="doNav(1)">总包单位</div>
+                <div :class="nav == 2 ? 'head-nav active' : 'head-nav'" @click="doNav(2)">监理单位</div>
+                <div :class="nav == 3 ? 'head-nav active' : 'head-nav'" @click="doNav(3)">设计单位</div>
+                <div :class="nav == 4 ? 'head-nav active' : 'head-nav'" @click="doNav(4)">甲方代表</div>
+                <div :class="nav == 5 ? 'head-nav active' : 'head-nav'" @click="doNav(5)">子公司</div>
+        </div>
+        <el-table :data="tableData" class="mytable" height="450" style="width: 100%;background: transparent;"  ref="fbsubordinateUnit">
+            <el-table-column prop="procDefName" label="审批类型"> </el-table-column>
+            <el-table-column prop="businessKeyName" label="申请项目" class-name="text-left">
+            </el-table-column>
+            <el-table-column prop="startDeptName" label="申请单位" class-name="text-left">
+            </el-table-column>
+            <el-table-column prop="startUserName" label="申请人" width="150">
+            </el-table-column>
+            <el-table-column prop="startUserName" label="当前状态" width="150">           
+                <template slot-scope="{row}">
+                    <span v-if="row.finishTime" style="color: greenyellow;">已完成</span>
+                    <span v-else style="color: red;">进行中</span>
+                </template>
+            </el-table-column>
+            <el-table-column prop="taskName" label="当前节点" width="150">
+            </el-table-column>
+            <el-table-column prop="createTime" label="接收时间" width="150">
+            </el-table-column>
+        </el-table>
+        <el-pagination  layout="total,prev, pager, next" :hide-on-single-page="true" @current-change="handleCurrentChange" :total="total"  :page-size="size"  :current-page.sync="index" class="bg-pagination"></el-pagination>
+    </MyDialog>
+</template>
+
+<script>
+
+import MyDialog from '../components/MyDialog'
+export default {
+    components: {
+        MyDialog,
+    },
+    name: 'JhbigscreenIndexDlg1',
+
+    data() {
+        return {
+            show: false,
+            tableData: [],
+            nav:1,
+            index:1,
+            size:10,
+            deptId:0,
+            projectId:0,
+            total:0,
+        };
+    },
+
+    mounted() {
+        
+    },
+
+    methods: {
+        handleCurrentChange(n){
+            this.index=n;
+            this.loadData();
+        },
+        doNav(n){
+            this.nav=n;
+            this.index=1;
+            this.loadData();
+        },
+        showDialog(data) {
+            this.deptId=data.deptId;
+            this.projectId=data.projectId;
+            this.nav=1;
+            this.index=1;
+            this.loadData();
+            this.show = true
+        },
+        loadData(){
+            this.$api.flow.listByUnit(this.projectId,this.deptId,this.nav,this.index,this.size).then(d=>{
+                this.tableData=d.rows||[];
+                this.total=d.total;
+            })
+        }
+    },
+};
+</script>
+
+<style lang="less" scoped>
+.mytable{
+    /deep/ th .cell{
+        color: aquamarine;
+    }
+}
+</style>
+<style lang="less">
+.flow-detail-unit-dialog{
+    .bg-pagination{
+            margin-top:20px;
+        }
+}
+</style>

src/pages/projectEngin.vue

@@ -32,10 +32,12 @@
                     </module-one-1-1>
                 </el-col>
                 <el-col :span="8">
-                    <module-one-1-1 label="审批进度" :border="1">
+                    <module-one-1-1 label="审批进度" :border="1"  style="position: relative;">
+                        <img src="images/icon2001.png" style="position: absolute;cursor: pointer;right: 20px;top: 32px;z-index: 9;" @click="doStateDlg">
                         <chart-bar :height="280" :optData="chart1Data" :fn="changeChart1" :key="elChart2"></chart-bar>
                     </module-one-1-1>
-                    <module-one-1-1 label="待审批" :border="1" class="chart2">
+                    <module-one-1-1 label="待审批" :border="1" class="chart2" style="position: relative;">
+                        <img src="images/icon2001.png" style="position: absolute;cursor: pointer;right: 20px;top: 32px;z-index:9;" @click="doUnitDlg">
                         <project-overview-chart :key="elChart2" :fn="changeChart2" :sp="'\n'" :maintitle="flowTotal" :legend-opt="legendOpt2"
                                 :typedata="chart2Data" :text="flowTitle" :height="280"
                                 style="top:0px"></project-overview-chart>
@@ -74,6 +76,8 @@
             </el-row>
         </div>
     </div>
+    <unitDialog ref="unitDlg"></unitDialog>
+    <stateDialog ref="stateDlg"></stateDialog>
     </div>
 </template>
 
@@ -87,11 +91,13 @@ import '../components/project-overview-chart'
 import BorderBox6 from './components/BorderBox6.vue'
 import debounce from 'lodash.debounce'
 import imageItem from './engin/enginImageItems.vue'
+import unitDialog from './engin/flowDetailByUnitDialog.vue'
+import stateDialog from './engin/flowDetailByStateDialog.vue'
 export default {
     name: 'JhbigscreenProjectEngin',
     components: {
         BorderBox6,
-        imageItem
+        imageItem,unitDialog,stateDialog
     },
     data() {
         return {
@@ -160,6 +166,18 @@ export default {
     },
 
     methods: {
+        doStateDlg(){
+            this.$refs.stateDlg.showDialog({
+                deptId:this.dept?.id||0,
+                projectId:this.project?.id||0
+            });
+        },
+        doUnitDlg(){
+            this.$refs.unitDlg.showDialog({
+                deptId:this.dept?.id||0,
+                projectId:this.project?.id||0
+            });
+        },
         loadPeriodical(){
             this.$api.periodical.getList().then(d=>{
                this.periodicalList=(d.data||[]).map(it=>{
@@ -171,9 +189,6 @@ export default {
             });
         },
         changeChart1(opt){            
-            console.log("--opt->",opt)
-            //opt.xAxis.axisLabel={width:50}
-            //opt.xAxis.data=this.chartInfo;
             return opt;
         },
         changeChart2(opt){

src/pages/style/index.less

@@ -118,6 +118,9 @@
     .btn-next{
         margin-left:20px;
     }
+    .el-pagination__total{
+        color: #fff;
+    }
     .el-pager {
         li{
             background-color: rgba(1, 169, 255,0.4);