“去掉点击站点时页面上的搜索框和排名清单”

zmc

2023-11-02 a61623f7887a78170e5ab91d1fbf7929ce0e82fd

 src/views/line_graph/components/subRiskModel.vue

@@ -5,7 +5,7 @@
-->

<script>
  import InputSearch from '@/sfc/InputSearch.vue'
  // import InputSearch from '@/sfc/InputSearch.vue'
  import AreaAndmonitorType from '@/sfc/AreaAndmonitorType.vue'
  import DustRadarChart from '@/views/line_graph/components/DustRadarChart.vue'
  import exceptionApi from '@/api/exceptionApi.js'
@@ -28,7 +28,7 @@
    components: {
      LineChart,
      // DateSelectWithShortCuts,
      InputSearch,
      // InputSearch,
      AreaAndmonitorType,
      DustRadarChart,
      ButtonClick,
@@ -105,8 +105,7 @@
          this.form.endTime = dayjs(this.month).endOf('month').format('YYYY-MM-DD HH:mm:ss')

          this.parentDataFlag = true
          // 更新排清单
          this.getRiskRank()

          // 更新统计数据
          this.getAnalysisData()
          // 计算风险值
@@ -225,6 +224,7 @@
        if (this.form.endTime) {
          params['endTime'] = this.form.endTime
        }
        this.screenLoading= true
        this.loading = true
        this.queryButton = true
        exceptionApi
@@ -239,9 +239,10 @@
            }
            this.begin = this.chartData[0].lst
            this.end = this.chartData[this.chartData.length - 1].lst
  
            
            // 移除空数据状态
            this.isNoData = false
            this.screenLoading= false
            this.setChart()
            //  折线图数据
            let temp = index.calBillData(this.chartData, this.begin, this.end)
@@ -308,47 +309,6 @@
        }
      },
  
      // 得到前10风险排名清单
      async getRiskRank() {
        this.screenLoading = true
        let staticsData = await exceptionApi.analysisdataByType(this.month, 'month')
  
        let exceptionData = await exceptionApi.exceptiondata1({
          siteName: '',
          beginTime: this.form.beginTime,
          endTime: this.form.endTime
        })
  
        const riskValueSites = index.merge(
          staticsData.data.data,
          exceptionData.data.data,
          this.form.beginTime,
          this.form.endTime
        )
        this.top_10_sites_with_risk_values = this.getTopRiskData(riskValueSites, 10)
        
        if (this.top_10_sites_with_risk_values.length != 0) {
          // 表格按风险值倒叙排列
          this.$nextTick(() => {
            this.$refs.table.sort('riskValue', 'descending')
          })
          this.screenLoading = false
          // Promise
          return this.top_10_sites_with_risk_values[0].siteName
        }
        this.screenLoading = false
      },
  
      /**
       * 降序排列，返回降序前num的元素
       * @param： 对象数组，返回的数量
       */
      getTopRiskData(arr, num) {
        // 按照riskValue降序排列
        arr.sort((a, b) => b.riskValue - a.riskValue)
        // 获取前num个元素
        return arr.slice(0, num)
      }
    }
  }
  </script>
@@ -358,33 +318,29 @@
      <el-form-item class="form-item">
        <AreaAndmonitorType></AreaAndmonitorType>
      </el-form-item>
      <el-form-item class="form-item">
        <!-- <InputSearch isNeedDefaultSite="1" @submit-value="(n) => (form.name = n)" :siteName="form.name"></InputSearch> -->

      <!-- <el-form-item class="form-item">
        <InputSearch
          :site-name="form.name"
          isNeedDefaultSite="0"
          @submit-value="(n) => (form.name = n)"
        ></InputSearch>
      </el-form-item>
      </el-form-item> -->
  
      <!-- <el-form-item>
          <DateSelectWithShortCuts @submit-time="giveTime"></DateSelectWithShortCuts>
        </el-form-item> -->
  
      <el-form-item>
        <MonthSelect :month="this.month_1" @submit-value="giveMonth"></MonthSelect>
      </el-form-item>
      </el-form-item> -->
  
      <el-form-item>
      <!-- <el-form-item>
        <ButtonClick
          content="风险评估"
          type="primary"
          :loading="queryButton"
          @do-search="riskAssessment"
        ></ButtonClick>
      </el-form-item>
      </el-form-item> -->
    </el-form>
  
    
    <div v-loading="screenLoading" class="wait-name">
      <div class="chart-container" v-show="!isNoData && !screenLoading">
        <div class="time-text">
@@ -393,47 +349,9 @@
        </div>
  
        <el-row :gutter="10">
          <el-col :span="5">
            <el-card shadow="never" class="table-class">
              <el-table
                ref="table"
                highlight-current-row="true"
                :data="top_10_sites_with_risk_values"
                :default-sort="{ prop: 'riskValue', order: 'descending' }"
                height="540"
              >
                <el-table-column
                  type="index"
                  label="序号"
                  :index="indexMethod"
                  fixed
                  width="25"
                  show-overflow-tooltip
                />
                <el-table-column prop="siteName" label="站点名称" show-overflow-tooltip />
                <el-table-column
                  prop="riskValue"
                  label="风险值"
                  sortable
                  width="67"
                  show-overflow-tooltip
                />
                <el-table-column label="操作" align="center">
                  <template #default="{ row }">
                    <el-button
                      type="primary"
                      text
                      class="table-button"
                      @click="querySiteStaticsInfo(row)"
                      >风险详情</el-button
                    >
                  </template>
                </el-table-column>
              </el-table>
            </el-card>
          </el-col>

  
          <el-col :span="12">
          <el-col :span="14">
            <el-card shadow="never">
              <DustRadarChart
                :name="[
@@ -454,7 +372,7 @@
            </el-card>
          </el-col>
  
          <el-col :span="3">
          <el-col :span="5">
            <el-card shadow="never" class="card-height">
              <template #header>
                <h1
@@ -497,7 +415,7 @@
            </el-card>
          </el-col>
  
          <el-col :span="4">
          <el-col :span="5">
            <el-card shadow="never" class="card-height">
              <template #header><span class="title-16">风险详情</span></template>
  
@@ -564,7 +482,9 @@
    margin-left: 10px;
  }
  .time-text {
    letter-spacing: 2px;
    font-size: 14px;
    color: #333333;
    letter-spacing: 1px;
  }
  .el-card {
    margin-top: 15px;
@@ -657,7 +577,7 @@
    border-radius: 0px;
  }
  .site-name {
    margin-left: 120px;
    margin-left: 20px;
  }
  </style>