energy_storage/bin/Release/assets/html/pages/test.html

<div style="width: 100%; height: 100%; ;">

  <div id="workspace" class="myrow">
    <div class="mycard" style="width:320px">
      <div class="myrow" style="margin-bottom: 20px; border: solid 1px salmon;">
        <div style="width: 65px;height: 65px; background-color: #2991b6;border-radius: 10px;"></div>
        <div class="mycol" style="margin-left: 10px; font-size:15px;">
          <div> 编号111 </div>
          <div style="font-size:15px;"> 名称 </div>
          <div style="color: #08afff; font-size:14px; font-weight: bold;"> 设备类型 </div>
        </div>
      </div>

      <div class="mycard-param">
        <div class="mycard-param-key">工作状态: </div>
        <div id="id" class="mycard-param-text">运行/空闲</div>
      </div>
    </div>

    <div class="mycard" style="width:320px">
      <div class="myrow" style="margin-bottom: 20px; ">
        <div style="width: 65px;height: 65px; background-color: #2991b6;border-radius: 10px;"></div>
        <div class="mycol" style="margin-left: 10px; font-size:15px;">
          <div> 编号222 </div>
          <div style="font-size:15px;"> 名称 </div>
          <div style="color: #08afff; font-size:14px; font-weight: bold;"> 设备类型 </div>
        </div>
      </div>
      <div class="myrow">
        <div style="width: calc(50% - 10px); border: solid gray; border-width: 0 1px 0 0;">
          <div class="myrow" style="font-size:14px; margin-left: 10px;">
            <div style="background-color:#00dbd7; width: 5px; height:18px; "></div>
            <div style="margin-left: 10px;">枪: #1</div>
            <div class="status-ok" style="margin: 3px 0 0 30px; ">
            </div>
          </div>

          <div class=" mycard-param">
            <div class="mycard-param-key">状态: </div>
            <div id="id" class="mycard-param-text">运行</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">电压: </div>
            <div id="id" class="mycard-param-text">220 V</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">电流: </div>
            <div id="id" class="mycard-param-text">10 A</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">功率: </div>
            <div id="id" class="mycard-param-text">2.2 kW</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">温度: </div>
            <div id="id" class="mycard-param-text">2.2 kW</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">SOC: </div>
            <div id="id" class="mycard-param-text">20.6%</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">SOH: </div>
            <div id="id" class="mycard-param-text">89.7%</div>
          </div>
        </div>

        <div style="width: calc(50% - 10px); margin-left: 10px;">
          <div class="myrow" style="font-size:14px; margin-left: 10px;">
            <div style="background-color:#00dbd7; width: 5px; height:18px; "></div>
            <div style="margin-left: 10px;">枪: #2</div>
            <div class="status-err" style="margin: 3px 0 0 30px; "></div>
          </div>

          <div class="mycard-param">
            <div class="mycard-param-key">状态: </div>
            <div id="id" class="mycard-param-text">运行</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">电压: </div>
            <div id="id" class="mycard-param-text">220 V</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">电流: </div>
            <div id="id" class="mycard-param-text">10 A</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">功率: </div>
            <div id="id" class="mycard-param-text">2.2 kW</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">温度: </div>
            <div id="id" class="mycard-param-text">2.2 kW</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">SOC: </div>
            <div id="id" class="mycard-param-text">57.3%</div>
          </div>
          <div class="mycard-param">
            <div class="mycard-param-key">SOH: </div>
            <div id="id" class="mycard-param-text">93.2%</div>
          </div>
        </div>
      </div>
    </div>
  </div>


  <table id="myTable"></table>
</div>