<template>
  <div class="energy-top clearfix">
    <div class="top-item">
      节能积分说明
    </div>
  </div>
  <div class="page-box integra-desc">
    <p>
      <span class="num">1. </span>
      加班的时候设置加班时间，积分1
    </p>
    <p>
      <span class="num">2.</span>
      办公中暂时不需要<span v-if="portait.light">照明&</span>
      <span v-if="portait.airConditioner">空调</span>，持续时间大于等于0.5，小于1小时无任何开启，积分0.5
    </p>
    <p>
     <span class="num">
        3.
     </span>
      办公中暂时不需要
      <span v-if="portait.light">照明&</span><span v-if="portait.airConditioner">
        空调</span>，持续时间大于等于1，小于2小时无任何开启，积分1
    </p>
    <p>
      <span class="num">4.</span>
      办公中暂时不需要
      <span v-if="portait.light">照明&</span>
      <span v-if="portait.airConditioner">空调</span>，
      持续时间大于等于2小时无任何开启，积分2
    </p>
    <p>
      <span class="num"> 5.</span>
      调节至室内温度大于等于26"C，积分1
    </p>
    <p>
      <span class="num">6.</span>
      供暖季，调节至室内温度小于等于20℃，积分1
    </p>
  </div>
</template>

<script lang="ts">
import {defineComponent, reactive, toRefs, onMounted} from 'vue'
import {store} from "@/store";

export default defineComponent({
  setup() {
    const proxyData = reactive({
      portait: store.state.portait,
    })
    onMounted(() => {
    })
    return {
      ...toRefs(proxyData)
    }
  }
})
</script>
<style lang="scss" scoped>
.energy-top {
  padding-left: 35px;
  padding-right: 24px;
  padding-top: 20px;
  padding-bottom: 34px;
  background: #E5E5E5;

  .top-item {
    font-family: 'PingFang SC';
    font-size: 24px;
    line-height: 28px;
    color: #000000;
  }
}

.integra-desc {
  padding: 30px;
  padding-left: 45px;
  min-height: calc(100% - 134px);
  background: #fff;

  p {
    font-family: 'PingFang SC';
    font-style: normal;
    font-weight: 400;
    font-size: 17px;
    line-height: 30px;
    color: #4D5262;

    .num {
      margin-left: -15px;
    }
  }
}
</style>
