zmc
2023-11-16 73cb3ec2b1660610e3621d7614ad308f2c19331d
src/views/risk_assessment/SiteComprehensiveRskRanking.vue
ÎļþÃû´Ó src/views/line_graph/SiteComprehensiveRskRanking.vue ÐÞ¸Ä
@@ -1,25 +1,21 @@
<script>
import AreaAndmonitorType from '@/sfc/AreaAndmonitorType.vue'
import exceptionApi from '@/api/exceptionApi.js'
import { useCommonFunction } from '../../utils/common.js'
import index from '@/utils/risk_estimate_common_function/index.js'
import dayjs from 'dayjs'
import ButtonExportExcel from '@/sfc/ButtonExportExcel.vue'
import ButtonClick from '@/sfc/ButtonClick.vue'
import { ElMessage } from 'element-plus'
import MonthSelect from '@/sfc/MonthSelect.vue';
import SiteDetail from '@/views/line_graph/components/SiteDetail.vue'
import { useLoadingStore } from '@/stores/loadingStore';
import { mapStores } from 'pinia';
import riskApi from '@/api/risk/riskApi.js';
import riskValue from '@/utils/risk_estimate_common_function/riskValue.js';
import MonthSelect from '@/sfc/MonthSelect.vue'
import { useLoadingStore } from '@/stores/loadingStore'
import { mapStores } from 'pinia'
import riskApi from '@/api/risk/riskApi.js'
import riskValue from '@/utils/risk_estimate_common_function/riskValue.js'
export default {
  components: {
    AreaAndmonitorType,
    ButtonExportExcel,
    ButtonClick,
    MonthSelect,
    SiteDetail,
  },
  data() {
    return {
@@ -69,7 +65,7 @@
    return { exportToExcel }
  },
    computed: {
    ...mapStores(useLoadingStore),
    ...mapStores(useLoadingStore)
  },
  mounted(){
    // 
@@ -77,7 +73,6 @@
    this.calTableHeight()
  },
  methods: {
    /**
     * å°†ä¸­å›½æ ‡å‡†æ—¶é—´è½¬ä¸ºæŒ‡å®šæ ¼å¼
     * @param:
@@ -85,12 +80,11 @@
     */
     giveMonth(val){
      //将中国标准时间转为指定格式(该组件返回的标准时间的格式,所以必须的加这个函数)
      this.form.month = dayjs(val).format('YYYY-MM-DD');
      this.form.month = dayjs(val).format('YYYY-MM-DD')
      // åŒæ—¶æ›´æ–°å¼€å§‹å’Œç»“束时间 
      this.form.beginTime = dayjs(this.form.month).startOf().format('YYYY-MM-DD HH:mm:ss')
      this.form.endTime = dayjs(this.form.month).endOf('month').format('YYYY-MM-DD HH:mm:ss')
      console.log(this.form.beginTime,this.form.endTime);
      console.log(this.form.beginTime, this.form.endTime)
     },
     
    // åŠŸèƒ½ï¼šæ”¹å˜è¡¨æ ¼æŸä¸ªå•å…ƒæ ¼çš„é¢œè‰²
@@ -98,11 +92,9 @@
      // å¹³å‡å€¼ä¸æ»¡è¶³æ ‡å‡†æ—¶
      if (columnIndex == 4) {
        if (row.riskValue >= 0.8) {
          return 'warning-row';
          return 'warning-row'
        }
      }
    },
    // åŠŸèƒ½ï¼šè¡¨æ ¼é«˜åº¦æ ¹æ®å†…å®¹è‡ªé€‚åº”
    calTableHeight() {
@@ -110,67 +102,25 @@
      // å…¶ä¸­ä¸€ä¸ª40是盒子的总外边距
      this.tableHeight = `calc(100vh - ${h1}px  - 40px - 40px - var(--el-main-padding) * 2`
    },
    // ç‚¹å‡»é£Žé™©æŽ’名按钮
    // fetchData() {
    //   this.loading = true
    //   this.queryButton = true
    //   exceptionApi
    //     .analysisdataByType(this.form.month, 'month')
    //     .then((response) => {
    //       this.chartData = response.data.data
    //       this.queryButton = false
    //       this.isNoData = false
    //       if (response.data.data.length == 0) {
    //         this.isNoData = true
    //         return
    //       }
    //       exceptionApi
    //         .exceptiondata1({
    //           siteName: '',
    //           beginTime: this.form.beginTime,
    //           endTime: this.form.endTime
    //         })
    //         .then((res) => {
    //           this.isNoData = false
    //           this.table = index.merge(
    //             this.chartData,
    //             res.data.data,
    //             this.form.beginTime,
    //             this.form.endTime
    //           )
    //           this.loading = false
    //           this.$nextTick(()=>{
    //           this.$refs.table.sort('riskValue','descending')
    //         })
    //         })
    //     })
    // },
     // ç‚¹å‡»é£Žé™©æŽ’名按钮
     fetchData() {
      this.loading = true
      this.queryButton = true
      riskApi
        .queryRiskValue('',this.form.month, 'month')
        .then((response) => {
      riskApi.queryRiskValue('', this.form.month, 'month').then((response) => {
          if (response.data.data.length == 0) {
            this.isNoData = true
            return
          }
          this.table = riskValue.calMonthlyRiskValue(response.data.data)
        this.table = riskValue.backComprehensiveRiskTableData(response.data.data)
        console.log('表', this.table)
          this.queryButton = false
          this.isNoData = false
        this.loading = false
              this.$nextTick(()=>{
              this.$refs.table.sort('riskValue','descending')
        })
    })
  },
@@ -183,6 +133,11 @@
      this.fetchData()
      // å¼‚常数据
      // this.exceptiondataCount()
    },
    // å•元格内容换行
    wrapIndex(index) {
      return index.replace(/\n/g, '<br/>')
    },
    /**
@@ -219,10 +174,9 @@
      }
    },
    openDetail(row){
      const encodedSiteName = encodeURIComponent(row.siteName);
      const encodedSiteName = encodeURIComponent(row.siteName)
      this.$router.push(`/detail/${encodedSiteName}/${this.form.month}`)
      // this.$router.push(`/detail/${row.siteName}/${this.form.month}`)
    }
  }
}
@@ -275,7 +229,6 @@
      type="index"
      prop="name"
      label="序号"
      :index="indexMethod"
      fixed
      align="center"
      width="55"
@@ -283,13 +236,19 @@
    />
    <el-table-column prop="siteName" label="站点名称" align="center" show-overflow-tooltip >
      <template #default="{ row }">
        <el-button type="primary" text class="table-button" @click="openDetail(row)"
          >{{row.siteName}}</el-button
        >
        <el-button type="primary" text class="table-button" @click="openDetail(row)">{{
          row.siteName
        }}</el-button>
      </template>
      </el-table-column>
    <el-table-column prop="region" label="区域" align="center" width="80" show-overflow-tooltip />
    <el-table-column prop="monitorType" label="检测类型" align="center" width="80" show-overflow-tooltip />
    <el-table-column
      prop="monitorType"
      label="检测类型"
      align="center"
      width="80"
      show-overflow-tooltip
    />
    <el-table-column
      prop="riskValue"
      label="风险值"
@@ -298,8 +257,18 @@
      width="100"
      show-overflow-tooltip
    />
    <el-table-column prop="riskGrage" label="风险等级" align="center" width="100" show-overflow-tooltip />
    <el-table-column prop="riskAdvice" label="管控措施" align="center" show-overflow-tooltip />
    <el-table-column
      prop="riskGrade"
      label="风险等级"
      align="center"
      width="100"
      show-overflow-tooltip
    />
    <el-table-column prop="riskAdvice" label="管控措施" show-overflow-tooltip>
      <template #default="scope">
        <div v-html="wrapIndex(scope.row.riskAdvice)"></div>
      </template>
    </el-table-column>
    <el-table-column
      prop="beginTime"
      label="开始日期"
@@ -318,9 +287,6 @@
    />
  </el-table>
  <el-empty v-show="isNoData" :image-size="200" />
</template>
<style scoped>
@@ -338,5 +304,7 @@
  text-decoration: underline;
  border-radius: 0px;
}
.el-table {
  color: #333333;
}
</style>