Browse Source

1 可视化页面调整表格展示方式
2 业绩页面增加弹窗跳转

Pojun 1 month ago
parent
commit
00ee53380c

+ 32 - 0
tip-front/src/main/java/com/minto/app/task/controller/TaskController.java

@@ -9624,4 +9624,36 @@ public class TaskController extends BaseController {
         ModelAndView view = new ModelAndView("apps/task/dataVisualization/index");
         return view;
     }
+
+    /**
+     * 类型列表弹窗
+     * @return
+     */
+    @GetMapping("/task/listModal")
+    public ModelAndView listModal(HttpServletRequest request, HttpServletResponse response) throws Exception {
+        ModelAndView view = new ModelAndView("apps/task/analysis/listModal");
+
+        Long tipEnumId = ReqUtil.getLong(request, "tipEnumId");
+        Integer year = ReqUtil.getInt(request, "year", DateUtil.getYear());
+        if (tipEnumId != null && year != null) {
+            Map<String, Object> param = new HashMap<>();
+            param.put("tipEnumId", tipEnumId);
+            param.put("year", year);
+            //获取任务Id集合
+            List<Long> ids = taskAnalysisManager.findTaskSummaryIdsByTypeSettingEnumId(param);
+            if (CollectionUtil.isNotEmpty(ids)) {
+                List<TaskSummaryBean> taskSummaryBeans = taskManager.findTaskSummaryBeans(ids.toArray(new Long[0]));
+                List<Map<String, Object>> collect = taskSummaryBeans.stream().map(e -> {
+                    Map<String, Object> map = new HashMap<>();
+                    map.put("id", e.getId());
+                    map.put("title", e.getTitle());
+                    map.put("createDate", DateUtil.dateStringFormat(e.getCreateDate()));
+                    map.put("taskTypeId", e.getTaskTypeId());
+                    return map;
+                }).collect(Collectors.toList());
+                view.addObject("list", collect);
+            }
+        }
+        return view;
+    }
 }

+ 130 - 0
tip-front/src/main/webapp/WEB-INF/pages/apps/task/analysis/listModal.html

@@ -0,0 +1,130 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:th="http://www.thymeleaf.org">
+<head>
+    <meta charset="UTF-8"/>
+    <title>列表展示</title>
+    <meta content="webkit" name="renderer"/>
+    <meta content="IE=edge" http-equiv="X-UA-Compatible"/>
+    <meta
+            content="width=device-width,user-scalable=yes, initial-scale=1, maximum-scale=0.5"
+            name="viewport"
+    />
+    <link
+            href="../../../../../common/bootstrap-v4/css/bootstrap.min.css"
+            rel="stylesheet"
+            th:href="@{/common/bootstrap-v4/css/bootstrap.min.css}"
+    />
+    <link
+            href="../../../../../apps_res/qpm/css/public.css"
+            rel="stylesheet"
+            th:href="@{/apps_res/qpm/css/public.css}"
+            type="text/css"
+    />
+    <link rel="stylesheet" th:href="@{/apps_res/goal/css/administrator.css}" type="text/css"/>
+    <link
+            href="../../../../apps_res/goal/css/gl_index.css"
+            rel="stylesheet"
+            th:href="@{/apps_res/goal/css/gl_index.css}"
+    />
+    <link
+            href="../../../../common/mCustomScrollbar/css/jquery.mCustomScrollbar.css"
+            rel="stylesheet"
+            th:href="@{/common/mCustomScrollbar/css/jquery.mCustomScrollbar.css}"
+    />
+    <link
+            href="../../../../../common/css/minto.icon.css"
+            rel="stylesheet"
+            th:href="@{/common/css/minto.icon.css}"
+            type="text/css"
+    />
+    <link
+            href="../../../../../common/css/minto.comp.css"
+            rel="stylesheet"
+            th:href="@{/common/css/minto.comp.css}"
+            type="text/css"
+    />
+    <link
+            href="../../../../../common/css/minto.layout.css"
+            rel="stylesheet"
+            th:href="@{/common/css/minto.layout.css}"
+            type="text/css"
+    />
+    <style>
+        html, body {
+            background-color: #fff;
+        }
+
+        .pj-body-item {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            margin-bottom: 10px;
+            cursor: pointer;
+            padding: 12px 20px;
+        }
+
+        .pj-body-item:hover {
+            background-color: #f5f5f5;
+        }
+
+        .pj-body-item-cont {
+            font-size: 14px;
+        }
+
+        .pj-body-item:hover .pj-body-item-cont {
+            color: #0a93ea;
+        }
+
+        ::-webkit-scrollbar,
+        div::-webkit-scrollbar {
+            /*滚动条整体样式*/
+            width: 8px !important; /*高宽分别对应横竖滚动条的尺寸*/
+            height: 8px !important;
+        }
+    </style>
+</head>
+<body>
+<div class="pj-body" id="pjModal" v-cloak>
+    <div class="pj-body-item" @click="openTaskDetail(item)" v-for="(item, index) in listData" :key="index">
+        <div class="pj-body-item-cont">{{item.title}}</div>
+        <div class="pj-body-item-cont">{{item.createDate}}</div>
+    </div>
+</div>
+</body>
+<script src="../../../../../common/jquery/jquery.min.js" th:src="@{/common/jquery/jquery.min.js}"
+        type="text/javascript"></script>
+<script src="../../../../../common/js/ui/icon/iconfont.js" th:src="@{/common/js/ui/icon/iconfont.js}"
+        type="text/javascript"></script>
+<script th:src="@{/common/vue/vue.min.js}" type="text/javascript"></script>
+<script src="../../../../../common/js/ui/minto.comp.js" th:src="@{/common/js/ui/minto.comp.js}"
+        type="text/javascript"></script>
+<script src="../../../../../tc_ttp/common/tc.js" th:src="@{/tc_ttp/common/tc.js}" type="text/javascript"></script>
+<script src="../../../../../tc_ttp/lhgdialog4.2.0/lhgdialog.js" th:src="@{/tc_ttp/lhgdialog4.2.0/lhgdialog.js}"
+        type="text/javascript"></script>
+<script src="../../../../common/mCustomScrollbar/js/jquery.mCustomScrollbar.concat.min.js"
+        th:src="@{/common/mCustomScrollbar/js/jquery.mCustomScrollbar.concat.min.js}"></script>
+
+<script th:inline="javascript">
+    let listData = [[${list}]]
+    let dialog = frameElement ? frameElement.api : null;
+
+    let vm = new Vue({
+        el: '#pjModal',
+        data() {
+            return {
+                listData: listData,
+            }
+        },
+        methods: {
+            openTaskDetail(item) {
+                if (!!item.id) {
+                    TC.ui.openTab("/taskmt/?m=taskDetail&id=" + item.id, item.title)
+                }
+                if(dialog){
+                    dialog.close();
+                }
+            }
+        }
+    })
+</script>
+</html>

+ 32 - 1
tip-front/src/main/webapp/WEB-INF/pages/apps/task/analysis/performance.html

@@ -236,6 +236,10 @@
         .pj-sort-box.sort-active.sort-desc .pj-sort-down{
             border-top-color: #0c94ff;
         }
+        .pj-type-title{
+            color: #0c94ff;
+            cursor: pointer;
+        }
     </style>
 </head>
 <body>
@@ -322,7 +326,7 @@
     {{each data obj index}}
     <tr>
         <td>{{index+1}}</td>
-        <td>{{obj.name}}</td>
+        <td data-id="{{obj.id}}" class="pj-type-title">{{obj.name}}</td>
         <td>{{obj.c}}</td>
         <td>{{obj.valueType}}</td>
         <td>{{obj.value}}</td>
@@ -335,6 +339,7 @@
         initYears();
         initTableByManager(new Date().getFullYear(),"");
         initTableSortEvent();
+        initPageEvent()
     })
 
     function initTableByManager(year, code ,asc) {
@@ -407,6 +412,32 @@
         })
     }
 
+    function initPageEvent() {
+        $("#byManagerTrs").on('click', '.pj-type-title', function () {
+            let tipEnumId = $(this).attr("data-id");
+            let year = $("#year").val();
+
+            $.dialog({
+                title:  "事项列表",//使用节点名称
+                max: false,
+                min: false,
+                width: "440px",
+                height: "350px",
+                content:'url:' + TC.config.baseUrl + '/task/listModal?tipEnumId='+ tipEnumId + "&year=" + year,
+                lock: true,
+                button : [
+                    {
+                        "name":"关闭",
+                        callback:function(){
+                            this.close();
+                            return false;
+                        }
+                    },
+                ],
+            });
+        })
+    }
+
     $('body').on('click', '.mt-btn-group .mt-dropdown-txt', function (e) {
         $(".yearTxt").html($(this).html());
     })

+ 227 - 85
tip-front/src/main/webapp/WEB-INF/pages/apps/task/dataVisualization/index.html

@@ -11,7 +11,7 @@
           th:href="@{/common/element-ui/theme-chalk/index.css}">
     <link href="../../../../../common/css/dataVi.css" rel="stylesheet" th:href="@{/common/css/dataVi.css}">
     <style>
-        [v-cloak]{
+        [v-cloak] {
             display: none;
         }
     </style>
@@ -28,7 +28,8 @@
                     {{defaultTaskType.name}}<i class="el-icon-caret-bottom el-icon--right"></i>
                 </el-button>
                 <el-dropdown-menu slot="dropdown">
-                    <el-dropdown-item v-for="(item,index) in taskTypesList" :key="index" :command="item">{{item.name}}</el-dropdown-item>
+                    <el-dropdown-item :command="item" :key="index" v-for="(item,index) in taskTypesList">{{item.name}}
+                    </el-dropdown-item>
                 </el-dropdown-menu>
             </el-dropdown>
 
@@ -38,7 +39,8 @@
                     {{defaultYear}}<i class="el-icon-caret-bottom el-icon--right"></i>
                 </el-button>
                 <el-dropdown-menu slot="dropdown">
-                    <el-dropdown-item v-for="(item,index) in yearsList" :key="index" :command="item">{{item}}</el-dropdown-item>
+                    <el-dropdown-item :command="item" :key="index" v-for="(item,index) in yearsList">{{item}}
+                    </el-dropdown-item>
                 </el-dropdown-menu>
             </el-dropdown>
         </div>
@@ -105,7 +107,7 @@
                     <div class="fs22 title">共办理事项</div>
                 </div>
                 <div class="center-head-right flex">
-                    <div v-for="(item, index) in mainRenderData" :key="index">
+                    <div :key="index" v-for="(item, index) in mainRenderData">
                         <div class="fs22 color-18">{{item.name}}</div>
                         <div class="fs16 color-a0">{{item.text}}</div>
                     </div>
@@ -113,36 +115,54 @@
             </div>
             <dv-border-box-8 class="container content-center-cont">
                 <div class="container-title flex">
-                    <span>责任单位统计</span>
-                    <el-dropdown @command="changeDepartment">
+                    <el-radio-group @input="handleInput" size="small" v-model="activeName">
+                        <el-radio-button label="first">责任单位统计</el-radio-button>
+                        <el-radio-button label="second">人员得分排行</el-radio-button>
+                    </el-radio-group>
+
+                    <el-dropdown @command="changeDepartment" v-if="useMode.mode === '3' ">
                         <el-button size="small">
                             {{defaultDepartment.name}}<i class="el-icon-caret-bottom el-icon--right"></i>
                         </el-button>
                         <el-dropdown-menu slot="dropdown">
-                            <el-dropdown-item v-for="(item,index) in departmentList" :key="index" :command="item">{{item.name}}</el-dropdown-item>
+                            <el-dropdown-item :command="item" :key="index" v-for="(item,index) in departmentList">
+                                {{item.name}}
+                            </el-dropdown-item>
                         </el-dropdown-menu>
                     </el-dropdown>
                 </div>
                 <el-table
-                     v-loading="loading"
-                     element-loading-background="rgba(0, 0, 0, 0.1)"
-                    :data="tableData"
-                    style="width: 100%;padding: 0 10px"
-                    :border="false"
-                    size="small"
-                    @sort-change="sortChange"
+                        v-if="activeName ==='first'"
+                        :border="false"
+                        :data="tableData"
+                        @sort-change="sortChange"
+                        element-loading-background="rgba(0, 0, 0, 0.1)"
+                        size="small"
+                        style="width: 100%;padding: 0 10px"
+                        v-loading="loading"
                 >
                     <el-table-column
-                        v-for="(item, index) in tableHeaders"
+                        :formatter="item.showFormatter ? formatter :null"
                         :key="item.prop"
-                        :prop="item.prop"
                         :label="item.label"
+                        :prop="item.prop"
                         :sortable="!item.noSort ? 'custom' : true"
-                        :formatter="item.showFormatter ? formatter :null"
                         :width="item.width"
+                        v-for="(item, index) in tableHeaders"
                     >
                     </el-table-column>
                 </el-table>
+                <el-row  v-else class="grid-body" :gutter="20">
+                    <el-col :span="6" v-for="(item, index) in showPersonList" :key="index">
+                        <div class="grid-content text-ellipsis">
+                            <el-avatar shape="square" :size="48" :src="getImage(item.pid)"></el-avatar>
+                            <div class="text-ellipsis">姓名:{{item.targetName}}</div>
+                            <div class="text-ellipsis">办结率:{{item.overduePercent}}%</div>
+                            <el-rate :value="item.star" disabled></el-rate>
+                        </div>
+                    </el-col>
+                </el-row>
+
             </dv-border-box-8>
         </div>
         <div class="content-right">
@@ -170,37 +190,70 @@
             return {
                 leftData: [],
                 config: {},
-                mainRenderData:[
-                    {name:"仍在办理",text:"",key:"tDoCount",unit:"(项)"},
-                    {name:"已超期",text:"",key:"tOverdueCount",unit:"(项)"},
-                    {name:"超期率",text:"",key:"tOverduePercent",unit:"%"},
-                    {name:"已经办结",text:"",key:"tAllFinishCount",unit:"(项)"},
+                mainRenderData: [
+                    {name: "仍在办理", text: "", key: "tDoCount", unit: "(项)"},
+                    {name: "已超期", text: "", key: "tOverdueCount", unit: "(项)"},
+                    {name: "超期率", text: "", key: "tOverduePercent", unit: "%"},
+                    {name: "已经办结", text: "", key: "tAllFinishCount", unit: "(项)"},
                 ],// 主要的渲染数据
-                tAllCount:{},// 中间总办理事项
+                tAllCount: {},// 中间总办理事项
                 defaultYear: new Date().getFullYear(),// 默认年份
                 yearsList: [],// 年份列表
-                taskTypesList:[{id:"",name:"全部类型",parent_id:'0'}],// 事项类型列表
-                defaultTaskType:{id:"",name:"全部类型",parent_id:'0'},// 默认事项类型
-                departmentList:[{id:"",name:"全部门"}],  // 部门列表
-                defaultDepartment:{id:"",name:"全部门"}, // 默认部门
-                tableData:[],
-                tableHeaders:[
-                    {prop:"targetName",label:"责任单位", noSort:true, width:'100px'},
-                    {prop:"count",label:"办理事项总数"},
-                    {prop:"doCount",label:"推进中事项"},
-                    {prop:"overdueCount",label:"超期事项", width:'100px'},
-                    {prop:"overduePercent",label:"超期率", showFormatter:true, width:'90px'},
-                    {prop:"remindCount",label:"被催办次数"},
-                    // {prop:"remindCount",label:"被退回次数"},
-                    {prop:"finishCount",label:"已办结事项"},
-                    {prop:"finishPercent",label:"办结率", showFormatter:true, width:'90px'},
-                    {prop:"score",label:"总得分"}
-                ],
-                objToSort:{
-                    gbOrder:"",
-                    gbDesc:""
+                taskTypesList: [{id: "", name: "全部类型", parent_id: '0', renderMode: "1"}],// 事项类型列表
+                defaultTaskType: {id: "", name: "全部类型", parent_id: '0'},// 默认事项类型
+                departmentList: [{id: "", name: "全部门"}],  // 部门列表
+                defaultDepartment: {id: "", name: "全部门"}, // 默认部门
+                tableData: [],
+                tableHeaders: [],
+                objToSort: {
+                    gbOrder: "",
+                    gbDesc: ""
                 },
-                loading:false
+                loading: false,
+                // 增加三种模式, 根据选择的不同类型做渲染,表头不一样
+                typesMap: {
+                    // 目标、党建、廉政、素能
+                    "1": {
+                        ids: ['1496787274336783481', '1321300271244659871', '-7825878704032234403', '-3868539218005177422'],
+                        headers: [
+                            {prop: "targetName", label: "事项标签"},
+                            {prop: "allCount", label: "办理事项总数"},
+                            {prop: "finishCount", label: "已办结数"},
+                            {prop: "finishPercent", label: "办结率", showFormatter: true, width: "100px"},
+
+                        ],
+                    },
+                    // 业绩、普通、重点案件
+                    "2": {
+                        ids: ['4795471923599067489', '8232033217741604862', '8681357661311811952'],
+                        headers: [
+                            {prop: "name", label: "类型名称"},
+                            {prop: "c", label: "办件量"},
+                            {prop: "valueType", label: "类型单位"},
+                            {prop: "value", label: "值", width: '150px'},
+                        ],
+                    },
+                    "3": {
+                        ids: [],
+                        headers: [
+                            {prop: "targetName", label: "责任单位", noSort: true, width: '100px'},
+                            {prop: "count", label: "办理事项总数"},
+                            {prop: "doCount", label: "推进中事项"},
+                            {prop: "overdueCount", label: "超期事项", width: '100px'},
+                            {prop: "overduePercent", label: "超期率", showFormatter: true, width: '90px'},
+                            {prop: "remindCount", label: "被催办次数"},
+                            {prop: "finishCount", label: "已办结事项"},
+                            {prop: "finishPercent", label: "办结率", showFormatter: true, width: '90px'},
+                            {prop: "score", label: "总得分"}
+                        ],
+                    }
+                },
+                useMode: {
+                    mode: '1',
+                    headers: []
+                },
+                activeName: "first",
+                showPersonList: []
             };
         },
         methods: {
@@ -213,11 +266,9 @@
                 );
                 container.style.transform = 'scale(' + scale + ')';
             },
-            // 获取中间数据
-            getCenterData() {
-                let _that = this;
-                _that.loading = true;
-                const depId = _that.defaultDepartment.id.split("_")[1] || ""
+            // 未提供接口, 所以每次刷新后动态再去刷新一次统计数据
+            refreshTotalData(depId) {
+                const _that = this;
                 let param = {
                     orgName: "",
                     taskTypeId: "0",
@@ -230,34 +281,96 @@
                 callAjaxRequest("taskAnalysisWebService", "findTaskTaskAnalysisByManager", param, function (result) {
                     _that.tAllCount = result.tAllCount || "";
                     _that.setMainRenderData(result);
-                    _that.tableData = result.list || []
-                    _that.loading = false;
                 })
             },
+            // 获取中间数据
+            getCenterData() {
+                let _that = this;
+                _that.loading = true;
+                const depId = _that.defaultDepartment.id.split("_")[1] || ""
+                // 根据id查找typesMap中符合的, 不符合就直接返回模式3
+                for (let key in _that.typesMap) {
+                    const item = _that.typesMap[key];
+                    if (item.ids.includes(_that.defaultTaskType.id)) {
+                        _that.useMode.mode = key;
+                        _that.useMode.headers = item.headers;
+                        break;
+                    } else {
+                        _that.useMode.mode = '3';
+                        _that.useMode.headers = item.headers;
+                    }
+                }
+
+                _that.tableHeaders = _that.useMode.headers;
+
+                if (_that.useMode.mode === '1') {
+                    let param = {
+                        year: _that.defaultYear,
+                        month: "0",
+                        taskTypeId: _that.defaultTaskType.id,
+                        taskTypeName: _that.defaultTaskType.name,
+                        order: _that.objToSort.gbOrder,
+                        asc: _that.objToSort.gbDesc
+                    }
+                    callAjaxRequest("taskAnalysisWebService", "findTaskTaskAnalysisByLabel", param, function (result) {
+                        _that.tableData = result.list || []
+                        _that.loading = false;
+                    })
+                    _that.refreshTotalData(depId)
+                } else if (_that.useMode.mode === '2') {
+                    let param = {
+                        year: _that.defaultYear,
+                        taskTypeId: _that.defaultTaskType.id,
+                        order: _that.objToSort.gbOrder,
+                        asc: _that.objToSort.gbDesc
+                    }
+                    callAjaxRequest("taskAnalysisWebService", "findTypeScopeTaskCountAnalysis", param, function (result) {
+                        _that.tableData = result || []
+                        _that.loading = false;
+                    })
+                    _that.refreshTotalData(depId)
+                } else {
+                    let param = {
+                        orgName: "",
+                        taskTypeId: "0",
+                        year: _that.defaultYear,
+                        gbTaskTypeId: _that.defaultTaskType.id,
+                        gbDeptId: depId,
+                        gbOrder: _that.objToSort.gbOrder,
+                        gbDesc: _that.objToSort.gbDesc
+                    };
+                    callAjaxRequest("taskAnalysisWebService", "findTaskTaskAnalysisByManager", param, function (result) {
+                        _that.tAllCount = result.tAllCount || "";
+                        _that.setMainRenderData(result);
+                        _that.tableData = result.list || []
+                        _that.loading = false;
+                    })
+                }
+            },
             // 处理百分比显示
-            formatter(row, column){
-                return  row[column.property]+ "%"
+            formatter(row, column) {
+                return row[column.property] + "%"
             },
             // 排序改变
-            sortChange({  prop, order }){
+            sortChange({prop, order}) {
                 // 责任单位前端排..
-                if(prop === "targetName"){
+                if (prop === "targetName") {
                     return
                 }
-                this.objToSort ={
+                this.objToSort = {
                     gbOrder: prop,
                     gbDesc: order === "ascending" ? "1" : "0"
                 }
                 this.getCenterData()
             },
             // 中间区域头部数据
-            setMainRenderData(data){
-                this.mainRenderData.map(function (item){
-                    item.text = data[item.key]+item.unit
+            setMainRenderData(data) {
+                this.mainRenderData.map(function (item) {
+                    item.text = data[item.key] + item.unit
                 })
             },
             // 获取右侧数据,使用考核的接口, 固定按照平均完成时间排序
-            getRightData(){
+            getRightData() {
                 let _that = this;
                 let param = {
                     year: _that.defaultYear,
@@ -268,50 +381,50 @@
                     asc: 1
                 }
                 callAjaxRequest("taskAnalysisWebService", "findEvaluateAnalysis", param, function (result) {
-                    let data = result.map(function (item){
-                        return{
+                    let data = result.map(function (item) {
+                        return {
                             name: item.pname,
                             value: item.avgtime
                         }
                     })
                     _that.config = {
                         rowNum: 12,
-                        data:data,
-                        sort:false,
-                        valueFormatter(item){
+                        data: data,
+                        sort: false,
+                        valueFormatter(item) {
                             return _that.formatTimestampToHMS(item.value)
                         }
                     }
                 })
             },
-            formatTimestampToHMS (diffInMilliseconds) {
+            formatTimestampToHMS(diffInMilliseconds) {
                 let diffInSeconds = Math.floor(diffInMilliseconds / 1000);
                 let days = Math.floor(diffInSeconds / (3600 * 24));
                 let hours = Math.floor((diffInSeconds % (3600 * 24)) / 3600);
                 let minutes = Math.floor((diffInSeconds % 3600) / 60);
                 let seconds = diffInSeconds % 60;
                 // 格式化输出,确保每部分都是两位数字
-                let formattedDays = days == 0 ? '' : ''+days+'天';
+                let formattedDays = days == 0 ? '' : '' + days + '天';
                 let formattedHours = ('0' + hours).slice(-2);
                 let formattedMinutes = ('0' + minutes).slice(-2);
                 let formattedSeconds = ('0' + seconds).slice(-2);
                 return `${formattedDays}${formattedHours}:${formattedMinutes}:${formattedSeconds}`;
             },
             // 年份默认当前年份,以及前2年?
-            initYearsList(){
-                for(let  i= 0; i <= 2; i++) {
+            initYearsList() {
+                for (let i = 0; i <= 2; i++) {
                     this.yearsList.push(this.defaultYear - i)
                 }
             },
             // 年份的变动
-            changeYear(e){
+            changeYear(e) {
                 this.defaultYear = e;
                 this.getCenterData();
                 this.getRightData();
                 this.getLeftData();
             },
             // 获取左侧数据
-            getLeftData(){
+            getLeftData() {
                 let _that = this;
                 let param = {
                     orgName: "",
@@ -323,7 +436,7 @@
                 })
             },
             // 设置左侧数据
-            setLeftData(list){
+            setLeftData(list) {
                 let colors = [
                     ['#FFF1BC', '#FED35D'],
                     ['#428FE0', '#73F7FB'],
@@ -331,17 +444,17 @@
                 ]
                 let renderList = [];
                 // 数据永远是三条, 就算不满足也是3
-                for(let i = 0; i < 3; i++) {
+                for (let i = 0; i < 3; i++) {
                     let item = list[i];
                     renderList.push(
                         {
-                            title: item ? item.targetName :"无类型统计",
-                            totalNumber:item ? item.allCount :"0",
+                            title: item ? item.targetName : "无类型统计",
+                            totalNumber: item ? item.allCount : "0",
                             totalUnit: '办理事项总数(项)',
                             list: [
                                 {name: '推进中(项)', number: item ? item.doCount : "0"},
-                                {name: '已办结(项)', number: item ? item.finishCount :"0"},
-                                {name: '超期事项(项)', number: item ? item.overdueCount :"0"},
+                                {name: '已办结(项)', number: item ? item.finishCount : "0"},
+                                {name: '超期事项(项)', number: item ? item.overdueCount : "0"},
                             ],
                             progress: item ? item.finishPercent : 0,
                             colors: colors[i],
@@ -350,8 +463,8 @@
                 }
                 this.leftData = renderList
             },
-            // 初始化事项类型
-            initTaskType(){
+            // 初始化事项类型, 根据需求给一些模式区分不同的列头
+            initTaskType() {
                 const _that = this;
                 callAjaxRequest("taskAnalysisWebService", "findTaskTypes", {}, function (result) {
                     result = result || [];
@@ -359,13 +472,13 @@
                 })
             },
             // 改变失效类型
-            changeTaskType(e){
+            changeTaskType(e) {
                 this.defaultTaskType = e;
-                this.getCenterData()
+                this.handleInput(this.activeName)
                 this.getRightData()
             },
             // 初始化部门列表
-            initDepList(){
+            initDepList() {
                 const _that = this;
                 let data = {
                     m: 'findOrgSub',
@@ -373,17 +486,46 @@
                     unitType: 'Department'
                 }
                 TC.util.getAjaxData(TC.config.baseUrl + "/org/department/", data, result => {
-                    result.map(item=>{
-                        if(item.pId !== "0"){
+                    result.map(item => {
+                        if (item.pId !== "0") {
                             _that.departmentList.push(item)
                         }
                     })
                 })
             },
             // 切换部门
-            changeDepartment(e){
+            changeDepartment(e) {
                 this.defaultDepartment = e;
                 this.getCenterData()
+            },
+            // tab切换
+            handleInput(e) {
+                const _that = this;
+                if(e === 'first'){
+                    _that.getCenterData()
+                }else {
+                // 獲取人員排行
+                    const depId = _that.defaultDepartment.id.split("_")[1] || ""
+                    const param = {
+                        orgName: "",
+                        taskTypeId: "0",
+                        year: _that.defaultYear,
+                        gbTaskTypeId: _that.defaultTaskType.id,
+                        gbDeptId: depId,
+                        gbOrder: "",
+                        gbDesc: ""
+                    };
+                    callAjaxRequest("taskAnalysisWebService", "findTaskTaskAnalysisByManager", param, function (result) {
+                        _that.tAllCount = result.tAllCount || "";
+                        _that.setMainRenderData(result);
+                        _that.showPersonList = result.list || []
+                        _that.loading = false;
+                    })
+                }
+            },
+            // 获取头像
+            getImage(id){
+                return  TC.config.baseUrl + "/org/persons/"+id+"/?m=picon";
             }
         },
         mounted() {

+ 22 - 0
tip-front/src/main/webapp/common/css/dataVi.css

@@ -295,6 +295,21 @@ body {
 .dv-scroll-board .header .header-item {
 	text-overflow: unset !important;
 }
+.grid-content{
+	display: flex;
+	flex-direction: column;
+	gap: 10px;
+	padding: 15px;
+	border: 1px solid #00a3ff;
+	color: white;
+	font-size: 14px;
+	margin-bottom: 20px;
+}
+.grid-body{
+	overflow: auto;
+	padding: 20px 20px 0;
+}
+
 /* 右侧 */
 .content-right {
 	background: linear-gradient(180deg, rgba(57, 95, 136, 0.282) 0%, rgba(7, 46, 87, 0.6) 100%);
@@ -321,3 +336,10 @@ body {
 .el-table::before{
 	height: 0;
 }
+
+/* 文本省略 */
+.text-ellipsis {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}