<style lang="less">
page {
    height: 100%;
    background-color: #f3f3f3;
}
.page-container {
    width: 100%;
    box-sizing: border-box;
    position: relative;
    font-family: PingFang SC;
    .energyHead {
        height: 160rpx;
        display: flex;
        align-items: center;
        color: #000;
        font-size: 44rpx;
        padding-left: 44rpx;
        background-color: #f3f3f3;
    }
    .pointExplain {
        background: #fff;
        padding: 56rpx 48rpx 56rpx 56rpx;
        color: #4d5262;
        font-size: 28rpx;
        // line-height: 56rpx;
        .item {
            display: flex;
            align-items: baseline;

            .order {
                width: 40rpx;
            }
            .cont {
                line-height: 56rpx;
            }
        }
        .carbonItem{
            flex: 1;text-align: justify
        }
    }
    .explain{
        padding-top: 40rpx;
        font-family: PingFang SC;
        font-size: 24rpx;
        font-weight: 400;
        line-height: 36rpx;
        color: #C4C4C4;

    }
    .logo-text {
        display: flex;
        justify-content: center;
        width: 100%;
        height: 24rpx;
        padding: 98rpx 0 80rpx;
    }
    .btPostion{
        position: absolute;
        bottom: -600rpx;
    }
}
</style>

<template>
    <div>
        <div class="page-container">
            <div class="energyHead">
                {{ carbonCreditText }}积分说明
            </div>
            <div
                class="pointExplain"
                v-if="projectId === 'Pj1101020007'"
            >
                <div :class="{'item':true,'carbonItem':true}" 
                style="{{ item.sty }}"
                v-for="(item,idx) in textExplain" :key="idx">
                    <div v-if="item.id" style="line-height: 48rpx;margin-right: 8rpx;">{{item.id}}</div>
                    <div class="cont" style="line-height: 48rpx;">{{item.text}}</div>
                </div>
            </div>
            <div
                class="pointExplain"
                v-else
            >
                <div class="item">
                    <div class="order">1、</div>
                    <div class="cont">加班的时候设置加班时间，积分1</div>
                </div>
                <div class="item">
                    <div class="order">2、</div>
                    <div class="cont">办公中暂时不需要<span v-if="portraitModule.light">照明&</span><span v-if="portraitModule.airConditioner">空调</span>，持续时间大于等<br>于0.5，小于1小时无任何开启，积分0.5</div>
                </div>
                <div class="item">
                    <div class="order">3、</div>
                    <div class="cont">办公中暂时不需要<span v-if="portraitModule.light">照明&</span><span v-if="portraitModule.airConditioner">空调</span>，持续时间大于等<br>于1，小于2小时无任何开启，积分1</div>
                </div>
                <div class="item">
                    <div class="order">4、</div>
                    <div class="cont">办公中暂时不需要<span v-if="portraitModule.light">照明&</span><span v-if="portraitModule.airConditioner">空调</span>，持续时间大于等<br>于2小时无任何开启，积分2</div>
                </div>
                <div class="item">
                    <div class="order">5、</div>
                    <div class="cont">供冷季，调节至室内温度大于等于26℃，积分1</div>
                </div>
                <div class="item">
                    <div class="order">6、</div>
                    <div class="cont">供暖季，调节至室内温度小于等于20℃，积分1</div>
                </div>
            </div>
            <image
                class="logo-text"
                :class="{'logo-text':true,'btPostion':projectId!='Pj1101020007'}"
                src="{{h5StaticPath}}/page-home/tenatslink.svg"
            ></image>
        </div>
    </div>

</template>

<script>
import wepy from '@wepy/core';
import store from '@/store';
import config from '@/config';
import { mapState } from '@wepy/x';
import { carbonCreditExplain, carbonCredit } from '../common.js'

wepy.page({
  store,
  data: {
    h5StaticPath: config.h5StaticPath,
    textExplain: [],
    carbonCreditText: ''
  },
  computed: {
    ...mapState({ token: state => state.user.token,
      portraitModule: state => state.portrait.portraitModule,
      projectId: state => state.company && state.company.companyConfig && state.company.companyConfig.sagacareProjectId

    })
  },
  onLoad() {
    this.textExplain = carbonCreditExplain();
    this.carbonCreditText = carbonCredit(this.projectId);
  },
  onReady() { },
  methods: {

    showPointExplain() {
      console.log('fsd');
      wx.navigateTo({
        url: './pointExplain'
      });
    }
  }
});
</script>

<config>
{
    'navigationBarBackgroundColor': '#f3f3f3',
    'navigationBarTextStyle':'black',
    'backgroundColor': '#f3f3f3',
    'navigationBarTitleText': '',
        usingComponents: {
    }

}
</config>
