<template>
  <div class="app-container" style="overflow-x: auto;">
    <!-- 操作栏 -->
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="报告日期" prop="reportDate">
        <el-date-picker clearable size="small" style="width: 200px"
                        @change="handleQuery"
                        v-model="queryParams.reportDate"
                        type="date"
                        value-format="yyyy-MM-dd"
                        placeholder="选择报告日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button
          :disabled="updating"
          icon="el-icon-edit"
          size="mini"
          @click="handleUpdate"
          v-hasPermi="['production:report:edit']"
        >编辑</el-button>
      </el-form-item>
      <el-form-item>
        <el-button
          :disabled="!updating"
          type="success"
          icon="el-icon-check"
          size="mini"
          @click="handleConfirmUpdate"
          v-hasPermi="['production:report:edit']"
        >保存</el-button>
      </el-form-item>
      <el-form-item>
        <el-button
          :disabled="!updating"
          type="info"
          icon="el-icon-close"
          size="mini"
          @click="handleCancelUpdate"
          v-hasPermi="['production:report:edit']"
        >取消</el-button>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-upload2"
          size="mini"
          @click="handleImport"
          v-hasPermi="['production:report:edit']"
        >导入</el-button>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          size="mini"
          @click="handleSeeMonthData"
          v-hasPermi="['production:report:list']"
        >查看月度数据</el-button>
      </el-form-item>
      <!--<el-form-item>-->
        <!--<el-button-->
          <!--type="warning"-->
          <!--icon="el-icon-download"-->
          <!--size="mini"-->
          <!--@click="handleExport"-->
          <!--v-hasPermi="['production:report:export']"-->
        <!--&gt;导出</el-button>-->
      <!--</el-form-item>-->
    </el-form>
    <!-- 表格 -->
    <form>
      <div style="height: calc(100vh - 200px);">
        <table border>
          <tr class="bg-yellow">
            <td class="no-border ft-blue" colspan="10">Confidential 保密信息</td>
            <td class="no-border" colspan="6" style="font-size: 26px;">Cracker & Aromatics Daily Production Report</td>
            <td class="no-border" colspan="4"></td>
            <td class="no-border" colspan="2">CBP-7.5.1-SCFPP-002</td>
          </tr>
          <tr class="bg-yellow">
            <td class="no-border" colspan="10"></td>
            <td class="no-border bg-blue">{{reportData.fromDate}}</td>
            <td class="no-border bg-blue-green-neon">TO</td>
            <td class="no-border bg-blue">{{reportData.toDate}}</td>
            <td class="no-border">Duration</td>
            <td class="no-border">1</td>
            <td class="no-border">Days</td>
            <td class="no-border" colspan="5"></td>
            <td class="no-border">REV.06</td>
          </tr>
          <tr class="bg-yellow">
            <td class="no-border"></td>
            <td class="no-border" colspan="3">Material Balance</td>
            <td class="no-border" colspan="14"></td>
            <td class="no-border">Unit: </td>
            <td class="no-border">Ton</td>
            <td class="no-border">Date: </td>
            <td class="no-border bg-blue">{{reportData.reportDate}}</td>
          </tr>
          <tr>
            <td class="bg-blue-light" id="Nap">Nap</td>
            <td class="no-border"></td>
            <td class="bg-green" rowspan="35">Cracker</td>
            <td class="no-border" rowspan="2" colspan="2"></td>
            <td class="bg-blue-light"></td>
            <td class="bg-blue-light">yield %</td>
            <td class="bg-blue-light">Produced</td>
            <td class="bg-blue-light">Inventory</td>
            <td class="bg-blue-light">Change</td>
            <td class="bg-blue-light">Import</td>
            <td class="bg-blue-light">Export</td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('nap', 'Nap')">
              <span v-if="!updating">{{reportData.nap}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.nap"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">H2</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('h2_yield_percentage', 'H2 yield%')">
              <span v-if="!updating">{{reportData.h2YieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.h2YieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('h2_produced', 'H2 Produced')">
              <span v-if="!updating">{{reportData.h2Produced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.h2Produced"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('h2_inventory', 'H2 Inventory')">
              <span v-if="!updating">{{reportData.h2Inventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.h2Inventory"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('h2_change', 'H2 Change')">
              <span v-if="!updating">{{reportData.h2Change}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.h2Change"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('h2_import', 'H2 Import')">
              <span v-if="!updating">{{reportData.h2Import}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.h2Import"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('h2_export', 'H2 Export')">
              <span v-if="!updating">{{reportData.h2Export}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.h2Export"/>
            </td>
            <td class="bg-blue-light">To PGU</td>
            <td class="bg-blue-light">To YPC</td>
            <td class="bg-blue-light">To OXO</td>
            <td class="bg-blue-light">Fr Syngas to SUB</td>
          </tr>
          <tr>
            <td class="bg-blue-light">C5</td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('h2_to_pgu', 'H2 To Pgu')">
              <span v-if="!updating">{{reportData.h2ToPgu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.h2ToPgu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('h2_to_ypc', 'H2 To Ypc')">
              <span v-if="!updating">{{reportData.h2ToYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.h2ToYpc"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('h2_to_oxo', 'H2 To Oxo')">
              <span v-if="!updating">{{reportData.h2ToOxo}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.h2ToOxo"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('h2_fr_syngas_to_sub', 'H2 Fr Syngas to Sub')">
              <span v-if="!updating">{{reportData.h2FrSyngasToSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.h2FrSyngasToSub"/>
            </td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('c5', 'C5')">
              <span v-if="!updating">{{reportData.c5}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c5"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">ETHYLEN</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ethylen_yield_percentage', 'ETHYLEN yield%')">
              <span v-if="!updating">{{reportData.ethylenYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ethylen_produced', 'ETHYLEN Produced')">
              <span v-if="!updating">{{reportData.ethylenProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenProduced"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ethylen_inventory', 'ETHYLEN Inventory')">
              <span v-if="!updating">{{reportData.ethylenInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenInventory"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ethylen_change', 'ETHYLEN Change')">
              <span v-if="!updating">{{reportData.ethylenChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenChange"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ethylen_import', 'ETHYLEN Import')">
              <span v-if="!updating">{{reportData.ethylenImport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenImport"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ethylen_export', 'ETHYLEN Export')">
              <span v-if="!updating">{{reportData.ethylenExport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenExport"/>
            </td>
            <td class="bg-blue-light">To TM</td>
            <td class="bg-blue-light">To TS</td>
            <td class="bg-blue-light">To EO/EG</td>
            <td class="bg-blue-light">To OXO</td>
            <td class="bg-blue-light">To YBS</td>
            <td class="bg-blue-light">To YPC</td>
            <td class="bg-blue-light">To Wacker</td>
            <td class="bg-blue-light">To Dyna</td>
            <td class="bg-blue-light">To Celan./longx.</td>
            <td class="bg-blue-light">Fr YPC</td>
            <td class="bg-blue-light">Fr Longxiang</td>
          </tr>
          <tr>
            <td class="bg-blue-light">C6-C8-NA</td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_to_tm', 'ETHYLEN To TM')">
              <span v-if="!updating">{{reportData.ethylenToTm}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenToTm"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_to_ts', 'ETHYLEN To TS')">
              <span v-if="!updating">{{reportData.ethylenToTs}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenToTs"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_to_eo_eg', 'ETHYLEN To EO/EG')">
              <span v-if="!updating">{{reportData.ethylenToEoEg}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenToEoEg"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_to_oxo', 'ETHYLEN To OXO')">
              <span v-if="!updating">{{reportData.ethylenToOxo}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenToOxo"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_to_ybs', 'ETHYLEN To YBS')">
              <span v-if="!updating">{{reportData.ethylenToYbs}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenToYbs"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_to_ypc', 'ETHYLEN To YPC')">
              <span v-if="!updating">{{reportData.ethylenToYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenToYpc"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_to_wacker', 'ETHYLEN To Wacker')">
              <span v-if="!updating">{{reportData.ethylenToWacker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenToWacker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_to_dyna', 'ETHYLEN To Dyna')">
              <span v-if="!updating">{{reportData.ethylenToDyna}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenToDyna"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_to_celan_longx', 'ETHYLEN To Celan./longx.')">
              <span v-if="!updating">{{reportData.ethylenToCelanLongx}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenToCelanLongx"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_fr_ypc', 'ETHYLEN Fr Ypc')">
              <span v-if="!updating">{{reportData.ethylenFrYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenFrYpc"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ethylen_fr_longxiang', 'ETHYLEN Fr Longxiang')">
              <span v-if="!updating">{{reportData.ethylenFrLongxiang}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ethylenFrLongxiang"/>
            </td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('c6_c8_na', 'C6-C8-NA')">
              <span v-if="!updating">{{reportData.c6C8Na}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c6C8Na"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">Propylene</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('propylene_yield_percentage', 'Propylene yield%')">
              <span v-if="!updating">{{reportData.propyleneYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('propylene_produced', 'Propylene Produced')">
              <span v-if="!updating">{{reportData.propyleneProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneProduced"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('propylene_inventory', 'Propylene Inventory')">
              <span v-if="!updating">{{reportData.propyleneInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneInventory"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('propylene_change', 'Propylene Change')">
              <span v-if="!updating">{{reportData.propyleneChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneChange"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('propylene_import', 'Propylene Import')">
              <span v-if="!updating">{{reportData.propyleneImport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneImport"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('propylene_export', 'Propylene Export')">
              <span v-if="!updating">{{reportData.propyleneExport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneExport"/>
            </td>
            <td class="bg-blue-light">To AA/AE</td>
            <td class="bg-blue-light">To GAA</td>
            <td class="bg-blue-light">To OXO</td>
            <td class="bg-blue-light">To LDPE</td>
            <td class="bg-blue-light">To YPC</td>
            <td class="bg-blue-light">To Road</td>
            <td class="bg-blue-light">To Ship</td>
            <td class="bg-blue-light">Fr YPC</td>
            <td class="bg-blue-light">Fr Ship</td>
            <td class="bg-blue-light">Fr Chengzhi</td>
          </tr>
          <tr>
            <td class="bg-blue-light">wison Ethane </td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('propylene_to_aa_ae', 'Propylene To AA/AE')">
              <span v-if="!updating">{{reportData.propyleneToAaAe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneToAaAe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('propylene_to_gaa', 'Propylene To GAA')">
              <span v-if="!updating">{{reportData.propyleneToGaa}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneToGaa"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('propylene_to_oxo', 'Propylene To OXO')">
              <span v-if="!updating">{{reportData.propyleneToOxo}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneToOxo"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('propylene_to_ldpe', 'Propylene To LDPE')">
              <span v-if="!updating">{{reportData.propyleneToLdpe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneToLdpe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('propylene_to_ypc', 'Propylene To YPC')">
              <span v-if="!updating">{{reportData.propyleneToYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneToYpc"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('propylene_to_road', 'Propylene To Road')">
              <span v-if="!updating">{{reportData.propyleneToRoad}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneToRoad"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('propylene_to_ship', 'Propylene To Ship')">
              <span v-if="!updating">{{reportData.propyleneToShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneToShip"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('propylene_fr_ypc', 'Propylene Fr YPC')">
              <span v-if="!updating">{{reportData.propyleneFrYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneFrYpc"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('propylene_fr_ship', 'Propylene Fr Ship')">
              <span v-if="!updating">{{reportData.propyleneFrShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneFrShip"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('propylene_fr_chengzhi', 'Propylene Fr Chengzhi')">
              <span v-if="!updating">{{reportData.propyleneFrChengzhi}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.propyleneFrChengzhi"/>
            </td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('wison_ethane', 'wison Ethane')">
              <span v-if="!updating">{{reportData.wisonEthane}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.wisonEthane"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light">C3 LPG</td>
            <td class="bg-yellow-light" @click="openDialog('c3_lpg_yield_percentage', 'C3 LPG yield%')">
              <span v-if="!updating">{{reportData.c3LpgYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3LpgYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('c3_lpg_produced', 'C3 LPG Produced')">
              <span v-if="!updating">{{reportData.c3LpgProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3LpgProduced"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('c3_c4_inventory', 'C3/C4 Inventory')">
              <span v-if="!updating">{{reportData.c3C4Inventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3C4Inventory"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('c3_c4_change', 'C3/C4 Change')">
              <span v-if="!updating">{{reportData.c3C4Change}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3C4Change"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('c3_c4_import', 'C3/C4 Import')">
              <span v-if="!updating">{{reportData.c3C4Import}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3C4Import"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('c3_c4_export', 'C3/C4 Export')">
              <span v-if="!updating">{{reportData.c3C4Export}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3C4Export"/>
            </td>
            <td class="bg-blue-light">To SUB</td>
            <td class="bg-blue-light">To Fur as fule</td>
            <td class="bg-blue-light">As Feed</td>
            <td class="bg-blue-light">Fr YPC</td>
            <td class="bg-blue-light">Fr Truck</td>
          </tr>
          <tr>
            <td class="bg-blue-light">LPG to furnace</td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-blue-light">C4 LPG</td>
            <td class="bg-yellow-light" @click="openDialog('c4_lpg_yield_percentage', 'C4 LPG yield%')">
              <span v-if="!updating">{{reportData.c4LpgYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c4LpgYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('c4_lpg_Produced', 'C4 LPG Produced')">
              <span v-if="!updating">{{reportData.c4LpgProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c4LpgProduced"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('c3_c4_to_sub', 'C3/C4 To SUB')">
              <span v-if="!updating">{{reportData.c3C4ToSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3C4ToSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('c3_c4_to_fur_as_fule', 'C3/C4 To Fur As Fule')">
              <span v-if="!updating">{{reportData.c3C4ToFurAsFule}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3C4ToFurAsFule"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('c3_c4_as_feed', 'C3/C4 As Feed')">
              <span v-if="!updating">{{reportData.c3C4AsFeed}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3C4AsFeed"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('c3_c4_fr_ypc', 'C3/C4 Fr YPC')">
              <span v-if="!updating">{{reportData.c3C4FrYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3C4FrYpc"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('c3_c4_fr_truck', 'C3/C4 Fr Truck')">
              <span v-if="!updating">{{reportData.c3C4FrTruck}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3C4FrTruck"/>
            </td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('lpg_to_furnace', 'LPG to furnace')">
              <span v-if="!updating">{{reportData.lpgToFurnace}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpgToFurnace"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">MixedC4'S</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('mixed_c4s_yield_percentage', 'MixedC4\'S yield%')">
              <span v-if="!updating">{{reportData.mixedC4sYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('mixed_c4s_produced', 'MixedC4\'S Produced')">
              <span v-if="!updating">{{reportData.mixedC4sProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sProduced"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('mixed_c4s_inventory', 'MixedC4\'S Inventory')">
              <span v-if="!updating">{{reportData.mixedC4sInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sInventory"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('mixed_c4s_change', 'MixedC4\'S Change')">
              <span v-if="!updating">{{reportData.mixedC4sChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sChange"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('mixed_c4s_import', 'MixedC4\'S Import')">
              <span v-if="!updating">{{reportData.mixedC4sImport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sImport"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('mixed_c4s_export', 'MixedC4\'S Export')">
              <span v-if="!updating">{{reportData.mixedC4sExport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sExport"/>
            </td>
            <td class="bg-blue-light">To BD</td>
            <td class="bg-blue-light">To YPC</td>
            <td class="bg-blue-light">To Truck</td>
            <td class="bg-blue-light">To ship</td>
            <td class="bg-blue-light">Fr YPC</td>
            <td class="bg-blue-light">Fr Truck</td>
            <td class="bg-blue-light">Fr ship</td>
            <td class="bg-blue-light">FR BD R1</td>
            <td class="bg-blue-light">TO R800</td>
          </tr>
          <tr>
            <td class="bg-blue-light">Raff1 fr BD</td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('mixed_c4s_to_bd', 'MixedC4\'S To BD')">
              <span v-if="!updating">{{reportData.mixedC4sToBd}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sToBd"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mixed_c4s_to_ypc', 'MixedC4\'S To YPC')">
              <span v-if="!updating">{{reportData.mixedC4sToYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sToYpc"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mixed_c4s_to_truck', 'MixedC4\'S To Truck')">
              <span v-if="!updating">{{reportData.mixedC4sToTruck}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sToTruck"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mixed_c4s_to_ship', 'MixedC4\'S To Ship')">
              <span v-if="!updating">{{reportData.mixedC4sToShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sToShip"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mixed_c4s_fr_ypc', 'MixedC4\'S Fr YPC')">
              <span v-if="!updating">{{reportData.mixedC4sFrYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sFrYpc"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mixed_c4s_fr_truck', 'MixedC4\'S Fr Truck')">
              <span v-if="!updating">{{reportData.mixedC4sFrTruck}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sFrTruck"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mixed_c4s_fr_ship', 'MixedC4\'S Fr Ship')">
              <span v-if="!updating">{{reportData.mixedC4sFrShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sFrShip"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mixed_c4s_fr_bd_r1', 'MixedC4\'S Fr BD R1')">
              <span v-if="!updating">{{reportData.mixedC4sFrBdR1}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sFrBdR1"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mixed_c4s_to_r800', 'MixedC4\'S To R800')">
              <span v-if="!updating">{{reportData.mixedC4sToR800}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC4sToR800"/>
            </td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('raff1_fr_bd', 'Raff1 Fr BD')">
              <span v-if="!updating">{{reportData.raff1FrBd}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.raff1FrBd"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">EBO</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ebo_yield_percentage', 'EBO yield%')">
              <span v-if="!updating">{{reportData.eboYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.eboYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ebo_produced', 'EBO Produced')">
              <span v-if="!updating">{{reportData.eboProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.eboProduced"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ebo_inventory', 'EBO Inventory')">
              <span v-if="!updating">{{reportData.eboInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.eboInventory"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ebo_change', 'EBO Change')">
              <span v-if="!updating">{{reportData.eboChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.eboChange"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ebo_import', 'EBO Import')">
              <span v-if="!updating">{{reportData.eboImport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.eboImport"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('ebo_export', 'EBO Export')">
              <span v-if="!updating">{{reportData.eboExport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.eboExport"/>
            </td>
            <td class="bg-blue-light">To Ship</td>
            <td class="bg-blue-light">To RTTF</td>
            <td class="bg-blue-light">To Train</td>
            <td class="bg-blue-light">Fr BD</td>
          </tr>
          <tr>
            <td class="bg-blue-light">Raff2 fr IB</td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('ebo_to_ship', 'EBO To Ship')">
              <span v-if="!updating">{{reportData.eboToShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.eboToShip"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ebo_to_rttf', 'EBO To RTTF')">
              <span v-if="!updating">{{reportData.eboToRttf}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.eboToRttf"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ebo_to_train', 'EBO To Train')">
              <span v-if="!updating">{{reportData.eboToTrain}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.eboToTrain"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ebo_fr_bd', 'EBO Fr BD')">
              <span v-if="!updating">{{reportData.eboFrBd}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.eboFrBd"/>
            </td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('raff2_fr_ib', 'Raff2 Fr IB')">
              <span v-if="!updating">{{reportData.raff2FrIb}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.raff2FrIb"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">Naphthalene</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('naphthalene_yield_percentage', 'Naphthalene yield%')">
              <span v-if="!updating">{{reportData.naphthaleneYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.naphthaleneYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('naphthalene_produced', 'Naphthalene Produced')">
              <span v-if="!updating">{{reportData.naphthaleneProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.naphthaleneProduced"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('naphthalene_inventory', 'Naphthalene Inventory')">
              <span v-if="!updating">{{reportData.naphthaleneInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.naphthaleneInventory"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('naphthalene_change', 'Naphthalene Change')">
              <span v-if="!updating">{{reportData.naphthaleneChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.naphthaleneChange"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('naphthalene_import', 'Naphthalene Import')">
              <span v-if="!updating">{{reportData.naphthaleneImport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.naphthaleneImport"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('naphthalene_export', 'Naphthalene Export')">
              <span v-if="!updating">{{reportData.naphthaleneExport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.naphthaleneExport"/>
            </td>
            <td class="bg-blue-light">To Truck</td>
            <td class="no-border" colspan="9"></td>
            <td class="bg-blue-light" colspan="2">Export & Import</td>
          </tr>
          <tr>
            <td class="bg-blue-light">Raff3 fr BD</td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('naphthalene_to_truck', 'Naphthalene To Truck')">
              <span v-if="!updating">{{reportData.naphthaleneToTruck}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.naphthaleneToTruck"/>
            </td>
            <td class="no-border" colspan="9"></td>
            <td class="bg-blue-light">To ship</td>
            <td class="bg-blue-light">Fr ship</td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('raff3_fr_bd', 'Faff3 Fr BD')">
              <span v-if="!updating">{{reportData.raff3FrBd}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.raff3FrBd"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">PO/Flux Oil</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('po_flux_oil_yield_percentage', 'PO/Flux Oil yield%')">
              <span v-if="!updating">{{reportData.poFluxOilYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.poFluxOilYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('po_flux_oil_produced', 'PO/Flux Oil Produced')">
              <span v-if="!updating">{{reportData.poFluxOilProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.poFluxOilProduced"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('po_flux_oil_inventory', 'PO/Flux Oil Inventory')">
              <span v-if="!updating">{{reportData.poFluxOilInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.poFluxOilInventory"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('po_flux_oil_change', 'PO/Flux Oil Change')">
              <span v-if="!updating">{{reportData.poFluxOilChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.poFluxOilChange"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('po_flux_oil_import', 'PO/Flux Oil Import')">
              <span v-if="!updating">{{reportData.poFluxOilImport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.poFluxOilImport"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('po_flux_oil_export', 'PO/Flux Oil Export')">
              <span v-if="!updating">{{reportData.poFluxOilExport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.poFluxOilExport"/>
            </td>
            <td class="bg-blue-light">To BD</td>
            <td class="no-border" colspan="5"></td>
            <td class="bg-blue-light">To GAA/CAA</td>
            <td class="no-border" colspan="3"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_benzene_to_ship', 'AEU Benzene To Ship')">
              <span v-if="!updating">{{reportData.aeuBenzeneToShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuBenzeneToShip"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_benzene_fr_ship', 'AEU Benzene Fr Ship')">
              <span v-if="!updating">{{reportData.aeuBenzeneFrShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuBenzeneFrShip"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-light">Raffinate II P fr 2PH</td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('po_flux_oil_to_bd', 'PO/Flux Oil To BD')">
              <span v-if="!updating">{{reportData.poFluxOilToBd}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.poFluxOilToBd"/>
            </td>
            <td class="no-border" colspan="5"></td>
            <td class="bg-yellow-light" @click="openDialog('offgas_to_gaa_caa', 'Offgas To GAA/CAA')">
              <span v-if="!updating">{{reportData.offgasToGaaCaa}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasToGaaCaa"/>
            </td>
            <td class="no-border" colspan="3"></td>
            <td class="bg-blue-light">To YBS</td>
            <td class="bg-blue-light"></td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('raffinate2p_fr_2ph', 'Raffinate Ⅱ P Fr 2PH')">
              <span v-if="!updating">{{reportData.raffinate2pFr2ph}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.raffinate2pFr2ph"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">Offags</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('offgas_yield_percentage', 'offgas yield%')">
              <span v-if="!updating">{{reportData.offgasYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('offgas_produced', 'Offgas Produced')">
              <span v-if="!updating">{{reportData.offgasProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasProduced"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('offgas_inventory', 'Offgas Inventory')">
              <span v-if="!updating">{{reportData.offgasInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasInventory"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('offgas_change', 'Offgas Change')">
              <span v-if="!updating">{{reportData.offgasChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasChange"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('offgas_import', 'Offgas Import')">
              <span v-if="!updating">{{reportData.offgasImport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasImport"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('offgas_export', 'Offgas Export')">
              <span v-if="!updating">{{reportData.offgasExport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasExport"/>
            </td>
            <td class="bg-blue-light">To Furnace</td>
            <td class="bg-blue-light">To YBS</td>
            <td class="bg-blue-light">To c-ERU</td>
            <td class="bg-blue-light">SuB(inclose U2)</td>
            <td class="bg-blue-light">Flare+SCTU</td>
            <td class="bg-blue-light">To U2(nm3)</td>
            <td class="bg-orange ft-red">Flare loss (T)</td>
            <td class="no-border" colspan="2"></td>
            <td class="no-border solid-line-top solid-line-left" rowspan="7"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_benzene_to_ybs', 'AEU Benzene To YBS')">
              <span v-if="!updating">{{reportData.aeuBenzeneToYbs}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuBenzeneToYbs"/>
            </td>
            <td class="bg-yellow-light"></td>
          </tr>
          <tr>
            <td class="bg-blue-light">C2 fr LDPE</td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('offgas_to_furnance', 'Offgas To Furnace')">
              <span v-if="!updating">{{reportData.offgasToFurnance}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasToFurnance"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('offgas_to_ybs', 'Offgas To YBS')">
              <span v-if="!updating">{{reportData.offgasToYbs}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasToYbs"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('offgas_to_c_eru', 'Offgas To c-ERU')">
              <span v-if="!updating">{{reportData.offgasToCEru}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasToCEru"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('offgas_sub_in_close_u2', 'Offgas SuB(inclose U2)')">
              <span v-if="!updating">{{reportData.offgasSubInCloseU2}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasSubInCloseU2"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('offgas_flare_sctu', 'Offgas Flare+SCTU')">
              <span v-if="!updating">{{reportData.offgasFlareSctu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasFlareSctu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('offgas_to_u2_nm3', 'Offgas To U2(nm3)')">
              <span v-if="!updating">{{reportData.offgasToU2Nm3}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasToU2Nm3"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('offgas_flare_loss_t', 'Offgas Flare loss(T)')">
              <span v-if="!updating">{{reportData.offgasFlareLossT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.offgasFlareLossT"/>
            </td>
            <td class="no-border" colspan="3"></td>
            <td class="bg-blue-light">To RTTF</td>
            <td class="bg-blue-light">To Train</td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('c2_fr_ldpe', 'C2 fr LDPE')">
              <span v-if="!updating">{{reportData.c2FrLdpe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c2FrLdpe"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">RPG</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('rpg_yield_percentage', 'RPG yield%')">
              <span v-if="!updating">{{reportData.rpgYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.rpgYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('rpg_produced', 'RPG Produced')">
              <span v-if="!updating">{{reportData.rpgProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.rpgProduced"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('rpg_inventory', 'RPG Inventory')">
              <span v-if="!updating">{{reportData.rpgInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.rpgInventory"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('rpg_change', 'RPG Change')">
              <span v-if="!updating">{{reportData.rpgChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.rpgChange"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('rpg_import', 'RPG Import')">
              <span v-if="!updating">{{reportData.rpgImport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.rpgImport"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('rpg_export', 'RPG Export')">
              <span v-if="!updating">{{reportData.rpgExport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.rpgExport"/>
            </td>
            <td class="bg-blue-light">To PGU</td>
            <td class="bg-blue-light">Fr YFCC</td>
            <td class="no-border" colspan="8"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_benzene_to_rttf', 'AEU Benzene To Rttf')">
              <span v-if="!updating">{{reportData.aeuBenzeneToRttf}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuBenzeneToRttf"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_benzene_to_train', 'AEU Benzene To Train')">
              <span v-if="!updating">{{reportData.aeuBenzeneToTrain}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuBenzeneToTrain"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-light">C3 fr OXO</td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('rpg_to_pgu', 'RPG To PGU')">
              <span v-if="!updating">{{reportData.rpgToPgu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.rpgToPgu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('rpg_fr_yfcc', 'RPG Fr YFCC')">
              <span v-if="!updating">{{reportData.rpgFrYfcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.rpgFrYfcc"/>
            </td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('c3_fr_oxo', 'C3 Fr OXO')">
              <span v-if="!updating">{{reportData.c3FrOxo}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c3FrOxo"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">Methane</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('methane_yield_percentage', 'Methane yield%')">
              <span v-if="!updating">{{reportData.methaneYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.methaneYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('methane_produced', 'Methane Produced')">
              <span v-if="!updating">{{reportData.methaneProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.methaneProduced"/>
            </td>
            <td class="bg-blue-light">To EO/EG</td>
            <td class="no-border" colspan="8"></td>
            <td class="bg-blue-light">yield %</td>
            <td class="bg-blue-light">Inventory</td>
            <td class="no-border" colspan="3"></td>
            <td class="bg-blue-light">To Ship</td>
            <td class="bg-blue-light">Fr Ship</td>
          </tr>
          <tr>
            <td class="bg-blue-light">MIXED C3/C4 </td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('methane_to_eo_eg', 'Methane To EO/EG')">
              <span v-if="!updating">{{reportData.methaneToEoEg}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.methaneToEoEg"/>
            </td>
            <td class="no-border" colspan="5"></td>
            <td class="bg-green" rowspan="14">AEU</td>
            <td class="no-border" colspan="2"></td>
            <td class="bg-blue-light">Produced</td>
            <td class="bg-blue-light">Change</td>
            <td class="no-border" colspan="3"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_to_ship', 'AEU Toluene To Ship')">
              <span v-if="!updating">{{reportData.aeuTolueneToShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneToShip"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_fr_ship', 'AEU Toluene Fr Ship')">
              <span v-if="!updating">{{reportData.aeuTolueneFrShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneFrShip"/>
            </td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('mixed_c3_c4', 'MIXED C3/C4')">
              <span v-if="!updating">{{reportData.mixedC3C4}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mixedC3C4"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light" rowspan="2">Residue oil</td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('residue_oil_yield_percentage', 'Residue oil yield%')">
              <span v-if="!updating">{{reportData.residueOilYieldPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.residueOilYieldPercentage"/>
            </td>
            <td class="bg-yellow-light" rowspan="2" @click="openDialog('residue_oil_produced', 'Residue oil Produced')">
              <span v-if="!updating">{{reportData.residueOilProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.residueOilProduced"/>
            </td>
            <td class="no-border" colspan="7"></td>
            <td class="no-border solid-line-bottom"></td>
            <td class="bg-blue-light" rowspan="2">Benzene</td>
            <td class="bg-yellow-light" @click="openDialog('aeu_benzene_yeild_percentage', 'AEU Benzene yield%')">
              <span v-if="!updating">{{reportData.aeuBenzeneYeildPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuBenzeneYeildPercentage"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_benzene_inventory', 'AEU Benzene Inventory')">
              <span v-if="!updating">{{reportData.aeuBenzeneInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuBenzeneInventory"/>
            </td>
            <td class="no-border solid-line-bottom" colspan="2"></td>
            <td class="bg-blue-light">To YPC</td>
            <td class="bg-blue-light">Fr YPC</td>
          </tr>
          <tr>
            <td class="bg-blue-light">Hy C9</td>
            <td class="no-border solid-line-top" rowspan="2" colspan="2"></td>
            <td class="no-border" colspan="8"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_benzene_produced}', 'AEU Benzene Produced}')">
              <span v-if="!updating">{{reportData.aeuBenzeneProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuBenzeneProduced"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_benzene_change', 'AEU Benzene Change')">
              <span v-if="!updating">{{reportData.aeuBenzeneChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuBenzeneChange"/>
            </td>
            <td class="no-border solid-line-bottom no-padding" rowspan="2" colspan="3">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_to_ypc', 'AEU Toluene To YPC')">
              <span v-if="!updating">{{reportData.aeuTolueneToYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneToYpc"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_fr_ypc', 'AEU Toluene Fr YPC')">
              <span v-if="!updating">{{reportData.aeuTolueneFrYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneFrYpc"/>
            </td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('hy_c9', 'Hy C9')">
              <span v-if="!updating">{{reportData.hyC9}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hyC9"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="no-border" colspan="10"></td>
            <td class="no-border solid-line-bottom"></td>
            <td class="bg-blue-light" rowspan="2">Toluene</td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_yeild_percentage', 'AEU Toluene yeild%')">
              <span v-if="!updating">{{reportData.aeuTolueneYeildPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneYeildPercentage"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_inventory', 'AEU Toluene Inventory')">
              <span v-if="!updating">{{reportData.aeuTolueneInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneInventory"/>
            </td>
            <td class="bg-blue-light">To RTTF</td>
            <td class="bg-blue-light">Fr YBS</td>
          </tr>
          <tr>
            <td class="bg-blue-light">PGU Offgas</td>
            <td class="no-border" rowspan="9" colspan="2"></td>
            <td class="no-border" colspan="11"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_produced', 'AEU Toluene Produced')">
              <span v-if="!updating">{{reportData.aeuTolueneProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneProduced"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_change', 'AEU Toluene Change')">
              <span v-if="!updating">{{reportData.aeuTolueneChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneChange"/>
            </td>
            <td class="no-border solid-line-bottom" colspan="2" rowspan="2"></td>
            <td class="no-border" rowspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_to_rttf', 'AEU Toluene To RTTF')">
              <span v-if="!updating">{{reportData.aeuTolueneToRttf}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneToRttf"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_fr_ybs', 'AEU Toluene Fr YBS')">
              <span v-if="!updating">{{reportData.aeuTolueneFrYbs}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneFrYbs"/>
            </td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('pgu_offgas', 'PGU Offgas')">
              <span v-if="!updating">{{reportData.pguOffgas}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguOffgas"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="no-border" colspan="7"></td>
            <td class="no-border bg-yellow">t/h</td>
            <td class="no-border bg-yellow" @click="openDialog('pgu_aeu_t_h', 'PGU AEU t/h')">
              <span v-if="!updating">{{reportData.pguAeuTH}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguAeuTH"/>
            </td>
            <td class="no-border solid-line-bottom"></td>
            <td class="bg-blue-light" rowspan="2">Xylene</td>
            <td class="bg-yellow-light" @click="openDialog('aeu_xylene_yeild_percentage', 'AEU Xylene yeild%')">
              <span v-if="!updating">{{reportData.aeuXyleneYeildPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuXyleneYeildPercentage"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_xylene_inventory', 'AEU Xylene Inventory')">
              <span v-if="!updating">{{reportData.aeuXyleneInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuXyleneInventory"/>
            </td>
            <td class="bg-blue-light">To EU</td>
            <td class="bg-blue-light"></td>
          </tr>
          <tr>
            <td class="bg-blue-light">Wash Oil</td>
            <td class="no-border" colspan="2"></td>
            <td class="bg-green" rowspan="14">PGU</td>
            <td class="no-border" colspan="2"></td>
            <td class="bg-blue-light">yield %</td>
            <td class="bg-blue-light">Inventory</td>
            <td class="bg-blue-light">Export</td>
            <td class="no-border" colspan="4"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_xylene_produced', 'AEU Xylene Produced')">
              <span v-if="!updating">{{reportData.aeuXyleneProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuXyleneProduced"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_xylene_change', 'AEU Xylene Change')">
              <span v-if="!updating">{{reportData.aeuXyleneChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuXyleneChange"/>
            </td>
            <td class="no-border"></td>
            <td class="no-border"></td>
            <td class="no-border solid-line-left solid-line-bottom" rowspan="7"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_toluene_to_eu', 'AEU Toluene To EU')">
              <span v-if="!updating">{{reportData.aeuTolueneToEu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTolueneToEu"/>
            </td>
            <td class="bg-yellow-light"></td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('wash_oil', 'Wash Oil')">
              <span v-if="!updating">{{reportData.washOil}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.washOil"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="no-border" colspan="5"></td>
            <td class="bg-blue-light">Produced</td>
            <td class="bg-blue-light">Change</td>
            <td class="bg-blue-light">To AEU</td>
            <td class="no-border bg-yellow-light solid-line-bottom" @click="openDialog('pgu_to_aeu', 'PGU To AEU')">
              <span v-if="!updating">{{reportData.pguToAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguToAeu"/>
            </td>
            <td class="no-border solid-line-bottom"></td>
            <td class="bg-blue-light" rowspan="2">C6-C8 NA</td>
            <td class="bg-yellow-light" @click="openDialog('aeu_c6_c8_na_yeild_percentage', 'AEU C6-C8 NA yield%')">
              <span v-if="!updating">{{reportData.aeuC6C8NaYeildPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuC6C8NaYeildPercentage"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_c6_c8_na_inventory', 'AEU C6-C8 NA Inventory')">
              <span v-if="!updating">{{reportData.aeuC6C8NaInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuC6C8NaInventory"/>
            </td>
            <td class="no-border"></td>
            <td class="no-border"></td>
          </tr>
          <tr>
            <td class="bg-blue-light">Toluene</td>
            <td class="no-border bg-yellow">t/h</td>
            <td class="bg-yellow no-border" @click="openDialog('pgu_rpg_t_h', 'PGU RPG t/h')">
              <span v-if="!updating">{{reportData.pguRpgTH}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguRpgTH"/>
            </td>
            <td class="no-border solid-line-bottom"></td>
            <td class="bg-blue-light">BTX</td>
            <td class="bg-yellow-light" @click="openDialog('pgu_btx_yeild_percentage', 'PGU BTX yield%')">
              <span v-if="!updating">{{reportData.pguBtxYeildPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguBtxYeildPercentage"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_btx_inventory', 'PGU BTX Inventory')">
              <span v-if="!updating">{{reportData.pguBtxInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguBtxInventory"/>
            </td>
            <td @click="openDialog('pgu_btx_export', 'PGU BTX Export')">
              <span v-if="!updating">{{reportData.pguBtxExport}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguBtxExport"/>
            </td>
            <td class="no-border" colspan="4"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_c6_c8_na_produced', 'AEU C6-C8 NA Produced')">
              <span v-if="!updating">{{reportData.aeuC6C8NaProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuC6C8NaProduced"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_c6_c8_na_change', 'AEU C6-C8 NA Change')">
              <span v-if="!updating">{{reportData.aeuC6C8NaChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuC6C8NaChange"/>
            </td>
            <td class="no-border solid-line-top solid-line-right" rowspan="8"></td>
            <td class="no-border"></td>
            <td class="bg-blue-light">To ship</td>
            <td class="bg-blue-light">Fr ship</td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('toluene', 'Toluene')">
              <span v-if="!updating">{{reportData.toluene}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.toluene"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-blue-light">RPG</td>
            <td class="no-border solid-line-bottom" @click="openDialog('rpg_to_pgu2', 'RPG To PGU')">
              <span v-if="!updating">{{reportData.rpgToPgu2}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.rpgToPgu2"/>
            </td>
            <td class="no-border"></td>
            <td class="bg-blue-light">Product</td>
            <td class="bg-yellow-light" @click="openDialog('pgu_btx_produced', 'PGU BTX Produced')">
              <span v-if="!updating">{{reportData.pguBtxProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguBtxProduced"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_btx_change', 'PGU BTX Change')">
              <span v-if="!updating">{{reportData.pguBtxChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguBtxChange"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_btx_to_aeu', 'PGU BTX To AEU')">
              <span v-if="!updating">{{reportData.pguBtxToAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguBtxToAeu"/>
            </td>
            <td class="no-border bg-yellow-light solid-line-top" @click="openDialog('aeu_to_pgu', 'AEU To PGU')">
              <span v-if="!updating">{{reportData.aeuToPgu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuToPgu"/>
            </td>
            <td class="no-border" colspan="4"></td>
            <td class="no-border"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_xylene_to_ship', 'AEU Xylene To Ship')">
              <span v-if="!updating">{{reportData.aeuXyleneToShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuXyleneToShip"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_xylene_fr_ship', 'AEU Xylene Fr Ship')">
              <span v-if="!updating">{{reportData.aeuXyleneFrShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuXyleneFrShip"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-light">Hy C4 fr R800</td>
            <td @click="openDialog('pgu_rpg1', 'PGU RPG 1')">
              <span v-if="!updating">{{reportData.pguRpg1}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguRpg1"/>
            </td>
            <td class="no-border" colspan="11"></td>
            <td class="no-border">AEU</td>
            <td class="no-border">PGU&AEU</td>
            <td class="no-border"></td>
            <td class="bg-blue-light">To YPC</td>
            <td class="bg-blue-light">Fr YPC</td>
          </tr>
          <tr>
            <td class="bg-yellow-light" @click="openDialog('hy_c4_fr_r800', 'Hy C4 fr R800')">
              <span v-if="!updating">{{reportData.hyC4FrR800}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hyC4FrR800"/>
            </td>
            <td class="no-border solid-line-top no-padding" rowspan="2">
              <!--<div class="triangle-right"></div>-->
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_rpg2', 'PGU RPG 2')">
              <span v-if="!updating">{{reportData.pguRpg2}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguRpg2"/>
            </td>
            <td class="bg-yellow-light no-border solid-line-top" @click="openDialog('pgu_to_rpg', 'PGU Tp RPG')">
              <span v-if="!updating">{{reportData.pguToRpg}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguToRpg"/>
            </td>
            <td class="no-border" colspan="8"></td>
            <td class="no-border bg-blue-light">total Feed</td>
            <td class="no-border bg-yellow-light" @click="openDialog('aeu_total_feed', 'AEU total Feed')">
              <span v-if="!updating">{{reportData.aeuTotalFeed}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTotalFeed"/>
            </td>
            <td class="no-border bg-yellow-light" @click="openDialog('pgu_aeu_total_feed', 'PGU&AEU total Feed')">
              <span v-if="!updating">{{reportData.pguAeuTotalFeed}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguAeuTotalFeed"/>
            </td>
            <td class="no-border"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_xylene_to_ypc', 'AEU Xylene To YPC')">
              <span v-if="!updating">{{reportData.aeuXyleneToYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuXyleneToYpc"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_xylene_fr_ypc', 'AEU Xylene Fr YPC')">
              <span v-if="!updating">{{reportData.aeuXyleneFrYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuXyleneFrYpc"/>
            </td>
          </tr>
          <tr>
            <td class="no-border" colspan="8"></td>
            <td class="no-border  solid-line-bottom"></td>
            <td class="bg-blue-light" rowspan="2">Washoil</td>
            <td class="bg-yellow-light" @click="openDialog('pgu_washoil_yeild_percentage', 'PGU Washoil yeild%')">
              <span v-if="!updating">{{reportData.pguWashoilYeildPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguWashoilYeildPercentage"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_washoil_inventory', 'PGU Washoil Inventory')">
              <span v-if="!updating">{{reportData.pguWashoilInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguWashoilInventory"/>
            </td>
            <td class="bg-blue-light">To EU</td>
            <td class="no-border" colspan="3"></td>
            <td class="no-border bg-blue-light">output</td>
            <td class="no-border bg-yellow-light" @click="openDialog('aeu_output', 'AEU Output')">
              <span v-if="!updating">{{reportData.aeuOutput}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuOutput"/>
            </td>
            <td class="no-border bg-yellow-light" @click="openDialog('pgu_aeu_output', 'PGU&AEU Output')">
              <span v-if="!updating">{{reportData.pguAeuOutput}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguAeuOutput"/>
            </td>
            <td class="no-border"></td>
            <td class="bg-blue-light">To rttf</td>
            <td class="bg-blue-light"></td>
          </tr>
          <tr>
            <td class="bg-blue-light" colspan="2">Total input</td>
            <td class="bg-yellow-light" @click="openDialog('total_input', 'Total input')">
              <span v-if="!updating">{{reportData.totalInput}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalInput"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="bg-blue-light">H2</td>
            <td class="no-border" colspan="4"></td>
            <td class="bg-yellow-light" @click="openDialog('pgu_washoil_produced', 'PGU Washoil Produced')">
              <span v-if="!updating">{{reportData.pguWashoilProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguWashoilProduced"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_washoil_change', 'PGU Washoil Change')">
              <span v-if="!updating">{{reportData.pguWashoilChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguWashoilChange"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_washoil_to_eu', 'PGU Washoil To EU')">
              <span v-if="!updating">{{reportData.pguWashoilToEu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguWashoilToEu"/>
            </td>
            <td class="no-border" colspan="3"></td>
            <td class="no-border bg-blue-light">Total loss</td>
            <td class="no-border bg-yellow-light" @click="openDialog('aeu_total_loss', 'AEU Total loss')">
              <span v-if="!updating">{{reportData.aeuTotalLoss}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuTotalLoss"/>
            </td>
            <td class="no-border bg-yellow-light" @click="openDialog('pgu_aeu_total_loss', 'PGU&AEU Total loss')">
              <span v-if="!updating">{{reportData.pguAeuTotalLoss}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguAeuTotalLoss"/>
            </td>
            <td class="no-border"></td>
            <td class="no-border"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_xylene_to_rttf', 'AEU Xylene To rttf')">
              <span v-if="!updating">{{reportData.aeuXyleneToRttf}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuXyleneToRttf"/>
            </td>
            <td class="bg-yellow-light"></td>
          </tr>
          <tr>
            <td class="bg-blue-light" colspan="2">Total output</td>
            <td class="bg-yellow-light" @click="openDialog('total_output', 'Total output')">
              <span v-if="!updating">{{reportData.totalOutput}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalOutput"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="bg-yellow-light" @click="openDialog('pgu_h2', 'PGU H2')">
              <span v-if="!updating">{{reportData.pguH2}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguH2"/>
            </td>
            <td class="no-border solid-line-top"></td>
            <td class="no-border solid-line-bottom"></td>
            <td class="bg-blue-light" rowspan="2">offags</td>
            <td class="bg-yellow-light" @click="openDialog('pgu_offgas_yeild_percentage', 'PGU Offgas yield%')">
              <span v-if="!updating">{{reportData.pguOffgasYeildPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguOffgasYeildPercentage"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_offgas_inventory', 'PGU Offgas Inventory')">
              <span v-if="!updating">{{reportData.pguOffgasInventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguOffgasInventory"/>
            </td>
            <td class="bg-blue-light">To EU</td>
            <td class="no-border" colspan="3"></td>
            <td class="no-border bg-blue-light">loss%</td>
            <td class="no-border bg-yellow-light" @click="openDialog('aeu_loss_percentage', 'AEU loss%')">
              <span v-if="!updating">{{reportData.aeuLossPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuLossPercentage"/>
            </td>
            <td class="no-border bg-yellow-light" @click="openDialog('pgu_aeu_loss_percentage', 'AEU&PGU loss%')">
              <span v-if="!updating">{{reportData.pguAeuLossPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguAeuLossPercentage"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-light" colspan="2">Total loss</td>
            <td class="bg-yellow-light" @click="openDialog('total_loss', 'Total loss')">
              <span v-if="!updating">{{reportData.totalLoss}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalLoss"/>
            </td>
            <td class="no-border" colspan="6"></td>
            <td class="bg-yellow-light" @click="openDialog('pgu_offgas_produced', 'PGU offgas Produced')">
              <span v-if="!updating">{{reportData.pguOffgasProduced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguOffgasProduced"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_offgas_change', 'PGU offgas Change')">
              <span v-if="!updating">{{reportData.pguOffgasChange}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguOffgasChange"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_offgas_to_eu', 'PGU offgas To EU')">
              <span v-if="!updating">{{reportData.pguOffgasToEu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguOffgasToEu"/>
            </td>
            <td class="no-border" colspan="3"></td>
            <td class="no-border bg-blue">Load%</td>
            <td class="no-border bg-blue" @click="openDialog('aeu_feed_load_percentage', 'AEU Load%')">
              <span v-if="!updating">{{reportData.aeuFeedLoadPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuFeedLoadPercentage"/>
            </td>
            <td class="no-border bg-blue" @click="openDialog('pgu_aeu_feed_load_percentage', 'PGU&AEU Load%')">
              <span v-if="!updating">{{reportData.pguAeuFeedLoadPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguAeuFeedLoadPercentage"/>
            </td>
            <td class="no-border solid-line-bottom" colspan="2"></td>
            <td class="bg-blue-light">To EU</td>
            <td class="bg-blue-light">To YPC</td>
          </tr>
          <tr>
            <td class="bg-blue-light" colspan="2">loss%</td>
            <td class="bg-yellow-light" @click="openDialog('loss_percentage', 'loss%')">
              <span v-if="!updating">{{reportData.lossPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lossPercentage"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="no-border bg-blue-light">total Feed</td>
            <td class="no-border bg-yellow-light" @click="openDialog('pgu_total_feed', 'PGU total Feed')">
              <span v-if="!updating">{{reportData.pguTotalFeed}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguTotalFeed"/>
            </td>
            <td class="no-border solid-line-bottom"></td>
            <td class="bg-blue-light" rowspan="2">C5</td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c5_yeild_percentage', 'PGU C5 yield%')">
              <span v-if="!updating">{{reportData.pguC5YeildPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC5YeildPercentage"/>
            </td>
            <td class="bg-yellow-light">C5 raff input</td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c5_export', 'PGU C5 Export')">
              <span v-if="!updating">{{reportData.pguC5Export}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC5Export"/>
            </td>
            <td class="bg-blue-light">To EU</td>
            <td class="bg-blue-light">To Yuanguan</td>
            <td class="no-border" colspan="7"></td>
            <td class="bg-yellow-light" @click="openDialog('aeu_c6_c8_na_to_eu', 'AEU C6-C8 NA To EU')">
              <span v-if="!updating">{{reportData.aeuC6C8NaToEu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuC6C8NaToEu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('aeu_c6_c8_na_to_ypc', 'AEU C6-C8 NA To YPC')">
              <span v-if="!updating">{{reportData.aeuC6C8NaToYpc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.aeuC6C8NaToYpc"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-light" colspan="2">Total Furnace Feed</td>
            <td class="bg-yellow-light" @click="openDialog('total_furnance_feed', 'Total Furnace Feed')">
              <span v-if="!updating">{{reportData.totalFurnanceFeed}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalFurnanceFeed"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="no-border bg-blue-light">output</td>
            <td class="no-border bg-yellow-light" @click="openDialog('pgu_output', 'PGU output')">
              <span v-if="!updating">{{reportData.pguOutput}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguOutput"/>
            </td>
            <td class="no-border"></td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c5_produced', 'PGU C5 Produced')">
              <span v-if="!updating">{{reportData.pguC5Produced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC5Produced"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c5_raff_input', 'PGU C5 C5 raff input')">
              <span v-if="!updating">{{reportData.pguC5RaffInput}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC5RaffInput"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c5_to_aeu', 'PGU C5 To AEU')">
              <span v-if="!updating">{{reportData.pguC5ToAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC5ToAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c5_to_eu', 'PGU C5 To EU')">
              <span v-if="!updating">{{reportData.pguC5ToEu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC5ToEu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c5_to_yuanguan', 'PGU C5 To Yuanguan')">
              <span v-if="!updating">{{reportData.pguC5ToYuanguan}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC5ToYuanguan"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-light" colspan="2">NAP fr CLTF</td>
            <td class="bg-blue" @click="openDialog('nap_fr_cltf', 'NAP Fr Cltf')">
              <span v-if="!updating">{{reportData.napFrCltf}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.napFrCltf"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="no-border bg-blue-light">Total loss</td>
            <td class="no-border bg-yellow-light" @click="openDialog('pgu_total_loss', 'PGU Total loss')">
              <span v-if="!updating">{{reportData.pguTotalLoss}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguTotalLoss"/>
            </td>
            <td class="no-border solid-line-bottom"></td>
            <td class="bg-blue-light" rowspan="2">C9</td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c9_yeild_percentage', 'PGU C9 yield%')">
              <span v-if="!updating">{{reportData.pguC9YeildPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC9YeildPercentage"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c9_inventory', 'PGU C9 Inventory')">
              <span v-if="!updating">{{reportData.pguC9Inventory}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC9Inventory"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c9_export', 'PGU C9 Export')">
              <span v-if="!updating">{{reportData.pguC9Export}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC9Export"/>
            </td>
            <td class="bg-blue-light">To RTTF</td>
            <td class="bg-blue-light">To ship</td>
            <td class="bg-blue-light">To YFCC</td>
          </tr>
          <tr>
            <td class="bg-blue-light" colspan="2">Total P/E</td>
            <td class="bg-yellow-light" @click="openDialog('total_p_e', 'Total P/E')">
              <span v-if="!updating">{{reportData.totalPE}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalPE"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="no-border bg-blue-light">loss%</td>
            <td class="no-border bg-yellow-light" @click="openDialog('pgu_loss_percentage', 'PGU loss%')">
              <span v-if="!updating">{{reportData.pguLossPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguLossPercentage"/>
            </td>
            <td class="no-border"></td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c9_produced', 'PGU C9 Produced')">
              <span v-if="!updating">{{reportData.pguC9Produced}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC9Produced"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c9_change', 'PGU C9 Change')">
              <span v-if="!updating">{{reportData.pguC9Change}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC9Change"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c9_to_aeu', 'PGU C9 To AEU')">
              <span v-if="!updating">{{reportData.pguC9ToAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC9ToAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c9_to_rttf', 'PGU C9 To RTTF')">
              <span v-if="!updating">{{reportData.pguC9ToRttf}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC9ToRttf"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c9_to_ship', 'PGU C9 To Ship')">
              <span v-if="!updating">{{reportData.pguC9ToShip}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC9ToShip"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pgu_c9_to_yfcc', 'PGU C9 To YFCC')">
              <span v-if="!updating">{{reportData.pguC9ToYfcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguC9ToYfcc"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-light" colspan="2">Plant mode is</td>
            <td class="bg-yellow-light">
              <span v-if="!updating">{{reportData.plantModeIs}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.plantModeIs"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="no-border bg-blue">Feed Load%</td>
            <td class="no-border bg-blue" @click="openDialog('pgu_feed_load_percentage', 'PGU Feed Load%')">
              <span v-if="!updating">{{reportData.pguFeedLoadPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.pguFeedLoadPercentage"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue" colspan="2">plant load (3495t/d)</td>
            <td class="bg-blue" @click="openDialog('plant_load_3495t_d', 'plant load (3495t/d)')">
              <span v-if="!updating">{{reportData.plantLoad3495tD}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.plantLoad3495tD"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue" colspan="2">Avg. Furnace feed(t/h)</td>
            <td class="bg-blue" @click="openDialog('avg_furnance_feed_t_h', 'Avg. Furnace feed(t/h)')">
              <span v-if="!updating">{{reportData.avgFurnanceFeedTH}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.avgFurnanceFeedTH"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue" colspan="2">Feeding ratio %</td>
            <td class="bg-blue" @click="openDialog('feeding_ratio_percentage', 'Feeding ratio %')">
              <span v-if="!updating">{{reportData.feedingRatioPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.feedingRatioPercentage"/>
            </td>
            <td class="bg-yellow-light" colspan="12">Specific Energy Consumption</td>
            <td class="no-border"></td>
            <td class="bg-yellow" colspan="6">SCTF STORAGE 当前罐容</td>
          </tr>
          <tr>
            <td class="bg-blue-dark" rowspan="3">Items</td>
            <td class="bg-blue-dark" rowspan="3">unit</td>
            <td class="bg-blue-dark" colspan="3" rowspan="2">Conversion</td>
            <td class="bg-blue-dark" colspan="4">Cracker</td>
            <td class="bg-blue-dark" colspan="4">PGU+AEU</td>
            <td class="bg-blue-dark">SCTU+Flare</td>
            <td class="bg-blue-dark">SUB</td>
            <td class="bg-blue-dark">BCC</td>
            <td class="bg-green-blue-neon">Total C2</td>
            <td class="bg-blue-light">TK1061</td>
            <td class="bg-blue-light">TK1062</td>
            <td class="bg-blue-light">TK1063</td>
            <td class="bg-blue-light">TK1064</td>
            <td class="bg-blue-light">TK1065 (Off)</td>
          </tr>
          <tr>
            <td class="bg-blue-dark" rowspan="2">Consumption</td>
            <td class="bg-blue-dark" rowspan="2">t/t</td>
            <td class="bg-blue-dark" colspan="2">Energy</td>
            <td class="bg-blue-dark" rowspan="2">Consumption</td>
            <td class="bg-blue-dark" rowspan="2">t/t</td>
            <td class="bg-blue-dark" colspan="2">Energy</td>
            <td class="bg-blue-dark">Consumption</td>
            <td class="bg-blue-dark">Consumption</td>
            <td class="bg-blue-dark">Consumption</td>
            <td class="bg-green-blue-neon" @click="openDialog('sctf_storage_total_c2', 'SCTF STORAGE Total C2')">
              <span v-if="!updating">{{reportData.sctfStorageTotalC2}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTotalC2"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('sctf_storage_tk1061', 'SCTF STORAGE TK1061')">
              <span v-if="!updating">{{reportData.sctfStorageTk1061}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1061"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('sctf_storage_tk1062', 'SCTF STORAGE TK1062')">
              <span v-if="!updating">{{reportData.sctfStorageTk1062}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1062"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('sctf_storage_tk1063', 'SCTF STORAGE TK1063')">
              <span v-if="!updating">{{reportData.sctfStorageTk1063}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1063"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('sctf_storage_tk1064', 'SCTF STORAGE TK1064')">
              <span v-if="!updating">{{reportData.sctfStorageTk1064}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1064"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('sctf_storage_tk1065_off', 'TK1065 (Off)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1065Off}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1065Off"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-dark">TOE/unit</td>
            <td class="bg-blue-dark">TCE/unit</td>
            <td class="bg-blue-dark">Pre-standard</td>
            <td class="bg-blue-dark">kgOE/t C2=</td>
            <td class="bg-blue-dark">kgCE/t C2=</td>
            <td class="bg-blue-dark">kgOE/t BTX</td>
            <td class="bg-blue-dark">kgCE/t BTX</td>
            <td class="bg-blue-dark">unit</td>
            <td class="bg-blue-dark">unit</td>
            <td class="bg-blue-dark">unit</td>
            <td class="bg-green-blue-neon">Total C3</td>
            <td class="bg-blue-light">TK1011</td>
            <td class="bg-blue-light">TK1012</td>
            <td class="bg-blue-light">TK1013</td>
            <td class="bg-blue-light">TK1014</td>
            <td class="bg-blue-light">TK1040 (Off)</td>
          </tr>
          <tr>
            <td class="bg-blue-dark">HHP</td>
            <td class="bg-blue-dark">t</td>
            <td class="bg-purple-light" @click="openDialog('hhp_toe', 'HHP TOE/unit')">
              <span v-if="!updating">{{reportData.hhpToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('hhp_tce', 'HHP TCE/unit')">
              <span v-if="!updating">{{reportData.hhpTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('hhp_pre', 'HHP Pre-standard')">
              <span v-if="!updating">{{reportData.hhpPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_cracker', 'HHP Cracker Consumption')">
              <span v-if="!updating">{{reportData.hhpCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_cracker_t_t', 'HHP Cracker t/t')">
              <span v-if="!updating">{{reportData.hhpCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_cracker_kgoe', 'HHP Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.hhpCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_cracker_kgce', 'HHP Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.hhpCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_pgu_aeu', 'HHP PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.hhpPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_pgu_aeu_t_t', 'HHP PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.hhpPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_pgu_aeu_kgoe', 'HHP PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.hhpPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_pgu_aeu_kgce', 'HHP PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.hhpPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_sctu_flare', 'HHP SCTU+Flare')">
              <span v-if="!updating">{{reportData.hhpSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_sub', 'HHP SUB')">
              <span v-if="!updating">{{reportData.hhpSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hhp_bcc', 'HHP BCC')">
              <span v-if="!updating">{{reportData.hhpBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hhpBcc"/>
            </td>
            <td class="bg-green-blue-neon" @click="openDialog('sctf_storage_total_c3', 'SCTF STORAGE Total C3')">
              <span v-if="!updating">{{reportData.sctfStorageTotalC3}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTotalC3"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1011', 'SCTF STORAGE TK1011')">
              <span v-if="!updating">{{reportData.sctfStorageTk1011}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1011"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1012', 'SCTF STORAGE TK1012')">
              <span v-if="!updating">{{reportData.sctfStorageTk1012}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1012"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1013', 'SCTF STORAGE TK1013')">
              <span v-if="!updating">{{reportData.sctfStorageTk1013}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1013"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1014', 'SCTF STORAGE TK1014')">
              <span v-if="!updating">{{reportData.sctfStorageTk1014}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1014"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1040_off', 'SCTF STORAGE TK1040 (Off)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1040Off}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1040Off"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-dark">NG</td>
            <td class="bg-blue-dark">Km3</td>
            <td class="bg-purple-light" @click="openDialog('ng_toe', 'NG TOE/unit')">
              <span v-if="!updating">{{reportData.ngToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('ng_tce', 'NG TCE/unit')">
              <span v-if="!updating">{{reportData.ngTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('ng_pre', 'NG Pre-standard')">
              <span v-if="!updating">{{reportData.ngPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_cracker', 'NG Cracker Consumption')">
              <span v-if="!updating">{{reportData.ngCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_cracker_t_t', 'NG Cracker t/t')">
              <span v-if="!updating">{{reportData.ngCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_cracker_kgoe', 'NG Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.ngCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_cracker_kgce', 'NG Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.ngCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_pgu_aeu', 'NG PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.ngPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_pgu_aeu_t_t', 'NG PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.ngPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_pgu_aeu_kgoe', 'NG PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.ngPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_pgu_aeu_kgce', 'NG PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.ngPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_sctu_flare', 'NG SCTU+Flare')">
              <span v-if="!updating">{{reportData.ngSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_sub', 'NG SUB')">
              <span v-if="!updating">{{reportData.ngSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('ng_bcc', 'NG BCC')">
              <span v-if="!updating">{{reportData.ngBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.ngBcc"/>
            </td>
            <td class="bg-blue-light">TK1120(LPG)</td>
            <td class="bg-blue-light">TK1111(C4's)</td>
            <td class="bg-blue-light">TK1520(RPG)</td>
            <td class="bg-blue-light">TK1350(PO)</td>
            <td class="bg-green">TK1310(BTX)</td>
            <td class="bg-blue-light">TK1330(EBO)</td>
          </tr>
          <tr>
            <td class="bg-blue-dark">Fuel Gas(offags)</td>
            <td class="bg-blue-dark">t</td>
            <td class="bg-purple-light" @click="openDialog('fuel_gas_offgas_toe', 'Fuel Gas(offags) TOE/unit')">
              <span v-if="!updating">{{reportData.fuelGasOffgasToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('fuel_gas_offgas_tce', 'Fuel Gas(offags) TCE/unit')">
              <span v-if="!updating">{{reportData.fuelGasOffgasTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('fuel_gas_offgas_pre', 'Fuel Gas(offags) Pre-standard')">
              <span v-if="!updating">{{reportData.fuelGasOffgasPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_cracker', 'Fuel Gas(offags) Cracker Consumption')">
              <span v-if="!updating">{{reportData.fuelGasOffgasCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_cracker_t_t', 'Fuel Gas(offags) Cracker t/t')">
              <span v-if="!updating">{{reportData.fuelGasOffgasCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_cracker_kgoe', 'Fuel Gas(offags) Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.fuelGasOffgasCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_cracker_kgce', 'Fuel Gas(offags) Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.fuelGasOffgasCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_pgu_aeu', 'Fuel Gas(offags) PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.fuelGasOffgasPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_pgu_aeu_t_t', 'Fuel Gas(offags) PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.fuelGasOffgasPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_pgu_aeu_kgoe', 'Fuel Gas(offags) PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.fuelGasOffgasPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_pgu_aeu_kgce', 'Fuel Gas(offags) PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.fuelGasOffgasPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_sctu_flare', 'Fuel Gas(offags) SCTU+Flare')">
              <span v-if="!updating">{{reportData.fuelGasOffgasSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_sub', 'Fuel Gas(offags) SUB')">
              <span v-if="!updating">{{reportData.fuelGasOffgasSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('fuel_gas_offgas_bcc', 'Fuel Gas(offags) BCC')">
              <span v-if="!updating">{{reportData.fuelGasOffgasBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.fuelGasOffgasBcc"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1020_lpg', 'SCTF STORAGE TK1120(LPG)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1020Lpg}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1020Lpg"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1111_c4s', 'SCTF STORAGE TK1111(C4\'s)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1111C4s}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1111C4s"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1520_rpg', 'SCTF STORAGE TK1520(RPG)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1520Rpg}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1520Rpg"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1350_po', 'SCTF STORAGE TK1350(PO)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1350Po}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1350Po"/>
            </td>
            <td class="bg-green" @click="openDialog('sctf_storage_tk1310_btx', 'SCTF STORAGE TK1310(BTX)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1310Btx}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1310Btx"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1330_ebo', 'SCTF STORAGE TK1330(EBO)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1330Ebo}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1330Ebo"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-dark">SHP</td>
            <td class="bg-blue-dark">t</td>
            <td class="bg-yellow" @click="openDialog('shp_toe', 'SHP TOE/unit')">
              <span v-if="!updating">{{reportData.shpToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('shp_tce', 'SHP TCE/unit')">
              <span v-if="!updating">{{reportData.shpTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('shp_pre', 'SHP Pre-standard')">
              <span v-if="!updating">{{reportData.shpPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_cracker', 'SHP Cracker Consumption')">
              <span v-if="!updating">{{reportData.shpCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_cracker_t_t', 'SHP Cracker t/t')">
              <span v-if="!updating">{{reportData.shpCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_cracker_kgoe', 'SHP Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.shpCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_cracker_kgce', 'SHP Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.shpCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_pgu_aeu', 'SHP PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.shpPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_pgu_aeu_t_t', 'SHP PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.shpPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_pgu_aeu_kgoe', 'SHP PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.shpPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_pgu_aeu_kgce', 'SHP PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.shpPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_sctu_flare', 'SHP SCTU+Flare')">
              <span v-if="!updating">{{reportData.shpSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_sub', 'SHP SUB')">
              <span v-if="!updating">{{reportData.shpSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('shp_bcc', 'SHP BCC')">
              <span v-if="!updating">{{reportData.shpBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.shpBcc"/>
            </td>
            <td class="bg-blue-light">TK1430(LFO)</td>
            <td class="bg-green">TK1320(off-btx)</td>
            <td class="bg-green">T201(BTX)</td>
            <td class="bg-green">TK1340(C9)</td>
            <td class="bg-green">CLT1350(C9)</td>
            <td class="bg-green">TK1160(NH3)</td>
          </tr>
          <tr>
            <td class="bg-blue-dark">HP</td>
            <td class="bg-blue-dark">t</td>
            <td class="bg-yellow" @click="openDialog('hp_toe', 'HP TOE/unit')">
              <span v-if="!updating">{{reportData.hpToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('hp_tce', 'HP TCE/unit')">
              <span v-if="!updating">{{reportData.hpTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('hp_pre', 'HP Pre-standard')">
              <span v-if="!updating">{{reportData.hpPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_cracker', 'HP Cracker Consumption')">
              <span v-if="!updating">{{reportData.hpCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_cracker_t_t', 'HP Cracker t/t')">
              <span v-if="!updating">{{reportData.hpCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_cracker_kgoe', 'HP Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.hpCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_cracker_kgce', 'HP Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.hpCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_pgu_aeu', 'HP PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.hpPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_pgu_aeu_t_t', 'HP PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.hpPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_pgu_aeu_kgoe', 'HP PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.hpPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_pgu_aeu_kgce', 'HP PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.hpPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_sctu_flare', 'HP SCTU+Flare')">
              <span v-if="!updating">{{reportData.hpSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_sub', 'HP SUB')">
              <span v-if="!updating">{{reportData.hpSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bcc', 'HP BCC')">
              <span v-if="!updating">{{reportData.hpBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBcc"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1430_lfo', 'SCTF STORAGE TK1430(LFO)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1430Lfo}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1430Lfo"/>
            </td>
            <td class="bg-green" @click="openDialog('sctf_storage_tk1320_off_btx', 'SCTF STORAGE TK1320(off-btx)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1320OffBtx}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1320OffBtx"/>
            </td>
            <td class="bg-green" @click="openDialog('sctf_storage_t201_btx', 'SCTF STORAGE T201(BTX)')">
              <span v-if="!updating">{{reportData.sctfStorageT201Btx}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageT201Btx"/>
            </td>
            <td class="bg-green" @click="openDialog('sctf_storage_tk1340_c9', 'SCTF STORAGE TK1340(C9)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1340C9}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1340C9"/>
            </td>
            <td class="bg-green" @click="openDialog('sctf_storage_tk1350_po', 'SCTF STORAGE CLT1350(PO)')">
              <span v-if="!updating">{{reportData.sctfStorageClt1350C9}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageClt1350C9"/>
            </td>
            <td class="bg-green" @click="openDialog('sctf_storage_tk1160_nh3', 'SCTF STORAGE TK1160(NH3)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1160Nh3}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1160Nh3"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-dark">MP</td>
            <td class="bg-blue-dark">t</td>
            <td class="bg-yellow" @click="openDialog('mp_toe', 'MP TOE/unit')">
              <span v-if="!updating">{{reportData.mpToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('mp_tce', 'MP TCE/unit')">
              <span v-if="!updating">{{reportData.mpTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('mp_pre', 'MP Pre-standard')">
              <span v-if="!updating">{{reportData.mpPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_cracker', 'MP Cracker Consumption')">
              <span v-if="!updating">{{reportData.mpCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_cracker_t_t', 'MP Cracker t/t')">
              <span v-if="!updating">{{reportData.mpCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_cracker_kgoe', 'MP Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.mpCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_cracker_kgce', 'MP Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.mpCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_pgu_aeu', 'MP PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.mpPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_pgu_aeu_t_t', 'MP PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.mpPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_pgu_aeu_kgoe', 'MP PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.mpPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_pgu_aeu_kgce', 'MP PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.mpPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_sctu_flare', 'MP SCTU+Flare')">
              <span v-if="!updating">{{reportData.mpSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_sub', 'MP SUB')">
              <span v-if="!updating">{{reportData.mpSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('mp_bcc', 'MP BCC')">
              <span v-if="!updating">{{reportData.mpBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.mpBcc"/>
            </td>
            <td class="no-border"></td>
            <td class="bg-green">TK1510(B)</td>
            <td class="bg-green">CLT1370(B)</td>
            <td class="bg-green">TK1360(T)</td>
            <td class="bg-green">TK1410(X)</td>
            <td class="bg-green">CLT1380(X)</td>
          </tr>
          <tr>
            <td class="bg-blue-dark">LP</td>
            <td class="bg-blue-dark">t</td>
            <td class="bg-yellow" @click="openDialog('lp_toe', 'LP TOE/unit')">
              <span v-if="!updating">{{reportData.lpToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('lp_tce', 'LP TCE/unit')">
              <span v-if="!updating">{{reportData.lpTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('lp_pre', 'LP Pre-standard')">
              <span v-if="!updating">{{reportData.lpPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_cracker', 'LP Cracker Consumption')">
              <span v-if="!updating">{{reportData.lpCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_cracker_t_t', 'LP Cracker t/t')">
              <span v-if="!updating">{{reportData.lpCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_cracker_kgoe', 'LP Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.lpCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_cracker_kgce', 'LP Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.lpCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_pgu_aeu', 'LP PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.lpPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_pgu_aeu_t_t', 'LP PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.lpPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_pgu_aeu_kgoe', 'LP PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.lpPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_pgu_aeu_kgce', 'LP PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.lpPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_sctu_flare', 'LP SCTU+Flare')">
              <span v-if="!updating">{{reportData.lpSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_sub', 'LP SUB')">
              <span v-if="!updating">{{reportData.lpSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('lp_bcc', 'LP BCC')">
              <span v-if="!updating">{{reportData.lpBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.lpBcc"/>
            </td>
            <td class="no-border"></td>
            <td class="bg-green" @click="openDialog('sctf_storage_tk1510_b', 'SCTF STORAGE TK1510(B)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1510B}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1510B"/>
            </td>
            <td class="bg-green" @click="openDialog('sctf_storage_clt1370_b', 'SCTF STORAGE CLT1370(B)')">
              <span v-if="!updating">{{reportData.sctfStorageClt1370B}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageClt1370B"/>
            </td>
            <td class="bg-green" @click="openDialog('sctf_storage_tk1360_t', 'SCTF STORAGE TK1360(T)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1360T}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1360T"/>
            </td>
            <td class="bg-green" @click="openDialog('sctf_storage_tk1410_x', 'SCTF STORAGE TK1410(X)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1410X}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1410X"/>
            </td>
            <td class="bg-green" @click="openDialog('sctf_storage_clt1380_x', 'SCTF STORAGE CLT1380(X)')">
              <span v-if="!updating">{{reportData.sctfStorageClt1380X}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageClt1380X"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-dark">Electricity</td>
            <td class="bg-blue-dark">MWh</td>
            <td class="bg-yellow" @click="openDialog('electricity_toe', 'Electricity TOE/unit')">
              <span v-if="!updating">{{reportData.electricityToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('electricity_tce', 'Electricity TCE/unit')">
              <span v-if="!updating">{{reportData.electricityTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('electricity_pre', 'Electricity Pre-standard')">
              <span v-if="!updating">{{reportData.electricityPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_cracker', 'Electricity Cracker Consumption')">
              <span v-if="!updating">{{reportData.electricityCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_cracker_t_t', 'Electricity Cracker t/t')">
              <span v-if="!updating">{{reportData.electricityCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_cracker_kgoe', 'Electricity Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.electricityCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_cracker_kgce', 'Electricity Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.electricityCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_pgu_aeu', 'Electricity PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.electricityPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_pgu_aeu_t_t', 'Electricity PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.electricityPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_pgu_aeu_kgoe', 'Electricity PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.electricityPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_pgu_aeu_kgce', 'Electricity PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.electricityPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_sctu_flare', 'Electricity SCTU+Flare')">
              <span v-if="!updating">{{reportData.electricitySctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricitySctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_sub', 'Electricity SUB')">
              <span v-if="!updating">{{reportData.electricitySub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricitySub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('electricity_bcc', 'Electricity BCC')">
              <span v-if="!updating">{{reportData.electricityBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.electricityBcc"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="bg-blue-light">TK1420(Dimer)</td>
            <td class="bg-blue-light">TK1110(R1)</td>
            <td class="bg-blue-light">TK1130(IB)</td>
            <td class="bg-blue-light">TK1150(R3)</td>
          </tr>
          <tr>
            <td class="bg-blue-dark">coolling water</td>
            <td class="bg-blue-dark">kt</td>
            <td class="bg-yellow" @click="openDialog('cooling_water_toe', 'coolling water TOE/unit')">
              <span v-if="!updating">{{reportData.coolingWaterToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('cooling_water_tce', 'coolling water TCE/unit')">
              <span v-if="!updating">{{reportData.coolingWaterTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('cooling_water_pre', 'coolling water Pre-standard')">
              <span v-if="!updating">{{reportData.coolingWaterPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water__cracker', 'coolling water Cracker')">
              <span v-if="!updating">{{reportData.coolingWaterCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water_cracker_tt', 'coolling water Cracker t/t')">
              <span v-if="!updating">{{reportData.coolingWaterCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water_cracker_kgoe', 'coolling water Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.coolingWaterCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water_cracker_kgce', 'coolling water Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.coolingWaterCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water_pgu_aeu', 'coolling water PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.coolingWaterPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water_pgu_aeu_t_t', 'coolling water PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.coolingWaterPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water_pgu_aeu_kgoe', 'coolling water PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.coolingWaterPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water_pgu_aeu_kgce', 'coolling water PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.coolingWaterPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water_sctu_flare', 'coolling water SCTU+Flare')">
              <span v-if="!updating">{{reportData.coolingWaterSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water_sub', 'coolling water SUB')">
              <span v-if="!updating">{{reportData.coolingWaterSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('cooling_water_bcc', 'coolling water BCC')">
              <span v-if="!updating">{{reportData.coolingWaterBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.coolingWaterBcc"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1420_dimer', 'SCTF STORAGE TK1420(Dimer)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1420Dimer}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1420Dimer"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1110_r1', 'SCTF STORAGE TK1110(R1)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1110R1}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1110R1"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1130_ib', 'SCTF STORAGE TK1130(IB)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1130Ib}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1130Ib"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1150_r3', 'SCTF STORAGE TK1150(R3)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1150R3}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1150R3"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-dark">Polished Condensate</td>
            <td class="bg-blue-dark">t</td>
            <td class="bg-purple-light" @click="openDialog('polished_con_toe', 'Polished Condensate TOE/unit')">
              <span v-if="!updating">{{reportData.polishedConToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('polished_con_tce', 'Polished Condensate TCE/unit')">
              <span v-if="!updating">{{reportData.polishedConTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('polished_con_pre', 'Polished Condensate Pre-standard')">
              <span v-if="!updating">{{reportData.polishedConPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_cracker', 'Polished Condensate Cracker Consumption')">
              <span v-if="!updating">{{reportData.polishedConCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_cracker_t_t', 'Polished Condensate Cracker t/t')">
              <span v-if="!updating">{{reportData.polishedConCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_cracker_kgoe', 'Polished Condensate Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.polishedConCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_cracker_kgce', 'Polished Condensate Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.polishedConCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_pgu_aeu', 'Polished Condensate PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.polishedConPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_pgu_aeu_t_t', 'Polished Condensate PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.polishedConPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_pgu_aeu_kgoe', 'Polished Condensate PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.polishedConPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_pgu_aeu_kgce', 'Polished Condensate PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.polishedConPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_sctu_flare', 'Polished Condensate SCTU+Flare')">
              <span v-if="!updating">{{reportData.polishedConSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_sub', 'Polished Condensate SUB')">
              <span v-if="!updating">{{reportData.polishedConSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('polished_con_bcc', 'Polished Condensate BCC')">
              <span v-if="!updating">{{reportData.polishedConBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.polishedConBcc"/>
            </td>
            <td class="no-border" colspan="3"></td>
            <td class="bg-blue-light">TK1140(BD)</td>
            <td class="bg-blue-light">TK1141(BD)</td>
            <td class="bg-blue-light">TK1142(BD)</td>
          </tr>
          <tr>
            <td class="bg-blue-dark">HP BFW</td>
            <td class="bg-blue-dark">t</td>
            <td class="bg-yellow" @click="openDialog('hp_bfw_toe', 'HP BFW TOE/unit')">
              <span v-if="!updating">{{reportData.hpBfwToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('hp_bfw_tce', 'HP BFW TCE/unit')">
              <span v-if="!updating">{{reportData.hpBfwTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('hp_bfw_pre', 'HP BFW Pre-standard')">
              <span v-if="!updating">{{reportData.hpBfwPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_cracker', 'HP BFW Cracker Consumption')">
              <span v-if="!updating">{{reportData.hpBfwCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_cracker_t_t', 'HP BFW Cracker t/t')">
              <span v-if="!updating">{{reportData.hpBfwCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_cracker_kgoe', 'HP BFW Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.hpBfwCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_cracker_kgce', 'HP BFW Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.hpBfwCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_pgu_aeu', 'HP BFW PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.hpBfwPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_pgu_aeu_t_t', 'HP BFW PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.hpBfwPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_pgu_aeu_kgoe', 'HP BFW PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.hpBfwPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_pgu_aeu_kgce', 'HP BFW PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.hpBfwPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_sctu_flare', 'HP BFW SCTU+Flare')">
              <span v-if="!updating">{{reportData.hpBfwSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_sub', 'HP BFW SUB')">
              <span v-if="!updating">{{reportData.hpBfwSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('hp_bfw_bcc', 'HP BFW BCC')">
              <span v-if="!updating">{{reportData.hpBfwBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hpBfwBcc"/>
            </td>
            <td class="no-border" colspan="3"></td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1140_bd', 'SCTF STORAGE TK1140(BD)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1140Bd}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1140Bd"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1141_bd', 'SCTF STORAGE TK1141(BD)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1141Bd}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1141Bd"/>
            </td>
            <td class="bg-blue-light" @click="openDialog('sctf_storage_tk1142_bd', 'SCTF STORAGE TK1142(BD)')">
              <span v-if="!updating">{{reportData.sctfStorageTk1142Bd}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTk1142Bd"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-dark">Production Water</td>
            <td class="bg-blue-dark">t</td>
            <td class="bg-purple-light" @click="openDialog('prod_water_toe', 'Production Water TOE/unit')">
              <span v-if="!updating">{{reportData.prodWaterToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('prod_water_tce', 'Production Water TCE/unit')">
              <span v-if="!updating">{{reportData.prodWaterTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('prod_water_pre', 'Production Water Pre-standard')">
              <span v-if="!updating">{{reportData.prodWaterPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_cracker', 'Production Water Cracker Consumption')">
              <span v-if="!updating">{{reportData.prodWaterCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_cracker_t_t', 'Production Water Cracker t/t')">
              <span v-if="!updating">{{reportData.prodWaterCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_cracker_kgoe', 'Production Water Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.prodWaterCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_cracker_kgce', 'Production Water Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.prodWaterCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_pgu_aeu', 'Production Water PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.prodWaterPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_pgu_aeu_t_t', 'Production Water PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.prodWaterPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_pgu_aeu_kgoe', 'Production Water PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.prodWaterPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_pgu_aeu_kgce', 'Production Water PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.prodWaterPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_sctu_flare', 'Production Water SCTU+Flare')">
              <span v-if="!updating">{{reportData.prodWaterSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_sub', 'Production Water SUB')">
              <span v-if="!updating">{{reportData.prodWaterSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('prod_water_bcc', 'Production Water BCC')">
              <span v-if="!updating">{{reportData.prodWaterBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.prodWaterBcc"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="bg-green-neon">total NAP</td>
            <td class="bg-grey-light">CLTF1621</td>
            <td class="bg-grey-light">CLTF1622</td>
            <td class="bg-grey-light">CLTF1623</td>
          </tr>
          <tr>
            <td class="bg-blue-dark">Turbine Condensate</td>
            <td class="bg-blue-dark">t</td>
            <td class="bg-purple-light" @click="openDialog('turbine_con_toe', 'Turbine Condensate TOE/unit')">
              <span v-if="!updating">{{reportData.turbineConToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('turbine_con_tce', 'Turbine Condensate TCE/unit')">
              <span v-if="!updating">{{reportData.turbineConTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('turbine_con_pre', 'Turbine Condensate Pre-standard')">
              <span v-if="!updating">{{reportData.turbineConPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_cracker', 'Turbine Condensate Cracker Consumption')">
              <span v-if="!updating">{{reportData.turbineConCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_cracker_t_t', 'Turbine Condensate Cracker t/t')">
              <span v-if="!updating">{{reportData.turbineConCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_cracker_kgoe', 'Turbine Condensate Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.turbineConCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_cracker_kgce', 'Turbine Condensate Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.turbineConCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_pgu_aeu', 'Turbine Condensate PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.turbineConPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_pgu_aeu_t_t', 'Turbine Condensate PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.turbineConPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_pgu_aeu_kgoe', 'Turbine Condensate PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.turbineConPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_pgu_aeu_kgce', 'Turbine Condensate PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.turbineConPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_sctu_flare', 'Turbine Condensate SCTU+Flare')">
              <span v-if="!updating">{{reportData.turbineConSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_sub', 'Turbine Condensate SUB')">
              <span v-if="!updating">{{reportData.turbineConSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('turbine_con_bcc', 'Turbine Condensate BCC')">
              <span v-if="!updating">{{reportData.turbineConBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.turbineConBcc"/>
            </td>
            <td class="no-border" colspan="2"></td>
            <td class="bg-green-neon" @click="openDialog('sctf_storage_total_nap', 'SCTF STORAGE total NAP')">
              <span v-if="!updating">{{reportData.sctfStorageTotalNap}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageTotalNap"/>
            </td>
            <td class="bg-grey-light" @click="openDialog('sctf_storage_cltf1621', 'SCTF STORAGE CLTF1621')">
              <span v-if="!updating">{{reportData.sctfStorageCltf1621}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageCltf1621"/>
            </td>
            <td class="bg-grey-light" @click="openDialog('sctf_storage_cltf1622', 'SCTF STORAGE CLTF1622')">
              <span v-if="!updating">{{reportData.sctfStorageCltf1622}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageCltf1622"/>
            </td>
            <td class="bg-grey-light" @click="openDialog('sctf_storage_cltf1623', 'SCTF STORAGE CLTF1623')">
              <span v-if="!updating">{{reportData.sctfStorageCltf1623}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.sctfStorageCltf1623"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-dark">PA&IA</td>
            <td class="bg-blue-dark">pnm3</td>
            <td class="bg-purple-light" @click="openDialog('pa_ia_toe', 'PA&IA TOE/unit')">
              <span v-if="!updating">{{reportData.paIaToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaToe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('pa_ia_tce', 'PA&IA TCE/unit')">
              <span v-if="!updating">{{reportData.paIaTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaTce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('pa_ia_pre', 'PA&IA Pre-standard')">
              <span v-if="!updating">{{reportData.paIaPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaPre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_cracker', 'PA&IA Cracker Consumption')">
              <span v-if="!updating">{{reportData.paIaCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaCracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_cracker_t_t', 'PA&IA Cracker t/t')">
              <span v-if="!updating">{{reportData.paIaCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaCrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_cracker_kgoe', 'PA&IA Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.paIaCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaCrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_cracker_kgce', 'PA&IA Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.paIaCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaCrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_pgu_aeu', 'PA&IA PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.paIaPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaPguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_pgu_aeu_t_t', 'PA&IA PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.paIaPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaPguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_pgu_aeu_kgoe', 'PA&IA PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.paIaPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaPguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_pgu_aeu_kgce', 'PA&IA PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.paIaPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaPguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_sctu_flare', 'PA&IA SCTU+Flare')">
              <span v-if="!updating">{{reportData.paIaSctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaSctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_sub', 'PA&IA SUB')">
              <span v-if="!updating">{{reportData.paIaSub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaSub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('pa_ia_bcc', 'PA&IA BCC')">
              <span v-if="!updating">{{reportData.paIaBcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.paIaBcc"/>
            </td>
          </tr>
          <tr>
            <td class="bg-blue-dark">N2</td>
            <td class="bg-blue-dark">pnm3</td>
            <td class="bg-purple-light" @click="openDialog('n2_toe', 'N2 TOE/unit')">
              <span v-if="!updating">{{reportData.n2Toe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2Toe"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('n2_tce', 'N2 TCE/unit')">
              <span v-if="!updating">{{reportData.n2Tce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2Tce"/>
            </td>
            <td class="bg-purple-light" @click="openDialog('n2_pre', 'N2 Pre-standard')">
              <span v-if="!updating">{{reportData.n2Pre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2Pre"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('n2_cracker', 'N2 Cracker Consumption')">
              <span v-if="!updating">{{reportData.n2Cracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2Cracker"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('n2_cracker_t_t', 'N2 Cracker t/t')">
              <span v-if="!updating">{{reportData.n2CrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2CrackerTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('n2_cracker_kgoe', 'N2 Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.n2CrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2CrackerKgoe"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('n2_cracker_kgce', 'N2 Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.n2CrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2CrackerKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('n2_pgu_aeu', 'N2 PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.n2PguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2PguAeu"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('n2_pgu_aeu_t_t', 'N2 PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.n2PguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2PguAeuTT"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('n2_pgu_aeu_kgoe', 'N2 PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.n2PguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2PguAeuKgoe"/>
            </td>
            <td class="bg-yellow-light"@click="openDialog('n2_pgu_aeu_kgce', 'N2 PGU+AEU kgCE/t BTX')">
              <span v-if="!updating" >{{reportData.n2PguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2PguAeuKgce"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('n2_sctu_flare', 'N2 SCTU+Flare')">
              <span v-if="!updating">{{reportData.n2SctuFlare}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2SctuFlare"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('n2_sub', 'N2 SUB')">
              <span v-if="!updating">{{reportData.n2Sub}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2Sub"/>
            </td>
            <td class="bg-yellow-light" @click="openDialog('n2_bcc', 'N2 BCC')">
              <span v-if="!updating">{{reportData.n2Bcc}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.n2Bcc"/>
            </td>
          </tr>
          <tr>
            <td class="bg-orange">Total</td>
            <td class="bg-orange" rowspan="3">t</td>
            <td class="bg-orange" @click="openDialog('total_toe', 'Total TOE/unit')">
              <span v-if="!updating">{{reportData.totalToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalToe"/>
            </td>
            <td class="bg-orange" @click="openDialog('total_tce', 'Total TCE/unit')">
              <span v-if="!updating">{{reportData.totalTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalTce"/>
            </td>
            <td class="bg-orange" @click="openDialog('total_pre', 'Total Pre-standard')">
              <span v-if="!updating">{{reportData.totalPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalPre"/>
            </td>
            <td class="bg-orange" @click="openDialog('total_cracker', 'Total Cracker Consumption')">
              <span v-if="!updating">{{reportData.totalCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalCracker"/>
            </td>
            <td class="bg-orange" @click="openDialog('total_cracker_t_t', 'Total Cracker t/t')">
              <span v-if="!updating">{{reportData.totalCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalCrackerTT"/>
            </td>
            <td class="bg-blue" @click="openDialog('total_cracker_kgoe', 'Total Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.totalCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalCrackerKgoe"/>
            </td>
            <td class="bg-blue" @click="openDialog('total_cracker_kgce', 'Total Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.totalCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalCrackerKgce"/>
            </td>
            <td class="bg-orange" @click="openDialog('total_pgu_aeu', 'Total PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.totalPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalPguAeu"/>
            </td>
            <td class="bg-orange" @click="openDialog('total_pgu_aeu_t_t', 'Total PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.totalPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalPguAeuTT"/>
            </td>
            <td class="bg-blue" @click="openDialog('total_pgu_aeu_kgoe', 'Total PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.totalPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalPguAeuKgoe"/>
            </td>
            <td class="bg-blue" @click="openDialog('total_pgu_aeu_kgce', 'Total PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.totalPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.totalPguAeuKgce"/>
            </td>
            <td class="bg-orange"></td>
            <td class="bg-orange" @click="openDialog('fr_eo_eg', 'FR EO/EG')">
              <span v-if="!updating">{{reportData.frEoEg}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.frEoEg"/>
            </td>
            <td class="bg-orange">FR EO/EG</td>
            <td class="bg-purple">320FC2161</td>
            <td class="bg-green">C210 PDI</td>
            <td class="bg-yellow">气温</td>
            <td class="bg-blue-dark">裂解炉烧焦</td>
          </tr>
          <tr>
            <td class="bg-orange">Target</td>
            <td class="bg-orange" @click="openDialog('target_toe', 'Target TOE/unit')">
              <span v-if="!updating">{{reportData.targetToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetToe"/>
            </td>
            <td class="bg-orange" @click="openDialog('target_tce', 'Target TCE/unit')">
              <span v-if="!updating">{{reportData.targetTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetTce"/>
            </td>
            <td class="bg-orange" @click="openDialog('target_pre', 'Target Pre-standard')">
              <span v-if="!updating">{{reportData.targetPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetPre"/>
            </td>
            <td class="bg-orange" @click="openDialog('target_cracker', 'Target Cracker Consumption')">
              <span v-if="!updating">{{reportData.targetCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetCracker"/>
            </td>
            <td class="bg-orange" @click="openDialog('target_cracker_t_t', 'Target Cracker t/t')">
              <span v-if="!updating">{{reportData.targetCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetCrackerTT"/>
            </td>
            <td class="bg-orange" @click="openDialog('target_cracker_kgoe', 'Target Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.targetCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetCrackerKgoe"/>
            </td>
            <td class="bg-orange" @click="openDialog('target_cracker_kgce', 'Target Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.targetCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetCrackerKgce"/>
            </td>
            <td class="bg-orange" @click="openDialog('target_pgu_aeu', 'Target PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.targetPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetPguAeu"/>
            </td>
            <td class="bg-orange" @click="openDialog('target_pgu_aeu_t_t', 'Target PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.targetPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetPguAeuTT"/>
            </td>
            <td class="bg-orange" @click="openDialog('target_pgu_aeu_kgoe', 'Target PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.targetPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetPguAeuKgoe"/>
            </td>
            <td class="bg-orange" @click="openDialog('target_pgu_aeu_kgce', 'Target PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.targetPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.targetPguAeuKgce"/>
            </td>
            <td class="bg-blue"></td>
            <td class="bg-blue" @click="openDialog('load_percentage', 'load%')">
              <span v-if="!updating">{{reportData.loadPercentage}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.loadPercentage"/>
            </td>
            <td class="bg-blue">load%</td>
            <td class="bg-purple" @click="openDialog('col_320fc2161', '320FC2161')">
              <span v-if="!updating">{{reportData.col320fc2161}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.col320fc2161"/>
            </td>
            <td class="bg-green" @click="openDialog('c210pdi', 'C210 PDI')">
              <span v-if="!updating">{{reportData.c210pdi}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.c210pdi"/>
            </td>
            <td class="bg-yellow" @click="openDialog('temperature', '气温')">
              <span v-if="!updating">{{reportData.temperature}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.temperature"/>
            </td>
            <td class="bg-blue-dark" @click="openDialog('cracking_furnace_burn', '裂解炉烧焦')">
              <span v-if="!updating">{{reportData.crackingFurnaceBurn}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.crackingFurnaceBurn"/>
            </td>
          </tr>
          <tr>
            <td class="bg-orange">Produced</td>
            <td class="bg-orange" @click="openDialog('produced_toe', 'Produced TOE/unit')">
              <span v-if="!updating">{{reportData.producedToe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedToe"/>
            </td>
            <td class="bg-orange" @click="openDialog('produced_tce', 'Produced TCE/unit')">
              <span v-if="!updating">{{reportData.producedTce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedTce"/>
            </td>
            <td class="bg-orange" @click="openDialog('produced_pre', 'Produced Pre-standard')">
              <span v-if="!updating">{{reportData.producedPre}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedPre"/>
            </td>
            <td class="bg-orange" @click="openDialog('produced_cracker', 'Produced Cracker Consumption')">
              <span v-if="!updating">{{reportData.producedCracker}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedCracker"/>
            </td>
            <td class="bg-orange" @click="openDialog('produced_cracker_t_t', 'Produced Cracker t/t')">
              <span v-if="!updating">{{reportData.producedCrackerTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedCrackerTT"/>
            </td>
            <td class="bg-orange" @click="openDialog('produced_cracker_kgoe', 'Produced Cracker kgOE/t C2=')">
              <span v-if="!updating">{{reportData.producedCrackerKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedCrackerKgoe"/>
            </td>
            <td class="bg-orange" @click="openDialog('produced_cracker_kgce', 'Produced Cracker kgCE/t C2=')">
              <span v-if="!updating">{{reportData.producedCrackerKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedCrackerKgce"/>
            </td>
            <td class="bg-orange" @click="openDialog('produced_pgu_aeu', 'Produced PGU+AEU Consumption')">
              <span v-if="!updating">{{reportData.producedPguAeu}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedPguAeu"/>
            </td>
            <td class="bg-orange" @click="openDialog('produced_pgu_aeu_t_t', 'Produced PGU+AEU t/t')">
              <span v-if="!updating">{{reportData.producedPguAeuTT}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedPguAeuTT"/>
            </td>
            <td class="bg-orange" @click="openDialog('produced_pgu_aeu_kgoe', 'Produced PGU+AEU kgOE/t BTX')">
              <span v-if="!updating">{{reportData.producedPguAeuKgoe}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedPguAeuKgoe"/>
            </td>
            <td class="bg-orange" @click="openDialog('produced_pgu_aeu_kgce', 'Produced PGU+AEU kgCE/t BTX')">
              <span v-if="!updating">{{reportData.producedPguAeuKgce}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.producedPguAeuKgce"/>
            </td>
            <td class="bg-blue"></td>
            <td class="bg-blue" @click="openDialog('hs_producet', 'HS Producet')">
              <span v-if="!updating">{{reportData.hsProducet}}</span>
              <el-input v-if="updating" size="mini" v-model="reportData.hsProducet"/>
            </td>
            <td class="bg-blue">HS Producet</td>
            <td class="bg-purple">kg/h</td>
            <td class="bg-green">Kpa</td>
            <td class="bg-yellow">℃</td>
            <td class="bg-blue-dark">台</td>
          </tr>
        </table>
      </div>
    </form>
    <!-- 用户导入对话框 -->
    <el-dialog  :close-on-click-modal="false" :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
      <el-upload
        ref="upload"
        :limit="32"
        accept=".xlsx, .xls"
        :headers="upload.headers"
        :action="upload.url + '?updateSupport=' + upload.updateSupport"
        :disabled="upload.isUploading"
        :on-progress="handleFileUploadProgress"
        :on-success="handleFileSuccess"
        :auto-upload="false"
        drag
        :file-list="fileList"
        :multiple="true"
        :show-file-list="true"
        :on-change="handleChange"
        :on-remove="handleRemove"
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">
          将文件拖到此处，或
          <em>点击上传</em>
        </div>
        <!--<div class="el-upload__tip" slot="tip">-->
          <!--<el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据-->
          <!--<el-link type="info" style="font-size:12px" @click="importTemplate">下载模板</el-link>-->
        <!--</div>-->
        <div class="el-upload__tip" style="color:red" slot="tip">提示：仅允许导入“xls”或“xlsx”格式文件！</div>
      </el-upload>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFileForm">确 定</el-button>
        <el-button @click="upload.open = false">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 趋势分析对话框 -->
    <el-dialog :close-on-click-modal="false" @close="handleDialogClose" :title="analysis.title" :visible.sync="analysis.open" width="1400px" append-to-body>
      <el-form :model="analysisQueryParams" ref="queryForm" :inline="true" label-width="102px">
        <el-form-item label="开始日期" prop="startDate">
          <el-date-picker
            v-model="analysisQueryParams.startDate"
            type="date"
            placeholder="选择开始日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="结束日期" prop ="endDate">
          <el-date-picker
            v-model="analysisQueryParams.endDate"
            type="date"
            placeholder="选择结束日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="对比指标" prop="chemicalChosen">
          <el-select
            multiple
            :multiple-limit="5"
            v-model="chemicalChosen"
            @change="handleAddChemicals"
            filterable
            clearable
            placeholder="请选择对比指标">
            <el-option
              v-for="dict in chemicalsOptions"
              :key="dict.dictValue"
              :label="dict.dictLabel"
              :value="dict.dictValue">
            </el-option>
          </el-select>
        </el-form-item>
        <br/>
        <el-form-item :label="minYLabel" prop="minY">
          <el-input v-model="minY" placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item :label="maxYLabel" prop="maxY">
          <el-input v-model="maxY" placeholder="请输入"></el-input>
        </el-form-item>

        <span v-if="showY1">
          <el-form-item :label="minYLabel1" prop="minY1">
            <el-input v-model="minY1" placeholder="请输入"></el-input>
          </el-form-item>
          <el-form-item :label="maxYLabel1" prop="maxY1">
            <el-input v-model="maxY1" placeholder="请输入"></el-input>
          </el-form-item>
        </span>

        <span v-if="showY2">
          <el-form-item :label="minYLabel2" prop="minY2">
            <el-input v-model="minY2" placeholder="请输入"></el-input>
          </el-form-item>
          <el-form-item :label="maxYLabel2" prop="maxY2">
            <el-input v-model="maxY2" placeholder="请输入"></el-input>
          </el-form-item>
        </span>

        <span v-if="showY3">
          <el-form-item :label="minYLabel3" prop="minY3">
            <el-input v-model="minY3" placeholder="请输入"></el-input>
          </el-form-item>
          <el-form-item :label="maxYLabel3" prop="maxY3">
            <el-input v-model="maxY3" placeholder="请输入"></el-input>
          </el-form-item>
        </span>

        <span v-if="showY4">
          <el-form-item :label="minYLabel4" prop="minY4">
            <el-input v-model="minY4" placeholder="请输入"></el-input>
          </el-form-item>
          <el-form-item :label="maxYLabel4" prop="maxY4">
            <el-input v-model="maxY4" placeholder="请输入"></el-input>
          </el-form-item>
        </span>

        <span v-if="showY5">
          <el-form-item :label="minYLabel5" prop="minY5">
            <el-input v-model="minY5" placeholder="请输入"></el-input>
          </el-form-item>
          <el-form-item :label="maxYLabel5" prop="maxY5">
            <el-input v-model="maxY5" placeholder="请输入"></el-input>
          </el-form-item>
        </span>

        <el-form-item>
          <el-button type="primary" @click="handleAnalysisQuery">搜 索</el-button>
        </el-form-item>
      </el-form>
      <div id="trendChart" style="width:1340px;height:600px;"></div>
    </el-dialog>
  </div>
</template>

<script>
import { getAnalysisData, getReportByMaxDate, listReport, getReport, delReport, addReport, updateReport, exportReport, importTemplate} from "@/api/production/report";
import { treeselect } from "@/api/system/dept";
import { getToken } from "@/utils/auth";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import echartMixins from "@/utils/resizeMixins";

export default {
  name: "Daily",
  components: { Treeselect },
  data() {
    return {
      showY1: false,
      showY2: false,
      showY3: false,
      showY4: false,
      showY5: false,
      minYLabel1: null,
      maxYLabel1: null,
      minYLabel2: null,
      maxYLabel2: null,
      minYLabel3: null,
      maxYLabel3: null,
      minYLabel4: null,
      maxYLabel4: null,
      minYLabel5: null,
      maxYLabel5: null,
      minY1: null,
      maxY1: null,
      minY2: null,
      maxY2: null,
      minY3: null,
      maxY3: null,
      minY4: null,
      maxY4: null,
      minY5: null,
      maxY5: null,
      minYLabel: null,
      maxYLabel: null,
      // 纵坐标最小值
      minY: null,
      // 纵坐标最大值
      maxY: null,
      fileList: [], // 上传文件列表
      uploading: false,  // 是否正在上传文件
      // 选中的对比指标
      chemicalChosen: null,
      // 对比指标下拉框
      chemicalsOptions: [],
      // y轴最大值
      maxValue: null,
      maxValue2: null,
      // y轴最小值
      minValue: null,
      minValue2: null,
      // 趋势图
      chart: null,
      // 趋势分析参数
      analysis: {
        // 是否显示弹出层
        open: false,
        // 弹出层标题
        title: "",
      },
      // 趋势分析参数
      analysisQueryParams: {
        fieldName: null,
        startDate: null,
        endDate: null
      },
      fieldNameTemp: null,
      fieldNameTitle: null,
      fieldNameTitle2: null,
      // 趋势图y轴数值
      valueList: [],
      // 趋势图y轴数值（对比）
      valueList2: [],
      // 趋势图x轴日期
      dateList: [],
      // 每日生产报告数据
      reportData: {
        id: null,
        offgasToGaaCaa: null,
        pguC5RaffInput: null,
        fromDate: null,
        toDate: null,
        reportDate: null,
        nap: null,
        c5: null,
        c6C8Na: null,
        wisonEthane: null,
        lpgToFurnace: null,
        raff1FrBd: null,
        raff2FrIb: null,
        raff3FrBd: null,
        raffinate2pFr2ph: null,
        c2FrLdpe: null,
        c3FrOxo: null,
        mixedC3C4: null,
        hyC9: null,
        pguOffgas: null,
        washOil: null,
        toluene: null,
        hyC4FrR800: null,
        h2YieldPercentage: null,
        h2Produced: null,
        h2Inventory: null,
        h2Change: null,
        h2Import: null,
        h2Export: null,
        h2ToPgu: null,
        h2ToYpc: null,
        h2ToOxo: null,
        h2FrSyngasToSub: null,
        ethylenYieldPercentage: null,
        ethylenProduced: null,
        ethylenInventory: null,
        ethylenChange: null,
        ethylenImport: null,
        ethylenExport: null,
        ethylenToTm: null,
        ethylenToTs: null,
        ethylenToEoEg: null,
        ethylenToOxo: null,
        ethylenToYbs: null,
        ethylenToYpc: null,
        ethylenToWacker: null,
        ethylenToDyna: null,
        ethylenToCelanLongx: null,
        ethylenFrYpc: null,
        ethylenFrLongxiang: null,
        propyleneYieldPercentage: null,
        propyleneProduced: null,
        propyleneInventory: null,
        propyleneChange: null,
        propyleneImport: null,
        propyleneExport: null,
        propyleneToAaAe: null,
        propyleneToGaa: null,
        propyleneToOxo: null,
        propyleneToLdpe: null,
        propyleneToYpc: null,
        propyleneToRoad: null,
        propyleneToShip: null,
        propyleneFrYpc: null,
        propyleneFrShip: null,
        propyleneFrChengzhi: null,
        c3LpgYieldPercentage: null,
        c4LpgYieldPercentage: null,
        c3LpgProduced: null,
        c4LpgProduced: null,
        c3C4Inventory: null,
        c3C4Change: null,
        c3C4Import: null,
        c3C4Export: null,
        c3C4ToSub: null,
        c3C4ToFurAsFule: null,
        c3C4AsFeed: null,
        c3C4FrYpc: null,
        c3C4FrTruck: null,
        mixedC4sYieldPercentage: null,
        mixedC4sProduced: null,
        mixedC4sInventory: null,
        mixedC4sChange: null,
        mixedC4sImport: null,
        mixedC4sExport: null,
        mixedC4sToBd: null,
        mixedC4sToYpc: null,
        mixedC4sToTruck: null,
        mixedC4sToShip: null,
        mixedC4sFrYpc: null,
        mixedC4sFrTruck: null,
        mixedC4sFrShip: null,
        mixedC4sFrBdR1: null,
        mixedC4sToR800: null,
        eboYieldPercentage: null,
        eboProduced: null,
        eboInventory: null,
        eboChange: null,
        eboImport: null,
        eboExport: null,
        eboToShip: null,
        eboToRttf: null,
        eboToTrain: null,
        eboFrBd: null,
        naphthaleneYieldPercentage: null,
        naphthaleneProduced: null,
        naphthaleneInventory: null,
        naphthaleneChange: null,
        naphthaleneImport: null,
        naphthaleneExport: null,
        naphthaleneToTruck: null,
        poFluxOilYieldPercentage: null,
        poFluxOilProduced: null,
        poFluxOilInventory: null,
        poFluxOilChange: null,
        poFluxOilImport: null,
        poFluxOilExport: null,
        poFluxOilToBd: null,
        offgasYieldPercentage: null,
        offgasProduced: null,
        offgasInventory: null,
        offgasChange: null,
        offgasImport: null,
        offgasExport: null,
        offgasToFurnance: null,
        offgasToYbs: null,
        offgasToCEru: null,
        offgasSubInCloseU2: null,
        offgasFlareSctu: null,
        offgasToU2Nm3: null,
        offgasFlareLossT: null,
        rpgYieldPercentage: null,
        rpgProduced: null,
        rpgInventory: null,
        rpgChange: null,
        rpgImport: null,
        rpgExport: null,
        rpgToPgu: null,
        rpgFrYfcc: null,
        methaneYieldPercentage: null,
        methaneProduced: null,
        methaneToEoEg: null,
        residueOilYieldPercentage: null,
        residueOilProduced: null,
        totalInput: null,
        totalOutput: null,
        totalLoss: null,
        lossPercentage: null,
        totalFurnanceFeed: null,
        napFrCltf: null,
        totalPE: null,
        plantModeIs: null,
        plantLoad3495tD: null,
        avgFurnanceFeedTH: null,
        feedingRatioPercentage: null,
        hhpToe: null,
        hhpTce: null,
        hhpPre: null,
        hhpCracker: null,
        hhpCrackerTT: null,
        hhpCrackerKgoe: null,
        hhpCrackerKgce: null,
        hhpPguAeu: null,
        hhpPguAeuTT: null,
        hhpPguAeuKgoe: null,
        hhpPguAeuKgce: null,
        hhpSctuFlare: null,
        hhpSub: null,
        hhpBcc: null,
        ngToe: null,
        ngTce: null,
        ngPre: null,
        ngCracker: null,
        ngCrackerTT: null,
        ngCrackerKgoe: null,
        ngCrackerKgce: null,
        ngPguAeu: null,
        ngPguAeuTT: null,
        ngPguAeuKgoe: null,
        ngPguAeuKgce: null,
        ngSctuFlare: null,
        ngSub: null,
        ngBcc: null,
        fuelGasOffgasToe: null,
        fuelGasOffgasTce: null,
        fuelGasOffgasPre: null,
        fuelGasOffgasCracker: null,
        fuelGasOffgasCrackerTT: null,
        fuelGasOffgasCrackerKgoe: null,
        fuelGasOffgasCrackerKgce: null,
        fuelGasOffgasPguAeu: null,
        fuelGasOffgasPguAeuTT: null,
        fuelGasOffgasPguAeuKgoe: null,
        fuelGasOffgasPguAeuKgce: null,
        fuelGasOffgasSctuFlare: null,
        fuelGasOffgasSub: null,
        fuelGasOffgasBcc: null,
        shpToe: null,
        shpTce: null,
        shpPre: null,
        shpCracker: null,
        shpCrackerTT: null,
        shpCrackerKgoe: null,
        shpCrackerKgce: null,
        shpPguAeu: null,
        shpPguAeuTT: null,
        shpPguAeuKgoe: null,
        shpPguAeuKgce: null,
        shpSctuFlare: null,
        shpSub: null,
        shpBcc: null,
        hpToe: null,
        hpTce: null,
        hpPre: null,
        hpCracker: null,
        hpCrackerTT: null,
        hpCrackerKgoe: null,
        hpCrackerKgce: null,
        hpPguAeu: null,
        hpPguAeuTT: null,
        hpPguAeuKgoe: null,
        hpPguAeuKgce: null,
        hpSctuFlare: null,
        hpSub: null,
        hpBcc: null,
        mpToe: null,
        mpTce: null,
        mpPre: null,
        mpCracker: null,
        mpCrackerTT: null,
        mpCrackerKgoe: null,
        mpCrackerKgce: null,
        mpPguAeu: null,
        mpPguAeuTT: null,
        mpPguAeuKgoe: null,
        mpPguAeuKgce: null,
        mpSctuFlare: null,
        mpSub: null,
        mpBcc: null,
        lpToe: null,
        lpTce: null,
        lpPre: null,
        lpCracker: null,
        lpCrackerTT: null,
        lpCrackerKgoe: null,
        lpCrackerKgce: null,
        lpPguAeu: null,
        lpPguAeuTT: null,
        lpPguAeuKgoe: null,
        lpPguAeuKgce: null,
        lpSctuFlare: null,
        lpSub: null,
        lpBcc: null,
        electricityToe: null,
        electricityTce: null,
        electricityPre: null,
        electricityCracker: null,
        electricityCrackerTT: null,
        electricityCrackerKgoe: null,
        electricityCrackerKgce: null,
        electricityPguAeu: null,
        electricityPguAeuTT: null,
        electricityPguAeuKgoe: null,
        electricityPguAeuKgce: null,
        electricitySctuFlare: null,
        electricitySub: null,
        electricityBcc: null,
        coolingWaterToe: null,
        coolingWaterTce: null,
        coolingWaterPre: null,
        coolingWaterCracker: null,
        coolingWaterCrackerTT: null,
        coolingWaterCrackerKgoe: null,
        coolingWaterCrackerKgce: null,
        coolingWaterPguAeu: null,
        coolingWaterPguAeuTT: null,
        coolingWaterPguAeuKgoe: null,
        coolingWaterPguAeuKgce: null,
        coolingWaterSctuFlare: null,
        coolingWaterSub: null,
        coolingWaterBcc: null,
        polishedConToe: null,
        polishedConTce: null,
        polishedConPre: null,
        polishedConCracker: null,
        polishedConCrackerTT: null,
        polishedConCrackerKgoe: null,
        polishedConCrackerKgce: null,
        polishedConPguAeu: null,
        polishedConPguAeuTT: null,
        polishedConPguAeuKgoe: null,
        polishedConPguAeuKgce: null,
        polishedConSctuFlare: null,
        polishedConSub: null,
        polishedConBcc: null,
        hpBfwToe: null,
        hpBfwTce: null,
        hpBfwPre: null,
        hpBfwCracker: null,
        hpBfwCrackerTT: null,
        hpBfwCrackerKgoe: null,
        hpBfwCrackerKgce: null,
        hpBfwPguAeu: null,
        hpBfwPguAeuTT: null,
        hpBfwPguAeuKgoe: null,
        hpBfwPguAeuKgce: null,
        hpBfwSctuFlare: null,
        hpBfwSub: null,
        hpBfwBcc: null,
        prodWaterToe: null,
        prodWaterTce: null,
        prodWaterPre: null,
        prodWaterCracker: null,
        prodWaterCrackerTT: null,
        prodWaterCrackerKgoe: null,
        prodWaterCrackerKgce: null,
        prodWaterPguAeu: null,
        prodWaterPguAeuTT: null,
        prodWaterPguAeuKgoe: null,
        prodWaterPguAeuKgce: null,
        prodWaterSctuFlare: null,
        prodWaterSub: null,
        prodWaterBcc: null,
        turbineConToe: null,
        turbineConTce: null,
        turbineConPre: null,
        turbineConCracker: null,
        turbineConCrackerTT: null,
        turbineConCrackerKgoe: null,
        turbineConCrackerKgce: null,
        turbineConPguAeu: null,
        turbineConPguAeuTT: null,
        turbineConPguAeuKgoe: null,
        turbineConPguAeuKgce: null,
        turbineConSctuFlare: null,
        turbineConSub: null,
        turbineConBcc: null,
        paIaToe: null,
        paIaTce: null,
        paIaPre: null,
        paIaCracker: null,
        paIaCrackerTT: null,
        paIaCrackerKgoe: null,
        paIaCrackerKgce: null,
        paIaPguAeu: null,
        paIaPguAeuTT: null,
        paIaPguAeuKgoe: null,
        paIaPguAeuKgce: null,
        paIaSctuFlare: null,
        paIaSub: null,
        paIaBcc: null,
        n2Toe: null,
        n2Tce: null,
        n2Pre: null,
        n2Cracker: null,
        n2CrackerTT: null,
        n2CrackerKgoe: null,
        n2CrackerKgce: null,
        n2PguAeu: null,
        n2PguAeuTT: null,
        n2PguAeuKgoe: null,
        n2PguAeuKgce: null,
        n2SctuFlare: null,
        n2Sub: null,
        n2Bcc: null,
        totalToe: null,
        totalTce: null,
        totalPre: null,
        totalCracker: null,
        totalCrackerTT: null,
        totalCrackerKgoe: null,
        totalCrackerKgce: null,
        totalPguAeu: null,
        totalPguAeuTT: null,
        totalPguAeuKgoe: null,
        totalPguAeuKgce: null,
        targetToe: null,
        targetTce: null,
        targetPre: null,
        targetCracker: null,
        targetCrackerTT: null,
        targetCrackerKgoe: null,
        targetCrackerKgce: null,
        targetPguAeu: null,
        targetPguAeuTT: null,
        targetPguAeuKgoe: null,
        targetPguAeuKgce: null,
        producedToe: null,
        producedTce: null,
        producedPre: null,
        producedCracker: null,
        producedCrackerTT: null,
        producedCrackerKgoe: null,
        producedCrackerKgce: null,
        producedPguAeu: null,
        producedPguAeuTT: null,
        producedPguAeuKgoe: null,
        producedPguAeuKgce: null,
        frEoEg: null,
        loadPercentage: null,
        hsProducet: null,
        sctfStorageTotalC2: null,
        sctfStorageTk1061: null,
        sctfStorageTk1062: null,
        sctfStorageTk1063: null,
        sctfStorageTk1064: null,
        sctfStorageTk1065Off: null,
        sctfStorageTotalC3: null,
        sctfStorageTk1011: null,
        sctfStorageTk1012: null,
        sctfStorageTk1013: null,
        sctfStorageTk1014: null,
        sctfStorageTk1040Off: null,
        sctfStorageTk1020Lpg: null,
        sctfStorageTk1111C4s: null,
        sctfStorageTk1520Rpg: null,
        sctfStorageTk1350Po: null,
        sctfStorageTk1310Btx: null,
        sctfStorageTk1330Ebo: null,
        sctfStorageTk1430Lfo: null,
        sctfStorageTk1320OffBtx: null,
        sctfStorageT201Btx: null,
        sctfStorageTk1340C9: null,
        sctfStorageClt1350C9: null,
        sctfStorageTk1160Nh3: null,
        sctfStorageTk1510B: null,
        sctfStorageClt1370B: null,
        sctfStorageTk1360T: null,
        sctfStorageTk1410X: null,
        sctfStorageClt1380X: null,
        sctfStorageTk1420Dimer: null,
        sctfStorageTk1110R1: null,
        sctfStorageTk1130Ib: null,
        sctfStorageTk1150R3: null,
        sctfStorageTk1140Bd: null,
        sctfStorageTk1141Bd: null,
        sctfStorageTk1142Bd: null,
        sctfStorageTotalNap: null,
        sctfStorageCltf1621: null,
        sctfStorageCltf1622: null,
        sctfStorageCltf1623: null,
        pguToRpg: null,
        rpgToPgu2: null,
        pguRpgTH: null,
        pguRpg1: null,
        pguRpg2: null,
        pguH2: null,
        pguTotalFeed: null,
        pguOutput: null,
        pguTotalLoss: null,
        pguLossPercentage: null,
        pguFeedLoadPercentage: null,
        pguToAeu: null,
        aeuToPgu: null,
        pguAeuTH: null,
        pguBtxYeildPercentage: null,
        pguBtxProduced: null,
        pguBtxInventory: null,
        pguBtxChange: null,
        pguBtxExport: null,
        pguBtxToAeu: null,
        pguWashoilYeildPercentage: null,
        pguWashoilProduced: null,
        pguWashoilInventory: null,
        pguWashoilChange: null,
        pguWashoilExport: null,
        pguWashoilToEu: null,
        pguOffgasYeildPercentage: null,
        pguOffgasProduced: null,
        pguOffgasInventory: null,
        pguOffgasChange: null,
        pguOffgasExport: null,
        pguOffgasToEu: null,
        pguC5YeildPercentage: null,
        pguC5Produced: null,
        pguC5Inventory: null,
        pguC5Change: null,
        pguC5Export: null,
        pguC5ToAeu: null,
        pguC5ToEu: null,
        pguC5ToYuanguan: null,
        pguC9YeildPercentage: null,
        pguC9Produced: null,
        pguC9Inventory: null,
        pguC9Change: null,
        pguC9Export: null,
        pguC9ToAeu: null,
        pguC9ToRttf: null,
        pguC9ToShip: null,
        pguC9ToYfcc: null,
        aeuBenzeneYeildPercentage: null,
        aeuBenzeneProduced: null,
        aeuBenzeneInventory: null,
        aeuBenzeneChange: null,
        aeuBenzeneToShip: null,
        aeuBenzeneFrShip: null,
        aeuBenzeneToYbs: null,
        aeuBenzeneToRttf: null,
        aeuBenzeneToTrain: null,
        aeuTolueneYeildPercentage: null,
        aeuTolueneProduced: null,
        aeuTolueneInventory: null,
        aeuTolueneChange: null,
        aeuTolueneToShip: null,
        aeuTolueneFrShip: null,
        aeuTolueneToYpc: null,
        aeuTolueneFrYpc: null,
        aeuTolueneToRttf: null,
        aeuTolueneFrYbs: null,
        aeuTolueneToEu: null,
        aeuXyleneYeildPercentage: null,
        aeuXyleneProduced: null,
        aeuXyleneInventory: null,
        aeuXyleneChange: null,
        aeuXyleneToShip: null,
        aeuXyleneFrShip: null,
        aeuXyleneToYpc: null,
        aeuXyleneFrYpc: null,
        aeuXyleneToRttf: null,
        aeuC6C8NaYeildPercentage: null,
        aeuC6C8NaProduced: null,
        aeuC6C8NaInventory: null,
        aeuC6C8NaChange: null,
        aeuC6C8NaToEu: null,
        aeuC6C8NaToYpc: null,
        aeuTotalFeed: null,
        aeuOutput: null,
        aeuTotalLoss: null,
        aeuLossPercentage: null,
        aeuFeedLoadPercentage: null,
        pguAeuTotalFeed: null,
        pguAeuOutput: null,
        pguAeuTotalLoss: null,
        pguAeuLossPercentage: null,
        pguAeuFeedLoadPercentage: null
      },
      // 上次选中日期
      lastSelectedDate: null,
      // 修改中
      updating: false,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 每日生产报告表格数据
      reportList: [],
      // 弹出层标题
      title: "",
      // 部门树选项
      deptOptions: undefined,
      clientHeight:300,
      // 是否显示弹出层
      open: false,
      // 用户导入参数
      upload: {
        // 是否显示弹出层（用户导入）
        open: false,
        // 弹出层标题（用户导入）
        title: "",
        // 是否禁用上传
        isUploading: false,
        // 是否更新已经存在的用户数据
        updateSupport: 0,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/production/report/importData"
      },
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 20,
        fromDate: null,
        toDate: null,
        reportDate: null,
        reportCode: null,
        nap: null,
        c5: null,
        c6C8Na: null,
        wisonEthane: null,
        lpgToFurnace: null,
        raff1FrBd: null,
        raff2FrIb: null,
        raff3FrBd: null,
        raffinate2pFr2ph: null,
        c2FrLdpe: null,
        c3FrOxo: null,
        mixedC3C4: null,
        hyC9: null,
        pguOffgas: null,
        washOil: null,
        toluene: null,
        hyC4FrR800: null,
        h2YieldPercentage: null,
        h2Produced: null,
        h2Inventory: null,
        h2Change: null,
        h2Import: null,
        h2Export: null,
        h2ToPgu: null,
        h2ToYpc: null,
        h2ToOxo: null,
        h2FrSyngasToSub: null,
        ethylenYieldPercentage: null,
        ethylenProduced: null,
        ethylenInventory: null,
        ethylenChange: null,
        ethylenImport: null,
        ethylenExport: null,
        ethylenToTm: null,
        ethylenToTs: null,
        ethylenToEoEg: null,
        ethylenToOxo: null,
        ethylenToYbs: null,
        ethylenToYpc: null,
        ethylenToWacker: null,
        ethylenToDyna: null,
        ethylenToCelanLongx: null,
        ethylenFrYpc: null,
        ethylenFrLongxiang: null,
        propyleneYieldPercentage: null,
        propyleneProduced: null,
        propyleneInventory: null,
        propyleneChange: null,
        propyleneImport: null,
        propyleneExport: null,
        propyleneToAaAe: null,
        propyleneToGaa: null,
        propyleneToOxo: null,
        propyleneToLdpe: null,
        propyleneToYpc: null,
        propyleneToRoad: null,
        propyleneToShip: null,
        propyleneFrYpc: null,
        propyleneFrShip: null,
        propyleneFrChengzhi: null,
        c3LpgYieldPercentage: null,
        c4LpgYieldPercentage: null,
        c3LpgProduced: null,
        c4LpgProduced: null,
        c3C4Inventory: null,
        c3C4Change: null,
        c3C4Import: null,
        c3C4Export: null,
        c3C4ToSub: null,
        c3C4ToFurAsFule: null,
        c3C4AsFeed: null,
        c3C4FrYpc: null,
        c3C4FrTruck: null,
        mixedC4sYieldPercentage: null,
        mixedC4sProduced: null,
        mixedC4sInventory: null,
        mixedC4sChange: null,
        mixedC4sImport: null,
        mixedC4sExport: null,
        mixedC4sToBd: null,
        mixedC4sToYpc: null,
        mixedC4sToTruck: null,
        mixedC4sToShip: null,
        mixedC4sFrYpc: null,
        mixedC4sFrTruck: null,
        mixedC4sFrShip: null,
        mixedC4sFrBdR1: null,
        mixedC4sToR800: null,
        eboYieldPercentage: null,
        eboProduced: null,
        eboInventory: null,
        eboChange: null,
        eboImport: null,
        eboExport: null,
        eboToShip: null,
        eboToRttf: null,
        eboToTrain: null,
        eboFrBd: null,
        naphthaleneYieldPercentage: null,
        naphthaleneProduced: null,
        naphthaleneInventory: null,
        naphthaleneChange: null,
        naphthaleneImport: null,
        naphthaleneExport: null,
        naphthaleneToTruck: null,
        poFluxOilYieldPercentage: null,
        poFluxOilProduced: null,
        poFluxOilInventory: null,
        poFluxOilChange: null,
        poFluxOilImport: null,
        poFluxOilExport: null,
        poFluxOilToBd: null,
        offgasYieldPercentage: null,
        offgasProduced: null,
        offgasInventory: null,
        offgasChange: null,
        offgasImport: null,
        offgasExport: null,
        offgasToFurnance: null,
        offgasToYbs: null,
        offgasToCEru: null,
        offgasSubInCloseU2: null,
        offgasFlareSctu: null,
        offgasToU2Nm3: null,
        offgasFlareLossT: null,
        rpgYieldPercentage: null,
        rpgProduced: null,
        rpgInventory: null,
        rpgChange: null,
        rpgImport: null,
        rpgExport: null,
        rpgToPgu: null,
        rpgFrYfcc: null,
        methaneYieldPercentage: null,
        methaneProduced: null,
        methaneToEoEg: null,
        residueOilYieldPercentage: null,
        residueOilProduced: null,
        totalInput: null,
        totalOutput: null,
        totalLoss: null,
        lossPercentage: null,
        totalFurnanceFeed: null,
        napFrCltf: null,
        totalPE: null,
        plantModeIs: null,
        plantLoad3495tD: null,
        avgFurnanceFeedTH: null,
        feedingRatioPercentage: null,
        hhpToe: null,
        hhpTce: null,
        hhpPre: null,
        hhpCracker: null,
        hhpCrackerTT: null,
        hhpCrackerKgoe: null,
        hhpCrackerKgce: null,
        hhpPguAeu: null,
        hhpPguAeuTT: null,
        hhpPguAeuKgoe: null,
        hhpPguAeuKgce: null,
        hhpSctuFlare: null,
        hhpSub: null,
        hhpBcc: null,
        ngToe: null,
        ngTce: null,
        ngPre: null,
        ngCracker: null,
        ngCrackerTT: null,
        ngCrackerKgoe: null,
        ngCrackerKgce: null,
        ngPguAeu: null,
        ngPguAeuTT: null,
        ngPguAeuKgoe: null,
        ngPguAeuKgce: null,
        ngSctuFlare: null,
        ngSub: null,
        ngBcc: null,
        fuelGasOffgasToe: null,
        fuelGasOffgasTce: null,
        fuelGasOffgasPre: null,
        fuelGasOffgasCracker: null,
        fuelGasOffgasCrackerTT: null,
        fuelGasOffgasCrackerKgoe: null,
        fuelGasOffgasCrackerKgce: null,
        fuelGasOffgasPguAeu: null,
        fuelGasOffgasPguAeuTT: null,
        fuelGasOffgasPguAeuKgoe: null,
        fuelGasOffgasPguAeuKgce: null,
        fuelGasOffgasSctuFlare: null,
        fuelGasOffgasSub: null,
        fuelGasOffgasBcc: null,
        shpToe: null,
        shpTce: null,
        shpPre: null,
        shpCracker: null,
        shpCrackerTT: null,
        shpCrackerKgoe: null,
        shpCrackerKgce: null,
        shpPguAeu: null,
        shpPguAeuTT: null,
        shpPguAeuKgoe: null,
        shpPguAeuKgce: null,
        shpSctuFlare: null,
        shpSub: null,
        shpBcc: null,
        hpToe: null,
        hpTce: null,
        hpPre: null,
        hpCracker: null,
        hpCrackerTT: null,
        hpCrackerKgoe: null,
        hpCrackerKgce: null,
        hpPguAeu: null,
        hpPguAeuTT: null,
        hpPguAeuKgoe: null,
        hpPguAeuKgce: null,
        hpSctuFlare: null,
        hpSub: null,
        hpBcc: null,
        mpToe: null,
        mpTce: null,
        mpPre: null,
        mpCracker: null,
        mpCrackerTT: null,
        mpCrackerKgoe: null,
        mpCrackerKgce: null,
        mpPguAeu: null,
        mpPguAeuTT: null,
        mpPguAeuKgoe: null,
        mpPguAeuKgce: null,
        mpSctuFlare: null,
        mpSub: null,
        mpBcc: null,
        lpToe: null,
        lpTce: null,
        lpPre: null,
        lpCracker: null,
        lpCrackerTT: null,
        lpCrackerKgoe: null,
        lpCrackerKgce: null,
        lpPguAeu: null,
        lpPguAeuTT: null,
        lpPguAeuKgoe: null,
        lpPguAeuKgce: null,
        lpSctuFlare: null,
        lpSub: null,
        lpBcc: null,
        electricityToe: null,
        electricityTce: null,
        electricityPre: null,
        electricityCracker: null,
        electricityCrackerTT: null,
        electricityCrackerKgoe: null,
        electricityCrackerKgce: null,
        electricityPguAeu: null,
        electricityPguAeuTT: null,
        electricityPguAeuKgoe: null,
        electricityPguAeuKgce: null,
        electricitySctuFlare: null,
        electricitySub: null,
        electricityBcc: null,
        coolingWaterToe: null,
        coolingWaterTce: null,
        coolingWaterPre: null,
        coolingWaterCracker: null,
        coolingWaterCrackerTT: null,
        coolingWaterCrackerKgoe: null,
        coolingWaterCrackerKgce: null,
        coolingWaterPguAeu: null,
        coolingWaterPguAeuTT: null,
        coolingWaterPguAeuKgoe: null,
        coolingWaterPguAeuKgce: null,
        coolingWaterSctuFlare: null,
        coolingWaterSub: null,
        coolingWaterBcc: null,
        polishedConToe: null,
        polishedConTce: null,
        polishedConPre: null,
        polishedConCracker: null,
        polishedConCrackerTT: null,
        polishedConCrackerKgoe: null,
        polishedConCrackerKgce: null,
        polishedConPguAeu: null,
        polishedConPguAeuTT: null,
        polishedConPguAeuKgoe: null,
        polishedConPguAeuKgce: null,
        polishedConSctuFlare: null,
        polishedConSub: null,
        polishedConBcc: null,
        hpBfwToe: null,
        hpBfwTce: null,
        hpBfwPre: null,
        hpBfwCracker: null,
        hpBfwCrackerTT: null,
        hpBfwCrackerKgoe: null,
        hpBfwCrackerKgce: null,
        hpBfwPguAeu: null,
        hpBfwPguAeuTT: null,
        hpBfwPguAeuKgoe: null,
        hpBfwPguAeuKgce: null,
        hpBfwSctuFlare: null,
        hpBfwSub: null,
        hpBfwBcc: null,
        prodWaterToe: null,
        prodWaterTce: null,
        prodWaterPre: null,
        prodWaterCracker: null,
        prodWaterCrackerTT: null,
        prodWaterCrackerKgoe: null,
        prodWaterCrackerKgce: null,
        prodWaterPguAeu: null,
        prodWaterPguAeuTT: null,
        prodWaterPguAeuKgoe: null,
        prodWaterPguAeuKgce: null,
        prodWaterSctuFlare: null,
        prodWaterSub: null,
        prodWaterBcc: null,
        turbineConToe: null,
        turbineConTce: null,
        turbineConPre: null,
        turbineConCracker: null,
        turbineConCrackerTT: null,
        turbineConCrackerKgoe: null,
        turbineConCrackerKgce: null,
        turbineConPguAeu: null,
        turbineConPguAeuTT: null,
        turbineConPguAeuKgoe: null,
        turbineConPguAeuKgce: null,
        turbineConSctuFlare: null,
        turbineConSub: null,
        turbineConBcc: null,
        paIaToe: null,
        paIaTce: null,
        paIaPre: null,
        paIaCracker: null,
        paIaCrackerTT: null,
        paIaCrackerKgoe: null,
        paIaCrackerKgce: null,
        paIaPguAeu: null,
        paIaPguAeuTT: null,
        paIaPguAeuKgoe: null,
        paIaPguAeuKgce: null,
        paIaSctuFlare: null,
        paIaSub: null,
        paIaBcc: null,
        n2Toe: null,
        n2Tce: null,
        n2Pre: null,
        n2Cracker: null,
        n2CrackerTT: null,
        n2CrackerKgoe: null,
        n2CrackerKgce: null,
        n2PguAeu: null,
        n2PguAeuTT: null,
        n2PguAeuKgoe: null,
        n2PguAeuKgce: null,
        n2SctuFlare: null,
        n2Sub: null,
        n2Bcc: null,
        totalToe: null,
        totalTce: null,
        totalPre: null,
        totalCracker: null,
        totalCrackerTT: null,
        totalCrackerKgoe: null,
        totalCrackerKgce: null,
        totalPguAeu: null,
        totalPguAeuTT: null,
        totalPguAeuKgoe: null,
        totalPguAeuKgce: null,
        targetToe: null,
        targetTce: null,
        targetPre: null,
        targetCracker: null,
        targetCrackerTT: null,
        targetCrackerKgoe: null,
        targetCrackerKgce: null,
        targetPguAeu: null,
        targetPguAeuTT: null,
        targetPguAeuKgoe: null,
        targetPguAeuKgce: null,
        producedToe: null,
        producedTce: null,
        producedPre: null,
        producedCracker: null,
        producedCrackerTT: null,
        producedCrackerKgoe: null,
        producedCrackerKgce: null,
        producedPguAeu: null,
        producedPguAeuTT: null,
        producedPguAeuKgoe: null,
        producedPguAeuKgce: null,
        frEoEg: null,
        loadPercentage: null,
        hsProducet: null,
        sctfStorageTotalC2: null,
        sctfStorageTk1061: null,
        sctfStorageTk1062: null,
        sctfStorageTk1063: null,
        sctfStorageTk1064: null,
        sctfStorageTk1065Off: null,
        sctfStorageTotalC3: null,
        sctfStorageTk1011: null,
        sctfStorageTk1012: null,
        sctfStorageTk1013: null,
        sctfStorageTk1014: null,
        sctfStorageTk1040Off: null,
        sctfStorageTk1020Lpg: null,
        sctfStorageTk1111C4s: null,
        sctfStorageTk1520Rpg: null,
        sctfStorageTk1350Po: null,
        sctfStorageTk1310Btx: null,
        sctfStorageTk1330Ebo: null,
        sctfStorageTk1430Lfo: null,
        sctfStorageTk1320OffBtx: null,
        sctfStorageT201Btx: null,
        sctfStorageTk1340C9: null,
        sctfStorageClt1350C9: null,
        sctfStorageTk1160Nh3: null,
        sctfStorageTk1510B: null,
        sctfStorageClt1370B: null,
        sctfStorageTk1360T: null,
        sctfStorageTk1410X: null,
        sctfStorageClt1380X: null,
        sctfStorageTk1420Dimer: null,
        sctfStorageTk1110R1: null,
        sctfStorageTk1130Ib: null,
        sctfStorageTk1150R3: null,
        sctfStorageTk1140Bd: null,
        sctfStorageTk1141Bd: null,
        sctfStorageTk1142Bd: null,
        sctfStorageTotalNap: null,
        sctfStorageCltf1621: null,
        sctfStorageCltf1622: null,
        sctfStorageCltf1623: null,
        pguToRpg: null,
        rpgToPgu2: null,
        pguRpgTH: null,
        pguRpg1: null,
        pguRpg2: null,
        pguH2: null,
        pguTotalFeed: null,
        pguOutput: null,
        pguTotalLoss: null,
        pguLossPercentage: null,
        pguFeedLoadPercentage: null,
        pguToAeu: null,
        aeuToPgu: null,
        pguAeuTH: null,
        pguBtxYeildPercentage: null,
        pguBtxProduced: null,
        pguBtxInventory: null,
        pguBtxChange: null,
        pguBtxExport: null,
        pguBtxToAeu: null,
        pguWashoilYeildPercentage: null,
        pguWashoilProduced: null,
        pguWashoilInventory: null,
        pguWashoilChange: null,
        pguWashoilExport: null,
        pguWashoilToEu: null,
        pguOffgasYeildPercentage: null,
        pguOffgasProduced: null,
        pguOffgasInventory: null,
        pguOffgasChange: null,
        pguOffgasExport: null,
        pguOffgasToEu: null,
        pguC5YeildPercentage: null,
        pguC5Produced: null,
        pguC5Inventory: null,
        pguC5Change: null,
        pguC5Export: null,
        pguC5ToAeu: null,
        pguC5ToEu: null,
        pguC5ToYuanguan: null,
        pguC9YeildPercentage: null,
        pguC9Produced: null,
        pguC9Inventory: null,
        pguC9Change: null,
        pguC9Export: null,
        pguC9ToAeu: null,
        pguC9ToRttf: null,
        pguC9ToShip: null,
        pguC9ToYfcc: null,
        aeuBenzeneYeildPercentage: null,
        aeuBenzeneProduced: null,
        aeuBenzeneInventory: null,
        aeuBenzeneChange: null,
        aeuBenzeneToShip: null,
        aeuBenzeneFrShip: null,
        aeuBenzeneToYbs: null,
        aeuBenzeneToRttf: null,
        aeuBenzeneToTrain: null,
        aeuTolueneYeildPercentage: null,
        aeuTolueneProduced: null,
        aeuTolueneInventory: null,
        aeuTolueneChange: null,
        aeuTolueneToShip: null,
        aeuTolueneFrShip: null,
        aeuTolueneToYpc: null,
        aeuTolueneFrYpc: null,
        aeuTolueneToRttf: null,
        aeuTolueneFrYbs: null,
        aeuTolueneToEu: null,
        aeuXyleneYeildPercentage: null,
        aeuXyleneProduced: null,
        aeuXyleneInventory: null,
        aeuXyleneChange: null,
        aeuXyleneToShip: null,
        aeuXyleneFrShip: null,
        aeuXyleneToYpc: null,
        aeuXyleneFrYpc: null,
        aeuXyleneToRttf: null,
        aeuC6C8NaYeildPercentage: null,
        aeuC6C8NaProduced: null,
        aeuC6C8NaInventory: null,
        aeuC6C8NaChange: null,
        aeuC6C8NaToEu: null,
        aeuC6C8NaToYpc: null,
        aeuTotalFeed: null,
        aeuOutput: null,
        aeuTotalLoss: null,
        aeuLossPercentage: null,
        aeuFeedLoadPercentage: null,
        pguAeuTotalFeed: null,
        pguAeuOutput: null,
        pguAeuTotalLoss: null,
        pguAeuLossPercentage: null,
        pguAeuFeedLoadPercentage: null
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
      },
    };
  },
  watch: {
        // 根据名称筛选部门树
        deptName(val) {
            this.$refs.tree.filter(val);
        }
   },
  created() {
    //设置表格高度对应屏幕高度
    this.$nextTick(() => {
        this.clientHeight = document.body.clientHeight -250
    });
    this.getDicts("CHEMICALS").then(response => {
      this.chemicalsOptions = response.data;
    });
    this.setMaxDate();
    this.getTreeselect();
    this.loading = false;
  },
  mixins: [echartMixins],
  methods: {
    handleSeeMonthData() {
      this.$router.push({
        path: '/production/monthData',
        query: {
          reportDate: this.queryParams.reportDate
        }
      })
    },
    // 选择文件改变
    handleChange(files, fileList) {
      this.fileList = fileList
    },
    // 移除文件
    handleRemove(file, fileList) {
      this.fileList = fileList
    },
    // 上传文件
    submitUpload() {
      console.log('---> ', this.fileList)
      this.isUploading = true
      setTimeout(() => {
        this.isUploading = false
        this.fileList = []
        this.$message({
          message: '文件上传成功！',
          type: 'success'
        });
      }, 5000)
    },
    /** 校验用户输入是否为数字 */
    isNumberInput() {
      let flag = true;
      let inputNodes = document.getElementsByClassName("el-input__inner");
      for (let i = 0; i < inputNodes.length; i++) {
        let value = inputNodes[i].value;
        if (value.indexOf("%") == -1 &&
          value != this.reportData.reportDate &&
          value != this.reportData.plantModeIs &&
          value != this.analysisQueryParams.startDate &&
          value != this.analysisQueryParams.endDate &&
          value != this.chemicalChosen
        ) {
          if (isNaN(Number(value)) == true) {
            flag = false;
          }
        }
      }
      if (flag == true) {
        return true;
      } else {
        this.$message.info("输入值不合法，必须为数值类型。");
        return false;
      }
    },
    /** 处理趋势图对话框对比指标change事件 */
    handleAddChemicals() {
      if (this.chemicalChosen != null && this.chemicalChosen != "") { // 选中对比指标
        let endDate = new Date(this.analysisQueryParams.endDate);
        let startDate = new Date(this.analysisQueryParams.startDate);
        this.analysisQueryParams.endDate = endDate.getFullYear() + "-" + Number(endDate.getMonth() + 1) + "-" + endDate.getDate();
        this.analysisQueryParams.startDate = startDate.getFullYear() + "-" + Number(startDate.getMonth() + 1) + "-" + startDate.getDate();
        this.disposeChart();
        this.clearMinMax();
        this.drawN();
      } else {  // 清空对比指标
        this.analysisQueryParams.fieldName = this.fieldNameTemp;  // 恢复当前dialog查询字段
        this.handleAnalysisQuery();
      }
    },
    handleDialogClose() {
      this.disposeChart();
      this.minY = null;
      this.maxY = null;
      this.chemicalChosen = null;
    },
    /** 销毁趋势图 */
    disposeChart() {
      this.echarts.dispose(this.chart);
    },
    /** 处理趋势图对话框开始/结束日期change事件 */
    handleAnalysisQuery() {
      if (this.chemicalChosen != null && this.chemicalChosen != "") {
        let endDate = new Date(this.analysisQueryParams.endDate);
        let startDate = new Date(this.analysisQueryParams.startDate);
        this.analysisQueryParams.endDate = endDate.getFullYear() + "-" + Number(endDate.getMonth() + 1) + "-" + endDate.getDate();
        this.analysisQueryParams.startDate = startDate.getFullYear() + "-" + Number(startDate.getMonth() + 1) + "-" + startDate.getDate();
        this.disposeChart();
        this.drawN();
        // this.analysisQueryParams.fieldName = this.chemicalChosen;
        // for (let i = 0; i < this.chemicalsOptions.length; i++) {
        //   if (this.chemicalsOptions[i].dictValue == this.chemicalChosen) {
        //     this.fieldNameTitle2 = this.chemicalsOptions[i].dictLabel;
        //   }
        // }
        // this.disposeChart();
        // this.valueList2 = [];
        // let endDate = new Date(this.analysisQueryParams.endDate);
        // let startDate = new Date(this.analysisQueryParams.startDate);
        // this.analysisQueryParams.endDate = endDate.getFullYear() + "-" + Number(endDate.getMonth() + 1) + "-" + endDate.getDate();
        // this.analysisQueryParams.startDate = startDate.getFullYear() + "-" + Number(startDate.getMonth() + 1) + "-" + startDate.getDate();
        // this.draw2(this.minY, this.maxY);
      } else {
        this.disposeChart();
        this.valueList = [];
        this.dateList = [];
        let endDate = new Date(this.analysisQueryParams.endDate);
        let startDate = new Date(this.analysisQueryParams.startDate);
        this.analysisQueryParams.endDate = endDate.getFullYear() + "-" + Number(endDate.getMonth() + 1) + "-" + endDate.getDate();
        this.analysisQueryParams.startDate = startDate.getFullYear() + "-" + Number(startDate.getMonth() + 1) + "-" + startDate.getDate();
        this.draw(this.minY, this.maxY);
      }
    },
    /** 绘制趋势图 */
    draw(minY, maxY) {
      let yValueIsNull = false;
      if (minY != null && maxY != null) {
        yValueIsNull = false;
      } else {
        yValueIsNull = true;
      }
      getAnalysisData(this.analysisQueryParams).then(response => {
        let data = response.data;
        if (yValueIsNull == false) {
          this.maxValue = maxY;
          this.minValue = minY;
          for (let i = 0; i < data.length; i++) {
            if (data[i].valueData != null) {
              if (data[i].valueData.toString().search("%") != -1) {
                this.valueList[i] = data[i].valueData.substr(0, data[i].valueData.length - 1);
              } else {
                this.valueList[i] = data[i].valueData;
              }
              this.dateList[i] = data[i].dateData;
            }
          }
          let tempValueList = [];
          let tempDateList = [];
          for (let i = 0; i < this.valueList.length; i++) {
            if (Number(this.valueList[i]) >= Number(minY) && Number(this.valueList[i]) <= Number(maxY)) {
              tempValueList.push(this.valueList[i]);
              tempDateList.push(this.dateList[i]);
            }
          }
          this.valueList = tempValueList;
          this.dateList = tempDateList;
        } else {
          this.maxValue = 0;
          this.minValue = data[0].valueData;
          for (let i = 0; i < data.length; i++) {
            if (data[i].valueData != null) {
              if (data[i].valueData.toString().search("%") != -1) {
                this.valueList[i] = data[i].valueData.substr(0, data[i].valueData.length - 1);
              } else {
                this.valueList[i] = data[i].valueData;
              }
              this.dateList[i] = data[i].dateData;
              if (data[i].valueData > this.maxValue) {
                this.maxValue = data[i].valueData;
              }
              if (data[i].valueData < this.minValue) {
                this.minValue = data[i].valueData;
              }
            }
          }
        }
        this.chart = this.echarts.init(document.getElementById("trendChart"));
        let option = {
          tooltip: {
            trigger: "item"
          },
          grid: {
            left: 90,
            right: 80,
          },
          xAxis: {
            data: this.dateList,
          },
          yAxis: {
            max: this.maxValue,
            min: this.minValue,
            min: function(value) {  // 取最小值向下取整为最小刻度
              return Math.floor(value.min)
            },
            max: function(value) {  // 取最大值向上取整为最大刻度
              return  Math.ceil(value.max)
            },
            scale: true,
            type: 'value',
          },
          series: [
            {
              name: this.fieldNameTitle,
              label: {
                show: true,
                position: 'top'
              },
              data: this.valueList,
              type: 'line',
              smooth: true,
              symbolSize: 15,
              color:"#5470c6",
              lineStyle: {
                width: 6
              }
            }
          ],
        };
        this.chart.setOption(option);
      });
    },
    /** 绘制包含对比指标的趋势图 */
    draw2(minY, maxY) {
      getAnalysisData(this.analysisQueryParams).then(response => {
        let data = response.data;
        this.maxValue2 = 0;
        this.minValue2 = data[0].valueData;
        for (let i = 0; i < data.length; i++) {
          if (data[i].valueData != null) {
            if (data[i].valueData.toString().search("%") != -1) {
              this.valueList2[i] = data[i].valueData.substr(0, data[i].valueData.length - 1);
            } else {
              this.valueList2[i] = data[i].valueData;
            }
            if (data[i].valueData > this.maxValue2) {
              this.maxValue2 = data[i].valueData;
            }
            if (data[i].valueData < this.minValue2) {
              this.minValue2 = data[i].valueData;
            }
          }
        }
        this.chart = this.echarts.init(document.getElementById("trendChart"));
        let option = {
          tooltip: {
            trigger: "item"
          },
          grid: {
            // 左侧
            x: '10%',
            // 上部
            // y: 25,
            // 右侧
            x2: '40%'
            // 下部
            // y2: 35
          },
          xAxis: {
            data: this.dateList,
          },
          yAxis: [
            {
              name: this.fieldNameTitle,
              nameTextStyle: {
                fontWeight: 'bold',
                color:"#5470c6",
              },
              position: 'left',
              axisLine: {
                show: 'true',
              },
              max: this.maxValue,
              min: this.minValue,
              min: function(value) {  // 取最小值向下取整为最小刻度
                return Math.floor(value.min)
              },
              max: function(value) {  // 取最大值向上取整为最大刻度
                return  Math.ceil(value.max)
              },
              scale: true,
              type: 'value',
            },
            {
              name: this.fieldNameTitle2,
              nameTextStyle: {
                fontWeight: 'bold',
                color:"#91cc75",
              },
              position: 'right',
              axisLine: {
                show: 'true',
              },
              max: this.maxValue2,
              min: this.minValue2,
              min: function(value) {  // 取最小值向下取整为最小刻度
                return Math.floor(value.min)
              },
              max: function(value) {  // 取最大值向上取整为最大刻度
                return  Math.ceil(value.max)
              },
              scale: true,
              type: 'value',
            },
            {
              name: this.fieldNameTitle2,
              nameTextStyle: {
                fontWeight: 'bold',
                color:"#91cc75",
              },
              position: 'right',
              axisLine: {
                show: 'true',
              },
              max: this.maxValue2,
              min: this.minValue2,
              min: function(value) {  // 取最小值向下取整为最小刻度
                return Math.floor(value.min)
              },
              max: function(value) {  // 取最大值向上取整为最大刻度
                return  Math.ceil(value.max)
              },
              scale: true,
              type: 'value',
              offset: 100,
            },
            {
              name: this.fieldNameTitle2,
              nameTextStyle: {
                fontWeight: 'bold',
                color:"#91cc75",
              },
              position: 'right',
              axisLine: {
                show: 'true',
              },
              max: this.maxValue2,
              min: this.minValue2,
              min: function(value) {  // 取最小值向下取整为最小刻度
                return Math.floor(value.min)
              },
              max: function(value) {  // 取最大值向上取整为最大刻度
                return  Math.ceil(value.max)
              },
              scale: true,
              type: 'value',
              offset: 200,
            },
            {
              name: this.fieldNameTitle2,
              nameTextStyle: {
                fontWeight: 'bold',
                color:"#91cc75",
              },
              position: 'right',
              axisLine: {
                show: 'true',
              },
              max: this.maxValue2,
              min: this.minValue2,
              min: function(value) {  // 取最小值向下取整为最小刻度
                return Math.floor(value.min)
              },
              max: function(value) {  // 取最大值向上取整为最大刻度
                return  Math.ceil(value.max)
              },
              scale: true,
              type: 'value',
              offset: 300,
            },
          ],
          series: [
            {
              name: this.fieldNameTitle,
              label: {
                show: true,
                position: 'top'
              },
              data: this.valueList,
              type: 'line',
              smooth: true,
              symbolSize: 15,
              color:"#5470c6",
              lineStyle: {
                width: 6
              },
              yAxisIndex: 0
            },
            {
              name: this.fieldNameTitle2,
              label: {
                show: true,
                position: 'top'
              },
              data: this.valueList2,
              type: 'line',
              smooth: true,
              symbolSize: 15,
              color:"#91cc75",
              lineStyle: {
                width: 6
              },
              yAxisIndex: 1
            },
            {
              name: this.fieldNameTitle2,
              label: {
                show: true,
                position: 'top'
              },
              data: this.valueList2,
              type: 'line',
              smooth: true,
              symbolSize: 15,
              color:"#91cc75",
              lineStyle: {
                width: 6
              },
              yAxisIndex: 2
            },
            {
              name: this.fieldNameTitle2,
              label: {
                show: true,
                position: 'top'
              },
              data: this.valueList2,
              type: 'line',
              smooth: true,
              symbolSize: 15,
              color:"#91cc75",
              lineStyle: {
                width: 6
              },
              yAxisIndex: 3
            },
            {
              name: this.fieldNameTitle2,
              label: {
                show: true,
                position: 'top'
              },
              data: this.valueList2,
              type: 'line',
              smooth: true,
              symbolSize: 15,
              color:"#91cc75",
              lineStyle: {
                width: 6
              },
              yAxisIndex: 4
            },
          ],
        };
        this.chart.setOption(option);
      });
    },
    /** 绘制包含n个对比指标的趋势图 */
    drawN() {
      let colors = ["#5470c6","#91cc75","#fac858","#ee6666","#73c0de","#3ba272","#fc8452","#9a60b4","#ea7ccc"];

      this.chart = this.echarts.init(document.getElementById("trendChart"));

      let option = {
        tooltip: {
          trigger: "item"
        },
        grid: {
          x: '5%',
          x2: '30%'
        },
        xAxis: {
          data: this.dateList,
        },
      };

      let yAxis = [];
      yAxis.push({
        max: this.maxValue,
        min: this.minValue,
        min: function(value) {  // 取最小值向下取整为最小刻度
          return Math.floor(value.min)
        },
        max: function(value) {  // 取最大值向上取整为最大刻度
          return  Math.ceil(value.max)
        },
        name: this.fieldNameTitle,
        nameTextStyle: {
          fontWeight: 'bold',
          color: colors[0],
        },
        position: 'left',
        axisLine: {
          show: 'true',
          lineStyle: {
            color: colors[0],
            width: 2,
          }
        },
        scale: true,
        type: 'value',
      });

      let series = [];
      series.push({
        name: this.fieldNameTitle,
        label: {
          position: 'top'
        },
        data: this.valueList,
        type: 'line',
        smooth: true,
        symbolSize: 10,
        color: colors[0],
        lineStyle: {
          width: 4
        },
        yAxisIndex: 0
      });

      this.clearMinMax();

      for (let i = 0; i < this.chemicalChosen.length; i++) {
        this.analysisQueryParams.fieldName = this.chemicalChosen[i];
        let minY = null;
        let maxY = null;
        getAnalysisData(this.analysisQueryParams).then(response => {
          let dictLabel = "";
          for (let j = 0; j < this.chemicalsOptions.length; j++) {
            if (this.chemicalsOptions[j].dictValue == this.chemicalChosen[i]) {
              dictLabel = this.chemicalsOptions[j].dictLabel;
            }
          }

          if (i == 0) {
            this.showY1 = true;
            this.minYLabel1 = dictLabel + "(min)";
            this.maxYLabel1 = dictLabel + "(max)";
            minY = this.minY1;
            maxY = this.maxY1;
          } else if (i == 1) {
            this.showY2 = true;
            this.minYLabel2 = dictLabel + "(min)";
            this.maxYLabel2 = dictLabel + "(max)";
            minY = this.minY2;
            maxY = this.maxY2;
          } else if (i == 2) {
            this.showY3 = true;
            this.minYLabel3 = dictLabel + "(min)";
            this.maxYLabel3 = dictLabel + "(max)";
            minY = this.minY3;
            maxY = this.maxY3;
          } else if (i == 3) {
            this.showY4 = true;
            this.minYLabel4 = dictLabel + "(min)";
            this.maxYLabel4 = dictLabel + "(max)";
            minY = this.minY4;
            maxY = this.maxY4;
          } else if (i == 4) {
            this.showY5 = true;
            this.minYLabel5 = dictLabel + "(min)";
            this.maxYLabel5 = dictLabel + "(max)";
            minY = this.minY5;
            maxY = this.maxY5;
          }

          let data = response.data;
          let valueList = [];
          for (let i = 0; i < data.length; i++) {
            if (data[i].valueData != null) {
              if (data[i].valueData.toString().search("%") != -1) {
                valueList[i] = data[i].valueData.substr(0, data[i].valueData.length - 1);
              } else {
                valueList[i] = data[i].valueData;
              }
            }
          }

          if (minY != null && maxY != null) {
            let tempValueList = [];
            // let tempDateList = [];
            for (let i = 0; i < valueList.length; i++) {
              if (Number(valueList[i]) >= Number(minY) && Number(valueList[i]) <= Number(maxY)) {
                tempValueList.push(valueList[i]);
                // tempDateList.push(this.dateList[i]);
              } else {
                tempValueList.push(null);
              }
            }
            valueList = tempValueList;
            // this.dateList = tempDateList;
            console.log(valueList)
          } else {
            maxY = 0;
            minY = data[0].valueData;
            for (let i = 0; i < data.length; i++) {
              if (data[i].valueData != null) {
                if (data[i].valueData.toString().search("%") != -1) {
                  valueList[i] = data[i].valueData.substr(0, data[i].valueData.length - 1);
                } else {
                  valueList[i] = data[i].valueData;
                }
                // this.dateList[i] = data[i].dateData;
                if (data[i].valueData > this.maxY) {
                  maxY = data[i].valueData;
                }
                if (data[i].valueData < this.minY) {
                  minY = data[i].valueData;
                }
              }
            }
          }

          console.log(maxY)
          console.log(minY)

          series.push({
            name: dictLabel,
            label: {
              position: 'top'
            },
            data: valueList,
            type: 'line',
            smooth: true,
            symbolSize: 10,
            color: colors[i + 1],
            lineStyle: {
              width: 4
            },
            yAxisIndex: i + 1,
          });

          yAxis.push({
            max: maxY,
            min: minY,
            min: function(value) {  // 取最小值向下取整为最小刻度
              return Math.floor(value.min)
            },
            max: function(value) {  // 取最大值向上取整为最大刻度
              return  Math.ceil(value.max)
            },
            name: dictLabel,
            nameRotate: 20,
            nameTextStyle: {
              fontWeight: 'bold',
              color: colors[i + 1],
            },
            position: 'right',
            axisLine: {
              show: 'true',
              lineStyle: {
                color: colors[i + 1],
                width: 2,
              }
            },
            scale: true,
            type: 'value',
            offset: i * 70,
          });


        });
      }

      let _this = this;
      setTimeout(function () {
        option.yAxis = yAxis;
        option.series = series;
        _this.chart.setOption(option);
      }, 3000);

    },
    clearMinMax() {
      this.showY1 = false;
      this.showY2 = false;
      this.showY3 = false;
      this.showY4 = false;
      this.showY5 = false;
      this.minYLabel1 = null;
      this.maxYLabel1 = null;
      this.minYLabel2 = null;
      this.maxYLabel2 = null;
      this.minYLabel3 = null;
      this.maxYLabel3 = null;
      this.minYLabel4 = null;
      this.maxYLabel4 = null;
      this.minYLabel5 = null;
      this.maxYLabel5 = null;
    },
    /** 打开趋势图对话框 */
    openDialog(fieldName, fieldNameTitle) {
      this.clearMinMax();
      this.minYLabel = fieldNameTitle + "(min)";
      this.maxYLabel = fieldNameTitle + "(max)";
      if (this.updating == true) {
        return false;
      }
      // 设置开始日期和结束日期，默认范围为一个月
      let today = new Date(this.reportData.reportDate);
      let monthBefore = new Date();
      if (today.getMonth() == 2 && today.getDate() >= 28) { // 三月的28-31号：年不变，日=28
        monthBefore.setDate(28);
        monthBefore.setFullYear(today.getFullYear());
      } else if (today.getMonth() == 0) { // 一月：日不变，年-1
        monthBefore.setDate(today.getDate());
        monthBefore.setFullYear(today.getFullYear() - 1);
      } else {  // 其它月份：年、日不变
        monthBefore.setDate(today.getDate());
        monthBefore.setFullYear(today.getFullYear());
      }
      monthBefore.setMonth(today.getMonth()-1);
      this.analysisQueryParams.endDate = today.getFullYear() + "-" + Number(today.getMonth() + 1) + "-" + today.getDate();
      this.analysisQueryParams.startDate = monthBefore.getFullYear() + "-" + Number(monthBefore.getMonth() + 1) + "-" + monthBefore.getDate();
      this.analysisQueryParams.fieldName = fieldName;
      this.fieldNameTemp = fieldName;
      this.analysis.title = fieldNameTitle + "趋势分析";
      this.fieldNameTitle = fieldNameTitle;
      this.analysis.open = true;
      this.valueList = [];
      this.dateList = [];
      this.draw();
    },
    /** 编辑按钮操作 */
    handleUpdate(row) {
      this.updating = true;
    },
    /** 确定修改按钮操作 */
    handleConfirmUpdate(row) {
      if (this.isNumberInput() == false) {
        return false;
      }
      this.updating = false;
      updateReport(this.reportData).then(response => {
        if (response.code == 200) {
          this.$message.success("修改成功");
        } else {
          this.$message.error("未知错误，请联系管理员。");
        }
        this.getReport();
      });
    },
    /** 取消修改按钮操作 */
    handleCancelUpdate(row) {
      this.updating = false;
      this.getReport();
    },
    /** 设置最近的日期 */
    setMaxDate() {
      getReportByMaxDate().then(response => {
        if (null != response.data) {
          this.queryParams.reportDate = response.data.reportDate;
          this.getReport();
        } else {
          this.$message.info("未导入生产日报数据");
        }
      });
    },
    /** 查询生产报告 */
    getReport() {
      this.loading = true;
      listReport(this.queryParams).then(response => {
        if (response.rows.length != 0) {
          this.lastSelectedDate = this.queryParams.reportDate;
          this.reportData = response.rows[0];
          this.loading = false;
        } else {
          let str = "未查询到" + this.queryParams.reportDate + "的日报，请修改搜索日期或手动导入数据。";
          this.queryParams.reportDate = this.lastSelectedDate;
          this.$message.warning(str);
          this.loading = false;
        }
      });
    },
    /** 查询每日生产报告列表 */
    getList() {
      this.loading = true;
      listReport(this.queryParams).then(response => {
        this.reportList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
     /** 查询部门下拉树结构 */
     getTreeselect() {
          treeselect().then(response => {
              this.deptOptions = response.data;
          });
     },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.getReport();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加每日生产报告";
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateReport(this.form).then(response => {
              this.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addReport(this.form).then(response => {
              this.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$confirm('是否确认删除?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return delReport(ids);
        }).then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        })
    },
    /** 导出按钮操作 */
    handleExport() {
      const queryParams = this.queryParams;
      this.$confirm('是否确认导出所有每日生产报告数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return exportReport(queryParams);
        }).then(response => {
          this.download(response.msg);
        })
    },
    /** 导入按钮操作 */
    handleImport() {
      this.upload.title = "生产日报导入";
      this.upload.open = true;
    },
    /** 下载模板操作 */
    importTemplate() {
      importTemplate().then(response => {
        this.download(response.msg);
      });
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.upload.open = false;
      this.upload.isUploading = false;
      if (file == fileList[fileList.length - 1]) {
        this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
        // 清空上传文件列表，否则影响上传文件数限制判断
        this.$refs.upload.clearFiles();
      }
      this.getReport();
    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit();
    }
  }
};
</script>

<style scoped>
  .no-padding{
    padding:0px;
  }
  .triangle-top{
    height:8px;
    width:8px;


    border-color:transparent transparent black transparent;
    border-style:solid;
    border-width:8px;
    display:inline-block;
  }
  .triangle-right{
    height:8px;
    width:8px;
    border-color:transparent transparent transparent black;
    border-style:solid;
    border-width:8px;
    display:inline-block;
    float:right;
    /*position:relative;*/
    /*right:-8px;*/
  }
  .triangle-bottom{
    height:8px;
    width:8px;
    border-color:black transparent transparent transparent;
    border-style:solid;
    border-width:8px;
    display:inline-block;
  }
  .triangle-left{
    height:8px;
    width:8px;
    border-color:transparent black transparent transparent;
    border-style:solid;
    border-width:8px;
    display:inline-block;
  }
  table{
    border-width: 0px;
    border-spacing: 0px;
  }
  td{
    padding: 4px;
    white-space: nowrap;
  }
  .no-border{
    border: 0px;
  }
  .solid-line-top{
    border-top: 3px solid;
  }
  .solid-line-bottom{
    border-bottom: 3px solid;
  }
  .solid-line-left{
    border-left: 3px solid;
  }
  .solid-line-right{
    border-right: 3px solid;
  }
  .bg-yellow{
    background-color: #FFFF00;
  }
  .bg-yellow-light{
    background-color: #FCFEBA;
  }
  .bg-blue{
    background-color: #00FFFF;
  }
  .bg-blue-light{
    background-color: #CCFFFF;
  }
  .bg-blue-dark{
    background-color: #00B0F0;
  }
  .bg-blue-green-neon{
    background-color: #00FFCC;
  }
  .bg-green{
    background-color: #92D050;
  }
  .bg-green-neon{
    background-color: #00FF00;
  }
  .bg-green-blue-neon{
    background-color: #00FF99;
  }
  .bg-orange{
    background-color: #FFC000;
  }
  .bg-purple{
    background-color: #CCC0DA;
  }
  .bg-purple-light{
    background-color: #CCECFF;
  }
  .bg-grey-light{
    background-color: #EBF1DE;
  }
  .ft-red{
    color: red;
  }
  .ft-blue{
    color: blue;
  }
</style>
