<template>
  <div
    v-loading="jzr60Loading"
    style="width: 100%; min-height: 700px"
  >
  <!-- 公式 -->
  <div class="formulaBox">
     
      <div class="formula">
        <div> {{ $t(`arh.jzr`) }} =</div>
        <div style="position: relative;"> <span class="Summation"> &sum;</span> &nbsp;&nbsp;&nbsp;   {{ $t(`home.Increase`) }}<span style="font-size:12px">t</span> </div>
      </div>
    </div>

    <el-row>
      <el-col :span="24">
        <h3 style="text-align: center; color: rgba(0, 0, 0, 0.6)">
          {{ $t(`arh.jzr`) }}
        </h3>
        <div style="padding-left: 9%;font-size:12px;color:rgba(0,0,0,0.6);margin-top: 10px;">{{ $t(`home.figure`) }}</div>

        <div
          id="jzr60Box"
          style="width: 100%; min-height: 700px"
        ></div>
      </el-col>
    </el-row>
    <!-- 24小时数据 -->
    <el-row>
      <el-col :span="24">
        <h3 style="text-align: center; color: rgba(0, 0, 0, 0.6)">
          {{ $t(`arh.dayGraph`) }}
        </h3>
        <div style="padding-left: 9%;font-size:12px;color:rgba(0,0,0,0.6);margin-top: 10px;">{{ $t(`home.figure2`) }}</div>

        <div
          id="jzr60DayBox"
          style="width: 100%; min-height: 700px"
        ></div>
      </el-col>
    </el-row>

    <!-- <div class="formulaBox">
      <p>{{ $t(`home.formula`) }}</p>
      <div class="formula">
        <div> {{ $t(`arh.jzr`) }} =</div>
        <div style="position: relative;"> <span class="Summation"> &sum;</span> &nbsp;&nbsp;&nbsp;   {{ $t(`home.Increase`) }}<span style="font-size:12px">t</span> </div>
      </div>
    </div> -->
  </div>
</template>

<script>
import IndexJs from "../jzr60/index";
export default {
  mixins: [IndexJs],
};
</script>

<style lang="scss" scoped>
.according {
  color: #f7931a;
}
.formulaBox {
  width: 98.7%;
  padding: 10px 0px;
  margin-bottom: -30px;
  // height: 60px;
  // background: #e5e5e5;
  color: rgba(0, 0, 0, 0.7);
  position: relative;
  
  margin-bottom: 10px;
  display: flex;
  justify-content: center;
  p{
    padding: 0px 10px;
  }
  .formula{
    display: flex;
    // outline: 1px solid red;
    padding: 0px 10px;
 
  }
  .Summation:after{
      content: "60";
      font-size: 12px;
      position: absolute;
      top: -3px;
    }
    .Summation:before{
      content: "t=1";
      font-size: 12px;
      position: absolute;
      top: 10px;
      left: 12px;
    }
}
</style>