企业应急-事件处置-事件信息页面

yangdelong

2021-05-29 737a5478ab7f423acd7750003b0df9705ebbaecd

企业应急-事件处置-事件信息页面

 src/assets/css/map/map-panel-style.less

@@ -829,6 +829,27 @@
  padding: 5px;
  color: #f2f2f2;
}
.el-collapse-item__header {
  display: flex;
  align-items: center;
  height: 48px;
  line-height: 48px;
  background-color: @background-color;
  color: @color;
  cursor: pointer;
  border-bottom: 1px solid @color;
  font-size: 13px;
  font-weight: 500;
  transition: border-bottom-color .3s;
  outline: 0;
}
.el-collapse-item__wrap{
  background-color: @background-color;

}
.el-collapse-item__content{
  color: @color;
}

/************搜索数据分页功能总数量样式添加************/
.page_total {

 src/components/base-page/enterprise-emergency/DisposalEvent.vue

@@ -1,5 +1,10 @@
<template>
  <div>
    <el-scrollbar >
  <div class="disposal-event">
<!--      <el-collapse v-model="activeNames" @change="handleChange">-->
<!--        <el-collapse-item title="事件基本信息" name="1">-->
          <div>
    <h4 class="sub-title ">事件基本信息</h4>
    <div :model="form">
      <el-row>
@@ -50,7 +55,11 @@
        </el-col>
      </el-row>
    </div>
    <h3 class="sub-title">预案匹配</h3>
          </div>
<!--        </el-collapse-item>-->
<!--        <el-collapse-item title="预案匹配" name="2">-->
          <div>
<!--            <h3 class="sub-title">预案匹配</h3>-->
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="name" label="预案名称"></el-table-column>
      <el-table-column prop="define" label="预案定义"></el-table-column>
@@ -62,11 +71,34 @@
        </template>
      </el-table-column>
    </el-table>
          </div>
<!--        </el-collapse-item>-->
<!--        <el-collapse-item title="环境分析报告" name="3">-->
          <div>
            <h3 class="sub-title">环境分析报告</h3>
            <el-table :data="envTableData" style="width: 100%">
              <el-table-column prop="no" label="序号"></el-table-column>
              <el-table-column prop="radius" label="查询半径"></el-table-column>
              <el-table-column prop="reporterTime" label="生成报告时间"></el-table-column>
              <el-table-column prop="classification" label="操作">
                <template slot-scope="scope" >
                  <el-button class="link-btn" @click="handleClickView(scope.row)" type="text" size="small">查看</el-button>
                  <el-button class="link-btn" @click="handleClickDownload(scope.row)" type="text" size="small">下载</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
<!--        </el-collapse-item>-->
<!--      </el-collapse>-->

    </div>
    </el-scrollbar>
    <div class="event-management">
      <el-button type="primary" size="mini" @click="ToManagement">开始分析</el-button>
      <!--            <el-button size="mini">关闭</el-button>-->
    </div>
  </div>

</template>

<script>
@@ -77,6 +109,7 @@
  name: 'DisposalEvent',
  data () {
    return {
      activeNames: ['1'],
      form: {
        nameOfEvent: '***************事件',
        eventLocation: '**********装置',
@@ -116,6 +149,23 @@
          hierarchy: '基层单位',
          classification: '生产'
        }
      ],
      envTableData: [
        {
          no: '1',
          radius: '500m',
          reporterTime: '2021-6-1 18:00:00',
          data: [],
          downloadUrl: ''
        },
        {
          no: '2',
          radius: '1km',
          reporterTime: '2021-6-1 18:00:00',
          data: [],
          downloadUrl: ''
        }

      ]
    }
  },
@@ -123,6 +173,15 @@
    // 开始分析
    ToManagement () {
      eventBus.$emit('event-handling', {})
    },
    handleClickView (item) {
      console.log(item)
    },
    handleClickDownload (item) {
      console.log(item)
    },
    handleChange (val) {
      console.log(val)
    }
  }
}
@@ -131,7 +190,7 @@
<style lang="less" scoped>
.disposal-event {
  padding: 5px;

height: 400px;
  .fixed-width {
    width: 3.2459893rem;
    min-width: 3.2459893rem;
@@ -144,11 +203,6 @@
  /deep/ .el-form-item__label {
    color: @color;
    font-size: 0.08rem;
  }

  .event-management {
    text-align: right;
    margin: 15px;
  }

  .sub-title {
@@ -170,5 +224,8 @@
    text-align: left;
  }
}

.event-management {
  text-align: right;
  margin: 15px;
}
</style>