Browse Source

fix: 完成水闸监督检查模块

sy-water-data-board-ui
panyuyi 1 year ago
parent
commit
f0eff64ea2
  1. 9
      src/api/sluice/index.js
  2. 300
      src/views/sluice/runManage/supervisionInspetion/questionManage/index.vue
  3. 128
      src/views/sluice/runManage/supervisionInspetion/statisticAnalysis/components/Pie.vue
  4. 644
      src/views/sluice/runManage/supervisionInspetion/statisticAnalysis/index.vue
  5. 40
      src/views/sluice/runManage/supervisionInspetion/tasksManage/tasksDetails.vue

9
src/api/sluice/index.js

@ -367,3 +367,12 @@ export function updateSuperviseEngineeringProblemStatusAndData(data){
data
})
}
// 监督检查-工程问题问题处理和状态修改
export function getSuperviseStatisticTotal(data){
return request({
url: `/run/sz/superviseEngineering/total`,
method: 'post',
data
})
}

300
src/views/sluice/runManage/supervisionInspetion/questionManage/index.vue

@ -7,16 +7,22 @@ import { uploadFileData } from "@/api/system/upload";
import {
getSuperviseEngineeringProblemListData,
updateSuperviseEngineeringProblemStatusAndData,
getSuperviseEngineeringProblemDetailsData,
} from "@/api/sluice";
export default {
name: "projectManage",
data() {
return {
dealDialogVisible: false,
checkDialogVisible: false,
searchTaskName: "",
searchManageName: "",
searchProjectName: "",
currentItem: null,
wagaLocOptions: [],
engScalOptions: [],
wagaTypeOptions: [],
checkDetailData: {},
levelMap: {
0: "无",
1: "一般",
@ -55,13 +61,21 @@ export default {
},
//
handleCheck(row) {
this.$router.push({
path: "supervisionProjectReport",
query: {
type: "preview",
wayId: row.wayId,
id: row.id,
},
this.checkDialogVisible = true;
getSuperviseEngineeringProblemDetailsData(row.id).then((res) => {
this.checkDetailData = res?.data || {};
if (this.checkDetailData.siteSituationRecords) {
this.checkDetailData.siteSituationRecordsArr =
this.checkDetailData.siteSituationRecords.split(",");
}
console.log(
"this.checkDetailData.problemDto?.handleSituationRecords >>>>> ",
this.checkDetailData.problemDto?.handleSituationRecords
);
if (this.checkDetailData.problemDto?.handleSituationRecords) {
this.checkDetailData.problemDto.handleSituationRecordsArr =
this.checkDetailData.problemDto.handleSituationRecords.split(",");
}
});
},
//
@ -86,7 +100,7 @@ export default {
id: this.dealForm.id,
status: "2",
handleRecord: this.dealForm.handleRecord,
handleSituationRecords: this.dealForm.fileList,
handleSituationRecords: this.dealForm.fileList.join(","), //
}).then((res) => {
if (res) {
this.$message({
@ -126,6 +140,39 @@ export default {
? 1
: dayjs(time).diff(dayjs(), "day") - 1;
},
//
wagaLocFormat(wagaLoc) {
let res = "";
let arr = wagaLoc ? JSON.parse(wagaLoc) : [];
arr.forEach((item) => {
res = res + "+" + this.selectDictLabel(this.wagaLocOptions, item);
});
return res.slice(1);
},
//
engScalFormat(engScal) {
return this.selectDictLabel(this.engScalOptions, engScal);
},
//
wagaTypeFormat(wagaType) {
if (!wagaType) return "";
let typeArr = JSON.parse(wagaType);
return this.wagaTypeOptions
.filter((item) => typeArr.includes(item.dictValue))
.map((item) => item.dictLabel)
.join(",");
},
//
problemLevelFormat(level) {
if (!level) return "";
let levelMap = {
0: "无",
1: "一般",
2: "较重",
3: "严重",
};
return levelMap[level];
},
//
getTableData() {
getSuperviseEngineeringProblemListData({
@ -256,6 +303,15 @@ export default {
this.getDicts("embankment_type").then((response) => {
this.dikeTypeList = response.data;
});
this.getDicts("location").then((response) => {
this.wagaLocOptions = response.data;
});
this.getDicts("engineering_scale").then((response) => {
this.engScalOptions = response.data;
});
this.getDicts("sluice_type").then((response) => {
this.wagaTypeOptions = response.data;
});
},
mounted() {
//
@ -368,12 +424,7 @@ export default {
</div>
<!-- 处理弹窗 -->
<el-dialog
title="问题处理"
:visible.sync="dealDialogVisible"
width="50%"
:before-close="handleClose"
>
<el-dialog title="问题处理" :visible.sync="dealDialogVisible" width="680px">
<el-form ref="dealForm" :model="dealForm" label-width="80px">
<el-form-item label="问题描述">
<el-input
@ -385,7 +436,7 @@ export default {
</el-form-item>
<el-form-item label="现场情况">
<div
class="w-100 h-100 mr-12 mb-12"
class="w-120 h-100 mr-12 mb-12"
v-for="(item, index) in dealForm.fileList"
:key="index"
>
@ -427,6 +478,200 @@ export default {
</el-form-item>
</el-form>
</el-dialog>
<!-- 查看弹窗 -->
<el-dialog
title="问题详情"
:visible.sync="checkDialogVisible"
width="860px"
>
<div class="table-container">
<!-- 下发和处理状态内容 -->
<div class="flex">
<div class="flex-1">
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">任务名称</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{ checkDetailData.name }}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">检查时间</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{ checkDetailData.doneTime }}
</div>
<div class="w-120 p-10 border-b-r label-text">天气</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{ checkDetailData.weather }}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">检查人员</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{ checkDetailData.patrolName }}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">管理单位</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{ checkDetailData.engineeringManagementUnit }}
</div>
<div class="w-120 p-10 border-b-r label-text">水闸名称</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{ checkDetailData.wagaName }}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">水闸类型</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{ wagaTypeFormat(checkDetailData.wagaType) }}
</div>
<div class="w-120 p-10 border-b-r label-text">水闸规模</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{ engScalFormat(checkDetailData.engScal) }}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">所在位置</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{ wagaLocFormat(checkDetailData.wagaLoc) }}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">检查项目</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{
checkDetailData.problemDto &&
checkDetailData.problemDto.projectName
}}
</div>
<div class="w-120 p-10 border-b-r label-text">问题等级</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{
problemLevelFormat(
checkDetailData.problemDto &&
checkDetailData.problemDto.level
)
}}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">检查内容</div>
<div class="flex-1 p-10 border-b-r value-text">
{{ checkDetailData.content }}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">问题描述</div>
<div class="flex-1 p-10 border-b-r value-text">
{{ checkDetailData.problemDescribe }}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">现场记录情况</div>
<div class="flex-1 p-10 border-b-r">
<el-image
v-for="item in checkDetailData.siteSituationRecordsArr"
style="width: 200px; min-height: 100px; height: auto"
:src="item"
:preview-src-list="[item]"
></el-image>
</div>
</div>
</div>
<div
class="w-40 flex-shrink-0 border-l-t border-b-r flex justify-center items-center font-12 color-red"
>
下发和处理状态查看内容
</div>
</div>
<!-- 确认状态内容 -->
<div
class="flex"
v-if="
checkDetailData.problemDto &&
['2', '3'].includes(checkDetailData.problemDto.status)
"
>
<div class="flex-1">
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">处理人员</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{
checkDetailData.problemDto &&
checkDetailData.problemDto.handleName
}}
</div>
<div class="w-120 p-10 border-b-r label-text">处理时间</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{
checkDetailData.problemDto &&
checkDetailData.problemDto.handleTime
}}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">处理记录</div>
<div class="flex-1 p-10 border-b-r value-text">
{{
checkDetailData.problemDto &&
checkDetailData.problemDto.handleRecord
}}
</div>
</div>
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">现场处理情况</div>
<div class="flex-1 p-10 border-b-r">
<el-image
v-for="item in checkDetailData.problemDto
.handleSituationRecordsArr"
style="width: 200px; min-height: 100px; height: auto"
:src="item"
:preview-src-list="[item]"
></el-image>
</div>
</div>
</div>
<div
class="w-40 flex-shrink-0 border-l-t border-b-r flex justify-center items-center font-12 color-red"
>
确认状态内容
</div>
</div>
<!-- 完成状态内容 -->
<div
class="flex"
v-if="
checkDetailData.problemDto &&
['3'].includes(checkDetailData.problemDto.status)
"
>
<div class="flex-1">
<div class="flex border-l-t">
<div class="w-120 p-10 border-b-r label-text">复核人员</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{
checkDetailData.problemDto &&
checkDetailData.problemDto.confirmName
}}
</div>
<div class="w-120 p-10 border-b-r label-text">处理时间</div>
<div class="flex-1 p-10 border-b-r text-center value-text">
{{
checkDetailData.problemDto &&
checkDetailData.problemDto.confirmTime
}}
</div>
</div>
</div>
<div
class="w-40 flex-shrink-0 border-l-t border-b-r flex justify-center items-center font-12 color-red"
>
完成状态内容
</div>
</div>
</div>
</el-dialog>
</div>
</template>
@ -472,5 +717,30 @@ export default {
.warning-time {
color: red;
}
.label-text {
color: #999;
}
.value-text {
color: #333;
}
.w-40 {
width: 40px;
}
.w-120 {
width: 120px;
}
.border-l-t {
border-left: 1px solid #f0f0f0;
border-top: 1px solid #f0f0f0;
}
.border-b-r {
border-bottom: 1px solid #f0f0f0;
border-right: 1px solid #f0f0f0;
}
.color-red {
color: red;
}
}
</style>

128
src/views/sluice/runManage/supervisionInspetion/statisticAnalysis/components/Pie.vue

@ -0,0 +1,128 @@
<template>
<div class="pie-component">
<div class="title">{{ title }}</div>
<div ref="pieEle" class="canvas"></div>
</div>
</template>
<script>
import * as echarts from "echarts";
export default {
data() {
return {};
},
props: {
title: {
type: String,
default: "",
},
itemData: {
type: Array,
default: () => [],
},
},
mounted() {
this.barInit();
},
watch: {
itemData(val, oldVal) {
this.barInit();
},
},
methods: {
barInit() {
const colorList = ["#28CE8E", "#165DFF", "#FFAB00", "#F86220"];
let seriesData = this.itemData.map((item, index) => {
return {
name: item.text,
value: item.value,
itemStyle: {
color: colorList[index],
},
};
});
let chartDom = this.$refs.pieEle;
let myChart = echarts.init(chartDom);
let option = {
title: {},
legend: {
// type: "scroll",
orient: "vertical",
left: "60%",
top: 20,
bottom: 20,
data: seriesData,
formatter: function (name) {
return `{a|${name}}\n{b|${
seriesData.find((item) => item.name === name).value
}}`;
},
itemWidth: 4,
itemHeight: 50,
itemGap: 25,
itemStyle: {
borderJoin: "round",
},
textStyle: {
fontSize: 16,
rich: {
a: {
fontSize: 12,
lineHeight: 20,
},
b: {
fontSize: 18,
fontWeight: "bold",
},
},
},
label: {},
},
tooltip: {
trigger: "item",
},
series: [
{
name: "",
type: "pie",
radius: ["50%", "75%"],
center: ["30%", "50%"],
label: {
show: false,
position: "center",
},
emphasis: {
label: {
show: true,
fontSize: 16,
fontWeight: "bold",
},
},
labelLine: {
show: false,
},
data: seriesData,
},
],
};
myChart.setOption(option);
},
},
};
</script>
<style scoped lang="scss">
.pie-component {
border: 1px solid #e5e5e5;
border-radius: 5px;
.title {
padding: 10px;
border-bottom: 1px solid #e5e5e5;
}
.canvas {
width: 500px;
height: 200px;
padding: 10px;
}
}
</style>

644
src/views/sluice/runManage/supervisionInspetion/statisticAnalysis/index.vue

@ -1,363 +1,298 @@
<!-- 监督检查办法管理-堤防 -->
<!-- 监督检查-统计分析 -->
<script>
import {
putDFPreventionControlPlan,
deleteDFMaintenancePlan,
postDFNewPreventionControlPlan,
postDFPreventionControlPlanList,
getDFPreventionControlPlan,
listUser,
} from "@/api/management";
import { listDikeInfo } from "@/api/yg/dikeInfo";
getSuperviseWayTaskListData,
getSuperviseStatisticTotal,
} from "@/api/sluice";
import { getAreasData } from "@/api/areas";
import Pie from "./components/Pie.vue";
const apiMap = {
task: getSuperviseWayTaskListData,
riverLocation: null,
};
export default {
name: "InspectionItems",
components: {
Pie,
},
data() {
return {
paramsData: {
name: "",
type: null,
dikeName: "",
selectLevel: "",
selectType: "",
},
dialogVisible: false,
prohibitEditing: false,
dikeTypeList: [],
personnelList: [], //
patrolType: [], //
workMonth: [], //
embankmentList: [], //
dikeLevel: [], //
controlType: [], //
tableData: [], //
pageData: {
pageNum: 1, //
pageSize: 10, //
pageSizes: [10, 20, 50, 100],
total: 0, //
},
ruleForm: {
dikeCode: "",
dikeName: "",
name: "",
type: "",
instruction: "",
month: "",
details: [],
cycleType: "",
frequency: "",
operators: [],
isReminder: 1,
otherConfig: {
selectUser: [],
week: "",
day: "",
typeSelect: "",
typeOptions: [
{
label: "所属流域",
value: "riverLocation",
},
{
label: "工程类型",
value: "wagaType",
},
reminderTime: "",
{
label: "行政区划",
value: "adcd",
},
{
label: "监督检查任务",
value: "task",
},
],
areasOptionProps: {
emitPath: false,
checkStrictly: true, //
},
rules: {
dikeCode: [
{ required: true, message: "请选择堤防名称", trigger: "blur" },
],
name: [
{ required: true, message: "请输入防治计划名称", trigger: "blur" },
{ max: 100, message: "名称最长为100个字符", trigger: "blur" },
],
type: [
{ required: true, message: "请选择防治类型", trigger: "change" },
],
instruction: [
{ required: true, message: "请输入防治说明", trigger: "change" },
],
month: [
{ required: true, message: "请选择工作月份", trigger: "change" },
],
cycleType: [
{ required: true, message: "请选择提醒日期", trigger: "change" },
],
frequency: [
{ required: true, message: "请输入次数", trigger: "change" },
],
"otherConfig.selectUser": [
{ required: true, message: "请选择责任人", trigger: "change" },
],
"otherConfig.week": [
{ required: true, message: "请选择星期", trigger: "change" },
],
"otherConfig.day": [
{ required: true, message: "请输入", trigger: "change" },
],
reminderTime: [
{ required: true, message: "请选择提醒时间", trigger: "change" },
],
areasOptions: [],
remoteOptions: [],
projectTypeOptions: [], //
paramsData: {
wagaType: "",
adcd: "",
remoteValue: "",
},
questionLevelList: [],
};
},
watch: {
dialogVisible(newVal, oldVal) {
if (oldVal) {
this.prohibitEditing = false;
}
},
},
methods: {
//
resolveDikeGrad(dikeGrad) {
return (
this.dikeLevel.find((v) => v.dictValue === dikeGrad)?.dictLabel ||
dikeGrad
);
},
//
resolveDikeType(dikeType) {
return (
this.dikeTypeList.find((v) => v.dictValue == dikeType)?.dictLabel ||
dikeType
);
},
//
resolveType(type) {
return (
this.controlType.find((v) => v.dictValue == type)?.dictLabel || type
);
},
//
openAddDialog() {
// //
// this.getDicts("xc_w_month").then((res) => {
// this.workMonth = res.data;
// });
// this.getDicts("xs_cycle_type").then((res) => {
// this.patrolType = res.data;
// });
// if (this.ruleForm.details.length <= 0) {
// this.ruleForm.details.push({
// constructionDate: "",
// jobContent: "",
// planDays: 0,
// });
// }
// this.dialogVisible = true;
// setTimeout(() => {
// this.$refs.ruleForm.resetFields();
// }, 0);
},
//
deleteTableItem(row) {
deleteDFMaintenancePlan(row.id).then((res) => {
this.getTableData();
this.$message.success("删除成功");
});
},
//
deleteWorkTableItem(id) {
const index = this.workTable.findIndex((item) => item.id === id);
if (index !== -1) {
this.workTable.splice(index, 1);
}
},
//
searchUser(e) {
listUser({
data: {
timeView: {
timeField: "create_time",
},
},
cv: {
name: "nickName",
type: "like",
value: e,
},
pageSize: 100,
pageNum: 1,
//
initData() {
getSuperviseStatisticTotal({
wagaType:
this.typeSelect == "wagaType" ? this.paramsData.wagaType : null,
adcd: this.typeSelect == "adcd" ? this.paramsData.adcd : null,
taskId: this.typeSelect == "task" ? this.paramsData.remoteValue : null,
}).then((res) => {
this.personnelList = res.records;
});
},
//
viewOrEditPlanDetails(row, edit = false) {
if (!edit) {
this.prohibitEditing = true;
}
getDFPreventionControlPlan(row.id).then((res) => {
this.dialogVisible = true;
setTimeout(() => {
this.ruleForm = res.data;
this.ruleForm.reminderCycle = res.data.instruction + res.data.month;
}, 30);
});
},
changeOtherConfigSelectUser(idsArr) {
if (idsArr?.length) {
this.ruleForm.operators =
this.personnelList
.filter((v) => idsArr.includes(v.nickName))
?.map((v) => ({
name: v.nickName,
uid: v.id,
})) || [];
} else {
this.ruleForm.operators = [];
}
},
//
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.ruleForm.cycleType = parseFloat(this.ruleForm.cycleType);
this.ruleForm.frequency = parseFloat(this.ruleForm.frequency);
this.ruleForm.month = parseFloat(this.ruleForm.month);
if (this.ruleForm.id) {
putDFPreventionControlPlan(this.ruleForm).then(() => {
this.getTableData();
this.dialogVisible = false;
this.$message({
message: "保存成功",
type: "success",
});
});
} else {
postDFNewPreventionControlPlan(this.ruleForm).then(() => {
console.log("保存成功");
this.getTableData();
this.dialogVisible = false;
this.$message({
message: "保存成功",
type: "success",
});
});
}
} else {
console.log("校验不通过");
return false;
let list = [
{
text: "问题总数",
key: "problemTotal",
value: 0,
},
{
text: "一般问题",
key: "same",
value: 0,
},
{
text: "较重问题",
key: "heavy",
value: 0,
},
{
text: "严重问题",
key: "serious",
value: 0,
},
{
text: "特别严重问题",
key: "superSerious",
value: 0,
},
{
text: "问题处置",
key: "problemDispose",
value: 0,
},
{
text: "下发",
key: "distributeCount",
value: 0,
},
{
text: "处置",
key: "handleCount",
value: 0,
},
{
text: "确认",
key: "confirmCount",
value: 0,
},
{
text: "完成",
key: "finishCount",
value: 0,
},
];
if (res?.data) {
list.forEach((item) => {
item.value = res.data[item.key] || 0;
});
}
this.questionLevelList = list;
});
},
//
resetForm(formName) {
this.$refs[formName].resetFields();
this.dialogVisible = false;
},
// dialog
handleClose(ruleForm = "ruleForm") {
console.log("关闭");
this.$refs[ruleForm].resetFields();
this.ruleForm = {
dikeCode: "",
dikeName: "",
name: "",
type: "",
instruction: "",
month: "",
details: [],
cycleType: "",
isReminder: true,
selectUser: [],
otherConfig: {
selectUser: [],
week: "",
day: "",
},
week: 1,
date: 1,
reminderTime: "",
handleChangeType() {
this.remoteOptions = [];
this.paramsData = {
wagaType: "",
adcd: "",
remoteValue: "",
};
},
//
addWorkItem() {
this.ruleForm.details.push({
jobContent: "",
constructionDate: "",
planDays: "",
});
handleChangeQuery() {
this.initData();
},
//
getTableData() {
postDFPreventionControlPlanList({
//
handleGetRemoteProjectListData(query) {
if (!apiMap[this.typeSelect]) return;
apiMap[this.typeSelect]({
data: {
timeView: {
timeField: "create_time",
},
name: this.paramsData.name,
type: this.paramsData.type,
dikeName: this.paramsData.dikeName,
dikeGrad: this.paramsData.dikeGrad,
dikeType: this.paramsData.dikeType,
},
cv: {
name: "name",
type: "like",
value: this.name,
},
params: {
orderBy: "create_time",
sort: "desc",
name: query,
},
pageSize: this.pageData.pageSize,
pageNum: this.pageData.pageNum,
pageSize: 20,
pageNum: 1,
}).then((res) => {
if (res) {
this.tableData = res.records;
this.pageData.total = res.total;
this.remoteOptions = res.records.map((item) => {
return {
label: item.name,
value: item.id,
};
});
}
});
},
//
resetSearch() {
this.name = "";
this.selectStatus = "2";
this.getTableData();
},
//
handleOpenMap() {},
//
handleOpenDetail() {},
//
getEmbData() {
listDikeInfo({
pageNum: 1,
pageSize: 20,
ids: null,
data: {
embankmentName: null,
endStationNumber: null,
embankmentType: null,
},
//
params: {
//
orderBy: "create_time",
// descasc
sort: "desc",
},
}).then((res) => {
this.embankmentList = res?.records || [];
//
getTreeData() {
getAreasData().then((items) => {
let res = [];
let getChildren = (res, pid) => {
for (const i of items.data) {
if (i.parentid === pid) {
const newItem = {
label: i.name,
value: i.id,
};
if (i.layer != 3) newItem.children = [];
res.push(newItem);
getChildren(newItem.children, newItem.value);
}
}
};
getChildren(res, items.data[0].parentid);
this.areasOptions = res;
});
},
handleChangeDike(value) {
console.log("value >>>>> ", value);
this.ruleForm.name = this.ruleForm.dikeCode;
let res = this.embankmentList.find((v) => v.dikeCode === value);
console.log("res >>>>> ", res);
this.ruleForm.dikeName = res?.dikeName;
// this.dikeDetailsDialog.id = res?.id || ''
//
resetSearch() {
this.typeSelect = "";
this.paramsData = {
wagaType: "",
adcd: "",
remoteValue: "",
};
this.initData();
},
},
created() {
this.getDicts("embankment_type").then((response) => {
this.dikeTypeList = response.data;
//
this.getDicts("sluice_type").then((response) => {
this.projectTypeOptions = response.data;
});
},
mounted() {},
mounted() {
this.getTreeData();
this.initData();
},
};
</script>
<template>
<div class="body slider-right">
<div class="top-title">统计分析</div>
<div class="table-box"></div>
<div class="table-box">
<div class="flex justify-between items-center">
<div class="title">监督检查任务统计分析</div>
<div class="select-box flex">
<el-select
class="statistic-analysis-select-style bg-inner"
v-model="typeSelect"
style="width: 128px"
size="mini"
@click="handleChangeType"
placeholder="请选择类型"
>
<el-option label="全部" value=""> </el-option>
<el-option
v-for="item in typeOptions"
:key="item.value"
class="font-12"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<!-- 工程类型 -->
<el-select
size="mini"
class="statistic-analysis-select-style"
v-model="paramsData.wagaType"
v-if="typeSelect === 'wagaType'"
filterable
@change="handleChangeQuery"
placeholder="请选择"
>
<el-option label="全部" value=""> </el-option>
<el-option
v-for="item in projectTypeOptions"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option>
</el-select>
<el-cascader
size="mini"
v-else-if="typeSelect === 'adcd'"
class="statistic-analysis-select-style"
:options="areasOptions"
v-model="paramsData.adcd"
:props="areasOptionProps"
placeholder="请选择行政区划"
clearable
@change="handleChangeQuery"
>
</el-cascader>
<el-select
v-else
size="mini"
class="statistic-analysis-select-style"
v-model="paramsData.remoteValue"
filterable
link
remote
placeholder="请输入关键词"
:remote-method="handleGetRemoteProjectListData"
@focus="handleGetRemoteProjectListData('')"
@change="handleChangeQuery"
>
<el-option label="全部" value=""> </el-option>
<el-option
v-for="item in remoteOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
</div>
<!-- 问题列表 -->
<div class="question-box" v-if="questionLevelList.length">
<Pie
title="问题统计"
:itemData="questionLevelList.slice(1, 5)"
ref="pieRef1"
></Pie>
<Pie
ref="pieRef2"
title="处理统计"
class="ml-20"
:itemData="questionLevelList.slice(6, 10)"
></Pie>
</div>
</div>
</div>
</template>
@ -366,7 +301,6 @@ export default {
width: 100%;
min-height: calc(100vh - 56px);
padding-left: 24px;
.top-title {
height: 40px;
background-color: white;
@ -382,40 +316,52 @@ export default {
margin-top: 24px;
padding: 16px;
background-color: white;
.top-search {
margin-bottom: 8px;
.search-input {
width: 202px;
margin-right: 10px;
.title {
padding-left: 20px;
position: relative;
&::before {
position: absolute;
left: 0;
top: 0;
content: "";
width: 4px;
height: 16px;
background-color: #1890ff;
}
}
.table {
height: calc(680px - 34px);
.select-box {
border: 1px solid #d9d9d9;
border-radius: 4px;
padding: 8px;
}
}
.search-btn {
margin-left: 10px;
background-color: #37b29e;
border: none;
&:hover {
background-color: #5ac6b9;
.question-box {
display: flex;
flex-wrap: wrap;
padding-top: 24px;
}
&:active {
background-color: #2b8070;
.question-item {
width: 250px;
height: 102px;
border-radius: 8px;
border: 1px solid #000;
padding: 10px;
margin-right: 10px;
margin-bottom: 12px;
}
}
}
/deep/.el-input__count {
height: 15px;
line-height: 15px;
margin-right: 10px;
margin-bottom: -4px;
</style>
<style lang="less">
.statistic-analysis-select-style {
border: none !important;
.el-input__inner {
border: none !important;
}
}
.statistic-analysis-select-style.bg-inner {
.el-input__inner {
background-color: #f6f6f6;
border-radius: 4px;
}
}
</style>

40
src/views/sluice/runManage/supervisionInspetion/tasksManage/tasksDetails.vue

@ -38,8 +38,8 @@ export default {
name: "",
wagaCode: "",
wagaName: "",
patrolName: "",
patrolUid: "",
inspectorsName: "",
inspectors: "",
startTime: "",
doneTime: "",
content: "",
@ -61,13 +61,13 @@ export default {
},
computed: {
//
computedPatrolId: {
computedInspectorsId: {
get() {
return this.ruleForm.patrolUid?.split(",")?.filter((v) => !!v) || [];
return this.ruleForm.inspectors?.split(",")?.filter((v) => !!v) || [];
},
set(val) {
this.ruleForm.patrolUid = val.join(",");
this.ruleForm.patrolName = this.personnelList
this.ruleForm.inspectors = val.join(",");
this.ruleForm.inspectorsName = this.personnelList
.filter((v) => val.includes(v.id))
.map((v) => v.nickName)
.join(",");
@ -110,12 +110,22 @@ export default {
},
},
methods: {
//
getTableData(wayId) {
getEnableSuperviseWayData({ wayId: wayId }).then((res) => {
if (res) {
this.ruleForm.wayId = res.data?.id;
this.enableSupervisionWayData = res.data?.itemList || [];
}
});
},
//
getDetails() {
getSuperviseWayTaskDetailsData(this.$route.query.id).then((res) => {
if (res) {
this.ruleForm = res.data;
this.ruleForm.wayId = res.data?.wayId;
this.getTableData(res.data?.wayId);
}
});
},
@ -170,15 +180,7 @@ export default {
reminderTime: "",
};
},
//
getTableData() {
getEnableSuperviseWayData().then((res) => {
if (res) {
this.ruleForm.wayId = res.data?.id;
this.enableSupervisionWayData = res.data?.itemList || [];
}
});
},
//
getProjectList() {
getRunProjectList({
@ -254,10 +256,10 @@ export default {
this.searchUser();
},
mounted() {
//
this.getTableData();
if (this.$route.query.id) {
this.getDetails();
} else {
this.getTableData();
}
},
};
@ -340,10 +342,10 @@ export default {
:disabled="true"
/>
</el-form-item>
<el-form-item label-width="120px" label="检查人员" prop="patrolUid">
<el-form-item label-width="120px" label="检查人员" prop="inspectors">
<el-select
style="width: 240px"
v-model="computedPatrolId"
v-model="computedInspectorsId"
multiple
filterable
remote

Loading…
Cancel
Save