|
|
@@ -68,11 +68,16 @@
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
|
|
|
- <el-form-item label="任务类型" prop="taskTypes">
|
|
|
+ <!-- <el-form-item label="任务类型" prop="taskTypes">
|
|
|
<el-select v-model="filters.taskTypes" placeholder="请选择任务类型" multiple collapse-tags style="width: 180px">
|
|
|
<el-option v-for="item in taskTypeOptions" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
</el-select>
|
|
|
- </el-form-item>
|
|
|
+ </el-form-item> -->
|
|
|
+ <el-form-item label="任务类型" prop="typeName">
|
|
|
+ <el-select v-model="filters.typeName" placeholder="请选择任务类型" clearable>
|
|
|
+ <el-option v-for="dict in dict.type.task_type" :key="dict.value" :label="dict.label" :value="dict.value" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
|
|
|
<el-form-item label="执行人" prop="executors">
|
|
|
<el-select v-model="filters.executors" placeholder="请选择执行人" multiple collapse-tags style="width: 180px">
|
|
|
@@ -80,11 +85,16 @@
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
|
|
|
- <el-form-item label="状态" prop="statuses">
|
|
|
+ <!-- <el-form-item label="状态" prop="statuses">
|
|
|
<el-select v-model="filters.statuses" placeholder="请选择状态" multiple collapse-tags style="width: 180px">
|
|
|
<el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
</el-select>
|
|
|
- </el-form-item>
|
|
|
+ </el-form-item> -->
|
|
|
+ <el-form-item label="任务状态" prop="taskStatus">
|
|
|
+ <el-select v-model="filters.taskStatus" placeholder="请选择任务状态" clearable>
|
|
|
+ <el-option v-for="dict in dict.type.task_status" :key="dict.value" :label="dict.label" :value="dict.value" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
|
|
|
<el-form-item>
|
|
|
<div class="action-buttons">
|
|
|
@@ -102,7 +112,7 @@
|
|
|
<!-- KPI 卡片区域 -->
|
|
|
<div class="kpi-section stats-card">
|
|
|
<div class="kpi-grid">
|
|
|
- <div v-for="(kpi, index) in kpiData" :key="index" class="kpi-card" @click="handleKpiClick(kpi.key)">
|
|
|
+ <div v-for="(kpi, index) in kpiData" :key="index" class="kpi-card" >
|
|
|
<div class="kpi-card__icon" :style="{ backgroundColor: kpi.iconBg }">
|
|
|
<i :class="kpi.icon" :style="{ color: kpi.color }"></i>
|
|
|
</div>
|
|
|
@@ -117,7 +127,7 @@
|
|
|
<span v-if="kpi.unit" class="kpi-unit">{{ kpi.unit }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <el-dropdown trigger="click" @command="handleKpiAction" class="kpi-card__menu">
|
|
|
+ <!-- <el-dropdown trigger="click" @command="handleKpiAction" class="kpi-card__menu">
|
|
|
<span class="kpi-menu-trigger">
|
|
|
<i class="el-icon-more"></i>
|
|
|
</span>
|
|
|
@@ -129,7 +139,7 @@
|
|
|
<i class="el-icon-view"></i> 查看明细
|
|
|
</el-dropdown-item>
|
|
|
</el-dropdown-menu>
|
|
|
- </el-dropdown>
|
|
|
+ </el-dropdown> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -365,6 +375,7 @@ import seedrandom from 'seedrandom'
|
|
|
import CountTo from 'vue-count-to'
|
|
|
import { deptTreeSelect } from "@/api/system/user";
|
|
|
import { listFieldName } from "@/api/base/field"
|
|
|
+import { listTasksStatistics} from "@/api/base/tasks"
|
|
|
import Treeselect from "@riophae/vue-treeselect";
|
|
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
|
|
|
|
|
@@ -374,6 +385,7 @@ export default {
|
|
|
CountTo,
|
|
|
Treeselect
|
|
|
},
|
|
|
+ dicts: ['task_type', 'task_status', 'field_soil_type', 'sys_field_type'],
|
|
|
data() {
|
|
|
return {
|
|
|
// 部门树选项
|
|
|
@@ -427,9 +439,9 @@ export default {
|
|
|
farms: [],
|
|
|
plots: [],
|
|
|
crops: [],
|
|
|
- taskTypes: [],
|
|
|
+ typeName: [],
|
|
|
executors: [],
|
|
|
- statuses: []
|
|
|
+ taskStatus: []
|
|
|
},
|
|
|
|
|
|
// 下拉选项
|
|
|
@@ -525,6 +537,13 @@ export default {
|
|
|
this.getDeptTree();
|
|
|
this.getFieldNameList();
|
|
|
// this.initOptions()
|
|
|
+ /* const queryParams = {
|
|
|
+
|
|
|
+ }
|
|
|
+ listTasksStatistics(queryParams).then(response => {
|
|
|
+ console.log(response)
|
|
|
+ console.log(response.data)
|
|
|
+ }) */
|
|
|
},
|
|
|
|
|
|
mounted() {
|
|
|
@@ -603,9 +622,9 @@ export default {
|
|
|
// 加载所有数据
|
|
|
loadAllData() {
|
|
|
this.loadKpiData()
|
|
|
- this.loadTrendData()
|
|
|
- this.loadDimensionData()
|
|
|
- this.loadTodoData()
|
|
|
+ this.loadTrendData() // 加载趋势数据
|
|
|
+ this.loadDimensionData() // 加载维度对比数据
|
|
|
+ this.loadTodoData() // 加载待办数据
|
|
|
},
|
|
|
|
|
|
// 初始化图表
|
|
|
@@ -639,6 +658,7 @@ export default {
|
|
|
this.formatDate(start),
|
|
|
this.formatDate(end)
|
|
|
]
|
|
|
+ console.log(this.filters.dateRange);
|
|
|
this.loadAllData()
|
|
|
},
|
|
|
|
|
|
@@ -701,8 +721,87 @@ export default {
|
|
|
|
|
|
// 加载KPI数据
|
|
|
loadKpiData() {
|
|
|
- const kpi = this.mockKpi(this.filters)
|
|
|
- this.kpiData = [
|
|
|
+ console.log(this.filters)
|
|
|
+ /* const kpi = this.mockKpi(this.filters) */
|
|
|
+ this.filters.params = {}
|
|
|
+ if (null != this.filters.dateRange && '' != this.filters.dateRange) {
|
|
|
+ this.filters.params["beginCreateTime"] = this.filters.dateRange[0];
|
|
|
+ this.filters.params["endCreateTime"] = this.filters.dateRange[1];
|
|
|
+ }
|
|
|
+ listTasksStatistics(this.filters).then(response => {
|
|
|
+ console.log("加载KPI数据")
|
|
|
+ console.log(response)
|
|
|
+ console.log(response.data)
|
|
|
+ const kpi = response.data
|
|
|
+
|
|
|
+ this.kpiData = [
|
|
|
+ {
|
|
|
+ title: '任务总数',
|
|
|
+ value: kpi.taskCount,
|
|
|
+ type: 'number',
|
|
|
+ color: '#1F2937',
|
|
|
+ key: 'total',
|
|
|
+ icon: 'el-icon-s-data',
|
|
|
+ iconBg: 'rgba(74, 144, 226, 0.12)'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '已完成',
|
|
|
+ value: kpi.completedCount,
|
|
|
+ type: 'number',
|
|
|
+ color: '#3BB44A',
|
|
|
+ key: 'completed',
|
|
|
+ icon: 'el-icon-circle-check',
|
|
|
+ iconBg: 'rgba(59, 180, 74, 0.12)'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '待完成',
|
|
|
+ value: kpi.pendingCount,
|
|
|
+ type: 'number',
|
|
|
+ color: '#3BB44A',
|
|
|
+ key: 'completion_rate',
|
|
|
+ icon: 'el-icon-pie-chart',
|
|
|
+ iconBg: 'rgba(59, 180, 74, 0.12)'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '逾期数',
|
|
|
+ value: kpi.overdueCount,
|
|
|
+ type: 'number',
|
|
|
+ color: '#4A90E2',
|
|
|
+ key: 'ontime_rate',
|
|
|
+ icon: 'el-icon-timer',
|
|
|
+ iconBg: 'rgba(74, 144, 226, 0.12)'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '完成率',
|
|
|
+ value: kpi.completionRate * 100,
|
|
|
+ type: 'percent',
|
|
|
+ color: '#20B2AA',
|
|
|
+ key: 'avg_duration',
|
|
|
+ icon: 'el-icon-stopwatch',
|
|
|
+ iconBg: 'rgba(32, 178, 170, 0.12)',
|
|
|
+ unit: kpi.durationUnit
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '准时率',
|
|
|
+ value: kpi.onTimeRate * 100,
|
|
|
+ type: 'percent',
|
|
|
+ color: '#E85D75',
|
|
|
+ key: 'overdue',
|
|
|
+ icon: 'el-icon-warning',
|
|
|
+ iconBg: 'rgba(232, 93, 117, 0.12)'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '平均完成时长',
|
|
|
+ value: kpi.avgCompletionDuration,
|
|
|
+ type: 'number',
|
|
|
+ color: '#4A90E2',
|
|
|
+ key: 'in_progress',
|
|
|
+ icon: 'el-icon-loading',
|
|
|
+ iconBg: 'rgba(74, 144, 226, 0.12)'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ })
|
|
|
+ /* this.kpiData = [
|
|
|
{
|
|
|
title: '任务总数',
|
|
|
value: kpi.total,
|
|
|
@@ -776,19 +875,15 @@ export default {
|
|
|
icon: 'el-icon-time',
|
|
|
iconBg: 'rgba(139, 148, 158, 0.12)'
|
|
|
}
|
|
|
- ]
|
|
|
+ ] */
|
|
|
+
|
|
|
},
|
|
|
|
|
|
// 加载趋势数据
|
|
|
loadTrendData() {
|
|
|
this.trendLoading = true
|
|
|
setTimeout(() => {
|
|
|
- console.log("进入mockTrend的条件")
|
|
|
- console.log(this.filters)
|
|
|
- console.log(this.trendMetric)
|
|
|
const data = this.mockTrend(this.filters, this.trendMetric)
|
|
|
- console.log("loadTrendData加载趋势数据")
|
|
|
- console.log(data)
|
|
|
this.updateTrendChart(data)
|
|
|
this.trendLoading = false
|
|
|
}, 500)
|
