<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">
                                <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 && form.dataType != 0">
                            <el-select 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 :span="5" v-show="colSpan != 24" class="left" :style="'height:' + (vh + 55) + 'px;'">
                    <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 style="margin-bottom: 10px">
                                    <el-button v-if="form.dataType != 0" type="primary" @click="newlyAddeds"
                                        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-s-check"
                  type="primary"
                  size="small"
                  @click="modify"
                  >修改</el-button
                > -->
                                    <el-button icon="el-icon-delete" type="primary" size="small" @click="open">
                                        删除
                                    </el-button>
                                    <el-button icon="el-icon-s-check" type="primary" size="small" @click="retire">
                                        退役
                                    </el-button>
                                    <el-button type="primary" icon="el-icon-download" @click="exportEvent">
                                        导出
                                    </el-button>
                                </div>
                                <vxe-table stripe :data="tableData" v-loading="loading"
                                    :row-config="{ isCurrent: true, isHover: true }" highlight-current-row border
                                    :height="vh - 80" header-cell-class-name="table_header" ref="multipleTable"
                                    size="mini" :row-class-name="tableRowClassName"
                                    @checkbox-all="handleSelectionChange" @checkbox-change="handleSelectionChange">
                                    <vxe-table-column show-overflow align="center" type="checkbox"
                                        width="55"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" title="序号" type="seq" width="60">
                                        <template v-slot="row">
                                            <span>{{ (form.pageNum - 1) * form.pageSize + row.seq }}</span>
                                        </template>
                                    </vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="name" title="监测点名称"
                                        min-width="190"></vxe-table-column>
                                    <!-- <vxe-table-column show-overflow   align="center" field="city" title="所属城市" min-width="90">
            </vxe-table-column> -->
                                    <!--                  <vxe-table-column
                    show-overflow   align="center"
                    field="id"
                    title="监测点ID"
                    width="120"
                  >
                  </vxe-table-column>-->
                                    <vxe-table-column show-overflow align="center" field="orgName" title="组织机构名称"
                                        width="120"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="operationName" title="运维单位名称"
                                        min-width="150"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="powerrName" title="变电站名称"
                                        min-width="120"></vxe-table-column>

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

                                    <!-- <vxe-table-column fixed="right" title="操作" width="260">
                    <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>
                  </vxe-table-column> -->
                                    <!-- <vxe-table-column show-overflow   align="center" field="whether" title="是否应设点" min-width="100">
            </vxe-table-column> -->
                                </vxe-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-s-check" type="primary" size="small" @click="modify">
                                        修改
                                    </el-button>
                                    <el-button icon="el-icon-delete" type="primary" size="small" @click="open">
                                        删除
                                    </el-button>
                                    <el-button icon="el-icon-s-check" type="primary" size="small" @click="retire">
                                        退役
                                    </el-button>
                                    <el-button type="primary" icon="el-icon-download" @click="exportEvent">
                                        导出
                                    </el-button>
                                </div>
                                <vxe-table stripe v-loading="loading" highlight-current-row :data="tableData" border
                                    :row-config="{ isCurrent: true, isHover: true }" style="width: 100%"
                                    :height="vh - 80" header-cell-class-name="table_header" ref="multipleTable"
                                    size="mini" :header-cell-style="thStyleFun" :cell-style="cellStyleFun"
                                    @checkbox-all="handleSelectionChange" @checkbox-change="handleSelectionChange">
                                    <vxe-table-column show-overflow align="center" type="checkbox"
                                        width="55"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" title="序号" type="seq" width="80">
                                        <template v-slot="row">
                                            <span>{{ (form.pageNum - 1) * form.pageSize + row.seq }}</span>
                                        </template>
                                    </vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="id" title="台区编号"
                                        min-width="150"></vxe-table-column>
                                    <!-- <vxe-table-column show-overflow   align="center" field="city" title="所属城市" min-width="90">
            </vxe-table-column> -->
                                    <vxe-table-column show-overflow align="center" field="name" title="台区名称"
                                        width="120"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="orgName" title="组织机构名称"
                                        width="120"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="operationName" title="运维单位名称"
                                        min-width="150"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="powerrName" title="变电站名称"
                                        min-width="120"></vxe-table-column>

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

                                    <!-- <vxe-table-column fixed="right" title="操作" width="260">
                    <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>
                  </vxe-table-column> -->
                                    <!-- <vxe-table-column show-overflow   align="center" field="whether" title="是否应设点" min-width="100">
            </vxe-table-column> -->
                                </vxe-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-s-check" type="primary" size="small" @click="modify">
                                        修改
                                    </el-button>
                                    <el-button icon="el-icon-delete" type="primary" size="small" @click="open">
                                        删除
                                    </el-button>
                                    <el-button icon="el-icon-s-check" type="primary" size="small" @click="retire">
                                        退役
                                    </el-button>
                                    <el-button type="primary" icon="el-icon-download" @click="exportEvent">
                                        导出
                                    </el-button>
                                </div>
                                <!-- 用电 -->
                                <vxe-table stripe v-loading="loading" v-show="flag" :data="tableData" border
                                    :row-config="{ isCurrent: true, isHover: true }" style="width: 100%"
                                    :height="vh - 80" header-cell-class-name="table_header" ref="multipleTable1"
                                    size="mini" :header-cell-style="thStyleFun" :cell-style="cellStyleFun"
                                    @checkbox-all="handleSelectionChange" @checkbox-change="handleSelectionChange">
                                    <vxe-table-column show-overflow align="center" type="checkbox"
                                        width="55"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" title="序号" type="seq" width="70">
                                        <template v-slot="row">
                                            <span>{{ (form.pageNum - 1) * form.pageSize + row.seq }}</span>
                                        </template>
                                    </vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="id" title="用户编号"
                                        min-width="200"></vxe-table-column>
                                    <!-- <vxe-table-column show-overflow   align="center" field="city" title="所属城市" min-width="90">
            </vxe-table-column> -->
                                    <vxe-table-column show-overflow align="center" field="name" title="用户名称"
                                        width="120"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="orgName" title="组织机构名称"
                                        width="150"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="operationName" title="运维单位名称"
                                        min-width="150"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="userTag" title="用户标签"
                                        min-width="150"></vxe-table-column>

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

                                    <!-- <vxe-table-column fixed="right" title="操作" width="260">
                    <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>
                  </vxe-table-column> -->
                                    <!-- <vxe-table-column show-overflow   align="center" field="whether" title="是否应设点" min-width="100">
            </vxe-table-column> -->
                                </vxe-table>
                                <!-- 发电 -->
                                <vxe-table stripe v-show="!flag" :data="tableData" v-loading="loading"
                                    highlight-current-row border style="width: 100%" :height="vh - 80"
                                    header-cell-class-name="table_header" ref="multipleTable2" size="mini"
                                    :header-cell-style="thStyleFun" :cell-style="cellStyleFun"
                                    @checkbox-all="handleSelectionChange" @checkbox-change="handleSelectionChange">
                                    <vxe-table-column show-overflow align="center" type="checkbox"
                                        width="55"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" title="序号" type="seq" width="70">
                                        <template v-slot="row">
                                            <span>{{ (form.pageNum - 1) * form.pageSize + row.seq }}</span>
                                        </template>
                                    </vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="id" title="用户编号"
                                        min-width="200"></vxe-table-column>
                                    <!-- <vxe-table-column show-overflow   align="center" field="city" title="所属城市" min-width="90">
            </vxe-table-column> -->
                                    <vxe-table-column show-overflow align="center" field="name" title="用户名称"
                                        width="120"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="orgName" title="组织机构名称"
                                        width="120"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="operationName" title="运维单位名称"
                                        min-width="150"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="userTag" title="用户标签"
                                        min-width="150"></vxe-table-column>

                                    <vxe-table-column show-overflow align="center" field="voltageLevel" title="供电电压"
                                        min-width="120" :formatter="formFilter"></vxe-table-column>


                                    <!-- 发电 -->

                                    <vxe-table-column show-overflow align="center" field="userType" title="用户分类"
                                        min-width="120" :formatter="formFilter"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="industryType" title="行业分类"
                                        min-width="120" :formatter="formFilter"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="electricityType" title="用电类别"
                                        min-width="120" :formatter="formFilter"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="contractCapacity" title="合同容量"
                                        min-width="120"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="operatingCapacity"
                                        title="运行容量" min-width="120"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="productionShift" title="生产班次"
                                        min-width="120" :formatter="formFilter"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="loadNature" title="负荷性质"
                                        min-width="120" :formatter="formFilter"></vxe-table-column>

                                    <vxe-table-column show-overflow align="center" field="highIndustryType"
                                        title="高耗能行业类别" min-width="120" :formatter="formFilter"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="powerTransmissionDate"
                                        title="送电日期" min-width="120"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="importanceLevel" title="重要性等级"
                                        min-width="120" :formatter="formFilter"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="eccStat" title="用电客户状态"
                                        min-width="120" :formatter="formFilter"></vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="ifSensitiveUser"
                                        title="是否敏感用户" min-width="120">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.ifSensitiveUser == null ? '' : scope.row.ifSensitiveUser ==
                                                1 ? '是' : '否' }}</span>
                                        </template>
                                    </vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="ifPowerQuality"
                                        title="是否影响电能质量" min-width="140">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.ifPowerQuality == null ? '' : scope.row.ifPowerQuality ==
                                                1 ? '是' : '否' }}</span>
                                        </template>
                                    </vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="ifKeyCustomers" title="是否重要客户"
                                        min-width="120">
                                        <template slot-scope="scope">
                                            <span>{{ scope.row.ifKeyCustomers == null ? '' : scope.row.ifKeyCustomers ==
                                                1 ? '是' : '否' }}</span>
                                        </template>
                                    </vxe-table-column>
                                    <vxe-table-column show-overflow align="center" field="sensitiveType" title="敏感用户类别"
                                        min-width="120" :formatter="formFilter"></vxe-table-column>

                                    <!-- <vxe-table-column fixed="right" title="操作" width="260">
                    <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>
                  </vxe-table-column> -->
                                    <!-- <vxe-table-column show-overflow   align="center" field="whether" title="是否应设点" min-width="100">
            </vxe-table-column> -->
                                </vxe-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" :multipleSelection="multipleSelection"
            :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,
    delMonitor,
    retirementMonitor
} 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 {
    name: 'tzczcl',
    components: {
        monitor1,
        monitor2,
        monitor3,
        terminalDialog,
        Photovoltaic,
        MainNetworkAddition
    },
    props: {},

    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.device = window.devicePixelRatio

        this.options = dicData('Line_State', [])
        this.setHeight()
        window.addEventListener('resize', this.setHeight)
    },
    beforeDestroy() {
        window.removeEventListener('resize', this.setHeight)
    },
    methods: {
        setHeight() {
            this.vh = window.sessionStorage.getItem('appheight') - 130
        },
        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(e) {
            if (this.form.dataType == e) {
                this.activeName = '1'
            }
            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 = []
            if (this.activeName == 3) {
                if (this.flag) {
                    this.$refs.multipleTable1.getCheckboxRecords().forEach(item => {
                        this.multipleSelection.push(item.id)
                    })
                } else {
                    this.$refs.multipleTable2.getCheckboxRecords().forEach(item => {
                        this.multipleSelection.push(item.id)
                    })
                }
            } else {
                this.$refs.multipleTable.getCheckboxRecords().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) {
                if (this.form.dataType == 0) {
                    delMonitor(
                        this.multipleSelection
                        // type: this.activeName,
                    ).then(res => {
                        if ((res.code == 'A0000')) {
                            this.$message({
                                message: '删除成功!',
                                type: 'success'
                            })
                            this.onSubmit()
                        }
                    })
                } else {
                    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'
                })
            }
        },
        // 退役
        retire() {
            if (this.multipleSelection.length > 0) {
                retirementMonitor({
                    lineIds: this.multipleSelection,
                    type: this.form.dataType
                }).then(res => {
                    if ((res.code == 'A0000')) {
                        this.$message({
                            message: '退役成功!',
                            type: 'success'
                        })
                        this.onSubmit()
                    }
                })
            } else {
                this.$message({
                    message: '请选择一条数据进行删除!',
                    type: 'warning'
                })
            }
        },
        // 修改
        modify() {
            if (this.multipleSelection.length == 1) {
                this.shwoMainNetworkAddition = true
                this.MainNetworkAddition = true
                this.title = '修改配网'
            } 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 (row.column.property == 'voltageLevel') {
                let title = ''
                dicData('Dev_Voltage', []).forEach(item => {
                    if (item.id == row.row.voltageLevel) {
                        title = item.name
                    }
                })
                return title
            } else if (row.column.property == 'monitorState') {
                let title = ''
                dicData('Line_State', []).forEach(item => {
                    if (item.id == row.row.monitorState) {
                        title = item.name
                    }
                })
                return title
            } else if (row.column.property == 'monitorType') {
                let title = ''
                dicData('Line_Type', []).forEach(item => {
                    if (item.id == row.row.monitorType) {
                        title = item.name
                    }
                })
                return title
            } else if (row.column.property == 'potentialTransFormerType') {
                let title = ''
                dicData('Voltage_Transformer', []).forEach(item => {
                    if (item.id == row.row.potentialTransFormerType) {
                        title = item.name
                    }
                })
                return title
            } else if (row.column.property == 'neutralGroundingMode') {
                let title = ''
                dicData('Neutral_Point', []).forEach(item => {
                    if (item.id == row.row.neutralGroundingMode) {
                        title = item.name
                    }
                })
                return title
            } else if (row.column.property == 'monitorObjectType') {
                let title = ''
                dicData('Monitoring_Labels', []).forEach(item => {
                    if (item.id == row.row.monitorObjectType) {
                        title = item.name
                    }
                })
                return title
            } else if (row.column.property == 'terminalWiringMethod') {
                let title = ''
                dicData('Dev_Connect', []).forEach(item => {
                    if (item.id == row.row.terminalWiringMethod) {
                        title = item.name
                    }
                })
                return title
            } else if (row.column.property == 'monitorTag') {
                let title = ''
                dicData('Monitoring_Labels', []).forEach(item => {
                    if (item.id == row.row.monitorTag) {
                        title = item.name
                    }
                })
                return title
            } else if (row.column.property == 'regionalism') {
                let title = ''
                dicData('Area', []).forEach(item => {
                    if (item.id == row.row.regionalism) {
                        title = item.name
                    }
                })
                return title
            } else if (row.column.property == 'state') {
                let title = ''
                dicData('Line_State', []).forEach(item => {
                    if (item.id == row.row.state) {
                        title = item.name
                    }
                })

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

                return title
            } else {
                return row.row[row.column.property]
            }
        },
        // 导出
        async exportEvent() {
            let list = JSON.parse(JSON.stringify(this.form))
            list.pageSize = this.total
            list.pageNum = 1
            let tableData = []
            if (this.activeName == 1) {
                await getOneMonitorByOrgId(list).then(res => {
                    tableData = res.data.records
                })
            } else if (this.activeName == 2) {
                await getTwoMonitorByOrgId(list).then(res => {
                    tableData = res.data.records
                })
            } else if (this.activeName == 3) {
                // getThreeYongMonitorByOrgId
                await getThreeYongMonitorByOrgId(list).then(res => {
                    tableData = res.data.records
                })
            }
            if (this.activeName == 3) {
                if (this.flag) {
                    this.$refs.multipleTable1.exportData({
                        filename: '监测点', // 文件名字
                        sheetName: 'Sheet1',
                        type: 'xlsx', //导出文件类型 xlsx 和 csv
                        useStyle: true,
                        data: tableData, // 数据源 // 过滤那个字段导出 // columnFilterMethod: function(column, $columnIndex) { //   return !(column.$columnIndex === 0 ) //   // 0是复选框 不导出 // }
                        columnFilterMethod: function (column, $columnIndex) {
                            return !(column.$columnIndex === 0 || column.$columnIndex === 1)
                        }
                    })
                } else {
                    this.$refs.multipleTable2.exportData({
                        filename: '监测点', // 文件名字
                        sheetName: 'Sheet1',
                        type: 'xlsx', //导出文件类型 xlsx 和 csv
                        useStyle: true,
                        data: tableData, // 数据源 // 过滤那个字段导出 // columnFilterMethod: function(column, $columnIndex) { //   return !(column.$columnIndex === 0 ) //   // 0是复选框 不导出 // }
                        columnFilterMethod: function (column, $columnIndex) {
                            return !(column.$columnIndex === 0 || column.$columnIndex === 1)
                        }
                    })
                }
            } else {
                this.$refs.multipleTable.exportData({
                    filename: '监测点', // 文件名字
                    sheetName: 'Sheet1',
                    type: 'xlsx', //导出文件类型 xlsx 和 csv
                    useStyle: true,
                    data: tableData, // 数据源 // 过滤那个字段导出 // columnFilterMethod: function(column, $columnIndex) { //   return !(column.$columnIndex === 0 ) //   // 0是复选框 不导出 // }
                    columnFilterMethod: function (column, $columnIndex) {
                        return !(column.$columnIndex === 0 || column.$columnIndex === 1)
                    }
                })
            }
        },
        // 查看报表
        ViewReport(row) {
            if (this.form.dataType == 0) {
                // 主网
                this.$router.push({
                    path: '/Statistical-analysis/statisticalReport',
                    name: 'statisticalReport',
                    params: {
                        id: row.id
                    }
                })
            } else {
                // 配网
                this.$router.push({
                    path: '/Distributionnetwork-analysis/StatisticalReport',
                    name: 'StatisticalReport',
                    params: {
                        id: 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
                    }
                })
            }
        },
        tableRowClassName({ row, rowIndex }) {
            if (rowIndex % 2 == 0) {
                return ''
            } else {
                return 'warning-row'
            }
        }
    },

    computed: {},

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

::v-deep .el-dialog .el-dialog__body {
    padding: 10px;
}

::v-deep .vxe-table .cell {
    text-align: center;
}

.Inspection {
    padding: 10px;
    margin: 10px;
    box-shadow: 0 2px 4px 0 rgb(0 0 0 / 12%), 0 0 6px 0 rgb(0 0 0 / 4%);
}

// 表格斑马自定义颜色

// .demo-form-inline{
//     overflow: hidden; /* 让溢出的内容隐藏起来。意思是让下方的橙色方形先躲起来 */
//     transition: all 1s; /* 从最初到鼠标悬停时的过渡 */
//     // border: 1px solid #000;

// }</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;
    }
}

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

.tableName {
    color: $themeColor;
    text-decoration: underline;
}

// ::v-deep.vxe-table--enable-row-hover .vxe-table__body tr:hover > td {
//     background-color: #dbf6f6 !important;
//   }
// ::v-deep.vxe-table__body tr.current-row > td {
//     background: $themeColor !important;
//   }
// ::v-deep.vxe-table .vxe-table__body tr.current-row>td, .vxe-table.vxe-table--d .vxe-table__body tr.vxe-table__row--d.current-row td {
//     background: $themeColor !important;
//     color:#fff
// }
// ::v-deep.vxe-table__row .hover-row {
//   background: $themeColor !important;
//   color:#fff
// }
// ::v-deep.vxe-table__row .vxe-table__row--d .hover-row {
//   background: $themeColor !important;
//   color:#fff}
/*滚动条样式*/
// 鼠标经过颜色改为粉红色
// ::v-deep.vxe-table__body tr:hover>td{

// background-color: pink !important;

// }

// // 点击之后颜色改为粉红色  如果没有效果 需要给vxe-table  加上  highlight-current-row  这个属性
// ::v-deep.vxe-table__body tr.current-row>td{

// background-color: pink !important;

// }
// .treeEl::-webkit-scrollbar {
//   width: 8px;
// }
// .treeEl::-webkit-scrollbar-thumb {
//   border-radius: 4px; /*滚动条的圆角*/
//   background-color: $themeColor; /*滚动条的背景颜色*/
//   opacity: 0.8;
// }
// .treeEl::-webkit-scrollbar-track {
//   box-shadow: inset 0 0 5px rgb(174, 173, 173);
//   border-radius: 2px;
//   background: rgb(177, 175, 175);
// }</style>
