所有报表数据提取出来并更换数据请求方式

XingChuan

2021-05-27 3c924d71affd630b2411b68061d119f8f2a6d6a2

所有报表数据提取出来并更换数据请求方式

 src/api/mapApi.js

@@ -106,5 +106,11 @@
  },
  getEnvironmentalRiskStatistics (data) {
    return axios.get('/assets/pollutionSource.json', data)
  },
  getIndexStatistics (data) {
    return axios.get('/assets/indexStatistics.json', data)
  },
  getwarnStatistics (data) {
    return axios.get('/assets/warn.json', data)
  }
}

 src/components/table/components/EnvironmentalRisk.vue

@@ -1,6 +1,6 @@
<template>
  <div class="PollutionSource">
    <el-table class="tableBox" :data="EnvironmentalRisktableDataList" :header-cell-style="tableHeaderColor" :cell-style="rowClass" border>
    <el-table class="tableBox" :data="tableData" :header-cell-style="tableHeaderColor" :cell-style="rowClass" border>
      <el-table-column width="30px" label="">
        <template>
          <i class="el-icon-caret-right"></i>
@@ -18,6 +18,7 @@
</template>

<script>
import mapApi from '@/api/mapApi'
export default {
  name: 'AirQuality',
  data () {
@@ -25,7 +26,9 @@
      tableData: null
    }
  },
  props: ['EnvironmentalRisktableDataList'],
  async mounted () {
    this.tableData = await mapApi.getEnvironmentalRiskStatistics()
  },
  methods: {
    tableHeaderColor ({ row, column, owIndex, columnIndex }) {
      // return 'background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;font-wight:500;font-size:12px;text-align:center;height:0px'

 src/components/table/components/IndexStatistics.vue

@@ -66,37 +66,19 @@
</template>

<script>

import mapApi from '@/api/mapApi'
export default {
  name: 'IndexStatistics',
  data () {
    return {
      titleProp: '',
      activeName: 'first',
      tableData: [{
        date: '集团公司',
        name: '35',
        province: '23',
        city: '11',
        address: 235,
        zip: 23
      }, {
        date: '天津石化',
        name: 32,
        province: 33,
        city: 44,
        address: 53,
        zip: 200333
      }, {
        date: '济南炼化',
        name: 35,
        province: 13,
        city: 33,
        address: 44,
        zip: 200333
      }]
      tableData: null
    }
  },
  async mounted () {
    this.tableData = await mapApi.getIndexStatistics()
  },
  methods: {
    refsDatatitle (item) {
      this.titleProp = item

 src/components/table/components/PollutionSource.vue

@@ -1,6 +1,6 @@
<template>
    <div class="PollutionSource">
        <el-table class="tableBox" :data="PollutionSourcetableDataList" :header-cell-style="tableHeaderColor" :cell-style="rowClass" border>
        <el-table class="tableBox" :data="tableData" :header-cell-style="tableHeaderColor" :cell-style="rowClass" border>
            <el-table-column width="30px" label="">
                <template>
                    <i class="el-icon-caret-right"></i>
@@ -16,6 +16,7 @@
</template>

<script>
import mapApi from '@/api/mapApi'
export default {
  name: 'AirQuality',
  data () {
@@ -23,7 +24,9 @@
      tableData: null
    }
  },
  props: ['PollutionSourcetableDataList'],
  async mounted () {
    this.tableData = await mapApi.getPollutionSourceStatistics()
  },
  methods: {
    tableHeaderColor ({ row, column, owIndex, columnIndex }) {
      // return 'background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;font-wight:500;font-size:12px;text-align:center;height:0px'

 src/components/table/components/SoilGroundwater.vue

@@ -84,6 +84,7 @@
<script>
// import ChemicalWastewater from './componented/ChemicalWastewater'
import Refinery from '@components/table/components/componented/refinery'
import mapApi from '@/api/mapApi'
// import MissingAlarm from '@components/table/components/componented/MissingAlarm'
export default {
  name: 'WasteWater',
@@ -116,7 +117,9 @@
      ]
    }
  },
  props: ['SolidWastetableDataList'],
  async mounted () {
    this.tableData = await mapApi.getSolidWasteStatistics()
  },
  methods: {
    tableHeaderColor ({ row, column, owIndex, columnIndex }) {
      //  return 'background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;font-wight:500;font-size:12px;text-align:center;height:0px'

 src/components/table/components/Warn.vue

@@ -149,42 +149,18 @@
</template>

<script>
import mapApi from '@/api/mapApi'
export default {
  data () {
    return {
      titleProp: '',
      activeName: 'first',
      tableData: [{
        date: '集团公司',
        name: 1,
        province: 1,
        city: 0,
        address: 1,
        zip: 0
      }, {
        date: '天津石化',
        name: 1,
        province: 0,
        city: 1,
        address: 1,
        zip: 2
      }, {
        date: 'XXX炼化',
        name: 1,
        province: 2,
        city: 0,
        address: 0,
        zip: 1
      }, {
        date: 'XXX炼化2',
        name: 1,
        province: 2,
        city: 0,
        address: 0,
        zip: 1
      }]
      tableData: null
    }
  },
  async mounted () {
    this.tableData = await mapApi.getwarnStatistics()
  },
  methods: {
    refsDatatitle (item) {
      this.titleProp = item

 src/components/table/components/WasteGas.vue

@@ -1,6 +1,6 @@
<template>
    <div class="Waste-water">
        <el-table class="tableBox" :data="WasteGastableDataList" :header-cell-style="tableHeaderColor" :cell-style="rowClass" @cell-click="handle">
        <el-table class="tableBox" :data="tableData" :header-cell-style="tableHeaderColor" :cell-style="rowClass" @cell-click="handle">
            <el-table-column width="30px" label="">
              <template slot-scope="{row,$index}">
                <!--                   <i class="el-icon-caret-right" v-if="$index ===1"></i>-->
@@ -63,6 +63,7 @@
import ChemicalWastewater from '@components/table/components/componented/ChemicalWastewater'
import Refinery from '@components/table/components/componented/refinery'
import MissingAlarm from '@components/table/components/componented/MissingAlarm'
import mapApi from '@/api/mapApi'
export default {
  name: 'WasteGas',
  components: {
@@ -74,6 +75,7 @@
    return {
      isActive: '',
      isShowIcon: false,
      tableData: null,
      tableHeader1: [
        { name: '排放点', width: '140', propS: 'value1' },
        { name: '单位部门', width: '80', propS: 'value2' },
@@ -88,7 +90,9 @@
      ]
    }
  },
  props: ['WasteGastableDataList'],
  async mounted () {
    this.tableData = await mapApi.getWasteGasStatistics()
  },
  methods: {
    tableHeaderColor ({ columnIndex }) {
      //   return 'background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;font-wight:500;font-size:12px;text-align:center;height:0px'

 src/components/table/components/WasteWater.vue

@@ -1,6 +1,6 @@
<template>
   <div class="waste-water">
           <el-table class="tableBox" :data="WasteWatertableDataList" style="width: 100%" @cell-click="handle">
           <el-table class="tableBox" :data="tableData" style="width: 100%" @cell-click="handle">
               <el-table-column width="30px" label="">
                 <template slot-scope="{row,$index}">
<!--                   <i class="el-icon-caret-right" v-if="$index ===1"></i>-->
@@ -70,6 +70,7 @@
import ChemicalWastewater from './componented/ChemicalWastewater'
import Refinery from '@components/table/components/componented/refinery'
import MissingAlarm from '@components/table/components/componented/MissingAlarm'
import mapApi from '@/api/mapApi'
export default {
  name: 'WasteWater',
  components: {
@@ -80,10 +81,13 @@
  data () {
    return {
      isActive: '',
      isShowIcon: false
      isShowIcon: false,
      tableData: null
    }
  },
  props: ['WasteWatertableDataList'],
  async mounted () {
    this.tableData = await mapApi.getWasteWaterStatistics()
  },
  methods: {
    tableHeaderColor ({ row, column, owIndex, columnIndex }) {
    //  return 'background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;font-wight:500;font-size:12px;text-align:center;height:0px'

 src/components/table/components/tabHandover.vue

@@ -4,12 +4,7 @@
      <el-tab-pane v-for="(item,index) in topicList" :key="index" :label="item.name" :name="item.name"></el-tab-pane>
    </el-tabs>
    <div>
      <component :is="gcComp" :PollutionSourcetableDataList="PollutionSourcetableDataList" v-if="PollutionSourcetableDataList"
                              :WasteWatertableDataList="WasteWatertableDataList"
                              :WasteGastableDataList="WasteGastableDataList"
                              :SolidWastetableDataList="SolidWastetableDataList"
                              :EnvironmentalRisktableDataList="EnvironmentalRisktableDataList"
      ></component>
      <component :is="gcComp"></component>
    </div>
  </div>
</template>
@@ -22,7 +17,6 @@
import SolidWaste from '@components/table/components/WasteSolid'
import PollutionSource from '@components/table/components/PollutionSource'
import EnvironmentalRisk from '@components/table/components/EnvironmentalRisk'
import mapApi from '@/api/mapApi'

import { TopicList } from '../../../conf/Topic'
export default {
@@ -40,61 +34,29 @@
      titleProp: '',
      activeName: '污染源',
      topicList: TopicList, // tab项
      gcComp: PollutionSource, // 默认显示污染源内容
      PollutionSourcetableDataList: null, // 污染源统计数据
      WasteWatertableDataList: null, // 废水统计数据
      WasteGastableDataList: null, // 废气统计数据
      SolidWastetableDataList: null, // 固废统计数据
      EnvironmentalRisktableDataList: null // 环境风险源统计数据
      gcComp: PollutionSource // 默认显示污染源内容
    }
  },
  mounted () {
    this.getStatisticsData(this.activeName)
  },
  methods: {
    refsDatatitle (item) {
      this.titleProp = item
    },
    async getStatisticsData (obj) {
      switch (obj) {
        case '污染源':
          this.PollutionSourcetableDataList = await mapApi.getPollutionSourceStatistics()
          break
        case '废水':
          this.WasteWatertableDataList = await mapApi.getWasteWaterStatistics()
          break
        case '废气':
          this.WasteGastableDataList = await mapApi.getWasteGasStatistics()
          break
        case '固废':
          this.SolidWastetableDataList = await mapApi.getSolidWasteStatistics()
          break
        case '环境风险':
          this.EnvironmentalRisktableDataList = await mapApi.getEnvironmentalRiskStatistics()
          break
      }
    },
    handleClick (tab, event) {
      switch (tab.label) {
        case '污染源':
          this.gcComp = PollutionSource
          this.getStatisticsData('污染源')
          break
        case '废水':
          this.gcComp = WasteWater
          this.getStatisticsData('废水')
          break
        case '废气':
          this.gcComp = WasteGas
          this.getStatisticsData('废气')
          break
        case '固废':
          this.gcComp = SolidWaste
          this.getStatisticsData('固废')
          break
        case '环境风险':
          this.gcComp = EnvironmentalRisk
          this.getStatisticsData('环境风险')
          break
        case '土壤及地下水':
          this.gcComp = SoilGroundwater