zmc
2023-12-01 5244fdb5f7932f2cbce43f4bfaa9dc06c9dd4c95
src/views/risk_assessment/components/CompDataRiskModel.vue
@@ -1,12 +1,11 @@
<!-- 日均值 -->
<script>
import InputSearch from '@/sfc/InputSearch.vue'
import AreaAndmonitorType from '@/sfc/AreaAndmonitorType.vue'
import exceptionApi from '@/api/exceptionApi.js'
import DustRadarChart from '@/views/risk_assessment/components/DustRadarChart.vue'
import LineChart from '@/views/risk_assessment/components/LineChart.vue'
import FYLineChart from '@/components/chart/FYLineChart.vue'
import index from '@/utils/risk_estimate_common_function/index.js'
import ButtonClick from '@/sfc/ButtonClick.vue'
@@ -35,7 +34,7 @@
    }
  },
  components: {
    LineChart,
    FYLineChart,
    InputSearch,
    AreaAndmonitorType,
    DustRadarChart,
@@ -446,7 +445,7 @@
        </el-button>
      </el-card>
      <el-row :gutter="10">
      <el-row :gutter="10" >
        <el-col :span="5" v-show="showAll">
          <el-card shadow="never" class="table-class">
            <el-table
@@ -495,7 +494,7 @@
          </el-card>
        </el-col>
        <el-col :span="11">
        <el-col :span="showAll ?11:14" >
          <el-card shadow="never" class="table-class">
            <DustRadarChart
              :name="[
@@ -510,23 +509,28 @@
          </el-card>
        </el-col>
        <el-col :span="4">
        <el-col :span="showAll ?4: 5" >
          <el-card shadow="never" class="card-height risk-card">
            <template #header>
              <h1
                :class="{
                  'weightColor-low': weight < 0.15,
                  'weightColor-medium': weight >= 0.15 && weight <= 0.6,
                  'weightColor-heigh': weight > 0.6
                }"
              <span
              class="title-16"
              >
                风险值(0~1):{{ weight }}
              </h1>
                风险值(0~1):
              </span>
              <span  :class="{
                'weightColor-low': weight < 0.15,
                'weightColor-medium': weight >= 0.15 && weight <= 0.6,
                'weightColor-heigh': weight > 0.6
              }"> {{ weight }}</span>
            </template>
            <div class="risk-text-container">
              <div class="risk-grade">
                <h1 class="sub-title">风险等级:</h1>
                <span class="sub-title">{{ riskGradeAndAdvice.riskGrade }} </span>
                <span  :class="{
                  'weightColor-low': weight < 0.15,
                  'weightColor-medium': weight >= 0.15 && weight <= 0.6,
                  'weightColor-heigh': weight > 0.6
                }" >{{ riskGradeAndAdvice.riskGrade }} </span>
              </div>
              <div class="risk-advice">
@@ -558,7 +562,7 @@
          </el-card>
        </el-col>
        <el-col :span="4">
        <el-col :span="showAll ?4: 5"  >
          <el-card shadow="never" class="card-height">
            <template #header>
              <span class="title-16">风险详情</span>
@@ -573,20 +577,24 @@
              <el-form-item label="异常类型聚集度:">
                {{ exceptionRisk.exceptionTypeAggregation * 100 }}%
              </el-form-item>
              <el-tag :size="small">共出现了{{ bill.exception.length }}类异常</el-tag>
              <el-tag :size="small" v-show="bill.exception">共出现了{{ bill.exception }}类异常</el-tag>
              <el-form-item label="典型异常复现率:">
                {{ exceptionRisk.typicalExceptionRepetitionRate * 100 }}%
              </el-form-item>
              <div>
                <el-tag :size="small">量级突变异常:{{ bill.mutationCount }}条</el-tag>
                <el-tag :size="small" v-show="bill.mutationCount">量级突变异常:{{ bill.mutationCount }}条</el-tag>
              </div>
              <div>
                <el-tag :size="small">临近超标异常:{{ bill.exceedingNearCount }}条</el-tag>
                <el-tag :size="small" v-show="bill.exceedingNearCount">临近超标异常:{{ bill.exceedingNearCount }}条</el-tag>
              </div>
              <div>
                <el-tag :size="small"
                v-show="bill.exceedingCriticalDegree"
                  >单日超标次数临界异常:{{ bill.exceedingCriticalDegree }}条</el-tag
                >
              </div>
@@ -598,27 +606,27 @@
      <el-row :gutter="20">
        <el-col :span="12">
          <el-card shadow="never" class="card-value">
            <LineChart
            <FYLineChart
              title="日均值"
              :chartData="chartData1"
              yName="mg/m³"
              seriesName="日均值"
              :areaColor="areaColor"
            >
            </LineChart>
            </FYLineChart>
          </el-card>
        </el-col>
        <el-col :span="12">
          <el-card shadow="never" class="card-value">
            <LineChart
            <FYLineChart
              title="日有效率"
              :chartData="chartData3"
              yName="%"
              seriesName="日有效率"
              :areaColor="areaColor"
            >
            </LineChart>
            </FYLineChart>
          </el-card>
        </el-col>
      </el-row>
@@ -679,7 +687,7 @@
  background-color: red;
}
.medium {
  background-color: #fadc19;
  background-color: #dabe09;
}
.low {
  background-color: #9fdb1d;