admin-fiveFollowing/src/views/powerQuality/asseReport/loopReport.vue

<template>
  <div>
    <!-- 筛选start -->
    <div class="filter-container mb-10">
      <div class="left">
        <div>
          <div class="filter-item">
            选择站点:
            <el-select v-model="store.state.siteId" placeholder="请选择" style="width: 220px" clearable filterable
              @change="linkDevice()" :disabled="store.state.authorities.indexOf('查询') == -1">
              <el-option v-for="site in store.state.siteList" :key="site" :label="site.siteName"
                :value="site.id"></el-option>
            </el-select>
          </div>
          <div class="filter-item" style="margin-right: 20px">
            选择设备:
            <el-select v-model="deviceCode" placeholder="请选择" style="width: 150px"
              :disabled="store.state.authorities.indexOf('查询') == -1">
              <el-option v-for="device in deviceList" :key="device" :label="device.deviceName"
                :value="device.deviceCode"></el-option>
            </el-select>
          </div>

          <div class="filter-item">
            日期：
            <!-- <el-date-picker
              v-model="dateTime"
              type="dates"
              placeholder="请选择"
              style="width: 200px"
            ></el-date-picker> -->

            <el-date-picker v-model="dateTime" placeholder="请选择" style="width: 150px; margin-left: 20px"
              :clearable="false" :editable="false" :disabled="store.state.authorities.indexOf('查询') == -1"></el-date-picker>
          </div>

          <el-button type="primary" class="search-button" @click="SingleLoopReportData()"
            :disabled="store.state.authorities.indexOf('查询') == -1">
            搜索
          </el-button>
        </div>
      </div>
      <div class="right descIcon" @click="descripDialog()">
        <img src="@/assets/images/descIcon.png" alt="" />
        指标说明
      </div>
    </div>
    <!-- 筛选end -->

    <el-row :gutter="20">
      <el-col :md="24" :lg="14">
        <div class="grid-content bg-purple">
          <div class="blanceChartTit">
            <span>电压质量</span>
            <span class="subs">
              标称电压：
              {{ getData.voltageLevel ? getData.voltageLevel : '-' }}V
            </span>
          </div>

          <el-row :gutter="20" style="padding: 20px">
            <el-col :md="24" :lg="8" v-loading="loading">
              <div class="grid-content bg-purple assCard" style="text-align: center">
                <div class="subTits">A相电压</div>
                <el-row :gutter="20" style="padding: 0 20px">
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum">
                        {{ getData.proportionUa ? getData.proportionUa : '-' }}
                      </div>
                      <div class="assTxt">超限数/测点数</div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum greenRate">
                        {{ getData.qrUa == null ? '-' : getData.qrUa }}%
                      </div>
                      <div class="assTxt">合格率</div>
                    </div>
                  </el-col>
                </el-row>
                <el-button class="banlanceBtn" round :type="getData.uaStatus == true
                    ? 'primary'
                    : getData.uaStatus == false
                      ? 'danger'
                      : 'warning'
                  ">
                  {{
                    getData.uaStatus == true
                    ? '合格'
                    : getData.uaStatus == false
                      ? '不合格'
                      : '暂无结论'
                  }}
                </el-button>
                <ul>
                  <li>
                    <div>最大值：{{ getData.maxUa ? getData.maxUa : '-' }}</div>
                    <span :class="getData.maxUaStatus ? '' : 'overLimit'">
                      {{
                        getData.maxUaStatus == true
                        ? '未超限'
                        : getData.maxUaStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>最小值：{{ getData.minUa ? getData.minUa : '-' }}</div>
                    <span :class="getData.minUaStatus ? '' : 'overLimit'">
                      {{
                        getData.minUaStatus == true
                        ? '未超限'
                        : getData.minUaStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>平均值：{{ getData.avgUa ? getData.avgUa : '-' }}</div>
                    <span :class="getData.avgUaStatus ? '' : 'overLimit'">
                      {{
                        getData.avgUaStatus == true
                        ? '未超限'
                        : getData.avgUaStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                </ul>
              </div>
            </el-col>
            <el-col :md="24" :lg="8" v-loading="loading">
              <div class="grid-content bg-purple assCard" style="text-align: center">
                <div class="subTits">B相电压</div>
                <el-row :gutter="20" style="padding: 0 20px">
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum">
                        {{ getData.proportionUb ? getData.proportionUb : '-' }}
                      </div>
                      <div class="assTxt">超限数/测点数</div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum greenRate">
                        {{ getData.qrUb == null ? '-' : getData.qrUb }}%

                      </div>
                      <div class="assTxt">合格率</div>
                    </div>
                  </el-col>
                </el-row>
                <el-button class="banlanceBtn" round :type="getData.ubStatus == true
                    ? 'primary'
                    : getData.ubStatus == false
                      ? 'danger'
                      : 'warning'
                  ">
                  {{
                    getData.ubStatus == true
                    ? '合格'
                    : getData.ubStatus == false
                      ? '不合格'
                      : '暂无结论'
                  }}
                </el-button>
                <ul>
                  <li>
                    <div>最大值：{{ getData.maxUb ? getData.maxUb : '-' }}</div>
                    <span :class="getData.maxUbStatus ? '' : 'overLimit'">
                      {{
                        getData.maxUbStatus == true
                        ? '未超限'
                        : getData.maxUbStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>最小值：{{ getData.minUb ? getData.minUb : '-' }}</div>
                    <span :class="getData.minUbStatus ? '' : 'overLimit'">
                      {{
                        getData.minUbStatus == true
                        ? '未超限'
                        : getData.minUbStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>平均值：{{ getData.avgUb ? getData.avgUb : '-' }}</div>
                    <span :class="getData.avgUbStatus ? '' : 'overLimit'">
                      {{
                        getData.avgUbStatus == true
                        ? '未超限'
                        : getData.avgUbStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                </ul>
              </div>
            </el-col>
            <el-col :md="24" :lg="8" v-loading="loading">
              <div class="grid-content bg-purple assCard" style="text-align: center">
                <div class="subTits">C相电压</div>
                <el-row :gutter="20" style="padding: 0 20px">
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum">
                        {{ getData.proportionUc ? getData.proportionUc : '-' }}
                      </div>
                      <div class="assTxt">超限数/测点数</div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum greenRate">
                        {{ getData.qrUc == null ? '-' : getData.qrUc }}%

                      </div>
                      <div class="assTxt">合格率</div>
                    </div>
                  </el-col>
                </el-row>
                <el-button class="banlanceBtn" round :type="getData.ucStatus == true
                    ? 'primary'
                    : getData.ucStatus == false
                      ? 'danger'
                      : 'warning'
                  ">
                  {{
                    getData.ucStatus == true
                    ? '合格'
                    : getData.ucStatus == false
                      ? '不合格'
                      : '暂无结论'
                  }}
                </el-button>
                <ul>
                  <li>
                    <div>最大值：{{ getData.maxUc ? getData.maxUc : '-' }}</div>
                    <span :class="getData.maxUcStatus ? '' : 'overLimit'">
                      {{
                        getData.maxUcStatus == true
                        ? '未超限'
                        : getData.maxUcStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>最小值：{{ getData.minUc ? getData.minUc : '-' }}</div>
                    <span :class="getData.minUcStatus ? '' : 'overLimit'">
                      {{
                        getData.minUcStatus == true
                        ? '未超限'
                        : getData.minUcStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>平均值：{{ getData.avgUc ? getData.avgUc : '-' }}</div>
                    <span :class="getData.avgUcStatus ? '' : 'overLimit'">
                      {{
                        getData.avgUcStatus == true
                        ? '未超限'
                        : getData.avgUcStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                </ul>
              </div>
            </el-col>
          </el-row>
        </div>
      </el-col>
      <el-col :md="12" :lg="5" v-loading="loading">
        <div class="grid-content bg-purple">
          <div class="blanceChartTit">
            <span>频率质量</span>
            <span class="subs">
              标称频率：{{ getData.mhz ? getData.mhz : 0 }}Hz
            </span>
          </div>
          <el-row :gutter="20" style="padding: 20px">
            <el-col :span="24">
              <div class="grid-content bg-purple assCard" style="text-align: center">
                <div class="subTits">频率</div>
                <el-row :gutter="20" style="padding: 0 20px">
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum">
                        {{ getData.proportionF ? getData.proportionF : '-' }}
                      </div>
                      <div class="assTxt">超限数/测点数</div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum greenRate">
                        <!-- {{ getData.qrF ? getData.qrF : '-' }}% -->
                        {{ getData.qrF == null ? '-' : getData.qrF }}%
                      </div>
                      <div class="assTxt">合格率</div>
                    </div>
                  </el-col>
                </el-row>
                <el-button class="banlanceBtn" round :type="getData.fstatus == true
                    ? 'primary'
                    : getData.fstatus == false
                      ? 'danger'
                      : 'warning'
                  ">
                  {{
                    getData.fstatus == true
                    ? '合格'
                    : getData.fstatus == false
                      ? '不合格'
                      : '暂无结论'
                  }}
                </el-button>
                <ul>
                  <li>
                    <div>最大值：{{ getData.maxF ? getData.maxF : '-' }}</div>
                    <span :class="getData.maxFStatus ? '' : 'overLimit'">
                      {{
                        getData.maxFStatus == true
                        ? '未超限'
                        : getData.maxFStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>最小值：{{ getData.minF ? getData.minF : '-' }}</div>
                    <span :class="getData.minFStatus ? '' : 'overLimit'">
                      {{
                        getData.minFStatus == true
                        ? '未超限'
                        : getData.minFStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>平均值：{{ getData.avgF ? getData.avgF : '-' }}</div>
                    <span :class="getData.avgFStatus ? '' : 'overLimit'">
                      {{
                        getData.avgFStatus == true
                        ? '未超限'
                        : getData.avgFStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                </ul>
              </div>
            </el-col>
          </el-row>
        </div>
      </el-col>
      <el-col :md="12" :lg="5" v-loading="loading">
        <div class="grid-content bg-purple">
          <div class="blanceChartTit">功率因数分析</div>
          <el-row :gutter="20" style="padding: 20px">
            <el-col :span="24">
              <div class="grid-content bg-purple assCard" style="text-align: center">
                <div class="subTits">功率因数</div>
                <el-row :gutter="20" style="padding: 0 20px">
                  <el-col :span="24" style="margin-bottom: 20px">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum">
                        {{ getData.appraise != null ? getData.appraise : '-' }}
                      </div>
                      <div class="assTxt">考核限值</div>
                    </div>
                  </el-col>
                  <el-col :span="24" style="margin-bottom: 20px">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum greenRate">
                        {{ getData.cos != null ? getData.cos : '-' }}
                      </div>
                      <div class="assTxt">数值</div>
                    </div>
                  </el-col>
                </el-row>
                <el-button class="banlanceBtn" round :type="getData.cosStatus == true
                    ? 'primary'
                    : getData.cosStatus == false
                      ? 'danger'
                      : 'warning'
                  ">
                  {{
                    getData.cosStatus == true
                    ? '合格'
                    : getData.cosStatus == false
                      ? '不合格'
                      : '暂无结论'
                  }}
                </el-button>
              </div>
            </el-col>
          </el-row>
        </div>
      </el-col>
    </el-row>

    <el-row :gutter="20" class="mt-20">
      <el-col :md="24" :lg="14" v-loading="loading">
        <div class="grid-content bg-purple">
          <div class="blanceChartTit">
            <span>谐波畸变率</span>
            <span class="subs">数值标准</span>
          </div>

          <el-row :gutter="20" style="padding: 20px">
            <el-col :md="24" :lg="8">
              <div class="grid-content bg-purple assCard" style="text-align: center">
                <div class="subTits">A相电流谐波畸变率</div>
                <img class="noDataImg" src="@/assets/images/noDataImg.png" alt="" />
              </div>
            </el-col>
            <el-col :md="24" :lg="8">
              <div class="grid-content bg-purple assCard" style="text-align: center">
                <div class="subTits">B相电流谐波畸变率</div>
                <img class="noDataImg" src="@/assets/images/noDataImg.png" alt="" />
                <!-- <el-row :gutter="20" style="padding: 0 20px">
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum">0/128</div>
                      <div class="assTxt">超限数/测点数</div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum greenRate">100%</div>
                      <div class="assTxt">合格率</div>
                    </div>
                  </el-col>
                </el-row>
                <el-button class="banlanceBtn" round type="danger">
                  不合格
                </el-button>
                <ul>
                  <li>
                    <div>最大值：234.87V(6.76%)</div>
                    <span class="overLimit">超限</span>
                  </li>
                  <li>
                    <div>最小值：234.87V(6.76%)</div>
                    <span>未超限</span>
                  </li>
                  <li>
                    <div>平均值：234.87V(6.76%)</div>
                    <span>未超限</span>
                  </li>
                </ul> -->
              </div>
            </el-col>
            <el-col :md="24" :lg="8">
              <div class="grid-content bg-purple assCard" style="text-align: center">
                <div class="subTits">C相电流谐波畸变率</div>
                <img class="noDataImg" src="@/assets/images/noDataImg.png" alt="" />
                <!-- <el-row :gutter="20" style="padding: 0 20px">
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum">0/128</div>
                      <div class="assTxt">超限数/测点数</div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum greenRate">100%</div>
                      <div class="assTxt">合格率</div>
                    </div>
                  </el-col>
                </el-row>
                <el-button class="banlanceBtn" round type="primary">
                  合格
                </el-button>
                <ul>
                  <li>
                    <div>最大值：234.87V(6.76%)</div>
                    <span class="overLimit">超限</span>
                  </li>
                  <li>
                    <div>最小值：234.87V(6.76%)</div>
                    <span>未超限</span>
                  </li>
                  <li>
                    <div>平均值：234.87V(6.76%)</div>
                    <span>未超限</span>
                  </li>
                </ul> -->
              </div>
            </el-col>
          </el-row>
        </div>
      </el-col>
      <el-col :md="24" :lg="10">
        <div class="grid-content bg-purple">
          <div class="blanceChartTit">
            <span>不平衡度</span>
            <span class="subs">数值标准</span>
          </div>
          <el-row :gutter="20" style="padding: 20px">
            <el-col :span="12">
              <div class="grid-content bg-purple assCard" style="text-align: center">
                <div class="subTits">电流不平衡度</div>
                <el-row :gutter="20" style="padding: 0 20px" v-loading="loading">
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum">
                        {{
                          getData.proportionElBalun
                          ? getData.proportionElBalun
                          : '-'
                        }}
                      </div>
                      <div class="assTxt">超限数/测点数</div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum greenRate">
                        {{ getData.qrElBalun == null ? '-' : getData.qrElBalun }}%
                      </div>
                      <div class="assTxt">合格率</div>
                    </div>
                  </el-col>
                </el-row>
                <el-button class="banlanceBtn" round :type="getData.elBalunStatus == true
                    ? 'primary'
                    : getData.elBalunStatus == false
                      ? 'danger'
                      : 'warning'
                  ">
                  {{
                    getData.elBalunStatus == true
                    ? '合格'
                    : getData.elBalunStatus == false
                      ? '不合格'
                      : '暂无结论'
                  }}
                </el-button>
                <ul>
                  <li>
                    <div>
                      最大值：{{
                        getData.maxElBalun != null ? getData.maxElBalun : '-'
                      }}
                    </div>
                    <span :class="getData.maxElBalunStatus ? '' : 'overLimit'">
                      {{
                        getData.maxElBalunStatus == true
                        ? '未超限'
                        : getData.maxElBalunStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>
                      最小值：{{
                        getData.minElBalun != null ? getData.minElBalun : '-'
                      }}
                    </div>
                    <span :class="getData.minElBalunStatus ? '' : 'overLimit'">
                      {{
                        getData.minElBalunStatus == true
                        ? '未超限'
                        : getData.minElBalunStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>
                      平均值：{{
                        getData.avgElBalun != null ? getData.avgElBalun : '-'
                      }}
                    </div>
                    <span :class="getData.avgElBalunStatus ? '' : 'overLimit'">
                      {{
                        getData.avgElBalunStatus == true
                        ? '未超限'
                        : getData.avgElBalunStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                </ul>
              </div>
            </el-col>

            <el-col :span="12">
              <div class="grid-content bg-purple assCard" style="text-align: center">
                <div class="subTits">电压不平衡度</div>
                <el-row :gutter="20" style="padding: 0 20px" v-loading="loading">
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum">
                        {{
                          getData.proportionVtBalun
                          ? getData.proportionVtBalun
                          : '-'
                        }}
                      </div>
                      <div class="assTxt">超限数/测点数</div>
                    </div>
                  </el-col>
                  <el-col :span="12">
                    <div class="grid-content bg-purple assSmallbox">
                      <div class="assNum greenRate">
                        {{ getData.qrVtBalun == null ? '-' : getData.qrVtBalun }}%
                      </div>
                      <div class="assTxt">合格率</div>
                    </div>
                  </el-col>
                </el-row>
                <el-button class="banlanceBtn" round :type="getData.vtBalunStatus == true
                    ? 'primary'
                    : getData.vtBalunStatus == false
                      ? 'danger'
                      : 'warning'
                  ">
                  {{
                    getData.vtBalunStatus == true
                    ? '合格'
                    : getData.vtBalunStatus == false
                      ? '不合格'
                      : '暂无结论'
                  }}
                </el-button>

                <ul>
                  <li>
                    <div>
                      最大值：{{
                        getData.maxVtBalun != null ? getData.maxVtBalun : '-'
                      }}
                    </div>
                    <span :class="getData.maxVtBalunStatus ? '' : 'overLimit'">
                      {{
                        getData.maxVtBalunStatus == true
                        ? '未超限'
                        : getData.maxVtBalunStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>
                      最小值：{{
                        getData.minVtBalun != null ? getData.minVtBalun : '-'
                      }}
                    </div>
                    <span :class="getData.minVtBalunStatus ? '' : 'overLimit'">
                      {{
                        getData.minVtBalunStatus == true
                        ? '未超限'
                        : getData.minVtBalunStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                  <li>
                    <div>
                      平均值：{{
                        getData.avgVtBalun != null ? getData.avgVtBalun : '-'
                      }}
                    </div>
                    <span :class="getData.avgVtBalunStatus ? '' : 'overLimit'">
                      {{
                        getData.avgVtBalunStatus == true
                        ? '未超限'
                        : getData.avgVtBalunStatus == false
                          ? '超限'
                          : '-'
                      }}
                    </span>
                  </li>
                </ul>
              </div>
            </el-col>
          </el-row>
        </div>
      </el-col>
    </el-row>

    <!--指标说明弹框组件开始-----------------------start-->
    <descrip-dialog @closeDialog="closeDialog" :flag="showDialog2" class="descripDialog"></descrip-dialog>
    <!--指标说明弹框组件结束-----------------------end-->
  </div>
</template>

<script>
import { useStore } from 'vuex'
import { defineComponent, onMounted, ref, watch } from 'vue'
import * as api from '@/api/powerQuality/loopReport.js'
import descripDialog from './scoreReportComponent/descripDialog'
import { ElMessage } from 'element-plus'
export default defineComponent({
  name: 'LoopReport',
  components: {
    descripDialog,
  },
  props: {
    activeName: String,
  },
  setup(props) {
    const store = useStore()
    const loading = ref(false)
    const getData = ref({})
    const showDialog2 = ref(false)

    const deviceList = ref([])
    const deviceCode = ref('')
    const dateTime = ref(new Date())
    const dialogTitle = ref('')

    function linkDevice() {
      deviceSelect()
    }

    //设备下拉请求
    function deviceSelect() {
      api.deviceListOne({ siteId: store.state.siteId }).then((requset) => {
        if (requset.status === 'SUCCESS') {
          deviceList.value = requset.data
          deviceCode.value = requset.data[0] ? requset.data[0].deviceCode : ''
        } else {
          ElMessage.error(requset.msg)
        }
      })
    }

    //单回路主页面请求
    function SingleLoopReportData() {
      loading.value = true
      store.commit('getNowFormatDate', dateTime.value)
      //  time:store.state.dateList,
      // time:'2021-11-01'
      api
        .SingleLoopReportData({
          deviceCode: deviceCode.value,
          time: store.state.dateList,
          type: 1,
        })
        .then((requset) => {
          loading.value = false
          if (requset.status === 'SUCCESS') {
            // console.log('requset.data.uaStatus')
            // console.log(requset.data.uaStatus)

            if (requset.data == null) {
              ElMessage.warning('暂无数据')
            } else {
              getData.value = requset.data

            }
          } else {
            ElMessage.error(requset.msg)
          }
        })
    }
    // 查看指标说明
    const descripDialog = () => {
      dialogTitle.value = '指标说明'
      showDialog2.value = true
    }
    // 关闭操作
    const closeDialog = () => {
      showDialog2.value = false
    }

    watch(
      () => props.activeName,
      (newVal) => {
        if (newVal == 'second') {
          // getData.value={}
          deviceSelect()
          setTimeout(function () {
            SingleLoopReportData()
          }, 1000)
        }
      }
    )

    onMounted(() => {
      deviceSelect()
    })
    return {
      store,
      deviceList,
      deviceCode,
      linkDevice,
      deviceSelect,
      SingleLoopReportData,
      dateTime,
      region: '',
      getData,
      closeDialog,
      showDialog2,
      descripDialog,
      dialogTitle,
      loading
    }
  },
})
</script>
 
<style scoped lang="scss">
.el-button {
  cursor: default !important;
}

.el-row {
  margin-bottom: 20px;

  &:last-child {
    margin-bottom: 0;
  }
}

.el-col {
  border-radius: 4px;
}

.bg-purple-dark {
  border: 1px solid #99a9bf;
}

.bg-purple {
  border: 1px solid #d3dce6;
}

.bg-purple-light {
  border: 1px solid #e5e9f2;
}

.grid-content {
  border-radius: 4px;
  min-height: 36px;
}

.row-bg {
  padding: 10px 0;
  border: 1px solid #f9fafc;
}

ul li {
    padding: 0;
    margin: 0;
    list-style: none
}
</style>