From ede67dc74f5ec5e491b102b1835d9cb5315dc6d5 Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期一, 01 八月 2022 10:48:15 +0800 Subject: [PATCH] 双重预防 --- src/views/doublePrevent/riskLevel/map/index.vue | 272 +++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 267 insertions(+), 5 deletions(-) diff --git a/src/views/doublePrevent/riskLevel/map/index.vue b/src/views/doublePrevent/riskLevel/map/index.vue index bee723e..bf0a220 100644 --- a/src/views/doublePrevent/riskLevel/map/index.vue +++ b/src/views/doublePrevent/riskLevel/map/index.vue @@ -1,11 +1,273 @@ <template> - <div>11223</div> + <div class="system-role-container"> + <el-card shadow="hover"> + <div class="system-user-search mb15"> + <div class="basic-line"> + <span>整改类型:</span> + <el-select class="input-box" v-model="rectifyData.params.rectifyType" placeholder="整改类型" filterable> + <el-option v-for="item in dangerLevelList" :key="item.id" :label="item.name" :value="item.id"></el-option> + </el-select> + </div> + <div class="basic-line"> + <span>整改单位:</span> + <el-select class="input-box" v-model="rectifyData.params.constructionUnit" placeholder="整改单位" filterable> + <el-option v-for="item in dangerSourceList" :key="item.id" :label="item.name" :value="item.id"></el-option> + </el-select> + </div> + <div class="basic-line"> + <span>隐患管理:</span> + <el-select class="input-box" v-model="rectifyData.params.dangerManagerId" placeholder="隐患管理" filterable> + <el-option v-for="item in dangerStatusList" :key="item.id" :label="item.name" :value="item.id"></el-option> + </el-select> + </div> + + <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> + <el-icon> + <ele-Search /> + </el-icon> + 查询 + </el-button> + </div> + <el-table :data="rectifyData.data" style="width: 100%" fit highlight-current-row> + <el-table-column type="index" label="序号" width="60" /> + <el-table-column prop="rectifyDesc" label="整改内容说明" show-overflow-tooltip min-width="150px"></el-table-column> + <el-table-column prop="rectifyTime" label="整改期限" show-overflow-tooltip min-width="150px"></el-table-column> + <el-table-column prop="rectifyType" label=" 整改类型" show-overflow-tooltip min-width="150px"></el-table-column> + <el-table-column prop="liablePerson" label="整改责任人" show-overflow-tooltip min-width="150px"></el-table-column> + <el-table-column prop="cost" label="整改资金" show-overflow-tooltip min-width="150px"></el-table-column> + <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip min-width="150px"></el-table-column> + <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip min-width="200px"></el-table-column> + <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip min-width="150px"></el-table-column> + <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip min-width="200px"></el-table-column> + <el-table-column label="操作" width="250" fixed="right" align="center"> + <template #default="scope"> + <el-button size="small" text type="primary" :icon="Edit" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> + <el-button size="small" text type="danger" :icon="Delete" @click="onDelProductionDevice(scope.row)">删除</el-button> + </template> + </el-table-column> + </el-table> + <br /> + <el-pagination + @size-change="onHandleSizeChange" + @current-change="onHandleCurrentChange" + :pager-count="5" + :page-sizes="[10, 20, 30]" + v-model:current-page="rectifyData.params.pageIndex" + background + v-model:page-size="rectifyData.params.pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="rectifyData.total" + class="page-position" + > + </el-pagination> + <br /> + <br /> + </el-card> + <rectifyDialog ref="rectifyDialogRef" @refreshrectify="initRectifyTableData" /> + </div> </template> -<script> -export default { - name: 'index' -}; +<script lang="ts"> +import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; +import { ElMessageBox, ElMessage } from 'element-plus'; +import rectifyDialog from './components/rectifyDialog.vue'; +import { Edit, Delete } from '@element-plus/icons-vue'; +import { hiddenRectifyApi } from '/@/api/doublePreventSystem/rectify'; +import { departmentApi } from '/@/api/department'; +import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice'; + +// 定义接口来定义对象的类型 +interface TableData { + quota: string; + quotaUnit: string; + quotaType: string; + createUserName: string; + gmtCreate: string; + lastEditUserName: string; + gmtModitify: string; +} +interface TableDataState { + rectifyData: { + data: Array<TableData>; + total: number; + loading: boolean; + params: { + pageIndex: number; + pageSize: number; + rectifyType: number | null; + constructionUnit: string | null; + dangerManagerId: number | null; + }; + }; + dangerLevelList: Array<enumType>; + dangerSourceList: Array<enumType>; + dangerStatusList: Array<enumType>; + dangerTypeList: Array<enumType>; + departmentList: []; + allProduceDeviceData: []; +} +interface enumType { + id: number; + name: string; +} + +export default defineComponent({ + name: 'rectify', + components: { rectifyDialog, Edit, Delete }, + setup() { + const rectifyDialogRef = ref(); + const state = reactive<TableDataState>({ + rectifyData: { + data: [], + total: 0, + loading: false, + params: { + pageIndex: 1, + pageSize: 10, + rectifyType: null, + constructionUnit: null, + dangerManagerId: null + } + }, + departmentList: [], + dangerLevelList: [ + { id: 1, name: '一般隐患' }, + { id: 2, name: '重大隐患' } + ], + dangerSourceList: [ + { id: 1, name: '日常排查' }, + { id: 2, name: '综合性排查' }, + { id: 3, name: '专业性排查' }, + { id: 4, name: '季节性排查' }, + { id: 5, name: '重点时段及节假日前排查' }, + { id: 6, name: '事故类比排查' }, + { id: 7, name: '复产复工前排查' }, + { id: 8, name: '外聘专家诊断式排查' }, + { id: 9, name: '管控措施失效' }, + { id: 10, name: '其他' } + ], + dangerStatusList: [ + { id: 1, name: '整改中' }, + { id: 2, name: '待验收' }, + { id: 3, name: '已验收' } + ], + dangerTypeList: [ + { id: 1, name: '安全' }, + { id: 2, name: '工艺' }, + { id: 3, name: '电气' }, + { id: 4, name: '仪表' }, + { id: 5, name: '消防' }, + { id: 6, name: '总图' }, + { id: 7, name: '设备' }, + { id: 8, name: '其他' } + ], + allProduceDeviceData: [] + }); + // 初始化表格数据 + const initRectifyTableData = async () => { + let res = await hiddenRectifyApi().getHiddenRectifyList(state.rectifyData.params); + if (res.data.code === '200') { + state.rectifyData.data = res.data.data; + state.rectifyData.total = res.data.count; + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }; + + //获取生产装置列表 + const getAllProduceDeviceData = async () => { + let res = await productionDeviceApi().getAllProductionDeviceList(); + if (res.data.code === '200') { + state.allProduceDeviceData = res.data.data; + } 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 onOpenDialogRef = (type: string, value: any) => { + rectifyDialogRef.value.openrectifyDialog(type, value, state.departmentList, state.allProduceDeviceData); + }; + // 删除 + const onDelProductionDevice = (row: any) => { + ElMessageBox.confirm(`此操作将永久删除该巡检点:“${row.code}”,是否继续?`, '提示', { + confirmButtonText: '确认', + cancelButtonText: '取消', + type: 'warning' + }) + .then(async () => { + let res = await hiddenRectifyApi().deleteHiddenRectify({ id: row.id }); + if (res.data.code === '200') { + ElMessage({ + type: 'success', + duration: 2000, + message: '删除成功' + }); + await initRectifyTableData(); + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }) + .catch(() => {}); + }; + + const handleSearch = () => { + initRectifyTableData(); + }; + // 分页改变 + const onHandleSizeChange = (val: number) => { + state.rectifyData.params.pageSize = val; + initRectifyTableData(); + }; + // 分页改变 + const onHandleCurrentChange = (val: number) => { + state.rectifyData.params.pageIndex = val; + initRectifyTableData(); + }; + // 页面加载时 + onMounted(() => { + initRectifyTableData(); + getDepartmentData(); + getAllProduceDeviceData(); + }); + + return { + Edit, + Delete, + handleSearch, + onOpenDialogRef, + onHandleSizeChange, + onDelProductionDevice, + onHandleCurrentChange, + rectifyDialog, + rectifyDialogRef, + initRectifyTableData, + ...toRefs(state) + }; + } +}); </script> <style scoped></style> -- Gitblit v1.9.2