|
|
@@ -14,31 +14,25 @@
|
|
|
[v-cloak]{
|
|
|
display: none;
|
|
|
}
|
|
|
-
|
|
|
- .togg_tab{
|
|
|
- margin-left: 10px;
|
|
|
- display: flex;
|
|
|
- }
|
|
|
- .togg_tab div{
|
|
|
- margin-right: 10px;
|
|
|
- padding: 5px 10px;
|
|
|
- color: #efefef;
|
|
|
- border: 1px solid #efefef;
|
|
|
- }
|
|
|
- .togg_tab div:hover, .togg_tab div.cur{
|
|
|
- cursor: pointer;
|
|
|
- color: #1370fb;
|
|
|
- font-weight: bold;
|
|
|
- border-color: #1370fb;
|
|
|
- }
|
|
|
</style>
|
|
|
</head>
|
|
|
<body>
|
|
|
<div class="flex-column" id="app" v-cloak>
|
|
|
<div class="page-header flex">
|
|
|
<div class="page-header-title">督办事项整体情况分析</div>
|
|
|
- <div class="flex" style="align-items: center">
|
|
|
+ <div class="flex" style="align-items: center;gap:10px">
|
|
|
<dv-decoration-3 style="width: 250px; height: 30px"></dv-decoration-3>
|
|
|
+ <!-- 选事项类型 -->
|
|
|
+ <el-dropdown @command="changeTaskType">
|
|
|
+ <el-button size="small">
|
|
|
+ {{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-menu>
|
|
|
+ </el-dropdown>
|
|
|
+
|
|
|
+ <!-- 选年份 -->
|
|
|
<el-dropdown @command="changeYear">
|
|
|
<el-button size="small">
|
|
|
{{defaultYear}}<i class="el-icon-caret-bottom el-icon--right"></i>
|
|
|
@@ -118,13 +112,36 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<dv-border-box-8 class="container content-center-cont">
|
|
|
-<!-- <div class="container-title">责任单位承办事项完成效率分析</div>-->
|
|
|
- <div class="togg_tab">
|
|
|
- <div :class="selectedTab === 'zrdw' ? 'cur' : ''" @click="tabChange('zrdw')">责任单位统计</div>
|
|
|
- <div :class="selectedTab === 'sxlx' ? 'cur' : ''" @click="tabChange('sxlx')">事项类型统计</div>
|
|
|
+ <div class="container-title flex">
|
|
|
+ <span>责任单位统计</span>
|
|
|
+ <el-dropdown @command="changeDepartment">
|
|
|
+ <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-menu>
|
|
|
+ </el-dropdown>
|
|
|
</div>
|
|
|
- <dv-scroll-board :config="tableConfig" style="flex: 1"></dv-scroll-board>
|
|
|
-<!-- <dv-scroll-board :config="tableConfig" style="flex: 1"></dv-scroll-board>-->
|
|
|
+ <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"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ v-for="(item, index) in tableHeaders"
|
|
|
+ :key="item.prop"
|
|
|
+ :prop="item.prop"
|
|
|
+ :label="item.label"
|
|
|
+ :sortable="!item.noSort ? 'custom' : true"
|
|
|
+ :formatter="item.showFormatter ? formatter :null"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
</dv-border-box-8>
|
|
|
</div>
|
|
|
<div class="content-right">
|
|
|
@@ -152,18 +169,6 @@
|
|
|
return {
|
|
|
leftData: [],
|
|
|
config: {},
|
|
|
- tableConfig: {},
|
|
|
- tableHeader: [
|
|
|
- {name: "责任单位", value: "targetName"},
|
|
|
- {name: "办理事项总数", value: "count"},
|
|
|
- {name: "推进中事项", value: "doCount"},
|
|
|
- {name: "超期事项", value: "overdueCount"},
|
|
|
- {name: "超期率", value: "overduePercent"},
|
|
|
- {name: "被催办次数", value: "remindCount"},
|
|
|
- {name: "被退回次数", value: "backCount"},
|
|
|
- {name: "已办结事项", value: "finishCount"},
|
|
|
- {name: "办结率", value: "finishPercent"},
|
|
|
- ],
|
|
|
mainRenderData:[
|
|
|
{name:"仍在办理",text:"",key:"tDoCount",unit:"(项)"},
|
|
|
{name:"已超期",text:"",key:"tOverdueCount",unit:"(项)"},
|
|
|
@@ -173,8 +178,28 @@
|
|
|
tAllCount:{},// 中间总办理事项
|
|
|
defaultYear: new Date().getFullYear(),// 默认年份
|
|
|
yearsList: [],// 年份列表
|
|
|
-
|
|
|
- selectedTab: 'zrdw'
|
|
|
+ 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},
|
|
|
+ {prop:"count",label:"办理事项总数"},
|
|
|
+ {prop:"doCount",label:"推进中事项"},
|
|
|
+ {prop:"overdueCount",label:"超期事项"},
|
|
|
+ {prop:"overduePercent",label:"超期率", showFormatter:true},
|
|
|
+ {prop:"remindCount",label:"被催办次数"},
|
|
|
+ // {prop:"remindCount",label:"被退回次数"},
|
|
|
+ {prop:"finishCount",label:"已办结事项"},
|
|
|
+ {prop:"finishPercent",label:"办结率", showFormatter:true},
|
|
|
+ {prop:"score",label:"总得分"}
|
|
|
+ ],
|
|
|
+ objToSort:{
|
|
|
+ gbOrder:"",
|
|
|
+ gbDesc:""
|
|
|
+ },
|
|
|
+ loading:false
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
@@ -187,75 +212,42 @@
|
|
|
);
|
|
|
container.style.transform = 'scale(' + scale + ')';
|
|
|
},
|
|
|
- tabChange(type) {
|
|
|
- this.selectedTab = type
|
|
|
- this.getCenterData()
|
|
|
- },
|
|
|
// 获取中间数据
|
|
|
getCenterData() {
|
|
|
- if (this.selectedTab === 'zrdw') this.getZrdwTable()
|
|
|
- else this.getSxlxTable()
|
|
|
- },
|
|
|
- // 获取责任单位表格数据
|
|
|
- getZrdwTable() {
|
|
|
let _that = this;
|
|
|
+ _that.loading = true;
|
|
|
+ const depId = _that.defaultDepartment.id.split("_")[1] || ""
|
|
|
let param = {
|
|
|
orgName: "",
|
|
|
taskTypeId: "0",
|
|
|
- year: _that.defaultYear
|
|
|
+ year: _that.defaultYear,
|
|
|
+ gbTaskTypeId: _that.defaultTaskType.id,
|
|
|
+ gbDeptId: depId,
|
|
|
+ gbOrder: _that.objToSort.gbOrder,
|
|
|
+ gbDesc: _that.objToSort.gbDesc
|
|
|
};
|
|
|
- this.tableHeader[0] = {name: "责任单位", value: "targetName"}
|
|
|
callAjaxRequest("taskAnalysisWebService", "findTaskTaskAnalysisByManager", param, function (result) {
|
|
|
_that.tAllCount = result.tAllCount || "";
|
|
|
- _that.setTableConfig(result.list || []);
|
|
|
_that.setMainRenderData(result);
|
|
|
+ _that.tableData = result.list || []
|
|
|
+ _that.loading = false;
|
|
|
})
|
|
|
},
|
|
|
- // 获取事项类型表格数据
|
|
|
- getSxlxTable() {
|
|
|
- let _that = this;
|
|
|
- let param = {
|
|
|
- orgName: "",
|
|
|
- taskTypeId: "0",
|
|
|
- year: _that.defaultYear
|
|
|
- };
|
|
|
- this.tableHeader[0] = {name: "类型名称", value: "targetName"}
|
|
|
- callAjaxRequest("taskAnalysisWebService", "findTaskTaskAnalysisByType", param, function (result) {
|
|
|
- // _that.tAllCount = result.tAllCount || "";
|
|
|
- _that.setTableConfig(result.list || []);
|
|
|
- // _that.setMainRenderData(result);
|
|
|
- })
|
|
|
+ // 处理百分比显示
|
|
|
+ formatter(row, column){
|
|
|
+ return row[column.property]+ "%"
|
|
|
},
|
|
|
- // 表格数据处理
|
|
|
- setTableConfig(data) {
|
|
|
- let _that = this;
|
|
|
- // 按照header的顺序便利出数据
|
|
|
- let renderData = [];
|
|
|
- for (let i = 0, len = data.length; i < len; i++) {
|
|
|
- let item = data[i];
|
|
|
- let rowData = [];
|
|
|
- for (let j = 0; j < _that.tableHeader.length; j++) {
|
|
|
- let headerItem = _that.tableHeader[j];
|
|
|
- if (["overduePercent", "finishPercent"].includes(headerItem.value)) {
|
|
|
- item[headerItem.value] = item[headerItem.value] + "%"
|
|
|
- }
|
|
|
- rowData.push(item[headerItem.value])
|
|
|
- }
|
|
|
- renderData.push(rowData)
|
|
|
+ // 排序改变
|
|
|
+ sortChange({ prop, order }){
|
|
|
+ // 责任单位前端排..
|
|
|
+ if(prop === "targetName"){
|
|
|
+ return
|
|
|
}
|
|
|
- this.tableConfig = {
|
|
|
- rowNum: 15,
|
|
|
- headerHeight: 40,
|
|
|
- header: this.tableHeader.map(function (item) {
|
|
|
- return item.name
|
|
|
- }),
|
|
|
- data: renderData,
|
|
|
- align: 'center',
|
|
|
- oddRowBGC: 'transparent',
|
|
|
- evenRowBGC: 'transparent',
|
|
|
- headerBGC: 'transparent',
|
|
|
- columnWidth: [90, 100, 100, 90, 80, 100, 100, 100, 80],
|
|
|
+ this.objToSort ={
|
|
|
+ gbOrder: prop,
|
|
|
+ gbDesc: order === "ascending" ? "1" : "0"
|
|
|
}
|
|
|
+ this.getCenterData()
|
|
|
},
|
|
|
// 中间区域头部数据
|
|
|
setMainRenderData(data){
|
|
|
@@ -270,7 +262,7 @@
|
|
|
year: _that.defaultYear,
|
|
|
taskTypeId: '0',
|
|
|
orgName: '',
|
|
|
- gbTaskTypeId: '',
|
|
|
+ gbTaskTypeId: _that.defaultTaskType.id,
|
|
|
order: "avgTime",
|
|
|
asc: 1
|
|
|
}
|
|
|
@@ -356,6 +348,41 @@
|
|
|
)
|
|
|
}
|
|
|
this.leftData = renderList
|
|
|
+ },
|
|
|
+ // 初始化事项类型
|
|
|
+ initTaskType(){
|
|
|
+ const _that = this;
|
|
|
+ callAjaxRequest("taskAnalysisWebService", "findTaskTypes", {}, function (result) {
|
|
|
+ result = result || [];
|
|
|
+ _that.taskTypesList.push(...result)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 改变失效类型
|
|
|
+ changeTaskType(e){
|
|
|
+ this.defaultTaskType = e;
|
|
|
+ this.getCenterData()
|
|
|
+ this.getRightData()
|
|
|
+ },
|
|
|
+ // 初始化部门列表
|
|
|
+ initDepList(){
|
|
|
+ const _that = this;
|
|
|
+ let data = {
|
|
|
+ m: 'findOrgSub',
|
|
|
+ systemFlag: true,
|
|
|
+ unitType: 'Department'
|
|
|
+ }
|
|
|
+ TC.util.getAjaxData(TC.config.baseUrl + "/org/department/", data, result => {
|
|
|
+ result.map(item=>{
|
|
|
+ if(item.pId !== "0"){
|
|
|
+ _that.departmentList.push(item)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 切换部门
|
|
|
+ changeDepartment(e){
|
|
|
+ this.defaultDepartment = e;
|
|
|
+ this.getCenterData()
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
@@ -364,6 +391,8 @@
|
|
|
},
|
|
|
created() {
|
|
|
this.initYearsList();
|
|
|
+ this.initTaskType();
|
|
|
+ this.initDepList()
|
|
|
this.changeYear(this.defaultYear)
|
|
|
}
|
|
|
});
|
