hb_sis_zhfx/src/views/specific/ztfx.vue

<template>
  <div class="ztfx">
    <div class="action-bar">
      <div class="query mg-b-16">
        <div class="query-items">
          <div class="query-item">
            <div class="lable">日期：</div>
            <div class="search-input">
              <el-date-picker
                v-model="monthValue"
                type="month"
                placeholder="选择月份"
                popper-class="date-select"
                :clearable="false"
                :picker-options="pickerOptions"
              >
              </el-date-picker>
            </div>
          </div>
          <div class="query-item">
            <div class="search-input select-btn">
              <button class="btn green" @click="onClickSearch">搜索</button>

              <!-- <el-select
                v-model="value2"
                multiple
                placeholder="计算"
                popper-class="select"
              >
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select> -->
            </div>
            <div class="search-input select-btn">
              <button class="btn green" @click="exportPDF">导出</button>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="pdfDom">
      <el-row :gutter="20" class="table-panel">
        <el-col :span="12">
          <panel :title="'月度'" :showLine="false">
            <div class="table">
              <table style="width: 100%" border="0" cellspacing="0">
                <thead>
                  <tr>
                    <th rowspan="2" class="type1" style="width: 6vh"></th>
                    <th rowspan="2" class="type1">理论发电量</th>
                    <th rowspan="2" class="type1">实际发电量</th>
                    <th rowspan="2" class="type1">风能利用率</th>
                    <th rowspan="2" class="type1">维护损失电量</th>
                    <th rowspan="2" class="type1">维护损失率</th>
                    <th rowspan="2" class="type1">故障损失电量</th>
                    <th rowspan="2" class="type1">故障损失率</th>
                    <th rowspan="2" class="type1">限电损失电量</th>
                    <th rowspan="2" class="type1">限电损失率</th>
                    <th rowspan="2" class="type1">性能损失电量</th>
                    <th rowspan="2" class="type1">性能损失率</th>
                    <th rowspan="2" class="type1">受累损失电量</th>
                    <th rowspan="2" class="type1">受累损失率</th>
                  </tr>
                </thead>
              </table>
              <el-scrollbar>
                <div style="">
                  <table
                    style="width: 100%; text-align: center"
                    border="0"
                    cellspacing="0"
                  >
                    <tbody>
                      <tr>
                        <td style="width: 5vh">本期</td>
                        <td class="td-item">
                          {{ nowCurrents.yllfdl }}

                          <template v-if="compares.yllfdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.yllfdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.ysjfdl }}
                          <template v-if="compares.ysjfdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.ysjfdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.yfnlyl }}
                          <template v-if="compares.yfnlyl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.yfnlyl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.ywhssdl }}
                          <template v-if="compares.ywhssdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.ywhssdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.ywhssl }}
                          <template v-if="compares.ywhssl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.ywhssl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.ygzssdl }}
                          <template v-if="compares.ygzssdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.ygzssdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.ygzssl }}
                          <template v-if="compares.ygzssl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.ygzssl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.yxdssdl }}
                          <template v-if="compares.yxdssdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.yxdssdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.yxdssl }}
                          <template v-if="compares.yxdssl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.yxdssl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.yxnssdl }}
                          <template v-if="compares.yxnssdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.yxnssdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.yxnssl }}
                          <template v-if="compares.yxnssl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.yxnssl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.yslssdl }}
                          <template v-if="compares.yslssdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.yslssdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.yslssl }}
                          <template v-if="compares.yslssl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.yslssl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                      </tr>
                      <tr>
                        <td style="width: 5vh">同期</td>
                        <td class="td-item">
                          {{ sameList.yllfdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.ysjfdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.yfnlyl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.ywhssdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.ywhssl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.ygzssdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.ygzssl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.yxdssdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.yxdssl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.yxnssdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.yxnssl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.yslssdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.yslssl }}
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </el-scrollbar>
            </div>
          </panel>
        </el-col>
        <el-col :span="12">
          <panel :title="'年度'" :showLine="false">
            <div class="table">
              <table style="width: 100%" border="0" cellspacing="0">
                <thead>
                  <tr>
                    <th rowspan="2" class="type1">理论发电量</th>
                    <th rowspan="2" class="type1">实际电量</th>
                    <th rowspan="2" class="type1">风能利用率</th>
                    <th rowspan="2" class="type1">维护损失电量</th>
                    <th rowspan="2" class="type1">维护损失率</th>
                    <th rowspan="2" class="type1">故障损失电量</th>
                    <th rowspan="2" class="type1">故障损失率</th>
                    <th rowspan="2" class="type1">限电损失电量</th>
                    <th rowspan="2" class="type1">限电损失率</th>
                    <th rowspan="2" class="type1">性能损失电量</th>
                    <th rowspan="2" class="type1">性能损失率</th>
                    <th rowspan="2" class="type1">受累损失电量</th>
                    <th rowspan="2" class="type1">受累损失率</th>
                  </tr>
                </thead>
              </table>
              <el-scrollbar>
                <div style="">
                  <table
                    style="width: 100%; text-align: center"
                    border="0"
                    cellspacing="0"
                  >
                    <tbody>
                      <tr>
                        <td class="td-item">
                          {{ nowCurrents.nllfdl }}

                          <template v-if="compares.nllfdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nllfdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.nsjfdl }}
                          <template v-if="compares.nsjfdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nsjfdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.nfnlyl }}
                          <template v-if="compares.nfnlyl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nfnlyl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.nwhssdl }}
                          <template v-if="compares.nwhssdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nwhssdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.nwhssl }}
                          <template v-if="compares.nwhssl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nwhssl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.ngzssdl }}
                          <template v-if="compares.ngzssdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.ngzssdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.ngzssl }}
                          <template v-if="compares.ngzssl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.ngzssl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.nxdssdl }}
                          <template v-if="compares.nxdssdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nxdssdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.nxdssl }}
                          <template v-if="compares.nxdssl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nxdssl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.nxnssdl }}
                          <template v-if="compares.nxnssdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nxnssdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.nxnssl }}
                          <template v-if="compares.nxnssl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nxnssl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.nslssdl }}
                          <template v-if="compares.nslssdl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nslssdl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                        <td class="td-item">
                          {{ nowCurrents.nslssl }}
                          <template v-if="compares.nslssl === 2">
                            <span class="svg-icon svg-icon-green">
                              <svg-icon svgid="svg-arrow-up-1" />
                            </span>
                          </template>
                          <template v-if="compares.nslssl === 1">
                            <span class="svg-icon svg-icon-yellow">
                              <svg-icon svgid="svg-arrow-dpwn-1" />
                            </span>
                          </template>
                        </td>
                      </tr>
                      <tr>
                        <td class="td-item">
                          {{ sameList.nllfdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.nsjfdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.nfnlyl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.nwhssdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.nwhssl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.ngzssdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.ngzssl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.nxdssdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.nxdssl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.nxnssdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.nxnssl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.nslssdl }}
                        </td>
                        <td class="td-item">
                          {{ sameList.nslssl }}
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </el-scrollbar>
            </div>
          </panel>
        </el-col>
      </el-row>
      <el-row :gutter="20" class="table-complex">
        <el-col :span="12">
          <div class="table">
            <table style="width: 100%" border="0" cellspacing="0">
              <thead>
                <tr>
                  <th rowspan="2" class="type1" style="width: 50px"></th>
                  <th colspan="2" class="type1" style="width: 205px">麻黄山</th>
                  <th colspan="2" class="type1" style="width: 205px">牛首山</th>
                  <th colspan="2" class="type1" style="width: 205px">青山</th>
                  <th colspan="2" class="type1" style="width: 205px">石板泉</th>
                  <th colspan="2" class="type1" style="width: 205px">香山</th>
                </tr>
                <tr>
                  <th style="width: 105px">当月</th>
                  <th style="width: 105px">同期</th>
                  <th style="width: 105px">当月</th>
                  <th style="width: 105px">同期</th>
                  <th style="width: 105px">当月</th>
                  <th style="width: 105px">同期</th>
                  <th style="width: 105px">当月</th>
                  <th style="width: 105px">同期</th>
                  <th style="width: 105px">当月</th>
                  <th style="width: 105px">同期</th>
                </tr>
              </thead>
            </table>
            <el-scrollbar>
              <div style="">
                <table
                  style="width: 100%; text-align: center"
                  border="0"
                  cellspacing="0"
                >
                  <tbody>
                    <tr>
                      <td style="width: 50px">MTBF</td>
                      <td style="width: 105px">
                        {{ currentMonth["麻黄山"].mtbf }}
                        <template
                          v-if="currentMonth['麻黄山'].mttrCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['麻黄山'].mtbfCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["麻黄山"].tqmtbf }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["牛首山"].mtbf }}
                        <template
                          v-if="currentMonth['牛首山'].mtbfCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['牛首山'].mtbfCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["牛首山"].tqmtbf }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["青山"].mtbf }}
                        <template v-if="currentMonth['青山'].mtbfCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentMonth['青山'].mtbfCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["青山"].tqmtbf }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["石板泉"].mtbf }}
                        <template
                          v-if="currentMonth['石板泉'].mtbfCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['石板泉'].mtbfCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["石板泉"].tqmtbf }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["香山"].mtbf }}
                        <template v-if="currentMonth['香山'].mtbfCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentMonth['香山'].mtbfCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["香山"].tqmtbf }}
                      </td>
                    </tr>

                    <tr>
                      <td style="width: 50px">MTTR</td>
                      <td style="width: 105px">
                        {{ currentMonth["麻黄山"].mttr }}
                        <template
                          v-if="currentMonth['麻黄山'].mttrCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['麻黄山'].mttrCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["麻黄山"].tqmttr }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["牛首山"].mttr }}
                        <template
                          v-if="currentMonth['牛首山'].mttrCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['牛首山'].mttrCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["牛首山"].tqmttr }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["青山"].mttr }}
                        <template v-if="currentMonth['青山'].mttrCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentMonth['青山'].mttrCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["青山"].tqmttr }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["石板泉"].mttr }}
                        <template
                          v-if="currentMonth['石板泉'].mttrCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['石板泉'].mttrCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["石板泉"].tqmttr }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["香山"].mttr }}
                        <template v-if="currentMonth['香山'].mttrCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentMonth['香山'].mttrCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["香山"].tqmttr }}
                      </td>
                    </tr>

                    <tr>
                      <td style="width: 50px">复位</td>
                      <td style="width: 105px">
                        {{ currentMonth["麻黄山"].fwjsl }}
                        <template
                          v-if="currentMonth['麻黄山'].fwjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['麻黄山'].fwjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["麻黄山"].tqfwjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["牛首山"].mttr }}
                        <template
                          v-if="currentMonth['牛首山'].fwjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['牛首山'].fwjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["牛首山"].tqfwjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["青山"].fwjsl }}
                        <template
                          v-if="currentMonth['青山'].fwjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['青山'].fwjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["青山"].tqfwjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["石板泉"].fwjsl }}
                        <template
                          v-if="currentMonth['石板泉'].fwjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['石板泉'].fwjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["石板泉"].tqfwjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["香山"].fwjsl }}
                        <template
                          v-if="currentMonth['香山'].fwjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['香山'].fwjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["香山"].tqfwjsl }}
                      </td>
                    </tr>

                    <tr>
                      <td style="width: 50px">转换</td>
                      <td style="width: 105px">
                        {{ currentMonth["麻黄山"].ztzhl }}
                        <template
                          v-if="currentMonth['麻黄山'].ztzhlCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['麻黄山'].ztzhlCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["麻黄山"].tqztzhl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["牛首山"].ztzhl }}
                        <template
                          v-if="currentMonth['牛首山'].ztzhlCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['牛首山'].ztzhlCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["牛首山"].tqztzhl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["青山"].ztzhl }}
                        <template
                          v-if="currentMonth['青山'].ztzhlCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['青山'].ztzhlCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["青山"].tqztzhl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["石板泉"].ztzhl }}
                        <template
                          v-if="currentMonth['石板泉'].ztzhlCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['石板泉'].ztzhlCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["石板泉"].tqztzhl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["香山"].ztzhl }}
                        <template
                          v-if="currentMonth['香山'].ztzhlCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['香山'].ztzhlCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["香山"].tqztzhl }}
                      </td>
                    </tr>

                    <tr>
                      <td style="width: 50px">消缺</td>
                      <td style="width: 105px">
                        {{ currentMonth["麻黄山"].xqjsl }}
                        <template
                          v-if="currentMonth['麻黄山'].xqjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['麻黄山'].xqjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["麻黄山"].tqxqjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["牛首山"].xqjsl }}
                        <template
                          v-if="currentMonth['牛首山'].xqjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['牛首山'].xqjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["牛首山"].tqxqjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["青山"].xqjsl }}
                        <template
                          v-if="currentMonth['青山'].xqjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['青山'].xqjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["青山"].tqxqjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["石板泉"].xqjsl }}
                        <template
                          v-if="currentMonth['石板泉'].xqjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['石板泉'].xqjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["石板泉"].tqxqjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["香山"].xqjsl }}
                        <template
                          v-if="currentMonth['香山'].xqjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentMonth['香山'].xqjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentMonth["香山"].tqxqjsl }}
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </el-scrollbar>
          </div>
        </el-col>
        <el-col :span="12">
          <div class="table">
            <table style="width: 100%" border="0" cellspacing="0">
              <thead>
                <tr>
                  <th rowspan="2" class="type1" style="width: 50px"></th>
                  <th colspan="2" class="type1" style="width: 205px">麻黄山</th>
                  <th colspan="2" class="type1" style="width: 205px">牛首山</th>
                  <th colspan="2" class="type1" style="width: 205px">青山</th>
                  <th colspan="2" class="type1" style="width: 205px">石板泉</th>
                  <th colspan="2" class="type1" style="width: 205px">香山</th>
                </tr>
                <tr>
                  <th style="width: 105px">当年</th>
                  <th style="width: 105px">同期</th>
                  <th style="width: 105px">当年</th>
                  <th style="width: 105px">同期</th>
                  <th style="width: 105px">当年</th>
                  <th style="width: 105px">同期</th>
                  <th style="width: 105px">当年</th>
                  <th style="width: 105px">同期</th>
                  <th style="width: 105px">当年</th>
                  <th style="width: 105px">同期</th>
                </tr>
              </thead>
            </table>
            <el-scrollbar>
              <div style="">
                <table
                  style="width: 100%; text-align: center"
                  border="0"
                  cellspacing="0"
                >
                  <tbody>
                    <tr>
                      <td style="width: 50px">MTBF</td>
                      <td style="width: 105px">
                        {{ currentYear["麻黄山"].mtbf }}
                        <template
                          v-if="currentYear['麻黄山'].mttrCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['麻黄山'].mtbfCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["麻黄山"].tqmtbf }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["牛首山"].mtbf }}
                        <template
                          v-if="currentYear['牛首山'].mtbfCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['牛首山'].mtbfCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["牛首山"].tqmtbf }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["青山"].mtbf }}
                        <template v-if="currentYear['青山'].mtbfCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentYear['青山'].mtbfCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["青山"].tqmtbf }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["石板泉"].mtbf }}
                        <template
                          v-if="currentYear['石板泉'].mtbfCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['石板泉'].mtbfCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["石板泉"].tqmtbf }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["香山"].mtbf }}
                        <template v-if="currentYear['香山'].mtbfCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentYear['香山'].mtbfCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["香山"].tqmtbf }}
                      </td>
                    </tr>

                    <tr>
                      <td style="width: 50px">MTTR</td>
                      <td style="width: 105px">
                        {{ currentYear["麻黄山"].mttr }}
                        <template
                          v-if="currentYear['麻黄山'].mttrCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['麻黄山'].mttrCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["麻黄山"].tqmttr }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["牛首山"].mttr }}
                        <template
                          v-if="currentYear['牛首山'].mttrCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['牛首山'].mttrCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["牛首山"].tqmttr }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["青山"].mttr }}
                        <template v-if="currentYear['青山'].mttrCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentYear['青山'].mttrCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["青山"].tqmttr }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["石板泉"].mttr }}
                        <template
                          v-if="currentYear['石板泉'].mttrCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['石板泉'].mttrCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["石板泉"].tqmttr }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["香山"].mttr }}
                        <template v-if="currentYear['香山'].mttrCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentYear['香山'].mttrCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["香山"].tqmttr }}
                      </td>
                    </tr>

                    <tr>
                      <td style="width: 50px">复位</td>
                      <td style="width: 105px">
                        {{ currentYear["麻黄山"].fwjsl }}
                        <template
                          v-if="currentYear['麻黄山'].fwjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['麻黄山'].fwjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["麻黄山"].tqfwjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["牛首山"].mttr }}
                        <template
                          v-if="currentYear['牛首山'].fwjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['牛首山'].fwjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["牛首山"].tqfwjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["青山"].fwjsl }}
                        <template v-if="currentYear['青山'].fwjslCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentYear['青山'].fwjslCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["青山"].tqfwjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["石板泉"].fwjsl }}
                        <template
                          v-if="currentYear['石板泉'].fwjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['石板泉'].fwjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["石板泉"].tqfwjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["香山"].fwjsl }}
                        <template v-if="currentYear['香山'].fwjslCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentYear['香山'].fwjslCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["香山"].tqfwjsl }}
                      </td>
                    </tr>

                    <tr>
                      <td style="width: 50px">转换</td>
                      <td style="width: 105px">
                        {{ currentYear["麻黄山"].ztzhl }}
                        <template
                          v-if="currentYear['麻黄山'].ztzhlCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['麻黄山'].ztzhlCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["麻黄山"].tqztzhl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["牛首山"].ztzhl }}
                        <template
                          v-if="currentYear['牛首山'].ztzhlCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['牛首山'].ztzhlCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["牛首山"].tqztzhl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["青山"].ztzhl }}
                        <template v-if="currentYear['青山'].ztzhlCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentYear['青山'].ztzhlCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["青山"].tqztzhl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["石板泉"].ztzhl }}
                        <template
                          v-if="currentYear['石板泉'].ztzhlCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['石板泉'].ztzhlCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["石板泉"].tqztzhl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["香山"].ztzhl }}
                        <template v-if="currentYear['香山'].ztzhlCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentYear['香山'].ztzhlCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["香山"].tqztzhl }}
                      </td>
                    </tr>

                    <tr>
                      <td style="width: 50px">消缺</td>
                      <td style="width: 105px">
                        {{ currentYear["麻黄山"].xqjsl }}
                        <template
                          v-if="currentYear['麻黄山'].xqjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['麻黄山'].xqjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["麻黄山"].tqxqjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["牛首山"].xqjsl }}
                        <template
                          v-if="currentYear['牛首山'].xqjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['牛首山'].xqjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["牛首山"].tqxqjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["青山"].xqjsl }}
                        <template v-if="currentYear['青山'].xqjslCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentYear['青山'].xqjslCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["青山"].tqxqjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["石板泉"].xqjsl }}
                        <template
                          v-if="currentYear['石板泉'].xqjslCompare === 1"
                        >
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template
                          v-if="currentYear['石板泉'].xqjslCompare === 2"
                        >
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["石板泉"].tqxqjsl }}
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["香山"].xqjsl }}
                        <template v-if="currentYear['香山'].xqjslCompare === 1">
                          <span class="svg-icon svg-icon-yellow">
                            <svg-icon svgid="svg-arrow-dpwn-1" />
                          </span>
                        </template>
                        <template v-if="currentYear['香山'].xqjslCompare === 2">
                          <span class="svg-icon svg-icon-green">
                            <svg-icon svgid="svg-arrow-up-1" />
                          </span>
                        </template>
                      </td>
                      <td style="width: 105px">
                        {{ currentYear["香山"].tqxqjsl }}
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </el-scrollbar>
          </div></el-col
        >
      </el-row>
      <el-row :gutter="20" class="pie-chart-panel">
        <el-col :span="6">
          <panel title="当月理论平衡分析">
            <dual-pie-chart
              height="27.296vh"
              :innerData="innerDataCurentsChart"
              :outerData="innerDataCurentsChart"
            />
          </panel>
        </el-col>
        <el-col :span="6">
          <panel title="同期理论平衡分析">
            <dual-pie-chart
              height="27.296vh"
              :innerData="innerDataSameChart"
              :outerData="innerDataSameChart"
            />
          </panel>
        </el-col>
        <el-col :span="6">
          <panel title="当年理论平衡分析">
            <dual-pie-chart
              height="27.296vh"
              :innerData="innerDataCurentsYearChart"
              :outerData="innerDataCurentsYearChart"
            />
          </panel>
        </el-col>
        <el-col :span="6">
          <panel title="年同期理论平衡分析">
            <dual-pie-chart
              height="27.296vh"
              :innerData="innerDataSameYearChart"
              :outerData="innerDataSameYearChart"
            />
          </panel>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import VertivalBarLineChart from "../../components/chart/combination/vertival-bar-line-chart.vue";
import Panel from "../../components/coms/panel/panel.vue";
import DualPieChart from "../../components/chart/pie/dual-pie-chart.vue";
import SvgIcon from "../../components/coms/icon/svg-icon.vue";
import Get_PDF from "@tools/htmlToPdf";
import api from "@api/economic/index.js";
export default {
  setup() {},
  components: {
    Panel,
    DualPieChart,
    SvgIcon,
    VertivalBarLineChart,
  },
  data() {
    return {
      pickerOptions: {},
      bardata: { area: [], legend: [], data: [] }, // 损失电量分析echart数值
      lineData: [],
      timmer: null,
      monthValue: this.getmonthValue(),
      nowCurrents: {},
      innerDataCurentsChart: [],
      innerDataSameChart: [],
      innerDataCurentsYearChart: [],
      innerDataSameYearChart: [],
      currentMonth: {
        麻黄山: {},
        牛首山: {},
        石板泉: {},
        香山: {},
        青山: {},
      },
      currentYear: {
        麻黄山: {},
        牛首山: {},
        石板泉: {},
        香山: {},
        青山: {},
      },
      compares: {},
      sameList: {},
    };
  },
  created() {
    let _this = this;
    _this.$nextTick(() => {
      _this.getMonthList(false);
      _this.getSecordList(false);
      // _this.timmer = setInterval(() => {
      //   _this.getMonthList(false);
      //   _this.getSecordList(false);
      // }, _this.$store.state.websocketTimeSec);
    });
  },
  unmounted() {
    clearInterval(this.timmer);
    this.timmer = null;
  },
  mounted() {},
  methods: {
    exportPDF(name) {
      this.BASE.showMsg({
        type: "success",
        msg: "正在导出...请稍后...",
      });
      Get_PDF.downloadPDF(document.querySelector(".pdfDom"), "综合分析导出");
    },
    getmonthValue() {
      let data = new Date();
      let year = data.getFullYear();
      let month =
        data.getMonth() > 9 ? data.getMonth() : "0" + (data.getMonth() + 1);
      let toMonth = year + "-" + month;
      return toMonth;
    },
    monthChange(data) {
      let year = data.getFullYear();
      let month =
        data.getMonth() > 9 ? data.getMonth() : "0" + (data.getMonth() + 1);
      let toMonth = year + "-" + month;
      return toMonth;
    },
    onClickSearch() {
      this.getMonthList(false);
      this.getSecordList(false);
    },

    isNumber(val) {
      return typeof val === "number" && !isNaN(val);
    },
    getSecordList(showLoading) {
      let _this = this;
      let months = "";
      if (typeof this.monthValue === "string") {
        months = this.monthValue;
      } else {
        months = this.monthChange(this.monthValue);
      }

      api.specificMaincenterlist({
          month: months,
      }).then((res) => {
             let currentMonth = {};
          let currentYear = {};
          res.data["当月"].map((item) => {
            for (let key in item) {
              if (this.isNumber(item[key]) && key.indexOf("Compare") === -1) {
                item[key] = item[key].toFixed(2);
              }
            }
            if (item.wpid === "麻黄山风电场") {
              currentMonth["麻黄山"] = item;
            } else if (item.wpid === "牛首山风电场") {
              currentMonth["牛首山"] = item;
            } else if (item.wpid === "青山风电场") {
              currentMonth["青山"] = item;
            } else if (item.wpid === "石板泉风电场") {
              currentMonth["石板泉"] = item;
            } else if (item.wpid === "香山风电场") {
              currentMonth["香山"] = item;
            }
          });
          res.data["当年"].map((item) => {
            for (let key in item) {
              if (this.isNumber(item[key]) && key.indexOf("Compare") === -1) {
                item[key] = item[key].toFixed(2);
              }
            }
            if (item.wpid === "麻黄山风电场") {
              currentYear["麻黄山"] = item;
            } else if (item.wpid === "牛首山风电场") {
              currentYear["牛首山"] = item;
            } else if (item.wpid === "青山风电场") {
              currentYear["青山"] = item;
            } else if (item.wpid === "石板泉风电场") {
              currentYear["石板泉"] = item;
            } else if (item.wpid === "香山风电场") {
              currentYear["香山"] = item;
            }
          });
          this.currentMonth = currentMonth;
          this.currentYear = currentYear;
      });



      // _this.API.requestData({
      //   showLoading,
      //   method: "GET",
      //   baseURL: "http://10.155.32.4:8034",
      //   subUrl: "/specific/maincenterlist",
      //   data: {
      //     month: months,
      //   },
      //   success(res) {
      //     let currentMonth = {};
      //     let currentYear = {};
      //     res.data["当月"].map((item) => {
      //       for (let key in item) {
      //         if (_this.isNumber(item[key]) && key.indexOf("Compare") === -1) {
      //           item[key] = item[key].toFixed(2);
      //         }
      //       }
      //       if (item.wpid === "麻黄山风电场") {
      //         currentMonth["麻黄山"] = item;
      //       } else if (item.wpid === "牛首山风电场") {
      //         currentMonth["牛首山"] = item;
      //       } else if (item.wpid === "青山风电场") {
      //         currentMonth["青山"] = item;
      //       } else if (item.wpid === "石板泉风电场") {
      //         currentMonth["石板泉"] = item;
      //       } else if (item.wpid === "香山风电场") {
      //         currentMonth["香山"] = item;
      //       }
      //     });
      //     res.data["当年"].map((item) => {
      //       for (let key in item) {
      //         if (_this.isNumber(item[key]) && key.indexOf("Compare") === -1) {
      //           item[key] = item[key].toFixed(2);
      //         }
      //       }
      //       if (item.wpid === "麻黄山风电场") {
      //         currentYear["麻黄山"] = item;
      //       } else if (item.wpid === "牛首山风电场") {
      //         currentYear["牛首山"] = item;
      //       } else if (item.wpid === "青山风电场") {
      //         currentYear["青山"] = item;
      //       } else if (item.wpid === "石板泉风电场") {
      //         currentYear["石板泉"] = item;
      //       } else if (item.wpid === "香山风电场") {
      //         currentYear["香山"] = item;
      //       }
      //     });
      //     _this.currentMonth = currentMonth;
      //     _this.currentYear = currentYear;
      //   },
      // });
    },
    getMonthList(showLoading) {
      let _this = this;
      let months = "";
      if (typeof this.monthValue === "string") {
        months = this.monthValue;
      } else {
        months = this.monthChange(this.monthValue);
      }

        api.specificMaintoplist({
        month: months,
      }).then((res) => {
           res.data.map((item) => {
            for (let key in item) {
              if (this.isNumber(item[key]) && item.type !== "比较") {
                item[key] = item[key].toFixed(2);
              }
            }
            if (item.type === "本期") {
              this.nowCurrents = item;
              this.innerDataCurentsChart = [
                {
                  value: item.ywhssl,
                  name: "维护损失率",
                },
                {
                  value: item.ygzssl,
                  name: "故障损失率",
                },
                {
                  value: item.yxdssl,
                  name: "限电损失率",
                },
                {
                  value: item.yxnssl,
                  name: "性能损失率",
                },
                {
                  value: item.yslssl,
                  name: "受累损失率",
                },
                {
                  value: item.yfnlyl,
                  name: "风能利用率",
                },
              ];

              this.innerDataCurentsYearChart = [
                {
                  value: item.nwhssl,
                  name: "维护损失率",
                },
                {
                  value: item.ngzssl,
                  name: "故障损失率",
                },
                {
                  value: item.nxdssl,
                  name: "限电损失率",
                },
                {
                  value: item.nxnssl,
                  name: "性能损失率",
                },
                {
                  value: item.nslssl,
                  name: "受累损失率",
                },
                {
                  value: item.nfnlyl,
                  name: "风能利用率",
                },
              ];
            } else if (item.type === "比较") {
              this.compares = item;
            } else {
              this.sameList = item;
              this.innerDataSameChart = [
                {
                  value: item.ywhssl,
                  name: "维护损失率",
                },
                {
                  value: item.ygzssl,
                  name: "故障损失率",
                },
                {
                  value: item.yxdssl,
                  name: "限电损失率",
                },
                {
                  value: item.yxnssl,
                  name: "性能损失率",
                },
                {
                  value: item.yslssl,
                  name: "受累损失率",
                },
                {
                  value: item.yfnlyl,
                  name: "风能利用率",
                },
              ];
              this.innerDataSameYearChart = [
                {
                  value: item.nwhssl,
                  name: "维护损失率",
                },
                {
                  value: item.ngzssl,
                  name: "故障损失率",
                },
                {
                  value: item.nxdssl,
                  name: "限电损失率",
                },
                {
                  value: item.nxnssl,
                  name: "性能损失率",
                },
                {
                  value: item.nslssl,
                  name: "受累损失率",
                },
                {
                  value: item.nfnlyl,
                  name: "风能利用率",
                },
              ];
            }
          });
      });




      // _this.API.requestData({
      //   showLoading,
      //   method: "GET",
      //   baseURL: "http://10.155.32.4:8034",
      //   subUrl: "/specific/maintoplist",
      //   data: {
      //     month: months,
      //   },
      //   success(res) {
      //     res.data.map((item) => {
      //       for (let key in item) {
      //         if (_this.isNumber(item[key]) && item.type !== "比较") {
      //           item[key] = item[key].toFixed(2);
      //         }
      //       }
      //       if (item.type === "本期") {
      //         _this.nowCurrents = item;
      //         _this.innerDataCurentsChart = [
      //           {
      //             value: item.ywhssl,
      //             name: "维护损失率",
      //           },
      //           {
      //             value: item.ygzssl,
      //             name: "故障损失率",
      //           },
      //           {
      //             value: item.yxdssl,
      //             name: "限电损失率",
      //           },
      //           {
      //             value: item.yxnssl,
      //             name: "性能损失率",
      //           },
      //           {
      //             value: item.yslssl,
      //             name: "受累损失率",
      //           },
      //           {
      //             value: item.yfnlyl,
      //             name: "风能利用率",
      //           },
      //         ];

      //         _this.innerDataCurentsYearChart = [
      //           {
      //             value: item.nwhssl,
      //             name: "维护损失率",
      //           },
      //           {
      //             value: item.ngzssl,
      //             name: "故障损失率",
      //           },
      //           {
      //             value: item.nxdssl,
      //             name: "限电损失率",
      //           },
      //           {
      //             value: item.nxnssl,
      //             name: "性能损失率",
      //           },
      //           {
      //             value: item.nslssl,
      //             name: "受累损失率",
      //           },
      //           {
      //             value: item.nfnlyl,
      //             name: "风能利用率",
      //           },
      //         ];
      //       } else if (item.type === "比较") {
      //         _this.compares = item;
      //       } else {
      //         _this.sameList = item;
      //         _this.innerDataSameChart = [
      //           {
      //             value: item.ywhssl,
      //             name: "维护损失率",
      //           },
      //           {
      //             value: item.ygzssl,
      //             name: "故障损失率",
      //           },
      //           {
      //             value: item.yxdssl,
      //             name: "限电损失率",
      //           },
      //           {
      //             value: item.yxnssl,
      //             name: "性能损失率",
      //           },
      //           {
      //             value: item.yslssl,
      //             name: "受累损失率",
      //           },
      //           {
      //             value: item.yfnlyl,
      //             name: "风能利用率",
      //           },
      //         ];
      //         _this.innerDataSameYearChart = [
      //           {
      //             value: item.nwhssl,
      //             name: "维护损失率",
      //           },
      //           {
      //             value: item.ngzssl,
      //             name: "故障损失率",
      //           },
      //           {
      //             value: item.nxdssl,
      //             name: "限电损失率",
      //           },
      //           {
      //             value: item.nxnssl,
      //             name: "性能损失率",
      //           },
      //           {
      //             value: item.nslssl,
      //             name: "受累损失率",
      //           },
      //           {
      //             value: item.nfnlyl,
      //             name: "风能利用率",
      //           },
      //         ];
      //       }
      //     });
      //   },
      // });
    },
  },
};
</script>

<style lang="less">
.ztfx {
  font-size: 12px;
  .select-btn {
    width: 92px;
  }
  .com-panel {
    border: 1px solid #6067697d;
  }
  .table-complex {
    margin-top: 10px;
    .table {
      border: 1px solid #6067697d;
      tbody {
        tr:nth-child(2n) td {
          background-color: fade(@gray, 20%);

          &.item {
            background-color: transparent;
          }
        }
      }

      th {
        background: fade(@gray, 40);
        font-size: 12px;
        font-weight: 400;
        line-height: 24px;
        color: @gray-l;

        &.type1 {
          border-left: 0;
          border-right: 0;
        }
      }
      td {
        color: @gray-l;
        text-align: center;
        height: 26px;
        line-height: 26px;

        &.item {
          width: 100px;
        }
      }
      svg {
        height: 1.222vh;
      }
    }
  }
  .table-panel {
    margin-top: 10px;
    .panel-header {
      text-align: center;
    }
    .table {
      border: 1px solid #6067697d;
      tbody {
        tr:nth-child(2n) td {
          background-color: fade(@gray, 20%);

          &.item {
            background-color: transparent;
          }
        }
      }
      .td-item {
        width: 6vh;
      }
      th {
        background: fade(@gray, 40);
        font-size: 12px;
        font-weight: 400;
        line-height: 24px;
        color: @gray-l;

        &.type1 {
          border-left: 0;
          border-right: 0;
          height: 4vh;
        }
      }
      td {
        color: @gray-l;
        text-align: center;
        height: 26px;
        line-height: 26px;

        &.item {
          width: 100px;
        }
      }
      svg {
        height: 1.222vh;
      }
    }
  }
  .pie-chart-panel {
    margin-top: 10px;
    .line {
      border: none;
    }
  }
}
</style>