From 61c9a9b2d21d64c1e2bc910a2f9e1ac0c017bddd Mon Sep 17 00:00:00 2001 From: Admin <978517621@qq.com> Date: 星期六, 23 七月 2022 17:58:48 +0800 Subject: [PATCH] 添加修改页面 --- src/views/doublePreventSystem/riskLevelManage/safetyRiskEvent/index.vue | 207 ++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 200 insertions(+), 7 deletions(-) diff --git a/src/views/doublePreventSystem/riskLevelManage/safetyRiskEvent/index.vue b/src/views/doublePreventSystem/riskLevelManage/safetyRiskEvent/index.vue index 81e1b9c..2b77d7b 100644 --- a/src/views/doublePreventSystem/riskLevelManage/safetyRiskEvent/index.vue +++ b/src/views/doublePreventSystem/riskLevelManage/safetyRiskEvent/index.vue @@ -1,13 +1,206 @@ <template> - <div>3</div> + <div class="system-role-container"> + <el-card shadow="hover"> + <div class="system-user-search mb15"> + <div class="basic-line"> + <span>安全风险单元名称:</span> + <el-select v-model="safetyRiskEventData.params.riskUnitId" class="input-box" placeholder="安全风险单元名称"> + <el-option v-for="item in allSafetyRiskEventData" :key="item.id" :label="item.riskUnitName" :value="item.id"></el-option> + </el-select> + </div> + <div class="basic-line"> + <span>安全风险事件名称:</span> + <el-input v-model="safetyRiskEventData.params.riskEventName" class="input-box" placeholder="安全风险事件名称"> </el-input> + </div> + <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> + <el-icon> + <ele-Search /> + </el-icon> + 查询 + </el-button> + <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> + <el-icon> + <ele-FolderAdd /> + </el-icon> + 新增事件 + </el-button> + </div> + <el-table :data="safetyRiskEventData.data" style="width: 100%"> + <el-table-column type="index" label="序号" width="60" /> + <el-table-column prop="riskUnitName" label="安全风险分析单元名称" width="180" show-overflow-tooltip></el-table-column> + <el-table-column prop="riskEventName" label="安全风险事件名称" width="180" show-overflow-tooltip></el-table-column> + <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> + <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> + <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> + <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> + <el-table-column label="操作" width="150"> + <template #default="scope"> + <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> + <el-button size="small" text type="danger" @click="onDelSafetyRiskEvent(scope.row)">删除</el-button> + </template> + </el-table-column> + </el-table> + <el-pagination + @size-change="onHandleSizeChange" + @current-change="onHandleCurrentChange" + class="mt15" + :pager-count="5" + :page-sizes="[10, 20, 30]" + v-model:current-page="safetyRiskEventData.params.pageIndex" + background + v-model:page-size="safetyRiskEventData.params.pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="safetyRiskEventData.total" + > + </el-pagination> + </el-card> + <safetyRiskEventDialog ref="safetyRiskEventDialogRef" @refreshSafetyRiskEvent="initSafetyRiskEventData" /> + </div> </template> -<script> - export default { - name: "index" +<script lang="ts"> +import { toRefs, reactive, onMounted, ref } from 'vue'; +import { ElMessageBox, ElMessage } from 'element-plus'; +import safetyRiskEventDialog from './components/safetyRiskEventDialog.vue'; +import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent/index.ts'; +import { departmentApi } from '/@/api/department'; +import { safetyRiskAnalyseUnitApi } from '/@/api/doublePreventSystem/safetyRiskAnalyseUnit'; + +// 定义接口来定义对象的类型 +interface TableData { + roleName: string; + roleSign: string; + describe: string; + sort: number; + status: boolean; + createTime: string; +} +interface TableDataState { + safetyRiskEventData: { + data: Array<TableData>; + total: number; + loading: boolean; + params: { + pageIndex: number; + pageSize: number; + riskEventName: string | null; + }; + }; + allSafetyRiskEventData: Array<safetyRiskEventState>; +} +interface safetyRiskEventState {} + +export default { + name: 'productionDevice', + components: { safetyRiskEventDialog }, + setup() { + const safetyRiskEventDialogRef = ref(); + const state = reactive<TableDataState>({ + safetyRiskEventData: { + data: [], + total: 0, + loading: false, + params: { + pageIndex: 1, + pageSize: 10, + riskEventName: null + } + }, + allSafetyRiskEventData: [] + }); + // 初始化表格数据 + const initSafetyRiskEventData = async () => { + let res = await safetyRiskEventApi().getSafetyRiskEventList(state.safetyRiskEventData.params); + if (res.data.code === '200') { + state.safetyRiskEventData.data = res.data.data; + state.safetyRiskEventData.total = res.data.count; + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }; + + // 获取安全风险分析单元数据 + const getAllSafetyRiskEventData = async () => { + let res = await safetyRiskAnalyseUnitApi().getAllSafetyRiskAnalyseUnitList(); + if (res.data.code === '200') { + state.allSafetyRiskEventData = JSON.parse(JSON.stringify(res.data.data)); + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }; + + // 打开安全风险事件 + const onOpenDialogRef = (type: string, value: any) => { + safetyRiskEventDialogRef.value.openSafetyRiskEventDialog(type, value, state.allSafetyRiskEventData); + }; + + // 删除角色 + const onDelSafetyRiskEvent = (row: any) => { + ElMessageBox.confirm(`此操作将永久删除该条安全风险事件:“${row.riskEventName}”,是否继续?`, '提示', { + confirmButtonText: '确认', + cancelButtonText: '取消', + type: 'warning' + }) + .then(async () => { + let res = await safetyRiskEventApi().deleteSafetyRiskEvent({ id: row.id }); + if (res.data.code === '200') { + ElMessage({ + type: 'success', + duration: 2000, + message: '删除成功' + }); + await initSafetyRiskEventData(); + } else { + ElMessage({ + type: 'warning', + message: res.data.msg + }); + } + }) + .catch(() => {}); + }; + + const handleSearch = () => { + initSafetyRiskEventData(); + }; + + // 分页改变 + const onHandleSizeChange = (val: number) => { + state.safetyRiskEventData.params.pageSize = val; + initSafetyRiskEventData(); + }; + + // 分页改变 + const onHandleCurrentChange = (val: number) => { + state.safetyRiskEventData.params.pageIndex = val; + initSafetyRiskEventData(); + }; + + // 页面加载时 + onMounted(() => { + getAllSafetyRiskEventData(); + initSafetyRiskEventData(); + }); + + return { + handleSearch, + onOpenDialogRef, + onHandleSizeChange, + onDelSafetyRiskEvent, + onHandleCurrentChange, + safetyRiskEventDialog, + safetyRiskEventDialogRef, + initSafetyRiskEventData, + ...toRefs(state) + }; } +}; </script> -<style scoped> - -</style> +<style scoped></style> -- Gitblit v1.9.2