From 6bb62bb861486fd447f864981e90e9c048472cb8 Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期二, 17 五月 2022 17:42:39 +0800 Subject: [PATCH] Merge branch 'master' of https://sinanoaq.cn:8888/r/ztqt --- src/views/hiddenDangerRegistration/listAssociatedHazards.vue | 246 +++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 246 insertions(+), 0 deletions(-) diff --git a/src/views/hiddenDangerRegistration/listAssociatedHazards.vue b/src/views/hiddenDangerRegistration/listAssociatedHazards.vue new file mode 100644 index 0000000..5fd4d1b --- /dev/null +++ b/src/views/hiddenDangerRegistration/listAssociatedHazards.vue @@ -0,0 +1,246 @@ +<template> + <div class="app-container"> + <div> + <Titlename title="列表页面"></Titlename> + <div class="whole"> + <div class="left-tree"> + <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree> + </div> + <div class="right"> + <el-form ref="form" :model="form" label-width="100px"> + <el-row> + <el-col :span="6"> + <el-form-item label="风险点名称:"> + <el-input v-model="form.name"></el-input> + </el-form-item> + </el-col> + <el-col :span="6"> + <el-form-item label="事故类型:"> + <el-input v-model="form.name"></el-input> + </el-form-item> + </el-col> + <el-col :span="6"> + <el-form-item label="主要危险源:"> + <el-input v-model="form.name"></el-input> + </el-form-item> + </el-col> + <el-col :span="6"> + <el-form-item> + <el-button class="btn" type="primary" @click="onSubmit">查询</el-button> + <el-button class="btn" type="primary">确定</el-button> + </el-form-item> + </el-col> + </el-row> + </el-form> + <el-table + ref="multipleTable" + :data="tableData" + tooltip-effect="dark" + style="width: 100%" + @selection-change="handleSelectionChange"> + <el-table-column + type="selection" + align="center" + width="55"> + </el-table-column> + <el-table-column + label="风险点" + align="center" + show-overflow-tooltip + width="120"> + <template slot-scope="scope">{{ scope.row.riskPoint }}</template> + </el-table-column> + <el-table-column + prop="hazardSources" + show-overflow-tooltip + align="center" + label="主要危险源" + width="120"> + </el-table-column> + <el-table-column + prop="accidentType" + align="center" + label="事故类型" + show-overflow-tooltip> + </el-table-column> + <el-table-column + prop="riskLevel" + label="风险等级" + align="center" + show-overflow-tooltip> + </el-table-column> + <el-table-column + prop="controlMeasures" + label="管控措施" + align="center" + show-overflow-tooltip> + </el-table-column> + <el-table-column + prop="controlLevel" + align="center" + label="管控层级" + show-overflow-tooltip> + </el-table-column> + <el-table-column + prop="responsibleUnit" + label="责任单位" + align="center" + show-overflow-tooltip> + </el-table-column> + <el-table-column + prop="personLiable" + label="责任人" + align="center" + show-overflow-tooltip> + </el-table-column> + </el-table> + <div style="text-align: right"> + <el-pagination + v-show="recordTotal > 0" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + :current-page="currentPage" + :page-sizes="[10, 20, 30, 50]" + :page-size="pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="recordTotal" + > + </el-pagination> + </div> + </div> + </div> + </div> + + </div> +</template> + +<script> + import Titlename from "../../components/Titlename/index.vue"; + export default { + components: {Titlename}, + name: "listAssociatedHazards", + data(){ + return{ + data: [{ + label: '一级 1', + children: [{ + label: '二级 1-1', + children: [{ + label: '三级 1-1-1' + }] + }] + }, { + label: '一级 2', + children: [{ + label: '二级 2-1', + children: [{ + label: '三级 2-1-1' + }] + }, { + label: '二级 2-2', + children: [{ + label: '三级 2-2-1' + }] + }] + }, { + label: '一级 3', + children: [{ + label: '二级 3-1', + children: [{ + label: '三级 3-1-1' + }] + }, { + label: '二级 3-2', + children: [{ + label: '三级 3-2-1' + }] + }] + }], + defaultProps: { + children: 'children', + label: 'label' + }, + form: { + name: '', + region: '', + date1: '', + date2: '', + delivery: false, + type: [], + resource: '', + desc: '' + }, + tableData: [{ + riskPoint:'油库区动火作业', + hazardSources:'油库区为重大危险源,储存有粗苯,焦油、洗油、碱液等危险化学品,具有爆炸危险性和腐蚀性,在油库区进行动火作业时,安全措施落实不到位,可能引起中毒和窒息、火灾、爆炸、灼烫、触电、其他伤害。', + accidentType:'中毒和窒息、火灾、爆炸、灼烫、触电、其他伤害', + riskLevel:'重大风险', + controlMeasures:'1.工程技术措施:作业现场配备...', + controlLevel:'公司级', + responsibleUnit:'化产一车间', + personLiable:'冉玉新', + }, { + riskPoint:'粗苯储槽', + hazardSources:'粗苯极易燃烧爆炸,当粗苯在空气中达1.4-7.5%(体积)时将形成爆炸性的混合物,如果粗苯储槽泄漏,遇到明火可能造成火灾、爆炸、中毒和窒息。', + accidentType:'火灾、爆炸、中毒和窒息', + riskLevel:'重大风险', + controlMeasures:'1.工程技术措施:每年做一次防...', + controlLevel:'公司级', + responsibleUnit:'化产一车间', + personLiable:'侯冠秋', + }, { + riskPoint:'油库产品装车操作', + hazardSources:'油库装车产品为粗苯和焦油,操作过程不当可能造成火灾、爆炸、中毒、窒息事故。油库卸车原料为洗油、碱液,操作过程中可能造成触电、其他伤害事故。', + accidentType:'火灾、爆炸、中毒和窒息、触电、其他伤害', + riskLevel:'重大风险', + controlMeasures:'1.工程技术措施:配备装车静电...', + controlLevel:'公司级', + responsibleUnit:'化产一车间', + personLiable:'侯冠秋', + }], + multipleSelection: [], + pageSize: 10, + recordTotal: 0, + currentPage: 1, + } + }, + methods: { + handleNodeClick(data) { + console.log(data); + }, + onSubmit() { + console.log('submit!'); + }, + handleSelectionChange(val) { + this.multipleSelection = val; + } + } + } +</script> + +<style scoped> + .app-container { + padding: 20px; + height: 850px; + overflow-y: auto; + } + .whole{ + display: flex; + flex-direction: row; + } + .left-tree{ + width: 15%; + } + .right{ + width: 85%; + } + .btn{ + background-color: #034ea2; + border: 1px solid #034ea2; + } + .el-button:hover { + background: #66b1ff; + border-color: #66b1ff; + color: #FFF; + } +</style> -- Gitblit v1.9.2