<template>
  <div>
    <div class="title">
      <el-select
        v-model="Singlevalue"
        collapse-tags
        :placeholder="$t('monitor.TodayEnergy')"
        popper-class="custom-header"
        :max-collapse-tags="1"
        class="Space_content"
        size="large"
        @change="postemsDevice"
      >
        <el-option v-for="(item, index) in cities" :key="index" :label="item.stationName" :value="item.id" />
        <template #prefix>
          {{ (cities.find(s => s.id === Singlevalue) || {}).stationName }}
        </template>
      </el-select>
      <div class="title_"></div>
      <el-select
        v-model="emsDeviceId"
        collapse-tags
        :placeholder="$t('monitor.selectId')"
        popper-class="custom-header"
        :max-collapse-tags="1"
        class="Space_content"
        size="large"
        @change="getstationrealtime"
      >
        <template #prefix>
          {{ (emsDevice.find(s => s.id === emsDeviceId) || {}).id }}
        </template>
        <el-option v-for="item in emsDevice" :key="item.id" :label="item.emsDeviceId" :value="item.id" />
      </el-select>
    </div>

    <div class="message-empty" v-if="!deviceList[activeName].devices">
      <img style="width: 300px; margin-top: 400px" src="@/assets/images/notData.png" alt="notData" />
      <div>{{ $t("monitor.noData") }}</div>
    </div>
    <div class="equipment">
      <el-card>
        <el-tabs v-model="activeName" class="demo-tabs" @tab-change="handletabs">
          <el-tab-pane v-for="(item, index) in deviceList" :key="index" :label="item.name" :name="index">
            <div class="demo_div">
              <div v-for="(items, indexs) in item.devices" :key="indexs">
                <div :class="devicesClickindex == indexs ? 'demo_tabsccc' : 'demo_tabs'" @click="devicesClick(indexs, items.id)">
                  {{ items.deviceName }}
                  <!-- 储能变流器 -->
                  <!-- 电池 -->
                  <!--  系统-->
                  <!--  液冷-->
                </div>
              </div>
            </div>
          </el-tab-pane>
        </el-tabs>

        <div class="equipmentdiv" v-if="deviceType == 1">
          <div class="equipmenttime">{{ $t("monitor.lastUpdate") }}：{{ pcslist.ts }}</div>
          <div style="height: 33px"></div>
          <div>{{ $t("monitor.DeviceStatus") }}</div>
          <div class="equipmentdevice">
            <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="pcslist.sysStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">{{ $t("monitor.Running") }}</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1red">{{ $t("monitor.Stopped") }}</div>
                </div>
                <div class="equipment2">{{ $t("monitor.OperationStatus") }}</div>
              </div>
            </el-card>
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="pcslist.workStatus == 2">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">运行</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">工作状态</div>
              </div>
            </el-card> -->
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="pcslist.gridStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">运行</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">并网状态</div>
              </div>
            </el-card> -->
            <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="pcslist.faultStatus == 0">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">{{ $t("monitor.Normal") }}</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment12">{{ $t("monitor.Fault") }}</div>
                </div>
                <div class="equipment2">{{ $t("monitor.FaultDetails") }}</div>
              </div>
            </el-card>
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="pcslist.controlMode == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">运行</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">控制模式</div>
              </div>
            </el-card> -->
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="pcslist.emsCommStatus == 'GOOD'">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">正常</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1red">失败</div>
                </div>
                <div class="equipment2">与EMS通信</div>
              </div>
            </el-card> -->
          </div>
          <div class="equipmentdata">{{ $t("monitor.DeviceMetrics") }}</div>
          <!--  -->
          <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.DailyCharge") }}</div>
              <div>{{ pcslist.todayAcChargeKwh ?? "-" }} kWh</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.DailyDischarge") }}</div>
              <div>{{ pcslist.todayAcDischargeKwh ?? "-" }} kWh</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.TotalCharged") }}</div>
              <div>{{ (pcslist.totalAcChargeKwh * 1).toFixed(2) ?? "-" }} kWh</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">{{ $t("monitor.TotalDischarged") }}</div>
              <!-- <div>{{ pcslist.totalAcActivePower ?? "-" }} kW</div> -->
              <div>{{ pcslist.totalAcDischargeKwh ?? "-" }} kWh</div>
            </div>
          </div>
          <!-- 1 -->
          <div class="equipmentdata_equipment">
            <!-- <div class="equipmentdata_div">
              <div class="equipment_title">当日充电量</div>
              <div>{{ pcslist.todayAcChargeKwh ?? "-" }} kWh</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">当日放电量</div>
              <div>{{ pcslist.todayAcDischargeKwh ?? "-" }} kWh</div>
            </div> -->
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.ACFrequency") }}</div>
              <div>{{ (pcslist.acFrequency * 1).toFixed(2) ?? "-" }} Hz</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">{{ $t("monitor.TotalACActivePower") }}</div>
              <div>{{ pcslist.totalAcActivePower ?? "-" }} kW</div>
              <!-- <div>{{ pcslist.totalAcPowerFactor ?? "-" }} kW</div> -->
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.TotalACReactivePower") }}</div>
              <div>{{ pcslist.totalAcReactivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.TotalACApparentPower") }}</div>
              <div>{{ pcslist.totalAcApparentPower ?? "-" }} kW</div>
            </div>
          </div>
          <!-- 2 -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">总交流无功功率</div>
              <div>{{ pcslist.totalAcReactivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">总交流视在功率</div>
              <div>{{ pcslist.totalAcApparentPower ?? "-" }} kW</div>
            </div>

            <div class="equipmentdata_div4">
              <div class="equipment_title">A相有功功率</div>
              <div>{{ pcslist.aphaseActivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">B相有功功率</div>
              <div>{{ pcslist.bphaseActivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">C相有功功率</div>
              <div>{{ pcslist.cphaseActivePower ?? "-" }} kW</div>
            </div>
          </div> -->
          <!-- 3  -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">A相无功功率</div>
              <div>{{ pcslist.aphaseReactivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">B相无功功率</div>
              <div>{{ pcslist.bphaseReactivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">C相无功功率</div>
              <div>{{ pcslist.cphaseReactivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">A相视在功率</div>
              <div>{{ pcslist.aphaseApparentPower ?? "-" }} kVA</div>
            </div>
          </div> -->
          <!-- 4  -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">B相视在功率</div>
              <div>{{ pcslist.bphaseApparentPower ?? "-" }} kVA</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">C相视在功率</div>
              <div>{{ pcslist.cphaseApparentPower ?? "-" }} kVA</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">AB电压</div>
              <div>{{ (pcslist.acAbVolt * 1).toFixed(2) ?? "-" }} V</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">BC电压</div>
              <div>{{ (pcslist.acBcVolt * 1).toFixed(2) ?? "-" }} V</div>
            </div>
          </div> -->
          <!-- 5  -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">CA电压</div>
              <div>{{ (pcslist.acCaVolt * 1).toFixed(2) ?? "-" }} V</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">AB电流</div>
              <div>{{ (pcslist.acAbCurrent * 1).toFixed(2) ?? "-" }} A</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">BC电流</div>
              <div>{{ (pcslist.acBcCurrent * 1).toFixed(2) ?? "-" }} A</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">CA电流</div>
              <div>{{ (pcslist.acCaCurrent * 1).toFixed(2) ?? "-" }} A</div>
            </div>
          </div> -->
          <!-- 6 -->
          <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <!-- <div class="equipment_title">总交流功率因数</div> -->
              <div class="equipment_title">{{ $t("monitor.ACCurrent") }}</div>
              <!-- <div>{{ pcslist.aphaseActivePower ?? "-" }}A</div> -->
              <div>{{ (pcslist.acAbCurrent * 1).toFixed(2) ?? "-" }}A</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.PhaseAVoltage") }}</div>
              <div>{{ (pcslist.acAphaseVolt * 1).toFixed(2) ?? "-" }} V</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">{{ $t("monitor.PhaseBVoltage") }}</div>
              <div>{{ (pcslist.acBphaseVolt * 1).toFixed(2) ?? "-" }} V</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.PhaseCVoltage") }}</div>
              <div>{{ (pcslist.acCphaseVolt * 1).toFixed(2) ?? "-" }} V</div>
            </div>
            <!-- <div class="equipmentdata_div">
              <div class="equipment_title">A相电流</div>
              <div>{{ (pcslist.acAphaseCurrent * 1).toFixed(2) ?? "-" }} A</div>
            </div> -->
          </div>
          <!-- 7 -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">B相电流</div>
              <div>{{ (pcslist.acBphaseCurrent * 1).toFixed(2) ?? "-" }} A</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">C相电流</div>
              <div>{{ (pcslist.acCphaseCurrent * 1).toFixed(2) ?? "-" }} A</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">PCS模块温度</div>
              <div>{{ pcslist.moduleTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">PCS环境温度</div>
              <div>{{ pcslist.envTempr ?? "-" }} ℃</div>
            </div>
          </div> -->
          <!-- 8 -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">PCS散热器温度</div>
              <div>{{ pcslist.radiatorTemp ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">A1模块温度</div>
              <div>{{ pcslist.aphaseIgbtMaxTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">B1模块温度</div>
              <div>{{ pcslist.bphaseIgbtMaxTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">C1模块温度</div>
              <div>{{ pcslist.cphaseIgbtMaxTempr ?? "-" }} ℃</div>
            </div>
          </div> -->
          <!-- 9 -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">A2模块温度</div>
              <div>{{ pcslist.aphaseIgbtMinTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">B2模块温度</div>
              <div>{{ pcslist.bphaseIgbtMinTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">C2模块温度</div>
              <div>{{ pcslist.cphaseIgbtMaxTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">进风口温度</div>
              <div>{{ pcslist.airInletTemp ?? "-" }} ℃</div>
            </div>
          </div> -->
          <!-- 10 -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">出风口温度</div>
              <div>{{ pcslist.airOutletTemp ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div1"></div>
          </div> -->
          <div class="equipmentdata">{{ $t("monitor.DeviceErrorCode") }}</div>
          <!-- faultStatusWordList -->
          <div class="equipmentdata_data">
            <div class="equipmentdata_div2" v-for="(item, index) in pcslist.faultStatusWordList" :key="index">
              <div class="equipment_title">{{ $t("monitor.FaultStatusWord") }}</div>
              <div>{{ item }}</div>
            </div>
          </div>

          <div class="equipmentdata">{{ $t("monitor.BranchData") }}</div>

          <el-table :data="pcslist.pcsBranches" style="width: 100%" border :scrollbar-always-on="true">
            <!-- <el-table-column type="index" label="支路" width="60" /> -->
            <el-table-column type="index" :index="indexMethod" :label="$t('monitor.Branch')" align="center" width="160" />
            <el-table-column prop="dcPower" :label="$t('monitor.DCPower') + '(kW)'" align="center" />
            <el-table-column prop="dcVolt" :label="$t('monitor.DCVoltage') + '(V)'" align="center" />
            <el-table-column prop="dcCurrent" :label="$t('monitor.DCCurrent') + '(A)'" align="center" />
          </el-table>
        </div>
        <div class="equipmentdiv" v-if="deviceType == 2">
          <div class="equipmenttime">{{ $t("monitor.lastUpdate") }}：{{ datalist.ts }}</div>
          <div style="height: 33px"></div>
          <div>{{ $t("monitor.DeviceStatus") }}</div>
          <div class="equipmentdevice">
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="datalist.emsCommStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">运行</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1red">停止</div>
                </div>
                <div class="equipment2">运行状态</div>
              </div>
            </el-card> -->
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="pcslist.emsCommStatus == 0">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">正常</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1red">故障</div>
                </div>
                <div class="equipment2">工作状态</div>
              </div>
            </el-card> -->
            <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="pcslist.emsCommStatus == 0">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">{{ $t("monitor.Normal") }}</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1red">{{ $t("monitor.Fault") }}</div>
                </div>
                <div class="equipment2">{{ $t("monitor.FaultDetails") }}</div>
              </div>
            </el-card>
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="pcslist.emsCommStatus == 'GOOD'">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">正常</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1red">失败</div>
                </div>
                <div class="equipment2">与EMS通信</div>
              </div>
            </el-card> -->
          </div>
          <div class="equipmentdata">{{ $t("monitor.DeviceMetrics") }}</div>
          <!--  -->
          <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.totalActive") }}</div>
              <div>{{ datalist.totalActivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.reactive") }}</div>
              <div>{{ datalist.totalReactivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.apparent") }}</div>
              <div>{{ datalist.aphaseApparentPower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">{{ $t("monitor.powerFactor") }}</div>
              <div>{{ datalist.totalAcPowerFactor ?? "-" }}</div>
            </div>
          </div>
          <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.phaseA") }}</div>
              <div>{{ datalist.aphaseActivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.phaseB") }}</div>
              <div>{{ datalist.bphaseActivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.phaseC") }}</div>
              <div>{{ datalist.cphaseActivePower ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_divobx"></div>
            <!-- <div class="equipmentdata_div4">
              <div class="equipment_title">电流互感器变比</div>
              <div>-</div>
            </div> -->
          </div>
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">电压互感器变比</div>
              <div>-</div>
            </div>
          </div> -->
          <div class="equipmentdata">{{ $t("monitor.EnergyData") }}</div>
          <div class="eltable">
            <el-table :data="Electricitymeterlist" style="width: 100%" border>
              <el-table-column prop="type" :label="$t('monitor.EnergyData')" width="180" />
              <el-table-column prop="total" label="$t('monitor.Total')" width="180" />
              <el-table-column prop="tip" label="$t('monitor.Peak')" />
              <el-table-column prop="peak" label="$t('monitor.Shoulder')" />
              <el-table-column prop="flat" label="$t('monitor.Offpeak')" />
              <el-table-column prop="valley" label="$t('monitor.Valley')" />
            </el-table>
          </div>

          <!--  -->
        </div>
        <div class="equipmentdiv" v-if="deviceType == 3">
          <div class="equipmenttime">{{ $t("monitor.lastUpdate") }}：{{ BMSlist.ts }}</div>
          <div style="height: 33px"></div>
          <div>{{ $t("monitor.DeviceStatus") }}</div>
          <div class="equipmentdevice">
            <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="BMSlist.workStatus == 0">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">{{ $t("monitor.Idle") }}</div>
                </div>
                <div class="equipmentname" v-if="BMSlist.workStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">{{ $t("monitor.Charging") }}</div>
                </div>
                <div class="equipmentname" v-if="BMSlist.workStatus == 2">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">{{ $t("monitor.Discharging") }}</div>
                </div>
                <div class="equipmentname" v-if="BMSlist.workStatus == 3">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">{{ $t("monitor.FullyCharged") }}</div>
                </div>
                <div class="equipmentname" v-if="BMSlist.workStatus == 4">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">{{ $t("monitor.FullyDischarged") }}</div>
                </div>
                <div class="equipmentname" v-if="BMSlist.workStatus == 5">
                  <div class="equipmentborderif"></div>
                  <div class="equipment1red">{{ $t("monitor.Fault") }}</div>
                </div>
                <div class="equipment2">{{ $t("monitor.DischargeStatus") }}</div>
              </div>
            </el-card>
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="BMSlist.batteryStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">正常</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">堆状态</div>
              </div>
            </el-card> -->
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="BMSlist.pcsCommStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">正常</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">与PCS通信</div>
              </div>
            </el-card> -->
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="BMSlist.emsCommStatus == 'GOOD'">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">正常</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1red">失败</div>
                </div>
                <div class="equipment2">与EMS通信</div>
              </div>
            </el-card> -->
          </div>

          <div class="equipmentdata">{{ $t("monitor.DeviceStatus") }}</div>
          <!-- 1 -->
          <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.TotalVoltage") }}</div>
              <div>{{ (BMSlist.tv * 1).toFixed(1) ?? "-" }} V</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.TotalCurrent") }}</div>
              <div>{{ (BMSlist.tc * 1).toFixed(1) ?? "-" }} A</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">SOC</div>
              <div>{{ (BMSlist.soc * 1).toFixed(1) ?? "-" }} %</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">SOH</div>
              <div>{{ (BMSlist.soh * 1).toFixed(1) ?? "-" }} %</div>
            </div>
          </div>
          <!-- 2 -->
          <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.ChargePowerLimit") }}</div>
              <div>{{ (BMSlist.rechargeablePower * 1).toFixed(1) ?? "-" }} kW</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.DischargePowerLimit") }}</div>
              <div>{{ (BMSlist.dischargeablePower * 1).toFixed(1) ?? "-" }} kW</div>
            </div>

            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.AvgCellTemp") }}</div>
              <div>{{ (BMSlist.avgCellTempr * 1).toFixed(1) ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.AvgCellVoltage") }}</div>
              <div>{{ (BMSlist.avgCellVoltage * 1).toFixed(1) ?? "-" }} V</div>
            </div>
          </div>
          <!-- 3 -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">绝缘值</div>
              <div>{{ BMSlist.insulationResistance ?? "-" }} kΩ</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">正极绝缘值</div>
              <div>{{ BMSlist.posInsulationResistance ?? "-" }} kΩ</div>
            </div>
          </div> -->
          <!-- 4 -->
          <div class="equipmentdata_equipment">
            <!-- <div class="equipmentdata_div">
              <div class="equipment_title">可充电量</div>
              <div>{{ BMSlist.rechargeableKwh ?? "-" }} kWh</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">可放电量</div>
              <div>{{ BMSlist.dischargeableKwh ?? "-" }} kWh</div>
            </div> -->
            <!-- <div class="equipmentdata_div">
              <div class="equipment_title">负极绝缘值</div>
              <div>{{ BMSlist.negInsulationResistance ?? "-" }} kΩ</div>
            </div> -->
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.MaxCellTemp") }}</div>
              <div>{{ (BMSlist.maxCellTempr * 1).toFixed(3) ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.MinCellTemp") }}</div>
              <div>{{ (BMSlist.minCellTempr * 1).toFixed(3) ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">{{ $t("monitor.MaxCellVoltage") }}</div>
              <div>{{ (BMSlist.maxCellVoltage * 1).toFixed(3) ?? "-" }} V</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.MinCellVoltage") }}</div>
              <div>{{ (BMSlist.minCellVoltage * 1).toFixed(3) ?? "-" }} V</div>
            </div>
          </div>
          <!--  -->
          <div class="equipmentdata_equipment"></div>
          <!--  -->
        </div>
        <div class="equipmentdiv" v-if="deviceType == 4">
          <div class="equipmenttime">{{ $t("monitor.lastUpdate") }}：{{ Conditionerdata.ts }}</div>
          <div style="height: 33px"></div>
          <div>{{ $t("monitor.DeviceStatus") }}</div>
          <div class="equipmentdevice">
            <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="Conditionerdata.workStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">{{ $t("monitor.Running") }}</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1red">{{ $t("monitor.Stopped") }}</div>
                </div>
                <div class="equipment2">{{ $t("monitor.OperationStatus") }}</div>
              </div>
            </el-card>
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="Conditionerdata.indoorFanStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">室内风机</div>
              </div>
            </el-card> -->
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="Conditionerdata.outdoorFanStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">运行</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">室外风机</div>
              </div>
            </el-card>
            <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="Conditionerdata.emergencyFanStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">应急风机</div>
              </div>
            </el-card>
            <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="Conditionerdata.compressorStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">运行</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">压缩机</div>
              </div>
            </el-card>
            <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="Conditionerdata.electricHeatingStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">停止</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">电加热</div>
              </div>
            </el-card>
            <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="Conditionerdata.dischargingHydrogenStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">排氢状态</div>
              </div>
            </el-card> -->
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="Conditionerdata.emsCommStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">正常</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">与EMS通信</div>
              </div>
            </el-card> -->
            <!-- <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="Conditionerdata.sysStatus == 1">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1">-</div>
                </div>
                <div class="equipment2">工作模式</div>
              </div>
            </el-card> -->
            <el-card>
              <div class="equipmentdevice1">
                <div class="equipmentname" v-if="Conditionerdata.alarmStatus == 0">
                  <div class="equipmentborder"></div>
                  <div class="equipment1">{{ $t("monitor.Normal") }}</div>
                </div>
                <div class="equipmentname" v-else>
                  <div class="equipmentborderif"></div>
                  <div class="equipment1red">{{ $t("monitor.Fault") }}</div>
                </div>
                <div class="equipment2">{{ $t("monitor.FaultDetails") }}</div>
              </div>
            </el-card>
          </div>

          <div class="equipmentdata">{{ $t("monitor.DeviceMetrics") }}</div>
          <!-- class="" -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">电流</div>
              <div>{{ Conditionerdata.acVolt ?? "-" }} A</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">交流电压</div>
              <div>{{ Conditionerdata.acVolt ?? "-" }} V</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">直流电压</div>
              <div>{{ Conditionerdata.dcVolt ?? "-" }} V</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">盘管温度</div>
              <div>{{ Conditionerdata.coilTempr ?? "-" }} ℃</div>
            </div>
          </div> -->
          <!-- 2 -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">柜外温度</div>
              <div>{{ Conditionerdata.outdoorTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">柜内温度</div>
              <div>{{ Conditionerdata.cabinetTempr ?? "-" }}℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">冷凝温度</div>
              <div>{{ Conditionerdata.condensingTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">融霜温度</div>
              <div>{{ Conditionerdata.defrostTempr ?? "-" }} ℃</div>
            </div>
          </div> -->
          <!--  -->
          <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.Outlettemperature") }}</div>
              <div>{{ (Conditionerdata.condensingTempr * 1).toFixed(3) ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.returntemperature") }}</div>
              <div>{{ (Conditionerdata.defrostTempr * 1).toFixed(3) ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">{{ $t("monitor.outletpressure") }}</div>
              <div>{{ (Conditionerdata.outdoorTempr * 1).toFixed(1) ?? "-" }} Bar</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">{{ $t("monitor.ReturnPressure") }}</div>
              <div>{{ (Conditionerdata.cabinetTempr * 1).toFixed(1) ?? "-" }} Bar</div>
            </div>
          </div>
          <!--  -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">制热开启温度</div>
              <div>{{ Conditionerdata.heatingStartTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">制热关闭温度</div>
              <div>{{ Conditionerdata.heatingStopTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">制冷开启温度</div>
              <div>{{ Conditionerdata.refrigerationStartTempr ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">制冷关闭温度</div>
              <div>{{ Conditionerdata.refrigerationStopTempr ?? "-" }} ℃</div>
            </div>
          </div> -->
          <!-- 5-->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">高温告警温度</div>
              <div>{{ Conditionerdata.highTemprThreshold ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">低温告警温度</div>
              <div>{{ Conditionerdata.lowTemprThreshold ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">高湿告警点</div>
              <div>{{ Conditionerdata.humidity ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">除湿开启温度</div>
              <div>{{ Conditionerdata.dehumStartTemp ?? "-" }} ℃</div>
            </div>
          </div> -->
          <!-- 6 -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">除湿关闭温度</div>
              <div>{{ Conditionerdata.dehumStartHum ?? "-" }} ℃</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">除湿开启湿度</div>
              <div>{{ Conditionerdata.dehumStopTemp ?? "-" }} %</div>
            </div>
            <div class="equipmentdata_div">
              <div class="equipment_title">除湿关闭湿度</div>
              <div>{{ Conditionerdata.dehumStopHum ?? "-" }} %</div>
            </div>
            <div class="equipmentdata_div4">
              <div class="equipment_title">内风机转速</div>
              <div>{{ Conditionerdata.innerFanSpeed ?? "-" }} rpm</div>
            </div>
          </div> -->
          <!-- 7 -->
          <!-- <div class="equipmentdata_equipment">
            <div class="equipmentdata_div">
              <div class="equipment_title">外风机转速</div>
              <div>{{ Conditionerdata.exhaustTempr ?? "-" }} rpm</div>
            </div>
          </div> -->
          <!-- 8 -->
        </div>
      </el-card>
    </div>
  </div>
</template>
<!--    -->
<script setup lang="ts">
import { onMounted, onUnmounted, Ref, ref } from "vue";
import {
  stationstationName,
  postemsSystemsingleStation,
  poststationdeviceList,
  postpcsInfo,
  electricMeterInfo,
  BMSfieldCode,
  BMSbatteryStackInfo,
  getairConditionerInfo
} from "@/api/home/Multisite";
import { Station } from "@/api/interface";
const currentDate = ref();
const Singlevalue = ref("");
const cities: Ref<Station.todo[]> = ref([]);
const emsDevice: Ref<any[]> = ref([]);
const emsDeviceId = ref("");
const intervalID = ref();
const poststationstationName = async () => {
  const { data } = await stationstationName({});
  if (data.length == 0) {
    Singlevalue.value = "";
    return;
  } else {
    Singlevalue.value = data[0].id;
  }
  cities.value = data;
  postemsDevice(Singlevalue.value);
};
const postemsDevice = async (value: any) => {
  emsDevice.value = [];
  const { data } = await postemsSystemsingleStation({}, value);
  if (data.length == 0) {
    emsDeviceId.value = "";
    clearInterval(intervalID.value);

    return;
  } else {
    emsDeviceId.value = data[0].id;
  }

  emsDevice.value = data;
  getstationrealtime();
};
const deviceList: Ref<Station.deviceList[]> = ref([]);
const deviceType = ref(1);
// 定义排序优先级
const typeMap: Record<string, { name: string; order: number }> = {
  pcs: { name: "变流器", order: 1 },
  bms: { name: "电池", order: 2 },
  sys: { name: "系统", order: 3 },
  lcs: { name: "液冷", order: 4 }
};

const getstationrealtime = async () => {
  const { data } = await poststationdeviceList({ emsId: emsDeviceId.value }, Singlevalue.value);
  if (data.length == 0) return;

  deviceList.value = data;

  // 按优先级排序
  deviceList.value = deviceList.value
    .map(item => ({
      ...item,
      name: typeMap[item.deviceClassName]?.name || "未知设备"
    }))
    .sort((a, b) => (typeMap[a.deviceClassName]?.order || Infinity) - (typeMap[b.deviceClassName]?.order || Infinity));
  // 然后按 deviceType 排序
  console.log(deviceList.value);

  deviceType.value = data[0].deviceType;
  handleClick();
  // 清除定时器的示例
  clearInterval(intervalID.value);
  intervalID.value = setInterval(function () {
    handleClick();
  }, 10000);
};
const activeName = ref(0);
const handletabs = (e: any) => {
  activeName.value = e;
  handleClick();
};
const handleClick = async () => {
  deviceType.value = deviceList.value[activeName.value].deviceType;
  // clearInterval(intervalID.value);
  if (deviceList.value[activeName.value].deviceType == 1) {
    getpcsdata();
  } else if (deviceList.value[activeName.value].deviceType == 2) {
    // devicesClickid.value
    devicesClickid.value = deviceList.value[activeName.value].devices[0].id;
    Electricitymeter();
  } else if (deviceList.value[activeName.value].deviceType == 3) {
    BMSfieldCodeid.value = deviceList.value[activeName.value].devices[0].id;

    getBMSfieldCode();
    getBMSbatteryStackInfo();
  } else if (deviceList.value[activeName.value].deviceType == 4) {
    airConditionerInfoid.value = deviceList.value[activeName.value].devices[0].id;
    getgetairConditionerInfo();
  }
};

const devicesClickindex = ref(0);
const devicesClickid = ref("1");
const devicesClick = async (val: number, id: string) => {
  devicesClickindex.value = val;
  devicesClickid.value = id;
  Electricitymeter();
};

const indexMethod = (index: number) => {
  return index + 1;
};
//PCS
const pcslist = ref();
const getpcsdata = async () => {
  const { data } = await postpcsInfo({ emsId: emsDeviceId.value }, Singlevalue.value, emsDeviceId.value);
  pcslist.value = data;
};

//
const Electricitymeterlist = ref();
const datalist = ref();
const Electricitymeter = async () => {
  const { data } = await electricMeterInfo({ emsId: emsDeviceId.value }, Singlevalue.value, devicesClickid.value);
  datalist.value = data;
  // 电表
  let tableData = [
    {
      type: "日正向总电能",
      total: "-",
      tip: "-",
      peak: "-",
      flat: "-",
      valley: "-"
    },
    {
      type: "日反向总电能",
      total: "-",
      tip: "-",
      peak: "-",
      flat: "-",
      valley: "-"
    },
    {
      type: "累计正向总电能",
      total: datalist.value.totalImportEnergy ?? "-",
      tip: "-",
      peak: "-",
      flat: "-",
      valley: "-"
    },
    {
      type: "累计反向总电能",
      total: datalist.value.totalExportEnergy ?? "-",
      tip: "-",
      peak: "-",
      flat: "-",
      valley: "-"
    }
  ];
  Electricitymeterlist.value = tableData;
};
// BMS
const BMSfieldCodeid = ref("");

const BMSdata = ref();
const getBMSfieldCode = async () => {
  const { data } = await BMSfieldCode({ deviceType: 9, deviceId: BMSfieldCodeid.value }, Singlevalue.value);
  BMSdata.value = data;
};
const BMSlist = ref();

const getBMSbatteryStackInfo = async () => {
  const { data } = await BMSbatteryStackInfo({ emsId: emsDeviceId.value }, Singlevalue.value, BMSfieldCodeid.value);
  BMSlist.value = data;
};
// 空调
const airConditionerInfoid = ref("");
const Conditionerdata = ref();
const getgetairConditionerInfo = async () => {
  const { data } = await getairConditionerInfo({ emsId: emsDeviceId.value }, Singlevalue.value, airConditionerInfoid.value);
  Conditionerdata.value = data;
};
onUnmounted(() => {
  clearInterval(intervalID.value);
});
onMounted(() => {
  const current = localStorage.getItem("currentDate");
  if (current) {
    currentDate.value = current;
  }

  poststationstationName();
});
</script>
<style scoped lang="scss">
@import "./index.scss";
</style>
<!---->
