企业应急

ChenZeping

2021-05-10 315dc0b82a482a3d145009c8f25c20e87da681d5

企业应急

 src/components/panel/RightSearchPanel.vue

@@ -60,6 +60,7 @@
import SoilGroundWaterSearch from '@components/panel/topicSearch/SoilGroundWaterSearch.vue'
import PipeChangesSearch from '@components/panel/topicSearch/pipeChangesSearch.vue'
import PipeInformationSearch from '@components/panel/topicSearch/pipeInformationSearch.vue'
import ReportSearch from './topicSearch/ReportSearch'

import bus from '@/eventBus'

@@ -70,7 +71,8 @@
    WaterWasteSearch,
    SolidWasteSearch,
    EnvRiskSearch,
    DischargeSearch
    DischargeSearch,
    ReportSearch
  },
  data () {
    return {
@@ -153,6 +155,9 @@
        case '管道信息':
          this.gcComp = PipeInformationSearch
          break
        case '企业应急':
          this.gcComp = ReportSearch
          break
      }
    },
    handlePage (page) {

 src/components/panel/topicSearch/ReportSearch.vue

New file
@@ -0,0 +1,45 @@
<template>
    <div class="sewers-search" v-if="judgeVisible">
        <div class="panel-title">{{ title }}</div>
        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="事件查询" name="first">
                <EventQuery></EventQuery>
            </el-tab-pane>
            <el-tab-pane label="资源查询" name="second">
                <ResourcesQuery></ResourcesQuery>
            </el-tab-pane>
        </el-tabs>
        <!--        <ReportPopup></ReportPopup>-->
    </div>
</template>

<script>
import EventQuery from './SewersSelect/EnterpriseEmergency/EventQuery'
import ResourcesQuery from './SewersSelect/EnterpriseEmergency/ResourcesQuery'
// import ReportPopup from './SewersSelect/EnterpriseEmergency/ReportPopup'

export default {
  name: 'ReportSearch',
  props: ['title'],
  components: {
    EventQuery,
    ResourcesQuery
    // ReportPopup
  },
  data () {
    return {
      judgeVisible: true,
      activeName: 'first'
    }
  },
  methods: {
    handleClick (tab) {
      console.log(tab)
    }
  }
}
</script>

<style lang="less" scoped>

</style>

 src/components/panel/topicSearch/SewersSearch.vue

@@ -17,7 +17,8 @@
              </el-select>
            </el-form-item>
            <el-form-item :label="form.pipelineType+'：'" size="mini">
              <el-select style="width: 100%" v-model="form.dataType" value-key="code" :popper-class="'select-down'" @change="handleDataType" >
                            <el-select style="width: 100%" v-model="form.dataType" value-key="code"
                                       :popper-class="'select-down'" @change="handleDataType">
                <el-option
                      v-for="item in subItems"
                      :key="item.code"
@@ -33,13 +34,17 @@
          </el-form>
        </div>
        <el-scrollbar style="height:380.44px;">
          <div class="environmental-risk-list" v-for="(item,index) in list" :key="index" :class="activeNum==index?'hover':''">
                    <div class="environmental-risk-list" v-for="(item,index) in list" :key="index"
                         :class="activeNum==index?'hover':''">
            <img class="state" :src="getImgSrc()" style="background: none"/>
            <div>
              <h3 @click="handleLocation(item,index)">{{ item.properties.pipename }}</h3>
              <p>所属企业：<span>{{ item.properties.orgcode }}</span>
              <p>设施类型：<span>{{ item.properties.teetype }}</span>
               <el-button v-if="fuShuSheShiShow" class="rt btn00fff6" size="mini" style="margin-right: 0.04rem;" @click="btnAffiliatedFacilities(item,index)" >附属设施</el-button>
                                <el-button v-if="fuShuSheShiShow" class="rt btn00fff6" size="mini"
                                           style="margin-right: 0.04rem;" @click="btnAffiliatedFacilities(item,index)">
                                    附属设施
                                </el-button>
              </p>
            </div>
          </div>
@@ -65,7 +70,8 @@
      </el-tab-pane>
    </el-tabs>
    <!-- 附属设施面板 -->
    <affiliated-facilities :facilitiesParameter="facilitiesParameter"  v-if="fuShuSheShiShow" ></affiliated-facilities>
        <affiliated-facilities :facilitiesParameter="facilitiesParameter"
                               v-if="fuShuSheShiShow"></affiliated-facilities>
  </div>
</template>


 src/components/panel/topicSearch/SewersSelect/AnalysisChoose/PublicWay.js

@@ -1,18 +1,5 @@
export default {
  // 爆管
  bgClick () {
    this.selectPipeLine()
  },
  // 流向地图上点击
  selectPipeLine () {
    // console.log(map)
    window.on('click', this.selectClick)
  },
  // 地图上点击回调
  selectClick (e) {
    console.log(e)
    // window.map.off('click', this.selectClick)
    // const point = [e.latlng.lng, e.latlng.lat]
    // console.log(point)
  clickPopup () {
    console.log('公共方法')
  }
}

 src/components/panel/topicSearch/SewersSelect/EnterpriseEmergency/EventQuery.vue

New file
@@ -0,0 +1,119 @@
<template>
    <div class="search-panel">
        <el-form ref="form" :model="form" label-width="90px" class="search-form">
            <el-form ref="form" :model="form" label-width="90px" class="search-form">
                <el-form-item label="企业名称：" size="mini" class="search-panel-item">
                    <el-select style="width: 100%" v-model="form.pipelineType" @change="handlePipelineType"
                               :popper-class="'select-down'">
                        <el-option
                                v-for="item in items"
                                :key="item.code"
                                :label="item.name"
                                :value="item.name">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="事件状态：" size="mini">
                    <el-select style="width: 100%" v-model="form.dataType" value-key="code"
                               :popper-class="'select-down'" @change="handleDataType">
                        <el-option
                                v-for="item in subItems"
                                :key="item.code"
                                :label="item.name"
                                :value="item">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="事件类型：">
                    <el-radio-group v-model="form.transferData" class="levelOfRisk">
                        <el-radio v-for="(item,index) in form.levelOfRisk" :label="item.value" :key="index">
                            <span class="levelOfRisk-type">{{ item.name }}</span>
                        </el-radio>
                    </el-radio-group>
                </el-form-item>
                <div class="rightButtonSearch">
                    <el-input v-model="form.keyword" size="mini" placeholder="在此输入关键字搜索"></el-input>
                    <el-button class="el-icon-search" @click="handleSearch"></el-button>
                </div>
            </el-form>
        </el-form>
        <el-scrollbar style="height:286.22px">
            <div class="environmental-risk-list">
                <i class="state"></i>
                <div>
                    <h3>事件名称:XXX事件</h3>
                    <h5>事件事件:2021年3月21日</h5>
                    <p>事件状态：<span>审批阶段</span></p>
                    <p>事件类型：<span>真实事件</span></p>
                </div>
            </div>
            <div class="environmental-risk-list">
                <i class="state"></i>
                <div>
                    <h3>事件名称:XXX事件</h3>
                    <h5>事件事件:2021年3月21日</h5>
                    <p>事件状态：<span>审批阶段</span></p>
                    <p>事件类型：<span>真实事件</span></p>
                </div>
            </div>
            <div class="environmental-risk-list">
                <i class="state"></i>
                <div>
                    <h3>事件名称:XXX事件</h3>
                    <h5>事件事件:2021年3月21日</h5>
                    <p>事件状态：<span>审批阶段</span></p>
                    <p>事件类型：<span>真实事件</span></p>
                </div>
            </div>
        </el-scrollbar>
    </div>
</template>

<script>
import { LayerEntEmer } from '../../../../../conf/layers/LayerEntEmer'

export default {
  name: 'EventQuery',
  data () {
    return {
      list: [],
      items: [
        { name: '金陵石化' },
        { name: '南京化学' }
      ],
      subItems: LayerEntEmer.layers,
      form: {
        pipelineType: '',
        dataType: '',
        keyword: '',
        transferData: 1,
        levelOfRisk: [
          {
            name: '真实事件',
            value: 1
          },
          {
            name: '模拟演练',
            value: 2
          }
        ]
      }
    }
  },
  methods: {
    handleDataType () {
      console.log('ite')
    },
    handlePipelineType () {
      console.log('数据查询')
    },
    handleSearch () {
      console.log('item')
    }
  }
}
</script>

<style scoped>

</style>

 src/components/panel/topicSearch/SewersSelect/EnterpriseEmergency/ReportPopup.vue

New file
@@ -0,0 +1,222 @@
<template>
    <div class="report-popup map-background" v-drag>
        <div class="public-bounced-title panel-title">
            <span>上报事件</span>
            <i class="el-icon-circle-close" @click="closePopup"></i>
        </div>
        <div class="report-content">
            <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="search-form">
                <el-form-item label="事件名称" prop="nameEvent">
                    <el-input v-model="ruleForm.nameEvent" class="report-input"></el-input>
                </el-form-item>
                <el-form-item label="事件类型" prop="eventType">
                    <el-radio-group v-model="ruleForm.eventType">
                        <el-radio v-for="(item,index) in ruleForm.eventTypeList" :label="item.value" :key="index">
                            <span>{{ item.name }}</span>
                        </el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="事件等级" prop="eventLevel">
                    <el-radio-group v-model="ruleForm.eventLevel">
                        <el-radio v-for="(item,index) in ruleForm.eventLevelList" :label="item.value" :key="index">
                            <span>{{ item.name }}</span>
                        </el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="事发单位" prop="region">
                            <el-select v-model="ruleForm.region" placeholder="请选择活动区域">
                                <el-option label="单位位置1" value="shanghai"></el-option>
                                <el-option label="单位位置2" value="beijing"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="事发时间" prop="region" class="search-panel-item">
                            <el-date-picker
                                    v-model="ruleForm.atTime"
                                    type="datetime"
                                    placeholder="选择日期时间">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="事发位置" prop="region" class="search-panel-item">
                            <el-input v-model="ruleForm.name" class="report-input"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="位置描述" prop="name">
                            <el-input v-model="ruleForm.name" class="report-input"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-form-item>
                    <el-upload
                            class="upload-demo"
                            action="https://jsonplaceholder.typicode.com/posts/"
                            :on-preview="handlePreview"
                            :on-remove="handleRemove"
                            :before-remove="beforeRemove"
                            multiple
                            :limit="3"
                            :on-exceed="handleExceed"
                            :file-list="fileList">
                        <el-button size="small" type="primary">点击上传</el-button>
                    </el-upload>
                </el-form-item>
                <el-form-item label="消息推送" prop="resource">
                    <el-radio-group v-model="ruleForm.resource">
                        <el-radio label="短信推送"></el-radio>
                        <el-radio label="手机应用推送"></el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="事件描述" prop="desc">
                    <el-input type="textarea" v-model="ruleForm.desc"></el-input>
                </el-form-item>
                <el-form-item label="接收人员" prop="desc">
                    <el-input type="textarea" v-model="ruleForm.desc"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="submitForm('ruleForm')">确认</el-button>
                    <el-button @click="resetForm('ruleForm')">取消</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>

<script>
import '@utils/dragBoxes'

export default {
  name: 'ReportPopup',
  data () {
    return {
      flag: false,
      ruleForm: {
        nameEvent: '',
        eventType: '',
        eventTypeList: [
          {
            name: '待补充',
            value: 1
          },
          {
            name: '待补充',
            value: 2
          },
          {
            name: '待补充',
            value: 3
          }
        ],
        eventLevel: '',
        eventLevelList: [
          {
            name: '待补充',
            value: 1
          },
          {
            name: '待补充',
            value: 2
          },
          {
            name: '待补充',
            value: 3
          }
        ],
        atTime: ''
      },
      fileList: [],
      rules: {
        name: [
          {
            required: true,
            message: '请输入活动名称',
            trigger: 'blur'
          },
          {
            min: 3,
            max: 5,
            message: '长度在 3 到 5 个字符',
            trigger: 'blur'
          }
        ],
        region: [
          {
            required: true,
            message: '请选择活动区域',
            trigger: 'change'
          }
        ],
        resource: [
          {
            required: true,
            message: '请选择活动资源',
            trigger: 'change'
          }
        ],
        desc: [
          {
            required: true,
            message: '请填写活动形式',
            trigger: 'blur'
          }
        ]
      }
    }
  },
  methods: {
    handleRemove (file, fileList) {
      console.log(file, fileList)
    },
    handlePreview (file) {
      console.log(file)
    },
    handleExceed (files, fileList) {
      this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`)
    },
    beforeRemove (file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`)
    },
    closePopup () {
      this.flag = false
    },
    submitForm (formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          alert('submit!')
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    resetForm (formName) {
      this.$refs[formName].resetFields()
    }
  }
}
</script>

<style lang="less" scoped>
    /deep/ .el-form-item__label {
        color: @color;
    }

    /deep/ .el-radio__label {
        color: @color;
    }

    .report-popup {
        width: 35%;
        z-index: 999;
        position: absolute;
        top: 35%;
        left: 20%;
    }
</style>

 src/components/panel/topicSearch/SewersSelect/EnterpriseEmergency/ResourcesQuery.vue

New file
@@ -0,0 +1,116 @@
<template>
    <div class="search-panel">
        <el-form ref="form" :model="form" label-width="90px" class="search-form">
            <el-form-item label="企业名称：" size="mini" class="search-panel-item">
                <el-select style="width: 100%" v-model="form.eventName" @change="handlePipelineType"
                           :popper-class="'select-down'">
                    <el-option
                            v-for="item in form.eventNameList"
                            :key="item.code"
                            :label="item.name"
                            :value="item.name">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="资源环境：" size="mini" class="search-panel-item">
                <el-select style="width: 100%" v-model="form.pipelineType" @change="handlePipelineType"
                           :popper-class="'select-down'">
                    <el-option
                            v-for="item in items"
                            :key="item.code"
                            :label="item.name"
                            :value="item.name">
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item :label="form.pipelineType+'：'" size="mini">
                <el-select style="width: 100%" v-model="form.dataType" value-key="code"
                           :popper-class="'select-down'" @change="handleDataType">
                    <el-option
                            v-for="item in subItems"
                            :key="item.code"
                            :label="item.name"
                            :value="item">
                    </el-option>
                </el-select>
            </el-form-item>
            <div class="rightButtonSearch">
                <el-input v-model="form.keyword" size="mini" placeholder="在此输入关键字搜索"></el-input>
                <el-button class="el-icon-search" @click="handleSearch"></el-button>
            </div>
        </el-form>
        <el-scrollbar style="height:286.22px">
            <div class="environmental-risk-list">
                <!-- v-for="(item,index) in searchDataDisplay" :key="index" @click="setBounced(item)"-->
                <i class="state"></i>
                <div>
                    <h3>事件名称:XXX事件</h3>
                    <h5>事件事件:2021年3月21日</h5>
                    <p>事件状态：<span>审批阶段</span></p>
                    <p>事件类型：<span>真实事件</span></p>
                </div>
            </div>
            <div class="environmental-risk-list">
                <i class="state"></i>
                <div>
                    <h3>事件名称:XXX事件</h3>
                    <h5>事件事件:2021年3月21日</h5>
                    <p>事件状态：<span>审批阶段</span></p>
                    <p>事件类型：<span>真实事件</span></p>
                </div>
            </div>
            <div class="environmental-risk-list">
                <i class="state"></i>
                <div>
                    <h3>事件名称:XXX事件</h3>
                    <h5>事件事件:2021年3月21日</h5>
                    <p>事件状态：<span>审批阶段</span></p>
                    <p>事件类型：<span>真实事件</span></p>
                </div>
            </div>
        </el-scrollbar>
    </div>
</template>

<script>
import { LayerEntEmer } from '../../../../../conf/layers/LayerEntEmer'

export default {
  name: 'ResourcesQuery',
  data () {
    return {
      form: {
        eventName: '',
        pipelineType: '资源类型',
        dataType: '',
        keyword: '',
        eventNameList: [
          { name: '金陵石化' },
          { name: '南京化学' }
        ]
      },
      items: [LayerEntEmer],
      subItems: LayerEntEmer.layers,
      searchDataDisplay: []
    }
  },
  methods: {
    handlePipelineType () {
      console.log('item')
    },
    handleDataType () {
      console.log('item')
    },
    handleSearch () {
      console.log('数据查询')
    },
    setBounced (item) {
      console.log(item)
    }
  }
}
</script>

<style scoped>

</style>

 src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue

@@ -443,7 +443,9 @@

      myChart: null,
      options: [],
      echartsList: [],
      myChartShow: false,

      flowPipeLine: null,

      // 用于判断
@@ -482,9 +484,7 @@
      lxTableDataResult: [],

      // 横断面 管段查询结果 的table表格数据
      tableData: [],

      echartsList: []
      tableData: []

    }
  },
@@ -499,7 +499,8 @@
  methods: {
    // tab切换
    handleClick (tab, event) {
      // console.log(tab, event)
      console.log(event)
      // console.log(tab)
      this.clearLinkPipe()
      this.clearLX()
      this.linkClear()
@@ -575,7 +576,6 @@

    // 连通性 ===> 地图点击起始管段e
    linkClickStart (e) {
      // console.log(e)
      // console.log('地图点击起始管段')
      this.linkType = 1
      this.selectPipeLine()
@@ -656,6 +656,7 @@
      // 判断数据结果 === 0 则没有请求到数据
      if (res.data.length === 0) {
        this.$message('没有找到连通的管段')
        // 进行判断
        // if (this.tableDataLinkStart === [] && this.tableDataLinkEnd === []) {
        this.currentLinkIsTrue = '不连通'
        // }

 src/components/panel/topicSearch/SolidWasteSearch.vue

@@ -73,12 +73,6 @@
      ],
      // 数据搜索之后，存储数据的
      searchDataDisplay: [],
      instance: null,
      intervals: [],
      layer: window.map,
      L: window.L,
      times: 5,
      colors: ['#98FB98', '#ff0000'],
      solidWasteTypeOptions: [{
        value: '1',
        label: '区域',
@@ -163,7 +157,7 @@
    },
    // 数据展示,点击进行弹框及点的展示
    setBounced (val) {
      console.log(val)
      // console.log(val)
      const pos = [val.Latitude, val.Longitude]
      window.map.flyTo(pos, 15)
      window.$layer.open({

 src/components/table/Public.vue

@@ -12,8 +12,8 @@

<script>

// 引入拖拽
import '@/utils/dragBoxes'
// 弹框头部拖拽
// import '@/utils/dragBoxes'

export default {
  name: 'Public'

 src/conf/MapConfig.js

@@ -22,10 +22,10 @@
  minZoom: 3,
  maxZoom: 17,
  // center: [26, 104],
  center: [34.828558921813965, 117.41676807403564],
  zoom: 5,
  // center: [32.25853085517883, 118.78592848777771],
  // zoom: 15,
  // center: [34.828558921813965, 117.41676807403564],
  // zoom: 5,
  center: [32.25853085517883, 118.78592848777771],
  zoom: 15,
  worldCopyJump: true,
  inertia: true,
  zoomControl: false,

 src/conf/Topic.js

@@ -8,7 +8,8 @@
  dischargeSearch: () => import('@components/panel/topicSearch/DischargeSearch'),
  envProtectSearch: () => import('@components/panel/topicSearch/EnvRiskSearch'),
  soilGroundWaterSearch: () => import('@components/panel/topicSearch/SoilGroundWaterSearch'),
  sewersSearch: () => import('@components/panel/topicSearch/SewersSearch.vue')
  sewersSearch: () => import('@components/panel/topicSearch/SewersSearch.vue'),
  ReportSearchL: () => import('@components/panel/topicSearch/ReportSearch.vue')
}

export const TopicList = [{
@@ -60,6 +61,13 @@
  isShow: true,
  icon: 'iconguanxianxuncha',
  comp: ''
}, {
  name: '企业应急',
  id: 8,
  checked: false,
  isShow: true,
  icon: 'iconguanxianxuncha',
  comp: ''
} /* {
  name: '管道变更',
  id: 8,

 src/conf/layers/LayerEntEmer.js

New file
@@ -0,0 +1,68 @@
/**
 * 企业预警
 */
import { LayerHbss } from './LayerHbss'
import { LayerFsss } from './LayerFsss'

import { PIPELINE_WFS } from '../Constants'
const WFS_URL = PIPELINE_WFS

export const LayerEntEmer = {
  code: 'reportEntemeage',
  name: '企业预警',
  checked: false,
  type: 0,
  childLayer: [LayerFsss, LayerHbss],
  layers: [
    {
      code: 'rainline',
      name: '事前阶段',
      sname: '全部资源',
      checked: false,
      type: 0,
      wmsLayers: 'sewer:pipeline_rain',
      // wfs: WFS_URL + '?TYPENAME=管网&FILTER=<Filter xmlns="http://www.opengis.net/ogc"><PropertyIsEqualTo><PropertyName>mediumtype</PropertyName><Literal>雨水管线</Literal></PropertyIsEqualTo></Filter>',
      icon: 'sewers/雨水线.png',
      color: '#0070ff',
      minZoom: 13,
      styles: {
        COLOR: '#0070ff',
        FILL_COLOR: '#0070ff'
      }
    },
    {
      code: 'accidentline',
      name: '应急物资在',
      sname: '事故水',
      checked: false,
      // wmsLayers: 'sewer:pipeline_accident',
      type: 0,
      minZoom: 13,
      wfs: WFS_URL + '?TYPENAME=事故水'
    },
    {
      code: 'oilline',
      name: '应急车辆',
      sname: '含油污水',
      checked: false,
      type: 0,
      minZoom: 13,
      color: '#ffaa00',
      wmsLayers: 'sewer:pipeline_sewer',
      // wfs: 'http://xearth.cn:6240/geoserver/sewer/wfs?typeName=sewer:pipeline&maxFeatures=500&outputFormat=application%2Fjson&cql_filter=mediumtype=\'含油污水\'',
      styles: {
        COLOR: '#ffaa00',
        FILL_COLOR: '#ffaa00'
      }
    },
    {
      code: 'saltline',
      name: '应急队伍',
      sname: '含盐污水',
      checked: false,
      type: 0,
      minZoom: 13,
      wfs: WFS_URL + '?TYPENAME=含盐污水'
    }
  ]
}

 src/views/MapTemplate.vue

@@ -17,6 +17,7 @@
    <!--    <el-button type="primary" @click="ChangeWaterState" class="Waste-water">废水</el-button>-->
    <!--    <el-button type="primary" @click="AddGasHelper" class="flue-gas">废气</el-button>-->
    <PublicBounced ref="PublicBounced"></PublicBounced>
        <!--    <ReportPopup></ReportPopup>-->
  </div>
</template>

@@ -37,6 +38,7 @@
import PublicBounced from '@components/BaseNav/PublicBounced/PublicBounced'
import LayerFactory from '@components/LayerController/service/LayerFactory'
import EventHandler from '../components/LayerController/event/EventHandler'
// import ReportPopup from '../components/panel/topicSearch/SewersSelect/EnterpriseEmergency/ReportPopup'

export default {
  name: 'MapTemplate',
@@ -51,6 +53,7 @@
    // summarySheets,
    SummarySheet,
    PublicBounced
    // ReportPopup
  },
  data () {
    return {