1.修改了雷达图传入的数据 2.数据指标排名一进来按日均值倒序排列 3.修改了一些局部的样式

zmc

2023-11-23 43c2f5b94d87263cf189f7ba51c8dc6c5e6144c8

 src/views/exception/SiteAuditAssistance.vue

@@ -13,6 +13,13 @@
import ButtonClick from '@/sfc/ButtonClick.vue'
import index from '@/utils/exception_common_function/index.js'
import DaySelect from '@/sfc/DaySelect.vue';
// import {useLoginUserStore} from '@/stores/user.js'
import { useLoginUserStore } from '@/stores/user'
import historyApi from '@/api/historyApi.js'
import time from '@/utils/time.js'
import lineChart from '@/utils/chartFunction/lineChart.js'
import exceptionOption from '@/utils/chartFunction/exceptionOption.js'

export default {
  components: {
    ExceptionType,
@@ -114,35 +121,15 @@
  },
  setup() {
    const { isExceedOneMonth } = useCommonFunction()
    const userName = useLoginUserStore()

    return {
      isExceedOneMonth
      isExceedOneMonth,userName
    }
  },
  // 监听  判断按钮是否可点击
  watch: {
    selectedRowIndex(newVaue) {
      // // 处于表格的最后一条数据 设置‘上一条’按钮不可点
      // if (newVaue === this.displayData.length - 1) {
      //   this.dialog.isPreCantouch = true
      //   //用户先点了第一条，pre为true,然后点击最后一条,next为true。此时两个按钮都被封锁
      //   if (this.dialog.isNextCantouch == true) {
      //     this.dialog.isNextCantouch = false
      //   }
      // }
      // // 处于表格第一条数据 设置‘下一条’按钮不可点
      // else if (newVaue === 0) {
      //   this.dialog.isNextCantouch = true
      //   //用户先点了表格最后一条,next为true,然后点击第一条，pre为true。此时两个按钮都被封锁
      //   if (this.dialog.isPreCantouch == true) {
      //     this.dialog.isPreCantouch = false
      //   }
      // }
      // // 处于表格的中间行 将按钮设置为可点击状态
      // else {
      //   this.dialog.isPreCantouch = false
      //   this.dialog.isNextCantouch = false
      // }

        // 处于表格的最后一条数据 设置‘上一条’按钮不可点
        if (newVaue === 0) {
          this.dialog.isPreCantouch = true
@@ -212,15 +199,63 @@
  mounted() {
    this.backExceptionDataAWeekAgo()
    this.calTableHeight()
 
  },

  methods: {
        /**
     * 有效率异常 设置折线图配置项
     * @param： 
     * @returns：
     */
    validProcess() {
      // x轴数据
      let xList = time.ascTime(
        this.tableCurrentRowData.beginTime,
        this.tableCurrentRowData.endTime,
        15
      )

      // y轴数据
      let yList = []
      xList.forEach((item) => {
        // 查找该时间的数据
        let r = lineChart.findDate(this.dialog.historyData, item)
        if (r) {
          yList.push(r.dustValue)
        } else {
          yList.push(null)
        }
      })
      // 颜色背景区间
      // 得到无数据的时间点或flag不等于N的时间点
      let noDataTime = time.invalidTime(this.dialog.historyData, xList)
      let rangeTime = time.seriesTime(noDataTime, 15)
      // let rangeTime_1 = time.splitTime(rangeTime)
      // 得到背景区间的配置
      let areaObj = lineChart.getMarkArea(rangeTime, '异常')

      // 传入参数
      this.dialog.option = exceptionOption.setExceptionChartOption(
        xList,
        yList,
        '',
        '',
        '',
        '',
        this.tableCurrentRowData.exception,
        areaObj,
        this.tableCurrentRowData.exceptionType
      )
    },

    giveDay(val){
      // 将中国标准时间转为指定格式(该组件返回的标准时间的格式，所以必须的加这个函数)

        this.beginTime = dayjs(val).format('YYYY-MM-DD 00:00:00');
        this.endTime = dayjs(val).format('YYYY-MM-DD 23:59:59');
    },

    /**
     * 审计内容保存为草稿
     * @param：
@@ -242,6 +277,7 @@
        this.auditData = res.data.data
      })
    },

    /**
     * 多选列（已审核的行不会加入其中）
     * @param
@@ -296,25 +332,7 @@
      })
    },
    close() {
      // if (this.auditDialog.checkerNotes || this.auditDialog.enterpriseNotes) {
      //   ElMessageBox.confirm('这将会，确定要关闭吗', '提示',
      //     {
      //       confirmButtonText: '确定',
      //       cancelButtonText: '取消',
      //       type: 'warning',
      //       center :'true',
      //       icon: markRaw(Delete),
      //       draggable: true,
      //     }).then(() => {
      //       ElMessage({
      //         type: 'success',
      //         message: '已关闭',
      //       })
      //       this.auditDialog.visible = false
      //     })
      // }else{
      //   this.auditDialog.visible = false
      // }
      
      this.auditDialog.visible = false
    },
    // 表格行的颜色
@@ -399,6 +417,10 @@
    submitAudit() {
      // 同时填写了审核人员和企业的备注
      this.loading.submitAudit = true
      // 把登陆的用户姓名给审核人
      if(this.userName.getUserName != '-1'){
        this.auditDialog.checker = this.userName.getUserName
      }
      if (this.auditDialog.checkerNotes && this.auditDialog.enterpriseNotes) {
        this.sendAudit(
          this.auditDialog.checker,
@@ -469,11 +491,21 @@
    openAuditDiag(row) {
      this.auditDialog.visible = true
      this.tableCurrentRowData = row

      // 进入审核页时，将表格当前行的审核信息给输入框
      this.auditDialog.checkerNotes = this.tableCurrentRowData.checkerContent
      this.auditDialog.enterpriseNotes = this.tableCurrentRowData.enterpriseContent
      
      // // 未审核  就把当前登陆名给审核人
      // if(this.tableCurrentRowData.uiRealName == null){
      //   this.auditDialog.checker = this.userName.getUserName
      // }
      // // 已审核
      // else{
      //   this.auditDialog.checker = this.tableCurrentRowData.uiRealName
      // }

    },


    /**
     * description：点击异常站点名字时 返回的数据
@@ -1084,20 +1116,42 @@

        // 得到上一行的数据
        this.tableCurrentRowData = this.displayData[this.selectedRowIndex]
        let params = index.requestGetParms(
          this.tableCurrentRowData.name,
          this.tableCurrentRowData.beginTime,
          this.tableCurrentRowData.endTime
        )
        this.loading.preButton = true
        this.$http.get('/dust/history', { params: params }).then((response) => {

        historyApi.queryHistoryData({
          siteName:this.tableCurrentRowData.name,
          beginTime:this.tableCurrentRowData.beginTime,
          endTime:this.tableCurrentRowData.endTime
        }).then(response => {
          // 保存返回的超标数据
          this.dialog.historyData = response.data.data
          this.dialog.exceptionTotal = response.data.data.length
          // 逻辑处理
          this.timeAndDataProcessed()

          if (this.tableCurrentRowData.exceptionType != '8') {
            this.timeAndDataProcessed()
          } else {
            this.loading.lineChart = true
            this.validProcess()
            this.loading.lineChart = false
            this.flag.banTouch = 0
          }
          this.loading.preButton = false
        })
        
        // let params = index.requestGetParms(
        //   this.tableCurrentRowData.name,
        //   this.tableCurrentRowData.beginTime,
        //   this.tableCurrentRowData.endTime
        // )
        // this.$http.get('/dust/history', { params: params }).then((response) => {
        //   // 保存返回的超标数据
        //   this.dialog.historyData = response.data.data
        //   this.dialog.exceptionTotal = response.data.data.length
        //   // 逻辑处理
        //   this.timeAndDataProcessed()
        //   this.loading.preButton = false
        // })
      }
    },
    /**
@@ -1115,21 +1169,44 @@

        // 得到上一行的数据
        this.tableCurrentRowData = this.displayData[this.selectedRowIndex]

        let params = index.requestGetParms(
          this.tableCurrentRowData.name,
          this.tableCurrentRowData.beginTime,
          this.tableCurrentRowData.endTime
        )
        this.loading.afterButton = true
        this.$http.get('/dust/history', { params: params }).then((response) => {

        historyApi.queryHistoryData({
          siteName:this.tableCurrentRowData.name,
          beginTime:this.tableCurrentRowData.beginTime,
          endTime:this.tableCurrentRowData.endTime
        }).then(response => {
          // 保存返回的超标数据
          this.dialog.historyData = response.data.data
          this.dialog.exceptionTotal = response.data.data.length
          // 逻辑处理
          this.timeAndDataProcessed()

          if (this.tableCurrentRowData.exceptionType != '8') {
            this.timeAndDataProcessed()
          } else {
            this.loading.lineChart = true
            this.validProcess()
            this.loading.lineChart = false
            this.flag.banTouch = 0
          }
          this.loading.afterButton = false
        })


        // let params = index.requestGetParms(
        //   this.tableCurrentRowData.name,
        //   this.tableCurrentRowData.beginTime,
        //   this.tableCurrentRowData.endTime
        // )
        
        // this.$http.get('/dust/history', { params: params }).then((response) => {
        //   // 保存返回的超标数据
        //   this.dialog.historyData = response.data.data
        //   this.dialog.exceptionTotal = response.data.data.length
        //   // 逻辑处理
        //   this.timeAndDataProcessed()
        //   this.loading.afterButton = false
        // })
      }
    },

@@ -1152,24 +1229,44 @@
      // 对请求到的数据进行首尾拼接
      // 得到前后完整数据进行绘制图形

      let params = {}
      if (row.name) {
        params['siteName'] = row.name
      }
      if (row.beginTime) {
        params['beginTime'] = row.beginTime
      }
      if (row.endTime) {
        params['endTime'] = row.endTime
      }
      historyApi.queryHistoryData({
          siteName:row.name,
          beginTime:row.beginTime,
          endTime:row.endTime
        }).then(response => {
          // 保存返回的超标数据
          this.dialog.historyData = response.data.data
          this.dialog.exceptionTotal = response.data.data.length
          // 逻辑处理

      this.$http.get('/dust/history', { params: params }).then((response) => {
        // 保存返回的超标数据
        this.dialog.historyData = response.data.data
        this.dialog.exceptionTotal = response.data.data.length
        // 逻辑处理
        this.timeAndDataProcessed()
      })
          if (this.tableCurrentRowData.exceptionType != '8') {
            this.timeAndDataProcessed()
          } else {
            this.loading.lineChart = true
            this.validProcess()
            this.loading.lineChart = false
            this.flag.banTouch = 0
          }
        })

      // let params = {}
      // if (row.name) {
      //   params['siteName'] = row.name
      // }
      // if (row.beginTime) {
      //   params['beginTime'] = row.beginTime
      // }
      // if (row.endTime) {
      //   params['endTime'] = row.endTime
      // }

      // this.$http.get('/dust/history', { params: params }).then((response) => {
      //   // 保存返回的超标数据
      //   this.dialog.historyData = response.data.data
      //   this.dialog.exceptionTotal = response.data.data.length
      //   // 逻辑处理
      //   this.timeAndDataProcessed()
      // })
    },

    /**
@@ -1181,12 +1278,12 @@
        alert('时间跨度不能超过一个月')
        return
      }

      this.flag.originClick = 0

      
      let params = {}
      params['page'] = this.currentPage
      params['pageSize'] = this.pageSize
      
      if (this.form.name) {
        params['siteName'] = this.form.name
      }
@@ -1197,6 +1294,9 @@
      params['endTime'] = this.endTime
      this.loading.tableLoading = true
      this.loading.queryButton = true

      console.log('站点：',params['siteName']);
      console.log('类型',params['exceptionType']);
      this.$http.get('/dust/exceptiondata', { params: params }).then((response) => {
        // 保存返回的
        // this.tableData = response.data.data.rows;
@@ -1226,6 +1326,8 @@
      if (this.form.name) {
        params['siteName'] = this.form.name
      }


      if (this.form.exceptionName) {
        params['exceptionType'] = this.form.exceptionName
      }
@@ -1264,7 +1366,7 @@
      const h2 = this.$refs.h2.$el.offsetHeight
      const h4 = this.$refs.h4.$el.offsetHeight
      // 其中一个40是盒子的总外边距
      this.tableHeight = `calc(100vh - ${h1}px - ${h2}px  - ${h4}px - 20px - 100px - var(--el-main-padding) * 2)`
      this.tableHeight = `calc(100vh - ${h1}px - ${h2}px  - ${h4}px - 20px - 10px - var(--el-main-padding) * 2)`
      // this.tableHeight = `calc(100vh - ${h1}px  - ${h4}px - 100px - var(--el-main-padding) * 2)`;
    },

@@ -1340,8 +1442,7 @@
            </el-form-item>

            <el-form-item>
              <!-- <el-button type="warning" :loading="loading.queryButton" @click="handleSubmit"><el-icon
                style="margin-right: 6px;font-size: 1.2em;"><i-ep-Search /></el-icon>查询</el-button> -->
             
              <ButtonClick
                content="搜索"
                type="warning"
@@ -1368,7 +1469,7 @@
    <el-col>
      <div class="checknum">
        <div class="checknum-text">
          <el-tag>应审核数</el-tag><span>{{ total }} ({{ checkedRate }}%)</span>
          <el-tag>应审核数</el-tag><span >{{ total }} ({{ checkedRate }}%)</span>
        </div>

        <div class="checknum-text">
@@ -1409,10 +1510,10 @@
          fixed
          :index="indexMethod1"
        />
        <el-table-column prop="name" label="站点名称" show-overflow-tooltip />
        <el-table-column prop="mnCode" label="设备编号" align="center" show-overflow-tooltip />
        <el-table-column prop="name" label="点位名称" show-overflow-tooltip />
        <el-table-column prop="mnCode" label="设备编码" align="center" show-overflow-tooltip />
        <el-table-column prop="exception" label="异常类型" align="center" show-overflow-tooltip />
        <el-table-column prop="region" label="区域" align="center" show-overflow-tooltip />
        <el-table-column prop="region" label="区县" align="center" show-overflow-tooltip />
        <el-table-column prop="beginTime" label="开始时间" align="center" show-overflow-tooltip />
        <el-table-column prop="endTime" label="结束时间" align="center" show-overflow-tooltip />
        <el-table-column prop="typename" label="场景" align="center" width="82" show-overflow-tooltip />
@@ -1493,7 +1594,7 @@

    <el-form label-position="top">
      <el-form-item label="审核人">
        <el-input v-model="auditDialog.checker"></el-input>
        <el-input v-model="userName.getUserName"></el-input>
      </el-form-item>
      <el-form-item label="审核情况">
        <el-input
@@ -1551,20 +1652,10 @@
    <template #header>
      <div class="diag-head">
        <div class="diag-head-text">
          <div><span class="diag-head-text1">站点名称：</span>{{ tableCurrentRowData.name }}</div>
          <div><span class="diag-head-text1">点位名称：</span>{{ tableCurrentRowData.name }}</div>
          <div><span class="diag-head-text1">设备编号：</span>{{ tableCurrentRowData.mnCode }}</div>
          <div><span class="diag-head-text1">运维商：</span>{{ tableCurrentRowData.dutyCompany }}</div>
          <!-- <div>
            <span class="diag-head-text1">异常类型：</span>
            <span v-if="tableCurrentRowData.exceptionType == '0'">数据缺失异常</span>
            <span v-else-if="tableCurrentRowData.exceptionType == '1'">数据超低</span>
            <span v-else-if="tableCurrentRowData.exceptionType == '2'">超标</span>
            <span v-else-if="tableCurrentRowData.exceptionType == '3'">数据长时间无波动</span>
            <span v-else-if="tableCurrentRowData.exceptionType == '4'">量级突变异常</span>
            <span v-else-if="tableCurrentRowData.exceptionType == '5'">临近超标异常</span>
            <span v-else-if="tableCurrentRowData.exceptionType == '6'">单日超标次数临界异常</span>
            <span v-else-if="tableCurrentRowData.exceptionType == '7'">滑动平均值异常</span>
          </div> -->
 

          <div>
            <span class="diag-head-text1">异常时间段：</span>{{ tableCurrentRowData.beginTime }} ~
@@ -1572,22 +1663,6 @@
          </div>
        </div>

        <!-- <div class="chart-jump-button">
          <el-button
            type="danger"
            :loading="loading.preButton"
            :disabled="dialog.isPreCantouch || flag.banTouch"
            @click="getPreviousRowData"
            >上条异常</el-button
          >
          <el-button
            type="danger"
            :loading="loading.afterButton"
            :disabled="dialog.isNextCantouch || flag.banTouch"
            @click="getNextRowData"
            >下条异常</el-button
          >
        </div> -->
        <div class="chart-jump-button">
          <el-button
            type="danger"
@@ -1626,16 +1701,15 @@
          fixed
          :index="indexMethod2"
        ></el-table-column>
        <!-- <el-table-column fixed prop="name" label="站点名称" show-overflow-tooltip />
        <el-table-column prop="mnCode" label="设备编号" align="center" show-overflow-tooltip />
        <el-table-column prop="dutyCompany" label="运维商" align="center" show-overflow-tooltip /> -->
        
        <el-table-column prop="lst" label="采集时间" align="center" show-overflow-tooltip />
        <el-table-column
          prop="dustValue"
          label="颗粒物浓度(mg/m³)"
          label="TSP(mg/m³)"
          align="center"
          show-overflow-tooltip
        />
        <el-table-column prop="flag" label="flag" align="center" show-overflow-tooltip />
      </el-table>
    </div>
    <template #footer>
@@ -1692,6 +1766,7 @@
}
.el-tag {
  font-size: 14px;
  vertical-align: baseline;
}

.checknum-rate {