重大

Kxc0822a

2022-04-18 2dbdb6cb7e8e5e118fc0bd0c0a21be980b95143c

重大

 src/router/index.js

@@ -237,6 +237,13 @@
                  hidden: true
              },
              {
                  path: '/reboundHiddenDanger',
                  // name: '风险预控-重复反弹隐患-列表页面',
                  component: () => import('@/views/hiddenDangerRegistration/reboundHiddenDanger'),
                  // meta: { title: '风险预控-重复反弹隐患-列表页面', icon: '' }
                  hidden: true
              },
              {
                  id: 3,
                  parentId: 0,
                  path: '/hiddenDangerRectification',

 src/views/hiddenDangerRegistration/reboundHiddenDanger.vue

对比新文件
@@ -0,0 +1,205 @@
<template>
    <div class="app-container">
        <div>
            <Titlename title="列表页面"></Titlename>
            <div class="whole">
                <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{
                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;
    }
    /*.right{*/
    /*    width: 85%;*/
    /*}*/
    .btn{
        background-color: #034ea2;
        border: 1px solid #034ea2;
    }
    .el-button:hover {
        background: #66b1ff;
        border-color: #66b1ff;
        color: #FFF;
    }
</style>