From add68a0d028ec0e6626402aca724cc8c134c81ff Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期二, 09 八月 2022 10:31:21 +0800 Subject: [PATCH] 图标 --- src/views/intellectInspect/inspectTaskManage/inspectTask/index.vue | 603 +------------------- src/components/iconSelector/index.vue | 2 src/utils/getStyleSheets.ts | 194 +++--- src/views/intellectInspect/inspectTaskManage/inspectTask/components/inspectTaskDialog.vue | 9 src/api/intellectInspectSystem/inspectTask/index.ts | 62 ++ src/views/intellectInspect/inspectTaskManage/inspectTask/components/index.vue | 827 ++++++++++++++++++++++++++++ src/views/system/menu/component/menuDialog.vue | 2 7 files changed, 1,033 insertions(+), 666 deletions(-) diff --git a/src/api/intellectInspectSystem/inspectTask/index.ts b/src/api/intellectInspectSystem/inspectTask/index.ts new file mode 100644 index 0000000..66cdbb1 --- /dev/null +++ b/src/api/intellectInspectSystem/inspectTask/index.ts @@ -0,0 +1,62 @@ +import request from '/@/utils/request'; + +export function inspectTaskApi() { + return { + // v1 + getInspectTaskList: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/SafeCheckTaskUnit/select/listTaskUnitByPage`, + method: 'post', + data: data + }); + }, + // v1 + addInspectTask: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/SafeCheckTaskUnit/insert/saveTaskUnit`, + method: 'post', + data: data + }); + }, + // v1 + modInspectTask: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/SafeCheckTaskUnit/update/updateTaskUnitMainById`, + method: 'post', + data: data + }); + }, + // v1 + deleteInspectTask: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/SafeCheckTaskUnit/delete/deleteTaskUnit`, + method: 'post', + data: data + }); + }, + // v1 + addChainOfInspectTask: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/SafeCheckTaskUnit/insert/saveTaskUnitPoint`, + method: 'post', + data: data + }); + }, + // v1 + modChainOfInspectTask: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/SafeCheckTaskUnit/update/updateTaskUnitPointById`, + method: 'post', + data: data + }); + }, + // v1 + deleteChainOfInspectTask: (data: object) => { + return request({ + url: import.meta.env.VITE_API_URL + `/SafeCheckTaskUnit/delete/deleteTaskUnitPoint`, + method: 'post', + data: data + }); + } + }; +} diff --git a/src/components/iconSelector/index.vue b/src/components/iconSelector/index.vue index f4547d9..db142ba 100644 --- a/src/components/iconSelector/index.vue +++ b/src/components/iconSelector/index.vue @@ -43,7 +43,7 @@ <script lang="ts"> import { ref, toRefs, reactive, onMounted, nextTick, computed, watch, defineComponent } from 'vue'; -// import initIconfont from '/@/utils/getStyleSheets'; +import initIconfont from '/@/utils/getStyleSheets'; export default defineComponent({ name: 'iconSelector', diff --git a/src/utils/getStyleSheets.ts b/src/utils/getStyleSheets.ts index 79144d7..81c80e0 100644 --- a/src/utils/getStyleSheets.ts +++ b/src/utils/getStyleSheets.ts @@ -1,101 +1,93 @@ -// import { nextTick } from 'vue'; -// import * as svg from '@element-plus/icons-vue'; -// -// // 获取阿里字体图标 -// const getAlicdnIconfont = () => { -// return new Promise((resolve, reject) => { -// nextTick(() => { -// const styles: any = document.styleSheets; -// let sheetsList = []; -// let sheetsIconList = []; -// for (let i = 0; i < styles.length; i++) { -// if (styles[i].href && styles[i].href.indexOf('at.alicdn.com') > -1) { -// sheetsList.push(styles[i]); -// } -// } -// for (let i = 0; i < sheetsList.length; i++) { -// for (let j = 0; j < sheetsList[i].cssRules.length; j++) { -// if (sheetsList[i].cssRules[j].selectorText && sheetsList[i].cssRules[j].selectorText.indexOf('.icon-') > -1) { -// sheetsIconList.push( -// `${sheetsList[i].cssRules[j].selectorText.substring(1, sheetsList[i].cssRules[j].selectorText.length).replace(/\:\:before/gi, '')}` -// ); -// } -// } -// } -// if (sheetsIconList.length > 0) resolve(sheetsIconList); -// else reject('未获取到值,请刷新重试'); -// }); -// }); -// }; -// -// // 初始化获取 css 样式,获取 element plus 自带 svg 图标,增加了 ele- 前缀,使用时:ele-Aim -// const getElementPlusIconfont = () => { -// return new Promise((resolve, reject) => { -// nextTick(() => { -// const icons = svg as any; -// const sheetsIconList = []; -// for (const i in icons) { -// sheetsIconList.push(`ele-${icons[i].name}`); -// } -// if (sheetsIconList.length > 0) resolve(sheetsIconList); -// else reject('未获取到值,请刷新重试'); -// }); -// }); -// }; -// -// // 初始化获取 css 样式,这里使用 fontawesome 的图标 -// const getAwesomeIconfont = () => { -// return new Promise((resolve, reject) => { -// nextTick(() => { -// const styles: any = document.styleSheets; -// let sheetsList = []; -// let sheetsIconList = []; -// for (let i = 0; i < styles.length; i++) { -// if (styles[i].href && styles[i].href.indexOf('netdna.bootstrapcdn.com') > -1) { -// sheetsList.push(styles[i]); -// } -// } -// for (let i = 0; i < sheetsList.length; i++) { -// for (let j = 0; j < sheetsList[i].cssRules.length; j++) { -// if ( -// sheetsList[i].cssRules[j].selectorText && -// sheetsList[i].cssRules[j].selectorText.indexOf('.fa-') === 0 && -// sheetsList[i].cssRules[j].selectorText.indexOf(',') === -1 -// ) { -// if (/::before/.test(sheetsList[i].cssRules[j].selectorText)) { -// sheetsIconList.push( -// `${sheetsList[i].cssRules[j].selectorText.substring(1, sheetsList[i].cssRules[j].selectorText.length).replace(/\:\:before/gi, '')}` -// ); -// } -// } -// } -// } -// if (sheetsIconList.length > 0) resolve(sheetsIconList.reverse()); -// else reject('未获取到值,请刷新重试'); -// }); -// }); -// }; -// -// /** -// * 获取字体图标 `document.styleSheets` -// * @method ali 获取阿里字体图标 `<i class="iconfont 图标类名"></i>` -// * @method ele 获取 element plus 自带图标 `<i class="图标类名"></i>` -// * @method ali 获取 fontawesome 的图标 `<i class="fa 图标类名"></i>` -// */ -// const initIconfont = { -// // iconfont -// ali: () => { -// return getAlicdnIconfont(); -// }, -// // element plus -// ele: () => { -// return getElementPlusIconfont(); -// }, -// // fontawesome -// awe: () => { -// return getAwesomeIconfont(); -// }, -// }; -// -// // 导出方法 -// export default initIconfont; +import { nextTick } from 'vue'; +import * as svg from '@element-plus/icons-vue'; + +// 获取阿里字体图标 +const getAlicdnIconfont = () => { + return new Promise((resolve, reject) => { + nextTick(() => { + const styles: any = document.styleSheets; + let sheetsList = []; + let sheetsIconList = []; + for (let i = 0; i < styles.length; i++) { + if (styles[i].href && styles[i].href.indexOf('at.alicdn.com') > -1) { + sheetsList.push(styles[i]); + } + } + for (let i = 0; i < sheetsList.length; i++) { + for (let j = 0; j < sheetsList[i].cssRules.length; j++) { + if (sheetsList[i].cssRules[j].selectorText && sheetsList[i].cssRules[j].selectorText.indexOf('.icon-') > -1) { + sheetsIconList.push(`${sheetsList[i].cssRules[j].selectorText.substring(1, sheetsList[i].cssRules[j].selectorText.length).replace(/\:\:before/gi, '')}`); + } + } + } + if (sheetsIconList.length > 0) resolve(sheetsIconList); + else reject('未获取到值,请刷新重试'); + }); + }); +}; + +// 初始化获取 css 样式,获取 element plus 自带 svg 图标,增加了 ele- 前缀,使用时:ele-Aim +const getElementPlusIconfont = () => { + return new Promise((resolve, reject) => { + nextTick(() => { + const icons = svg as any; + const sheetsIconList = []; + for (const i in icons) { + sheetsIconList.push(`ele-${icons[i].name}`); + } + if (sheetsIconList.length > 0) resolve(sheetsIconList); + else reject('未获取到值,请刷新重试'); + }); + }); +}; + +// 初始化获取 css 样式,这里使用 fontawesome 的图标 +const getAwesomeIconfont = () => { + return new Promise((resolve, reject) => { + nextTick(() => { + const styles: any = document.styleSheets; + let sheetsList = []; + let sheetsIconList = []; + for (let i = 0; i < styles.length; i++) { + if (styles[i].href && styles[i].href.indexOf('netdna.bootstrapcdn.com') > -1) { + sheetsList.push(styles[i]); + } + } + for (let i = 0; i < sheetsList.length; i++) { + for (let j = 0; j < sheetsList[i].cssRules.length; j++) { + if (sheetsList[i].cssRules[j].selectorText && sheetsList[i].cssRules[j].selectorText.indexOf('.fa-') === 0 && sheetsList[i].cssRules[j].selectorText.indexOf(',') === -1) { + if (/::before/.test(sheetsList[i].cssRules[j].selectorText)) { + sheetsIconList.push(`${sheetsList[i].cssRules[j].selectorText.substring(1, sheetsList[i].cssRules[j].selectorText.length).replace(/\:\:before/gi, '')}`); + } + } + } + } + if (sheetsIconList.length > 0) resolve(sheetsIconList.reverse()); + else reject('未获取到值,请刷新重试'); + }); + }); +}; + +/** + * 获取字体图标 `document.styleSheets` + * @method ali 获取阿里字体图标 `<i class="iconfont 图标类名"></i>` + * @method ele 获取 element plus 自带图标 `<i class="图标类名"></i>` + * @method ali 获取 fontawesome 的图标 `<i class="fa 图标类名"></i>` + */ +const initIconfont = { + // iconfont + ali: () => { + return getAlicdnIconfont(); + }, + // element plus + ele: () => { + return getElementPlusIconfont(); + }, + // fontawesome + awe: () => { + return getAwesomeIconfont(); + } +}; + +// 导出方法 +export default initIconfont; diff --git a/src/views/intellectInspect/inspectTaskManage/inspectTask/components/index.vue b/src/views/intellectInspect/inspectTaskManage/inspectTask/components/index.vue new file mode 100644 index 0000000..ab5a8a5 --- /dev/null +++ b/src/views/intellectInspect/inspectTaskManage/inspectTask/components/index.vue @@ -0,0 +1,827 @@ +<template> + <div class="home-container"> + <div style="height: 100%"> + <el-row class="homeCard"> + <el-col :span="12"> + <div class="grid-content topInfo"> + <el-select v-model="searchType" @change="changeSearch" placeholder="任务名称"> + <el-option label="巡检任务类型" value="巡检任务类型" /> + <el-option label="创建人" value="创建人" /> + <el-option label="巡检班组" value="巡检班组" /> + <el-option label="检查频次" value="检查频次" /> + <el-option label="开始时间" value="开始时间" /> + </el-select> + <el-input v-model="searchContent" v-if="searchType == '任务名称'" placeholder="请输入任务名称"></el-input> + <el-input v-else-if="searchType == '检查频次'" v-model="searchContent" placeholder="请输入检查频次"> + <template #append> + <el-select v-model="searchUnit" placeholder="选择单位"> + <el-option label="分钟" value="分钟" /> + <el-option label="小时" value="小时" /> + <el-option label="天" value="天" /> + </el-select> + </template> + </el-input> + <el-select v-model="searchContent" v-else-if="searchType == '巡检任务类型'" placeholder="请选择任务类型"> + <el-option v-for="(item, index) in typeOptions" :label="item.name" :value="item.value" :key="index" /> + </el-select> + <el-select v-model="searchContent" v-else-if="searchType == '创建人'" placeholder="请选择创建人"> + <el-option v-for="(item, index) in createrOptions" :label="item.name" :value="item.value" :key="index" /> + </el-select> + <el-select v-model="searchContent" v-else-if="searchType == '巡检班组'" placeholder="请选择巡检班组"> + <el-option v-for="(item, index) in inspectorOptions" :label="item.name" :value="item.value" :key="index" /> + </el-select> + <el-date-picker v-model="searchContent" type="date" v-else :placeholder="'请选择' + searchType" size="large" style="margin-right: 20px" /> + <el-button type="primary">查询</el-button> + <el-button plain>重置</el-button> + </div> + </el-col> + </el-row> + <div class="homeCard"> + <div class="main-card"> + <el-row class="cardTop"> + <el-col :span="12" class="mainCardBtn"> + <el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord = true">新建</el-button> + <el-button type="danger" :icon="Delete" size="default" plain>删除</el-button> + </el-col> + <el-button type="primary" :icon="Refresh" size="default" /> + </el-row> + <el-table ref="multipleTableRef" :data="tableData" style="width: 100%" height="calc(100% - 100px)" :header-cell-style="{ background: '#fafafa' }" @selection-change="handleSelectionChange"> + <el-table-column type="selection" width="55" /> + <el-table-column property="name" label="任务名称" width="200" /> + <el-table-column property="type" label="任务类型" /> + <el-table-column property="execClassgroup" label="巡检班组" /> + <el-table-column property="frequency" label="检查频次" /> + <el-table-column property="unit" label="频次单位" /> + <el-table-column property="chainLength" label="巡检链长度" width="160" /> + <el-table-column property="startTime" label="任务开始时间" width="180" /> + <!-- <el-table-column property="validTime" label="任务有效时间" width="180"/>--> + <el-table-column property="creater" label="创建人" /> + <el-table-column property="createTime" label="创建时间" width="180" /> + <el-table-column property="status" label="状态" width="60" /> + <el-table-column fixed="right" label="操作" align="center" width="300"> + <template #default="scope"> + <el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button> + <el-button link type="primary" size="small" :icon="Edit" @click="editRecord(scope.$index, scope.row)">修改</el-button> + <el-switch v-model="scope.row.status" inline-prompt active-text="开" inactive-text="关" active-value="开启" inactive-value="关闭" style="margin: 0 10px" /> + <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.$index)">删除</el-button> + </template> + </el-table-column> + </el-table> + <div class="pageBtn"> + <el-pagination v-model:currentPage="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 15]" small="false" background layout="total, sizes, prev, pager, next, jumper" :total="100" @size-change="handleSizeChange" @current-change="handleCurrentChange" /> + </div> + </div> + </div> + </div> + + <el-dialog v-model="dialogDetails" title="巡检任务"> + <el-form :model="details" label-width="120px"> + <el-row> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="任务名称"> + <el-input v-model="details.name" readonly /> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="任务类型"> + <el-input v-model="details.type" readonly /> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="巡检部门"> + <el-input v-model="details.execDepId" readonly /> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="巡检班组"> + <el-input v-model="details.execClassgroup" readonly /> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="检查频次" prop="frequency"> + <el-input v-model="details.frequency" readonly> + <template #append> + <el-input v-model="details.unit" readonly /> + </template> + </el-input> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="提前通知时间"> + <el-input v-model="details.noticeTime" readonly /> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="任务开始时间"> + <el-input v-model="details.startTime" readonly /> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="周期有效时间"> + <el-input v-model="details.validTime" readonly /> + </el-form-item> + </el-col> + <el-col :span="24" style="margin-bottom: 20px"> + <el-form-item label="巡检链"> + <div style="width: 100%; margin-left: -30px"> + <div v-for="(item, index) in details.shiftSteps" class="stepItem"> + <div class="stepNum">{{ index + 1 }}</div> + <div class="stepCard"> + <el-card class="box-card"> + <template #header> + <div class="card-header"> + <div>{{ item.pointId }}</div> + </div> + </template> + <div class="text item"> + 所属设备区域:<span>{{ item.regionUuid }}</span> + </div> + <div class="text item"> + 关联RFID:<span>{{ item.rfidId }}</span> + </div> + <div class="text item"> + 巡检指标:<span>{{ item.quotaId }}</span> + </div> + <div class="text item"> + 数据填报类型:<span>{{ item.dataReportType }}</span> + </div> + <div class="text item"> + 数据参考值:<span>{{ item.firstReferenceValue ? item.firstReferenceValue : item.secondReferenceValue ? item.secondReferenceValue : item.thirdReferenceValue }}</span> + </div> + </el-card> + </div> + </div> + </div> + </el-form-item> + </el-col> + <el-form-item> + <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button> + </el-form-item> + </el-row> + </el-form> + </el-dialog> + + <el-dialog v-model="dialogAddRecord" title="巡检任务编辑" @close="closeAdd" @open="openAdd"> + <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules"> + <el-row> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="任务名称" prop="name"> + <el-input v-model="addRecord.name"> </el-input> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="任务类型" prop="type"> + <el-select v-model="addRecord.type"> + <el-option label="日常检查" value="日常检查" /> + <el-option label="周期检查" value="周期检查" /> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="巡检部门" prop="validTime"> + <el-select v-model="addRecord.execDepId" placeholder="请选择"> + <el-option label="部门一" value="部门一" /> + <el-option label="部门二" value="部门二" /> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="巡检班组" prop="execClassgroupId"> + <el-select v-model="addRecord.execClassgroup" placeholder="请选择"> + <el-option label="班组1" value="班组1" /> + <el-option label="班组2" value="班组2" /> + <el-option label="班组3" value="班组3" /> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="检查频次" prop="frequency"> + <el-input v-model="addRecord.frequency" placeholder="请输入检查频次"> + <template #append> + <el-select v-model="addRecord.unit" placeholder="选择单位"> + <el-option label="分钟" value="分钟" /> + <el-option label="小时" value="小时" /> + <el-option label="天" value="天" /> + </el-select> + </template> + </el-input> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="提前通知时间" prop="noticeTime"> + <el-select v-model="addRecord.noticeTime" placeholder="选择时间"> + <el-option label="15分钟" value="15分钟" /> + <el-option label="30分钟" value="30分钟" /> + <el-option label="45分钟" value="45分钟" /> + <el-option label="60分钟" value="60分钟" /> + <el-option label="75分钟" value="75分钟" /> + <el-option label="90分钟" value="90分钟" /> + </el-select> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="周期开始时间" prop="startTime"> + <el-date-picker v-model="addRecord.startTime" type="datetime" format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" /> + </el-form-item> + </el-col> + <el-col :span="12" style="margin-bottom: 20px"> + <el-form-item label="任务有效时间" prop="validTime"> + <el-select v-model="addRecord.validTime" placeholder="选择时间"> + <el-option label="15分钟" value="15分钟" /> + <el-option label="30分钟" value="30分钟" /> + <el-option label="45分钟" value="45分钟" /> + <el-option label="60分钟" value="60分钟" /> + <el-option label="75分钟" value="75分钟" /> + <el-option label="90分钟" value="90分钟" /> + </el-select> + </el-form-item> + </el-col> + <el-col :span="24"> + <el-form-item label="创建巡检链"> + <div style="width: 100%; margin-bottom: 20px"> + <el-button type="primary" :icon="Plus" size="default" @click="dialogAddShift = true">新增巡检点</el-button> + </div> + <div style="width: 100%; margin-left: -30px"> + <div v-for="(item, index) in addRecord.shiftSteps" class="stepItem"> + <div class="stepNum">{{ index + 1 }}</div> + <div class="stepCard"> + <el-card class="box-card"> + <template #header> + <div class="card-header"> + <div>{{ item.pointId }}</div> + </div> + </template> + <div class="text item"> + 所属设备区域:<span>{{ item.regionUuid }}</span> + </div> + <div class="text item"> + 关联RFID:<span>{{ item.rfidId }}</span> + </div> + <div class="text item"> + 巡检指标:<span>{{ item.quotaId }}</span> + </div> + <div class="text item"> + 数据填报类型:<span>{{ item.dataReportType }}</span> + </div> + <div class="text item"> + 数据参考值:<span>{{ item.firstReferenceValue ? item.firstReferenceValue : item.secondReferenceValue ? item.secondReferenceValue : item.thirdReferenceValue }}</span> + </div> + </el-card> + </div> + <div> + <!-- <el-button type="primary" size="default" @click="addFlow(index)">新增下一区域</el-button>--> + <el-button type="primary" size="default" @click="editFlow(index)">修改</el-button> + <el-button type="danger" size="default" @click="deleteFlow(index)">删除</el-button> + </div> + </div> + </div> + </el-form-item> + </el-col> + </el-row> + <el-form-item> + <el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button> + <el-button type="primary" @click="confirmAddRecord(addRef)" size="default">确认</el-button> + </el-form-item> + </el-form> + </el-dialog> + <el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear"> + <span>您确定要删除该条记录吗?</span> + <template #footer> + <span class="dialog-footer"> + <el-button @click="deleteDialog = false" size="default">取消</el-button> + <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button> + </span> + </template> + </el-dialog> + <el-dialog v-model="deleteShiftDialog" title="提示" width="30%" center @close="indexShiftClear"> + <span>您确定要删除该巡检点吗?</span> + <template #footer> + <span class="dialog-footer"> + <el-button @click="deleteShiftDialog = false" size="default">取消</el-button> + <el-button type="primary" @click="conFirmShiftDelete" size="default">确认</el-button> + </span> + </template> + </el-dialog> + <el-dialog v-model="dialogAddShift" title="新增巡检点" @close="closeAddShift"> + <el-form :model="addShift" label-width="120px" ref="addShiftRef" :rules="addShiftRules"> + <el-form-item label="选择巡检点" prop="pointId"> + <el-select v-model="addShift.pointId"> + <el-option label="73011" value="73011" /> + <el-option label="73012" value="73012" /> + </el-select> + </el-form-item> + <el-form-item label="所属设备区域"> + <el-input v-model="addShift.regionId" readonly /> + </el-form-item> + <el-form-item label="关联RFID"> + <el-input v-model="addShift.rfidId" readonly /> + </el-form-item> + <el-form-item label="选择巡检指标" prop="quotaId"> + <el-input v-model="addShift.quotaId" placeholder="Please input"> + <template #append>{{ addShift.quotaUnit }}</template> + </el-input> + </el-form-item> + <el-form-item label="数据填报类型" prop="dataReportType"> + <el-select v-model="addShift.dataReportType"> + <el-option label="选择" value="选择" /> + <el-option label="填空" value="填空" /> + <el-option label="选择并填空" value="选择并填空" /> + </el-select> + </el-form-item> + <el-form-item v-if="addShift.dataReportType == '选择' || addShift.dataReportType == '选择并填空'" label="数据参考值" prop="firstReferenceValue"> + <el-select v-model="addShift.firstReferenceValue"> + <el-option label="正常" value="正常" /> + <el-option label="异常" value="异常" /> + </el-select> + </el-form-item> + <el-form-item v-if="addShift.dataReportType == '填空' || addShift.dataReportType == '选择并填空'" label="数据参考值"> + <el-input v-model="addShift.secondReferenceValue" type="number" placeholder="请根据需求选择前方符号后再填写参考值,非必填"> + <template #prepend> + <el-select v-model="addShift.secondReferenceSign" placeholder="Select" style="width: 115px"> + <el-option label=">" value=">" /> + <el-option label=">=" value=">=" /> + </el-select> + </template> + </el-input> + </el-form-item> + <el-form-item v-if="addShift.dataReportType == '填空' || addShift.dataReportType == '选择并填空'" label=""> + <el-input v-model="addShift.thirdReferenceValue" type="number" placeholder="请根据需求选择前方符号后再填写参考值,非必填"> + <template #prepend> + <el-select v-model="addShift.thirdReferenceSign" placeholder="Select" style="width: 115px"> + <el-option label="<" value="<" /> + <el-option label="<=" value="<=" /> + </el-select> + </template> + </el-input> + </el-form-item> + <el-form-item> + <el-button type="warning" @click="dialogAddShift = false" size="default" plain>取消</el-button> + <el-button type="primary" @click="confirmAddShift(addShiftRef)" size="default">确认</el-button> + </el-form-item> + </el-form> + </el-dialog> + </div> +</template> + +<script lang="ts"> +import { toRefs, reactive, ref } 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, ElMessage } from 'element-plus'; +import { FormInstance, FormRules } from 'element-plus'; +import { RFIDApi } from '/@/api/intellectInspectSystem/RFID'; +let global: any = { + homeChartOne: null, + homeChartTwo: null, + homeCharThree: null, + dispose: [null, '', undefined] +}; + +interface stateType { + homeOne: Array<type>; +} +interface type {} +export default { + name: 'index', + components: {}, + setup() { + const userInfo = useUserInfo(); + const { userInfos } = storeToRefs(userInfo); + + const state = reactive({ + searchType: '任务名称', + typeOptions: [ + { + name: '日常检查', + value: '日常检查' + }, + { + name: '周期检查', + value: '周期检查' + } + ], + createrOptions: [ + { + name: '张三', + value: '张三' + }, + { + name: '李四', + value: '李四' + } + ], + inspectorOptions: [ + { + name: '李四', + value: '李四' + }, + { + name: '张三', + value: '张三' + } + ], + searchUnit: '小时', + searchContent: '', + currentPage: 1, + pageSize: 10, + chosenIndex: null, + chosenShiftIndex: null, + chosenInspectionIndex: null, + dialogDetails: false, + dialogAddRecord: false, + deleteDialog: false, + deleteShiftDialog: false, + deleteInspectionDialog: false, + dialogAddShift: false, + tableData: [], + total: null, + params: {}, + addRecord: { + name: '', + type: '', + creater: '', + inspector: '', + frequency: 1, + unit: '小时', + startTime: '', + validTime: '', + createTime: '', + chainLength: 0, + status: '开启', + shiftSteps: [] + }, + addShift: { + secondReferenceSign: '>', + thirdReferenceSign: '<' + }, + details: {} + }); + + //获取巡检任务数据 + const getInspectionTask = async () => { + let res = await RFIDApi().getRFIDList(state.params); + if (res.data.code === '200') { + state.tableData = res.data.data.records; + state.total = res.data.data.total; + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }; + + // 顶部筛选搜索 + const changeSearch = () => { + state.searchContent = ''; + }; + + const handleSizeChange = (val: number) => { + console.log(`${val} items per page`); + }; + const handleCurrentChange = (val: number) => { + console.log(`current page: ${val}`); + }; + + // 时间格式化 + const timeForm = { + hour12: false, + year: 'numeric', + month: '2-digit', + day: '2-digit', + hour: '2-digit', + minute: '2-digit', + second: '2-digit' + }; + const handleChange = (value) => { + state.addRecord.content = []; + console.log(JSON.parse(JSON.stringify(value))); + }; + const addRef = ref<FormInstance>(); + const addShiftRef = ref<FormInstance>(); + const addInspectionRef = ref<FormInstance>(); + + // 表单校验 + const addRules = reactive<FormRules>({ + name: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + type: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + execClassgroupId: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + frequency: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + unit: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + noticeTime: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + startTime: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + validTime: [{ required: true, message: '该内容不能为空', trigger: 'blur' }] + }); + const addShiftRules = reactive<FormRules>({ + pointId: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + quotaId: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + dataReportType: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], + firstReferenceValue: [{ required: true, message: '该内容不能为空', trigger: 'blur' }] + }); + + // 查看记录 + const viewRecord = (row) => { + state.details = JSON.parse(JSON.stringify(row)); + state.dialogDetails = true; + }; + + // 删除记录 + const deleteRecord = (index) => { + state.chosenIndex = index; + state.deleteDialog = true; + }; + const conFirmDelete = () => { + state.tableData.splice(state.chosenIndex, 1); + state.deleteDialog = false; + }; + + // 修改添加记录 + const editRecord = (index, row) => { + state.chosenIndex = index; + state.dialogAddRecord = true; + state.addRecord = JSON.parse(JSON.stringify(row)); + }; + const confirmAddRecord = async (formEl: FormInstance | undefined) => { + if (!formEl) return; + await formEl.validate((valid, fields) => { + if (valid) { + if (state.chosenIndex == null) { + if (!state.addRecord.shiftSteps || state.addRecord.shiftSteps.length == 0) { + ElMessage({ + message: '请先设置巡检链后再提交', + type: 'warning' + }); + return; + } else { + state.addRecord.createTime = new Date().toLocaleString('zh', timeForm).replace(/\//g, '-'); + state.addRecord.chainLength = state.addRecord.shiftSteps.length; + state.addRecord.status = '开启'; + state.tableData.unshift(state.addRecord); + } + } else { + if (state.addRecord.shiftSteps.length == 0) { + ElMessage({ + message: '请先设置巡检链后再提交', + type: 'warning' + }); + return; + } else { + state.tableData[state.chosenIndex] = state.addRecord; + } + } + state.dialogAddRecord = false; + } else { + console.log('error submit!', fields); + } + }); + }; + + // 添加弹窗打开前预操作 + const openAdd = () => { + state.addRecord.unit = '小时'; + }; + + // 弹窗关闭后判断数据初始化 + const closeAdd = () => { + state.addRecord = {}; + state.chosenIndex = null; + state.addShift = {}; + state.chosenShiftIndex = null; + }; + const indexClear = () => { + state.chosenIndex = null; + }; + const indexShiftClear = () => { + state.chosenShiftIndex = null; + }; + + // 排序 + // function compare(key) { + // return function (value1, value2) { + // var val1 = value1[key]; + // var val2 = value2[key]; + // return val1 - val2; + // } + // } + + // 添加删除巡检设施区域 + // const addFlow = (index) => { + // state.dialogAddShift = true + // state.chosenShiftIndex = index + // } + + // 编辑巡检点 + const editFlow = (index) => { + state.chosenShiftIndex = index; + state.addShift = JSON.parse(JSON.stringify(state.addRecord.shiftSteps[index])); + state.dialogAddShift = true; + }; + + // 删除巡检点 + const deleteFlow = (index) => { + state.deleteShiftDialog = true; + state.chosenShiftIndex = index; + }; + const conFirmShiftDelete = () => { + state.addRecord.shiftSteps.splice(state.chosenShiftIndex, 1); + state.deleteShiftDialog = false; + }; + // 增加修改巡检点 + const confirmAddShift = async (formEl: FormInstance | undefined) => { + if (!formEl) return; + await formEl.validate((valid, fields) => { + if (valid) { + if (state.chosenShiftIndex == null) { + if (!state.addRecord.shiftSteps) { + state.addRecord.shiftSteps = []; + } + state.addRecord.shiftSteps.push(state.addShift); + } else { + state.addRecord.shiftSteps[state.chosenShiftIndex] = state.addShift; + } + state.dialogAddShift = false; + } else { + console.log('error submit!', fields); + } + }); + }; + + const closeAddShift = () => { + state.addShift = {}; + state.chosenShiftIndex = null; + }; + + return { + addRef, + addShiftRef, + addInspectionRef, + addRules, + addShiftRules, + View, + Edit, + Delete, + Refresh, + Plus, + changeSearch, + handleSizeChange, + handleCurrentChange, + handleChange, + viewRecord, + deleteRecord, + conFirmDelete, + openAdd, + editRecord, + confirmAddRecord, + closeAdd, + conFirmShiftDelete, + confirmAddShift, + closeAddShift, + editFlow, + deleteFlow, + indexClear, + indexShiftClear, + ...toRefs(state) + }; + } +}; +</script> + +<style scoped lang="scss"> +$homeNavLengh: 8; +.home-container { + height: calc(100vh - 114px); + 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; + } +} +.el-input { + width: 100% !important; +} +:deep(.el-date-editor) { + width: 100%; +} +.el-select { + width: 100%; +} +</style> diff --git a/src/views/intellectInspect/inspectTaskManage/inspectTask/components/inspectTaskDialog.vue b/src/views/intellectInspect/inspectTaskManage/inspectTask/components/inspectTaskDialog.vue new file mode 100644 index 0000000..8133178 --- /dev/null +++ b/src/views/intellectInspect/inspectTaskManage/inspectTask/components/inspectTaskDialog.vue @@ -0,0 +1,9 @@ +<template></template> + +<script> +export default { + name: 'inspectTask' +}; +</script> + +<style scoped></style> diff --git a/src/views/intellectInspect/inspectTaskManage/inspectTask/index.vue b/src/views/intellectInspect/inspectTaskManage/inspectTask/index.vue index 4e37911..e6e1635 100644 --- a/src/views/intellectInspect/inspectTaskManage/inspectTask/index.vue +++ b/src/views/intellectInspect/inspectTaskManage/inspectTask/index.vue @@ -40,12 +40,12 @@ <div class="main-card"> <el-row class="cardTop"> <el-col :span="12" class="mainCardBtn"> - <el-button type="primary" :icon="Plus" size="default" @click="dialogAddRecord = true">新建</el-button> + <el-button type="primary" :icon="Plus" size="default" @click="openDialog('新增', {})">新建</el-button> <el-button type="danger" :icon="Delete" size="default" plain>删除</el-button> </el-col> <el-button type="primary" :icon="Refresh" size="default" /> </el-row> - <el-table ref="multipleTableRef" :data="tableData" style="width: 100%" height="calc(100% - 100px)" :header-cell-style="{ background: '#fafafa' }" @selection-change="handleSelectionChange"> + <el-table ref="multipleTableRef" :data="tableData.inspectTaskData" style="width: 100%" height="calc(100% - 100px)" :header-cell-style="{ background: '#fafafa' }" @selection-change="handleSelectionChange"> <el-table-column type="selection" width="55" /> <el-table-column property="name" label="任务名称" width="200" /> <el-table-column property="type" label="任务类型" /> @@ -61,7 +61,7 @@ <el-table-column fixed="right" label="操作" align="center" width="300"> <template #default="scope"> <el-button link type="primary" size="small" :icon="View" @click="viewRecord(scope.row)">查看</el-button> - <el-button link type="primary" size="small" :icon="Edit" @click="editRecord(scope.$index, scope.row)">修改</el-button> + <el-button link type="primary" size="small" :icon="Edit" @click="openDialog('修改', scope.row)">修改</el-button> <el-switch v-model="scope.row.status" inline-prompt active-text="开" inactive-text="关" active-value="开启" inactive-value="关闭" style="margin: 0 10px" /> <el-button link type="danger" size="small" :icon="Delete" @click="deleteRecord(scope.$index)">删除</el-button> </template> @@ -73,305 +73,17 @@ </div> </div> </div> - - <el-dialog v-model="dialogDetails" title="巡检任务"> - <el-form :model="details" label-width="120px"> - <el-row> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="任务名称"> - <el-input v-model="details.name" readonly /> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="任务类型"> - <el-input v-model="details.type" readonly /> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="巡检部门"> - <el-input v-model="details.execDepId" readonly /> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="巡检班组"> - <el-input v-model="details.execClassgroup" readonly /> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="检查频次" prop="frequency"> - <el-input v-model="details.frequency" readonly> - <template #append> - <el-input v-model="details.unit" readonly /> - </template> - </el-input> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="提前通知时间"> - <el-input v-model="details.noticeTime" readonly /> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="任务开始时间"> - <el-input v-model="details.startTime" readonly /> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="周期有效时间"> - <el-input v-model="details.validTime" readonly /> - </el-form-item> - </el-col> - <el-col :span="24" style="margin-bottom: 20px"> - <el-form-item label="巡检链"> - <div style="width: 100%; margin-left: -30px"> - <div v-for="(item, index) in details.shiftSteps" class="stepItem"> - <div class="stepNum">{{ index + 1 }}</div> - <div class="stepCard"> - <el-card class="box-card"> - <template #header> - <div class="card-header"> - <div>{{ item.pointId }}</div> - </div> - </template> - <div class="text item"> - 所属设备区域:<span>{{ item.regionUuid }}</span> - </div> - <div class="text item"> - 关联RFID:<span>{{ item.rfidId }}</span> - </div> - <div class="text item"> - 巡检指标:<span>{{ item.quotaId }}</span> - </div> - <div class="text item"> - 数据填报类型:<span>{{ item.dataReportType }}</span> - </div> - <div class="text item"> - 数据参考值:<span>{{ item.firstReferenceValue ? item.firstReferenceValue : item.secondReferenceValue ? item.secondReferenceValue : item.thirdReferenceValue }}</span> - </div> - </el-card> - </div> - </div> - </div> - </el-form-item> - </el-col> - <el-form-item> - <el-button type="primary" @click="dialogDetails = false" size="default">确认</el-button> - </el-form-item> - </el-row> - </el-form> - </el-dialog> - - <el-dialog v-model="dialogAddRecord" title="巡检任务编辑" @close="closeAdd" @open="openAdd"> - <el-form :model="addRecord" label-width="120px" ref="addRef" :rules="addRules"> - <el-row> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="任务名称" prop="name"> - <el-input v-model="addRecord.name"> </el-input> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="任务类型" prop="type"> - <el-select v-model="addRecord.type"> - <el-option label="日常检查" value="日常检查" /> - <el-option label="周期检查" value="周期检查" /> - </el-select> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="巡检部门" prop="validTime"> - <el-select v-model="addRecord.execDepId" placeholder="请选择"> - <el-option label="部门一" value="部门一" /> - <el-option label="部门二" value="部门二" /> - </el-select> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="巡检班组" prop="execClassgroupId"> - <el-select v-model="addRecord.execClassgroup" placeholder="请选择"> - <el-option label="班组1" value="班组1" /> - <el-option label="班组2" value="班组2" /> - <el-option label="班组3" value="班组3" /> - </el-select> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="检查频次" prop="frequency"> - <el-input v-model="addRecord.frequency" placeholder="请输入检查频次"> - <template #append> - <el-select v-model="addRecord.unit" placeholder="选择单位"> - <el-option label="分钟" value="分钟" /> - <el-option label="小时" value="小时" /> - <el-option label="天" value="天" /> - </el-select> - </template> - </el-input> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="提前通知时间" prop="noticeTime"> - <el-select v-model="addRecord.noticeTime" placeholder="选择时间"> - <el-option label="15分钟" value="15分钟" /> - <el-option label="30分钟" value="30分钟" /> - <el-option label="45分钟" value="45分钟" /> - <el-option label="60分钟" value="60分钟" /> - <el-option label="75分钟" value="75分钟" /> - <el-option label="90分钟" value="90分钟" /> - </el-select> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="周期开始时间" prop="startTime"> - <el-date-picker v-model="addRecord.startTime" type="datetime" format="YYYY/MM/DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss" /> - </el-form-item> - </el-col> - <el-col :span="12" style="margin-bottom: 20px"> - <el-form-item label="任务有效时间" prop="validTime"> - <el-select v-model="addRecord.validTime" placeholder="选择时间"> - <el-option label="15分钟" value="15分钟" /> - <el-option label="30分钟" value="30分钟" /> - <el-option label="45分钟" value="45分钟" /> - <el-option label="60分钟" value="60分钟" /> - <el-option label="75分钟" value="75分钟" /> - <el-option label="90分钟" value="90分钟" /> - </el-select> - </el-form-item> - </el-col> - <el-col :span="24"> - <el-form-item label="创建巡检链"> - <div style="width: 100%; margin-bottom: 20px"> - <el-button type="primary" :icon="Plus" size="default" @click="dialogAddShift = true">新增巡检点</el-button> - </div> - <div style="width: 100%; margin-left: -30px"> - <div v-for="(item, index) in addRecord.shiftSteps" class="stepItem"> - <div class="stepNum">{{ index + 1 }}</div> - <div class="stepCard"> - <el-card class="box-card"> - <template #header> - <div class="card-header"> - <div>{{ item.pointId }}</div> - </div> - </template> - <div class="text item"> - 所属设备区域:<span>{{ item.regionUuid }}</span> - </div> - <div class="text item"> - 关联RFID:<span>{{ item.rfidId }}</span> - </div> - <div class="text item"> - 巡检指标:<span>{{ item.quotaId }}</span> - </div> - <div class="text item"> - 数据填报类型:<span>{{ item.dataReportType }}</span> - </div> - <div class="text item"> - 数据参考值:<span>{{ item.firstReferenceValue ? item.firstReferenceValue : item.secondReferenceValue ? item.secondReferenceValue : item.thirdReferenceValue }}</span> - </div> - </el-card> - </div> - <div> - <!-- <el-button type="primary" size="default" @click="addFlow(index)">新增下一区域</el-button>--> - <el-button type="primary" size="default" @click="editFlow(index)">修改</el-button> - <el-button type="danger" size="default" @click="deleteFlow(index)">删除</el-button> - </div> - </div> - </div> - </el-form-item> - </el-col> - </el-row> - <el-form-item> - <el-button type="warning" @click="dialogAddRecord = false" size="default" plain>取消</el-button> - <el-button type="primary" @click="confirmAddRecord(addRef)" size="default">确认</el-button> - </el-form-item> - </el-form> - </el-dialog> - <el-dialog v-model="deleteDialog" title="提示" width="30%" center @close="indexClear"> - <span>您确定要删除该条记录吗?</span> - <template #footer> - <span class="dialog-footer"> - <el-button @click="deleteDialog = false" size="default">取消</el-button> - <el-button type="primary" @click="conFirmDelete" size="default">确认</el-button> - </span> - </template> - </el-dialog> - <el-dialog v-model="deleteShiftDialog" title="提示" width="30%" center @close="indexShiftClear"> - <span>您确定要删除该巡检点吗?</span> - <template #footer> - <span class="dialog-footer"> - <el-button @click="deleteShiftDialog = false" size="default">取消</el-button> - <el-button type="primary" @click="conFirmShiftDelete" size="default">确认</el-button> - </span> - </template> - </el-dialog> - <el-dialog v-model="dialogAddShift" title="新增巡检点" @close="closeAddShift"> - <el-form :model="addShift" label-width="120px" ref="addShiftRef" :rules="addShiftRules"> - <el-form-item label="选择巡检点" prop="pointId"> - <el-select v-model="addShift.pointId"> - <el-option label="73011" value="73011" /> - <el-option label="73012" value="73012" /> - </el-select> - </el-form-item> - <el-form-item label="所属设备区域"> - <el-input v-model="addShift.regionId" readonly /> - </el-form-item> - <el-form-item label="关联RFID"> - <el-input v-model="addShift.rfidId" readonly /> - </el-form-item> - <el-form-item label="选择巡检指标" prop="quotaId"> - <el-input v-model="addShift.quotaId" placeholder="Please input"> - <template #append>{{ addShift.quotaUnit }}</template> - </el-input> - </el-form-item> - <el-form-item label="数据填报类型" prop="dataReportType"> - <el-select v-model="addShift.dataReportType"> - <el-option label="选择" value="选择" /> - <el-option label="填空" value="填空" /> - <el-option label="选择并填空" value="选择并填空" /> - </el-select> - </el-form-item> - <el-form-item v-if="addShift.dataReportType == '选择' || addShift.dataReportType == '选择并填空'" label="数据参考值" prop="firstReferenceValue"> - <el-select v-model="addShift.firstReferenceValue"> - <el-option label="正常" value="正常" /> - <el-option label="异常" value="异常" /> - </el-select> - </el-form-item> - <el-form-item v-if="addShift.dataReportType == '填空' || addShift.dataReportType == '选择并填空'" label="数据参考值"> - <el-input v-model="addShift.secondReferenceValue" type="number" placeholder="请根据需求选择前方符号后再填写参考值,非必填"> - <template #prepend> - <el-select v-model="addShift.secondReferenceSign" placeholder="Select" style="width: 115px"> - <el-option label=">" value=">" /> - <el-option label=">=" value=">=" /> - </el-select> - </template> - </el-input> - </el-form-item> - <el-form-item v-if="addShift.dataReportType == '填空' || addShift.dataReportType == '选择并填空'" label=""> - <el-input v-model="addShift.thirdReferenceValue" type="number" placeholder="请根据需求选择前方符号后再填写参考值,非必填"> - <template #prepend> - <el-select v-model="addShift.thirdReferenceSign" placeholder="Select" style="width: 115px"> - <el-option label="<" value="<" /> - <el-option label="<=" value="<=" /> - </el-select> - </template> - </el-input> - </el-form-item> - <el-form-item> - <el-button type="warning" @click="dialogAddShift = false" size="default" plain>取消</el-button> - <el-button type="primary" @click="confirmAddShift(addShiftRef)" size="default">确认</el-button> - </el-form-item> - </el-form> - </el-dialog> + <inspect-task-dialog ref="inspectTaskDialogRef"></inspect-task-dialog> </div> </template> <script lang="ts"> -import { toRefs, reactive, ref } from 'vue'; -import { storeToRefs } from 'pinia'; -import { initBackEndControlRoutes } from '/@/router/backEnd'; -import { useUserInfo } from '/@/stores/userInfo'; -import { Session } from '/@/utils/storage'; +import { toRefs, reactive, ref, onMounted } from 'vue'; import { Edit, View, Plus, Delete, Refresh, Search, Download } from '@element-plus/icons-vue'; import { ElTable, ElMessage } from 'element-plus'; -import { FormInstance, FormRules } from 'element-plus'; +import { inspectTaskApi } from '/@/api/intellectInspectSystem/inspectTask'; +import inspectTaskDialog from './components/inspectTaskDialog.vue'; +import InspectTask from '/@/views/intellectInspect/inspectTaskManage/inspectTask/components/inspectTaskDialog.vue'; let global: any = { homeChartOne: null, homeChartTwo: null, @@ -385,290 +97,55 @@ interface type {} export default { name: 'index', - components: {}, + components: { inspectTaskDialog }, setup() { - const userInfo = useUserInfo(); - const { userInfos } = storeToRefs(userInfo); - const state = reactive({ - searchType: '任务名称', - typeOptions: [ - { - name: '日常检查', - value: '日常检查' - }, - { - name: '周期检查', - value: '周期检查' + tableData: { + inspectTaskData: [], + total: 0, + loading: false, + params: { + pageIndex: 1, + pageSize: 10, + unitName: null, + workType: null, + createUserId: null, + execClassgroupId: null, + checkCycle: null, + checkCycleUnit: null } - ], - createrOptions: [ - { - name: '张三', - value: '张三' - }, - { - name: '李四', - value: '李四' - } - ], - inspectorOptions: [ - { - name: '李四', - value: '李四' - }, - { - name: '张三', - value: '张三' - } - ], - searchUnit: '小时', - searchContent: '', - currentPage: 1, - pageSize: 10, - chosenIndex: null, - chosenShiftIndex: null, - chosenInspectionIndex: null, - dialogDetails: false, - dialogAddRecord: false, - deleteDialog: false, - deleteShiftDialog: false, - deleteInspectionDialog: false, - dialogAddShift: false, - tableData: [], - addRecord: { - name: '', - type: '', - creater: '', - inspector: '', - frequency: 1, - unit: '小时', - startTime: '', - validTime: '', - createTime: '', - chainLength: 0, - status: '开启', - shiftSteps: [] - }, - addShift: { - secondReferenceSign: '>', - thirdReferenceSign: '<' - }, - details: {} + } }); //获取巡检任务数据 - const getInspectionTask = () => {}; - - // 顶部筛选搜索 - const changeSearch = () => { - state.searchContent = ''; + const getInspectionTask = async () => { + let res = await inspectTaskApi().getInspectTaskList(state.tableData.params); + if (res.data.code === '200') { + state.tableData.inspectTaskData = res.data.data; + state.tableData.total = res.data.count; + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } }; - const handleSizeChange = (val: number) => { - console.log(`${val} items per page`); - }; - const handleCurrentChange = (val: number) => { - console.log(`current page: ${val}`); - }; + const openDialog = () => {}; - // 时间格式化 - const timeForm = { - hour12: false, - year: 'numeric', - month: '2-digit', - day: '2-digit', - hour: '2-digit', - minute: '2-digit', - second: '2-digit' - }; - const handleChange = (value) => { - state.addRecord.content = []; - console.log(JSON.parse(JSON.stringify(value))); - }; - const addRef = ref<FormInstance>(); - const addShiftRef = ref<FormInstance>(); - const addInspectionRef = ref<FormInstance>(); - - // 表单校验 - const addRules = reactive<FormRules>({ - name: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], - type: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], - execClassgroupId: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], - frequency: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], - unit: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], - noticeTime: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], - startTime: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], - validTime: [{ required: true, message: '该内容不能为空', trigger: 'blur' }] + // 页面加载时 + onMounted(() => { + getInspectionTask(); }); - const addShiftRules = reactive<FormRules>({ - pointId: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], - quotaId: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], - dataReportType: [{ required: true, message: '该内容不能为空', trigger: 'blur' }], - firstReferenceValue: [{ required: true, message: '该内容不能为空', trigger: 'blur' }] - }); - - // 查看记录 - const viewRecord = (row) => { - state.details = JSON.parse(JSON.stringify(row)); - state.dialogDetails = true; - }; - - // 删除记录 - const deleteRecord = (index) => { - state.chosenIndex = index; - state.deleteDialog = true; - }; - const conFirmDelete = () => { - state.tableData.splice(state.chosenIndex, 1); - state.deleteDialog = false; - }; - - // 修改添加记录 - const editRecord = (index, row) => { - state.chosenIndex = index; - state.dialogAddRecord = true; - state.addRecord = JSON.parse(JSON.stringify(row)); - }; - const confirmAddRecord = async (formEl: FormInstance | undefined) => { - if (!formEl) return; - await formEl.validate((valid, fields) => { - if (valid) { - if (state.chosenIndex == null) { - if (!state.addRecord.shiftSteps || state.addRecord.shiftSteps.length == 0) { - ElMessage({ - message: '请先设置巡检链后再提交', - type: 'warning' - }); - return; - } else { - state.addRecord.createTime = new Date().toLocaleString('zh', timeForm).replace(/\//g, '-'); - state.addRecord.chainLength = state.addRecord.shiftSteps.length; - state.addRecord.status = '开启'; - state.tableData.unshift(state.addRecord); - } - } else { - if (state.addRecord.shiftSteps.length == 0) { - ElMessage({ - message: '请先设置巡检链后再提交', - type: 'warning' - }); - return; - } else { - state.tableData[state.chosenIndex] = state.addRecord; - } - } - state.dialogAddRecord = false; - } else { - console.log('error submit!', fields); - } - }); - }; - - // 添加弹窗打开前预操作 - const openAdd = () => { - state.addRecord.unit = '小时'; - }; - - // 弹窗关闭后判断数据初始化 - const closeAdd = () => { - state.addRecord = {}; - state.chosenIndex = null; - state.addShift = {}; - state.chosenShiftIndex = null; - }; - const indexClear = () => { - state.chosenIndex = null; - }; - const indexShiftClear = () => { - state.chosenShiftIndex = null; - }; - - // 排序 - // function compare(key) { - // return function (value1, value2) { - // var val1 = value1[key]; - // var val2 = value2[key]; - // return val1 - val2; - // } - // } - - // 添加删除巡检设施区域 - // const addFlow = (index) => { - // state.dialogAddShift = true - // state.chosenShiftIndex = index - // } - - // 编辑巡检点 - const editFlow = (index) => { - state.chosenShiftIndex = index; - state.addShift = JSON.parse(JSON.stringify(state.addRecord.shiftSteps[index])); - state.dialogAddShift = true; - }; - - // 删除巡检点 - const deleteFlow = (index) => { - state.deleteShiftDialog = true; - state.chosenShiftIndex = index; - }; - const conFirmShiftDelete = () => { - state.addRecord.shiftSteps.splice(state.chosenShiftIndex, 1); - state.deleteShiftDialog = false; - }; - // 增加修改巡检点 - const confirmAddShift = async (formEl: FormInstance | undefined) => { - if (!formEl) return; - await formEl.validate((valid, fields) => { - if (valid) { - if (state.chosenShiftIndex == null) { - if (!state.addRecord.shiftSteps) { - state.addRecord.shiftSteps = []; - } - state.addRecord.shiftSteps.push(state.addShift); - } else { - state.addRecord.shiftSteps[state.chosenShiftIndex] = state.addShift; - } - state.dialogAddShift = false; - } else { - console.log('error submit!', fields); - } - }); - }; - - const closeAddShift = () => { - state.addShift = {}; - state.chosenShiftIndex = null; - }; return { - addRef, - addShiftRef, - addInspectionRef, - addRules, - addShiftRules, View, Edit, Delete, Refresh, Plus, - changeSearch, - handleSizeChange, - handleCurrentChange, - handleChange, - viewRecord, - deleteRecord, - conFirmDelete, - openAdd, - editRecord, - confirmAddRecord, - closeAdd, - conFirmShiftDelete, - confirmAddShift, - closeAddShift, - editFlow, - deleteFlow, - indexClear, - indexShiftClear, + openDialog, + getInspectionTask, ...toRefs(state) }; } diff --git a/src/views/system/menu/component/menuDialog.vue b/src/views/system/menu/component/menuDialog.vue index 3df8384..ae7afd9 100644 --- a/src/views/system/menu/component/menuDialog.vue +++ b/src/views/system/menu/component/menuDialog.vue @@ -30,7 +30,7 @@ </el-col> <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> <el-form-item label="菜单图标"> - <el-input placeholder="请输入菜单图标" v-model.trim="ruleForm.meta.icon" type="all" /> + <!-- <el-input placeholder="请输入菜单图标" v-model.trim="ruleForm.meta.icon" type="all" />--> <IconSelector placeholder="请输入菜单图标" v-model="ruleForm.meta.icon" type="all" /> </el-form-item> </el-col> -- Gitblit v1.9.2