From aa261c7327d2c939e58446039d6785d3aa3fc0e0 Mon Sep 17 00:00:00 2001 From: 马宇豪 <978517621@qq.com> Date: 星期三, 01 三月 2023 11:14:18 +0800 Subject: [PATCH] 加备加页面 --- src/views/intellectInspect/inspectIndex2/components/sum.vue | 131 +++++ src/router/route.ts | 26 src/views/intellectInspect/intelligentLine/index.vue | 2 src/views/intellectInspect/inspectTaskManage/inspectTask/components/inspectTaskDialog.vue | 3 src/views/intellectInspect/inspectIndex2/components/inspectRecordDialog.vue | 593 +++++++++++++++++++++++++ src/views/intellectInspect/inspectRecordManage/inspectRecord/components/inspectRecordDialog.vue | 5 src/views/intellectInspect/inspectIndex2/index.vue | 587 +++++++++++++++++++++++++ src/views/intellectInspect/inspectIndex/components/inspectRecordDialog.vue | 5 src/views/intellectInspect/inspectRecordManage/inspectRecord/index.vue | 3 9 files changed, 1,339 insertions(+), 16 deletions(-) diff --git a/src/router/route.ts b/src/router/route.ts index afa1cda..4aac40f 100644 --- a/src/router/route.ts +++ b/src/router/route.ts @@ -97,19 +97,27 @@ } }, { - path: '/screenPage', - name: 'screenPage', - component: () => import('/@/views/riskWarningSys/warningBigScreen/indexs/index.vue'), - meta: { - title: '预警预报' - } - }, - { path: '/securities', name: 'securities', component: () => import('/@/views/facilityManagement/securities/index.vue'), meta: { title: '安全物资与设备' } - } + }, + { + path: '/specialIndex', + name: 'specialIndex', + component: () => import('/@/views/specialWorkSystem/specialIndex/index.vue'), + meta: { + title: '特殊作业首页' + } + }, + { + path: '/inspectIndex', + name: 'inspectIndex2', + component: () => import('/@/views/intellectInspect/inspectIndex2/index.vue'), + meta: { + title: '巡检首页' + } + }, ]; diff --git a/src/views/intellectInspect/inspectIndex/components/inspectRecordDialog.vue b/src/views/intellectInspect/inspectIndex/components/inspectRecordDialog.vue index 02fdd0a..e056931 100644 --- a/src/views/intellectInspect/inspectIndex/components/inspectRecordDialog.vue +++ b/src/views/intellectInspect/inspectIndex/components/inspectRecordDialog.vue @@ -59,7 +59,7 @@ <el-table-column prop="reportResult" label="结果" show-overflow-tooltip align="center"> <template #default="scope"> <div :style="{ color: scope.row.reportResult == 1 ? '#ff0000' : '#409eff' }"> - {{ scope.row.reportResult == 0 ? '正常' : scope.row.reportResult == 1 ? '存在异常' : '无' }} + {{ scope.row.reportResult == 0 ? '正常' : scope.row.reportResult == 1 ? '存在异常' : scope.row.reportResult == 2 ? '备' : '无' }} </div> </template> </el-table-column> @@ -223,7 +223,8 @@ ], firstReferenceValueList: [ { id: 0, name: '正常' }, - { id: 1, name: '存在异常' } + { id: 1, name: '存在异常' }, + { id: 2, name: '备' } ], secondReferenceSignList: [ { id: 1, name: '>' }, diff --git a/src/views/intellectInspect/inspectIndex2/components/inspectRecordDialog.vue b/src/views/intellectInspect/inspectIndex2/components/inspectRecordDialog.vue new file mode 100644 index 0000000..e056931 --- /dev/null +++ b/src/views/intellectInspect/inspectIndex2/components/inspectRecordDialog.vue @@ -0,0 +1,593 @@ +<template> + <div class="system-add-menu-container"> + <el-dialog v-model="ifShowInspectTaskDialog" :title="title" width="60%"> + <el-form :model="inspectTaskForm" label-width="120px" ref="inspectTaskFormRef"> + <el-row> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="任务名称" prop="unitName"> + <el-input v-model="inspectTaskForm.taskName" :disabled="!inspectPointConfirm" class="input-add" placeholder="请填写任务名称"> </el-input> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="任务类型" prop="taskType"> + <el-select v-model="inspectTaskForm.taskType" :disabled="!inspectPointConfirm" class="input-add" placeholder="请选择任务类型"> + <el-option v-for="item in workTypeList" :key="item.id" :value="item.id" :label="item.name"></el-option> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="巡检部门" prop="execDepId"> + <el-cascader @change="giveClassGroup" :disabled="!inspectPointConfirm" :options="departmentList" :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" clearable filterable class="input-add" v-model="inspectTaskForm.execDepId"> </el-cascader> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="巡检班组" prop="execClassgroupId"> + <el-select v-model="inspectTaskForm.execClassgroupId" :disabled="!inspectPointConfirm" class="input-add"> + <el-option v-for="item in classGroup" :key="item.id" :value="item.id" :label="item.groupName"></el-option> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="巡检人" prop="execUserName"> + <el-input v-model="inspectTaskForm.execUserName" :disabled="!inspectPointConfirm" class="input-add"> </el-input> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="任务开始时间" prop="startTime"> + <el-date-picker v-model="inspectTaskForm.startTime" :disabled="!inspectPointConfirm" placeholder="请选择任务开始时间" type="datetime" format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" class="input-add" /> + </el-form-item> + </el-col> + </el-row> + + <div class="checkUnit-point"> + <el-tabs class="active" v-model="activeName"> + <el-tab-pane label="巡检链" name="inspectChain"> + <el-table :data="inspectTaskForm.points" fit style="width: 100%"> + <el-table-column type="index" label="序号" /> + <el-table-column prop="point" label="巡检点" show-overflow-tooltip align="center"></el-table-column> + <el-table-column prop="region" label="所属设备" show-overflow-tooltip align="center"></el-table-column> + <el-table-column prop="rfid" label="RFID" show-overflow-tooltip align="center"></el-table-column> + <el-table-column prop="quotaContent" label="指标作业" show-overflow-tooltip align="center"></el-table-column> + <el-table-column prop="secondReferenceResult" label="记录值" show-overflow-tooltip align="center"> + <template #default="scope"> + <div :style="{ color: scope.row.reportResult == 1 ? '#ff0000' : '#409eff' }"> + {{ scope.row.dataReportType == 1 ? '无' : scope.row.secondReferenceResult }} + </div> + </template> + </el-table-column> + <el-table-column prop="quotaUnit" label="指标单位" show-overflow-tooltip align="center"></el-table-column> + <el-table-column prop="reportResult" label="结果" show-overflow-tooltip align="center"> + <template #default="scope"> + <div :style="{ color: scope.row.reportResult == 1 ? '#ff0000' : '#409eff' }"> + {{ scope.row.reportResult == 0 ? '正常' : scope.row.reportResult == 1 ? '存在异常' : scope.row.reportResult == 2 ? '备' : '无' }} + </div> + </template> + </el-table-column> + <!-- <el-table-column label="操作" width="150" align="center">--> + <!-- <template #default="scope">--> + <!-- <el-button size="small" text type="danger" @click="onDelCheckUnit(scope.$index, scope.row)">删除</el-button>--> + <!-- </template>--> + <!-- </el-table-column>--> + </el-table> + </el-tab-pane> + <el-tab-pane label="统计数据" name="allData"> + <sum-data :sumData="taskAndQuotas"></sum-data> + </el-tab-pane> + </el-tabs> + </div> + <div align="right" v-show="inspectPointConfirm"> + <el-button type="warning" @click="inspectPointDialog = false" size="default" plain>取消</el-button> + <el-button type="primary" @click="submitInspectTask()" size="default">确认</el-button> + </div> + </el-form> + </el-dialog> + </div> +</template> + +<script lang="ts"> +import { toRefs, reactive, defineComponent, ref, onMounted, defineAsyncComponent } from 'vue'; +import { RFIDApi } from '/@/api/intellectInspectSystem/RFID'; +import { ElMessage } from 'element-plus/es'; +import { inspectTaskApi } from '/@/api/intellectInspectSystem/inspectTask'; +import { facilityAreaApi } from '/@/api/intellectInspectSystem/facilityAreaManage'; +import { inspectRecordApi } from '/@/api/intellectInspectSystem/inspectRecord'; +interface dataState { + title: string; + taskAndQuotas: []; + pointTitle: string; + activeName: string; + inspectPointConfirm: boolean; + inspectPointDialog: boolean; + ifShowInspectTaskDialog: boolean; + inspectPointForm: inspectPointForm; + inspectTaskForm: { + execClassgroupId: number | null; + execDepId: number | null; + id: number | null; + execUserName: string; + startTime: string | null; + taskName: string | null; + taskType: number | null; + validTime: string | null; + points: Array<inspectPointForm>; + }; + workTypeList: []; + departmentList: []; + timeList: []; + dataReportTypeList: Array<dataReport>; + firstReferenceValueList: Array<dataReport>; + secondReferenceSignList: Array<dataReport>; + thirdReferenceSignList: Array<dataReport>; + classGroupList: Array<classGroup>; + classGroup: Array<classGroup>; + quotaList: Array<quota>; + inspectPointAllList: Array<inspectPointAllState>; +} +interface inspectPointAllState { + id: number; + code: string; + regionId: number; + rfidId: number; +} +interface classGroup { + depId: number; +} +interface dataReport { + id: number; + name: string; +} +interface quota { + id: number; + type: string; + unit: string; +} +interface inspectPointForm { + id: number | null; + unitId: number | null; + unitUuid: string | null; + pointId: number | null; + pointUuid: string | null; + regionId: number | null; + regionUuid: string | null; + rfidId: number | null; + quotaId: number | null; + quotaUnit: string | null; + reportResult: number | null; + secondReferenceResult: number | null; + execSequence: number | null; + dataReportType: number | null; + firstReferenceValue: number | null; + secondReferenceSign: number | null; + secondReferenceValue: number | null; + thirdReferenceSign: number | null; + thirdReferenceValue: number | null; +} +export default defineComponent({ + name: 'inspectTaskDialog', + components: { + SumData: defineAsyncComponent(() => import('/@/views/intellectInspect/inspectIndex/components/sum.vue')) + }, + setup(props: any, context: any) { + const inspectTaskFormRef = ref(); + const data = reactive<dataState>({ + title: '', + taskAndQuotas: [], + pointTitle: '', + activeName: 'inspectChain', + inspectPointConfirm: false, + inspectPointDialog: false, + ifShowInspectTaskDialog: false, + inspectPointForm: { + id: null, + unitId: null, + unitUuid: null, + pointId: null, + pointUuid: null, + regionId: null, + regionUuid: null, + rfidId: null, + quotaId: null, + quotaUnit: null, + execSequence: null, + secondReferenceResult: null, + reportResult: null, + dataReportType: null, + firstReferenceValue: null, + secondReferenceSign: null, + secondReferenceValue: null, + thirdReferenceSign: null, + thirdReferenceValue: null + }, + inspectTaskForm: { + execClassgroupId: null, + execDepId: null, + id: null, + points: [], + execUserName: '', + startTime: null, + taskName: null, + taskType: null, + validTime: null + }, + workTypeList: [], + departmentList: [], + timeList: [], + classGroupList: [], + classGroup: [], + quotaList: [], + inspectPointAllList: [], + dataReportTypeList: [ + { id: 1, name: '选择' }, + { id: 2, name: '填空' }, + { id: 3, name: '选择并填空' } + ], + firstReferenceValueList: [ + { id: 0, name: '正常' }, + { id: 1, name: '存在异常' }, + { id: 2, name: '备' } + ], + secondReferenceSignList: [ + { id: 1, name: '>' }, + { id: 2, name: '>=' } + ], + thirdReferenceSignList: [ + { id: 3, name: '<' }, + { id: 4, name: '<=' } + ] + }); + + const openInspectPointDialog = (type: string, item: {}) => { + data.inspectPointDialog = true; + if (type === '新增') { + data.pointTitle = '新增巡检点'; + data.inspectPointForm = { + id: null, + unitId: null, + unitUuid: null, + pointId: null, + pointUuid: null, + regionId: null, + regionUuid: null, + rfidId: null, + quotaId: null, + quotaUnit: null, + reportResult: null, + execSequence: null, + secondReferenceResult: null, + dataReportType: null, + firstReferenceValue: null, + secondReferenceSign: null, + secondReferenceValue: null, + thirdReferenceSign: null, + thirdReferenceValue: null + }; + } else { + data.pointTitle = '修改巡检点'; + data.inspectPointForm = JSON.parse(JSON.stringify(item)); + } + }; + + const showInspectRecordDialog = (type: string, item: { id: number; uuid: string; execUserName: string }, workTypeList: [], department: [], timeType: [], classGroupList: [], quotaList: [], inspectPointAllList: []) => { + data.quotaList = JSON.parse(JSON.stringify(quotaList)); + data.timeList = JSON.parse(JSON.stringify(timeType)); + data.inspectPointAllList = JSON.parse(JSON.stringify(inspectPointAllList)); + data.workTypeList = JSON.parse(JSON.stringify(workTypeList)); + data.departmentList = JSON.parse(JSON.stringify(department)); + data.classGroupList = JSON.parse(JSON.stringify(classGroupList)); + data.ifShowInspectTaskDialog = true; + data.inspectPointConfirm = false; + data.title = '查看巡检记录'; + getSum(item.id); + inspectRecordApi() + .getInspectRecordById({ id: item.id, uuid: item.uuid }) + .then((res) => { + if (res.data.code === '200') { + data.inspectTaskForm.execDepId = res.data.data.execDepId; + giveClassGroup(); + data.inspectTaskForm = JSON.parse(JSON.stringify(res.data.data)); + data.inspectTaskForm.execUserName = item.execUserName; + } else { + } + }) + .catch((error) => {}); + }; + + // 格式化表格数据 + // const toRefer =(row, column, cellValue, index)=>{ + // return row.secondReferenceResult==0?'正常':(row.reportResult==1?'异常':'无') + // } + + const getSum = async (id: number) => { + let res = await inspectRecordApi().getInspectRecordSum({ id: id }); + if (res.data.code === '200') { + data.taskAndQuotas = JSON.parse(JSON.stringify(res.data.data.taskAndQuotas)); + console.log(data.taskAndQuotas, '666666666666'); + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }; + + const submitInspectPoint = async () => { + if (data.title === '新增巡检任务' && data.pointTitle === '新增巡检点') { + if (data.inspectTaskForm.points.length === 0) { + data.inspectPointForm.execSequence = 1; + } else { + data.inspectPointForm.execSequence = (data.inspectTaskForm.points[data.inspectTaskForm.points.length - 1].execSequence as number) + 1; + } + data.inspectTaskForm.points.push(data.inspectPointForm); + data.inspectPointDialog = false; + } else if (data.title === '新增巡检任务' && data.pointTitle === '修改巡检点') { + let result = data.inspectTaskForm.points.findIndex((item) => item.id === data.inspectPointForm.id); + data.inspectTaskForm.points[result] = data.inspectPointForm; + data.inspectPointDialog = false; + } else if (data.title === '修改巡检任务' && data.pointTitle === '新增巡检点') { + data.inspectPointForm.unitId = data.inspectTaskForm.id; + if (data.inspectTaskForm.points.length === 0) { + data.inspectPointForm.execSequence = 1; + } else { + data.inspectPointForm.execSequence = (data.inspectTaskForm.points[data.inspectTaskForm.points.length - 1].execSequence as number) + 1; + } + let res = await inspectTaskApi().addChainOfInspectTask(data.inspectPointForm); + if (res.data.code === '200') { + ElMessage({ + type: 'success', + message: '巡检点新增成功', + duration: 2000 + }); + data.inspectPointDialog = false; + data.inspectTaskForm.points.push(data.inspectPointForm); + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + } else { + data.inspectPointForm.unitId = data.inspectTaskForm.id; + let res = await inspectTaskApi().modChainOfInspectTask(data.inspectPointForm); + if (res.data.code === '200') { + ElMessage({ + type: 'success', + message: '巡检点修改成功', + duration: 2000 + }); + let result = data.inspectTaskForm.points.findIndex((item) => item.id === data.inspectPointForm.id); + data.inspectTaskForm.points[result] = data.inspectPointForm; + data.inspectPointDialog = false; + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + } + }; + const deleteFlow = async (index: number, item: { id: number }) => { + if (data.pointTitle === '新增巡检点') { + data.inspectTaskForm.points.splice(index, 1); + } else { + let res = await inspectTaskApi().deleteChainOfInspectTask({ id: item.id, unitId: data.inspectTaskForm.id }); + if (res.data.code === '200') { + data.inspectTaskForm.points.splice(index, 1); + ElMessage({ + type: 'success', + message: '巡检点删除成功' + }); + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + } + }; + + const giveRegionAndRFID = () => { + data.inspectPointForm.regionId = data.inspectPointAllList.find((item) => item.id === data.inspectPointForm.pointId)?.regionId as number; + data.inspectPointForm.rfidId = data.inspectPointAllList.find((item) => item.id === data.inspectPointForm.pointId)?.rfidId as number; + }; + + const giveClassGroup = () => { + data.inspectTaskForm.execClassgroupId = null; + data.classGroup = data.classGroupList.filter((item) => item.depId === data.inspectTaskForm.execDepId); + }; + + const giveQuotaUnit = () => { + data.inspectPointForm.quotaUnit = data.quotaList.find((item) => item.id === data.inspectPointForm.quotaId)?.unit as string; + }; + const submitInspectTask = () => { + inspectTaskFormRef.value.validate(async (valid: Boolean) => { + if (valid) { + if (data.title === '新增巡检任务') { + let res = await inspectTaskApi().addInspectTask(data.inspectTaskForm); + if (res.data.code === '200') { + ElMessage({ + type: 'success', + message: '巡检任务新增成功', + duration: 2000 + }); + data.ifShowInspectTaskDialog = false; + context.emit('refreshInspectTask'); + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + } else { + let res = await inspectTaskApi().modInspectTask(data.inspectTaskForm); + if (res.data.code === '200') { + ElMessage({ + type: 'success', + message: '巡检指标修改成功', + duration: 2000 + }); + data.ifShowInspectTaskDialog = false; + context.emit('refreshInspectTask'); + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + } + } else { + ElMessage({ + type: 'warning', + message: '请完善基本信息' + }); + } + }); + }; + + return { + ...toRefs(data), + inspectTaskFormRef, + deleteFlow, + getSum, + // toRefer, + giveQuotaUnit, + giveClassGroup, + submitInspectTask, + submitInspectPoint, + giveRegionAndRFID, + showInspectRecordDialog, + openInspectPointDialog + }; + } +}); +</script> + +<style scoped lang="scss"> +$homeNavLengh: 8; +.home-container { + height: calc(100vh - 144px); + box-sizing: border-box; + overflow: hidden; + .homeCard { + width: 100%; + padding: 20px; + box-sizing: border-box; + background: #fff; + border-radius: 4px; + + .main-card { + width: 100%; + height: 100%; + .cardTop { + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 20px; + .mainCardBtn { + margin: 0; + } + } + .pageBtn { + height: 60px; + display: flex; + align-items: center; + justify-content: right; + + .demo-pagination-block + .demo-pagination-block { + margin-top: 10px; + } + .demo-pagination-block .demonstration { + margin-bottom: 16px; + } + } + } + &:last-of-type { + height: calc(100% - 100px); + } + } + .el-row { + display: flex; + align-items: center; + margin-bottom: 20px; + &:last-child { + margin-bottom: 0; + } + .grid-content { + align-items: center; + min-height: 36px; + } + + .topInfo { + display: flex; + align-items: center; + font-size: 16px; + font-weight: bold; + + & > div { + white-space: nowrap; + margin-right: 20px; + } + } + } +} +.stepItem { + width: 100%; + display: flex; + align-items: flex-start; + margin-bottom: 30px; + margin-left: 30px; + padding-bottom: 30px; + border-left: 2px solid #ccc; + &:first-of-type { + margin-top: 30px; + } + &:last-of-type { + margin-bottom: 0; + border-left: none; + } + .stepNum { + width: 30px; + height: 30px; + border-radius: 15px; + box-sizing: border-box; + color: #333; + border: 1px solid #999; + line-height: 28px; + text-align: center; + margin-right: 10px; + margin-left: -16px; + margin-top: -30px; + } + .stepCard { + width: 100%; + margin-top: -30px; + + .box-card { + width: 100%; + &:deep(.el-card__header) { + padding: 10px 15px; + } + .card-header { + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + & > div:first-of-type { + margin-right: 80px; + font-size: 18px; + font-weight: bold; + } + } + } + } + &:hover .card-header { + color: #0098f5; + } + &:hover .stepNum { + border: 2px solid #0098f5; + color: #0098f5; + } +} +:deep(.el-date-editor) { + width: 100%; +} +</style> diff --git a/src/views/intellectInspect/inspectIndex2/components/sum.vue b/src/views/intellectInspect/inspectIndex2/components/sum.vue new file mode 100644 index 0000000..b0071e0 --- /dev/null +++ b/src/views/intellectInspect/inspectIndex2/components/sum.vue @@ -0,0 +1,131 @@ +<template> + <div style="height: 100%"> + <div class="sum-info"> + <div v-for="item in sumData" class="region-card"> + <div class="region-tit">{{item[0][0].region}}</div> + <div class="unit-card"> + <div v-for="i in item"> + <div class="unit-tit">{{i[0].quotaContent}}({{i[0].quotaUnit}})</div> + <div class="points"> + <div v-for="t in i" > + <span class="point-tit">{{t.point}}</span> + <span>{{t.dataReportType == 1 ? '无' : t.secondReferenceResult}}</span> + </div> + </div> + </div> + </div> + </div> + </div> + </div> +</template> + +<script lang="ts"> + import { toRefs, reactive, defineComponent, ref, defineAsyncComponent } from 'vue'; + import { storeToRefs } from 'pinia'; + import { initBackEndControlRoutes } from '/@/router/backEnd'; + import {useUserInfo} from "/@/stores/userInfo"; + import { Session } from '/@/utils/storage'; + import { ElMessage } from 'element-plus' + import type { FormInstance, FormRules } from 'element-plus' + import { workApplyApi } from '/@/api/specialWorkSystem/workApply'; + + + interface stateType { + + } + export default defineComponent({ + name: 'SumData', + components: {}, + props:['sumData'], + setup() { + const userInfo = useUserInfo() + const { userInfos } = storeToRefs(userInfo); + return { + + }; + }, + }); +</script> + +<style scoped lang="scss"> + .home-container { + height: 100%; + overflow: hidden; + position: relative; + + .sum-info{ + width: 100%; + border: 1px solid #ccc; + + .region-card{ + width: 100%; + border-bottom: 1px solid #ccc; + display: flex; + font-size: 16px; + align-items: center; + .region-tit{ + width: 25%; + text-align: center; + } + .unit-card{ + width: 75%; + height: 100%; + border-left: 1px solid #ccc; + + &>div{ + width: 100%; + display: flex; + align-items: center; + border-bottom: 1px solid #ccc; + + &:last-of-type{ + border-bottom: none; + } + + .unit-tit{ + width: 40%; + padding-left: 10px; + } + .points{ + width: 60%; + height: 100%; + border-left: 1px solid #ccc; + + &>div{ + width: 100%; + display: flex; + align-items: center; + span{ + text-align: center; + width: 50%; + } + .point-tit{ + border-right: 1px solid #ccc; + padding: 10px; + } + } + } + } + } + } + } + .el-row{ + margin-bottom: 20px; + } + .el-row:last-child { + margin-bottom: 0; + } + .el-input{ + width: 100% !important; + } + .el-date-editor::v-deep{ + width: 100%; + } + .el-select{ + width: 100%; + } + .el-cascader{ + width: 100% !important; + } + } +</style> diff --git a/src/views/intellectInspect/inspectIndex2/index.vue b/src/views/intellectInspect/inspectIndex2/index.vue new file mode 100644 index 0000000..2e64240 --- /dev/null +++ b/src/views/intellectInspect/inspectIndex2/index.vue @@ -0,0 +1,587 @@ +<template> + <div class="home-container"> + <div style="height: 100%"> + <div class="homeCard topCard"> + <div class="title">当前巡检任务</div> + <div class="top-info" v-if="unchecked != 0 || unusual != 0"> + <el-icon :size="18" color="#F3001E" style="margin-right: 4px"><BellFilled /></el-icon> + 预警消息: + <div v-if="unchecked != 0"> + 当日超期未巡检任务<el-tooltip + class="box-item" + effect="light" + content="查看相关记录" + placement="bottom-start" + ><span @click="toOverTime(4)">{{ unchecked }}</span></el-tooltip>个 + </div> + <span v-if="unchecked != 0 && unusual != 0">,</span> + <div v-if="unusual != 0"> + 存在异常任务<el-tooltip + class="box-item" + effect="light" + content="查看相关记录" + placement="bottom-start" + ><span @click="toOverTime(5)">{{ unusual }}</span + ></el-tooltip>个 + </div> + 。 + </div> + </div> + <div class="homeCard"> + <div class="main-card"> + <div class="list"> + <div class="cardTop" v-for="(item, index) in tableData" :key="index"> + <div class="left-info"> + <span class="num">{{ pageSize * (pageIndex - 1) + index + 1 }}、</span> + <span class="place">{{ item.taskName }},</span> + <p v-if="item.execUserName == null">该任务暂无人认领</p> + <p v-else> + <span class="time">{{ item.taskStatus == 2 ? item.startTime : item.endTime }}</span + >由<span class="name">{{ item.execUserName }}</span + >进行的巡检任务 + </p> + </div> + <div class="mid-info"> + 任务状态:<span :class="item.taskStatus == 1 ? 'grey' : item.taskStatus == 2 ? 'green' : item.taskStatus == 3 ? 'blue' : 'red'">{{ item.taskStatus == 1 ? '待巡检' : item.taskStatus == 2 ? '巡检中' : item.taskStatus == 3 ? '已巡检' : '超期未巡检' }}</span> + </div> + <div class="right-info"> + <div v-if="item.taskStatus == 2" @click="toLine(item)" class="checkBtn">查看实时巡检</div> + <div v-else class="reviewBtn" @click="toDetails('查看', item)">[查看巡检记录]</div> + </div> + </div> + </div> + <div class="pageBtn"> + <el-pagination v-model:currentPage="pageIndex" v-model:page-size="pageSize" :page-sizes="[10, 15]" small="false" background layout="total, sizes, prev, pager, next, jumper" :total="totalSize" @size-change="handleSizeChange" @current-change="handleCurrentChange" /> + </div> + </div> + </div> + </div> + <inspect-record-dialog ref="inspectRecordDialogRef" @refreshInspectRecord="getInspectRecord"></inspect-record-dialog> + </div> +</template> + +<script lang="ts"> +import { toRefs, reactive, ref, onMounted } from 'vue'; +import { storeToRefs } from 'pinia'; +import { initBackEndControlRoutes } from '/@/router/backEnd'; +import { useUserInfo } from '/@/stores/userInfo'; +import { Session } from '/@/utils/storage'; +import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'; +import { ElTable } from 'element-plus'; +import { FormInstance, FormRules, ElMessage } from 'element-plus'; +import { inspectRecordApi } from '/@/api/intellectInspectSystem/inspectRecord'; +import { useRouter } from 'vue-router'; +import inspectRecordDialog from './components/inspectRecordDialog.vue'; +import { departmentApi } from '/@/api/systemManage/department'; +// 定义接口来定义对象的类型 +interface stateType { + tableData: Array<string>; + unchecked: null | number; + unusual: null | number; + uncheckedList: []; + abnormalList: []; + pageIndex: number; + pageSize: number; + totalSize: number; + workTypeList: Array<type>; + departmentList: []; + timeType: Array<type>; + classGroupList: Array<classGroup>; + quotaList: []; + inspectPointAllList: []; +} +interface type { + id: number; + name: string; +} +interface classGroup { + id: number; + groupName: string; +} +export default { + name: 'workingHours', + components: { inspectRecordDialog }, + setup() { + const router = useRouter(); + const state = reactive<stateType>({ + pageIndex: 1, + pageSize: 10, + totalSize: 0, + tableData: [], + unchecked: null, + unusual: null, + uncheckedList: [], + abnormalList: [], + workTypeList: [ + { id: 1, name: '日常任务' }, + { id: 2, name: '周期任务' } + ], + departmentList: [], + timeType: [ + { id: 1, name: '分' }, + { id: 2, name: '小时' }, + { id: 3, name: '日' }, + { id: 4, name: '月' }, + { id: 5, name: '年' } + ], + classGroupList: [], + quotaList: [], + inspectPointAllList: [] + }); + const inspectRecordDialogRef = ref(); + interface User { + name: string; + startTime: string; + endTime: string; + info: string; + } + + // 页面载入时执行方法 + onMounted(() => { + getInspectRecord(); + getDayData(); + getDepartmentData(); + }); + + // 分页获取工作时段列表 + const getInspectRecord = async () => { + const data = { pageSize: state.pageSize, pageIndex: state.pageIndex }; + let res = await inspectRecordApi().getInspectRecordByIndex(data); + if (res.data.code === '200') { + state.tableData = res.data.data.records; + state.totalSize = res.data.data.total; + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }; + //获取部门 + const getDepartmentData = async () => { + let res = await departmentApi().getDepartmentList(); + if (res.data.code === '200') { + state.departmentList = res.data.data; + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }; + + //获取当日数据 + const getDayData = async () => { + let res = await inspectRecordApi().getDayRecord(); + if (res.data.code === '200') { + state.unchecked = res.data.data.noCheckTaskCount; + state.unusual = res.data.data.abnormalTaskCount; + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }; + + const handleSizeChange = (val: number) => { + state.pageSize = val; + getInspectRecord(); + }; + const handleCurrentChange = (val: number) => { + state.pageIndex = val; + getInspectRecord(); + }; + + const toLine = (item) => { + console.log(item,'item') + let id = item.id; + console.log(id,'id') + router.push({ + path: 'intelligentLine', + query: { + id: id + } + }); + }; + + const toOverTime = (id) => { + console.log(state.uncheckedList, 'list'); + router.push({ + path: 'inspectRecord', + query: { + id: id, + } + }); + }; + const toDetails = (type: string, item) => { + inspectRecordDialogRef.value.showInspectRecordDialog(type, item, state.workTypeList, state.departmentList, state.timeType, state.classGroupList, state.quotaList, state.inspectPointAllList); + }; + return { + View, + Edit, + Delete, + Refresh, + Plus, + router, + inspectRecordDialogRef, + toLine, + toOverTime, + toDetails, + handleSizeChange, + handleCurrentChange, + ...toRefs(state) + }; + } +}; +</script> + +<style scoped lang="scss"> +$homeNavLengh: 8; +@media screen and (min-width: 1366px) { + .topCard { + display: flex; + align-items: center; + justify-content: space-between; + font-weight: bolder; + + .top-info { + display: flex; + font-size: 16px; + align-items: center; + padding: 10px 15px; + background: #ffeb87; + border-radius: 8px; + border: 1px solid #ffae00; + + & > div { + vertical-align: middle; + white-space: nowrap; + span { + font-size: 22px; + color: #f3001e; + margin: 0 4px; + cursor: pointer; + + &:hover{ + text-decoration: underline; + } + } + } + } + } + .left-info { + width: 70%; + display: flex; + align-items: center; + justify-content: left; + font-size: 18px; + color: #333; + overflow-x: auto; + & > span { + white-space: nowrap; + } + p { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + & > span { + white-space: nowrap; + } + } + } + .mid-info { + width: 20%; + font-size: 18px; + color: #333; + } + .right-info { + width: 10%; + display: flex; + justify-content: right; + align-items: center; + font-size: 16px; + color: #fff; + + div { + white-space: nowrap; + } + } +} +@media screen and (min-width: 1200px) and (max-width: 1366px) { + .topCard { + display: flex; + align-items: center; + justify-content: space-between; + font-weight: bolder; + + .top-info { + display: flex; + font-size: 14px; + align-items: center; + padding: 6px 10px; + background: #ffeb87; + border-radius: 4px; + border: 1px solid #ffae00; + + & > div { + vertical-align: middle; + white-space: nowrap; + span { + font-size: 18px; + color: #f3001e; + margin: 0 2px; + cursor: pointer; + + &:hover{ + text-decoration: underline; + } + } + } + } + } + .left-info { + width: 70%; + display: flex; + align-items: center; + justify-content: left; + font-size: 15px; + color: #333; + overflow-x: auto; + & > span { + white-space: nowrap; + } + p { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + & > span { + white-space: nowrap; + } + } + } + .mid-info { + width: 20%; + font-size: 15px; + color: #333; + } + .right-info { + width: 10%; + display: flex; + justify-content: right; + align-items: center; + font-size: 13px; + color: #fff; + div { + white-space: nowrap; + } + } +} +@media screen and (max-width: 1200px) { + .topCard { + display: flex; + align-items: center; + justify-content: space-between; + font-weight: bolder; + + .top-info { + display: flex; + font-size: 14px; + align-items: center; + padding: 2px 6px; + background: #ffeb87; + border-radius: 4px; + border: 1px solid #ffae00; + + & > div { + vertical-align: middle; + white-space: nowrap; + span { + font-size: 16px; + color: #f3001e; + margin: 0 1px; + cursor: pointer; + + &:hover{ + text-decoration: underline; + } + } + } + } + } + .left-info { + width: 70%; + display: flex; + align-items: center; + justify-content: left; + font-size: 12px; + color: #333; + overflow-x: auto; + & > span { + white-space: nowrap; + } + p { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + & > span { + white-space: nowrap; + } + } + } + .mid-info { + width: 20%; + font-size: 12px; + color: #333; + } + .right-info { + width: 10%; + display: flex; + justify-content: right; + align-items: center; + font-size: 12px; + color: #fff; + div { + white-space: nowrap; + } + } +} + +.home-container { + height: calc(100vh - 144px); + box-sizing: border-box; + overflow: hidden; + .homeCard { + width: 100%; + padding: 20px; + box-sizing: border-box; + background: #fff; + border-radius: 4px; + + .title { + font-size: 20px; + font-weight: bolder; + } + .main-card { + width: 100%; + height: 100%; + .cardTop { + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: 10px; + background: #daf3ff; + padding: 10px 15px; + border-radius: 8px; + + .left-info { + .num { + font-weight: bolder; + margin-right: 10px; + } + .place { + font-weight: bolder; + } + .time { + font-weight: bolder; + margin-right: 5px; + } + .name { + font-weight: bolder; + margin: 0 5px; + font-weight: bolder; + } + } + .mid-info { + span { + font-weight: bolder; + } + + .grey { + color: #999; + } + .green { + color: #44b100; + } + .blue { + color: #409eff; + } + .red { + color: red; + } + } + .right-info { + .checkBtn { + padding: 10px 15px; + background: #409eff; + border-radius: 4px; + cursor: pointer; + } + + .reviewBtn { + margin: 10px 15px; + cursor: pointer; + color: #44b100; + } + } + } + .list { + height: calc(100% - 60px); + overflow-y: auto; + } + .pageBtn { + position: absolute; + bottom: 15px; + right: 20px; + height: 60px; + display: flex; + align-items: center; + justify-content: right; + + .demo-pagination-block + .demo-pagination-block { + margin-top: 10px; + } + .demo-pagination-block .demonstration { + margin-bottom: 16px; + } + } + } + &:last-of-type { + position: relative; + padding-top: 0; + height: calc(100% - 60px); + } + } + .el-row { + display: flex; + align-items: center; + margin-bottom: 20px; + &:last-child { + margin-bottom: 0; + } + .grid-content { + align-items: center; + min-height: 36px; + } + } +} +.el-input { + width: 100% !important; +} +.el-date-editor::v-deep { + width: 100%; +} +.el-select { + width: 100%; +} +:deep(.el-textarea.is-disabled .el-textarea__inner) { + background-color: var(--el-card-bg-color); + color: var(--el-input-text-color, var(--el-text-color-regular)); +} +:deep(.el-input.is-disabled .el-input__inner) { + color: var(--el-input-text-color, var(--el-text-color-regular)); +} +:deep(.el-input.is-disabled .el-input__wrapper) { + background-color: var(--el-card-bg-color); +} +</style> diff --git a/src/views/intellectInspect/inspectRecordManage/inspectRecord/components/inspectRecordDialog.vue b/src/views/intellectInspect/inspectRecordManage/inspectRecord/components/inspectRecordDialog.vue index 4aec32f..e7cd1a3 100644 --- a/src/views/intellectInspect/inspectRecordManage/inspectRecord/components/inspectRecordDialog.vue +++ b/src/views/intellectInspect/inspectRecordManage/inspectRecord/components/inspectRecordDialog.vue @@ -54,7 +54,7 @@ <el-table-column prop="reportResult" label="结果" show-overflow-tooltip align="center"> <template #default="scope"> <div :style="{ color: scope.row.reportResult == 1 ? '#ff0000' : '#409eff' }"> - {{ scope.row.reportResult == 0 ? '正常' : scope.row.reportResult == 1 ? '存在异常' : '无' }} + {{ scope.row.reportResult == 0 ? '正常' : scope.row.reportResult == 1 ? '存在异常' : scope.row.reportResult == 2 ? '备' : '无' }} </div> </template> </el-table-column> @@ -210,7 +210,8 @@ ], firstReferenceValueList: [ { id: 0, name: '正常' }, - { id: 1, name: '异常' } + { id: 1, name: '异常' }, + { id: 2, name: '备' } ], secondReferenceSignList: [ { id: 1, name: '>' }, diff --git a/src/views/intellectInspect/inspectRecordManage/inspectRecord/index.vue b/src/views/intellectInspect/inspectRecordManage/inspectRecord/index.vue index 3ac0afc..7657aad 100644 --- a/src/views/intellectInspect/inspectRecordManage/inspectRecord/index.vue +++ b/src/views/intellectInspect/inspectRecordManage/inspectRecord/index.vue @@ -192,7 +192,8 @@ ], resultStatusList: [ { id: 0, name: '正常' }, - { id: 1, name: '存在异常' } + { id: 1, name: '存在异常' }, + { id: 2, name: '备' } ], taskStatusList: [ { id: 1, name: '待巡检' }, diff --git a/src/views/intellectInspect/inspectTaskManage/inspectTask/components/inspectTaskDialog.vue b/src/views/intellectInspect/inspectTaskManage/inspectTask/components/inspectTaskDialog.vue index 9279699..6f9a003 100644 --- a/src/views/intellectInspect/inspectTaskManage/inspectTask/components/inspectTaskDialog.vue +++ b/src/views/intellectInspect/inspectTaskManage/inspectTask/components/inspectTaskDialog.vue @@ -371,7 +371,8 @@ ], firstReferenceValueList: [ { id: 0, name: '正常' }, - { id: 1, name: '异常' } + { id: 1, name: '异常' }, + { id: 2, name: '备' } ], secondReferenceSignList: [ { id: 1, name: '>' }, diff --git a/src/views/intellectInspect/intelligentLine/index.vue b/src/views/intellectInspect/intelligentLine/index.vue index c20d361..ae41abf 100644 --- a/src/views/intellectInspect/intelligentLine/index.vue +++ b/src/views/intellectInspect/intelligentLine/index.vue @@ -68,7 +68,7 @@ <span>参数:</span><span class="target">{{ t.secondReferenceResult + t.quotaUnit }}</span> </div> <div> - <span>巡检结果:</span><span class="target">{{ t.reportResult == null ? '--' : t.reportResult == 0 ? '正常' : '异常' }}</span> + <span>巡检结果:</span><span class="target">{{ t.reportResult == null ? '--' : t.reportResult == 0 ? '正常' : t.reportResult == 1 ? '异常' : '备' }}</span> </div> </div> </div> -- Gitblit v1.9.2