<template>
    <div>

        <div class="page_main">
            <div class="download_box">
                <el-button
                    size="small"
                    class="ml20"
                    @click="exportClick()"
                >下载报告</el-button>
            </div>
            <div class="page_header">
                <p>{{projectName}}环境管理周报告</p>
                <p>
                    <span style="font-size:16px;display:inherit;text-align:right;padding-top:10px">
                        总第{{totalReportCount}}期，{{moment(this.endDate).format("YYYY")}}年第{{yearReportNum}}期
                        <span style="margin:0 20px;font-size:16px"> {{this.startDate&&moment(this.startDate).format("YYYY.MM.DD")}}-{{this.endDate&&moment(this.endDate).format("YYYY.MM.DD")}}</span>
                    </span>
                </p>

            </div>
            <!-- start 环境概况 -->
            <section class="env_module title_one_table mb16">
                <div class="sj_title title_one">环境概况</div>
                <el-table
                    class="sj_table"
                    :data="surveyTable.slice(0,5)"
                    :row-class-name="tableRowClassName"
                    :header-cell-style="{background:'#3399ff !important',color:'#ffffff',padding:'10px 0'}"
                >
                    <el-table-column
                        align="left"
                        label=""
                        width="30"
                    ></el-table-column>
                    <el-table-column
                        align="left"
                        prop="name"
                        label="环境参数"
                    ></el-table-column>
                    <el-table-column
                        align="left"
                        prop="weeknormalProprotion"
                        label="周达标率"
                    >
                        <template slot-scope='{row}'>
                            {{row.weeknormalProprotion+'%'}}
                        </template>
                    </el-table-column>
                    <el-table-column
                        align="left"
                        prop="weekAvg"
                        label="周平均"
                    >
                        <template slot-scope='{row}'>
                            {{row.weekAvg+row.unit}}
                        </template>
                    </el-table-column>
                    <el-table-column
                        align="left"
                        prop="assess"
                        label="评价"
                    ></el-table-column>
                </el-table>
                <div class="title_tips big_tips"><i class="el-icon-warning-outline"></i>数据来源：物联网传感器数据监测备份</div>
                <!-- 用户调节 -->
                <userAdjust
                    :projectId="projectId"
                    :energyDate="surveyTable[6]"
                    :userAdjust="surveyTable[5]"
                    class="mp40"
                />
            </section>
            <!-- end 环境概况 -->
            <!-- 3.0.0添加各种参数类型 -->
            <!-- start 本周环境温度概况 -->
            <section class="env_module mb16">
                <!--可切换参数  -->
                <Tabs
                    type="card"
                    :data="envTypelistnow"
                    v-model="envType"
                    class="daytabs"
                />
                <div class="sj_title">本周环境概况</div>
                <envSurvey
                    :surveyTable="surveyTable[currentEnv]"
                    :envType="envType"
                ></envSurvey>
                <!-- 根据参数显示内容 -->
                <div
                    class="pm_container"
                    v-if="envType=='PM2d5'"
                >
                    <p>各PM2.5浓度区间累计时长及占比</p>
                    <div class="pm_table">
                        <div class="left">
                            <div class="pm_chart">
                                <ringChart
                                    :chartId="'pm_chart'+exportPdf"
                                    :color-arr="pmchartColor"
                                    :chart-date="pmDate"
                                />
                            </div>
                            <div class="pm_count">总空间数量：<span>{{chartweekDate.registeredSpaceNum&&chartweekDate.registeredSpaceNum.filter(Boolean)[0]}}</span>个</div>
                            <div class="title_tips"><i class="el-icon-warning-outline"></i>各评价标准累计时长一定程度上反映出当前建筑的整体PM2.5浓度所处的水平</div>
                        </div>
                        <div class="right">
                            <el-table
                                size="mini"
                                :data="pmDate"
                                :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
                            >
                                <el-table-column
                                    align="left"
                                    label=""
                                    width="30"
                                ></el-table-column>
                                <!--{assessStandard:"WELL铂金级",range:"0~15"},  -->
                                <el-table-column
                                    align="left"
                                    prop="name"
                                    label="评价标准"
                                ></el-table-column>
                                <el-table-column
                                    align="left"
                                    prop="evaluationScope"
                                    label="范围(μg/m3)"
                                ></el-table-column>
                                <el-table-column
                                    align="left"
                                    label="周累计时长(h)"
                                    prop="accumulatedTime"
                                ></el-table-column>
                                <el-table-column
                                    align="left"
                                    label="时长占比(%)"
                                    prop="proportion"
                                ></el-table-column>
                            </el-table>
                        </div>
                    </div>
                </div>
                <div
                    class="title_tips"
                    v-if="envType=='Tdb'"
                ><i class="el-icon-warning-outline"></i>评价标准、达标标准、计算方法见数据解释</div>
                <div class="content_title mp40"><span>{{contentTitle(envType)}}</span></div>
                <div class="content_title_noline mb32">{{seccontentTitle(envType)}}</div>
                <chartLegend
                    class="charttext_p"
                    :legend-type="envType"
                    :num-type="false"
                />
                <!-- 折线图 -->
                <lineChart
                    v-if="!isUserorEngry(envType)"
                    :chart-id="chartId"
                    :chart-date="chartweekDate"
                    :env-type="envType"
                    :xType="dayType"
                />
                <!-- 柱状图 -->
                <barChart
                    :numberChart="isUserorEngry(envType)"
                    :chart-id="chartId+'1'"
                    :key="envType"
                    :chart-date="chartweekDate"
                    :env-type="envType"
                    :xType="dayType"
                />
                <!-- 服务空间数 -->
                <div
                    class="room_table"
                    v-if="!isUserorEngry(envType)"
                >
                    <div class="room_table_number">
                        <div>服务空间数(总：{{chartweekDate.registeredSpaceNum&&chartweekDate.registeredSpaceNum.filter(Boolean)[0]}})</div>
                        <div>
                            <div
                                v-for="(item,index)  in chartweekDate.daySpaceNum"
                                :key="index"
                            >
                                {{item}}
                            </div>
                        </div>
                    </div>
                </div>
                <div
                    class="room_table room_table_user"
                    v-if="envType==='userAdjust'"
                >
                    <div class="room_table_number">
                        <div>异常热调节</div>
                        <div>
                            <div
                                v-for="(item,index)  in chartweekDate.feedbackAbnorHotNum"
                                :key="index"
                            >
                                {{item}}
                            </div>
                        </div>
                    </div>
                    <div
                        class="room_table_number"
                        :style="{'margin-top':0}"
                    >
                        <div>异常冷调节</div>
                        <div>
                            <div
                                v-for="(item,index)  in chartweekDate.feedbackAbnorColdNum"
                                :key="index"
                            >
                                {{item}}
                            </div>
                        </div>
                    </div>
                    <div
                        class="room_table_number"
                        :style="{'margin-top':0}"
                    >
                        <div>吹风调节</div>
                        <div>
                            <div
                                v-for="(item,index)  in chartweekDate.feedbackNoisyHotNum"
                                :key="index"
                            >
                                {{item}}
                            </div>
                        </div>
                    </div>
                </div>
                <section v-if="envType=='Tdb'">
                    <div class="content_title_noline mb40"><span>逐刻平均温度及达标空间数量变化趋势</span></div>
                    <chartLegend
                        class="charttext_p charttext_mt mb40"
                        :num-type="false"
                    />
                    <lineChart
                        :chart-id="chartId+'zhou'"
                        :contant="true"
                        :chart-date="chartweekTemp"
                        :xType="hourType"
                    />
                    <barChart
                        :chart-id="chartId+'zhou1'"
                        :chart-date="chartweekTemp"
                        :xType="hourType"
                    />
                    <!-- <div class="title_tips"><i class="el-icon-warning-outline"></i>评价标准、达标标准、计算方法见数据解释</div> -->
                </section>
                <div
                    class="addmark"
                    :key="envType+'11'"
                >
                    <div
                        class="remarkshow remark_input"
                        title="点击即可编辑"
                        v-if="!quarterRemarkEdit"
                        @click="toRemarkedit('quarterRemark')"
                    >{{quarterRemark[envType]}}</div>
                    <section v-else>
                        <el-input
                            class="remark_input"
                            type="textarea"
                            :rows="2"
                            v-model="quarterRemark[envType]"
                            placeholder="添加备注"
                        ></el-input>
                        <el-button
                            type="primary"
                            size="small"
                            @click="saveRemark('quarterRemark')"
                        >保存</el-button>
                        <el-button
                            @click="cancelRemark('quarterRemark')"
                            size="small"
                        >取消</el-button>
                    </section>
                </div>
                <div
                    class="hcho_parame"
                    v-if="envType=='HCHO'"
                >
                    <div class="content_title mp40"><span>异常空间</span><span>(超标率排序)</span></div>
                    <el-table
                        size="mini"
                        :data="hchogirdDate"
                        :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
                    >
                        <el-table-column
                            label='序号'
                            prop
                            width='80'
                            type='index'
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="spaceName"
                            width='130'
                            label="空间名称"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="abnormalProprotion"
                            width='130'
                            label="超标率(%)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="hchoAbnormalTime"
                            width='130'
                            label="超标时长(h)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="hchoMaxSolubility"
                            width='150'
                            label="峰值浓度(mg/m³)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="assess"
                            width='130'
                            label="峰值浓度评价"
                            align="left"
                        >
                            <template slot-scope='{row}'>
                                <span :style="{color:row.assess=='较高'?'#C6322B':'#1F2329'}">{{row.assess}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column
                            label="解释"
                            align="center"
                        >
                            <template slot-scope='{row}'>
                                <el-input
                                    v-model="row.hchoRemark"
                                    size="small"
                                    maxlength="24"
                                    @blur="changeInput(row,'hcho')"
                                ></el-input>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
                <div
                    class="co2_parame"
                    v-if="envType=='CO2'"
                >
                    <div class="content_title mp40"><span>异常空间</span><span>(超标率排序)</span></div>
                    <el-table
                        size="mini"
                        :data="co2girdDate"
                        :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
                    >
                        <el-table-column
                            label='序号'
                            prop
                            width='80'
                            type='index'
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="spaceName"
                            width='130'
                            label="空间名称"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="abnormalProprotion"
                            width='130'
                            label="超标率(%)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="co2AbnormalTime"
                            width='130'
                            label="超标时长(h)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="co2MaxSolubility"
                            width='150'
                            label="峰值浓度(ppm)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="assess"
                            width='130'
                            label="峰值浓度评价"
                            align="left"
                        >
                            <template slot-scope='{row}'>
                                <span :style="{color:row.assess=='较高'?'#DCAA04':'#1F2329'}">{{row.assess}}</span>
                            </template>

                        </el-table-column>
                        <el-table-column
                            label="解释"
                            align="center"
                        >
                            <template slot-scope='{row}'>
                                <el-input
                                    v-model="row.co2Remark"
                                    size="small"
                                    maxlength="24"
                                    @blur="changeInput(row,'co2')"
                                ></el-input>
                            </template>
                        </el-table-column>
                    </el-table>
                    <div class="content_title_noline mp40 mb16">参数释义</div>
                    <ul class="paramlist ft12">
                        <li>
                            <p><span><b>CO₂：</b>通常作为建筑空间新风是否充足的量化参数</span></p>
                            <div>
                                <el-table
                                    class="co2table ft12"
                                    :data="co2Date"
                                    border
                                    :header-cell-style="{background:'#ffffff!important',color:'#606266',padding:'6px 0'}"
                                >
                                    <!-- <el-table-column width="30"></el-table-column> -->
                                    <el-table-column
                                        label="序号"
                                        type="index"
                                        width="60"
                                        align="left"
                                    ></el-table-column>
                                    <el-table-column
                                        label="CO₂浓度区间"
                                        prop="area"
                                        align="left"
                                        width="150"
                                    ></el-table-column>
                                    <el-table-column
                                        label="评价"
                                        prop="assess"
                                        align="left"
                                        width="200"
                                    ></el-table-column>
                                    <el-table-column
                                        label="环境感受"
                                        prop="feel"
                                        align="left"
                                    ></el-table-column>
                                </el-table>
                                <div class="title_tips"><i class="el-icon-warning-outline"></i>室外新鲜空气一般在 400～500ppm</div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div
                    class="rh_parame"
                    v-if="envType=='RH'"
                >
                    <div class="content_title_noline mp40 mb16">参数解释</div>
                    <ul class="paramlist ft12">
                        <li>
                            <p><i></i><span><b>相对湿度</b></span></p>
                            <div style="margin-top:8px">评价空气中的水蒸气的相对含量</div>
                        </li>
                        <li>
                            <p><i></i><span><b>舒适范围</b></span></p>
                            <div>
                                <div class="hum_list">
                                    <div><span>供暖季</span>30%～60%</div>
                                    <div><span>供冷季</span>40%～60%</div>
                                    <div><span>过渡季</span>30%～60%</div>
                                </div>
                            </div>
                        </li>
                        <li>
                            <p><i></i><span><b>参数评价</b></span></p>
                            <p class="rh_img"><img
                                    src="../../../../static/images/hot.png"
                                    alt=""
                                />干燥:低于上述区间 </p>
                            <p class="rh_img"><img
                                    src="../../../../static/images/cold.png"
                                    alt=""
                                />偏湿:高于上述区间 </p>
                        </li>
                        <li>
                            <p><i></i><span><b>相对湿度的影响</b><br></span></p>
                            <div style="margin-top:8px">
                                高湿度可促进微生物病原体（如细菌、尘螨和霉菌）的聚集和生长，同时湿度过高可能会增加建筑材料释放气体：相对湿度增加 35%可使甲醛释放量增加 1.8-2.6 倍。 低湿度会导致气道、皮肤、眼 睛、咽喉和粘膜的干燥和刺激。也与病毒较长的存活率有关（活性失去较慢）
                            </div>
                        </li>
                    </ul>
                </div>
                <div
                    class="pm_parame"
                    v-if="envType=='PM2d5'"
                >
                    <div class="content_title_noline mp40 mb16"><span>参数释义</span></div>
                    <ul class="paramlist ft12">
                        <li>
                            <p><i></i><span><b>PM2.5简介</b><br>大气中空气动力学当量直径小于或等于 2.5 微米的颗粒物，也称为可入肺颗粒物；</span></p>
                        </li>
                        <li>
                            <p><i></i><span><b>达标率</b><br>参数良好级别及以上，浓度≤75 μg/m3；超出此数值记为超限。</span></p>
                        </li>
                        <li>
                            <p><i></i><span>WELL标准中，对不同PM2.5浓度所在区间所能申请的标准(铂金级、金级、银级)，均有对应的先决条件。如:在 PM2.5 浓度为 20μg/m3，最高只能达到 WELL 金级标准。</span></p>
                        </li>
                    </ul>
                </div>
                <div
                    class="ad_parame"
                    v-if="envType=='userAdjust'"
                >
                    <div class="content_title_noline mp40 mb16"><span>解释说明</span>：用户异常反馈的几种情况</div>
                    <ul class="paramlist ft12">
                        <li>
                            <p><i></i><span><b>环境温度高，用户反馈“热”</b></span></p>
                        </li>
                        <li>
                            <p><i></i><span><b>用户2次反馈“热”</b></span></p>
                        </li>
                        <li>
                            <p><i></i><span><b>用户1次反馈“吹风”</b></span></p>
                        </li>
                        <li>
                            <p><i></i><span><b>环境温度低，用户反馈“冷”</b></span></p>
                        </li>
                        <li>
                            <p><i></i><span><b>用户2次反馈“冷”</b></span></p>
                        </li>
                        <li>
                            <p><span><b>用户通过app（小程序）调节空调，反馈冷热</b></span></p>
                        </li>
                    </ul>
                </div>
                <!-- start 环境温度分析 -->
                <section
                    class="mb16"
                    v-if="envType=='Tdb'"
                >
                    <div class="content_title"><span>环境温度分析（空间维度）</span></div>
                    <div class="sj_reminder mb32">
                        <p>温馨提示：</p>
                        <p>1.空间划分维度：内外区、朝向、楼层、新风机组各自服务的空间四个维度，分别进行周不达标率分析计算。</p>
                        <p>2.数据表：每个空间划分维度均有对应的空间数量。</p>
                        <p>3.朝向维度仅外区空间，其中内区空间无朝向。</p>
                    </div>
                    <div class="sj_chartbox">
                        <div class="pr65">
                            <div class="day_title mb32">内、外区</div>
                            <barChart
                                :chart-id="'echart_left_out'"
                                :chart-date="localtionDate.regionsChart"
                                :sjChartType="'regions'"
                                class="daychart"
                            />
                            <div class="chart_sj_bottom mb40">
                                <div>空间数量</div>
                                <div class="chart_sj_bottom_main">

                                    <div
                                        v-for="(item,index) in localtionDate.regionsChart.spaceNum"
                                        :key="index"
                                    >{{item}}</div>
                                </div>
                            </div>
                        </div>
                        <div>
                            <div class="day_title mb32">各个朝向
                                <chartLegend
                                    :avgTemp="false"
                                    class="charttext"
                                />
                            </div>
                            <barChart
                                :chart-id="'echart_left_orientation'"
                                :chart-date="localtionDate.orientationChart"
                                :sjChartType="'orientation'"
                                class="daychart"
                            />
                            <div class="chart_sj_bottom mb40">
                                <div class="twoline">空间数量</div>
                                <div class="chart_sj_bottom_main">

                                    <div
                                        v-for="(item,index) in localtionDate.orientationChart.spaceNum"
                                        :key="index"
                                    >{{item}}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="sj_chartbox">
                        <div class="pr65">
                            <div class="day_title mb32">各个楼层</div>
                            <barChart
                                :chart-id="'echart_left_floor'"
                                :chart-date="localtionDate.floorChart"
                                :sjChartType="'localtion'"
                                class="daychart"
                            />
                            <div class="chart_sj_bottom">
                                <div class="twoline">空间数量</div>
                                <div class="chart_sj_bottom_main">

                                    <div
                                        v-for="(item,index) in localtionDate.floorChart.spaceNum"
                                        :key="index"
                                    >{{item}}</div>
                                </div>
                            </div>
                        </div>
                        <div>
                            <!-- <div class="day_title mb32">新风机组服务的空间</div>
                                <barChart :chart-id="'echart_left_unit'" :chart-date="localtionDate.freshAirChart" :sjChartType="'freshAir'"  class="daychart"/>
                                <div class="chart_sj_bottom">
                                    <div class="twoline">空间数量</div>
                                    <div class="chart_sj_bottom_main">

                                    <div v-for="(item,index) in localtionDate.freshAirChart.spaceNum" :key="index">{{item}}</div>
                                    </div>
                                </div> -->
                        </div>
                    </div>
                    <div class="addmark">
                        <div
                            class="remarkshow remark_input"
                            title="点击即可编辑"
                            v-if="!typeRemarkEdit"
                            @click="toRemarkedit('typeRemark')"
                        >{{typeRemark}}</div>
                        <section v-else>
                            <el-input
                                class="remark_input"
                                type="textarea"
                                :rows="2"
                                v-model="typeRemark"
                                placeholder="添加备注"
                            ></el-input>
                            <el-button
                                type="primary"
                                size="small"
                                @click="saveRemark('typeRemark')"
                            >保存</el-button>
                            <el-button
                                @click="cancelRemark('typeRemark')"
                                size="small"
                            >取消</el-button>
                        </section>
                    </div>
                </section>
                <!-- end 环境温度分析 -->
                <!-- start 各达标区间空间数量分布及异常冷热空间列表 -->
                <section
                    class="mb16"
                    v-show="envType=='Tdb'"
                >
                    <div class="content_title"><span>各达标区间空间数量分布及异常冷热空间列表</span></div>
                    <div class="content_title_noline mb16">各达标区间空间数量分布</div>
                    <div class="up_distribution">
                        <div class="up_distribution_text"><span></span>达标率偏低,亟待解决</div>
                        <barChart
                            :chart-id="'echart_left_week'"
                            :chart-date="StandardList"
                            :weekNormalChart="true"
                            :y-type="yType"
                            class="daychart"
                        />
                    </div>
                    <div class="title_tips mb52"></div>
                    <div class="content_body">
                        <div class="body_title"><span>偏热空间</span><span class="tabletag taghot">偏热</span></div>
                        <el-table
                            size="mini"
                            :data="hotgirdDate"
                            :height="520"
                            :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
                        >
                            <el-table-column
                                label='序号'
                                prop
                                width='80'
                                type='index'
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="spaceName"
                                width='130'
                                label="空间名称"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="avgTemp"
                                width='100'
                                label="周均温度(°C)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="hotProprotion"
                                width='120'
                                label="周偏热不达标(%)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="serviceTime"
                                width='110'
                                label="周服务时长(h)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="validProprotion"
                                width='110'
                                label="周有效数据(%)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="hotNum"
                                width='120'
                                label="周累计热反馈数"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                label="解释"
                                align="center"
                            >
                                <template slot-scope='{row}'>
                                    <el-input
                                        v-model="row.hotRemark"
                                        size="small"
                                        maxlength="24"
                                        @blur="changeInput(row,'hot')"
                                    ></el-input>
                                </template>
                            </el-table-column>
                        </el-table>
                        <div class="body_title body_coldtitle"><span>偏冷空间</span><span class="tabletag tagclod">偏冷</span></div>
                        <el-table
                            size="mini"
                            :data="coldgirdDate"
                            :height="520"
                            :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
                        >
                            <el-table-column
                                label='序号'
                                prop
                                width='80'
                                type='index'
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="spaceName"
                                width='130'
                                label="空间名称"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="avgTemp"
                                width='100'
                                label="周均温度(°C)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="coldProprotion"
                                width='120'
                                label="周偏冷不达标(%)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="serviceTime"
                                width='110'
                                label="周服务时长(h)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="validProprotion"
                                width='110'
                                label="周有效数据(%)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="coldNum"
                                width='120'
                                label="周累计冷反馈数"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                label="解释"
                                align="center"
                            >
                                <template slot-scope='{row}'>
                                    <el-input
                                        v-model="row.coldRemark"
                                        maxlength="24"
                                        size="small"
                                        @blur="changeInput(row,'cold')"
                                    ></el-input>
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                </section>
                <!-- end 各达标区间空间数量分布及异常冷热空间列表 -->
                <!-- start 每日环境详情 -->
                <section
                    class="mb16"
                    v-show="envType=='Tdb'"
                >
                    <div class="content_title"><span>每日环境详情</span></div>
                    <Tabs
                        type="card"
                        :data="dayData"
                        v-model="tableItem"
                        class="daytabs"
                    />
                    <div v-if="dataDeal">
                        <div
                            class="pageitem_box"
                            v-for="(item,index) in daysDateCurrent"
                            :key="index"
                            :id="'list'+item.name"
                        >
                            <!-- <div class="content_title"><span>每日环境详情（周{{item.pname}}）</span></div> -->
                            <div class="content_body">
                                <div class="day_title oneday_title">逐刻平均温度及达标空间数量变化趋势</div>
                                <chartLegend
                                    class="charttext"
                                    :dot-line="true"
                                />
                                <lineChart
                                    :chart-id="'echart_top'+item.name"
                                    :chart-date="item.chartDate"
                                    :contant="true"
                                    :xType="hourType"
                                />
                                <barChart
                                    :chart-id="'echart_bottom'+item.name"
                                    :chart-date="item.chartDate"
                                    :numberChart="true"
                                    :x-type="hourType"
                                    :y-type="yType"
                                />
                                <div class="room_table">
                                    <div class="room_table_number">
                                        <div>室外温度(°C)</div>
                                        <div>
                                            <div
                                                v-for="(items,sgin)  in item.chartDate.outSideTemp"
                                                :key="sgin"
                                            >
                                                {{items}}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="twochart_box">
                                    <div>
                                        <div class="day_title">各房间日均温度分布</div>
                                        <barChart
                                            :chart-id="'echart_left'+item.name"
                                            :temp-color="true"
                                            :chart-date="item.chartDateLeft"
                                            :normalChart="true"
                                            :y-type="yType"
                                            class="daychart"
                                        />
                                    </div>
                                    <div>
                                        <div class="day_title">各楼层日均温及偏冷(热)空间数量</div>
                                        <lineChart
                                            :x-type="floorType"
                                            :chart-id="'echart_righttop'+item.name"
                                            :chart-date="item.chartDateRight"
                                            :contant="true"
                                            class="daylinechart"
                                        />
                                        <barChart
                                            :chart-id="'echart_rightbottom'+item.name"
                                            :x-type="floorType"
                                            :y-type="yType"
                                            :numberChart="true"
                                            :chart-date="item.chartDateRight"
                                            class="daybarchart"
                                        />
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
                <!-- end 每日环境详情 -->
                <!-- start 用户及名词解释 -->
                <section
                    class="mb16"
                    v-show="envType=='Tdb'"
                >
                    <div class="content_title"><span>用户活跃度统计（周）</span></div>
                    <div class="user_total">
                        <div v-if="projectId!=='Pj1101020002'">
                            <div>用户总数量</div>
                            <div><span>{{userDate.userRegistNum}}</span>人</div>
                        </div>
                        <div v-if="projectId!=='Pj1101020002'">
                            <div>周活跃用户数量</div>
                            <div><span>{{userDate.userActiveNum}}</span>人</div>
                        </div>
                        <div>
                            <div>用户与系统互动数量</div>
                            <div><span>{{userDate.userSysNum}}</span>次</div>
                        </div>
                        <div>
                            <div>用户问题反馈数量</div>
                            <div><span>{{userDate.UserFbNum}}</span>条</div>
                        </div>
                        <div>
                            <div>帮用户解决问题</div>
                            <div><span>{{userDate.solveFbNum}}</span>条</div>
                        </div>
                    </div>
                    <div class="content_title"><span>环境管理周报数据解释</span></div>
                    <section>
                        <div class="content_title_noline mb16">名词解释</div>
                        <ul class="paramlist ft12">
                            <li
                                v-for="(item,index) in expTerms"
                                :key="index"
                            >
                                <p><i></i><span><b>{{item.name}}：</b>{{item.content}}。</span></p>
                            </li>
                        </ul>
                    </section>
                    <section>
                        <div class="content_title_noline mb16">计算说明</div>
                        <ul class="paramlist paramlist_explain ft12">
                            <li>
                                <p><i></i><span><b>温度评价</b></span></p>
                                <p>“偏冷”、“舒适”、“偏热”。以平均温度的不同区间对应，区间对应如下：</p>
                                <div>
                                    <div class="hum_list">
                                        <div><img
                                                src="../../../../static/images/cold.png"
                                                alt=""
                                                srcset=""
                                            /> &ensp;偏冷 &nbsp;&nbsp;&nbsp; 平均温度&lt;20°C</div>
                                        <div><img
                                                src="../../../../static/images/happy.png"
                                                alt=""
                                                srcset=""
                                            /> &ensp;舒适 &nbsp;&nbsp;&nbsp;平均温度 20°C~25°C</div>
                                        <div><img
                                                src="../../../../static/images/hot.png"
                                                alt=""
                                                srcset=""
                                            /> &ensp;偏热 &nbsp;&nbsp;&nbsp;平均温度&gt;25°C</div>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <p><i></i><span><b>周达标率计算</b></span></p>
                                <div class="ml17">
                                    <p>单个空间当前时刻是否达标的判断方法:min(当前时刻服务定制温度下限，合同约定 温度范围下限)&lt;当前环境温度&lt;max(当前时刻服务定制温度上限，合同约定温度范 围上限)，满足上述区间内，视为达标;</p>
                                    <p>低于区间，视为偏冷;</p>
                                    <p>高于区间，视为偏热。</p>
                                </div>
                                <p class="ml17">所有空间一周时间达标率的判断方法:所有空间所有存在空调服务的累计时间中，判断为达标的时间占比，即周达标率。</p>
                                <p class="ml17">偏冷(热)率的计算如上。</p>
                            </li>
                        </ul>
                    </section>
                    <section>
                        <div class="content_title_noline mb16">合约与管控时间段</div>
                        <el-table
                            class="sj_table ft12"
                            :data="custormList"
                            :header-cell-style="{background:'#F8F9FA!important',padding:'6px 0'}"
                        >
                            <el-table-column
                                align="left"
                                width="40"
                            ></el-table-column>
                            <el-table-column
                                align="left"
                                prop="objectName"
                                label="空间组"
                            ></el-table-column>
                            <el-table-column
                                align="left"
                                label="合同约定温度达标区间"
                            >
                                <template slot-scope='{row}'>
                                    {{row.minValue}}~{{row.maxValue}}
                                </template>
                            </el-table-column>
                            <el-table-column
                                align="left"
                                label="环境保障时间段（工作日）"
                            >
                                <template slot-scope='{row}'>
                                    {{row.startTime&&(row.startTime.slice(0,2)+':'+row.startTime.slice(2,4))}}~{{row.endTime&&(row.endTime.slice(0,2)+':'+row.endTime.slice(2,4))}}
                                </template>
                            </el-table-column>
                            <el-table-column
                                align="left"
                                prop="dayType"
                                label="环境保障时间段（周末）"
                            ></el-table-column>
                        </el-table>
                    </section>
                </section>
                <!-- end 用户及名词解释 -->
            </section>
            <!-- end 本周环境温度概况 -->

        </div>
        <!-- 下载的页面 -->
        <div
            class="page_main"
            id="exportPdf"
        >
            <div class="page_header">
                <p>{{projectName}}环境管理周报告</p>
                <p>
                    <span style="font-size:16px;display:inherit;text-align:right;padding-top:10px">
                        总第{{totalReportCount}}期，{{moment(this.endDate).format("YYYY")}}年第{{yearReportNum}}期
                        <span style="margin:0 20px;font-size:16px"> {{this.startDate&&moment(this.startDate).format("YYYY.MM.DD")}}-{{this.endDate&&moment(this.endDate).format("YYYY.MM.DD")}}</span>
                    </span>
                </p>
            </div>
            <!-- start 环境概况 -->
            <section class="env_module title_one_table mb690">
                <div class="sj_title title_one">环境概况</div>
                <el-table
                    class="sj_table"
                    :data="surveyTable.slice(0,5)"
                    :row-class-name="tableRowClassName"
                    :header-cell-style="{background:'#3399ff  !important',color:'#ffffff',padding:'10px 0'}"
                >
                    <el-table-column
                        align="left"
                        label=""
                        width="30"
                    ></el-table-column>
                    <el-table-column
                        align="left"
                        prop="name"
                        label="环境参数"
                    ></el-table-column>
                    <el-table-column
                        align="left"
                        prop="weeknormalProprotion"
                        label="周达标率"
                    >
                        <template slot-scope='{row}'>
                            {{row.weeknormalProprotion+'%'}}
                        </template>
                    </el-table-column>
                    <el-table-column
                        align="left"
                        prop="weekAvg"
                        label="周平均"
                    >
                        <template slot-scope='{row}'>
                            {{row.weekAvg+row.unit}}
                        </template>
                    </el-table-column>
                    <el-table-column
                        align="left"
                        prop="assess"
                        label="评价"
                    ></el-table-column>
                </el-table>
                <div class="title_tips big_tips"><i class="el-icon-warning-outline"></i>数据来源：物联网传感器数据监测备份</div>
                <!-- 用户调节 -->
                <userAdjust
                    :projectId="projectId"
                    :energyDate="surveyTable[6]"
                    :userAdjust="surveyTable[5]"
                    class="mp40"
                />
            </section>
            <!-- end 环境概况 -->
            <!-- start 本周环境温度概况 -->
            <!-- 循环生成环境参数 -->

            <section
                class="env_module"
                :class="'mb'+mbList[index]"
                v-for="(item,index) in surveyTablenow"
                :key="index"
            >
                <div class="sj_title">{{item.name}}概况</div>
                <envSurvey
                    :surveyTable="item"
                    :envType="item.id"
                    :pdf-id="item.id"
                ></envSurvey>
                <div
                    class="pm_container"
                    v-if="item.id=='PM2d5'&&pdfPmDateShow"
                >
                    <p>各PM2.5浓度区间累计时长及占比</p>
                    <div class="pm_table">
                        <div class="left">
                            <div class="pm_chart">
                                <ringChart
                                    :chartId="'pm_chart1'+exportPdf+item.id"
                                    :color-arr="pmchartColor"
                                    :chart-date="pmDate"
                                />
                            </div>
                            <div class="pm_count">总空间数量：<span>{{chartweekDate.registeredSpaceNum&&chartweekDate.registeredSpaceNum.filter(Boolean)[0]}}</span>个</div>
                            <div class="title_tips"><i class="el-icon-warning-outline"></i>各评价标准累计时长一定程度上反映出当前建筑的整体PM2.5浓度所处的水平</div>
                        </div>
                        <div class="right">
                            <el-table
                                size="mini"
                                :data="pmDate"
                                :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
                            >
                                <el-table-column
                                    align="left"
                                    label=""
                                    width="30"
                                ></el-table-column>
                                <!--{assessStandard:"WELL铂金级",range:"0~15"},  -->
                                <el-table-column
                                    align="left"
                                    prop="name"
                                    label="评价标准"
                                ></el-table-column>
                                <el-table-column
                                    align="left"
                                    prop="evaluationScope"
                                    label="范围(μg/m3)"
                                ></el-table-column>
                                <el-table-column
                                    align="left"
                                    label="周累计时长(h)"
                                    prop="accumulatedTime"
                                ></el-table-column>
                                <el-table-column
                                    align="left"
                                    label="时长占比(%)"
                                    prop="proportion"
                                ></el-table-column>
                            </el-table>
                        </div>
                    </div>
                </div>
                <div
                    class="title_tips"
                    v-if="item.id=='Tdb'"
                ><i class="el-icon-warning-outline"></i>评价标准、达标标准、计算方法见数据解释</div>
                <div
                    v-if="item.id!=='Tdb'"
                    style="height:20px"
                ></div>
                <div class="content_title mp40"><span>{{contentTitle(item.id)}}</span></div>
                <div class="content_title_noline mb32">{{seccontentTitle(item.id)}}</div>
                <chartLegend
                    class="charttext_p"
                    :legend-type="item.id"
                    :num-type="false"
                />
                <!-- 折线图 -->
                <lineChart
                    v-if="!isUserorEngry(item.id)"
                    :chart-id="chartId+item.id"
                    :chart-date="chartweekDate"
                    :env-type="item.id"
                    :xType="dayType"
                />
                <!-- 柱状图 -->
                <barChart
                    :numberChart="isUserorEngry(item.id)"
                    :chart-id="chartId+item.id+'1'"
                    :key="item.id"
                    :chart-date="chartweekDate"
                    :env-type="item.id"
                    :xType="dayType"
                />
                <!-- 服务空间数 -->
                <div
                    class="room_table"
                    v-if="!isUserorEngry(item.id)"
                >
                    <div class="room_table_number">
                        <div>服务空间数(总：{{chartweekDate.registeredSpaceNum&&chartweekDate.registeredSpaceNum.filter(Boolean)[0]}})</div>
                        <div>
                            <div
                                v-for="(item,index)  in chartweekDate.daySpaceNum"
                                :key="index"
                            >
                                {{item}}
                            </div>
                        </div>
                    </div>
                </div>
                <div
                    class="room_table room_table_user"
                    v-if="item.id==='userAdjust'"
                >
                    <div class="room_table_number">
                        <div>异常热调节</div>
                        <div>
                            <div
                                v-for="(item,index)  in chartweekDate.feedbackAbnorHotNum"
                                :key="index"
                            >
                                {{item}}
                            </div>
                        </div>
                    </div>
                    <div
                        class="room_table_number"
                        :style="{'margin-top':0}"
                    >
                        <div>异常冷调节</div>
                        <div>
                            <div
                                v-for="(item,index)  in chartweekDate.feedbackAbnorColdNum"
                                :key="index"
                            >
                                {{item}}
                            </div>
                        </div>
                    </div>
                    <div
                        class="room_table_number"
                        :style="{'margin-top':0}"
                    >
                        <div>吹风调节</div>
                        <div>
                            <div
                                v-for="(item,index)  in chartweekDate.feedbackNoisyHotNum"
                                :key="index"
                            >
                                {{item}}
                            </div>
                        </div>
                    </div>
                </div>
                <section v-if="item.id=='Tdb'">
                    <div class="content_title_noline mb40"><span>逐刻平均温度及达标空间数量变化趋势</span></div>
                    <chartLegend
                        class="charttext_p charttext_mt mb40"
                        :num-type="false"
                    />
                    <lineChart
                        :chart-id="chartId+'zhou'+item.id"
                        :contant="true"
                        :chart-date="chartweekTemp"
                        :xType="hourType"
                    />
                    <barChart
                        :chart-id="chartId+'zhou1'+item.id"
                        :chart-date="chartweekTemp"
                        :xType="hourType"
                    />
                    <!-- <div class="title_tips"><i class="el-icon-warning-outline"></i>评价标准、达标标准、计算方法见数据解释</div> -->
                </section>
                <div class="addmark">
                    <div class="remarkshow remark_input">{{quarterRemark[item.id]}}</div>
                </div>
                <div
                    class="hcho_parame"
                    v-if="item.id=='HCHO'"
                >
                    <div class="content_title mp40"><span>异常空间</span><span>(超标率排序)</span></div>
                    <el-table
                        size="mini"
                        :height="216"
                        :data="hchogirdDate"
                        :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
                    >
                        <el-table-column
                            label='序号'
                            prop
                            width='80'
                            type='index'
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="spaceName"
                            width='130'
                            label="空间名称"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="abnormalProprotion"
                            width='130'
                            label="超标率(%)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="hchoAbnormalTime"
                            width='130'
                            label="超标时长(h)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="hchoMaxSolubility"
                            width='150'
                            label="峰值浓度(mg/m³)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            width='130'
                            label="峰值浓度评价"
                            align="left"
                        >
                            <template slot-scope='{row}'>
                                <span :style="{color:row.assess=='较高'?'#C6322B':'#1F2329'}">{{row.assess}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column
                            label="解释"
                            align="center"
                        >
                            <template slot-scope='{row}'>
                                {{row.hchoRemark}}
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
                <div
                    class="co2_parame"
                    v-if="item.id=='CO2'"
                >
                    <div class="content_title mp40"><span>异常空间</span><span>(超标率排序)</span></div>
                    <el-table
                        size="mini"
                        :height="216"
                        :data="co2girdDate"
                        :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
                    >
                        <el-table-column
                            label='序号'
                            prop
                            width='80'
                            type='index'
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="spaceName"
                            width='130'
                            label="空间名称"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="abnormalProprotion"
                            width='130'
                            label="超标率(%)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="co2AbnormalTime"
                            width='130'
                            label="超标时长(h)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="co2MaxSolubility"
                            width='150'
                            label="峰值浓度(ppm)"
                            align="left"
                        ></el-table-column>
                        <el-table-column
                            property="assess"
                            width='130'
                            label="峰值浓度评价"
                            align="left"
                        >

                            <template slot-scope='{row}'>
                                <span :style="{color:row.assess=='较高'?'#DCAA04':'#1F2329'}">{{row.assess}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column
                            label="解释"
                            align="center"
                        >
                            <template slot-scope='{row}'>
                                {{row.co2Remark}}
                                <!-- <el-input v-model="row.co2Remark" size="small" maxlength="24"  @blur="changeInput(row,'co2')"></el-input> -->
                            </template>
                        </el-table-column>
                    </el-table>
                    <div class="content_title_noline mp40 mb16">参数释义</div>
                    <ul class="paramlist ft12">
                        <li>
                            <p><span><b>CO₂：</b>通常作为建筑空间新风是否充足的量化参数</span></p>
                            <div>
                                <el-table
                                    class="co2table ft12"
                                    :data="co2Date"
                                    border
                                    :header-cell-style="{background:'#ffffff!important',color:'#606266',padding:'6px 0'}"
                                >
                                    <!-- <el-table-column width="30"></el-table-column> -->
                                    <el-table-column
                                        label="序号"
                                        type="index"
                                        width="60"
                                        align="left"
                                    ></el-table-column>
                                    <el-table-column
                                        label="CO₂浓度区间"
                                        prop="area"
                                        align="left"
                                        width="150"
                                    ></el-table-column>
                                    <el-table-column
                                        label="评价"
                                        prop="assess"
                                        align="left"
                                        width="200"
                                    ></el-table-column>
                                    <el-table-column
                                        label="环境感受"
                                        prop="feel"
                                        align="left"
                                    ></el-table-column>
                                </el-table>
                                <div class="title_tips"><i class="el-icon-warning-outline"></i>室外新鲜空气一般在 400～500ppm</div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div
                    class="rh_parame"
                    v-if="item.id=='RH'"
                >
                    <div class="content_title_noline mp40 mb16">参数解释</div>
                    <ul class="paramlist ft12">
                        <li>
                            <p><i></i><span><b>相对湿度</b></span></p>
                            <div style="margin-top:8px">评价空气中的水蒸气的相对含量</div>
                        </li>
                        <li>
                            <p><i></i><span><b>舒适范围</b></span></p>
                            <div>
                                <div class="hum_list">
                                    <div><span>供暖季</span>30%～60%</div>
                                    <div><span>供冷季</span>40%～60%</div>
                                    <div><span>过渡季</span>30%～60%</div>
                                </div>
                            </div>
                        </li>
                        <li>
                            <p><i></i><span><b>参数评价</b></span></p>
                            <p class="rh_img"><img
                                    src="../../../../static/images/hot.png"
                                    alt=""
                                />干燥:低于上述区间 </p>
                            <p class="rh_img"><img
                                    src="../../../../static/images/cold.png"
                                    alt=""
                                />偏湿:高于上述区间 </p>
                        </li>
                        <li>
                            <p><i></i><span><b>相对湿度的影响</b><br></span></p>
                            <div style="margin-top:8px">
                                高湿度可促进微生物病原体（如细菌、尘螨和霉菌）的聚集和生长，同时湿度过高可能会增加建筑材料释放气体：相对湿度增加 35%可使甲醛释放量增加 1.8-2.6 倍。 低湿度会导致气道、皮肤、眼 睛、咽喉和粘膜的干燥和刺激。也与病毒较长的存活率有关（活性失去较慢）
                            </div>
                        </li>
                    </ul>
                </div>
                <div
                    class="pm_parame"
                    v-if="item.id=='PM2d5'"
                >
                    <div class="content_title_noline mp40 mb16"><span>参数释义</span></div>
                    <ul class="paramlist ft12">
                        <li>
                            <p><i></i><span><b>PM2.5简介</b><br>大气中空气动力学当量直径小于或等于 2.5 微米的颗粒物，也称为可入肺颗粒物；</span></p>
                        </li>
                        <li>
                            <p><i></i><span><b>达标率</b><br>参数良好级别及以上，浓度≤75 μg/m3；超出此数值记为超限。</span></p>
                        </li>
                        <li>
                            <p><i></i><span>WELL标准中，对不同PM2.5浓度所在区间所能申请的标准(铂金级、金级、银级)，均有对应的先决条件。如:在 PM2.5 浓度为 20μg/m3，最高只能达到 WELL 金级标准。</span></p>
                        </li>
                    </ul>
                </div>
                <!-- start 环境温度分析 -->
                <section
                    class="mp400 mb730"
                    v-if="item.id=='Tdb'"
                >
                    <div class="content_title"><span>环境温度分析（空间维度）</span></div>
                    <div class="sj_reminder mb16">
                        <p>温馨提示：</p>
                        <p>1.空间划分维度：内外区、朝向、楼层、新风机组各自服务的空间四个维度，分别进行周不达标率分析计算。</p>
                        <p>2.数据表：每个空间划分维度均有对应的空间数量。</p>
                        <p>3.朝向维度仅外区空间，其中内区空间无朝向。</p>
                    </div>
                    <div class="sj_chartbox">
                        <div class="pr65">
                            <div class="day_title mb32">内、外区</div>
                            <barChart
                                :chart-id="'echart_left_out'+exportPdf"
                                :chart-date="localtionDate.regionsChart"
                                :sjChartType="'regions'"
                                class="daychart"
                            />
                            <div class="chart_sj_bottom mb10">
                                <div>空间数量</div>
                                <div class="chart_sj_bottom_main">

                                    <div
                                        v-for="(item,index) in localtionDate.regionsChart.spaceNum"
                                        :key="index"
                                    >{{item}}</div>
                                </div>
                            </div>
                        </div>
                        <div>
                            <div class="day_title mb32">各个朝向
                                <chartLegend
                                    :avgTemp="false"
                                    class="charttext"
                                />
                            </div>
                            <barChart
                                :chart-id="'echart_left_orientation'+exportPdf"
                                :chart-date="localtionDate.orientationChart"
                                :sjChartType="'orientation'"
                                class="daychart"
                            />
                            <div class="chart_sj_bottom mb10">
                                <div class="twoline">空间数量</div>
                                <div class="chart_sj_bottom_main">

                                    <div
                                        v-for="(item,index) in localtionDate.orientationChart.spaceNum"
                                        :key="index"
                                    >{{item}}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="sj_chartbox mp40">
                        <div class="pr65">
                            <div class="day_title mb32">各个楼层</div>
                            <barChart
                                :chart-id="'echart_left_floor'+exportPdf"
                                :chart-date="localtionDate.floorChart"
                                :sjChartType="'localtion'"
                                class="daychart"
                            />
                            <div class="chart_sj_bottom">
                                <div class="twoline">空间数量</div>
                                <div class="chart_sj_bottom_main">

                                    <div
                                        v-for="(item,index) in localtionDate.floorChart.spaceNum"
                                        :key="index"
                                    >{{item}}</div>
                                </div>
                            </div>
                        </div>
                        <div>
                            <!-- <div class="day_title mb32">新风机组服务的空间</div>
                                <barChart :chart-id="'echart_left_unit'+exportPdf" :chart-date="localtionDate.freshAirChart" :sjChartType="'freshAir'"  class="daychart"/>
                                <div class="chart_sj_bottom">
                                    <div class="twoline">空间数量</div>
                                    <div class="chart_sj_bottom_main">

                                    <div v-for="(item,index) in localtionDate.freshAirChart.spaceNum" :key="index">{{item}}</div>
                                    </div>
                                </div> -->
                        </div>
                    </div>
                    <div class="addmark addmarkhg">
                        <div
                            class="remarkshow remark_input"
                            v-show="typeRemark"
                        >{{typeRemark}}</div>
                    </div>
                </section>
                <!-- end 环境温度分析 -->
                <!-- start 各达标区间空间数量分布及异常冷热空间列表 -->
                <section
                    class="mb16"
                    v-if="item.id=='Tdb'"
                >
                    <div class="content_title"><span>各达标区间空间数量分布及异常冷热空间列表</span></div>
                    <div class="content_title_noline mb16">各达标区间空间数量分布</div>
                    <div class="up_distribution">
                        <div class="up_distribution_text"><span></span>达标率偏低,亟待解决</div>
                        <barChart
                            :chart-id="'echart_left_week'+exportPdf"
                            :chart-date="StandardList"
                            :weekNormalChart="true"
                            :y-type="yType"
                            class="daychart"
                        />
                    </div>
                    <div class="title_tips mb52"></div>
                    <div class="content_body mb475">
                        <div class="body_title"><span>偏热空间</span><span class="tabletag taghot">偏热</span></div>
                        <el-table
                            size="mini"
                            :data="hotgirdDate"
                            :height="396"
                            :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
                        >
                            <el-table-column
                                label='序号'
                                prop
                                width='80'
                                type='index'
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="spaceName"
                                width='130'
                                show-overflow-tooltip
                                label="空间名称"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="avgTemp"
                                width='100'
                                label="周均温度(°C)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="hotProprotion"
                                width='120'
                                label="周偏热不达标(%)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="serviceTime"
                                width='110'
                                label="周服务时长(h)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="validProprotion"
                                width='110'
                                label="周有效数据(%)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="hotNum"
                                width='120'
                                label="周累计热反馈数"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                label="解释"
                                align="left"
                            >
                                <template slot-scope='{row}'>
                                    {{row.hotRemark}}
                                </template>
                            </el-table-column>
                        </el-table>
                        <div class="body_title body_coldtitle"><span>偏冷空间</span><span class="tabletag tagclod">偏冷</span></div>
                        <el-table
                            size="mini"
                            :data="coldgirdDate"
                            :height="396"
                            :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
                        >
                            <el-table-column
                                label='序号'
                                prop
                                width='80'
                                type='index'
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="spaceName"
                                width='130'
                                show-overflow-tooltip
                                label="空间名称"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="avgTemp"
                                width='100'
                                label="周均温度(°C)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="coldProprotion"
                                width='120'
                                label="周偏冷不达标(%)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="serviceTime"
                                width='110'
                                label="周服务时长(h)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="validProprotion"
                                width='110'
                                label="周有效数据(%)"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                property="coldNum"
                                width='120'
                                label="周累计冷反馈数"
                                align="left"
                            ></el-table-column>
                            <el-table-column
                                label="解释"
                                align="left"
                            >
                                <template slot-scope='{row}'>
                                    {{row.coldRemark}}
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                </section>
                <!-- end 各达标区间空间数量分布及异常冷热空间列表 -->
                <section
                    v-if="dataDeal&&item.id=='Tdb'"
                    class="pageitem_box_list"
                >
                    <!--  -->
                    <div
                        class="pageitem_box"
                        v-for="(item,index) in daysDate"
                        :key="index"
                    >
                        <div class="content_title"><span>每日环境详情（周{{item.pname}}）</span></div>
                        <div
                            class="content_body"
                            :key="item.pname"
                        >
                            <div class="day_title oneday_title">逐刻平均温度及达标空间数量变化趋势</div>
                            <!--  :key="index+'dot'" -->
                            <chartLegend
                                class="charttext"
                                :dot-line="true"
                            />
                            <lineChart
                                :chart-id="'echart_top'+item.name+exportPdf"
                                :chart-date="item.chartDate"
                                :contant="true"
                                :xType="hourType"
                            />
                            <barChart
                                :chart-id="'echart_bottom'+item.name+exportPdf"
                                :chart-date="item.chartDate"
                                :numberChart="true"
                                :x-type="hourType"
                                :y-type="yType"
                            />
                            <div class="room_table">
                                <div class="room_table_number">
                                    <div>室外温度(°C)</div>
                                    <div>
                                        <div
                                            v-for="(items,sgin)  in item.chartDate.outSideTemp"
                                            :key="sgin"
                                        >
                                            {{items}}
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="twochart_box">
                                <div>
                                    <div class="day_title">各房间日均温度分布</div>
                                    <barChart
                                        :chart-id="'echart_left'+item.name+exportPdf"
                                        :chart-date="item.chartDateLeft"
                                        :normalChart="true"
                                        :y-type="yType"
                                        class="daychart"
                                    />
                                </div>
                                <div>
                                    <div class="day_title">各楼层日均温及偏冷(热)空间数量</div>
                                    <!-- <chartLegend class="charttext" :dot-line="true"/> -->
                                    <lineChart
                                        :x-type="floorType"
                                        :chart-id="'echart_righttop'+item.name+exportPdf"
                                        :chart-date="item.chartDateRight"
                                        :contant="true"
                                        class="daylinechart"
                                    />
                                    <barChart
                                        :chart-id="'echart_rightbottom'+item.name+exportPdf"
                                        :x-type="floorType"
                                        :y-type="yType"
                                        :numberChart="true"
                                        :chart-date="item.chartDateRight"
                                        class="daybarchart"
                                    />
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
                <!-- start 用户及名词解释 -->
                <div
                    v-if="item.id=='Tdb'"
                    :class="{'mp990':daysDate.length%2?true:false,'mp140':daysDate.length%2?false:true}"
                >
                    <div class="content_title"><span>用户活跃度统计（周）</span></div>
                    <div class="user_total">
                        <div v-if="projectId!=='Pj1101020002'">
                            <div>用户总数量</div>
                            <div><span>{{userDate.userRegistNum}}</span>人</div>
                        </div>
                        <div v-if="projectId!=='Pj1101020002'">
                            <div>周活跃用户数量</div>
                            <div><span>{{userDate.userActiveNum}}</span>人</div>
                        </div>
                        <div>
                            <div>用户与系统互动数量</div>
                            <div><span>{{userDate.userSysNum}}</span>次</div>
                        </div>
                        <div>
                            <div>用户问题反馈数量</div>
                            <div><span>{{userDate.UserFbNum}}</span>条</div>
                        </div>
                        <div>
                            <div>帮用户解决问题</div>
                            <div><span>{{userDate.solveFbNum}}</span>条</div>
                        </div>
                    </div>
                    <div class="content_title"><span>环境管理周报数据解释</span></div>
                    <section>
                        <div class="content_title_noline mb16">名词解释</div>
                        <ul class="paramlist ft12">
                            <li
                                v-for="(item,index) in expTerms"
                                :key="index"
                            >
                                <p><i></i><span><b>{{item.name}}：</b>{{item.content}}。</span></p>
                            </li>
                        </ul>
                    </section>
                    <section>
                        <div class="content_title_noline mb16">计算说明</div>
                        <ul class="paramlist paramlist_explain ft12">
                            <li>
                                <p><i></i><span><b>温度评价</b></span></p>
                                <p>“偏冷”、“舒适”、“偏热”。以平均温度的不同区间对应，区间对应如下：</p>
                                <div>
                                    <div class="hum_list">
                                        <div><img
                                                src="../../../../static/images/cold.png"
                                                alt="偏冷"
                                            /> &ensp;偏冷 &nbsp;&nbsp;&nbsp; 平均温度&lt;20°C</div>
                                        <div><img
                                                src="../../../../static/images/happy.png"
                                                alt="舒适"
                                            /> &ensp;舒适 &nbsp;&nbsp;&nbsp;平均温度 20°C~25°C</div>
                                        <div><img
                                                src="../../../../static/images/hot.png"
                                                alt="偏热"
                                            /> &ensp;偏热 &nbsp;&nbsp;&nbsp;平均温度&gt;25°C</div>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <p><i></i><span><b>周达标率计算</b></span></p>
                                <div class="ml17">
                                    <p>单个空间当前时刻是否达标的判断方法:min(当前时刻服务定制温度下限，合同约定 温度范围下限)&lt;当前环境温度&lt;max(当前时刻服务定制温度上限，合同约定温度范 围上限)，满足上述区间内，视为达标;</p>
                                    <p>低于区间，视为偏冷;</p>
                                    <p>高于区间，视为偏热。</p>
                                </div>
                                <p class="ml17">所有空间一周时间达标率的判断方法:所有空间所有存在空调服务的累计时间中，判断为达标的时间占比，即周达标率。</p>
                                <p class="ml17">偏冷(热)率的计算如上。</p>
                            </li>
                        </ul>
                    </section>
                    <section>
                        <div class="content_title_noline mb16">合约与管控时间段</div>
                        <el-table
                            class="sj_table ft12"
                            :height="620"
                            :data="custormList.slice(0,12)"
                            border
                            :header-cell-style="{background:'#F8F9FA!important',padding:'6px 0'}"
                        >
                            <!-- <el-table-column align="left" width="40" ></el-table-column> -->
                            <el-table-column
                                align="left"
                                prop="objectName"
                                label="空间组"
                            ></el-table-column>
                            <el-table-column
                                align="left"
                                label="合同约定温度达标区间"
                            >
                                <template slot-scope='{row}'>
                                    {{row.minValue}}~{{row.maxValue}}
                                </template>
                            </el-table-column>
                            <el-table-column
                                align="left"
                                label="环境保障时间段（工作日）"
                            >
                                <template slot-scope='{row}'>
                                    {{row.startTime&&(row.startTime.slice(0,2)+':'+row.startTime.slice(2,4))}}~{{row.endTime&&(row.endTime.slice(0,2)+':'+row.endTime.slice(2,4))}}
                                </template>
                            </el-table-column>
                            <el-table-column
                                align="left"
                                prop="dayType"
                                label="环境保障时间段（周末）"
                            ></el-table-column>
                        </el-table>
                    </section>
                </div>
                <!-- end 用户及名词解释 -->
            </section>

            <!-- end 本周环境温度概况 -->

        </div>
        <el-dialog
            title="提示"
            :visible.sync="emailVisible"
            :modal='false'
            :close-on-click-modal="false"
            width="30%"
        >
            <div
                class="nosend"
                v-if="!checkSendEmail"
            >
                是否将周报发送给
                <span
                    v-for="(items,k) in emailData"
                    :key="k"
                >
                    {{items.receiver}}:{{items.mailbox}}
                </span>
            </div>
            <div
                class="sended"
                v-if="checkSendEmail"
            >
                <span>已将周报发送给</span>
                <el-checkbox-group v-model="emailCheckList">
                    <el-checkbox
                        :label="items.id"
                        v-for="(items,k) in sendedUser"
                        :key="k"
                    >{{items.receiver}}</el-checkbox>
                </el-checkbox-group>
                <div v-show="noSendUser&&noSendUser.length">
                    <span>未将周报发送给</span>
                    <el-checkbox-group v-model="nosendCheckList">
                        <el-checkbox
                            :label="items.id"
                            v-for="(items,k) in noSendUser"
                            :key="k"
                        >{{items.receiver}}</el-checkbox>
                    </el-checkbox-group>
                </div>
                <span>是否继续发送</span>
            </div>
            <span
                slot="footer"
                class="dialog-footer"
            >
                <el-button
                    @click="emailVisible = false"
                    size="small"
                >取 消</el-button>
                <el-button
                    type="primary"
                    @click="sendEmail"
                    size="small"
                > 确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
import { mapGetters } from "vuex"
import { Tabs } from 'meri-design'
import lineChart from "./lineChart.vue"
import barChart from "./barChart.vue"
import ringChart from "./ringChart.vue"
import chartLegend from "./chartLegend.vue"
import envSurvey from "./envSurvey.vue"
import userAdjust from "./userAdjust.vue"
import moment from "moment"

import {    queryWeekday, querySubstandardList, queryDay, querysectionSpace, saveRemark, passEmail,
    querysectionFloor, queryStandardList, queryWeekSpace, queryUserActivity, queryTempRate, explainSave,
    querySeason, queryCustormList, queryEmail, queryPm2d5,queryWeekNumberHttp} from "@/api/ReportForm/ReportForm.js";
export default {
    props: {
        // comstartDate:{
        //     default:'',
        //     type:String
        // },

        // comendDate:{
        //     default:'',
        //     type:String
        // },
        // projectName:String
    },
    data() {
        return {
            totalReportCount: '',
            yearReportNum: '',
            pdfPmDateShow: false,
            mbList: [200, 200, 600, 520, 300, 900, 0],
            emailVisible: false,
            checkSendEmail: false,
            emailCheckList: [],
            nosendCheckList: [],
            chartweekDate: {},
            chartweekTemp: {},
            portDate: "",
            exportPdf: "exportPdf",
            co2Date: [
                {
                    area: "400～800",
                    assess: "新鲜空气",
                    feel: "无，与室外接近"
                },
                {
                    area: "800～1000",
                    assess: "达标",
                    feel: "无，高强度脑力劳动者可能会有轻微头晕感觉"
                },
                {
                    area: "1000～1500",
                    assess: "新风轻微不足",
                    feel: "感觉轻微头晕，头胀，伴随工作效率下降"
                },
                {
                    area: "1500～2000",
                    assess: "新风明显不足",
                    feel: "会有轻微头疼的感觉，无法继续工作"
                },
                {
                    area: "≥2000",
                    assess: "新风严重不足",
                    feel: "属空气严重污染，通常无新风补给，不建议常驻"
                }
            ],
            chartDate: {
                "date": "20200810", //日期
                "avgTemp": "",//平均温度
                "hotProprotion": 0, //偏热占比
                "coldProprotion": "",//偏冷占比
                "normalProprotion": 0, //正常占比
                "daySpaceNum": 0,//日服务空间数
                "registeredSpaceNum": "",//总注册空间数
            },
            chartId: 'linechart',
            dayType: "day",
            hourType: "hour",
            floorType: "floor",
            yType: "number",
            hotgirdDate: [],
            coldgirdDate: [],
            co2girdDate: [],
            hchogirdDate: [],
            daysDate: [],
            dataDeal: false,
            numIndex: 0,
            startDate: '',
            endDate: '',
            pickerOptions: {
                disabledDate(time) {
                    return time.getTime() > Date.now();
                },
            },
            chartModel: {

            },
            expTerms: [
                { name: '达标率', content: '按照合约范围约定的达标区间' },
                { name: '环比', content: '相对上周的数据进行比较' },
                { name: '时间维度', content: '日期、时刻等角度分析数据' },
                { name: '空间维度', content: '空间自身固有属性的角度分析数据' },
                { name: '内外区', content: '通常没有直接与室外关联的外窗的空间，划为内区，内区没有朝向之说' },
                { name: '朝向', content: '实际交付有 16 个朝向(含东北偏东)，最终划到四个朝向(东北偏东属于东)' },
                { name: '新风机组服务的空间', content: '每个空间都有唯一的新风机组为其服务，一台新风机组服务多个空间' },
                { name: '周偏热(冷)不达标率', content: '空调服务时间段内，偏热(冷)时长占比总时长' },
                { name: '周有效数据', content: '反映数据质量好坏，空调服务时间段内，传感器刨除数据丢包的数据量占比' },
            ],
            dayData: [],
            envType: 'Tdb',
            envTypelist: [
                {
                    name: '温度',
                    id: 'Tdb'
                },
                {
                    name: 'CO₂',
                    id: "CO2"
                },
                {
                    name: '甲醛',
                    id: "HCHO"
                },
                {
                    name: '相对湿度',
                    id: "RH"
                },
                {
                    name: 'PM2.5',
                    id: "PM2d5"
                },
                {
                    name: '用户调节',
                    id: "userAdjust"
                },
                {
                    name: '能源管理',
                    id: "energyManage"
                }
            ],
            tableItem: '',
            daysDateCurrent: [],
            surveyTable: [
                {                    name: "温度", id: 'Tdb', weeknormalProprotion: '', weekAvg: '--', img: 'happy', init: 1, assess: '', weekcoldProprotion: '', weekhotProprotion: '', unit: '°C', assessHotTable: [
                        { name: '偏冷', min: -50 }, { name: "舒适", min: 20 }, { name: "偏热", min: 25 }
                    ], assessColdTable: [
                        { name: '偏冷', min: -50 }, { name: "舒适", min: 20 }, { name: "偏热", min: 25 }
                    ]                },
                {                    name: "CO₂", id: "CO2", weeknormalProprotion: '', weekAvg: '', assess: '', img: 'happy', init: 0, unit: 'ppm', assessTable: [
                        { name: "新鲜空气", min: 400, type: "happy" }, { name: "达标", min: 800, type: "happy" }, { name: "新风轻微不足", min: 1000, type: "happy" }, { name: "新风明显不足", min: 1500, type: "hot" }, { name: "新风严重不足", min: 2000, type: "hot" }
                    ]                },
                {                    name: "甲醛", id: "HCHO", weeknormalProprotion: '', weekAvg: '', assess: '', img: 'happy', init: 2, unit: 'mg/m3', assessTable: [
                        { name: "符合国标", type: "happy", min: 0 }, { name: "超标", min: 0.1, type: "hot" }
                    ]                },
                {                    name: "相对湿度", id: "RH", weeknormalProprotion: '', weekAvg: '', init: 0, img: 'happy', assess: '', unit: '%', assessTable: [
                        { name: "干燥", type: "hot", min: 0 }, { name: "舒适", min: 30, type: "happy" }, { name: "湿润", min: 70, type: "cold" }
                    ]                },
                {                    name: "PM2.5", id: "PM2d5", weeknormalProprotion: '', weekAvg: '', assess: '', img: 'happy', init: 0, unit: 'ug/m3', assessTable: [
                        { name: "优", min: 0, type: "happy" }, { name: "良好", min: 50, type: "happy" }, { name: "轻度污染", min: 100, type: "hot" }, { name: "严重污染", min: 200, type: "hot" }
                    ]                },
                { name: "用户调节", id: "userAdjust", },
                { name: "能源管理", id: "energyManage", },
            ],
            imgList: ["cold", "happy", "hot"],
            StandardList: [],
            userDate: {
                "userRegistNum": 0,//注册用户数量
                "userActiveNum": 0,//周活跃用户数量
                "userSysNum": 0, //用户与系统互动数量
                "UserFbNum": 0,//用户问题反馈数量
                "solveFbNum": 0 //用户问题反馈数量
            },

            localtionTable: ['regionsChart', 'orientationChart', 'floorChart', 'freshAirChart'], //内外区 1 朝向 2 楼层 3 新风机组
            localtionDate: {
                regionsChart: {},
                orientationChart: {},
                floorChart: {},
                freshAirChart: {}
            },
            seasonType: '',
            hotStandardList: {},
            custormList: [],
            quarterRemark: {},
            typeRemark: "",
            typeRemarkEdit: false,
            quarterRemarkEdit: false,
            remarkId: {},
            reportImg: null,
            emailData: null,
            noSendUser: [],
            sendedUser: [],
            noEmailuser: true,
            isSpecialType: ["userAdjust", "energyManage"],
            pmDate: [
                { name: "WELL铂金级", range: "0~15" },
                { name: "WELL金级", range: "15~25" },
                { name: "优秀", range: "25～35" },
                { name: "良好", range: "35～75" },
                { name: "轻微污染", range: "75～115" },
                { name: "中度污染", range: "115～150" },
                { name: "重度污染", range: "150～250" },
                { name: "严重污染", range: ">250" },
            ],
            pmchartColor: ['#2EA121', '#8EE085', '#B7EDB1', '#D9F5D6', '#F8E6AB', '#FAD355', '#DCAA04', '#AA8303'],
        }
    },
    components: { lineChart, barChart, chartLegend, Tabs, ringChart, envSurvey, userAdjust },
    beforeMount() {
        // TODO 数据路由传参
        // console.log(this.$route,"---------------------------------------")
        // http://192.168.0.24:9906/weekpdf?startDate=20210118&endDate=20210124&projectName=你好&projectId=Pj1101080259
        this.comstartDate = this.$route.query.startDate;
        this.comendDate = this.$route.query.endDate;
        this.projectName = this.$route.query.projectName;
        this.projectId = this.$route.query.projectId;
        this.dataChange([this.comstartDate, this.comendDate])
    },
    async mounted() {
        this.indexMap = {
            Tdb: 9,
            RH: 10,
            CO2: 11,
            PM2d5: 12,
            HCHO: 13,
            userAdjust: 16,
            energyManage: 17
        }
        this.timeArray = this.generateTime();
        await this.getSeasontype();
        this.getWeekSpace('floor');
        this.getWeekSpace();
        this.getUserActivity();
        this.getTempRate();
        this.getStandardList();
        this.getCustormList();
        // this.getEmailDate();
        this.getPmdate();
        this.getWeekNumber();
    },
    methods: {
        moment,
        contentTitle(value) {
            if (value === "Tdb") {
                return '环境温度分析（时间维度）'
            }
            if (this.isUserorEngry) {
                return '趋势'
            }
            return '逐日详情'
        },
        seccontentTitle(value) {
            if (value === "Tdb") {
                return '逐14日环境达标率及平均温度变化趋势'
            }
            if (value == "userAdjust") {
                return '逐14日用户调节空间数量变化趋势'
            }
            if (value == "energyManage") {
                return '逐日电耗变化趋势'
            }
            return '逐日达标率及日浓度'
        },
        getPmdate() {
            const getParams = {
                "projectId": this.projectId,//项目id
                "startDate": this.startDate,
                "endDate": this.endDate,
            }
            queryPm2d5({ getParams }).then(res => {
                console.log(res);
                if (res.data) {
                    // 手动排序
                    res.data.sort((a, b) => {
                        return a.evaluationStandard - b.evaluationStandard
                    })
                    res.data.forEach((item, index) => {
                        item.proportion = parseInt(item.proportion * 100);
                        this.pmDate[index] = Object.assign(this.pmDate[index], item);
                    })
                    this.pdfPmDateShow = true;
                }

            })
        },
        toRemarkedit(value) {
            this[value + 'Edit'] = true;
        },
        saveRemark(value) {
            let postParams = {
                "id": this.remarkId[this.envType],
                "projectId": this.projectId,//项目id
                "startDate": this.startDate,
                "endDate": this.endDate,
                "year": this.startDate.slice(0, 4),
                "type": value == "typeRemark" ? 9 : this.indexMap[this.envType],//0 内外区 1 朝向 2 楼层 3 新风机组 4 温度 5 湿度 6 co2 7 pm2.5 8 甲醛 9, 周报备注
                "quarterRemark": this.quarterRemark[this.envType],//时刻备注
            }
            value == "typeRemark" && (postParams.typeRemark = this.typeRemark);
            saveRemark({ postParams }).then(res => {
                if (res.result == 'success') {
                    this.$message.success('保存成功');
                    this.remarkId[this.envType] = res.id || '';
                    this[value + 'Edit'] = false;
                }
            })

        },
        cancelRemark(value) {
            this[value + 'Edit'] = false;
        },
        tableRowClassName({ row, rowIndex }) {
            const passValue = ['舒适', '新鲜空气', '优', '符合国标', '达标'];
            if (!passValue.includes(row.assess)) {
                return 'warning-row';
            }
            return '';
        },
        getCustormList() {
            let postParams = {
                "criteria": {
                    "projectId": this.projectId,
                    "startDate": this.startDate
                }
            }
            // console.log(queryCustormList,77777)
            queryCustormList({ postParams }).then(res => {
                this.custormList = res.data || [];
                const weekType = {
                    WeekDay: "工作日",
                    Weekend: "周末",
                    Holiday: "假日"
                }
                this.custormList.forEach(item => {
                    item.dayType = (item.endMinValue ? (item.endMinValue.slice(0, 2) + ':' + item.endMinValue.slice(2, 4)) : '-') + '~' + (item.endMaxValue ? (item.endMaxValue.slice(0, 2) + ':' + item.endMaxValue.slice(2, 4)) : '-');

                })
            })
        },
        changeInput(e, type) {
            this.tableSave(e, type)
        },
        // 周报期数
        getWeekNumber() {
            let getParams = {
                projectId: this.projectId,
                startDate: this.startDate
            }
            queryWeekNumberHttp({ getParams }).then(res => {
                //  总共的周报数量totalReportCount  年当前期数yearReportNum
                this.totalReportCount = res.totalReportCount;
                this.yearReportNum = res.yearReportNum;
            })
        },
        async getSeasontype(falg = true) {
            let getParams = {
                projectId: this.projectId,
                dateTiime: falg ? this.startDate : this.endDate
            }
            await querySeason({ getParams }).then(res => {
                this.seasonType = res.content && res.content[0].seasonType || 'Warm';
            })
        },
        tableSave(e, type) {
            let getParams = {
                projectId: this.projectId,
                spaceId: e.spaceId,
                startDate: this.startDate,
            }
            getParams[type + 'Remark'] = e[type + 'Remark'];
            explainSave({ getParams }).then(res => {

            })
        },
        dataChange(value) {
            if (value) {
                this.startDate = moment(value[0]).format("YYYYMMDD");
                this.endDate = moment(value[1]).format("YYYYMMDD");
                this.portDate = [moment(value[0]), moment(value[1])];
                this.getweekDate(this.startDate, this.endDate);
                this.getTableList("hotProprotion", "hotgirdDate", "hotRemark");
                this.getTableList("coldProprotion", "coldgirdDate", "coldRemark");
                this.getTableList("co2AbnormalTime", "co2girdDate", "co2Remark", 1000);
                this.getTableList("hchoAbnormalTime", "hchogirdDate", "hchoRemark", 0.1);
                this.getDayDate();
            }
        },
        getWeekSpace(value) {
            let postParams = {
                "criteria": {
                    "projectId": this.projectId,
                    "startDate": this.startDate,
                    "endDate": this.endDate,
                    // "type":value,//0 内外区 1 朝向 2 楼层 3 新风机组 4 温度 5 湿度 6 co2 7 pm2.5 8 甲醛
                }
            }
            if (value) {
                postParams.criteria.type = 2;
            }
            queryWeekSpace({ postParams }).then(res => {
                if (!res.content) {
                    return
                }
                let obj = {};

                if (!value) {
                    let keyMap = {
                        11: "CO2",
                        13: "HCHO",
                        10: "RH",
                        12: "PM2d5",
                        9: "Tdb",
                        16: 'userAdjust',
                        17: 'energyManage'
                    }
                    this.localtionTable.forEach(item => {
                        !(item == 'floorChart') && (obj[item] = []);
                    })
                    res.content.forEach(item => {
                        if (item.type < 4) {
                            item.type !== 2 && obj[this.localtionTable[item.type]].push(item);
                        } else if (item.type <= 8) {
                            let ctypeMap = { 4: 0, 5: 3, 6: 1, 7: 4, 8: 2 };
                            let ctype = ctypeMap[item.type];
                            //4 5 6 7 8
                            if (ctype == 4) {
                                this.surveyTable[ctype].weekAvg = (typeof item.avgDate == "number") ? (item.avgDate * this.multipleInit(item.startDate, 'week')).toFixed(this.surveyTable[ctype].init) : '--';
                            } else {
                                this.surveyTable[ctype].weekAvg = (typeof item.avgDate == "number") ? item.avgDate.toFixed(this.surveyTable[ctype].init) : '--';
                            }
                            (typeof item.normalProprotion == "number") && (this.surveyTable[ctype].weeknormalProprotion = (item.normalProprotion * 100).toFixed(0));
                            (typeof item.coldProprotion == "number") && (this.surveyTable[ctype].weekcoldProprotion = (item.coldProprotion * 100).toFixed(0));
                            (typeof item.hotProprotion == "number") && (this.surveyTable[ctype].weekhotProprotion = (item.hotProprotion * 100).toFixed(0));
                            (typeof item.chainRatio == "number") && (this.surveyTable[ctype].chainRatio = (item.chainRatio * 100).toFixed(0));
                            (typeof item.coldChainRatio == "number") && (this.surveyTable[ctype].coldChainRatio = (item.coldChainRatio * 100).toFixed(0));
                            (typeof item.hotChainRatio == "number") && (this.surveyTable[ctype].hotChainRatio = (item.hotChainRatio * 100).toFixed(0));
                            (typeof item.overNormalProprotion == "number") && (this.surveyTable[ctype].overNormalProprotion = (item.overNormalProprotion * 100).toFixed(0));
                            (typeof item.partialDryRate == "number") && (this.surveyTable[ctype].partialDryRate = (item.partialDryRate * 100).toFixed(0));
                            (typeof item.partialHumidityRate == "number") && (this.surveyTable[ctype].partialHumidityRate = (item.partialHumidityRate * 100).toFixed(0));
                        } else if (item.type === 14 || item.type === 15) {
                            let ctypeMap = { 14: 5, 15: 6 };
                            let ctype = ctypeMap[item.type];
                            let intList = {
                                totalEnergy: 1,
                                acTotalEnergy: 1,
                                acColdHotTotalEnergy: 1,
                                acTerTotalEnergy: 1,
                                seTotalEnergy: 1,
                                othersTotalEnergy: 1,
                                monthEnergy: 1,
                                yearEnergy: 1,
                            }
                            for (let key in item) {
                                intList[key] && (item[key] = parseInt(item[key]));
                                this.$set(this.surveyTable[ctype], key, item[key]);
                            }
                        } else {
                            this.$set(this.quarterRemark, keyMap[item.type], item.quarterRemark || '');
                            !this.remarkId[keyMap[item.type]] && (this.remarkId[keyMap[item.type]] = item.id || '');
                            item.type == 9 && (this.typeRemark = item.typeRemark || '');
                        }
                    })
                    for (let k in obj) {
                        if (k == "orientationChart") {
                            obj[k] = obj[k].sort((a, b) => a.typeCategory - b.typeCategory)
                        }
                        this.localtionDate[k] = this.arreyInit(obj[k]) || {};
                    }
                    this.surveyTable.forEach((item, index) => {
                        if (item.weekAvg || item.weekAvg == 0) {
                            // 判断评价
                            item.assess = this.makeAssess(item, index);
                        }
                    })
                    this.surveyTable[0].img && (this.reportImg = require(`../../../../static/images/${this.surveyTable[0].img}.png`));

                } else {
                    obj.floorChart = res.content || [];
                    obj.floorChart = obj.floorChart.filter(item => item.objectName !== '楼顶');
                    this.localtionDate.floorChart = this.arreyInit(obj.floorChart) || {};
                }

            })
        },
        makeAssess(value, sgin) {
            let assessList = [];
            if (value.weekAvg == '--') {
                return '--'
            }
            assessList.push(Number(value.weekAvg));
            if (value.name == "温度" && this.seasonType) {
                if (this.seasonType !== "Warm") {
                    value.assessTable = value.assessColdTable || []
                } else {
                    value.assessTable = value.assessHotTable || [];
                }
            }
            value.assessTable && value.assessTable.forEach(item => {
                (typeof (item.min) === "number") && assessList.push(item.min);
            })
            assessList.sort((a, b) => a - b);
            let index = assessList.lastIndexOf(Number(value.weekAvg)) || 1;

            if (value.name == "温度") {
                this.surveyTable[sgin].img = this.imgList[index - 1];
            } else {
                this.$set(this.surveyTable[sgin], 'img', value.assessTable[index - 1].type || 'happy');
                // this.surveyTable[sgin].img = value.assessTable[index-1].type || 'happy';
            }
            return (value.assessTable[index - 1] && value.assessTable[index - 1].name) || '--';
        },
        getStandardList() {
            let postParams = {
                "criteria": {
                    "projectId": this.projectId,
                    "startDate": this.startDate
                }
            };
            queryStandardList({ postParams }).then(res => {
                this.StandardList = res.data || [];
            })
        },
        getUserActivity() {
            let postParams = {
                "criteria": {
                    "projectId": this.projectId,
                    starDate: this.startDate,
                    endDate: this.endDate,
                    // "createTime":{
                    //     "$gte":this.startDate.slice(0,4)+'-'+this.startDate.slice(4,6)+'-'+this.startDate.slice(6,8) ,
                    //     "$lte":this.endDate.slice(0,4)+'-'+this.endDate.slice(4,6)+'-'+this.endDate.slice(6,8)
                    // },
                },
            }
            queryUserActivity({ postParams }).then(res => {
                this.userDate = res;
            })
        },
        // 获取周逐刻
        getTempRate() {
            let postParams = {
                "criteria": {
                    "projectId": this.projectId,
                    "date": {
                        "$gte": this.startDate,
                        "$lte": this.endDate
                    },
                }
            }
            postParams.criteria.time = { $gte: "060000", $lte: "200000" };
            queryTempRate({ postParams }).then(res => {
                if (res.data) {
                    this.chartweekTemp = this.arreyInit(res.data);
                    this.chartweekTemp.coldSpaceProprotion && (this.chartweekTemp.coldProprotion = this.chartweekTemp.coldSpaceProprotion);
                    this.chartweekTemp.hotSpaceProprotion && (this.chartweekTemp.hotProprotion = this.chartweekTemp.hotSpaceProprotion);
                    this.chartweekTemp.normalSpaceProprotion && (this.chartweekTemp.normalProprotion = this.chartweekTemp.normalSpaceProprotion);
                }
            })
        },
        toDomposition(id) {
            document.querySelector('#' + id).scrollIntoView(true)
        },
        // 14天
        getweekDate(start, end) {
            start = moment(start).subtract('days', 7).format("YYYYMMDD");
            let postParams = {
                "criteria": {
                    "projectId": this.projectId,
                    "date": {
                        "$gte": start,
                        "$lte": end
                    }
                },
                orders: [
                    {
                        column: "date",
                        asc: true,
                    }
                ]
            }
            queryWeekday({ postParams }).then(res => {

                res.count ? (this.chartweekDate = this.arreyInit(res.content, 'custom')) : (this.chartweekDate = {});
            })

        },
        // 7天
        async getDayDate() {
            let postParams = {
                "criteria": {
                    "projectId": this.projectId,
                    "date": {
                        "$gte": this.startDate,
                        "$lte": this.endDate
                    }
                }
            }
            this.daysDate = [];
            this.numIndex = 0;
            // 周上
            let custompostParams = JSON.parse(JSON.stringify(postParams));
            custompostParams.criteria.time = { $gte: "060000", $lte: "200000" };
            custompostParams.orders = [{ "column": "time", "asc": "true" }];
            // Promise.all([
            //     queryDay({postParams:custompostParams}),
            //     querysectionSpace({postParams}),
            //     querysectionFloor({postParams})
            //     ]).then(data=>{
            //         console.log(data,"------------------------")
            //     })
            await queryDay({ postParams: custompostParams }).then(async res => {
                if (res.count) {
                    await this.getDategroup(res.content, "chartDate")
                } else {
                    this.getDategroup([], "chartDate")
                }
            })
            // 周左
            querysectionSpace({ postParams }).then(async res => {
                if (res.data) {
                    await this.getDategroup(res.data, "chartDateLeft");
                } else {
                    this.getDategroup([], "chartDateLeft")
                }
            })
            // 周右
            querysectionFloor({ postParams }).then(async res => {
                if (res.data) {
                    await this.getDategroup(res.data, "chartDateRight")
                } else {
                    this.getDategroup([], "chartDateRight")
                }
            })



        },
        getDategroup(value, type) {
            if (!Array.isArray(value)) {
                return
            }
            this.numIndex = this.numIndex + 1;
            let obj = {}
            value.map(v => {
                obj[v.date] = 0
            })
            let dataListlen = Object.keys(obj);
            let dataList = dataListlen;
            let result = dataList.map(v => {
                let resObj = { name: v, pname: this.getWeek(moment(v).format('E')) };
                resObj[type] = value.filter(_v => v == _v.date)
                return resObj
            })
            if (this.daysDate && this.daysDate.length) {
                this.daysDate.forEach(item => {
                    item = Object.assign(item, result.filter(_v => _v.name === item.name)[0])
                    if (type == "chartDate" && Array.isArray(item.chartDate)) {
                        item.chartDate = this.arreyInit(item.chartDate)
                    }
                    if (type == "chartDateRight" && Array.isArray(item.chartDateRight)) {
                        item.chartDateRight = this.arreyInit(item.chartDateRight)
                    }
                })
            } else {
                this.daysDate = result;
                this.daysDate.forEach(item => {
                    if (type == "chartDate" && Array.isArray(item.chartDate)) {
                        item.chartDate = this.arreyInit(item.chartDate)
                    }
                    if (type == "chartDateRight" && Array.isArray(item.chartDateRight)) {
                        item.chartDateRight = this.arreyInit(item.chartDateRight)
                    }
                })
            }
            this.dayData = [];
            let onceFlag = false;
            this.daysDate.forEach((item, index) => {
                if (!onceFlag) {
                    this.tableItem = index;
                    onceFlag = true;
                }
                let obj = {
                    name: `周${item.pname}`,
                    id: index
                }
                this.dayData.push(obj);
            })
        },
        initTableTime(serviceTime) {
            serviceTime = (serviceTime / 60)
            let stringnumber = serviceTime.toString();
            serviceTime = stringnumber.indexOf('.') === -1 ? serviceTime : serviceTime.toFixed(2);
            return serviceTime
        },
        getTableList(value, date, remark, assessNum) {

            let postParams = {
                "criteria": {
                    "projectId": this.projectId,
                    "startDate": this.startDate,
                },
                page: 1,
                size: 10,
                "orders": [{ "column": value, "asc": false }]//hotProprotion 偏热列表  coldProprotion 偏冷列表

            }
            querySubstandardList({ postParams }).then(res => {
                if (res.content) {
                    res.content.forEach(item => {
                        if (value == "hotProprotion") {
                            item.hotProprotion = parseInt(item.hotProprotion * 100);
                        } else {
                            item.coldProprotion = parseInt(item.coldProprotion * 100);
                        }
                        item.abnormalProprotion && (item.abnormalProprotion = parseInt(item.abnormalProprotion * 100));
                        item.validProprotion = typeof item.validProprotion == "number" ? parseInt(item.validProprotion * 100) : '--';
                        item.avgTemp = typeof item.avgTemp == "number" ? item.avgTemp.toFixed(1) : '--';
                        item.serviceTime && (item.serviceTime = this.initTableTime(item.serviceTime));
                        item.co2AbnormalTime && (item.co2AbnormalTime = this.initTableTime(item.co2AbnormalTime));
                        item.hchoAbnormalTime && (item.hchoAbnormalTime = this.initTableTime(item.hchoAbnormalTime));
                    })
                    res.content = res.content.filter(item => { return item.avgTemp !== '--' })
                }

                this[date] = res.content || [];
                this[date].length && this[date].forEach((item, index) => {
                    this.$set(this[date][index], remark, item[remark] || '');
                })
                if (value === "hotProprotion" || value === "coldProprotion") {
                    this[date] = this[date].filter((item, index) => {
                        return item[value] >= 10 && item.avgTemp !== '--';
                    })
                }
                if (value === "co2AbnormalTime" || value === "hchoAbnormalTime") {
                    this[date] = this[date].slice(0, 5);
                    this[date] = this[date].filter(item => {
                        if (value === "co2AbnormalTime") {
                            return item.co2MaxSolubility > assessNum
                        } else {
                            return item.hchoMaxSolubility > assessNum
                        }

                    })
                }
                assessNum && this[date].forEach(item => {
                    if (value === "co2AbnormalTime") {
                        item.assess = item.co2MaxSolubility > assessNum ? '较高' : '正常';
                        item.co2MaxSolubility = (typeof (item.co2MaxSolubility) == 'number') ? item.co2MaxSolubility.toFixed(0) : '--';
                    } else {
                        item.assess = item.hchoMaxSolubility > assessNum ? '较高' : '正常';
                        item.hchoMaxSolubility = item.hchoMaxSolubility.toFixed(2);
                    }

                })
            })
        },
        generateDate(startDate, day) {
            let start;
            let startList = [];
            for (let i = 0; i < day; i++) {
                start = moment(startDate);
                startList.push(start.add("days", i).format("YYYYMMDD"))
            }
            return startList
        },
        generateTime() {
            let Timearray = [
                "060000", "061500", "063000", "064500", "070000", "071500", "0,78000", "074500", "080000", "081500", "083000", "084500", "090000", "091500", "093000"
                , "094500", "100000", "101500", "103000", "104500", "110000", "111500", "113000", "114500", "120000", "121500", "123000", "124500"
                , "130000", "131500", "133000", "134500", "140000", "141500", "143000", "144500", "150000", "151500", "153000", "154500", "160000"
                , "161500", "163000", "164500", "170000", "171500", "173000", "174500", "180000", "181500", "183000", "184500", "190000", "191500"
                , "193000", "194500", "200000"
            ]
            return Timearray
        },
        arreyInit(arr, type) {
            if (arr && !arr.length) {
                return
            }
            if (type && type == 'custom') {
                let startTime = moment(this.startDate).subtract('days', 7).format("YYYYMMDD")
                let dataList = this.generateDate(startTime, 14);
                let copeArr = dataList.map(index => {
                    let items = arr.filter(v => index === v.date).length && arr.filter(v => index === v.date)[0];
                    items.avgPm2d5 && (items.avgPm2d5 = items.avgPm2d5 * this.multipleInit(items.date, 'day'));
                    let itemsModel = {
                        avgTemp: -9999,
                        coldLastTime: -9999,
                        coldProprotion: -9999,
                        createTime: -9999,
                        date: index,
                        daySpaceNum: -9999,
                        hotLastTime: -9999,
                        hotProprotion: -9999,
                        initializeServiceCustomizationTime: -9999,
                        normalLastTime: -9999,
                        normalProprotion: -9999,
                        registeredSpaceNum: -9999,
                    }
                    return items ? items : { ...itemsModel, ...items }
                })
                arr = copeArr;
            }
            const obj = {};
            let keysIndex = this.getKeysIndex(arr)
            let keysArr = arr[keysIndex] && Object.keys(arr[keysIndex]);
            keysArr.forEach(item => {
                obj[item] = [];
            })
            arr.forEach(item => {
                for (let keys in keysArr) {
                    if (!item.hasOwnProperty(keysArr[keys])) {
                        item[keysArr[keys]] = "-9999"
                    }
                }
                for (let key in item) {
                    item[key] = Number(item[key]) === -9999 ? null : item[key];
                    obj[key].push(item[key]);
                }
            });
            return obj
        },
        getWeek(week) {
            switch (Number(week)) {
                case 1:
                    return '一'
                case 2:
                    return '二'
                case 3:
                    return '三'
                case 4:
                    return '四'
                case 5:
                    return '五'
                case 6:
                    return '六'
                case 7:
                    return '日'
                default:
                    return '--'
            }
        },
        getKeysIndex(arr) {
            let value = JSON.parse(JSON.stringify(arr));
            let valueArr = value.map(item => {
                return item && Object.keys(item).length || 0
            });
            // let valueCope = value.filter(Boolean);
            let valueCope = Math.max.call(null, ...valueArr);
            return valueArr.indexOf(valueCope)
        },
        exportClick() {
            this.getPdf('exportPdf', `${this.projectName} - 环境周报 ${moment(this.startDate).format("MM.DD")}~${moment(this.endDate).format("MM.DD")}`, `${this.projectName}`)
        },
        getEmailDate() {
            let postParams = {
                "criteria": {
                    "projectId": this.projectId,
                },
                "orders": [
                    {
                        "column": "updateTime",
                        "asc": false
                    }
                ]
            }

            queryEmail({ postParams }).then(res => {
                if (res.count) {
                    this.emailData = res.content;
                    this.noEmailuser = false;
                } else {
                    this.noEmailuser = true
                }
            })
        },
        emailClick() {
            // sagacloud-pdf-pages
            let sendTime = moment().week(moment().week()).startOf('week').valueOf();
            let postParams = {
                "criteria": {
                    "projectId": this.projectId,
                    "sendTime": {
                        "$gte": sendTime + ''  //  本周的开始时间，用于查询出已经发出过周报的邮箱
                    }
                },
                "orders": [
                    {
                        "column": "updateTime",
                        "asc": false
                    }
                ]
            }

            queryEmail({ postParams }).then(res => {
                if (res.count) {
                    // 已发送
                    this.checkSendEmail = true;
                    this.sendedUser = [];
                    this.noSendUser = [];
                    res.content.forEach(item => {
                        if (item.emailRecords && item.emailRecords.length) {
                            // 已发送的数据
                            this.sendedUser.push(item);
                        } else {
                            // 未发送的数据
                            this.noSendUser.push(item);
                        }
                    })
                }
                if (this.noSendUser.length === res.count) {
                    // 未发送
                    this.checkSendEmail = false
                }
                this.emailVisible = true;
            })
        },
        sendEmail() {

            let postParams = {
                ids: [],
                lastWeekMonday: this.startDate,
                lastWeekSunday: this.endDate
            }
            if (!this.checkSendEmail) {
                this.emailData.forEach((item) => {
                    postParams.ids.push(item.id)
                })
            } else {
                postParams.ids = this.emailCheckList.concat(this.nosendCheckList)
            }
            passEmail({ postParams }).then(res => {
                if (res.result = "success") {
                    this.$message.success('发送成功')
                } else {
                    this.$message.error; ('发送失败')
                }
                this.emailVisible = false;
            })
        },
        multipleInit(valDate, dateFlag) {
            // 根据项目 和 日期判断数值 
            // 博瑞尚格 且 week 小于 5月3日 ; day 小于 5月8日的   乘1000
            valDate = Number(valDate);
            if (this.projectId === "Pj1101080259") {
                if ((dateFlag === 'week' && valDate < 20210503) || (dateFlag === 'day' && valDate < 20210508)) {
                    return 1000;
                }

            }
            return 1
        },

    },
    watch: {
        comstartDate: {
            handler(newval) {
                this.comstartDate = newval;
                if (!this.comstartDate) {
                    return
                }
                this.dataChange([this.comstartDate, this.comendDate])
            },
            immediate: true
        },
        portDate(newval) {
            this.portDate = newval;
        },
        tableItem() {
            this.daysDateCurrent[0] = this.daysDate[this.tableItem];
        },
        chartweekDate: {
            handler(newval) {
                this.chartweekDate = newval;
            },
            deep: true
        },
        daysDate: {
            handler(newval) {
                this.daysDate = newval;
            },
            deep: true
        },
        numIndex(newval) {
            if (this.numIndex == 3) {
                this.daysDate = this.daysDate.filter(item => {
                    if (!!(item.chartDate || item.chartDateRight || (item.chartDateLeft && item.chartDateLeft.length))) {
                        return item
                    }
                })
                this.daysDate.forEach(item => {
                    let timeObj = item.chartDate.time;
                    (timeObj && timeObj.length !== 57) && this.timeArray.forEach((items, index) => {
                        if (!timeObj.includes(items)) {
                            item.chartDate.avgTemp && item.chartDate.avgTemp.splice(index, 0, null)
                            item.chartDate.coldSpaceNum && item.chartDate.coldSpaceNum.splice(index, 0, 0)
                            item.chartDate.coldSpaceProprotion && item.chartDate.coldSpaceProprotion.splice(index, 0, 0)
                            item.chartDate.hotSpaceNum && item.chartDate.hotSpaceNum.splice(index, 0, 0)
                            item.chartDate.hotSpaceProprotion && item.chartDate.hotSpaceProprotion.splice(index, 0, 0)
                            item.chartDate.normalSpaceNum && item.chartDate.normalSpaceNum.splice(index, 0, 0);
                            item.chartDate.normalSpaceProprotion && item.chartDate.normalSpaceProprotion.splice(index, 0, 0);
                            !item.chartDate.outSideTemp && (item.chartDate.outSideTemp = []);
                            (items.slice(1) == '0000') ? item.chartDate.outSideTemp.splice(Number(items.slice(0, 2)) - 6, 0, '-') : item.chartDate.outSideTemp.splice(index, 0, null);
                            item.chartDate.spaceNum && item.chartDate.spaceNum.splice(index, 0, 0);
                            item.chartDate.time.splice(index, 0, items);
                        }
                    })
                })
                this.dataDeal = true;
            } else {
                this.dataDeal = false;
            }
        }
    },
    computed: {
        // ...mapGetters(['projectId']),
        isUserorEngry() {
            return function (value) {
                if (value) {

                    return this.isSpecialType.includes(value)
                }
                return this.isSpecialType.includes(this.envType)
            }
        },
        currentEnv() {
            return this.surveyTable.findIndex(item => {
                return item.id == this.envType
            })
        },

        envTypelistnow() {
            if (this.projectId !== "Pj1101080259") {
                return this.envTypelist.slice(0, 6)
            }
            return this.envTypelist
        },
        surveyTablenow() {
            if (this.projectId !== "Pj1101080259") {
                return this.surveyTable.slice(0, 6)
            }
            return this.surveyTable
        }
        // slicesurveyTable(){
        //     return this.surveyTable.slice(0,5)
        // }
    },
}
</script>

<style lang="less" scoped>
.sended {
    line-height: 25px;
}
.download_box {
    display: flex;
    justify-content: flex-end;
    padding: 20px 20px 0 0;
    //    margin-bottom: 20px;
    .ml20 {
        margin-left: 20px;
    }
}
.mp40 {
    margin-top: 40px;
}
.mp80 {
    margin-top: 170px;
}
.mp990 {
    margin-top: 1020px;
}
.mp140 {
    margin-top: 90px;
}
.mp400 {
    margin-top: 620px;
}
.marginList(@Name,@number) {
    .mb@{number} {
        margin-@{Name}: @number*1px;
    }
}
@bottom: 0, 5, 10, 16, 32, 40, 52, 100, 180, 200, 250, 300, 380, 430, 350, 475,
    480, 330, 450, 500, 520, 600, 690, 730, 900;
.loopMarginList(@i) when (@i < (length(@bottom)+1)) {
    .marginList(bottom, extract(@bottom, @i));
    .loopMarginList(@i+1);
}
.loopMarginList(1);
.pr65 {
    padding-right: 65px;
}
.addmarkhg {
    height: 200px;
}
.addmark {
    user-select: none;
    margin-top: 30px;
    .remark_txt {
        padding-bottom: 12px;
        color: #1f2429;
        font-size: 14px;
    }
    .remarkshow {
        width: 100%;
        height: 80px;
        background: #f7f7f7;
        padding: 10px;
        box-sizing: border-box;
        border-radius: 8px;
    }
    .remark_input {
        margin-bottom: 20px;
    }
}
.ml17 {
    margin: 0 0 20px 31px;
    position: relative;
    &::before {
        content: "";
        display: inline-block;
        position: absolute;
        top: 7px;
        left: -15px;
        width: 6px;
        height: 6px;
        border-radius: 50%;
        border: 1px solid #8d9399;
    }
    & > p {
        margin: 0 0 8px 0;
    }
}

.page_main {
    width: 1300px; //最合适宽度
    margin: auto;
    position: relative;
    background: #f7f9fa;
    .page_header {
        text-align: center;
        // background: #ffffff;
        position: relative;
        padding: 40px 0 28px; //60px
        padding-top: 10px;
        font-size: 30px;
        color: rgba(31, 36, 41, 1);
        span {
            font-size: 24px;
            font-family: serif;
        }
        .pname {
            position: absolute;
            font-size: 24px;
            right: 40px;
            top: 49px;
        }
    }
    .title_one_table {
        & > .sj_table {
            font-size: 16px;
        }
    }
    .env_module {
        background: #ffffff;
        // overflow: hidden;
        border-radius: 8px;
        padding: 24px 0 48px 20px;
        & /deep/ .el-table thead > tr {
            background: #f8f9fa;
        }
        & /deep/ .el-table .warning-row {
            background: #fff5e9;
            color: #de7802;
        }
        .daytabs {
            margin-left: 16px;
        }
        .sj_title {
            text-align: center;
            margin: 28px auto 36px;
            font-size: 24px;
            color: #1f2429;
            line-height: 24px;
        }
        .title_one {
            font-size: 26px;
        }
        .pm_container {
            & > p {
                font-size: 16px;
                color: #1f2429;
                padding: 26px 0;
            }
            .pm_table {
                display: flex;
                .left {
                    flex: 1;
                    padding: 0 50px 0 10px;
                    .pm_chart {
                        height: 250px;
                    }
                    .pm_count {
                        font-size: 14px;
                        margin-bottom: 15px;
                        span {
                            font-size: 20px;
                        }
                    }
                }
                .right {
                    margin-right: 52px;
                    width: 679px;
                    & /deep/ .el-table--mini td,
                    .el-table--mini th {
                        padding: 8px 0;
                    }
                }
            }
        }
        .sj_table {
            margin-bottom: 18px;
        }
        .title_tips {
            font-size: 12px;
            font-weight: 400;
            color: #8d9399;
            line-height: 20px;
            & > i {
                margin-right: 5px;
            }
        }
        .big_tips {
            font-size: 14px;
        }
        .charttext_p {
            float: right;
            margin-top: 7px;
        }
        .charttext {
            float: right;
        }
        .content_title {
            font-size: 20px;
            // display: inline-block;
            margin-bottom: 24px;
            &::before {
                content: "";
                display: inline-block;
                width: 4px;
                height: 20px;
                margin: 4px 8px 0 0;
                background-color: rgba(51, 153, 255, 1);
            }
            span {
                vertical-align: top;
            }
            span:nth-child(2) {
                font-size: 16px;
                vertical-align: text-top;
                color: #646a73;
            }
        }
        .content_title_gray {
            font-size: 16px;
            line-height: 28px;
            &::before {
                background-color: #8d9399;
            }
        }
        .content_title_noline {
            font-size: 16px;
            color: #1f2429;
            line-height: 22px;
            margin-left: 12px;
            display: inline-block;
        }
        .room_table {
            height: 56px;
            margin: 0px 0 40px -30px;
            & > div {
                display: flex;
                flex-direction: row;
                align-items: center;
                padding: 0 10px;
                & > div:nth-child(1) {
                    width: 80px;
                    margin-right: 5px;
                }
                & > div:not(:first-child) {
                    text-align: center;
                    min-width: 40px;
                }
                & > div {
                    // margin-right: 33px;
                    // margin-right: 42.5px;
                    margin-right: 46.5px;
                }
            }
            .room_table_name {
                background: #f8f9fa;
                height: 32px;
            }
            .room_table_number {
                position: relative;
                display: flex;
                font-size: 14px;
                & > div:nth-child(1) {
                    position: absolute;
                    left: 10px;
                    width: 71px;
                    line-height: 16px;
                }
                & > div:nth-child(2) {
                    flex: 1;
                    display: flex;
                    padding-left: 65px;
                    justify-content: space-around;
                    & > div {
                        min-width: 9px;
                        min-width: 13px;
                    }
                }
                margin-top: 8px;
                height: 36px;
                line-height: 36px;
                border-bottom: 1px solid #eeeeee;
                border-top: 1px solid #eeeeee;
                // line-height: 50px;
            }
        }
        .room_table_user {
            height: auto;
        }
        .paramlist {
            padding: 0 0 0 12px;
            color: #8d9399;
            .rh_img {
                display: flex;
                align-items: center;
                margin: 8px 0 0 9px;
                img {
                    width: 16px;
                    height: 16px;
                    margin-right: 4px;
                }
            }
            & > li {
                margin: 0 0 20px 0;
                & > p i {
                    display: inline-block;
                    width: 6px;
                    height: 6px;
                    margin-right: 7px;
                    // background: #0091FF;
                    background: #8d9399;
                    border-radius: 50%;
                }
                .co2table {
                    margin: 16px 0;
                }
                .hum_list {
                    display: flex;
                    align-items: center;
                    margin: 15px 0 9px 10px;
                    color: #2b3036;
                    div {
                        // width: 182px;
                        padding: 0 16px;
                        height: 32px;
                        display: flex;
                        margin-right: 53px;
                        justify-content: center;
                        align-items: center;
                        background: #f8f9fa;
                        border-radius: 16px;
                        img {
                            width: 16px;
                            height: 16px;
                        }
                        span {
                            margin: 0 10px 0 5px;
                        }
                    }
                }
            }
        }
        .paramlist_explain {
            & > li > p:nth-child(1) {
                margin: 0 0 8px 0;
            }
        }
        .sj_survey {
            display: flex;
            padding: 0 31px;
            margin: 0 0 14px;
            .sj_survey_left {
                display: flex;
                min-width: 160px;
                max-width: 160px;
                flex-direction: column;
                border-right: 1px solid #eff0f1;
                & > span {
                    font-size: 14px;
                    color: #646a73;
                    line-height: 19px;
                }
                .avgtemp {
                    font-size: 42px;
                    font-weight: 500;
                    color: #1f2329;
                    line-height: 59px;
                    & > span {
                        font-size: 24px;
                    }
                }
                .tempstatus {
                    width: 96px;
                    height: 26px;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    background: #f4f6f9;
                    border-radius: 16px;
                    color: #8d9399;
                    img {
                        width: 16px;
                        height: 16px;
                        margin-right: 6px;
                    }
                }
            }
            .sj_survey_right {
                display: flex;
                .survey_chart {
                    width: 128px;
                    height: 128px;
                    margin: 0 82px 0 63px;
                }
                .right_ratelist {
                    display: flex;
                    flex-direction: row;
                    .rate_item {
                        margin-right: 106px;
                        & > div:nth-child(1) {
                            font-size: 14px;
                            color: #646a73;
                            line-height: 19px;
                        }
                        & > div:nth-child(2) {
                            margin-top: 12px;
                            font-size: 14px;
                            color: #646a73;
                            line-height: 19px;
                            div {
                                font-size: 28px;
                                color: #1f2329;
                                line-height: 37px;
                                & > span {
                                    font-size: 12px;
                                }
                            }
                            p {
                                font-size: 12px;
                                color: #646a73;
                                line-height: 17px;
                                img {
                                    width: 9px;
                                    height: 12px;
                                    margin-left: 12px;
                                }
                            }
                        }
                    }
                }
            }
        }
        .sj_reminder {
            width: 100%;
            padding: 16px 24px 0;
            height: 136px;
            background: #f8f9fa;
            border-radius: 12px;
            & > p {
                font-size: 14px;
                font-weight: 400;
                color: #646c73;
                line-height: 24px;
            }
            & > p:first-child {
                color: #8d9399;
                margin-bottom: 5px;
            }
        }
        .sj_chartbox {
            display: flex;
            padding: 0 15px;
            & > div {
                flex: 1;
                .day_title {
                    font-size: 16px;
                    color: #1f2429;
                    line-height: 22px;
                }
                .chart_sj_bottom {
                    display: flex;
                    position: relative;
                    height: 36px;
                    line-height: 36px;
                    border-bottom: 1px solid #eeeeee;
                    border-top: 1px solid #eeeeee;
                    & > div:nth-child(1) {
                        position: absolute;
                    }
                    .twoline {
                        left: -22px;
                        width: 37px;
                        line-height: 16px;
                    }
                    .chart_sj_bottom_main {
                        flex: 1;
                        display: flex;
                        justify-content: space-around;
                    }
                }
            }
        }
        .up_distribution {
            height: 255px;
            position: relative;
            .up_distribution_text {
                position: absolute;
                top: 0;
                right: 400px;
                span {
                    display: inline-block;
                    width: 12px;
                    height: 12px;
                    margin-right: 10px;
                    background: #ff0000;
                }
            }
        }
        .content_body {
            padding: 10px;
            .body_title {
                overflow: hidden;
                line-height: 44px;
                height: 44px;
                font-size: 14px;
                margin-bottom: 12px;
                border-radius: 4px;
                background: #f8f9fa;
                width: 100%;
                &::before {
                    content: "";
                    display: inline-block;
                    width: 7px;
                    height: 44px;
                    margin: 0px 8px 0 0;
                    background-color: #f9908b;
                }
                span {
                    vertical-align: top;
                }
                .temptable {
                    height: 400px !important;
                }
                .tabletag {
                    display: inline-block;
                    // height: 32px;
                    padding: 0 10px;
                    line-height: 18px;
                    font-size: 12px;
                    border-radius: 2px;
                    box-sizing: border-box;
                    white-space: nowrap;
                    margin: 13px 10px;
                    width: 44px;
                    height: 18px;
                }
                .taghot {
                    background: #fde3e2;
                    color: #ac2f28;
                }
                .tagclod {
                    background: #e1f2ff;
                    color: #0065b3;
                }
            }
            .day_title {
                display: inline-block;
                height: 22px;
                font-size: 16px;
                color: rgba(31, 36, 41, 1);
                line-height: 22px;
            }
            .oneday_title {
                margin-bottom: 50px;
            }
            .body_coldtitle {
                margin-top: 40px;
                &::before {
                    background-color: #0091ff;
                }
            }
            .twochart_box {
                display: flex;
                flex-direction: row;
                & > div {
                    flex: 1;
                    .daychart {
                        min-width: 488px;
                        height: 285px;
                    }
                    .daylinechart {
                        margin-top: 25px;
                    }
                    .daybarchart {
                        height: 180px;
                    }
                }
            }
        }
        .user_total {
            display: flex;
            flex-wrap: nowrap;
            height: 54px;
            margin-bottom: 48px;
            padding: 0 0 0 10px;
            & > div {
                display: flex;
                flex: 1;
                justify-content: center;
                flex-direction: column;
                align-items: center;
                border-left: 1px solid #eff0f1;
                & > div {
                    max-width: 130px;
                    min-width: 130px;
                    text-align: left;
                }
                & > div:nth-child(1) {
                    font-size: 14px;
                    color: #646a73;
                    line-height: 19px;
                }
                & > div:nth-child(2) {
                    font-size: 12px;
                    color: #000000;
                    line-height: 27px;
                    span {
                        font-size: 20px;
                    }
                }
            }
            & > div:nth-child(1) {
                border-left: 1px solid transparent;
                align-items: flex-start;
            }
        }
        .ft12 {
            font-size: 12px;
        }
    }
    .todom_box {
        padding: 0 20px 20px;
        font-size: 14px;
        color: rgb(0, 145, 255);
        & > div {
            margin-top: 15px;
            cursor: pointer;
        }
    }
    .pageitem_box {
        padding: 20px;
        margin-bottom: 16px;
        border-radius: 8px;
        background: #ffffff;
        .charttext_p {
            float: right;
            margin-top: 7px;
        }
        .charttext {
            float: right;
        }
        .content_title {
            font-size: 20px;
            // font-weight: bold;
            display: inline-block;
            margin-bottom: 12px;
            &::before {
                content: "";
                display: inline-block;
                width: 4px;
                height: 20px;
                margin: 4px 8px 0 0;
                background-color: rgba(51, 153, 255, 1);
            }
            span {
                vertical-align: top;
            }
            span:nth-child(2) {
                font-size: 16px;
                vertical-align: text-top;
                color: #646a73;
            }
        }
        .room_table {
            height: 56px;
            margin: 0px 0 0 -30px;
            & > div {
                display: flex;
                flex-direction: row;
                align-items: center;
                padding: 0 10px;
                & > div:nth-child(1) {
                    width: 80px;
                    margin-right: 5px;
                }
                & > div:not(:first-child) {
                    text-align: center;
                    min-width: 40px;
                }
                & > div {
                    margin-right: 33px;
                }
            }
            .room_table_name {
                background: #f8f9fa;
                height: 32px;
            }
            .room_table_number {
                position: relative;
                display: flex;
                & > div:nth-child(1) {
                    position: absolute;
                    left: 10px;
                    width: 65px;
                    line-height: 16px;
                }
                & > div:nth-child(2) {
                    flex: 1;
                    display: flex;
                    padding-left: 65px;
                    justify-content: space-around;
                    & > div {
                        min-width: 9px;
                    }
                }
                margin-top: 8px;
                height: 36px;
                line-height: 36px;
                border-bottom: 1px solid #eeeeee;
                border-top: 1px solid #eeeeee;
            }
        }
        .content_body {
            padding: 10px;
            .body_title {
                overflow: hidden;
                line-height: 44px;
                height: 44px;
                font-size: 14px;
                // display: inline-flex;
                margin-bottom: 12px;
                border-radius: 4px;
                background: #f8f9fa;
                width: 100%;
                &::before {
                    content: "";
                    display: inline-block;
                    width: 7px;
                    height: 44px;
                    margin: 0px 8px 0 0;
                    background-color: #f9908b;
                }
                span {
                    vertical-align: top;
                }
                .temptable {
                    height: 400px !important;
                }
                .tabletag {
                    display: inline-block;
                    // height: 32px;
                    padding: 0 10px;
                    line-height: 18px;
                    font-size: 12px;
                    border-radius: 2px;
                    box-sizing: border-box;
                    white-space: nowrap;
                    margin: 13px 10px;
                    width: 44px;
                    height: 18px;
                }
                .taghot {
                    background: #fde3e2;
                    color: #ac2f28;
                }
                .tagclod {
                    background: #e1f2ff;
                    color: #0065b3;
                }
            }
            .day_title {
                display: inline-block;
                height: 22px;
                font-size: 16px;
                color: rgba(31, 36, 41, 1);
                line-height: 22px;
            }
            .oneday_title {
                margin-bottom: 50px;
            }
            .body_coldtitle {
                margin-top: 25px;
                &::before {
                    background-color: #0091ff;
                }
            }
            .twochart_box {
                display: flex;
                flex-direction: row;
                & > div {
                    flex: 1;
                    .daychart {
                        min-width: 488px;
                        height: 285px;
                    }
                    .daylinechart {
                        margin-top: 25px;
                    }
                    .daybarchart {
                        height: 180px;
                    }
                }
            }
        }
    }
}
#exportPdf {
    /* display: none; */
    position: absolute;
    background: #ffffff;
    left: -999999px;
    top: 0;
    //   width: 1260px;
    width: 1320px;
    .page_header {
        padding: 430px 0 158px;
        .pname {
            right: 70px;
            top: 760px;
        }
    }
    .env_module {
        padding: 24px 0 20px;
        & > div {
            padding: 0 100px 0px;
        }
        & > section {
            padding: 0 100px 0px;
        }
        & > .room_table {
            .room_table_number {
                & > div {
                    & > div:not(:first-child) {
                        text-align: center;
                        min-width: 41px;
                    }
                }
                & > div:nth-child(2) {
                    & > div {
                        min-width: 47px;
                    }
                }
            }
        }
        .pageitem_box_list {
            padding: 0;
        }
        .pageitem_box {
            // padding: 0 40px 12px;
            padding: 0 70px 12px;
            //   margin-bottom: 10px;
        }
        .pageitem_box_coustom {
            // padding: 0 40px;
            padding: 0 70px;
        }
        .pageitem_box_first {
            margin-bottom: 0px;
        }
        .pageitem_box_sec {
            margin-bottom: 74px;
        }
        .pageitem_box_list > .pageitem_box:nth-child(2n + 0) {
            // margin-bottom: 100px;
            margin-bottom: 200px;
        }
        .pageitem_box:nth-child(1) {
            margin-bottom: 0px;
        }
        .pageitem_box:last-child {
            margin-bottom: 0px;
        }
        .pageitem_box_list > .pageitem_box:last-child {
            margin-bottom: 0;
        }
    }
}
</style>