fire-mh/src/views/self-management.vue

<template>
    <el-row class="contentBox">
        <transition name="el-fade-in-linear">
            <el-col class="leftBox" v-show="stroes.$state.leftBtn">
                <div class="leftTop">
                    <h4>
                        企业自主情况
                        <el-tooltip placement="right">
                            <template #content>
                                <br />
                                数据说明
                                <br />
                                <br />历史火灾指数30分：一级火灾-25，二级火灾-15，
                                <br />
                                其他-8（每一起减一次，最小等于0）
                                <br />设施状况指数10分：每出现1项减1分，每1起减1次，最小等于0 <br />事件事故指数25分：每出现1项减2分，每1起减1次，最小等于0
                                <br />场所行业风险15分：每1起减1次，最小等于0 <br />消防隐患指数10分：三合一、电动车；每1起减1次，最小等于0 <br />物联隐患指数10分：物联网隐患处置率，<br />
                                高风险：0-60分，较高风险：60-70分，一般风险：70-80分，低风险：80-100分<br />
                            </template>
                            <img src="@/assets/img/why.png" alt="hah" class="why" />
                        </el-tooltip>
                    </h4>

                    <div class="leftTopContent">
                        <div class="contentOne" v-if="radar == 1">
                            <radar-chart
                                v-if="enterpriseAutonomyList.complaintList.length > 0"
                                :dataMap="enterpriseAutonomyList.complaintList"
                                ref="radarChart"
                                @echartsClick="radarToPie"
                            ></radar-chart>
                        </div>
                        <div class="contentOneH" v-if="radar == 2">
                            <div @click="goBack(1)" class="return">
                                <div class="returnText">返回</div>
                            </div>
                            <pie1 :dataMap="checkPieData" @echartsClick="PieToTable"></pie1>
                        </div>
                        <div class="contentOneH" v-if="radar == 3">
                            <div @click="goBack(2)" class="return" style="top: 0.7rem">
                                <div class="returnText">返回</div>
                            </div>
                            <p>
                                {{ checkTable.name }}：<span>{{ checkTable.total }}</span
                                >分
                            </p>
                            <el-table :data="checkTable.data" class="transparentTableRow" height="100%" :cell-class-name="tableRowClassName">
                                <el-table-column align="left" label="名称" prop="name"></el-table-column>
                                <el-table-column align="left" label="评分" width="50" prop="value"></el-table-column>
                                <el-table-column align="left" label="评分标准" prop="describe"></el-table-column>
                            </el-table>
                        </div>

                        <div class="contentTwo" v-if="radar == 1">
                            <el-row style="height: 100%; color: #ffffff">
                                <el-col style="display: flex" :span="12" v-for="(score, index) in enterpriseAutonomyList.scoreList" :key="index">
                                    <el-row :class="['dj', djActive[index] ? 'djActive' : '']" @click="djActiveClick(index)">
                                        <img style="width: 0.5rem; height: 0.5rem; padding: 0 0.125rem; margin: auto 0" :src="require('@/assets/img/self-management/' + (index + 1) + '.png')" />

                                        <el-row>
                                            <el-col :span="24">
                                                <span
                                                    :style="{
                                                        color: index == 0 ? '#fe0505' : index == 1 ? '#ff5a00' : index == 2 ? '#ffd800' : '#0084ff',
                                                        fontWeight: 600,
                                                        fontSize: '0.225rem',
                                                    }"
                                                >
                                                    {{ score.value }}
                                                    {{ score.mark }}
                                                    
                                                </span>
                                            </el-col>
                                            <el-col :span="24">
                                                <span style="font-size: 0.175rem">
                                                    {{ score.name == "综合风险率" ? "合格率" : score.name }}
                                                </span>
                                            </el-col>
                                        </el-row>
                                    </el-row>
                                </el-col>
                            </el-row>
                        </div>
                    </div>
                </div>
                <div class="leftCenter">
                    <div style="display: flex">
                        <h4>
                            企业自主巡检情况
                            <el-tooltip placement="right">
                                <template #content>
                                    <br />
                                    数据说明
                                    <br />
                                    <br />巡检计划：时间段内共创建巡检计划数 <br />巡检率：时间段内已巡检点位数/应巡检点位数 <br />巡检数：时间段内应巡检点位数 <br />漏检数：时间段内超时未巡检点位数
                                    <br />
                                    <br />
                                </template>
                                <img src="@/assets/img/why.png" alt="hah" class="why" />
                            </el-tooltip>
                        </h4>
                        <div style="display: flex; border-bottom: 0.0125rem solid rgba(115, 251, 253, 0.5)">
                            <el-button size="mini" @click="searchTabs('企业自主巡检情况', 'data1')" :class="{ btnClick: tabsArea === 'data1' }"> 今日 </el-button>
                            <el-button size="mini" @click="searchTabs('企业自主巡检情况', 'data2')" :class="{ btnClick: tabsArea === 'data2' }"> 近七日 </el-button>
                            <el-button size="mini" @click="searchTabs('企业自主巡检情况', 'data3')" :class="{ btnClick: tabsArea === 'data3' }"> 近一月 </el-button>
                        </div>
                    </div>
                    <el-row class="leftCenterContent">
                        <el-col class="contentOne" :span="12" v-for="(score, index) in patrolInspectionList" :key="index">
                            <el-row style="padding-left: 10%; flex-flow: nowrap" @click="unitInspection(index)">
                                <img style="width: 1.2875rem; height: 1.175rem; padding: 0 0.125rem; margin: auto 0" :src="require('@/assets/img/self-management/' + (index + 5) + '.png')" alt="" />

                                <div style="line-height: 0.5rem; margin: auto 0">
                                    <span
                                        :style="{
                                            color: 'rgba(115, 251, 253, 1)',
                                            fontWeight: 600,
                                            fontSize: '0.225rem',
                                            display: 'block',
                                        }"
                                    >
                                        <CountTo :startVal='0' :endVal=' score? score.value:0' :duration='5000'> {{   score.value || 0 }}</CountTo>
                                    </span>
                                    <span style="font-size: 0.175rem; color: #ffffff">
                                        {{ score.name }}
                                    </span>
                                </div>
                            </el-row>
                        </el-col>
                    </el-row>
                </div>
                <div class="leftBot">
                    <h4 v-if="!stroes.$state.streetTown">各街镇单位情况</h4>
                    <el-row class="leftBotContent" v-if="!stroes.$state.streetTown">
                        <category-enterprise
                            ref="categoryEnterprise"
                            v-if="streetCompanyList.xData.length > 0"
                            :dataMap="streetCompanyList.dataMap"
                            :xData="streetCompanyList.xData"
                        ></category-enterprise>
                    </el-row>
                    <h4 v-if="stroes.$state.streetTown">单位情况</h4>
                    <el-row class="leftBotContent" v-if="stroes.$state.streetTown">
                        <el-col class="contentOne" :span="12" v-for="(score, index) in streetDynamicData1" :key="index">
                            <el-row style="width: 100%; flex-flow: nowrap; border: 1px solid rgba(48, 207, 255, 0.6); margin: auto 0; box-shadow: inset 0 0 0.07rem 0.04rem rgb(115 251 253 / 40%)">
                                <img style="width: 0.7375rem; height: 0.7375rem; padding: 0 0.125rem; margin: auto 0" :src="require('@/assets/img/self-management/' + (index + 10) + '.png')" alt="" />
                                <div style="margin: auto 0; padding: 0.1875rem 0">
                                    <span
                                        :style="{
                                            color: index == 0 ? '#FF0709' : index == 1 ? '#F48354' : index == 2 ? '#1A88F9' : '#2BB03B',
                                            fontWeight: 600,
                                            fontSize: '0.3rem',
                                            display: 'block',
                                        }"
                                    >
                                   {{ score.value }} {{ score.mark }}
                                    </span>
                                    <span style="font-size: 0.175rem; color: #ffffff"> {{ score.name }}</span>
                                </div>
                            </el-row>
                        </el-col>
                    </el-row>
                </div>
            </el-col>
        </transition>

        <transition name="el-fade-in-linear">
            <el-col class="centerBox" style="width: 100%">
                <div :class="stroes.$state.leftBtn ? 'leftBtn btnW' : 'leftBtn0 btnW'" @click="stroes.leftBtnClick()">
                    <img src="@/assets/img/svg/left.svg" alt="" class="img" />
                </div>
                <el-col class="centerContent" id="mapF"></el-col>

                <div :class="stroes.$state.rightBtn ? 'rightBtn btnW' : 'rightBtn0 btnW'" @click="stroes.rightBtnClick()">
                    <img src="@/assets/img/svg/left.svg" alt="" class="img" />
                </div>

                <div class="mapTips_type">
                    <img src="@/assets/img/svg/danweitop.svg" alt="" class="img" />
                    <div class="content">
                        <p>街镇筛选</p>
                        <el-select class="mtb-12" v-model="stroes.$state.streetTown" placeholder="请选择街镇" @change="checkStreetTown">
                            <el-option v-for="item in stroes.$state.streetTownList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                        </el-select>
                        <p>类型筛选</p>
                        <!-- <el-checkbox-group v-model="checkedData" size="medium">
              <el-checkbox v-for="(item, index) in checkedList" :label="item.value" :key="index" @change="checkboxChange(item.value)">{{ item.label }}</el-checkbox>
            </el-checkbox-group> -->
                        <div class="selectType">
                            <div
                                :class="
                                    checkedArray.checkedData[0] == 0
                                        ? ''
                                        : checkedArray.checkedData[0] == 1
                                        ? 'checkTypeSelect'
                                        : checkedArray.checkedData[0] == 2
                                        ? 'checkTypeSelect'
                                        : checkedArray.checkedData[0] == 3
                                        ? 'checkTypeSelect'
                                        : checkedArray.checkedData[0] == 9
                                        ? 'checkTypeSelect'
                                        : checkedArray.checkedData[0] == 10
                                        ? 'checkTypeSelect'
                                        : ' '
                                "
                            >
                                <img
                                    :src="
                                        checkedSelectValue == '0'
                                            ? stores.sadianIcon.bwg
                                            : checkedSelectValue == '1'
                                            ? stores.sadianIcon.zddw
                                            : checkedSelectValue == '2'
                                            ? stores.sadianIcon.ybdw
                                            : checkedSelectValue == '3'
                                            ? stores.sadianIcon.jxcs
                                            : checkedSelectValue == '9'
                                            ? stores.sadianIcon.qtdw
                                            : checkedSelectValue == '10'
                                            ? stores.sadianIcon.dxzht
                                            : stores.sadianIcon.bwg
                                    "
                                    alt=""
                                />

                                <span>{{ checkedSelectLabel }}</span>
                                <el-select
                                    v-model="checkedSelectValue"
                                    placeholder="单位信息"
                                    class="selectTypeIcon"
                                    style="display: inline-block; width: 100%; position: absolute; right: 0"
                                    @change="selectArray"
                                >
                                    <el-option v-for="item in checkedSelectArray" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                                </el-select>
                            </div>
                            <!-- <div
                                @click="checkboxChange(0)"
                                :class="
                                    checkedArray.checkedData[0] == 0
                                        ? 'checkTypeSelect'
                                        : ''
                                "
                            >
                                <img :src="stores.sadianIcon.zddw" alt="" />
                                <span>重点单位</span>
                            </div>
                            <div
                                @click="checkboxChange(1)"
                                :class="
                                    checkedArray.checkedData[0] == 1
                                        ? 'checkTypeSelect'
                                        : ''
                                "
                            >
                                <img :src="stores.sadianIcon.ybdw" alt="" />
                                <span>一般单位</span>
                            </div>
                    <div
                                @click="checkboxChange(2)"
                                :class="
                                    checkedArray.checkedData[0] == 2
                                        ? 'checkTypeSelect'
                                        : ''
                                "
                            >
                                <img :src="stores.sadianIcon.jxcs" alt="" />
                                <span>九小场所</span>
                            </div>
                            <div
                                @click="checkboxChange(3)"
                                :class="
                                    checkedArray.checkedData[0] == 3
                                        ? 'checkTypeSelect'
                                        : ''
                                "
                            >
                                <img :src="stores.sadianIcon.qtdw" alt="" />
                                <span>其他单位</span>
                            </div> -->
                            <div @click="checkboxChange(6)" :class="checkedArray.checkedData[0] == 6 ? 'checkTypeSelect' : ''">
                                <img :src="stores.sadianIcon.gcggjz" alt="" />
                                <span>高层公共建筑</span>
                            </div>
                            <!-- <div
                                @click="checkboxChange(10)"
                                :class="
                                    checkedArray.checkedData[0] == 10
                                        ? 'checkTypeSelect'
                                        : ''
                                "
                            >
                                <img :src="stores.sadianIcon.dxzht" alt="" />
                                <span>大型综合体</span>
                            </div> -->
                            <div @click="checkboxChange(11)" :class="checkedArray.checkedData[0] == 11 ? 'checkTypeSelect' : ''">
                                <img :src="stores.sadianIcon.lhtj" alt="" />
                                <span>龙湖天街（试点）</span>
                            </div>
                            <!-- <div
                                @click="checkboxChange(12)"
                                :class="
                                    checkedArray.checkedData[0] == 12
                                        ? 'checkTypeSelect'
                                        : ''
                                "
                            >
                                <img :src="stores.sadianIcon.xx" alt="" />
                                <span>中小学校</span>
                            </div> -->
                            <div
                                :class="
                                    checkedArray.checkedData[0] == 10000
                                        ? 'checkTypeSelect'
                                        : checkedArray.checkedData[0] == 19
                                        ? 'checkTypeSelect'
                                        : checkedArray.checkedData[0] == 20
                                        ? 'checkTypeSelect'
                                        : checkedArray.checkedData[0] == 21
                                        ? 'checkTypeSelect'
                                        : ' '
                                "
                            >
                                <img
                                    :src="
                                        checkedSelectValue3 == '10000'
                                            ? stores.sadianIcon.xx
                                            : checkedSelectValue3 == '19'
                                            ? stores.sadianIcon.zs
                                            : checkedSelectValue3 == '20'
                                            ? stores.sadianIcon.yey
                                            : checkedSelectValue3 == '21'
                                            ? stores.sadianIcon.qtxx
                                            : ''
                                    "
                                    alt=""
                                />

                                <span>{{ checkedSelectLabel3 }}</span>
                                <el-select
                                    v-model="checkedSelectValue3"
                                    placeholder="学校"
                                    class="selectTypeIcon"
                                    style="display: inline-block; width: 100%; position: absolute; right: 0"
                                    @change="selectArray3"
                                >
                                    <el-option v-for="item in checkedSelectArray3" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                                </el-select>
                            </div>
                            <div @click="checkboxChange(13)" :class="checkedArray.checkedData[0] == 13 ? 'checkTypeSelect' : ''">
                                <img :src="stores.sadianIcon.bwg" alt="" />
                                <span>博物馆</span>
                            </div>
                            <div @click="checkboxChange(14)" :class="checkedArray.checkedData[0] == 14 ? 'checkTypeSelect' : ''">
                                <img :src="stores.sadianIcon.tyg" alt="" />
                                <span>体验馆</span>
                            </div>
                            <div
                                :class="
                                    checkedArray.checkedData[0] == 999 ? '' : checkedArray.checkedData[0] == 1000 ? 'checkTypeSelect' : checkedArray.checkedData[0] == 1001 ? 'checkTypeSelect' : ' '
                                "
                            >
                                <img
                                    :src="
                                        checkedSelectValue2 == '999'
                                            ? stores.sadianIcon.bwg
                                            : checkedSelectValue2 == '1000'
                                            ? stores.sadianIcon.ck
                                            : checkedSelectValue2 == '1001'
                                            ? stores.sadianIcon.cf
                                            : ''
                                    "
                                    alt=""
                                />

                                <span>{{ checkedSelectLabel2 }}</span>
                                <el-select
                                    v-model="checkedSelectValue2"
                                    placeholder="工业"
                                    class="selectTypeIcon"
                                    style="display: inline-block; width: 100%; position: absolute; right: 0"
                                    @change="selectArray2"
                                >
                                    <el-option v-for="item in checkedSelectArray2" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                                </el-select>
                            </div>
                        </div>
                    </div>
                </div>
            </el-col>
        </transition>
        <transition name="el-fade-in-linear">
            <el-col class="rightBox" v-show="stroes.$state.rightBtn">
                <div class="rightTop" :span="24">
                    <h4>物联网设备情况</h4>
                    <div class="topContent">
                        <div style="text-align: right; display: flex">
                            <span style="margin: 0 auto"></span>
                            <span style="font-size: 0.175rem; line-height: 0.375rem; color: #ffffff">累计接入设备数： </span>
                            
                            <span style="font-size: 0.25rem; color: #73fbfd; font-weight: 600">{{ diskData.total }}</span>
                            <!-- <span style="font-size: 0.25rem; color: #73fbfd; font-weight: 600">{{ iotDeviceList2.dataValue }}</span> -->
                        </div>
                        <div style="height: calc(100% - 0.375rem)">
                            <disk v-if="diskData.data.length > 0" ref="disk" :dataMap="diskData.data" @echartsClick="diskSd"></disk>
                        </div>
                    </div>
                </div>

                <div class="rightCenter">
                    <div style="display: flex">
                        <h4>物联网处置情况</h4>

                        <!-- <div
                            style="
                                display: flex;
                                border-bottom: 0.0125rem solid
                                    rgba(115, 251, 253, 0.5);
                            "
                        >
                            <el-button
                                size="mini"
                                @click="searchTabs('物联网处置情况', 'data1')"
                                :class="{ btnClick: tabsArea2 === 'data1' }"
                            >
                                今日
                            </el-button>
                            <el-button
                                size="mini"
                                @click="searchTabs('物联网处置情况', 'data2')"
                                :class="{ btnClick: tabsArea2 === 'data2' }"
                            >
                                近七日
                            </el-button>
                            <el-button
                                size="mini"
                                @click="searchTabs('物联网处置情况', 'data3')"
                                :class="{ btnClick: tabsArea2 === 'data3' }"
                            >
                                近一月
                            </el-button>
                        </div> -->
                    </div>

                    <el-row class="rightCenterContent">
                        <el-col :span="8">
                            <div>
                                <div style="height: 1.5rem">
                                    <gauge ref="gauge1" :dataNumber="iotDisposalList[0].value" :dataMark="iotDisposalList[0].mark" color="#F68E6A"></gauge>
                                </div>
                                <div style="text-align: center">
                                    {{ iotDisposalList[0].name }}
                                </div>
                            </div>
                        </el-col>
                        <el-col :span="8">
                            <div>
                                <div style="height: 1.5rem">
                                    <gauge ref="gauge2" :dataNumber="iotDisposalList[1].value" :dataMark="iotDisposalList[1].mark" color="#14E1EA"></gauge>
                                </div>
                                <div style="text-align: center">
                                    {{ iotDisposalList[1].name }}
                                </div>
                            </div>
                        </el-col>
                        <el-col :span="8">
                            <div>
                                <div style="height: 1.5rem">
                                    <gauge ref="gauge3" :dataNumber="iotDisposalList[2].value" :dataMark="iotDisposalList[2].mark" color="#F8ED41"></gauge>
                                </div>
                                <div style="text-align: center">
                                    {{ iotDisposalList[2].name }}
                                </div>
                            </div>
                        </el-col>
                    </el-row>
                </div>

                <div class="rightBot">
                    <h4 v-if="!stroes.$state.streetTown">各街镇物联动态</h4>

                    <div class="rightBotContent" v-if="!stroes.$state.streetTown">
                        <el-table ref="table" height="100%" :data="streetDynamicData" class="transparentTableRow" style="width: 100%" @mouseenter="autoScroll(true)"
                        @mouseleave="autoScroll()">
                            <el-table-column v-for="item in streetDynamicHeaderData" :key="item.prop" :prop="item.prop" align="center" :label="item.name">
                                <template #default="scope">
                                    <el-tooltip placement="left" trigger="click">
                                        <template #content>
                                            <div class="tableTooltip">
                                                <div class="tableTitle" ref="ff">
                                                    <div>物联动态详情</div>
                                                </div>
                                                <img src="~@a/img/icon/close.png" alt="" class="close" @click="closeIsTooltip" />
                                                <el-row class="tableContent">
                                                    <el-col :span="24">
                                                        街镇：
                                                        <span>{{ scope.row.streetTown ? scope.row.streetTown : "--" }}</span>
                                                    </el-col>
                                                    <el-col :span="24">
                                                        设备总数：<span>{{ scope.row.deviceCount ? scope.row.deviceCount : "--" }}</span>
                                                    </el-col>
                                                    <el-col :span="24">
                                                        在线数：<span> {{ scope.row.onLineCount ? scope.row.onLineCount : "--" }}</span>
                                                    </el-col>
                                                    <el-col :span="24">
                                                        在线率：<span>{{ scope.row.onLineRate ? scope.row.onLineRate : "--" }}</span>
                                                    </el-col>
                                                    <el-col :span="24">
                                                        处置率：<span>{{ scope.row.processedRate ? scope.row.processedRate : "--" }}</span>
                                                    </el-col>
                                                </el-row>
                                            </div>
                                        </template>

                                        <template>
                                            <div class="name-wrapper">
                                                {{ scope.row[item.prop] }}
                                            </div>
                                        </template>
                                    </el-tooltip>
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>

                    <div style="display: flex" v-if="stroes.$state.streetTown">
                        <h4>历史案件</h4>

                        <div style="display: flex; border-bottom: 0.0125rem solid rgba(115, 251, 253, 0.5)">
                            <el-button size="mini" @click="searchTabs('历史案件', 10)" :class="{ btnClick: tabsArea1 === 10 }"> 近10条 </el-button>
                            <el-button size="mini" @click="searchTabs('历史案件', 50)" :class="{ btnClick: tabsArea1 === 50 }"> 近50条 </el-button>
                        </div>
                    </div>

                    <div class="rightBoContent1" v-if="stroes.$state.streetTown">
                        <el-row>
                            <div v-for="(j, index) in gj" :key="index">
                                <img src="@/assets/img/self-management/9.png" alt="" />

                                <div>
                                    <div style="font-size: 0.1875rem; color: #73fbfd; font-weight: 600">
                                        {{ j.value }}
                                    </div>
                                    <div style="font-size: 0.175rem">
                                        {{ j.name }}
                                    </div>
                                </div>
                            </div>
                        </el-row>

                        <el-table :data="tableData2" class="transparentTableRow" v-fit-columns   :empty-text="dataNo"  ref="reportTable1" @mouseenter="autoScroll(true)"
                        @mouseleave="autoScroll()" >
                            <el-table-column v-for="item in headerData2" :key="item.prop" :prop="item.prop" align="center" :label="item.name">
                                <template #default="scope">
                                    <el-tooltip placement="left">
                                        <template #content>
                                            <div class="tableTooltip">
                                                <div class="tableTitle" ref="ff">
                                                    <div>案件详情</div>
                                                </div>
                                                <!-- <img src="~@a/img/icon/close.png" alt="" class="close" @click="closeIsTooltip" /> -->
                                                <el-row class="tableContent">
                                                    <el-col :span="20">案件编号：{{ scope.row.id ? scope.row.id : "--" }}</el-col>
                                                    <el-col :span="24">报警时间：{{ scope.row.createTime ? scope.row.createTime : "--" }}</el-col>
                                                    <el-col :span="24">案件类型：{{ scope.row.caseType ? scope.row.caseType : "--" }}</el-col>
                                                    <el-col :span="24">发生地址：{{ scope.row.address ? scope.row.address : "--" }}</el-col>
                                                    <el-col :span="24">所属街道：{{ scope.row.street ? scope.row.street : "--" }}</el-col>
                                                    <el-col :span="12">案件描述：{{ scope.row.caseDescribe ? scope.row.caseDescribe : "--" }}</el-col>
                                                    <el-col :span="24">责任部门：{{ scope.row.dutyGroup ? scope.row.dutyGroup : "--" }}</el-col>
                                                    <el-col :span="24">处置时间：{{ scope.row.endTime ? scope.row.endTime : "--" }}</el-col>
                                                    <el-col :span="24">处理人：{{ scope.row.disposePerson ? scope.row.disposePerson : "--" }}</el-col>
                                                    <el-col :span="24">责任人：{{ scope.row.chargePerson ? scope.row.chargePerson : "--" }}</el-col>
                                                    <el-col :span="24"
                                                        >状态：{{
                                                            scope.row.caseFlag == "0"
                                                                ? "立案"
                                                                : scope.row.caseFlag == "1"
                                                                ? "派遣"
                                                                : scope.row.caseFlag == "2"
                                                                ? "处理"
                                                                : scope.row.caseFlag == "3"
                                                                ? "结案"
                                                                : "--"
                                                        }}</el-col
                                                    >
                                                </el-row>
                                            </div>
                                        </template>
                                        <template>
                                            <div class="name-wrapper">
                                                {{ scope.row[item.prop] }}
                                            </div>
                                        </template>
                                    </el-tooltip>
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>

                    <!-- <h4>企业经营情况</h4>
          <div class="rightBotContent" v-if="erpData.length > 0">
            <el-row v-for="er in erpData" :key="er">
              <el-row class="title">单位：{{ er.companyName }}</el-row>
              <el-row class="data">
                <el-col :span="8"> 法人：{{ er.delegateName }} </el-col>
                <el-col :span="8">
                  注册资金：{{ er.registeredCapital }}万
                </el-col>
                <el-col :span="8">
                  成立时间：{{ er.foundTime ? er.foundTime : "暂无" }}
                </el-col>
                <el-col :span="24">信用代码：{{ er.organization }}</el-col>
                <el-col :span="8">经营状态：{{ er.businessStatus }}</el-col>
                <el-col :span="8">实缴资本：{{ er.paidCapital }}万</el-col>
                <el-col :span="8">
                  单位类型：{{
                    er.companyType == 1
                      ? "重点单位"
                      : er.companyType == 2
                      ? "一般单位"
                      : er.companyType == 3
                      ? "九小场所"
                      : er.companyType == 9
                      ? "其它单位"
                      : "暂无"
                  }}
                </el-col>
                <el-col :span="12">联系电话：{{ er.linkPhone }}</el-col>
                <el-col :span="12">
                  参保人数：{{
                    er.employeeNum ? er.employeeNum + "人" : "暂无"
                  }}
                </el-col>
                <el-col :span="24">登记机关：{{ er.registrar }}</el-col>
                <el-col :span="24">单位地址：{{ er.address }}</el-col>
              </el-row>
              <el-row class="title">建筑情况</el-row>
              <el-row class="data">
                <el-col :span="8">
                  建筑面积：{{ er.buildArea ? er.buildArea + "㎡" : "暂无" }}
                </el-col>
                <el-col :span="8">
                  竣工年份：{{ er.completedTime ? er.completedTime : "暂无" }}
                </el-col>
                <el-col :span="8">使用性质：{{ er.companyNature }}</el-col>
                <el-col :span="8">耐火等级：{{ er.fireRating }}</el-col>
                <el-col :span="8">
                  建筑高度：{{
                    er.buildingHeight ? er.buildingHeight + "m" : "暂无"
                  }}
                </el-col>
                <el-col :span="8">建筑结构：{{ er.buildingStructure }}</el-col>
                <el-col :span="12">安全管理人：{{ er.fireManageName }}</el-col>
                <el-col :span="12">安全责任人：{{ er.fireDutyName }}</el-col>
              </el-row>
            </el-row>
          </div> -->
                </div>
            </el-col>
        </transition>

        <transition name="el-fade-in-linear">
            <div class="tableTooltipwt" v-if="tk">
                <img src="~@a/img/icon/close.png" alt="" class="close" @click="closeTk" />
                <el-col class="mk">
                    <el-row>
                        <el-col>
                            <span class="color2">单位名称：</span>
                            <span class="color1">{{ tkData.companyName }}</span>
                        </el-col>
                        <el-col>
                            <span class="color2">单位类型：</span>
                            <span class="color1">重点单位</span>
                        </el-col>
                        <el-col>
                            <span class="color2">联系电话：</span>
                            <span class="color1">{{ tkData.linkPhone }}</span>
                        </el-col>
                        <el-col style="border-bottom: 1px solid #fff; padding-bottom: 10px">
                            <span class="color2">地址：</span>
                            <span class="color1">{{ tkData.address }}</span>
                        </el-col>
                        <el-col style="margin-top: 6px">
                            <span class="color1" style="margin-left: 0">企业消防综合评估</span>
                            <span class="color1" style="float: right"
                                >综合得分：{{
                                    tkData.fireRisk + tkData.buildIntegrity + tkData.lawEnforce + tkData.selfManage + tkData.facilityStatus
                                        ? (tkData.fireRisk + tkData.buildIntegrity + tkData.lawEnforce + tkData.selfManage + tkData.facilityStatus).toFixed(2)
                                        : 0
                                }}
                                分</span
                            >
                        </el-col>
                        <table border="0" cellspacing="0" cellpadding="0">
                            <thead>
                                <tr>
                                    <th>指数</th>
                                    <th>建筑整体指数</th>
                                    <th>火灾风险指数</th>
                                    <th>监督执法指数</th>
                                    <th>自主管理指数</th>
                                    <th>设施状况指数</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>得分</td>
                                    <td>{{ tkData.fireRisk }}</td>
                                    <td>{{ tkData.buildIntegrity }}</td>
                                    <td>{{ tkData.lawEnforce }}</td>
                                    <td>{{ tkData.selfManage }}</td>
                                    <td>{{ tkData.facilityStatus }}</td>
                                </tr>
                            </tbody>
                        </table>
                        <el-col style="margin-top: 6px" v-if="tkData.reformPart">
                            <span class="color1" style="margin-left: 0">消防整改情况</span>
                        </el-col>
                        <el-col v-if="tkData.reformPart">
                            <span class="color1" style="margin-left: 0">编号：{{ tkData.reformCode }}</span>
                            <span class="color1" style="float: right">整改期限：{{ tkData.limitTime ? tkData.limitTime.split("T")[0] + " " + tkData.limitTime.split("T")[1] : "" }}</span>
                        </el-col>
                        <table border="0" cellspacing="0" cellpadding="0" v-if="tkData.reformPart">
                            <thead>
                                <tr>
                                    <th>序号</th>
                                    <th>整改项</th>
                                    <th>原因</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr v-for="(item, index) in tkData.reformPart.data" :key="index">
                                    <td>{{ index + 1 }}</td>
                                    <td>{{ item.item }}</td>
                                    <td>{{ item.reason }}</td>
                                </tr>
                            </tbody>
                        </table>
                        <div style="margin-top: 40px" v-if="tkData.reformStatus != 0">
                            <el-steps
                                :active="tkData.reformStatus == 1 ? 1 : tkData.reformStatus == 2 || tkData.reformStatus == 3 ? 1 : tkData.reformStatus == 4 || tkData.reformStatus == 5 ? 2 : 0"
                                align-center
                            >
                                <el-step title="已接收" :description="tkData.receivedTime.replace('T', ' ')"></el-step>
                                <el-step
                                    :title="tkData.reformStatus == 2 ? '整改中' : tkData.reformStatus == 3 || tkData.reformStatus == 4 || tkData.reformStatus == 5 ? '整改完成' : '整改中'"
                                    :description="tkData.reformTime.replace('T', ' ')"
                                ></el-step>
                                <el-step
                                    :title="
                                        tkData.reformStatus == 1 || tkData.reformStatus == 2 || tkData.reformStatus == 3
                                            ? '待审核'
                                            : tkData.reformStatus == 4
                                            ? '审核不通过'
                                            : tkData.reformStatus == 5
                                            ? '审核通过'
                                            : ''
                                    "
                                    :description="tkData.reviewTime.replace('T', ' ')"
                                ></el-step>
                            </el-steps>
                        </div>
                        <div style="margin: 10px auto" v-if="tkData.companyName == '上海虹桥国际特商物流港'">
                            <el-button type="primary" size="small" style="background: none; border-radius: 4px; border: 1px solid #73fbfd; height: 30px; padding: 0 6px !important; margin: 10px 0 0"
                                ><a href="http://file.usky.cn/statics/202303/20232D91E7B3D14C346BC9F009FA0B76FA5BF.pdf" target="_blank" style="color: #fff; text-decoration: none"
                                    >&nbsp;&nbsp;查看报告&nbsp;&nbsp;</a
                                ></el-button
                            >
                        </div>
                    </el-row>
                </el-col>
            </div>
        </transition>
    </el-row>
</template>
<script>
import linstener from "@c/mixins/linstener";
import categoryEnterprise from "@c/category-enterprise/index";
import categoryEnterprise2 from "@c/category-enterprise/index2";
import disk from "@c/disk/index";
import seTable from "@c/se-table";
import shebei1 from "@c/shebei";
import radarChart from "@c/radar";
import gauge from "@c/gauge";
import pie1 from "@c/pie";
import CountTo from '@/components/count-to/index.js'
import map from "@c/mixins/map-data1";
// import map from "@c/mixins/map-gaode-public";

export default {
    components: {
        categoryEnterprise,
        categoryEnterprise2,
        seTable,
        shebei1,
        radarChart,
        gauge,
        pie1,
        disk,
        CountTo
    },
    mixins: [linstener, map],
    data() {
        return {
            dataNo:" ",//table无数据提示
            diskData: {
                total:0,
                data:[],
                data2:[
                    {
                    name: "消防给水及消火栓系统",
                    value: 1083,
                    lineCount: 895,
                    lineRate: 0.826,
                   
                },
                {
                    name: "防烟排烟系统",
                    value: 4110,
                    lineCount: 261,
                    lineRate: 0.064,
                   
                },
                {
                    name: "火灾报警系统",
                    value: 9403,
                    lineCount: 226,
                    lineRate: 0.024,
                    
                },
                {
                    name: "自动喷水灭火系统",
                    value: 6737,
                    lineCount: 6411,
                    lineRate: 0.952,
                    
                },
                ]
                
                }, //各街镇物联动态-数据存储
            djActive: [false, false, false, false], //评分等级选中状态
            zddwId: undefined,
            stores: this.$useStore(),
            tk: false,
            tkData: {},
            radar: 1, //雷达图显示
            pieData: [
                [
                    {
                        name: "建筑结构",
                        value: 1.5,
                        total: 2,
                        children: [
                            {
                                name: "建筑耐火等级",
                                value: 1.5,
                                describe: `钢混：3 
              有防火涂料的钢结构和砖混：2 
              未涂防火涂料或失效的钢结构和木：1`,
                            },
                        ],
                    },
                    {
                        name: "建筑体量",
                        value: 3,
                        total: 3,
                        children: [
                            {
                                name: "单层、多层、高层、超高层",
                                value: 3,
                                describe: `单、多层：3
高层：2
超高层：1`,
                            },
                            //                             {
                            //                                 name: "地下空间",
                            //                                 value: 0,
                            //                                 describe: `地下空间大于10000平：扣0.5
                            // 地下空间大于20000平米：扣1`,
                            //                             },
                        ],
                    },
                    {
                        name: "使用性质",
                        value: 3,
                        total: 4,
                        children: [
                            {
                                name: "工业、商业、办公",
                                value: 3,
                                describe: `普通办公：3
商业：2
工业：1
主业为生产、存储甲乙类危险品：0`,
                            },
                        ],
                    },
                    {
                        name: "建筑使用年限",
                        value: 1,
                        total: 1,
                        children: [
                            {
                                name: "使用20年以内、20年及以上",
                                value: 1,
                                describe: `20年以内：1
20年及以上：0`,
                            },
                        ],
                    },
                ],
                [
                    {
                        name: "火灾报警系统",
                        value: 1.8,
                        total: 8,
                        children: [
                            { name: "实时在线率", value: -0.1, describe: "每发现一次底于95%：扣0.1" },
                            { name: "实时故障率", value: -0.1, describe: "每发现一次高于5%：扣0.1" },
                            { name: "年度平均在线率", value: 1.5, describe: "大于90%：1.5" },
                            { name: "年度平均故障率", value: "-", describe: "低于5%：1.5" },
                            {
                                name: "平均修复周期",
                                value: 0.5,
                                describe: `每次故障能在一周内修复的：2
在一个月内修复的：0.5
超出一个月未修复的：每发现一次扣0.2`,
                            },
                        ],
                    },
                    {
                        name: "消防水系统",
                        value: 3.3,
                        total: 10,
                        children: [
                            { name: "实时在线率", value: -0.1, describe: "每发现一次底于95%：扣0.1" },
                            { name: "实时故障率", value: -0.1, describe: "每发现一次高于5%：扣0.1" },
                            { name: "年度平均在线率", value: 1.5, describe: "大于90%：1.5" },
                            { name: "年度平均故障率", value: 1.5, describe: "低于5%：1.5" },
                            {
                                name: "平均修复周期",
                                value: 0.5,
                                describe: `每次故障能在一周内修复的：2
在一个月内修复的：0.5
超出一个月未修复的：每发现一次扣0.2`,
                            },
                        ],
                    },
                    //                     {
                    //                         name: "防排烟系统",
                    //                         value: 1,
                    //                         total: 3,
                    //                         children: [
                    //                             { name: "实时在线率", value: 0.2, describe: "每发现一次底于95%：扣0.1" },
                    //                             { name: "实时故障率", value: 0.2, describe: "每发现一次高于5%：扣0.1" },
                    //                             {
                    //                                 name: "年度平均在线率",
                    //                                 value: 0.2,
                    //                                 describe: "大于90%：1.5",
                    //                             },
                    //                             {
                    //                                 name: "年度平均故障率",
                    //                                 value: 0.2,
                    //                                 describe: "低于5%：1.5",
                    //                             },
                    //                             { name: "平均修复周期", value: 0.2, describe: `每次故障能在一周内修复的：2
                    // 在一个月内修复的：0.5
                    // 超出一个月未修复的：每发现一次扣0.2` },
                    //                         ],
                    //                     },
                    {
                        name: "维保单位履职情况",
                        value: 4,
                        total: 4,
                        children: [
                            {
                                name: "是否有维保单位",
                                value: 1,
                                describe: `和系统内同步符合的：2
不符合：0`,
                            },
                            {
                                name: "月度检查报告",
                                value: 1,
                                describe: `最近年度内月度检查同步系统的：1
没漏一份扣0.2`,
                            },
                            { name: "年度检测报告", value: 1, describe: `最近年度出具并同步系统的：2` },
                            { name: "年度评估报告", value: 1, describe: `最近年度出具并同步系统的：2` },
                        ],
                    },
                    //     {
                    //         name: "燃气、电气系统监测",
                    //         value: 1,
                    //         total: 2,
                    //         children: [
                    //             { name: "", value: 1, describe: "安装后正常运行状态，保持在正常率90%以上，每套系统可加1.5分" },
                    //         ],
                    //     },
                ],
                [
                    {
                        name: "组织制度情况",
                        value: 4,
                        total: 6,
                        children: [
                            {
                                name: "消防安全制度制定",
                                value: 0,
                                describe: `有：1
无：0`,
                            },
                            {
                                name: "灭火和应急疏散预案",
                                value: 0,
                                describe: `有：1
无：0`,
                            },
                            {
                                name: "员工消防安全培训",
                                value: 1,
                                describe: `有：1
有、但不符合规定：0.5
无：0`,
                            },
                            {
                                name: "消防安全管理人",
                                value: 1,
                                describe: `确定：1
未确定：0`,
                            },
                            {
                                name: "消防档案",
                                value: 1,
                                describe: `有：1
有、但不符合规定：0.5
无：0`,
                            },
                            {
                                name: "消防重点部位",
                                value: 1,
                                describe: `确定：1
未确定：0`,
                            },
                        ],
                    },
                    {
                        name: "日常值班、巡检情况",
                        value: 9,
                        total: 10,
                        children: [
                            {
                                name: "消控室持证数量",
                                value: 1,
                                describe: `四级、中级证6张及以上：2
2-4张：1
1张及一下：0`,
                            },
                            {
                                name: "消控室值班人员数量和实际持证情况",
                                value: 2,
                                describe: `当年度内双随机及其他检查发现实际情况相符的：2
不符的：0`,
                            },
                            {
                                name: "消防联动控制设备运行情况",
                                value: 2,
                                describe: `正常：2
不正常：0`,
                            },
                            {
                                name: "防火检查、巡查",
                                value: 2,
                                describe: `有记录:2
有、但不符合要求:1
无记录:0`,
                            },
                            {
                                name: "消防设施、器材、消防安全标志定期组织维修保养",
                                value: 2,
                                total: 2,
                                describe: `有记录:2
无记录:0`,
                            },
                        ],
                    },
                    {
                        name: "预案、培训落实情况",
                        value: 3,
                        total: 4,
                        children: [
                            {
                                name: "应急演练情况",
                                value: 2,
                                describe: `应急演练训练记录有记录：2
有，但记录不详细的：1
无记录：0`,
                            },
                            {
                                name: "宣传、培训记录情况",
                                value: 1,
                                describe: `宣传培训记录详实的：2
有、但记录不详细的：1
记录不全的：0`,
                            },
                        ],
                    },
                    {
                        name: "微站实体化运行情况",
                        value: 4,
                        total: 6,
                        children: [
                            {
                                name: "微站制度和人员落实",
                                value: 0,
                                describe: `确定灭火和组织疏散任务人员的：2
未确定的：0`,
                            },
                            {
                                name: "和对讲抽查情况",
                                value: "-",
                                describe: `季度抽查统计
每发现一次抽查未接通的：扣1`,
                            },
                            {
                                name: "日常训练情况",
                                value: 4,
                                describe: `日常训练记录详实并实地抽查5分钟到位的：4
记录详实但实地抽查超时的：2
均不符合的：0`,
                            },
                        ],
                    },
                ],
                [
                    {
                        name: "双随机检查情况",
                        value: -2,
                        total: "-",
                        children: [{ name: "近2年内检查情况", value: 1, describe: `监督检查发现隐患平均数1-3扣2分，4-6扣5分，7+扣10分` }],
                    },
                    {
                        name: "处罚情况",
                        value: "-",
                        total: 5,
                        children: [{ name: "近3年内处罚情况", value: 2, describe: `3年内处罚一次扣5分，处罚2次扣10分，处罚3次扣20分，处罚4次及以上扣25` }],
                    },
                    {
                        name: "举报投诉",
                        value: -0.5,
                        total: "-",
                        children: [{ name: "近2年内投诉情况", value: 2, describe: `每有一次属实的举报投诉：扣0.5，最多扣2分` }],
                    },
                    {
                        name: "重大隐患挂牌情况",
                        value: 25,
                        total: "-",
                        children: [{ name: "重大隐患挂牌情况", value: 25, describe: `当年被列为重大火灾隐患的扣25分` }],
                    },
                ],
                [
                    {
                        name: "当年度火灾情况",
                        value: 14,
                        total: 14,
                        children: [
                            { name: "一般火灾", value: 14, describe: "每发生一起扣5分" },
                            //     { name: "较大及以上火灾", value: 3, describe: "每发生一起扣10分" },
                            //     {
                            //         name: "如果发生社会面影响很大且具有典型意义火灾",
                            //         value: 0,
                            //         describe:`总分上多扣10分`

                            //     },
                        ],
                    },
                    //     {
                    //         name: "上年度火灾情况",
                    //         value: 6,
                    //         total: 7,
                    //         children: [{ name: "", value: 6, describe: "上年度发生火灾的基准分降为8" }],
                    //     },
                ],
            ], //二级饼图数据
            checkPieData: {
                value: [],
                name: null,
                id: null,
            }, //选择饼图数据
            //三级饼图数据
            checkTable: {
                data: [],
                name: null,
                id: null,
                total: 0,
            },

            enterpriseAutonomyList: {
                complaintList: [],
                scoreList: [], //综合评分数据
                titleList: [], //折线图title数据
                valueList: [], //折线图value数据
            }, //企业自主情况-数据存储

            tabsArea: "data1", //企业自主巡检情况-(今日、近七日、近一月)切换
            patrolInspectionList: [
                {
                    name: "今日巡检情况", //名称
                    value: 0, //值
                    mark: "", //标识符
                },
                {
                    name: "巡检率", //名称
                    value: 0, //值
                    mark: "%", //标识符
                },
                {
                    name: "合格数", //名称
                    value: 0, //值
                    mark: "", //标识符
                },
                {
                    name: "漏检数", //名称
                    value: 0, //值
                    mark: "", //标识符
                },
            ], //企业自主巡检情况-数据存储

            streetCompanyList: {
                xTims: null,
                xData: [],
                dataMap: [[], [], []],
            }, //各街镇单位情况-数据存储



            tabsArea1: 10, //历史案件-(近10条、近50条)切换
            gj: [
                {
                    name: "水系统检测设备",
                    value: 0,
                },
                {
                    name: "上线率",
                    value: 0,
                },
                {
                    name: "接单率",
                    value: 0,
                },
                {
                    name: "处置率",
                    value: 0,
                },
            ], //历史案件-数据存储
            tableData2: [], //历史案件-数据存储
            headerData2: [
                { prop: "id", name: "案件编号" },
                { prop: "createTime", name: "案发时间" },
                { prop: "caseType", name: "案件类型" },
                { prop: "address", name: "案发地址" },
                { prop: "dutyGroup", name: "责任部门" },
                { prop: "caseFlag", name: "状态" },
            ], //历史案件-table表格prop头部定义

            erpData: [], //企业经营情况-数据存储

            streetDynamicData1: [], //单位情况-数据存储

            streetDynamicData: [
            {
			"onLineRate": "15.6%",
			"onLineCount": 14,
			"deviceCount": 90,
			"streetTown": "华漕镇",
			"processedRate": "90%"
		},
		{
			"onLineRate": "78.8%",
			"onLineCount": 67,
			"deviceCount": 85,
			"streetTown": "新虹街道",
			"processedRate": "98%"
		},
		{
			"onLineRate": "17.8%",
			"onLineCount": 292,
			"deviceCount": 1641,
			"streetTown": "七宝镇",
			"processedRate": "90%"
		},
		{
			"onLineRate": "37.4%",
			"onLineCount": 474,
			"deviceCount": 1266,
			"streetTown": "虹桥镇",
			"processedRate": "90%"
		},
		{
			"onLineRate": "34.3%",
			"onLineCount": 82,
			"deviceCount":239,
			"streetTown": "古美路街道",
			"processedRate": "99%"
		},
		{
			"onLineRate": "15.7%",
			"onLineCount":336,
			"deviceCount":2144,
			"streetTown": "莘庄镇",
			"processedRate": "98%"
		},
		{
			"onLineRate": "39.1%",
			"onLineCount": 358,
			"deviceCount": 916,
			"streetTown": "梅陇镇",
			"processedRate": "95%"
		},
		{
			"onLineRate": "16.1%",
			"onLineCount": 293,
			"deviceCount": 1823,
			"streetTown": "颛桥镇",
			"processedRate": "97%"
		},
		{
			"onLineRate": "19.8%",
			"onLineCount": 133,
			"deviceCount": 673,
			"streetTown": "马桥镇",
			"processedRate": "96%"
		},
		{
			"onLineRate": "49.6%",
			"onLineCount": 64,
			"deviceCount": 129,
			"streetTown": "江川路街道",
			"processedRate": "98%"
		},
		{
			"onLineRate": "16.0%",
			"onLineCount": 512,
			"deviceCount": 3205,
			"streetTown": "吴泾镇",
			"processedRate": "95%"
		},
		{
			"onLineRate": "97.1%",
			"onLineCount": 4652,
			"deviceCount": 4791,
			"streetTown": "浦锦街道",
			"processedRate": "96%"
		},
		{
			"onLineRate": "15.9%",
			"onLineCount": 342,
			"deviceCount": 2157,
			"streetTown": "浦江镇",
			"processedRate": "95%"
		},
		{
			"onLineRate": "8.0%",
			"onLineCount": 174,
			"deviceCount": 2174,
			"streetTown": "莘庄工业区",
			"processedRate": "94%"
		}
            ],//各街镇物联动态-数据存储
            streetDynamicHeaderData: [
                { prop: "streetTown", name: "街镇" },
                { prop: "deviceCount", name: "设备总数" },
                { prop: "onLineCount", name: "在线数" },
                { prop: "onLineRate", name: "在线率" },
                { prop: "processedRate", name: "处置率" },
            ], //各街镇物联动态-table表格prop头部定义

            tabsArea2: "data1", //物联网处置情况-(今日、近七日、近一月)切换
            iotDisposalList: [
                {
                    name: "隐患告警数", //名称
                    value: 0, //值
                    mark: "", //标识符
                },
                {
                    name: "隐患告警处置数", //名称
                    value: 0, //值
                    mark: "", //标识符
                },
                {
                    name: "处置率", //名称
                    value: 0, //值
                    mark: "%", //标识符
                },
            ], //物联网处置情况-数据存储
            //类型筛选数据集
            checkedArray: {
                checkedData: [0],
                checkedList: [
                    { value: 0, label: "单位信息" },
                    { value: 1, label: "工业" },
                    //     { value: 1, label: "重点单位" },
                    //     { value: 2, label: "一般单位" },
                    //     { value: 3, label: "九小场所" },
                    //     { value: 9, label: "其他单位" },
                    //     { value: 10, label: "大型综合体" },
                    { value: 11, label: "龙湖天街（试点）" },
                    //     { value: 12, label: "中小学校" },
                    { value: 13, label: "博物馆" },
                    { value: 14, label: "体验馆" },
                ],
            },
            checkedSelectValue: "1",
            checkedSelectLabel: "重点单位",
            checkedSelectArray: [
                { value: 0, label: "单位信息" },
                { value: 1, label: "重点单位" },
                { value: 2, label: "一般单位" },
                { value: 3, label: "九小场所" },
                { value: 9, label: "其他单位" },
                { value: 10, label: "大型综合体" },
            ],
            checkedSelectValue2: "999",
            checkedSelectLabel2: "工业",
            checkedSelectArray2: [
                { value: 999, label: "工业" },
                { value: 1000, label: "厂房" },
                { value: 1001, label: "仓库" },
            ],
            checkedSelectValue3: "10000",
            checkedSelectLabel3: "学校",
            checkedSelectArray3: [
                { value: 10000, label: "学校" },
                { value: 19, label: "中小学" },
                { value: 20, label: "幼儿园" },
                { value: 21, label: "其他学校" },
            ],
        };
    },
    computed: {
        isFollow() {
            return this.stores.$state.zddwId;
        },
    },

    watch: {
        isFollow(id) {
            this.zddwSd(id);
        },
    },

    created() {
        this.getData();
        setTimeout(()=>{
            this.autoScroll()
        },2000)
    },
    mounted() {
        this.initMap();
        window.addEventListener(
            "resize",
            () =>
                this.resizeTimeActions([
                    this.$refs.gauge1,
                    this.$refs.gauge2,
                    this.$refs.gauge3,
                    this.$refs.categoryEnterprise,
                    this.$refs.categoryEnterprise2,
                    this.$refs.category,
                    this.$refs.radarChart,
                    this.$refs.wordCloud,
                ]),
            true
        );
    },
    methods: {
        beforeDestroy() {
            this.autoScroll(true)
        },
        /**
         * 评分等级切换
         * @param {*} id
         */
        djActiveClick(id) {
            var status = this.djActive[id];
            this.djActive = [false, false, false, false];
            this.djActive[id] = !status;
            let type = "重点单位";
            let arr = [];
            if (this.djActive[id]) {
                this.$axios
                    .get(
                        this.$api.selfManagement.riskGradeScatter +
                            "?" +
                            this.$qs.stringify({
                                streetTown: this.stroes.$state.streetTown,
                                riskGrade: id + 1,
                            })
                    )
                    .then((res) => {
                        if (res.data.length > 0) {
                            //点分布
                            let data = res.data;
                            for (let i = 0; i < data.length; i++) {
                                arr[i] = data[i];
                                arr[i].gisX = data[i].longitude;
                                arr[i].gisY = data[i].latitude;
                                arr[i].companyId = data[i].companyId;
                                arr[i].type = type;
                            }
                            setTimeout(() => {
                                this.addMarker(arr.splice(0, 500), "self-management", id == 0 ? "高风险" : id ==1 ? "较高风险" : id == 2 ?  "一般风险" : id == 3 ? "低风险" : "");
                            }, 500);
                        } else {
                            this.addMarker([], "self-management", type);
                        }
                    });
            } else {
                this.addMarker([], "self-management", "");
            }
        },
        closeTk() {
            this.tk = false;
        },
        closeIsTooltip() {
            let y = document.getElementsByClassName("el-popper");
            for (let i = 0; i < y.length; i++) {
                y[i].style.display = "none";
                y[i].ariaHidden = true;
            }
        },

        async getData() {
            this.sadianSelect(1); //撒点
            this.enterpriseAutonomyApi(); //企业自主情况接口请求
            this.patrolInspectionApi(); //企业自主巡检情况接口请求
            this.streetCompanyApi(); //各街镇单位情况接口请求
            // this.erpDataApi(); //企业经营情况接口请求
            this.caseListApi(); //历史案件接口请求d
            this.deviceTypeListApi(); //物联网设备情况接口请求
            //     this.streetDynamicApi(); //各街镇物联动态接口请求
            this.iotDisposalApi(); //物联网处置情况接口请求
        },
        autoScroll(stop) {
            // 拿到表格中承载数据的div元素

            const divData = this.$refs.reportTable.$refs.bodyWrapper
            // 拿到元素后，对元素进行定时增加距离顶部距离，实现滚动效果(此配置为每100毫秒移动1像素)
            if (stop) {
            //再通过事件监听，监听到 组件销毁 后，再执行关闭计时器。
            window.clearInterval(this.scrolltimer)
            } else {
                this.scrolltimer = window.setInterval(() => {
                        // 元素自增距离顶部1像素
                        divData.scrollTop += 1
                        // 判断元素是否滚动到底部(可视高度+距离顶部=整个高度)
                        if (divData.clientHeight + divData.scrollTop == divData.scrollHeight) {
                        // 重置table距离顶部距离
                        divData.scrollTop = 0
                        // 重置table距离顶部距离。值=(滚动到底部时，距离顶部的大小) - 整个高度/2
                        // divData.scrollTop = divData.scrollTop - divData.scrollHeight / 2
                        }
                }, 150) // 滚动速度
            }
        },

        /**
         * 撒点测绘院、高德
         */
        sadianSelect(id) {
            if (this.stroes.$state.mapBool == 1) {
                this.mapCluster(id);
            } else {
                this.sadian(id);
            }
        },

        /**
         * @点击街镇事件
         */
        async getStreetTownClick() {
            //     clearInterval(this.streetCompanyList.xTims);
            this.sadianSelect(this.checkedArray.checkedData[0]); //撒点
            //     this.selectArray(1)

            this.enterpriseAutonomyApi(); //企业自主情况接口请求
            this.patrolInspectionApi(); //企业自主巡检情况接口请求
            this.caseListApi(); //历史案件接口请求
            this.deviceTypeListApi(); //物联网设备情况接口请求
            this.iotDisposalApi(); //物联网处置情况接口请求
            this.streetCompanyApi1(); //单位情况接口请求
        },

        /**
         * @历史案件
         * @企业自主巡检情况
         * @物联网处置情况
         * @tabs切换
         * @param {传入值Bool} type
         * @param {传入值Sting} val
         */
        searchTabs(type, val) {
            if (type === "历史案件") {
                if (val === this.tabsArea1) return;
                this.tabsArea1 = val;
                this.caseListApi(); //历史案件接口请求
            } else if (type === "企业自主巡检情况") {
                if (val === this.tabsArea) return;
                this.tabsArea = val;
                this.patrolInspectionApi(); //企业自主巡检情况接口请求
            } else if (type === "物联网处置情况") {
                if (val === this.tabsArea2) return;
                this.tabsArea2 = val;
                this.iotDisposalApi(); //企业自主巡检情况接口请求
            }
        },

        /**
         * @撒点类型事件
         */
        checkboxChange(value) {
            // console.log(this.checkedArray.checkedData[0])
            this.checkedArray.checkedData[0] = value;
            this.sadianSelect(this.checkedArray.checkedData[0]);
        },

        /**
         * @企业自主情况
         * @api接口请求
         */
        async enterpriseAutonomyApi() {
            let res = await this.$axios.get(
                this.$api.selfManagement.enterpriseAutonomy +
                    "?" +
                    this.$qs.stringify({
                        moduleType: "enterpriseAutonomy",
                        dataType: "data1",
                        // streetTown: this.stroes.$state.streetTown, //街镇
                        streetTown: "", //街镇
                    })
            );
            if (res.data.length > 0) {
                //  this.enterpriseAutonomyList.complaintList = res.data;
                this.enterpriseAutonomyList.complaintList = [
                    //   { name: "平面布局得分", value: 13.91, mark: "分" },
                    { name: "建筑整体指数", value: 8.5, mark: "分" },
                    { name: "设施状况指数", value: 9.1, mark: "分" },
                    { name: "自主管理指数", value: 20, mark: "分" },
                    { name: "监督执法指数", value: 25, mark: "分" },
                    { name: "火灾风险指数", value: 14, mark: "分" },
                ];
            }

            let res1 = await this.$axios.get(this.$api.selfManagement.resultStatistic);

            if (res1.data.length > 0) {
                let data = res1.data[0];
                this.enterpriseAutonomyList.scoreList = [
                    { name: "高风险数", value: data.highRisk, mark: "家" },
                    { name: "较高风险数", value: data.mildHighRisk, mark: "家" },
                    { name: "一般风险数", value: data.normalRisk, mark: "家" },
                    { name: "低风险数", value: data.lowRisk, mark: "家" },
                ];
            }
        },
        /**
         * @重点单位撒点详情
         * @api接口请求
         */
        async zddwSd(id) {
            let res = await this.$axios.get(
                this.$api.selfManagement.scatterData +
                    "?" +
                    this.$qs.stringify({
                        companyId: id,
                    })
            );
            if (res.data) {
                this.tkData = res.data[0];
                this.tk = true;
            }
        },
        /**
         * @雷达图切换饼图
         *
         */
        async radarToPie(id) {
            if (this.enterpriseAutonomyList.complaintList[id]) {
                this.checkPieData.value = this.pieData[id];
                this.checkPieData.name = this.enterpriseAutonomyList.complaintList[id].name;
                this.checkPieData.id = id;
                this.radar = 2;
            }
        },
        /**
         * @饼图切换table
         *
         */
        async PieToTable(pId, cId) {
            for (let i = 0; i < this.pieData[pId].length; i++) {
                if (i == cId) {
                    this.checkTable.data = this.pieData[pId][i].children;
                    this.checkTable.name = this.pieData[pId][i].name;
                    this.checkTable.total = this.pieData[pId][i].value;
                    if (this.checkTable.data[0].name) {
                        this.radar = 3;
                    } else {
                        this.$notify({
                            title: "三级指数不存在",
                            message: "",
                            position: "top-left",
                            offset: 100,
                        });
                        // alert("三级指数不存在")
                    }
                }
            }
        },
        /**
         * @图形切换
         *
         */
        async goBack(id) {
            if (id == 1) {
                this.radar = 1;
            } else {
                this.radar = 2;
            }
        },

        /**
         * @企业自主巡检情况
         * @api请求
         */
        async patrolInspectionApi() {
            let res = await this.$axios.get(
                this.$api.selfManagement.enterpriseAutonomy +
                    "?" +
                    this.$qs.stringify({
                        moduleType: "patrolInspection",
                        dataType: this.tabsArea,
                        // streetTown: this.stroes.$state.streetTown, //街镇搁置（1125监理关闭后期放开）
                    })
            );

            if (res.data.length > 0) {
                if (this.tabsArea == "data1") {
                    this.patrolInspectionList[0].value = res.data[0].value;
                    this.patrolInspectionList[0].name = res.data[0].name;
                    this.patrolInspectionList[1].value = res.data[1].value;
                    this.patrolInspectionList[1].name = res.data[1].name;
                    this.patrolInspectionList[2].value = res.data[2].value;
                    this.patrolInspectionList[2].name = res.data[2].name;
                    this.patrolInspectionList[3].value = res.data[3].value;
                    this.patrolInspectionList[3].name = res.data[3].name;
                }
                if (this.tabsArea == "data2") {
                    this.patrolInspectionList[0].value = res.data[0].value;
                    this.patrolInspectionList[0].name = res.data[0].name;
                    this.patrolInspectionList[1].value = res.data[1].value;
                    this.patrolInspectionList[1].name = res.data[1].name;
                    this.patrolInspectionList[2].value = res.data[2].value;
                    this.patrolInspectionList[2].name = res.data[2].name;
                    this.patrolInspectionList[3].value = res.data[3].value;
                    this.patrolInspectionList[3].name = res.data[3].name;
                }
                if (this.tabsArea == "data3") {
                    this.patrolInspectionList[0].value = res.data[0].value;
                    this.patrolInspectionList[0].name = res.data[0].name;
                    this.patrolInspectionList[1].value = res.data[1].value;
                    this.patrolInspectionList[1].name = res.data[1].name;
                    this.patrolInspectionList[2].value = res.data[2].value;
                    this.patrolInspectionList[2].name = res.data[2].name;
                    this.patrolInspectionList[3].value = res.data[3].value;
                    this.patrolInspectionList[3].name = res.data[3].name;
                }
            }
        },

        /**
         * @各街镇单位情况
         * @api请求
         */
        async streetCompanyApi() {
            this.streetCompanyList.xTims = null;
            this.streetCompanyList.xData = [];
            this.streetCompanyList.dataMap = [[], [], []];

            let res = await this.$axios.get(
                this.$api.selfManagement.enterpriseAutonomy +
                    "?" +
                    this.$qs.stringify({
                        moduleType: "streetCompany",
                        dataType: "data",
                    })
            );

            if (res.data.length > 0) {
                res.data.forEach((el) => {
                    this.streetCompanyList.xData.push(el.name);
                    this.streetCompanyList.dataMap[0].push(el.other);
                    this.streetCompanyList.dataMap[1].push(el.general);
                    this.streetCompanyList.dataMap[2].push(el.stress);
                });

                // this.streetCompanyList.xTims = setInterval(() => {
                this.streetCompanyList.xData.push(this.streetCompanyList.xData.shift());
                this.streetCompanyList.dataMap[0].push(this.streetCompanyList.dataMap[0].shift());
                this.streetCompanyList.dataMap[1].push(this.streetCompanyList.dataMap[1].shift());
                this.streetCompanyList.dataMap[2].push(this.streetCompanyList.dataMap[2].shift());
                // }, 5000);
            }
        },

        /**
         * @单位情况
         * @api请求
         */
        async streetCompanyApi1() {
            let res = await this.$axios.get(
                this.$api.selfManagement.enterpriseAutonomy +
                    "?" +
                    this.$qs.stringify({
                        moduleType: "streetCompany",
                        dataType: "data",
                        streetTown: this.stroes.$state.streetTown, //街镇
                    })
            );

            if (res.status === "SUCCESS") {
                this.streetDynamicData1 = [
                    {
                        name: "重点单位",
                        value: res.data[0].stress,
                        mark: "",
                    },
                    {
                        name: "一般单位",
                        value: res.data[0].general,
                        mark: "",
                    },
                    {
                        name: "其它单位",
                        value: res.data[0].other,
                        mark: "",
                    },
                    {
                        name: "街镇评分",
                        value: res.data[0].streetTownScore,
                        mark: "分",
                    },
                ];
            }
        },

        /**
         * @物联网设备情况
         * @api请求
         */
        async deviceTypeListApi() {
            let res = await this.$axios.get(
                this.$api.selfManagement.deviceTypeList 
            );
            if(res){
                this.diskData.total = res.data.deviceCount;
                this.diskData.data = res.data.typeList;
                this.diskData.data = res.data.typeList.map(item=>{
                    return {
                        name: item.deviceTypeName,
                        value: item.deviceCount,
                        lineCount: item.lineCount,
                        lineRate: item.lineRate.toFixed(2),
                        deviceTypeCode:item.deviceTypeCode
                    }
                })
            }
        },

        /**
         * @物联网处置情况 吉
         * @api请求
         */
        async iotDisposalApi() {
            var startDate = "";
            var endDate = "";

            if (this.tabsArea2 === "data1") {
                startDate = this.getDays().startTime;
                endDate = this.getDays().endTime;
            } else if (this.tabsArea2 === "data2") {
                startDate = this.getDays().startTime;
                endDate = this.getDays().endTime;
            } else if (this.tabsArea2 === "data3") {
                startDate = this.getMonth().startTime;
                endDate = this.getMonth().endTime;
            }
            let res = await this.$axios.get(
                this.$api.selfManagement.iotDisposal +
                    "?" +
                    this.$qs.stringify({
                        streetTown: this.stroes.$state.streetTown, //街镇
                        startDate: startDate, //开始时间
                        endDate: endDate, //结束时间
                    })
            );
            if (res.status === "SUCCESS") {
                if (this.tabsArea2 == "data1") {
                    this.iotDisposalList[0].value = 9004;
                    this.iotDisposalList[1].value = 8701;
                    this.iotDisposalList[2].value = parseInt("96.63%".split("%")[0]);
                } else {
                    this.iotDisposalList[0].value = res.data.alarmCount;
                    this.iotDisposalList[1].value = res.data.alarmProcessedCount;
                    this.iotDisposalList[2].value = parseInt(res.data.alarmProcessedRate.split("%")[0]);
                }
            }
        },


        /**
         * @各街镇物联动态
         * @api请求
         */
        async streetDynamicApi() {
            let res = await this.$axios.get(this.$api.selfManagement.streetDynamic + "?" + this.$qs.stringify({}));
            if (res.data.length > 0) {
                this.streetDynamicData = res.data;
            }
        },

        /**
         * @历史案件
         * @api请求
         */
        async caseListApi() {
            let res = await this.$axios.get(
                this.$api.selfManagement.caseList +
                    "?" +
                    this.$qs.stringify({
                        id: undefined, //案件编号
                        deviceType: undefined, //设备类型
                        companyName: undefined, //单位名称
                        streetTown: this.stroes.$state.streetTown, //街镇
                        pageNum: 1, //当前页
                        pageSize: this.tabsArea1, //每页条数
                    })
            );

            if (res.data.records.length > 0) {
                this.tableData2 = res.data.records;
                this.tableData2.forEach((val) => {
                    val.createTime = val.createTime ? val.createTime.replace("T", " ") : "--";
                    val.endTime = val.endTime ? val.endTime.replace("T", " ") : "--";
                });
            } else {
                this.tableData2 = [];
            }

            let res1 = await this.$axios.get(
                this.$api.selfManagement.caseStatistics +
                    "?" +
                    this.$qs.stringify({
                        streetTown: this.stroes.$state.streetTown, //街镇
                        companyId: undefined, //单位ID
                    })
            );

            if (res1.status === "SUCCESS") {
                this.gj[0].value = res1.data.deviceCount; //水系统检测设备
                this.gj[1].value = res1.data.onLineDeviceRatio; //上线率
                this.gj[2].value = res1.data.handleCaseRatio; //接单率
                this.gj[3].value = res1.data.closureCaseRatio; //处置率
            }
        },

        /**
         * @企业经营情况
         * @api请求
         */
        async erpDataApi() {
            let res = await this.$axios.get(
                this.$api.selfManagement.erpData +
                    "?" +
                    this.$qs.stringify({
                        companyId: undefined,
                    })
            );

            if (res.data.length > 0) {
                this.erpData = res.data;
            }
        },

        /**
         * @高德地图聚合撒点
         */
        async mapCluster(id) {
            // if(id == 0 || ){
            // console.log(this.stroes.$state.streetTown)
            await this.$axios
                .get(
                    this.$api.selfManagement.mapList +
                        "?" +
                        this.$qs.stringify({
                            streetTown: this.stroes.$state.streetTown,
                            companyType: this.checkedArray.checkedList[id].value,
                        })
                )
                .then((res) => {
                    if (res.data.length > 0) {
                        //点分布
                        let data = res.data;
                        let arr = [];
                        for (let i = 0; i < data.length; i++) {
                            arr[i] = {
                                id: data[i].id ? data[i].id : null,
                                type: data[i].companyTypeName ? data[i].companyTypeName : null,
                                address: data[i].address ? data[i].address : null,
                                companyName: data[i].companyName ? data[i].companyName : null,
                                streetTown: data[i].streetTown ? data[i].streetTown : null,
                                gisX: data[i].longitude,
                                gisY: data[i].latitude,
                                companyId: data[i].companyId,
                                linkPhone: data[i].linkPhone ? data[i].linkPhone : null,
                            };
                        }
                        setTimeout(() => {
                            let type = null;
                            for (let i = 0; i < this.checkedArray.checkedList.length; i++) {
                                if (this.checkedArray.checkedList[i].value == this.checkedArray.checkedData[0]) {
                                    type = this.checkedArray.checkedList[i].label;
                                }
                            }
                            this.initMarkers(arr.splice(0, 500), "self-management", this.checkedArray.checkedList[id].label);
                        }, 500);
                    } else {
                        this.initMarkers([], "self-management", this.checkedArray.checkedList[id].label);
                    }
                });
            // }else{
            //         console.log(id,this.checkedArray)
            //         this.addMarker([], "self-management", this.checkedArray.checkedList[id].label);
            // }
        },

        /**
         * @高德地图撒点
         */
        async mapList() {
            let res = await this.$axios.get(
                this.$api.selfManagement.mapList +
                    "?" +
                    this.$qs.stringify({
                        streetTown: this.stroes.$state.streetTown,
                        companyType: this.checkedArray.checkedData[0],
                    })
            );
            if (res.data.length > 0) {
                this.addMarker(res.data, "企业自主管理", this.checkedArray.checkedData[0]);
            } else {
                this.addMarker([], "企业自主管理", this.checkedArray.checkedData[0]);
            }
        },
        /**
         * 单位信息选择
         * @param {*} id
         */
        selectArray(id) {
            let data = this.checkedSelectArray.filter((val) => {
                if (val.value == id) {
                    return val.label;
                }
            });
            this.checkedSelectLabel = data[0].label;
            this.checkboxChange(id);
        },
        /**
         * 工业选择
         * @param {*} id
         */
        selectArray2(id) {
            let data = this.checkedSelectArray2.filter((val) => {
                if (val.value == id) {
                    return val.label;
                }
            });
            this.checkedSelectLabel2 = data[0].label;
            this.checkboxChange(id);
        },
        /**
         * 学校选择
         * @param {*} id
         */
        selectArray3(id) {
            let data = this.checkedSelectArray3.filter((val) => {
                if (val.value == id) {
                    return val.label;
                }
            });
            this.checkedSelectLabel3 = data[0].label;
            this.checkboxChange(id);
        },
        /**
         * 撒点街镇选择
         */
        checkStreetTown(value) {
            let data = undefined;
            for (let i = 0; i < this.stroes.$state.mhjz.length; i++) {
                if (this.stroes.$state.streetTown == this.stroes.$state.mhjz[i].streetTown) {
                    data = this.stroes.$state.mhjz[i];
                    break;
                }
            }
            if (!this.stroes.$state.streetTown) {
                data = this.stroes.$state.mhjz[0];
            }
            if (this.stroes.$state.mapBool == 2) {
                this.streetTownSwitch(data);
            }
            this.getStreetTownClick();
            this.sadianSelect(this.checkedArray.checkedData[0]);
        },

        /**
         * 撒点
         * code 物联网code
         */
        async sadian(id,code) {
            let arr = [];
            let typeAll = this.checkedSelectArray;
            let type = null;
            for (let i = 0; i < typeAll.length; i++) {
                if (id == typeAll[i].value) {
                    type = typeAll[i].label;
                }
            }
            if (id == 0) {
                this.addMarker([], "self-management");
            }
            if (id == 1 || id == 2 || id == 3 || id == 9) {
                await this.$axios
                    .get(
                        this.$api.selfManagement.mapList +
                            "?" +
                            this.$qs.stringify({
                                streetTown: this.stroes.$state.streetTown,
                                companyType: id,
                            })
                    )
                    .then((res) => {
                        if (res.data.length > 0) {
                            //点分布
                            let data = res.data;
                            for (let i = 0; i < data.length; i++) {
                                arr[i] = {
                                    id: data[i].id ? data[i].id : null,
                                    type: data[i].companyTypeName ? data[i].companyTypeName : null,
                                    address: data[i].address ? data[i].address : null,
                                    companyName: data[i].companyName ? data[i].companyName : null,
                                    streetTown: data[i].streetTown ? data[i].streetTown : null,
                                    gisX: data[i].longitude,
                                    gisY: data[i].latitude,
                                    companyId: data[i].companyId,
                                    linkPhone: data[i].linkPhone ? data[i].linkPhone : null,
                                };
                            }
                            setTimeout(() => {
                                this.addMarker(arr.splice(0, 500), "self-management", type);
                            }, 500);
                        } else {
                            this.addMarker([], "self-management", type);
                        }
                    });
            } else if (id == 6) {
                this.$axios
                    .get(
                        this.$api.fireSite.demHighRiseList +
                            "?" +
                            this.$qs.stringify({
                                id: 0,
                            })
                    )
                    .then((res2) => {
                        for (let i = 0; i < res2.data.length; i++) {
                            res2.data[i].stationType = 112;
                            arr.push(res2.data[i]);
                        }
                        this.addMarker(arr, "rescue-station", "高层建筑");
                    });
            } else if (id == 10) {
                this.$axios
                    .post(this.$api.water.baseGgpFacilityList, {
                        facilityType: [2, 3],
                    })
                    .then((res) => {
                        // 2 五万
                        // 3 三至五万
                        for (let i = 0; i < res.data.length; i++) {
                            arr[i] = {};
                            arr[i].address = res.data[i].address;
                            arr[i].facilityName = res.data[i].facilityName;
                            arr[i].extendData = res.data[i].extendData;
                            arr[i].latitude = res.data[i].latitude;
                            arr[i].longitude = res.data[i].longitude;
                            arr[i].type = "大型综合体";
                            if (res.data[i].id == 48) {
                                //龙湖天街试点
                                arr[i].facilityType = "lhtj";
                            } else {
                                arr[i].facilityType = res.data[i].facilityType;
                            }
                        }
                        this.addMarker(arr, "self-management", "大型综合体");
                    });
            } else if (id == 11) {
                this.$axios
                    .post(this.$api.water.baseGgpFacilityList, {
                        facilityType: [2, 3],
                    })
                    .then((res) => {
                        // 2 五万
                        // 3 三至五万
                        for (let i = 0; i < res.data.length; i++) {
                            arr[i] = {};

                            if (res.data[i].id == 48) {
                                //龙湖天街试点
                                arr[i].facilityType = "lhtj";
                                arr[i].address = res.data[i].address;
                                arr[i].facilityName = res.data[i].facilityName;
                                arr[i].extendData = res.data[i].extendData;
                                arr[i].latitude = res.data[i].latitude;
                                arr[i].longitude = res.data[i].longitude;
                                arr[i].type = "大型综合体";
                            }
                        }
                        this.addMarker(arr, "self-management", "大型综合体");
                    });
            } else if (id == 1001) {
                let res = await this.$axios.get(
                    this.$api.city.storeScatterer +
                        "?" +
                        this.$qs.stringify({
                            streetTown: this.stroes.$state.streetTown,
                        })
                );
                if (res?.data.length > 0) {
                    this.addMarker(res.data, "fire-signs", "仓库");
                } else {
                    this.addMarker([], "fire-signs", "");
                }
            } else if (id == 19 || id == 20 || id == 21) {
                //学校
                let typeAll3 = this.checkedSelectArray3;
                let type3 = null;
                for (let i = 0; i < typeAll3.length; i++) {
                    if (id == typeAll3[i].value) {
                        type3 = typeAll3[i].label;
                    }
                }
                this.$axios
                    .post(this.$api.water.baseGgpFacilityList, {
                        facilityType: [id],
                    })
                    .then((res) => {
                        for (let i = 0; i < res.data.length; i++) {
                            arr[i] = res.data[i];
                            arr[i].type = type3;
                        }
                        this.addMarker(arr, "self-management", type3);
                    });
            } else if (id == 22) {
                this.$axios
                    .post(this.$api.water.baseGgpFacilityList, {
                        facilityType: [id],
                    })
                    .then((res) => {
                        this.addMarker(res.data, "self-management", "单位巡检");
                    });
            }else if(id == 123){
                this.$axios.get(
                    this.$api.selfManagement.deviceTypeScatter +
                        "?" +
                        this.$qs.stringify({
                            deviceTypeCode: code,
                        })
                ).then(res=>{
                    this.addMarker(res.data, "self-management", "物联网设备");
                    
                })
                
            
            } else {
            this.addMarker([], "self-management", "");
        }
        },
        /**
         * 物联网撒点
         */
         diskSd(id){
           
            this.sadian(123,id)
            
         },
        /**
         * d单位巡检事件
         */
        unitInspection(id){
            if(id == 0){
                this.sadian(22)
            }
            
        }
    },
};
</script>

<style lang="scss" scoped>
@import "@/assets/scss/color.scss";
.contentBox {
    .leftBox {
        .leftTop {
            height: 44%;
            max-height: 44%;
            overflow: hidden;
            .leftTopContent {
                height: calc(100% - 0.4375rem);
                .contentOne {
                    margin-top: 0.1rem;
                    height: 60%;
                }
                .contentOneH {
                    height: 100%;
                    .return {
                        cursor: pointer;
                        width: 10%;
                        margin-left: 90%;
                        height: 0.5rem;
                        position: absolute;
                        right: 0.25rem;
                        z-index: 10;
                        .returnText {
                            width: 0.5rem;
                            text-align: center;
                            height: 0.3rem;
                            line-height: 0.3rem;
                            box-shadow: inset 0 0 0.05rem 0.05rem #1b4f90;
                            background: rgba(19, 42, 90, 0.2) !important;
                            color: #fff;
                            float: right;
                            margin-top: 0.1rem;
                        }
                    }
                    p {
                        color: #fff;
                        font-size: 0.2rem;
                        margin: 0.4rem 0 0.05rem;
                        span {
                            font-weight: 700;
                        }
                    }
                }
                .contentTwo {
                    height: 40%;
                    .dj {
                        font-size: 15px;
                        margin: auto 0;
                        flex-flow: nowrap;
                        width: 99%;
                        padding: 6px 0 6px 20%;
                        cursor: pointer;
                    }
                    .djActive {
                        background: rgba(255, 255, 255, 0.1);
                    }
                }
            }
        }
        .leftCenter {
            height: calc(28% - 00.125rem);
            max-height: calc(28% - 00.125rem);
            padding-top: 0.125rem;
            overflow: hidden;
            .leftCenterContent {
                // height: 2.6875rem;
                height: calc(100% - 0.4375rem);
                padding: 0.125rem;
                .contentOne {
                    margin: auto;
                }
            }
        }
        .leftBot {
            height: calc(28% - 00.125rem);
            max-height: calc(28% - 00.125rem);
            padding-top: 0.125rem;
            width: 100%;
            .leftBotContent {
                width: 100%;
                // height: 3.1875rem;
                height: calc(100% - 0.4375rem);

                .contentOne {
                    display: flex;
                    padding: 0px 0.375rem;
                }
            }
        }
    }
    .rightBox {
        .rightTop {
            height: 35%;
            max-height: 35%;
            overflow: hidden;
            width: 100%;
            .topContent {
                height: calc(100% - 0.6875rem);
                margin: 0.125rem;
            }
        }

        .rightCenter {
            height: calc(30% - 0.125rem);
            max-height: calc(30% - 0.125rem);
            overflow: hidden;
            padding-top: 0.125rem;
            color: #fff;
            font-size: 0.2rem;

            .rightCenterContent {
                height: calc(100% - 0.4375rem);
                padding: 0.125rem 0;

                > .el-col {
                    display: flex;
                    > div {
                        margin: auto 0;
                        width: 100%;
                    }
                }
            }
        }

        .rightBot {
            height: calc(35% - 0.125rem);
            max-height: calc(35% - 0.125rem);
            overflow: hidden;
            padding-top: 0.125rem;
            color: #fff;
            font-size: 0.2rem;

            .rightBotContent {
                width: 100%;
                height: calc(100% - 0.5625rem);
                margin-top: 0.125rem;
                overflow: auto;

                & > .el-row {
                    overflow: hidden;
                    width: 100%;
                    height: auto;
                    & > .title {
                        width: 100%;
                        height: 0.4375rem;
                        line-height: 0.4375rem;
                        padding: 0 0.125rem;
                        background: rgba(115, 251, 253, 0.6) !important;
                        margin-bottom: 0.025rem;
                    }
                    & > .data {
                        width: 100%;
                        padding: 0 0.125rem;
                        background: rgba(115, 251, 253, 0.4) !important;
                        margin-bottom: 0.025rem;
                        white-space: initial;
                        .el-col {
                            line-height: 0.35rem;
                        }
                    }
                }

                &::-webkit-scrollbar {
                    display: none;
                }
            }

            .rightBoContent1 {
                height: calc(100% - 0.6875rem);
                padding: 0.125rem 0;

                > .el-row {
                    margin-bottom: 0.125rem;

                    > div {
                        display: flex;

                        > img {
                            margin: auto 0.125rem auto 0px;
                            width: 0.4375rem;
                            height: 0.4375rem;
                        }
                    }

                    > div:first-child {
                        // margin-right: auto;
                    }

                    > div:nth-child(2) {
                        margin: auto;
                    }

                    > div:nth-child(3) {
                        margin: auto;
                    }

                    > div:last-child {
                        // margin-left: auto;
                    }
                }
            }
        }
    }
}
.tableTooltipwt {
    width: 6rem;
    background: transparent;
    border-radius: 0.05rem;
    box-shadow: inset 0 0 1px 0.0125rem rgba(115, 251, 253, 1);
    background: rgba(0, 29, 49, 0.5);
    font-size: 0.2rem;
    padding: 0.1875rem;
    position: fixed;
    top: 140px;
    right: 600px;
    z-index: 10000;
    .close {
        width: 20px;
        height: 20px;
        position: absolute;
        right: 10px;
        top: 10px;
        z-index: 10000;
        display: block;
    }
    .tableContent {
        p {
            @include color_primary($color-primary1);
        }

        .el-col {
            margin-top: 0.05rem;
            line-height: 0.3rem;
            text-overflow: ellipsis !important;
            white-space: normal !important;
        }
        .mk {
            margin-top: 0px;
        }
    }
}
.color1 {
    @include color_primary($color-primary3);
    margin-left: 10px;
}
.color2 {
    @include color_primary($color-primary1);
}
table {
    width: 100%;
    text-align: center;
    color: #fff;
    border: 1px solid #fff;
    font-size: 12px;
}

table thead tr th {
    padding: 5px 0px;
    font-weight: 400;
    border: 1px solid #fff;
}

table tbody tr td {
    padding: 5px 0px;
}

table tbody tr:nth-child(2n) td {
    //     background-color: lightblue;
}

td {
    border: 0.5px solid #fff;
}
</style>
<style>
.el-step__description.is-finish {
    color: #73fbfd !important;
    margin-top: 30px;
}
.el-step__title.is-finish {
    color: #73fbfd !important;
    margin-top: -60px;
}
.is-finish .is-text {
    border: 1px solid #73fbfd;
    background: #7a6a6a;
}
.is-finish .el-step__icon-inner {
    color: #73fbfd !important;
}
.is-process .is-text {
    border: 1px solid #73fbfd;
    background: #7a6a6a;
}
.is-process .el-step__icon-inner {
    color: #73fbfd !important;
}
.is-wait .is-text {
    border: 1px solid #fff;
    background: #7a6a6a !important;
}
.is-wait .el-step__icon-inner {
    color: #fff !important;
}
.el-step__description .is-wait {
    color: #fff;
}
.el-step__title.is-process {
    color: #73fbfd !important;
    margin-top: -60px;
}
.el-step__title.is-wait {
    color: #fff !important;
    margin-top: -60px;
}
.el-step__description.is-process {
    color: #73fbfd !important;
    margin-top: 30px;
}
.el-step__description.is-wait {
    color: #fff !important;
    margin-top: 30px;
}
.el-step.is-center .el-step__description {
    padding: 0;
}
.el-steps--horizontal {
    width: 500px;
}
.el-step__icon {
    /* background: transparent; */
}
.is-finish .el-step__line {
    background: #73fbfd;
}
</style>