<template>
    <div class="Inspection">
        <div>
            <el-row>
                <el-col :span="24">
                    <el-form ref="form" :inline="true" :model="form" class="demo-form-inline">
                        <el-form-item label="数据类型:">
                            <el-select v-model.trim="form.dataType" placeholder="请选择数据类型" @change="onSubmit" disabled>
                                <el-option v-for="item in networkList" :key="item.id" :label="item.name"
                                    :value="item.id"></el-option>
                            </el-select>
                        </el-form-item>

                        <el-form-item label="监测点名称:">
                            <el-input clearable v-model="form.searchValue" placeholder="请输入监测点名称"></el-input>
                        </el-form-item>
                        <el-form-item label="监测点状态:">
                            <el-select clearable v-model.trim="form.monitorState" placeholder="请选择监测点状态">
                                <el-option v-for="item in options" :key="item.id" :label="item.name"
                                    :value="item.id"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="监测点类型:" v-if="activeName == 3">
                            <el-select clearable v-model.trim="form.treeType" placeholder="请选择监测点类型">
                                <el-option v-for="item in Subcategory" :key="item.id" :label="item.name"
                                    :value="item.id"></el-option>
                            </el-select>
                        </el-form-item>

                        <el-form-item>
                            <el-button type="primary" @click="onSubmit" class="ml10" icon="el-icon-search">
                                查询
                            </el-button>

                            <!-- <el-button type="primary" icon="el-icon-download">导出</el-button> -->
                        </el-form-item>
                    </el-form>
                </el-col>
            </el-row>
            <el-row :gutter="20" style="margin-left: 0; position: relative">
                <i v-if="colSpan == 24" class="el-icon-caret-right" @click="colSpan = 19"></i>
                <el-col v-show="colSpan != 24" class="left" :style="'height:' + (vh + 55) + 'px;'" :span="5">
                    <i class="el-icon-caret-left" v-if="colSpan == 19" @click="colSpan = 24"></i>
                    <el-input placeholder="输入关键字进行过滤" clearable v-model="filterText"
                        style="margin-bottom: 10px"></el-input>

                    <el-tree class="treeEl" :highlight-current="true" :expand-on-click-node="false"
                        :style="'height: ' + (vh - 10) + 'px;overflow-y: auto;'" :data="treeData" :props="defaultProps"
                        node-key="id" default-expand-all :filter-node-method="filterNode" @node-click="handleNodeClick"
                        ref="tree" v-loading="loadingTree"></el-tree>
                </el-col>
                <el-col :span="colSpan" style="padding-right: 0">
                    <el-tabs v-model="activeName" @tab-click="handleClick">
                        <el-tab-pane label="Ⅰ类监测点" name="1">
                            <div v-if="activeName == 1">
                                <div>
                                    <!-- <el-button
                    type="primary"
                    @click="newlyAddeds"
                    style="margin-bottom: 10px"
                    icon="el-icon-plus"
                    >新增</el-button
                  > -->
                                    <!-- <el-button
                  @click="details"
                  icon="el-icon-view"
                  type="primary"
                  size="small"
                  >详情</el-button
                >
                <el-button
                  icon="el-icon-edit"
                  type="primary"
                  size="small"
                  @click="modify"
                  >修改</el-button
                > -->
                                    <!-- <el-button
                    icon="el-icon-delete"
                    type="primary"
                    size="small"
                    @click="open"
                    >删除</el-button
                  > -->
                                </div>
                                <el-table stripe v-loading="loading" :data="tableData" border highlight-current-row
                                    style="width: 100%" :height="vh - 35" header-cell-class-name="table_header"
                                    :header-cell-style="thStyleFun" :cell-style="cellStyleFun"
                                    @selection-change="handleSelectionChange">
                                    <el-table-column show-overflow-tooltip label="序号" width="60">
                                        <template scope="scope">
                                            <span>{{ (form.pageNum - 1) * form.pageSize + scope.$index + 1 }}</span>
                                        </template>
                                    </el-table-column>
                                    <el-table-column show-overflow-tooltip prop="name" label="监测点名称"
                                        min-width="150"></el-table-column>
                                    <!-- <el-table-column show-overflow-tooltip prop="city" label="所属城市" min-width="90">
            </el-table-column> -->
                                    <!--                  <el-table-column
                    show-overflow-tooltip
                    prop="id"
                    label="监测点ID"
                    width="120"
                  >
                  </el-table-column>-->
                                    <el-table-column show-overflow-tooltip prop="orgName" label="组织机构名称"
                                        width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="operationName" label="运维单位名称"
                                        min-width="150"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="powerrName" label="变电站名称"
                                        min-width="120"></el-table-column>

                                    <!--                  <el-table-column
                    show-overflow-tooltip
                    prop="generatrixName"
                    label="母线名称"
                    min-width="100"
                  >
                  </el-table-column>-->
                                    <el-table-column show-overflow-tooltip prop="lineName" label="监测线路名称"
                                        min-width="120"></el-table-column>
                                    <!--                  <el-table-column
                    show-overflow-tooltip
                    prop="lineId"
                    label="监测线路ID"
                    min-width="150"
                  >
                  </el-table-column>-->
                                    <el-table-column show-overflow-tooltip prop="voltageLevel" label="电压等级"
                                        min-width="100" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="monitorState" label="监测点状态"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="monitorType" label="监测点类型"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="minShortCircuitCapacity" label="最小短路容量"
                                        min-width="140"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="powerSupplyEqCapacity" label="供电设备容量"
                                        min-width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="userAgreementCapacity" label="用户协议容量"
                                        min-width="150"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="voltageDeviationUpperLimit"
                                        label="电压偏差限值（上）" min-width="180"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="voltageDeviationLowerLimit"
                                        label="电压偏差限值（下）" min-width="180"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="potentialTransFormerType"
                                        label="电压互感器类型" min-width="140" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="neutralGroundingMode" label="中性点接地方式"
                                        min-width="150" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="isSpecialSupplyElectricity"
                                        label="是否用户专线" min-width="150">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.isSpecialSupplyElectricity == 1 ? '是' : '否' }}</span>
                                        </template>
                                    </el-table-column>
                                    <el-table-column show-overflow-tooltip prop="monitorTag" label="监测点标签"
                                        min-width="150" :formatter="formFilter" />
                                    <el-table-column show-overflow-tooltip prop="monitorObjectId" label="监测对象类型"
                                        min-width="150" :formatter="formFilter" />
                                    <el-table-column show-overflow-tooltip prop="monitorObjectName" label="监测对象名称"
                                        min-width="150" :formatter="formFilter" />
                                    <el-table-column show-overflow-tooltip prop="statisticalInterval" label="统计间隔"
                                        min-width="150" />
                                    <!--                                    <el-table-column
                                        show-overflow-tooltip
                                        prop="terminalId"
                                        label="关联的监测终端编号"
                                        min-width="180"
                                    />-->
                                    <el-table-column show-overflow-tooltip prop="terminalWiringMethod" label="监测终端接线方式"
                                        min-width="180" :formatter="formFilter" />
                                    <el-table-column show-overflow-tooltip prop="isUpToGrid" label="是否上送网公司监测点"
                                        min-width="180">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.isUpToGrid == 1 ? '是' : '否' }}</span>
                                        </template>
                                    </el-table-column>

                                    <el-table-column fixed="right" label="操作" width="130">
                                        <template slot-scope="scope">
                                            <el-button type="primary" icon="el-icon-view" size="mini"
                                                @click="ViewReport(scope.row)">
                                                查看趋势图
                                            </el-button>
                                            <!-- <el-button
                        type="primary"
                        icon="el-icon-view"
                        size="mini"
                        @click="trend(scope.row)"
                        >查看趋势图</el-button
                      > -->
                                        </template>
                                    </el-table-column>
                                    <!-- <el-table-column show-overflow-tooltip prop="whether" label="是否应设点" min-width="100">
            </el-table-column> -->
                                </el-table>
                                <el-pagination background class="mt10" align="right" @size-change="handleSizeChange"
                                    @current-change="handleCurrentChange" :current-page="form.pageNum"
                                    :page-sizes="[20, 30, 40, 50, 100]" :page-size="form.pageSize"
                                    layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
                            </div>
                        </el-tab-pane>
                        <el-tab-pane label="Ⅱ类监测点" v-if="form.dataType != 0" name="2">
                            <div v-if="activeName == 2">
                                <div>
                                    <!-- <el-button
                    type="primary"
                    @click="newlyAddeds"
                    style="margin-bottom: 10px"
                    icon="el-icon-plus"
                    >新增</el-button
                  > -->
                                    <!-- <el-button
                  @click="details"
                  icon="el-icon-view"
                  type="primary"
                  size="small"
                  >详情</el-button
                >
                <el-button
                  icon="el-icon-edit"
                  type="primary"
                  size="small"
                  @click="modify"
                  >修改</el-button
                > -->
                                    <!-- <el-button
                    icon="el-icon-delete"
                    type="primary"
                    size="small"
                    @click="open"
                    >删除</el-button
                  > -->
                                </div>
                                <el-table stripe v-loading="loading" :data="tableData" border style="width: 100%"
                                    :height="vh - 35" header-cell-class-name="table_header"
                                    :header-cell-style="thStyleFun" :cell-style="cellStyleFun"
                                    @selection-change="handleSelectionChange">
                                    <el-table-column show-overflow-tooltip label="序号" width="60">
                                        <template scope="scope">
                                            <span>{{ (form.pageNum - 1) * form.pageSize + scope.$index + 1 }}</span>
                                        </template>
                                    </el-table-column>
                                    <el-table-column show-overflow-tooltip prop="id" label="台区编号"
                                        min-width="150"></el-table-column>
                                    <!-- <el-table-column show-overflow-tooltip prop="city" label="所属城市" min-width="90">
            </el-table-column> -->
                                    <el-table-column show-overflow-tooltip prop="name" label="台区名称"
                                        width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="orgName" label="组织机构名称"
                                        width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="operationName" label="运维单位名称"
                                        min-width="150"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="powerrName" label="变电站名称"
                                        min-width="120"></el-table-column>

                                    <el-table-column show-overflow-tooltip prop="lineName" label="监测线路名称"
                                        min-width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="pcapacity" label="配变容量"
                                        min-width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="regionalism" label="地区特征"
                                        min-width="150" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="ifRuralPowerGrid" label="是否农网"
                                        min-width="100">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.ifRuralPowerGrid == 1 ? '是' : '否' }}</span>
                                        </template>
                                    </el-table-column>
                                    <el-table-column show-overflow-tooltip prop="natureOfUse" label="使用性质"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="powerSupplyRadius" label="供电半径"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="lineLength" label="供电线路总长度"
                                        min-width="140"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="state" label="运行状态" min-width="120"
                                        :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="distributedPhotovoltaicNum"
                                        label="分布式光伏用户数" min-width="180"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="photovoltaicCapacity"
                                        label="分布式光伏总装机容量" min-width="180"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="ifBevAp" label="是否有电动汽车接入"
                                        min-width="180"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="apLoadType" label="接入负荷类型"
                                        min-width="140" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="isUpToGrid" label="是否上送网公司监测点"
                                        min-width="160">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.isUpToGrid == 1 ? '是' : '否' }}</span>
                                        </template>
                                    </el-table-column>

                                    <el-table-column fixed="right" label="操作" width="130">
                                        <template slot-scope="scope">
                                            <el-button type="primary" icon="el-icon-view" size="mini"
                                                @click="ViewReport(scope.row)">
                                                查看趋势图
                                            </el-button>
                                            <!-- <el-button
                        type="primary"
                        icon="el-icon-view"
                        size="mini"
                        @click="trend(scope.row)"
                        >查看报趋势图</el-button
                      > -->
                                        </template>
                                    </el-table-column>
                                    <!-- <el-table-column show-overflow-tooltip prop="whether" label="是否应设点" min-width="100">
            </el-table-column> -->
                                </el-table>
                                <el-pagination background class="mt10" align="right" @size-change="handleSizeChange"
                                    @current-change="handleCurrentChange" :current-page="form.pageNum"
                                    :page-sizes="[20, 30, 40, 50, 100]" :page-size="form.pageSize"
                                    layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
                            </div>
                        </el-tab-pane>
                        <el-tab-pane label="Ⅲ类监测点" v-if="form.dataType != 0" name="3">
                            <div v-if="activeName == 3">
                                <div>
                                    <!-- <el-button
                    type="primary"
                    @click="newlyAddeds"
                    style="margin-bottom: 10px"
                    icon="el-icon-plus"
                    >新增</el-button
                  > -->
                                    <!-- <el-button
                  @click="details"
                  icon="el-icon-view"
                  type="primary"
                  size="small"
                  >详情</el-button
                >
                <el-button
                  icon="el-icon-edit"
                  type="primary"
                  size="small"
                  @click="modify"
                  >修改</el-button
                > -->
                                    <!-- <el-button
                    icon="el-icon-delete"
                    type="primary"
                    size="small"
                    @click="open"
                    >删除</el-button
                  > -->
                                </div>
                                <!-- 用电 -->
                                <el-table stripe v-loading="loading" v-if="flag" :data="tableData" border
                                    style="width: 100%" :height="vh - 35" header-cell-class-name="table_header"
                                    :header-cell-style="thStyleFun" :cell-style="cellStyleFun"
                                    @selection-change="handleSelectionChange">
                                    <el-table-column show-overflow-tooltip label="序号" width="60">
                                        <template scope="scope">
                                            <span>{{ (form.pageNum - 1) * form.pageSize + scope.$index + 1 }}</span>
                                        </template>
                                    </el-table-column>
                                    <el-table-column show-overflow-tooltip prop="id" label="用户编号"
                                        min-width="150"></el-table-column>
                                    <!-- <el-table-column show-overflow-tooltip prop="city" label="所属城市" min-width="90">
            </el-table-column> -->
                                    <el-table-column show-overflow-tooltip prop="name" label="用户名称"
                                        width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="orgName" label="组织机构名称"
                                        width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="operationName" label="运维单位名称"
                                        min-width="150"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="userTag" label="用户标签"
                                        min-width="150"></el-table-column>

                                    <el-table-column show-overflow-tooltip prop="isUpToGrid" label="是否上送网公司监测点"
                                        min-width="160">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.isUpToGrid == 1 ? '是' : '否' }}</span>
                                        </template>
                                    </el-table-column>
                                    <!-- 用电 -->

                                    <el-table-column show-overflow-tooltip prop="powerCategory" label="电源类别"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="powerStationType" label="电站类型"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="powerGenerationMode" label="发电方式"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="voltageLevel" label="并网电压等级"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="sourceCapacity" label="总装机容量"
                                        min-width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="sourceCapacity" label="总装机容量"
                                        min-width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="connectionDate" label="并网日期"
                                        min-width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="connectionMode" label="能源消纳方式"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="gcStat" label="客户状态" min-width="120"
                                        :formatter="formFilter"></el-table-column>

                                    <el-table-column fixed="right" label="操作" width="130">
                                        <template slot-scope="scope">
                                            <el-button type="primary" icon="el-icon-view" size="mini"
                                                @click="ViewReport(scope.row)">
                                                查看趋势图
                                            </el-button>
                                            <!-- <el-button
                        type="primary"
                        icon="el-icon-view"
                        size="mini"
                        @click="trend(scope.row)"
                        >查看报趋势图</el-button
                      > -->
                                        </template>
                                    </el-table-column>
                                    <!-- <el-table-column show-overflow-tooltip prop="whether" label="是否应设点" min-width="100">
            </el-table-column> -->
                                </el-table>
                                <!-- 发电 -->
                                <el-table stripe v-else :data="tableData" border style="width: 100%" :height="vh - 35"
                                    header-cell-class-name="table_header" :header-cell-style="thStyleFun"
                                    :cell-style="cellStyleFun" @selection-change="handleSelectionChange">
                                    <el-table-column show-overflow-tooltip label="序号" width="60">
                                        <template scope="scope">
                                            <span>{{ (form.pageNum - 1) * form.pageSize + scope.$index + 1 }}</span>
                                        </template>
                                    </el-table-column>
                                    <el-table-column show-overflow-tooltip prop="id" label="用户编号"
                                        min-width="150"></el-table-column>
                                    <!-- <el-table-column show-overflow-tooltip prop="city" label="所属城市" min-width="90">
            </el-table-column> -->
                                    <el-table-column show-overflow-tooltip prop="name" label="用户名称"
                                        width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="orgName" label="组织机构名称"
                                        width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="operationName" label="运维单位名称"
                                        min-width="150"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="userTag" label="用户标签"
                                        min-width="150"></el-table-column>

                                    <el-table-column show-overflow-tooltip prop="isUpToGrid" label="是否上送网公司监测点"
                                        min-width="160">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.isUpToGrid == 1 ? '是' : '否' }}</span>
                                        </template>
                                    </el-table-column>

                                    <!-- 发电 -->

                                    <el-table-column show-overflow-tooltip prop="userType" label="用户分类" min-width="120"
                                        :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="industryType" label="行业分类"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="electricityType" label="用电类别"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="contractCapacity" label="合同容量"
                                        min-width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="operatingCapacity" label="运行容量"
                                        min-width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="productionShift" label="生产班次"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="loadNature" label="负荷性质"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="voltageLevel" label="供电电压"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="highIndustryType" label="高耗能行业类别"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="powerTransmissionDate" label="送电日期"
                                        min-width="120"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="importanceLevel" label="重要性等级"
                                        min-width="120" :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="eccStat" label="用电客户状态" min-width="120"
                                        :formatter="formFilter"></el-table-column>
                                    <el-table-column show-overflow-tooltip prop="ifSensitiveUser" label="是否敏感用户"
                                        min-width="120">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.ifSensitiveUser == 1 ? '是' : '否' }}</span>
                                        </template>
                                    </el-table-column>
                                    <el-table-column show-overflow-tooltip prop="ifPowerQuality" label="是否影响电能质量"
                                        min-width="140">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.ifPowerQuality == 1 ? '是' : '否' }}</span>
                                        </template>
                                    </el-table-column>
                                    <el-table-column show-overflow-tooltip prop="ifKeyCustomers" label="是否重要客户"
                                        min-width="120">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.ifKeyCustomers == 1 ? '是' : '否' }}</span>
                                        </template>
                                    </el-table-column>
                                    <el-table-column show-overflow-tooltip prop="sensitiveType" label="敏感用户类别"
                                        min-width="120" :formatter="formFilter"></el-table-column>

                                    <el-table-column fixed="right" label="操作" width="130">
                                        <template slot-scope="scope">
                                            <el-button type="primary" icon="el-icon-view" size="mini"
                                                @click="ViewReport(scope.row)">
                                                查看趋势图
                                            </el-button>
                                            <!-- <el-button
                        type="primary"
                        icon="el-icon-view"
                        size="mini"
                        @click="trend(scope.row)"
                        >查看报趋势图</el-button
                      > -->
                                        </template>
                                    </el-table-column>
                                    <!-- <el-table-column show-overflow-tooltip prop="whether" label="是否应设点" min-width="100">
            </el-table-column> -->
                                </el-table>
                                <el-pagination background class="mt10" align="right" @size-change="handleSizeChange"
                                    @current-change="handleCurrentChange" :current-page="form.pageNum"
                                    :page-sizes="[20, 30, 40, 50, 100]" :page-size="form.pageSize"
                                    layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
                            </div>
                        </el-tab-pane>
                    </el-tabs>
                </el-col>
            </el-row>
        </div>
        <el-dialog :close-on-click-modal="false" title="请选择数据类型" :visible.sync="dialogVisible5" width="300px"
            :before-close="handleClose">
            <el-select v-model="value" placeholder="请选择数据类型">
                <el-option v-for="item in networkList" :key="item.id" :label="item.name" :value="item.id"></el-option>
            </el-select>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible5 = false">取 消</el-button>
                <el-button type="primary" @click="newlyAdded">确 定</el-button>
            </span>
        </el-dialog>
        <monitor1 v-if="dialogVisible1" ref="monitor1" :treeList="treeList" :dialogVisible="dialogVisible1"
            :title="title" :formInline="formInline" @monitorClose="monitorClose" />
        <monitor2 v-if="dialogVisible2" ref="monitor2" :treeList="treeList" :dialogVisible="dialogVisible2"
            :title="title" :formInline="formInline" @monitorClose="monitorClose" />
        <monitor3 v-if="dialogVisible3" ref="monitor3" :treeList="treeList" :dialogVisible="dialogVisible3"
            :title="title" :formInline="formInline" @monitorClose="monitorClose" />
        <terminalDialog v-if="dialogVisible4" ref="monitor4" :dialogVisible="dialogVisible4" :title="title"
            :formInline="formInline" @monitorClose="monitorClose" />
        <MainNetworkAddition v-if="shwoMainNetworkAddition" ref="monitor1" :orgId="form.orgId"
            :dialogVisible="MainNetworkAddition" :title="title" :activeName="activeName" @monitorClose="monitorClose"
            @success="success" />
        <Photovoltaic ref="Photovoltaic" :PMSobtain="PMSobtain" :flg="false" :title="title" @Close="monitorClose"
            :photovoltaicAccountData="photovoltaicAccountData"
            :tableHeaderPhotovoltaicaccount="tableHeaderPhotovoltaicaccount" />
    </div>
</template>
<script>
import {
    typeTree,
    getOneMonitorByOrgId,
    getTwoMonitorByOrgId,
    getThreeYongMonitorByOrgId,
    delPvLineDetail,
    getPvDeviceById,
    delDistributionMonitor,
    pvDisOrLv
} from '@/api/AccountOperation'

import monitor1 from '@/views/Account-management/components/StandingBook/monitor1.vue'
import monitor2 from '@/views/Account-management/components/StandingBook/monitor2.vue'
import monitor3 from '@/views/Account-management/components/StandingBook/monitor3.vue'
import MainNetworkAddition from '@/views/Account-management/components/StandingBook/MainNetworkAddition.vue'
import terminalDialog from '@/views/Account-management/components/StandingBook/terminalDialog.vue'
import Photovoltaic from '@/views/components/Accountinformation/Photovoltaic'
import { getPhotovoltaicAccountData } from '@/api/distributed'
import { getDicDataByTypeName } from '@/api/admin/dept'
import { dicData } from '@/assets/commjs/dictypeData'
import { getPvLvUserList, updateLvUser, delPvLvUser } from '@/api/LowVoltageUserAccount'
export default {
    components: {
        monitor1,
        monitor2,
        monitor3,
        terminalDialog,
        Photovoltaic,
        MainNetworkAddition
    },
    props: {},
    name: 'InspectionPoint',
    data() {
        return {
            value: 0,
            colSpan: 19,
            vh: 0,
            activeName: '1',
            list: [],
            title: '',
            loading: false,
            loadingTree: true,
            formInline: {},
            flag: true,
            form: {
                dataType: 0,
                searchValue: '',
                monitorState: '',
                orgId: '',
                treeType: 0,
                pageNum: 1,
                pageSize: 20
            },
            Subcategory: [
                {
                    id: 0,
                    name: '用电用户'
                },
                {
                    id: 1,
                    name: '发电用户'
                }
            ],
            networkList: [
                {
                    id: 0,
                    name: '主网数据类型'
                },
                {
                    id: 1,
                    name: '配网数据类型'
                }
            ],

            breadList: [], //存储树点击的父节点
            options: [],
            // 监测点类型 数组
            typeList: [],
            tableHeaderPhotovoltaicaccount: [], //编号弹框表格数据
            photovoltaicAccountData: [],
            PMSobtain: false, //编号开关
            dialogVisible1: false, //弹框开关
            dialogVisible2: false, //弹框开关
            dialogVisible3: false, //弹框开关
            shwoMainNetworkAddition: false,
            MainNetworkAddition: false,
            dialogVisible4: false, //弹框开关
            dialogVisible5: false, //弹框开关
            tableData: [],
            multipleSelection: [], //表格多选
            filterText: '',
            treeData: [],
            treeList: null, //保存 树点击节点
            defaultProps: {
                children: 'children',
                label: 'name'
            },
            total: 0
        }
    },
    created() {
        this.Dictionaries()
        this.operationTree()
    },

    mounted() {
        this.options = dicData('Line_State', [])
        this.setHeight()
        window.addEventListener('resize', this.setHeight)
    },
    beforeDestroy() {
        window.removeEventListener('resize', this.setHeight)
    },
    methods: {
        setHeight() {
            this.device = window.devicePixelRatio
            this.vh = window.sessionStorage.getItem('appheight') - 180
        },
        Dictionaries() {
            // getDicDataByTypeName({ dictTypeName: "监测点类型  " }).then((res) => {
            //   this.typeList = res.data;
            // });
        },

        // 树查询
        async operationTree() {
            this.loadingTree = true
            const data = await typeTree()
            this.treeData = data.data
            this.treeList = this.treeData[0]
            setTimeout(() => {
                this.$refs.tree.setCurrentKey(this.treeData[0].id)
                this.onSubmit()
            }, 0)

            this.loadingTree = false
        },

        handleClick(tab, event) {
            this.form.pageNum = 1
            this.form.pageSize = 20
            this.multipleSelection = []
            this.onSubmit()
        },

        newlyAddeds() {
            // this.dialogVisible5 = true;
            this.shwoMainNetworkAddition = true
            this.MainNetworkAddition = true
            this.title = '新增配网'
        },
        // 新增
        newlyAdded() {
            this.dialogVisible5 = false
            if (this.value == 0) {
                this.dialogVisible1 = true
                this.title = '新增主网'
            } else {
                this.shwoMainNetworkAddition = true
                this.MainNetworkAddition = true
                this.title = '新增配网'
            }
        },
        success() {
            this.onSubmit()
            this.monitorClose()
        },
        // 监测点终端名称
        nameClick(row) {
            getPvDeviceById({ id: row.devId }).then(res => {
                this.formInline = res.data
                this.dialogVisible4 = true
            })

            this.title = '电能质量在线监测装置信息 '
        },

        // 弹框关闭
        monitorClose() {
            this.dialogVisible1 = false
            this.dialogVisible2 = false
            this.dialogVisible3 = false
            this.dialogVisible4 = false
            this.shwoMainNetworkAddition = false
            this.MainNetworkAddition = false
            this.PMSobtain = false
            this.onSubmit()
        },
        // 表格查询
        onSubmit() {
            this.form.orgId = this.treeList.id
            this.flag = this.form.treeType == 0 ? false : true

            this.loading = true
            if (this.activeName == 1) {
                getOneMonitorByOrgId(this.form).then(res => {
                    this.tableData = res.data.records
                    this.total = res.data.total
                    this.loading = false
                })
            } else if (this.activeName == 2) {
                getTwoMonitorByOrgId(this.form).then(res => {
                    this.tableData = res.data.records
                    this.total = res.data.total
                    this.loading = false
                })
            } else if (this.activeName == 3) {
                // getThreeYongMonitorByOrgId
                getThreeYongMonitorByOrgId(this.form).then(res => {
                    this.tableData = res.data.records
                    this.total = res.data.total
                    this.loading = false
                })
            }

            // if (this.treeList != null) {
            //   this.form.id = this.treeList.id;
            //   this.form.level = this.treeList.level;
            // }
            // pvLineDetail(this.form).then((res) => {
            //   this.tableData = res.data.records;
            //   this.total = res.data.total;

            // });
        },
        // 新增关闭
        close() {
            this.flg = true
        },
        // 树过滤
        filterNode(value, data, node) {
            if (!value) {
                return true
            }
            let _array = [] //这里使用数组存储 只是为了存储值。
            this.getReturnNode(node, _array, value)
            let result = false
            _array.forEach(item => {
                result = result || item
            })
            return result
        },
        getReturnNode(node, _array, value) {
            let isPass = node.data && node.data.name && node.data.name.indexOf(value) !== -1
            isPass ? _array.push(isPass) : ''
            this.index++
            if (!isPass && node.name != 1 && node.parent) {
                this.getReturnNode(node.parent, _array, value)
            }
        },
        // 树点击事件
        handleNodeClick: function (data, node) {
            this.breadList = []
            this.treeList = data
            this.form.orgId = this.treeList.id
            let selectNode = this.$refs.tree.getNode(node) //  获取点击当节点的dom的信息

            this.getparentsNode(selectNode) //调用递归函数
            setTimeout(() => {
                this.onSubmit()
            }, 0)
        },
        // 递归
        getparentsNode(node) {
            if (!node.parent) {
                // for (let i = 0; i <= this.breadList.length; i++) {
                //   this.breadList[i] = `-` + this.breadList[i];
                // }
                this.breadList.forEach((item, ind) => {
                    this.breadList[ind] = ` > ` + item
                })
                this.breadList = this.breadList.join('')
                return
            }

            this.breadList.unshift(node.label)

            this.getparentsNode(node.parent) //调用递归
        },

        // filterNode(value, data) {
        //   if (!value) return true;
        //   return data.label.indexOf(value) !== -1;
        // },
        // 表格多选
        handleSelectionChange(val) {
            this.multipleSelection = []
            val.forEach(item => {
                this.multipleSelection.push(item.id)
            })
            // this.multipleSelection = val;
        },
        //每页条数改变时触发 选择一页显示多少行
        handleSizeChange(val) {
            this.form.pageSize = val
            this.onSubmit()
        },
        //当前页改变时触发 跳转其他页
        handleCurrentChange(val) {
            this.form.pageNum = val
            this.onSubmit()
        },
        // 删除
        open() {
            if (this.multipleSelection.length > 0) {
                delDistributionMonitor({
                    ids: this.multipleSelection,
                    type: this.activeName
                }).then(res => {
                    if ((res.code == 'A0000')) {
                        this.$message({
                            message: '删除成功!',
                            type: 'success'
                        })
                        this.onSubmit()
                    }
                })
            } else {
                this.$message({
                    message: '请选择一条数据进行删除!',
                    type: 'warning'
                })
            }
        },
        handleClose() {
            this.dialogVisible5 = false
            this.value = ''
        },

        thStyleFun() {
            return 'text-align:center'
        },
        cellStyleFun() {
            return 'text-align:center'
        },
        // 数据过滤
        formFilter(row, column) {
            if (column.property == 'voltageLevel') {
                let title = ''
                dicData('Dev_Voltage', []).forEach(item => {
                    if (item.id == row.voltageLevel) {
                        title = item.name
                    }
                })
                return title
            } else if (column.property == 'monitorState') {
                let title = ''
                dicData('Line_State', []).forEach(item => {
                    if (item.id == row.monitorState) {
                        title = item.name
                    }
                })
                return title
            } else if (column.property == 'monitorType') {
                let title = ''
                dicData('Line_Type', []).forEach(item => {
                    if (item.id == row.monitorType) {
                        title = item.name
                    }
                })
                return title
            } else if (column.property == 'potentialTransFormerType') {
                let title = ''
                dicData('Voltage_Transformer', []).forEach(item => {
                    if (item.id == row.potentialTransFormerType) {
                        title = item.name
                    }
                })
                return title
            } else if (column.property == 'neutralGroundingMode') {
                let title = ''
                dicData('Neutral_Point', []).forEach(item => {
                    if (item.id == row.neutralGroundingMode) {
                        title = item.name
                    }
                })
                return title
            } else if (column.property == 'monitorObjectId') {
                let title = ''
                dicData('Monitoring_Labels', []).forEach(item => {
                    if (item.id == row.monitorObjectId) {
                        title = item.name
                    }
                })
                return title
            } else if (column.property == 'terminalWiringMethod') {
                let title = ''
                dicData('Dev_Connect', []).forEach(item => {
                    if (item.id == row.terminalWiringMethod) {
                        title = item.name
                    }
                })
                return title
            } else if (column.property == 'monitorTag') {
                let title = ''
                dicData('Monitoring_Labels', []).forEach(item => {
                    if (item.id == row.monitorTag) {
                        title = item.name
                    }
                })
                return title
            } else if (column.property == 'regionalism') {
                let title = ''
                dicData('Area', []).forEach(item => {
                    if (item.id == row.regionalism) {
                        title = item.name
                    }
                })
                return title
            } else if (column.property == 'state') {
                let title = ''
                dicData('Line_State', []).forEach(item => {
                    if (item.id == row.state) {
                        title = item.name
                    }
                })

                return title
            } else if (column.property == 'userType') {
                let title = ''
                dicData('User_Class', []).forEach(item => {
                    if (item.id == row.userType) {
                        title = item.name
                    }
                })

                return title
            } else if (column.property == 'industryType') {
                let title = ''
                dicData('Business_Type', []).forEach(item => {
                    if (item.id == row.industryType) {
                        title = item.name
                    }
                })
                return title
            } else if (column.property == 'electricityType') {
                let title = ''
                dicData('Ele_Class', []).forEach(item => {
                    if (item.id == row.electricityType) {
                        title = item.name
                    }
                })

                return title
            } else if (column.property == 'productionShift') {
                let title = ''
                dicData('Production_Shifts', []).forEach(item => {
                    if (item.id == row.productionShift) {
                        title = item.name
                    }
                })

                return title
            } else if (column.property == 'loadNature') {
                let title = ''
                dicData('Load_Type', []).forEach(item => {
                    if (item.id == row.loadNature) {
                        title = item.name
                    }
                })

                return title
            } else if (column.property == 'highIndustryType') {
                let title = ''
                dicData('High_Cate', []).forEach(item => {
                    if (item.id == row.highIndustryType) {
                        title = item.name
                    }
                })

                return title
            } else if (column.property == 'importanceLevel') {
                let title = ''
                dicData('Importance_Level', []).forEach(item => {
                    if (item.id == row.importanceLevel) {
                        title = item.name
                    }
                })

                return title
            } else if (column.property == 'eccStat') {
                let title = ''
                dicData('Ecc_Stat', []).forEach(item => {
                    if (item.id == row.eccStat) {
                        title = item.name
                    }
                })

                return title
            } else if (column.property == 'sensitiveType') {
                let title = ''
                dicData('Sensitive_User_Type', []).forEach(item => {
                    if (item.id == row.sensitiveType) {
                        title = item.name
                    }
                })

                return title
            } else if (column.property == 'connectionMode') {
                let title = ''
                dicData('Connection_Mode', []).forEach(item => {
                    if (item.id == row.connectionMode) {
                        title = item.name
                    }
                })

                return title
            } else if (column.property == 'gcStat') {
                let title = ''
                dicData('Ecc_Stat', []).forEach(item => {
                    if (item.id == row.gcStat) {
                        title = item.name
                    }
                })

                return title
            } else {
                return row[column.property]
            }
        },
        // 查看报表
        ViewReport(row) {
            this.$emit('ViewReport', row.id)
        },
        // 查看趋势图
        trend(row) {
            if (this.form.dataType == 0) {
                // 主网
                this.$router.push({
                    path: '/Statistical-analysis/steadyStateIndicators',
                    name: 'steadyStateIndicators',
                    params: {
                        id: row.id
                    }
                })
            } else {
                // 配网
                this.$router.push({
                    path: '/Distributionnetwork-analysis/SteadyStateIndicators',
                    name: 'SteadyStateIndicators',
                    params: {
                        id: row.id
                    }
                })
            }
        }
    },

    computed: {},

    watch: {
        filterText(val) {
            this.$refs.tree.filter(val)
        }
    }
}
</script>
<style lang="less" scoped>
@import url('../../../../styles/comStyle.less');

.Inspection {
    margin-right: 10px;
    // box-shadow: 0 2px 4px 0 rgb(0 0 0 / 12%), 0 0 6px 0 rgb(0 0 0 / 4%);
}
</style>
<style lang="scss" scoped>
.left {
    position: relative;
    padding: 10px 0;
    // overflow-y: auto;
    border: 1px solid $themeColor !important;

    .el-icon-caret-left {
        position: absolute;
        top: 50%;
        right: -5px;
        font-size: 16px;
        cursor: pointer;
    }
}
</style>
