fj-dc-ui/.svn/pristine/db/db71a5a4fa94877adfe3e659eff4c2a05fe300ca.svn-base

<template>
  <div id="kjrmap">
    <div class="layer-control2">
      <layer-control2 @layerVisbleEvent="mytest"></layer-control2>
    </div>
    <div class="map-search-input" style="margin-top: 15px;">
      <el-input v-if="bShowSearch" placeholder="请输入名称 / 编码搜索" v-model="model_search_input" class="input-with-select">
        <el-button slot="append" icon="el-icon-search" @click="btnSearch"></el-button>
      </el-input>
      <v-region v-if="bShowAddvcdSearch" @values="regionChange" :town="false" :ui="true" class="form-control">
        <el-button icon="el-icon-arrow-down">请选择行政区</el-button>
      </v-region>
    </div>
    <div class="map-title" v-show="bShowTitle">
      <label for="">{{map_title}}</label>
    </div>
    <div class="map-toolBar">
      <el-tooltip content="行政区划" placement="bottom" effect="light">
        <img @click="bShowAddvcdSearch = !bShowAddvcdSearch" src="../../static/addvcd.png" alt="">
      </el-tooltip>
      <el-tooltip content="搜索" placement="bottom" effect="light">
        <img @click="bShowSearch = !bShowSearch" src="../../static/search.png" alt="">
      </el-tooltip>
      <el-tooltip content="清除" placement="bottom" effect="light">
        <img @click="clearTempData" src="../../static/clear2.png" alt="">
      </el-tooltip>
      <el-tooltip content="全图" placement="bottom" effect="light">
        <img @click="toHome" src="../../static/home.png" alt="">
      </el-tooltip>
    </div>
    <div id="viewDiv">
    </div>
    <el-dialog class="process_line" :title="dlg_info2" :modal="false" :close-on-click-modal="false"
      :visible.sync="dialogInfo2">
    </el-dialog>

    <transition name="el-fade-in-linear">
      <draggable :title="'数据表'" initTop=160 :initLeft='screenWidth - 720' initWidth=697 initHeight=590
        v-if="processLineShow_data_common" @closeDraggable='closeModal_data_common'>
        <div class="process_line" style="padding-left:0px;">
          <el-row style="margin-bottom:5px;">
            <el-col :span="24">
              <div class="grid-content bg-purple-light">
                <el-card class="kjr-card box-card" style="height:547px;margin-bottom:0px;">
                  <template>
                    <el-tabs v-model="activeName_data_common" @tab-click="handleClick_searchResult">
                      <el-tab-pane label="督查人员" name="first">
                        <el-row>
                          <el-col :span="7">
                            <el-tabs v-model="activeTabName" @tab-click="handleTabClick" type="border-card"
                              style="overflow:auto;">
                              <el-tab-pane v-if="bAdmin" label="机构" name="three">
                                <div class="grid-content bg-purple">
                                  <el-tree :data="treeData3" node-key="orgId" :expand-on-click-node="false"
                                    :highlight-current="true" :current-node-key="curNode" :default-expanded-keys="['1']"
                                    :props="defaultProps3" @node-click="handleNodeClick3"></el-tree>
                                </div>
                              </el-tab-pane>
                              <el-tab-pane v-if="bAdmin" label="专项" name="second">
                                <div class="grid-content bg-purple">
                                  <el-tree :data="treeData2" node-key="id" :expand-on-click-node="false"
                                    :highlight-current="true" :current-node-key="curNode" :default-expanded-keys="['1']"
                                    :props="defaultProps" @node-click="handleNodeClick"></el-tree>
                                </div>
                              </el-tab-pane>
                              <el-tab-pane v-if="!bAdmin" label="所在组成员" name="fourth">
                                <div class="grid-content bg-purple">
                                  <el-tree :data="treeData4" node-key="id" :expand-on-click-node="false"
                                    :highlight-current="true" :current-node-key="curNode" :default-expanded-keys="['1']"
                                    :props="defaultProps" @node-click="handleNodeClick"></el-tree>
                                </div>
                              </el-tab-pane>
                            </el-tabs>
                          </el-col>
                          <el-col :span="17">
                            <div class="grid-content bg-purple-light">
                              <div style="padding:5px;">
                                <span style="font-size: 12px;margin-left: 10px;">名称：</span>
                                <el-input style="width:110px;" class="kjr-input" size="mini" v-model="model_peopleName"
                                  placeholder="请输入姓名"></el-input>
                                &nbsp;&nbsp;
                                <el-button @click="searchPeople" size="mini" type="primary">筛选</el-button>
                                &nbsp;&nbsp;
                                <el-checkbox v-model="model_peopleOnline" @change="bPeopleOnline">是否在线</el-checkbox>
                                <el-button @click="refreashOnline" size="mini" style="float: right;" type="primary">刷新
                                </el-button>
                              </div>
                              <div style="padding:5px;">
                                <el-table :data="tableData_peopleList"
                                  :default-sort="{prop: 'operateTime', order: 'descending'}"
                                  @sort-change='people_sortEvent' height="397" border stripe style="width: 100%">
                                  <el-table-column type="index" label="序号" width="50" :index="indexMethod">
                                  </el-table-column>
                                  <el-table-column prop="persName" label="姓名" width="80" align="center">
                                  </el-table-column>
                                  <el-table-column prop="mobilenumb" label="电话" width="100" align="center"
                                    :formatter="formatter_peoplePhone">
                                  </el-table-column>
                                  <el-table-column prop="operateTime" label="最新时间" width="150" align="center"
                                    sortable="custom">
                                  </el-table-column>
                                  <el-table-column label="定位" width="70" align="center">
                                    <template slot-scope="scope">
                                      <i size="big" @click="location(scope.$index, scope.row)"
                                        style="color:blue;font-size: 22px;cursor:pointer;"
                                        class="el-icon-location-outline"></i>
                                    </template>
                                  </el-table-column>
                                </el-table>
                                <div class="block" style="margin-top:5px;">
                                  <el-pagination background @size-change="handleSizeChange"
                                    @current-change="handleCurrentChange" :page-sizes="[10,50, 100, 200]"
                                    :page-size="15" layout="total,sizes, prev, pager, next" :pager-count="2"
                                    :total="recordTotal">
                                  </el-pagination>
                                </div>
                              </div>
                            </div>
                          </el-col>
                        </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="水毁" name="second">
                        <el-row style="margin-bottom:5px;">
                          <el-col :span="24">
                            <div class="grid-content bg-purple-light">
                              <div style="padding:5px;">
                                <span style="font-size: 12px;margin-left: 10px;">名称：</span>
                                <el-input style="width:130px;" class="kjr-input" size="mini"
                                  v-model="model_shuihui_name" placeholder="请输入名称查询">
                                </el-input>
                                &nbsp;&nbsp;&nbsp;
                                <el-button @click="searchByName(1)" size="mini" type="primary">筛选</el-button>
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                              </div>
                              <div style="padding:5px;">
                                <el-table :data="tableData_shuihuiList" height="375" border stripe style="width: 100%">
                                  <el-table-column type="index" width="50" label="序号" align="center"
                                    :index="indexMethod_shuihui">
                                  </el-table-column>
                                  <el-table-column prop="wtdstNm" label="项目名称" width="150" align="center">
                                  </el-table-column>
                                  <el-table-column prop="wtdstDtle" label="水毁情况" width="150" align="center">
                                  </el-table-column>
                                  <el-table-column prop="locNm" label="位置" width="160" align="center">
                                  </el-table-column>
                                  <el-table-column prop="wtdstType" label="类别" width="150" align="center">
                                  </el-table-column>
                                  <el-table-column prop="wtdstWrkam" label="主要工程量" width="150" align="center">
                                  </el-table-column>
                                  <el-table-column prop="planRcvrTm" label="计划修复日期" width="160" align="center">
                                  </el-table-column>
                                  <el-table-column prop="wtdstState" label="状态" width="100" align="center"
                                    :formatter="formatter_shuihui_type">
                                  </el-table-column>
                                  <el-table-column prop="note" label="备注" width="100" align="center">
                                  </el-table-column>
                                  <el-table-column fixed="right" label="定位" width="70" align="center">
                                    <template slot-scope="scope">
                                      <i size="big" @click="location2(scope.row.lgtd,scope.row.lttd,5)"
                                        style="color:blue;font-size: 22px;cursor:pointer;"
                                        class="el-icon-location-outline"></i>
                                    </template>
                                  </el-table-column>
                                </el-table>
                                <div class="block" style='margin-top:15px;'>
                                  <el-pagination background @size-change="handleSizeChange_shuihui"
                                    @current-change="handleCurrentChange_shuihui" :page-sizes="[10,50, 100, 200]"
                                    :page-size="15" layout="total,sizes, prev, pager, next"
                                    :total="recordTotal_shuihui">
                                  </el-pagination>
                                </div>
                              </div>
                            </div>
                          </el-col>
                        </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="小水库" name="third">
                        <el-row style="margin-bottom:5px;">
                          <el-col :span="24">
                            <div class="grid-content bg-purple-light">
                              <div style="padding:5px;">
                                <span style="font-size: 12px;margin-left: 10px;">名称：</span>
                                <el-input style="width:130px;" class="kjr-input" size="mini" v-model="model_shuiku_name"
                                  placeholder="请输入名称查询">
                                </el-input>
                                &nbsp;&nbsp;&nbsp;
                                <el-button @click="searchByName(3)" size="mini" type="primary">筛选</el-button>
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                <!-- <el-checkbox v-model="model_shuiku_finish" @change="bShuikuFinish">已督查</el-checkbox> -->
                                <el-checkbox v-model="model_shuiku_statistic" @change="bShuikuStatistic">查看统计
                                </el-checkbox>
                              </div>
                              <div style="padding:5px;">
                                <el-table :data="tableData_shuikuList" height="375" border stripe style="width: 100%">
                                  <el-table-column type="index" width="50" label="序号" align="center"
                                    :index="indexMethod_shuiku">
                                  </el-table-column>
                                  <el-table-column prop="rsCode" label="水库编码" width="130" align="center" sortable>
                                  </el-table-column>
                                  <el-table-column prop="rsName" label="水库名称" width="130" align="center" sortable>
                                  </el-table-column>
                                  <el-table-column prop="rsAdmName" label="水库管理单位" width="220" align="center">
                                  </el-table-column>
                                  <el-table-column prop="rsType" label="水库类型" width="110" align="center"
                                    :formatter="formatter_shuiku_type">
                                  </el-table-column>
                                  <el-table-column prop="engScal" label="工程规模" width="110" align="center"
                                    :formatter="formatter_shuiku_pro_type">
                                  </el-table-column>
                                  <el-table-column prop="damSizeHig" label="主坝尺寸坝高(m)" width="150" align="center">
                                  </el-table-column>
                                  <el-table-column prop="totCap" label="总库容(万立方米)" width="150" align="center">
                                  </el-table-column>
                                  <el-table-column fixed="right" label="定位" width="70" align="center">
                                    <template slot-scope="scope">
                                      <i size="big" @click="location2(scope.row.lgtd,scope.row.lttd,5)"
                                        style="color:blue;font-size: 22px;cursor:pointer;"
                                        class="el-icon-location-outline"></i>
                                    </template>
                                  </el-table-column>
                                </el-table>
                                <div class="block" style='margin-top:15px;'>
                                  <el-pagination background @size-change="handleSizeChange_shuiku"
                                    @current-change="handleCurrentChange_shuiku" :page-sizes="[10,50, 100, 200]"
                                    :page-size="15" layout="total,sizes, prev, pager, next" :pager-count="3"
                                    :total="recordTotal_shuiku">
                                  </el-pagination>
                                </div>
                              </div>
                            </div>
                          </el-col>
                        </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="人饮" name="fourth">
                        <el-row style="margin-bottom:5px;">
                          <el-col :span="24">
                            <div class="grid-content bg-purple-light">
                              <div style="padding:5px;">
                                <span style="font-size: 12px;margin-left: 10px;">名称：</span>
                                <el-input style="width:130px;" class="kjr-input" size="mini"
                                  v-model="model_country_name" placeholder="请输入名称查询">
                                </el-input>
                                &nbsp;&nbsp;&nbsp;
                                <el-button @click="searchByName(2)" size="mini" type="primary">筛选</el-button>
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                              </div>
                              <div style="padding:5px;">
                                <el-table :data="tableData_countrywaterList" height="375" border stripe
                                  style="width: 100%">
                                  <el-table-column type="index" width="50" label="序号" align="center"
                                    :index="indexMethod_country">
                                  </el-table-column>
                                  <el-table-column prop="adCode" label="管理单位代码" width="110" align="center">
                                  </el-table-column>
                                  <el-table-column prop="adName" label="管理单位名称" width="160" align="center" sortable>
                                  </el-table-column>
                                  <el-table-column prop="adGrad" label="行政区划等级" width="120" align="center"
                                    :formatter="formatter_country_xzqh">
                                  </el-table-column>
                                  <el-table-column label="定位" width="70" align="center">
                                    <template slot-scope="scope">
                                      <i size="big" @click="location2(scope.row.lgtd,scope.row.lttd,5)"
                                        style="color:blue;font-size: 22px;cursor:pointer;"
                                        class="el-icon-location-outline"></i>
                                    </template>
                                  </el-table-column>
                                </el-table>
                                <div class="block" style='margin-top:15px;'>
                                  <el-pagination background @size-change="handleSizeChange_country"
                                    @current-change="handleCurrentChange_country" :page-sizes="[10,50, 100, 200]"
                                    :page-size="15" layout="total,sizes, prev, pager, next" :pager-count="3"
                                    :total="recordTotal_country">
                                  </el-pagination>
                                </div>
                              </div>
                            </div>
                          </el-col>
                        </el-row>
                      </el-tab-pane>
                      <el-tab-pane label="地下水" name="five">
                        <el-row style="margin-bottom:5px;">
                          <el-col :span="24">
                            <div class="grid-content bg-purple-light">
                              <div style="padding:5px;">
                                <span style="font-size: 12px;margin-left: 10px;">名称：</span>
                                <el-input style="width:130px;" class="kjr-input" size="mini" v-model="model_dxs_name"
                                  placeholder="请输入名称查询">
                                </el-input>
                                &nbsp;&nbsp;&nbsp;
                                <el-button @click="searchByName(5)" size="mini" type="primary">筛选</el-button>
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                              </div>
                              <div style="padding:5px;">
                                <el-table :data="tableData_dxsList" height="375" border stripe style="width: 100%">
                                  <el-table-column type="index" width="50" label="序号" align="center"
                                    :index="indexMethod_dxs">
                                  </el-table-column>
                                  <el-table-column prop="stnm" label="测站名称" min-width="110" align="center">
                                  </el-table-column>
                                  <el-table-column prop="stcd" label="测站编码" min-width="100" align="center">
                                  </el-table-column>
                                  <el-table-column prop="adnm" label="所属行政区" min-width="100" align="center">
                                  </el-table-column>
                                  <el-table-column label="定位" width="70" align="center">
                                    <template slot-scope="scope">
                                      <i size="big" @click="location2(scope.row.lgtdPc,scope.row.lttdPc,5)"
                                        style="color:blue;font-size: 22px;cursor:pointer;"
                                        class="el-icon-location-outline"></i>
                                    </template>
                                  </el-table-column>
                                </el-table>
                                <div class="block" style='margin-top:15px;'>
                                  <el-pagination background @size-change="handleSizeChange_dxs"
                                    @current-change="handleCurrentChange_dxs" :page-sizes="[10,50, 100, 200]"
                                    :page-size="15" layout="total,sizes, prev, pager, next" :pager-count="3"
                                    :total="recordTotal_dxs">
                                  </el-pagination>
                                </div>
                              </div>
                            </div>
                          </el-col>
                        </el-row>
                      </el-tab-pane>
                    </el-tabs>
                  </template>
                </el-card>
              </div>
            </el-col>
          </el-row>
        </div>
      </draggable>
    </transition>

    <transition name="el-fade-in-linear">
      <draggable :title="'水毁信息'" initTop=100 initLeft=220 initWidth=510 initHeight=485 v-if="processLineShow"
        @closeDraggable='closeModal'>
        <div class="process_line">
          <div class="item">
            <span class="title">属性<i class="el-icon-d-arrow-right"></i></span>
          </div>
          <div class="item content">
            <div class="item item_sk">
              <span class="label">项目名称：</span>
              <span class="label2" style="font-size: 13px;">{{curEventInfo.wtdstNm}}</span>
              <!-- <el-input disabled size="small" v-model="curEventInfo.wtdstNm" placeholder=""></el-input> -->
            </div>
            <div class="item item_sk">
              <span class="label">项目位置：</span>
              <span class="label2" style="font-size: 13px;">{{curEventInfo.locNm}}</span>
            </div>
            <div class="item item_sk">
              <span class="label">水毁情况：</span>
              <span class="label2" style="font-size: 13px;">{{curEventInfo.wtdstDtle}}</span>
            </div>
            <div class="item item_sk">
              <span class="label">项目进度：</span>
              <span class="label2" style="font-size: 13px;">{{curEventInfo.wtdstState}}</span>
            </div>
            <div class="item item_sk">
              <span class="label">计划完成：</span>
              <span class="label2" style="font-size: 13px;">{{curEventInfo.planRcvrTm}}</span>
            </div>
          </div>
          <div class="item" style="margin-top:10px;">
            <span class="title">问题<i class="el-icon-d-arrow-right"></i></span>
          </div>
          <div class="item content">
            <template>
              <el-table :data="wtqdData" height="200" highlight-current-row border stripe style="width: 100%">
                <el-table-column type="index" label="序号" align='center' width="50">
                </el-table-column>
                <el-table-column prop="inspPblmName" label="问题名称" align='center' width="100">
                </el-table-column>
                <el-table-column prop="inspPblmDesc" label="问题描述" align='center' width="100">
                </el-table-column>
                <!-- <el-table-column prop="inspAddDesc" label="问题地址" align='center' width="100">
                </el-table-column> -->
                <el-table-column prop="collTime" label="上报时间" :formatter="timestampToTime" align='center' width="100">
                </el-table-column>
                <el-table-column prop="pblmStat" label="处理状态" :formatter="processState" align='center' width="90">
                </el-table-column>
                <el-table-column fixed="right" label="操作" width="60">
                  <template slot-scope="scope">
                    <el-button @click="handleClick(scope.row)" type="text" size="small">详情</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </template>
          </div>

          <!--<div v-if="showMore_sh" class="item" style="margin-top:10px;">-->
          <!--<span class="title"><i class="el-icon-star-on"></i>问题详情</span>-->
          <!--</div>-->
          <transition name="el-fade-in-linear">
            <!--<div class="eventDetailClass">-->
            <draggable title="问题详情" @closeDraggable="closeDraggable_shxq" initTop=0 initLeft=300 initWidth=600
              initHeight=325 v-if="showMore_sh">
              <template>
                <el-table :data="tableData2" height="300" highlight-current-row border stripe style="width: 100%">
                  <el-table-column type="index" label="序号" align='center' width="80">
                  </el-table-column>
                  <el-table-column prop="inspPblmName" label="问题名称" align='center' width="150">
                  </el-table-column>
                  <el-table-column prop="inspPblmDesc" label="问题描述" align='center' width="120">
                  </el-table-column>
                  <el-table-column prop="inspAddDesc" label="问题地址" align='center' width="150">
                  </el-table-column>
                  <el-table-column prop="collTime" label="上报时间" align='center' width="130" :formatter="timestampToTime">
                  </el-table-column>
                  <el-table-column prop="pblmStat" label="处理状态" align='center' width="100" :formatter="processState">
                  </el-table-column>
                  <el-table-column prop="pblmLong" label="问题经度" align='center' width="100">
                  </el-table-column>
                  <el-table-column prop="pblmLat" label="问题纬度" align='center' width="100">
                  </el-table-column>
                  <el-table-column prop="reviOpin" label="复查意见" align='center' width="100">
                  </el-table-column>
                  <el-table-column prop="reviConc" label="复查结论" align='center' width="100">
                  </el-table-column>
                  <el-table-column prop="recPers" label="操作记录人员" align='center' min-width="300">
                  </el-table-column>
                </el-table>
              </template>
            </draggable>
            <!-- <eventProcess v-if="showEventProcess" :eventCode="eventProcessDataObj1.evCode" :eventProcessDataObj="eventProcessDataObj1" @closeDraggable="closeDraggable1"></eventProcess> -->
            <!--</div>-->
          </transition>
        </div>
      </draggable>
    </transition>

    <transition name="el-fade-in-linear">
      <draggable :title="'人员信息'" initTop=160 initLeft=6 initWidth=310 initHeight=484 v-if="processLineShow_people"
        @closeDraggable='closeModal_people'>
        <div class="process_line">
          　　<div style="width:100%; height:210px;text-align:center; padding-top:10px;">
            　　 <img v-if="peopleDetail.imgurl != null" style="width: 150px;height: 200px;"
              :src="`/pdcApi` + peopleDetail.imgurl" alt="">
            <img v-else src="../../static/pic.jpg" alt="">
            　　</div>
          <div style="width:100%;height:35px;text-align:center; padding-top:0px;font-size: 18px;font-weight: bold;">
            　　 <p>{{peopleDetail.persName}}</p>
            　　</div>
          <div class="item content4">
            <div class="item item2">
              <span class="label">单 位：</span>
              <div style="width:170px;border-bottom:1px solid #dddddd;display: inline-block;">
                <span style="font-size:14px;">{{peopleDetail.orgNm || "---"}}</span>
              </div>
            </div>
            <div class="item item2">
              <span class="label">职务/职称：</span>
              <div style="width:170px;border-bottom:1px solid #dddddd;display: inline-block;">
                <span style="font-size:14px;">{{peopleDetail.admDuty || "---"}}</span>
              </div>
              <!-- <span style="font-size:14px;text-decoration: underline">{{peopleDetail.admDuty || "---"}}</span> -->
            </div>
            <div class="item item2">
              <span class="label">编 号：</span>
              <div style="width:170px;border-bottom:1px solid #dddddd;display: inline-block;">
                <span style="font-size:14px;">{{peopleDetail.idnm || "---"}}</span>
              </div>
              <!-- <span style="font-size:14px;text-decoration: underline">{{peopleDetail.idnm || "---"}}</span> -->
            </div>
          </div>
          <span style="font-size:14px;margin-left: 5px;">时间范围：</span>
          <el-date-picker size='mini' format="yyyy-MM-dd HH:mm" value-format="yyyy-MM-dd HH:mm:ss" style="width: 296px;"
            v-model="value5" type="datetimerange" :picker-options="pickerOptions2" range-separator="至"
            start-placeholder="开始日期" end-placeholder="结束日期" align="right">
          </el-date-picker>
          <el-button @click="peopleTrail(peopleDetail.guid)"
            style="margin-top: 5px;margin-left: 30px;padding: 7px 12px;" type="primary" size="mini">历史轨迹</el-button>
          <el-button @click="peopleTrail(peopleDetail.guid,false)"
            style="margin-top: 5px;margin-left: 30px;padding: 7px 12px;" type="primary" size="mini">轨迹数据表</el-button>
          <!-- <el-button style="float:right;margin-top: 5px;margin-right: 15px;padding: 7px 12px;" type="primary" size="mini">填报信息</el-button> -->
        </div>
      </draggable>
    </transition>

    <transition name="el-fade-in-linear">
      <draggable :title="'人员轨迹'" initTop=160 initLeft=326 initWidth=450 initHeight=720
        v-if="processLineShow_peopleTrail" @closeDraggable='closeModal_peopleTrail'>
        <div class="process_line">
          <el-row>
            <el-col :span="24">
              <div class="grid-content bg-purple-dark">
                <div style="padding:5px;">
                  <el-table :data="tableData_peopleTrail" height="647" border stripe style="width: 100%"
                    :default-sort="{prop: 'operateTime', order: 'ascending'}" @row-click="peopleTrailRowClick">
                    <el-table-column type="index" width="50" label="序号" align="center">
                    </el-table-column>
                    <el-table-column prop="longitude" label="经度" width="100" align="center"
                      :formatter="formatter_coordinateX">
                    </el-table-column>
                    <el-table-column prop="latitude" label="纬度" width="100" align="center"
                      :formatter="formatter_coordinateY">
                    </el-table-column>
                    <el-table-column prop="operateTime" label="最新时间" width="150" align="center" sortable>
                    </el-table-column>
                    <!-- <el-table-column label="定位" width="auto" align="center">
                      <template slot-scope="scope">
                        <i size="big" @click="location(scope.$index, scope.row)" style="color:blue;font-size: 22px;cursor:pointer;"
                          class="el-icon-location-outline"></i>
                      </template>
                    </el-table-column> -->
                  </el-table>
                  <!-- <div class="block">
                    <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
                      :page-sizes="[10,50, 100, 200]" :page-size="15" layout="total,sizes, prev, pager, next"
                      :pager-count="3" :total="recordTotal">
                    </el-pagination>
                  </div> -->
                </div>
              </div>
            </el-col>
          </el-row>
        </div>
      </draggable>
    </transition>

    <transition name="el-fade-in-linear">
      <div class="eventDetailClass">
        <draggable title="问题详情" @closeDraggable="closeDraggable" initTop=100 initLeft=300 initWidth=490 initHeight=580
          v-if="showEventProcess">
          <div id="eventDetailBody" style="padding: 3px;">
            <div style="overflow-y: auto;">
              <table class="tableStyle" width="100%">
                <tbody>
                  <tr>
                    <td width="20%" class="name">督查对象类型&nbsp;</td>
                    <td width="30%">
                      {{eventDetailObj.inspPblmsName}}
                    </td>
                    <td width="20%" class="name">督查问题名称&nbsp;</td>
                    <td width="30%">
                      {{eventDetailObj.inspPblmsName}}
                    </td>
                  </tr>
                  <tr>
                    <td class="name">督查问题编码&nbsp;</td>
                    <td>{{eventDetailObj.inspPblmCode}}</td>
                    <td class="name"> 督查问题描述&nbsp;</td>
                    <td>{{eventDetailObj.inspPblmDesc}}</td>
                  </tr>
                  <tr>
                    <td class="name">督查问题地址&nbsp;</td>
                    <td colspan="3">{{eventDetailObj.inspAddDesc}}</td>
                  </tr>
                  <tr>
                    <td class="name"> 采集日期&nbsp;</td>
                    <td colspan="3">{{timestampToTime(eventDetailObj) }}</td>
                  </tr>
                  <tr>
                    <td class="name"> 上报人&nbsp;</td>
                    <td colspan="3">{{eventDetailObj.persName}}</td>
                  </tr>
                  <tr>
                    <td class="name">处理状态&nbsp;</td>
                    <td colspan="3">
                      <span v-if='eventDetailObj.pblmStat == 1'>已上报</span>
                      <span v-else-if='eventDetailObj.pblmStat == 0'>未上报</span>
                    </td>
                  </tr>
                  <tr>
                    <td class="name">视频 &nbsp;</td>
                    <td colspan="3"></td>
                  </tr>
                  <tr style="" id="photo">
                    <td colspan="4">
                      <template>
                        <el-carousel :interval="5000" type="card" arrow="always">
                          <el-carousel-item v-for="(item,index) in eventDetailObj.imageUrlArray" :key="index">
                            <a :href="item.imgsrc" target="_blank">
                              <img style="width:100%;height:100%;" :src="item.imgsrc" alt="">
                            </a>
                          </el-carousel-item>
                        </el-carousel>
                      </template>
                      <!-- <el-carousel :interval="4000" type="card" height="300px">
                        <el-carousel-item v-for="(item,index) in eventDetailObj.imageUrlArray" :key="index">
                          <a :href="item.imgsrc" target="_blank">
                            <img style="width:100%;height:100%;" :src="item.imgsrc" alt="">
                          </a>
                        </el-carousel-item>
                        <el-carousel-item style="display:flex;flex-direction:row;jusitfy-content:center;align-items:center;"
                          v-if="!eventDetailObj.hasOwnProperty('imageUrlArray')||eventDetailObj.imageUrlArray==''||eventDetailObj.imageUrlArray.length==0">
                          <p style="margin-left: auto;
                                                            margin-right: auto;
                                                            color: #acacac;">暂无图片信息
                          </p>
                        </el-carousel-item>
                      </el-carousel> -->
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>
          </div>
        </draggable>
        <!-- <eventProcess v-if="showEventProcess" :eventCode="eventProcessDataObj1.evCode" :eventProcessDataObj="eventProcessDataObj1" @closeDraggable="closeDraggable1"></eventProcess> -->
      </div>
    </transition>

    <transition name="el-fade-in-linear">
      <draggable :title="'水库信息'" initTop=100 initLeft=220 initWidth=790 initHeight=500 v-if="processLineShow_shuiku"
        @closeDraggable='closeModal_shuiku'>
        <div class="process_line">
          <div class="item">
            <span class="title">属性<i class="el-icon-d-arrow-right"></i></span>
          </div>
          <div class="item content4">
            <div class="item3">
              <div>
                <span class="label5">水库名称：</span>
                <span class="label2">{{shuikuInfo.rsvrNm}}</span>
              </div>
              <div class="mt20">
                <span class="label5">所在地点：</span>
                <span class="label2 spanStyle" :title=shuikuInfo.hystSite>{{shuikuInfo.hystSite}}</span>
              </div>
              <div class="mt20">
                <span class="label5">建成时间：</span>
                <span class="label2">{{shuikuInfo.resCreateTime}}</span>
              </div>
            </div>

            <div class="item3">
              <div class="">
                <span class="label5">工程规模：</span>
                <span class="label2">{{formatEngScal(shuikuInfo.engScal)}}</span>
              </div>
              <div class="mt20">
                <span class="label5">总库容(m³)：</span>
                <span class="label2">{{shuikuInfo.totCap}}</span>
              </div>
              <div class="mt20">
                <span class="label5">最大坝高(m)：</span>
                <span class="label2">{{shuikuInfo.damMaxHigh}}</span>
              </div>
            </div>
            <div class="item3">
              <div class="">
                <span class="label5">主坝坝型：</span>
                <span class="label2">{{formatdamType(shuikuInfo.damType)}}</span>
              </div>
              <div class="mt20">
                <span class="label5">注册登记号：</span>
                <span class="label2">{{shuikuInfo.damRegCode}}</span>
              </div>
            </div>

          </div>
          <el-collapse v-model="activeNames_sk" @change="skhandleChange" accordion>
            <el-collapse-item title="三项基本要求落实情况" name="1">
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>安全管理(防汛)应急预案</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否编制:</span>
                  <span class="ml10">{{shifouRadio(sxjbyq.emerPlanSameExta)}}</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否批复或备案:</span>
                  <span class="ml10">{{shifouRadio(sxjbyq.emerPlanSameAppr)}}</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否进行演练:</span>
                  <span class="ml10">{{shifouRadio(sxjbyq.emerPlanSameEme)}}</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否具备操作性:</span>
                  <span class="ml10">{{shifouRadio(sxjbyq.emerPlanSameSpeed)}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>水库调度运用方案</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否编制:</span>
                  <span class="ml10">{{shifouRadio(sxjbyq.schPlanSameExta)}}</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否批复:</span>
                  <span class="ml10">{{shifouRadio(sxjbyq.schPlanSameAppr)}}</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否进行演练:</span>
                  <span class="ml10">{{shifouRadio(sxjbyq.schPlanSameEme)}}</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否具有操作性:</span>
                  <span class="ml10">{{shifouRadio(sxjbyq.schPlanSameSpeed)}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>水雨情预测预报</span>
                </div>
                <div class="mt30">
                  <span class="span150">是否具有能力开展:</span>
                  <span class="ml10">{{shifouRadio(sxjbyq.rainForc)}}</span>
                </div>
              </el-card>
            </el-collapse-item>
            <el-collapse-item title="三个责任人落实情况" name="2" class="sgzzr">
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>行政责任人情况</span>
                </div>
                <div class="mt10">
                  <span class="span100">是否有行政责任人:</span>
                  <span class="ml10">{{shifouRadio(sgzrr.hasWiunWaoLegPers)}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">责任人姓名:</span>
                  <span class="ml10">{{sgzrr.wiunWaoLegPers}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">责任人电话:</span>
                  <span class="ml10">{{sgzrr.wiunWaoLegPersTel}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">责任人职务:</span>
                  <span class="ml10">{{sgzrr.wiunWaoLegPersDuty}}</span>
                </div>
                <div class="zrr mt10 mr0">
                  <span class="span100">履职情况:</span>
                  <span class="ml10" v-if="sgzrr.wiunWaoLegPersResu == '0'">好</span>
                  <span class="ml10" v-if="sgzrr.wiunWaoLegPersResu == '1'">一般</span>
                  <span class="ml10" v-if="sgzrr.wiunWaoLegPersResu == '2'">差</span>
                </div>

              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>技术责任人情况</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">是否有技术责任人:</span>
                  <span class="ml10">{{shifouRadio(sgzrr.hasTechPers)}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">责任人姓名:</span>
                  <span class="ml10">{{sgzrr.techPers}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">责任人电话:</span>
                  <span class="ml10">{{sgzrr.techPersTel}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">责任人职务:</span>
                  <span class="ml10">{{sgzrr.techPersDuty}}</span>
                </div>
                <div class="zrr mt10 mr0">
                  <span class="span100">履职情况:</span>
                  <span class="ml10" v-if="sgzrr.techPersResu == '0'">好</span>
                  <span class="ml10" v-if="sgzrr.techPersResu == '1'">一般</span>
                  <span class="ml10" v-if="sgzrr.techPersResu == '2'">差</span>
                </div>

              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>巡查责任人情况</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">是否有巡查责任人:</span>
                  <span class="ml10">{{shifouRadio(sgzrr.hasPatrolPers)}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">责任人姓名:</span>
                  <span class="ml10">{{sgzrr.patrolPers}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">责任人电话:</span>
                  <span class="ml10">{{sgzrr.patrolPersTel}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">责任人职务:</span>
                  <span class="ml10">{{sgzrr.patrolPersDuty}}</span>
                </div>
                <div class="zrr mt10 mr0">
                  <span class="span100">履职情况:</span>
                  <span class="ml10" v-if="sgzrr.patrolPersResu == '0'">好</span>
                  <span class="ml10" v-if="sgzrr.patrolPersResu == '1'">一般</span>
                  <span class="ml10" v-if="sgzrr.patrolPersResu == '2'">差</span>
                </div>

              </el-card>
            </el-collapse-item>
            <el-collapse-item title="水库工程实体和运行管理情况" name="3" class="skgc">
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>安全运行总体评价</span>
                </div>
                <div class="zrr mt10">
                  <span class="span110">安全评价:</span>
                  <span class="ml10">{{shifouRadio(skgcst.safeComment)}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>管理机构及经费</span>
                </div>
                <div class="zrr mt10">
                  <span class="span110">是否有专门管理机构:</span>
                  <span class="ml10">{{shifouRadio(skgcst.hasSpeManage)}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span110">是否有管护人员:</span>
                  <span class="ml10">{{shifouRadio(skgcst.hasManagePers)}}</span>
                </div>
                <div class="zrr mt10">
                  <span class="span110">是否有稳定经费来源:</span>
                  <span class="ml10">{{shifouRadio(skgcst.hasWdEmnic)}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>蓄水运行状况</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">正常运行:</span>
                  <span class="ml10">{{shifouRadio(skgcst.retainRegular)}}</span>
                </div>
                <div class="zrr mt10">
                  <span>不具备正常蓄水位运行条件:</span>
                  <span class="ml10" v-if="skgcst.hasRetainRegular == '1'">但仍高水位运行</span>
                  <span class="ml10" v-if="skgcst.hasRetainRegular == '2'">已采取措施限制水位运行</span>
                  <span class="ml10" v-if="skgcst.hasRetainRegular == '0'">已空库运行</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>挡水建筑物运行情况</span>
                </div>
                <div class="zrr mt10">
                  <span class="span100">是否正常运行:</span>
                  <span class="ml10">{{shifouRadio(skgcst.dikeHasLeak)}}</span>
                </div>
                <div class="zrr mt10">
                  <span>是否明显漏水影响安全:</span>
                  <span class="ml10">{{shifouRadio(skgcst.leakMakeSafe)}}</span>
                </div>
                <div class="zrr mt10">
                  <span>是否有变形或不稳定情况:</span>
                  <span class="ml10">{{shifouRadio(skgcst.hasAstable)}}</span>
                </div>
              </el-card>


              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>泄洪建筑物运行情况</span>
                </div>
                <div class="zrr mt10">
                  <span>是否设置泄洪建筑物:</span>
                  <span class="ml10">{{shifouRadio(skgcst.hasSetMainFl)}}</span>
                </div>
                <div class="zrr mt10">
                  <span>运行情况:</span>
                  <span class="ml10">{{skgcst.isMainFlNormal}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>防洪限制水位</span>
                </div>
                <div class="zrr mt10">
                  <span>是否设置防洪限制水位:</span>
                  <span class="ml10">{{shifouRadio(skgcst.havFlLowLimLev)}}</span>
                </div>
                <div class="zrr mt10">
                  <span>超汛限水位运行:</span>
                  <span class="ml10">{{shifouRadio(skgcst.gtFlLowLimLev)}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>放水建筑物运行情况</span>
                </div>
                <div class="zrr mt10">
                  <span>是否设置放水建筑物:</span>
                  <span class="ml10">{{shifouRadio(skgcst.hasSetPourFl)}}</span>
                </div>
                <div class="zrr mt10">
                  <span>运行情况:</span>
                  <span class="ml10">{{skgcst.pourFyIsNormal}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>大坝安全鉴定</span>
                </div>
                <div class="zrr mt10">
                  <span>安全鉴定:</span>
                  <span class="ml10">{{skgcst.extDamSafeAppr}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>水库除险加固</span>
                </div>
                <div class="zrr mt10">
                  <span>是否实施:</span>
                  <span class="ml10">{{shifouRadio(skgcst.ifReinForce)}}</span>
                </div>
                <div class="zrr mt10">
                  <span>实施情况:</span>
                  <span class="ml10">{{skgcst.ifComplateAccAll}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>公示情况</span>
                </div>
                <div class="zrr mt10">
                  <span>是否设置水库公示牌:</span>
                  <span class="ml10">{{shifouRadio(skgcst.ifDamWarnLogo)}}</span>
                </div>
              </el-card>
              <el-card class="box-card">
                <div slot="header" class="clearfix">
                  <span>注册登记情况</span>
                </div>
                <div class="zrr mt10">
                  <span>是否注册登记:</span>
                  <span class="ml10">{{shifouRadio(skgcst.manageRegRelNote)}}</span>
                </div>
                <div class="zrr mt10">
                  <span>注册信息真实:</span>
                  <span class="ml10">{{shifouRadio(skgcst.ifManageRegRel)}}</span>
                </div>
              </el-card>
            </el-collapse-item>
            <el-collapse-item title="走访情况" name="4">
              <div class="item content">
                <template>
                  <el-table :data="zfqkData" height="200" highlight-current-row border stripe style="width: 100%">
                    <el-table-column prop="recPers2" label="走访人姓名" align='center'>
                    </el-table-column>
                    <el-table-column prop="knowResManager" label="是否知晓水库管护人员" align='center'>
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.knowResManager)}}</span>
                      </template>
                    </el-table-column>
                    <el-table-column prop="managerComment" label="对管护责任人的评价" align='center'>
                      <template slot-scope="scope">
                        <span style="font-weight:bolder;color:#F56C6C" v-if="scope.row.managerComment == 0">不满意</span>
                        <span style="font-weight:bolder;color:#E6A23C" v-if="scope.row.managerComment == 1">一般</span>
                        <span style="font-weight:bolder;color:#67C23A" v-if="scope.row.managerComment == 2">满意</span>
                      </template>
                    </el-table-column>
                    <el-table-column prop="note" label="备注" :formatter="processState" align='center'>
                    </el-table-column>
                  </el-table>
                </template>
              </div>
            </el-collapse-item>
            <el-collapse-item title="问题清单" name="5">
              <div class="item content">
                <template>
                  <el-table :data="wtqdData" height="200" highlight-current-row border stripe style="width: 100%">
                    <!--<el-table-column prop="objType" label="督查对象类型" align='center' width="150">-->
                    <!--</el-table-column>-->
                    <!--<el-table-column prop="inspPblmType" label="督查问题类型" align='center' width="120"></el-table-column>-->
                    <!--<el-table-column prop="inspPblmCode" label="督查问题编码" align='center' width="150" show-overflow-tooltip></el-table-column>-->
                    <el-table-column prop="inspPblmName" label="督查问题名称" align='center' width="150"
                      show-overflow-tooltip></el-table-column>
                    <el-table-column prop="inspPblmDesc" label="督查问题描述" align='center' width="150"
                      show-overflow-tooltip></el-table-column>
                    <el-table-column prop="inspAddDesc" label="督查问题地址描述" align='center' width="200"
                      show-overflow-tooltip></el-table-column>
                    <el-table-column prop="objType" label="督查对象类型" align='center' width="150">
                    </el-table-column>
                    <el-table-column prop="inspPblmType" label="督查问题类型" align='center' width="120"></el-table-column>
                    <el-table-column prop="inspPblmCode" label="督查问题编码" align='center' width="150"
                      show-overflow-tooltip></el-table-column>
                    <el-table-column prop="inspPblmName" label="督查问题名称" align='center' width="150"
                      show-overflow-tooltip></el-table-column>
                    <el-table-column prop="inspPblmDesc" label="督查问题描述" align='center' width="150"
                      show-overflow-tooltip></el-table-column>
                    <el-table-column prop="inspAddDesc" label="督查问题地址描述" align='center' width="200"
                      show-overflow-tooltip></el-table-column>
                    <el-table-column prop="objType" label="督查对象类型" align='center' width="150">
                    </el-table-column>
                    <el-table-column prop="inspPblmType" label="督查问题类型" align='center' width="120"></el-table-column>
                    <el-table-column prop="inspPblmCode" label="督查问题编码" align='center' width="150"
                      show-overflow-tooltip></el-table-column>
                    <el-table-column prop="inspPblmName" label="督查问题名称" align='center' width="150"
                      show-overflow-tooltip></el-table-column>
                    <el-table-column prop="inspPblmDesc" label="督查问题描述" align='center' width="150"
                      show-overflow-tooltip></el-table-column>
                    <el-table-column prop="inspAddDesc" label="督查问题地址描述" align='center' width="200"
                      show-overflow-tooltip></el-table-column>
                    <!--<el-table-column prop="pblmLong" label="问题经度" align='center' width="130"></el-table-column>-->
                    <!--<el-table-column prop="pblmLat" label="问题纬度" align='center'></el-table-column>-->
                    <el-table-column prop="ifCasePblm" label="是否典型问题" align='center' width="150">
                      <template slot-scope="scope">
                        <span v-if="scope.row.ifCasePblm == 1">典型</span>
                        <span v-if="scope.row.ifCasePblm == 0">非典型</span>
                      </template>
                    </el-table-column>
                    <el-table-column prop="inspPblmOrgName" label="问题责任单位" align='center' width="150"></el-table-column>
                    <el-table-column prop="pblmPersName" label="问题责任人" align='center' width="150"></el-table-column>
                    <el-table-column prop="inspPblmCate" label="督查问题严重程度" align='center' width="150">
                      <template slot-scope="scope">
                        <span style="padding: 3px 10px;background:#27C19F;border-radius:15px;color:rgba(255,255,255,1)"
                          v-if="scope.row.inspPblmCate == 0">一般</span>
                        <span style="padding: 3px 10px;background:#E6A23C;border-radius:15px;color:rgba(255,255,255,1)"
                          v-if="scope.row.inspPblmCate == 1">较重</span>
                        <span style="padding: 3px 10px;background:#F56C6C;border-radius:15px;color:rgba(255,255,255,1)"
                          v-if="scope.row.inspPblmCate == 2">严重</span>
                      </template>
                    </el-table-column>
                    <el-table-column prop="pblmStat" label="问题状态" align='center' width="150">
                      <template slot-scope="scope">
                        <span v-if="scope.row.pblmStat == 0">暂存</span>
                        <span v-if="scope.row.pblmStat == 1">上报</span>
                        <span v-if="scope.row.pblmStat == 2">审核</span>
                        <span v-if="scope.row.pblmStat == 3">审办</span>
                        <span v-if="scope.row.pblmStat == 4">整改通知</span>
                        <span v-if="scope.row.pblmStat == 5">整改反馈</span>
                        <span v-if="scope.row.pblmStat == 6">销号</span>
                        <span v-if="scope.row.pblmStat == 9">删除</span>
                      </template>
                    </el-table-column>
                    <el-table-column prop="reviOpin" label="复查意见" align='center' width="150"></el-table-column>
                    <el-table-column prop="reviConc" label="复查结论" align='center'>
                      <template slot-scope="scope">
                        <span v-if="scope.row.reviConc == 0">复查一次销号</span>
                        <span v-if="scope.row.reviConc == 1">进一步整改</span>
                        <span v-if="scope.row.reviConc == 2">多次整改销号</span>
                      </template>
                    </el-table-column>
                    <!--<el-table-column prop="dataStat" label="数据状态" align='center'></el-table-column>-->
                    <el-table-column prop="collTime" label="采集时间" align='center' :formatter="timestampToTime"
                      show-overflow-tooltip width="150">
                    </el-table-column>
                    <el-table-column prop="recPers" label="操作记录人员" align='center' width="150"></el-table-column>
                  </el-table>
                </template>
              </div>
            </el-collapse-item>
          </el-collapse>
        </div>
      </draggable>
    </transition>

    <transition name="el-fade-in-linear">
      <draggable :title="'农村饮用水信息'" initTop=100 initLeft=220 initWidth=790 initHeight=500
        v-if="processLineShow_country_water" @closeDraggable='closeModal_country_water' style="overflow: auto">
        <div class="process_line">
          <div class="item">
            <span class="title">属性</span>
          </div>
          <div class="item content4">
            <!--<div class="item6">-->
            <!--<span class="label">县（区、市）名称：</span>-->
            <!--<span class="ml10">{{countryWaterInfo.adCode}}</span>-->
            <!--</div>-->
            <div class="item6">
              <span class="label">农村人口（万人）：</span>
              <span class="ml10">{{countryWaterInfo.personAmount}}</span>
            </div>
            <div class="item6">
              <span class="label">集中供水率（%）：</span>
              <span class="ml10">{{countryWaterInfo.focusSupplyPerc ? countryWaterInfo.focusSupplyPerc * 100 + '%' :
                ''}}</span>
            </div>
            <div class="item6">
              <span class="label">自来水普及率（%）：</span>
              <span class="ml10">{{countryWaterInfo.waterSupplyPerc ? countryWaterInfo.waterSupplyPerc * 100 + '%' :
                ''}}</span>
            </div>
            <div class="item6">
              <span class="label">地方人民政府主体责任是否明确：</span>
              <span class="ml10">{{shifouRadio(countryWaterInfo.isGovRes)}}</span>
            </div>
            <div class="item6">
              <span class="label">水利部门行业监管责任是否明确：</span>
              <span class="ml10">{{shifouRadio(countryWaterInfo.isConRes)}}</span>
            </div>
            <div class="item6">
              <span class="label">供水单位运行管理责任是否到位：</span>
              <span class="ml10">{{shifouRadio(countryWaterInfo.isDeptRes)}}</span>
            </div>
            <div class="item6">
              <span class="label">是否建立县级运行管理机构：</span>
              <span class="ml10">{{shifouRadio(countryWaterInfo.isCntyDept)}}</span>
            </div>
            <div class="item6">
              <span class="label">是否建立县级运行管理办法：</span>
              <span class="ml10">{{shifouRadio(countryWaterInfo.isCntyFunc)}}</span>
            </div>
            <div class="item6">
              <span class="label">是否落实县级运行管理经费：</span>
              <span class="ml10">{{shifouRadio(countryWaterInfo.isCntyFee)}}</span>
            </div>

            <div class="item6">
              <span class="label">是否正常开展水质巡检：</span>
              <span class="ml10">{{shifouRadio(countryWaterInfo.isQuailtyChk)}}</span>
            </div>
            <div class="item6">
              <span class="label">2018年落实运行经费（万元）：</span>
              <span class="ml10">{{countryWaterInfo.pracFee}}</span>
            </div>
          </div>
          <el-collapse v-model="activeNames_ny" @change="nyhandleChange" accordion class="nywater">
            <el-collapse-item title="农村饮水工程运行管理情况表" name="1">
              <el-table :data="tableData6" style="width: 100%">
                <el-table-column label="概况" fixed>
                  <el-table-column prop="pjnm" label="工程名称" align="center" show-overflow-tooltip></el-table-column>
                  <el-table-column prop="villageNm" label="所在地" align="center" show-overflow-tooltip min-width="150">
                  </el-table-column>
                  <el-table-column prop="buildYear" align="center" label="建成年份" min-width="80"></el-table-column>
                  <el-table-column prop="planSupplyScale" label="设计供水规模(m³/d)" min-width="150" align="center">
                  </el-table-column>
                  <el-table-column prop="supplyScale" label="实际供水规模（m³/d)" min-width="150" align="center">
                  </el-table-column>
                  <el-table-column prop="personNum" label="覆盖人口(人)" min-width="120" align="center"></el-table-column>
                  <el-table-column align="center" label="管网漏损率（%）" min-width="150">
                    <template slot-scope="scope">
                      <span>{{scope.row.pipeDamagePer ? scope.row.pipeDamagePer * 100 + '%' : ''}}</span>
                    </template>
                  </el-table-column>
                  <el-table-column align="center" prop="projectType" label="工程类别" min-width="120" show-overflow-tooltip>
                    <template slot-scope="scope">
                      <span v-if="scope.row.projectType == 1">千吨万人</span>
                      <span v-else-if="scope.row.projectType == 2">千吨万人以下工程</span>
                      <span v-else-if="scope.row.projectType == 3">分散式工程</span>
                      <span v-else>城市管网延伸</span>
                    </template>
                  </el-table-column>
                  <el-table-column align="center" label="是否24小时不间断供水" min-width="200">
                    <template slot-scope="scope">
                      <span>{{shifouRadio(scope.row.is24hSupply)}}</span>
                    </template>
                  </el-table-column>
                </el-table-column>
                <el-table-column label="水质保障">
                  <el-table-column label="净化设施设备" align="center">
                    <el-table-column label="是否配备" align="center">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isHavecleanEqui)}}</span>
                      </template>
                    </el-table-column>
                    <el-table-column label="是否正常运行" align="center" min-width="130">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isCleanequiG)}}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                  <el-table-column label="消毒设备" align="center">
                    <el-table-column prop="isHavedisinfect" label="是否配备" align="center">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isHavedisinfect)}}</span>
                      </template>
                    </el-table-column>

                    <el-table-column prop="disinfectType" label="消毒方式" align="center">
                      <template slot-scope="scope">
                        <span v-if="scope.row.disinfectType == 1">液氯</span>
                        <span v-else-if="scope.row.disinfectType == 2">二氧化氯</span>
                        <span v-else-if="scope.row.disinfectType == 3">次氯酸钠</span>
                        <span v-else-if="scope.row.disinfectType == 4">臭氧</span>
                        <span v-else>紫外线</span>
                      </template>
                    </el-table-column>
                    <el-table-column prop="isDisinfectGood" label="是否正常运行" align="center" min-width="110">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isDisinfectGood)}}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                  <el-table-column label="水质检测报告" align="center">
                    <el-table-column prop="isHavereport" label="有无报告" align="center" min-width="110">
                      <template slot-scope="scope">
                        <span>{{youwuRadio(scope.row.isHavereport)}}</span>
                      </template>
                    </el-table-column>
                    <el-table-column prop="isQuailtyGood" label="是否达标" align="center" min-width="110">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isQuailtyGood)}}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                  <el-table-column label="千吨万人水厂水质化验室" align="center">
                    <el-table-column prop="isHaveLab" label="是否配备" align="center">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isHaveLab)}}</span>
                      </template>
                    </el-table-column>
                    <el-table-column prop="isDailyCheck" label="是否开展日检" align="center" min-width="110">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isDailyCheck)}}</span>
                      </template>
                    </el-table-column>
                    <el-table-column prop="isDailycheckGood" label="水质是否达标" align="center" min-width="110">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isDailycheckGood)}}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                </el-table-column>
                <el-table-column label="运行管理" align="center">
                  <el-table-column label="有无取水许可证" align="center" min-width="130">
                    <template slot-scope="scope">
                      <span>{{youwuRadio(scope.row.isInsLicence)}}</span>
                    </template>
                  </el-table-column>
                  <el-table-column label="有无卫生许可证" align="center" min-width="130">
                    <template slot-scope="scope">
                      <span>{{youwuRadio(scope.row.isSanLicence)}}</span>
                    </template>
                  </el-table-column>
                  <el-table-column label="自动化控制系统" align="center">
                    <el-table-column label="是否配备" align="center">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isAutosystem)}}</span>
                      </template>
                    </el-table-column>
                    <el-table-column label="是否正常运行" align="center" min-width="130">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isAutosysGood)}}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                  <el-table-column label="视频安防系统" align="center">
                    <el-table-column label="是否配备" align="center" min-width="110">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isVideoSystem)}}</span>
                      </template>
                    </el-table-column>
                    <el-table-column label="是否正常运行" align="center" min-width="130">
                      <template slot-scope="scope">
                        <span>{{shifouRadio(scope.row.isVideosysGood)}}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                  <el-table-column label="水费水价" align="center">
                    <el-table-column prop="waterFee" label="执行水价（元/ m³）" align="center" min-width="140">
                    </el-table-column>
                    <el-table-column prop="waterCost" label="全成本（元/ m³）" align="center" min-width="140">
                    </el-table-column>
                    <el-table-column prop="operCost" label="运行成本（元/ m³）" align="center" min-width="140">
                    </el-table-column>
                    <el-table-column label="水费回收率（%）" align="center" min-width="140">
                      <template slot-scope="scope">
                        <span>{{scope.row.feeRecyclePer ? scope.row.feeRecyclePer * 100 + '%' : ''}}</span>
                      </template>
                    </el-table-column>
                  </el-table-column>
                  <el-table-column prop="manager" label="管理主体" align="center" show-overflow-tooltip>
                    <template slot-scope="scope">
                      <span v-if="scope.row.manager == 1">村委会</span>
                      <span v-else-if="scope.row.manager == 2">乡镇政府或水管站</span>
                      <span v-else-if="scope.row.manager == 3">供水公司</span>
                      <span v-else>租赁承包</span>
                    </template>
                  </el-table-column>
                  <el-table-column prop="isHaveHotline" label="是否配备供水服务热线电话" align="center" min-width="200">
                    <template slot-scope="scope">
                      <span>{{shifouRadio(scope.row.isHaveHotline)}}</span>
                    </template>
                  </el-table-column>
                </el-table-column>
                <el-table-column label="填报状态" prop="status" align="center" min-width="100">
                  <template slot-scope="scope">
                    <span v-if="scope.row.status == 0">未填报</span>
                    <span v-else>已填报</span>
                  </template>
                </el-table-column>
                <el-table-column label="暗访日期" prop="visitDate" align="center" min-width="100"></el-table-column>
                <el-table-column label="记录人员" prop="recPers2" align="center"></el-table-column>
                <el-table-column label="记录人员电话" prop="recPersTel" align="center" min-width="150"></el-table-column>
                <!--<el-table-column-->
                <!--align="center"-->
                <!--show-overflow-tooltip-->
                <!--label="操作"-->
                <!--min-width="160"-->
                <!--fixed="right"-->
                <!--&gt;-->
                <!--<template slot-scope="scope">-->
                <!--<el-button type="success" plain @click="toAddMember('编辑',scope.row)">编辑</el-button>-->
                <!--<el-button type="danger" plain @click="deleteMember(scope.row)">删除</el-button>-->
                <!--</template>-->
                <!--</el-table-column>-->
              </el-table>
            </el-collapse-item>

            <el-collapse-item title="暗访调研行政村统计表" name="2">
              <xingZhengCun :engId='YnEngId'></xingZhengCun>
            </el-collapse-item>

            <el-collapse-item title="村内农村饮水工程设施运行维护情况表" name="3">
              <gongChengWeiHu :engId='YnEngId'></gongChengWeiHu>
            </el-collapse-item>

            <el-collapse-item title="用水户情况表" name="4">
              <yongShuiQingKuang :engId='YnEngId'></yongShuiQingKuang>
            </el-collapse-item>

            <el-collapse-item title="千人以上供水工程水源地保护情况表" name="5">
              <shuiYuanDi :engId='YnEngId'></shuiYuanDi>
            </el-collapse-item>


          </el-collapse>
        </div>
      </draggable>
    </transition>

    <transition name="el-fade-in-linear">
      <draggable :title="'搜索结果'" initTop=220 :initLeft='screenWidth - 900' initWidth=885 initHeight=476
        v-if="processLineShow_result" @closeDraggable='closeModal_result'>
        <div class="process_line" style="padding-left:0px;">
          <el-row style="margin-bottom:5px;">
            <el-col :span="24">
              <div class="grid-content bg-purple-light">
                <el-card class="kjr-card box-card" style="height:433px;margin-bottom:0px;">
                  <template>
                    <el-tabs v-model="activeName_searchResult" @tab-click="handleClick_searchResult">
                      <el-tab-pane label="督查人员" name="first">
                        <el-table :data="tableData_search_people" height="370" border stripe style="width: 100%">
                          <el-table-column type="index" label="序号" width="50" align="center">
                          </el-table-column>
                          <el-table-column prop="persName" label="姓名" width="150" align="center">
                          </el-table-column>
                          <!-- <el-table-column prop="persName" label="姓名" width="150" align="center">
                          </el-table-column> -->
                          <el-table-column prop="mobilenumb" label="手机" width="180" align="center"
                            :formatter="formatter_peoplePhone">
                          </el-table-column>
                          <el-table-column prop="school" label="学校" width="220" align="center">
                          </el-table-column>
                          <!-- <el-table-column label="定位" width="60" align="center">
                            <template slot-scope="scope">
                              <i size="big" @click="location2(scope.row.lgtd,scope.row.lttd,5)" style="color:blue;font-size: 22px;cursor:pointer;"
                                class="el-icon-location-outline"></i>
                            </template>
                          </el-table-column> -->
                        </el-table>
                      </el-tab-pane>
                      <el-tab-pane label="水毁" name="fourth">
                        <el-table :data="tableData_search_shuihui" height="370" border stripe style="width: 100%">
                          <el-table-column type="index" width="50" label="序号" align="center">
                          </el-table-column>
                          <el-table-column prop="wtdstNm" label="项目名称" width="230" align="center">
                          </el-table-column>
                          <el-table-column prop="wtdstDtle" label="水毁情况" width="250" align="center">
                          </el-table-column>
                          <el-table-column prop="locNm" label="位置" width="160" align="center">
                          </el-table-column>
                          <el-table-column prop="wtdstType" label="类别" width="250" align="center">
                          </el-table-column>
                          <el-table-column prop="wtdstWrkam" label="主要工程量" width="210" align="center">
                          </el-table-column>
                          <el-table-column prop="planRcvrTm" label="计划修复日期" width="160" align="center">
                          </el-table-column>
                          <el-table-column prop="wtdstState" label="状态" width="100" align="center"
                            :formatter="formatter_shuihui_type">
                          </el-table-column>
                          <el-table-column prop="note" label="备注" width="100" align="center">
                          </el-table-column>
                          <el-table-column fixed="right" label="定位" width="70" align="center">
                            <template slot-scope="scope">
                              <i size="big" @click="location2(scope.row.wtdstLgtd,scope.row.wtdstLttd,5)"
                                style="color:blue;font-size: 22px;cursor:pointer;" class="el-icon-location-outline"></i>
                            </template>
                          </el-table-column>
                        </el-table>
                      </el-tab-pane>
                      <el-tab-pane label="小水库" name="third">
                        <el-table :data="tableData_search_shuiku" height="370" border stripe style="width: 100%">
                          <el-table-column type="index" label="序号" width="50" align="center">
                          </el-table-column>
                          <el-table-column prop="rsCode" label="管理单位代码" width="130" align="center" sortable>
                          </el-table-column>
                          <el-table-column prop="rsName" label="管理单位名称" width="130" align="center" sortable>
                          </el-table-column>
                          <el-table-column prop="rsAdmName" label="水库管理单位" width="220" align="center">
                          </el-table-column>
                          <el-table-column prop="rsType" label="水库类型" width="110" align="center"
                            :formatter="formatter_shuiku_type">
                          </el-table-column>
                          <el-table-column prop="engScal" label="工程规模" width="110" align="center"
                            :formatter="formatter_shuiku_pro_type">
                          </el-table-column>
                          <el-table-column prop="damSizeHig" label="主坝尺寸坝高(m)" width="150" align="center">
                          </el-table-column>
                          <el-table-column prop="totCap" label="总库容(万立方米)" width="150" align="center">
                          </el-table-column>
                          <el-table-column fixed="right" label="定位" width="70" align="center">
                            <template slot-scope="scope">
                              <i size="big" @click="location2(scope.row.longitude,scope.row.latitude,5)"
                                style="color:blue;font-size: 22px;cursor:pointer;" class="el-icon-location-outline"></i>
                            </template>
                          </el-table-column>
                        </el-table>
                      </el-tab-pane>
                      <el-tab-pane label="人饮" name="second">
                        <el-table :data="tableData_search_country" height="370" border stripe style="width: 100%">
                          <el-table-column type="index" label="序号" width="50" align="center">
                          </el-table-column>
                          <el-table-column prop="cwsCode" label="管理单位代码" width="150" align="center">
                          </el-table-column>
                          <el-table-column prop="cwsName" label="管理单位名称" width="180" align="center">
                          </el-table-column>
                          <el-table-column prop="cwsLoc" label="地址" width="180" align="center">
                          </el-table-column>
                          <el-table-column label="定位" width="60" align="center">
                            <template slot-scope="scope">
                              <i size="big" @click="location2(scope.row.cwsLong,scope.row.cwsLat,5)"
                                style="color:blue;font-size: 22px;cursor:pointer;" class="el-icon-location-outline"></i>
                            </template>
                          </el-table-column>
                        </el-table>
                      </el-tab-pane>
                      <el-tab-pane label="地下水" name="five" v-if="false">
                        <el-table :data="tableData_search_dxs" height="370" border stripe style="width: 100%">
                          <el-table-column type="index" label="序号" width="50" align="center">
                          </el-table-column>
                          <el-table-column prop="stnm" label="测站名称" min-width="110" align="center">
                          </el-table-column>
                          <el-table-column prop="stcd" label="测站编码" min-width="100" align="center">
                          </el-table-column>
                          <el-table-column prop="adnm" label="所属行政区" min-width="100" align="center">
                          </el-table-column>
                          <el-table-column label="定位" width="60" align="center">
                            <template slot-scope="scope">
                              <i size="big" @click="location2(scope.row.lgtdPc,scope.row.lttdPc,5)"
                                style="color:blue;font-size: 22px;cursor:pointer;" class="el-icon-location-outline"></i>
                            </template>
                          </el-table-column>
                        </el-table>
                      </el-tab-pane>
                    </el-tabs>
                  </template>
                </el-card>

              </div>
            </el-col>
          </el-row>
        </div>
      </draggable>
    </transition>

    <transition name="el-fade-in-linear">
      <draggable :title="'数据表'" initTop=160 initLeft=126 initWidth=500 initHeight=720 v-if="processLineShow_XXX"
        @closeDraggable='closeModal_XXX'>
        <div class="process_line">
          <el-row>
            <el-col :span="24">
              <div class="grid-content bg-purple-dark">
                <template>
                  <el-input style="width: 200px;padding: 5px 5px;" v-model="model_search" size="mini"
                    placeholder="输入名称关键字搜索" />
                </template>
                <div style="padding:5px;">
                  <el-table
                    :data="tableData_XXX.filter(data => !model_search || data.nm.toLowerCase().includes(model_search.toLowerCase()))"
                    height="617" border stripe style="width: 100%"
                    :default-sort="{prop: 'operateTime', order: 'ascending'}">
                    <el-table-column type="index" width="50" label="序号" align="center">
                    </el-table-column>
                    <el-table-column v-for="(item,index) in tableHeaders_XXX" :key="index" :prop="item.fieldName"
                      :label="item.aliasName" :width="item.width" align="center">
                    </el-table-column>
                    <el-table-column fixed="right" label="定位" width="60" align="center">
                      <template slot-scope="scope">
                        <i size="big" @click="location2(scope.row.lgtd,scope.row.lttd,5)"
                          style="color:blue;font-size: 22px;cursor:pointer;" class="el-icon-location-outline"></i>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>
              </div>
            </el-col>
          </el-row>
        </div>
      </draggable>
    </transition>
    <!--地下水测站-->
    <groundWateDialog v-if="modal_dixiashui" @closeDraggable="closeModal_dixiashui" :propsStcd="stcd" :djbId = "djbId" :currentObjectId="currentObjectId"></groundWateDialog>
  </div>
</template>

<script type="text/ecmascript-6">
  import * as esriLoader from 'esri-loader'
  import draggable from './draggable'
  import layerControl from './LayerControl'
  import layerControl2 from './LayerControl.2'
  import axios from 'axios'
  import request from '../../utils/gw_ajax_request.js';
  import {
    formatDateTime2
  } from '../../utils/gw_date.js'
  import xzqData from './xzqData'
  import xzqCity from './xzqCity'
  import xingZhengCun from './zhxx_xingzhengcun'
  import gongChengWeiHu from './zhxx_gongchengweihu'
  import yongShuiQingKuang from './ysqk_wiuStatusTable'
  import shuiYuanDi from './shuiyuandi'
  import {
    getTableId_ny
  } from "../../api/duChaTianBao.js"
  import groundWateDialog from './groundWateDialog'
  export default {
    components: {
      draggable,
      layerControl,
      xingZhengCun,
      gongChengWeiHu,
      yongShuiQingKuang,
      shuiYuanDi,
      layerControl2,
      groundWateDialog
    },
    name: "sq-map",
    data() {
      return {
        stcd:"50361903",
        djbId:"",
        currentObjectId:"",
        modal_dixiashui:false

        ,
        bAdmin: false,
        timer: "",
        model_search_input: "",
        bShowAddvcdSearch: false,
        bShowSearch: true,
        screenWidth: $(window).width(),
        map_title: "",
        bShowTitle: true,
        model_search: "",
        rowIndex: 0,
        map: null,
        view: null,
        options: {
          url: "/arcgisApi/4.9/init.js"
        },
        dialogInfo: false,
        dlg_info: "信息",
        processLineShow: false,
        curEventInfo: {
          "wtdstId": "82EEF7EA00324C1FBE6B5E8AC3095EC6",
          "wtdstType": "洋沙湖闸出口崩岸处险工程",
          "wtdstNm": "洋沙湖闸出口崩岸处险工程",
          "wtdstState": "1",
          "locAd": null,
          "wtdstDtle": "堤坡垮塌约800平米",
          "wtdstWrkam": "水闸出口深坑砂卵石和抛石回填；翼墙恢复接长20米；出口底板砼护砌360平米；翼墙两侧护坡43米",
          "planRcvrTm": null,
          "intm": null,
          "uptm": "2019-02-23 13:15:44",
          "note": null,
          "wtdstLgtd": 112.863527,
          "wtdstLttd": 28.650177,
          "locNm": "湖南-岳阳市-湘阴县",
          "list": []
        },
        zfqkData: [],
        wtqdData: [],
        tableData2: [{
          inspPblmName: '小水库',
          inspPblmDesc: '泄洪问题',
          inspAddDesc: "江苏 南京",
          collTime: '2018/01/01',
          pblmStat: '已解决'
        }],
        tableData5: [{
          inspPblmName: '小水库',
          inspPblmDesc: '泄洪问题',
          inspAddDesc: "江苏 南京",
          collTime: '2018/01/01',
          pblmStat: '已解决'
        }],
        //
        tableData_XXX: [],

        tableHeaders_XXX: [{
          fieldName: "code",
          aliasName: "编码",
          width: 120
        }, {
          fieldName: "nm",
          aliasName: "名称",
          width: 110
        }, {
          fieldName: "locNm",
          aliasName: "位置",
          width: 120
        }],
        dlg_info_people: "信息",
        curEventInfo_people: {

        },
        processLineShow_people: false,
        processLineShow_peopleTrail: false,
        tableData_peopleTrail: [],

        dlg_info2: "详情",
        dialogInfo2: false,

        showMore: false,
        showMore_sh: false,

        tableData_people: [],

        //xiangiqng
        showEventProcess: false,
        draagableTitle: "",
        imageUrlArray: [{
            imgsrc: 'http://60.208.113.77:8081//hzz_file/20180831/event/20180831102340_1535682220315.png'
          },
          {
            imgsrc: 'http://60.208.113.77:8081//hzz_file/20180831/event/20180831102342_1535682222752.png'
          },
          {
            imgsrc: 'http://60.208.113.77:8081//hzz_file/20180929/event/20180929152337_1538205817423.png'
          }
        ],
        eventProcessDataObj1: {},
        eventDetailObj: '',
        activeNames_sk: ['0'],
        activeNames_ny: ['0'],
        sxjbyq: {
          "rgstrId": "",
          'recPersId': "",
          "emerPlanSameExta": "",
          "emerPlanSameAppr": "",
          "emerPlanSameEme": "",
          "emerPlanSameSpeed": "",
          "schPlanSameExta": "",
          "schPlanSameAppr": "",
          "schPlanSameSpeed": "",
          "rainForc": "",
        },
        sgzrr: {
          "dutyId": '',
          "hasPatrolPers": "", //是否有巡查责任人
          "hasTechPers": "", //是否有技术责任人
          "hasWiunWaoLegPers": "", //是否有行政责任人
          "patrolPers": "", //巡查责任人姓名
          "patrolPersDuty": "", //巡查责任人职务
          "patrolPersResu": "", //巡查责任人履职情况 0  1  2
          "patrolPersTel": "", //巡查责任人电话
          "rgstrId": "", //水库督查登记ID
          "techPers": "", //技术责任人姓名
          "techPersDuty": "", //技术责任人职务
          "techPersResu": "", //技术责任人履职情况
          "techPersTel": "", //技术责任人电话
          "wiunWaoLegPers": "", //行政责任人姓名
          "wiunWaoLegPersDuty": "", //行政责任人职务
          "wiunWaoLegPersResu": "", //行政责任人履职情况
          "wiunWaoLegPersTel": "", //行政责任人电话
        },
        skgcst: {
          "mngrnId": '',
          "rgstrId": '',
          "recPersId": '',
          "safeCommontNote": '',
          "safeComment": "",
          "retainRegular": '',
          "hasRetainRegular": '',
          "hasWdEmnic": '',
          "hasManagePers": '',
          "hasSpeManage": '',
          "noRetainRegular": '',
          "canNotRetainWater": '',
          "dikeHasLeak": '',
          "leakMakeSafe": '',
          "hasAstable": '',
          "hasSetMainFl": '',
          "isMainFlNormal": '',
          "hasSetPourFl": '',
          "pourFyIsNormal": '',
          "havFlLowLimLev": '',
          "gtFlLowLimLev": '',
          "extDamSafeAppr": '',
          "ifReinForce": '',
          "ifComplateAccAll": '',
          "ifManageRegRel": '',
          "manageRegRelNote": '',
          "ifDamWarnLogo": '',
          "recPers2": '',
          "recPersTel": '',
          "status": '',
        },

        //shuiku
        shuikuInfo: {
          "rsName": '',
          "rsAdmName": "",
          "rsLoc": "",
          "intm": "",
          "engScal": "",
          "totCap": "",
          "damMaxHigh": "",
          "damTypeStr": "",
          "regCode": "",
          "rsvrLong": "",
          "rsvrLat": "",
          "resCreateTime": "",
        },
        processLineShow_shuiku: false,
        //country_water
        countryWaterInfo: {
          recPersId: '',
          adCode: '',
          personAmount: '',
          focusSupplyPerc: '',
          waterSupplyPerc: '',
          isGovRes: '',
          isConRes: '',
          isDeptRes: '',
          isCntyDept: '',
          isCntyFunc: '',
          isCntyFee: '',
          isQuailtyChk: '',
          pracFee: '',
          visitDate: '',
          visitorIds: '',
          status: '',
          recPers2: '',
          recPersTel: '',
          accompany: '',
          mngrId: ''
        },
        processLineShow_country_water: false,

        //peopleTable
        // peopleTableVisible: false,
        curNode: "1",
        processLineShow_peopleTable: false,
        activeTabName: 'three',
        activeName_data_common: "first",
        tableData_peopleList: [],

        processLineShow_common: false,

        pageSize: 10,
        pageIndex: 1,
        orderField: "operate_time",
        sortBy: "desc",
        recordTotal: 0,

        pageSize_shuihui: 10,
        pageIndex_shuihui: 1,
        recordTotal_shuihui: 0,

        pageSize_shuiku: 10,
        pageIndex_shuiku: 1,
        recordTotal_shuiku: 0,

        pageSize_country: 10,
        pageIndex_country: 1,
        recordTotal_country: 0,
        pageSize_dxs: 10,
        pageIndex_dxs: 1,
        recordTotal_dxs: 0,
        //通用
        pageSize_common: 10,
        pageIndex_common: 1,
        recordTotal_common: 0,
        tableData_common: [],
        //
        searchName: "",
        curId: "",
        curOrgId: "1",
        curBasin: "",
        curType: "",
        //tree
        defaultProps: {
          children: 'children',
          label: 'pnm'
        },
        treeData: [{
          id: "1",
          pnm: '全国',
          children: []
        }],
        treeData2: [{
          id: "1",
          pnm: '全国',
          children: []
        }],
        treeData3: [],
        treeData4: [{
          id: "1",
          pnm: '所有成员',
          children: []
        }],

        defaultProps3: {
          label: 'orgNm',
          children: 'children',
          // isLeaf: 'leaf'
        },

        model_peopleName: "",
        model_shuiku_finish: false,
        model_groupManager: false,
        model_peopleOnline: false,
        //
        model_shuiku_statistic: false,
        //
        model_shuihui_name: "",
        model_country_name: "",
        model_shuiku_name: "",
        model_dxs_name: "",
        //水毁
        processLineShow_shuihuiTable: false,
        tableData_shuihuiList: [],
        //shuiku
        processLineShow_shuikuTable: false,
        tableData_shuikuList: [],
        //country water
        processLineShow_countrywaterTable: false,
        processLineShow_dxsTable: false,
        tableData_countrywaterList: [],
        tableData_dxsList: [],
        //
        processLineShow_result: false,
        processLineShow_data_common: true,
        activeName_searchResult: "first",
        tableData_search_shuihui: [],
        tableData_search_country: [],
        tableData_search_dxs: [],
        tableData_search_shuiku: [],
        tableData_search_people: [],
        processLineShow_XXX: false,

        peopleDetail: null,

        pickerOptions2: {
          shortcuts: [{
            text: '最近一天',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 1);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近三天',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit('pick', [start, end]);
            }
          }]
        },
        value4: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
        value5: '',
        map_server: "http://10.1.17.61:6080/arcgis/rest/services/sqhs_xzbj_new/MapServer",
        //////////////
        tableData6: [],
        total: 0,
        dialogFormVisible: false,

        rgstrId: '',
        getObjId: '',
        YnEngId: '',
        timeInterval_people: '', //定时刷新人员位置
      }
    },
    watch: {
      // processLineShow_shuihuiTable: function () {
      //   if (this.processLineShow_shuihuiTable && this.tableData_shuihuiList.length == 0) {
      //     this.loadTableShuihui()
      //   }
      // },
      // processLineShow_shuikuTable: function () {
      //   if (this.processLineShow_shuikuTable && this.tableData_shuikuList.length == 0) {
      //     this.loadTableShuiku();
      //   }
      // },
      // processLineShow_countrywaterTable: function () {
      //   if (this.processLineShow_countrywaterTable && this.tableData_countrywaterList.length == 0) {
      //     this.loadTableCountry()
      //   }
      // },
      model_peopleName: function () {
        this.rowIndex = 0;
        this.pageSize = pageSize;
        // this.getOnlinePeoples();
        if (!this.bAdmin) {
          this.getOnlinePeoples();
        } else if (this.activeTabName == "three") {
          this.getOnlinePeoples2();
        } else {
          this.getOnlinePeoples();
        }
      },
      curId() {
        // this.loadPoint_people(point_people)
      }
    },
    computed: {
      recPersId() {
        return localStorage.getItem("userid") ? localStorage.getItem("userid") : ''
      }
    },
    mounted: function () {
      var _this = this;
      this.$nextTick(function () {
        this.createMap();
        $("#viewDiv").height($(window).height() - 91);
      })
      $(window).resize(function () {
        $("#viewDiv").height($(window).height() - 91);
      });
      let start_time = new Date();
      start_time.setTime(start_time.getTime() - 3600 * 1000 * 24 * 1);
      this.value5 = [this.formatDate(start_time, 'yyyy-MM-dd hh:mm:ss'), this.formatDate(new Date(),
        'yyyy-MM-dd hh:mm:ss')];

      this.loadTableShuihui()
      this.loadTableShuiku()
      this.loadTableCountry()
      this.loadTableDxs()
    },
    methods: {

      btnSearch() {
        console.log(this.model_search_input)
        axios.get(`/pdcApi/dc/insp/base/findAllObj`, {
            params: {
              pageNum: 1,
              pageSize: 100,
              objParam: this.model_search_input
            }
          })
          .then((res) => {
            if (res.status == 200 && res.data.data != null) {
              var objs = res.data.data;
              this.processLineShow_result = true
              this.tableData_search_shuihui = objs.attPersWtdstList.list;
              this.tableData_search_country = objs.attCwsBaseList.list;
              this.tableData_search_shuiku = objs.attPersRsList.list;
              this.tableData_search_people = objs.attPersBaseList.list;
              this.tableData_search_dxs = objs.attGrwBaseList.list; //地下水
            }
          })
      },
      loadTableShuihui() {
        axios.get(`/pdcApi/dc/insp/obj/getPageByPersId`, {
            params: {
              persGuid: localStorage.getItem("userid"),
              objType: 3,
              pageNum: this.pageIndex_shuihui,
              pageSize: this.pageSize_shuihui,
              wtdstNm: this.model_shuihui_name
            }
          })
          .then((res) => {
            console.log(res)
            if (res.status == 200 && res.data.data != null) {
              var obj = res.data.data;
              this.tableData_shuihuiList = obj.list;
              // this.tableData_common = obj.list;
              // this.recordTotal = obj.total;
              this.recordTotal_shuihui = obj.total;
            }
          })
      },
      loadTableShuiku() {
        // axios.get(`/pdcApi/dc/insp/obj/getObjByPersId`, {
        axios.get(`/pdcApi/dc/insp/obj/getPageByPersId`, {
            params: {
              persGuid: localStorage.getItem("userid"),
              objType: 1,
              pageNum: this.pageIndex_shuiku,
              pageSize: this.pageSize_shuiku,
              rsName: this.model_shuiku_name
            }
          })
          .then((res) => {
            console.log(res)
            if (res.status == 200 && res.data.data != null) {
              var obj = res.data.data;
              this.tableData_shuikuList = obj.list;
              // this.tableData_common = obj.list;
              // this.recordTotal = obj.total;
              this.recordTotal_shuiku = obj.total;
            }
          })
      },
      loadTableCountry() {
        axios.get(`/pdcApi/dc/insp/obj/getPageByPersId`, {
            params: {
              persGuid: localStorage.getItem("userid"),
              objType: 2,
              pageNum: this.pageIndex_country,
              pageSize: this.pageSize_country,
              adName: this.model_country_name
            }
          })
          .then((res) => {
            console.log(res)
            if (res.status == 200 && res.data.data != null) {
              var obj = res.data.data;
              this.tableData_countrywaterList = obj.list;
              this.tableData_common = obj.list;
              // this.recordTotal = obj.total;
              this.recordTotal_country = obj.total;
            }
          })
      },
      loadTableDxs() {
        axios.get(`/pdcApi/dc/insp/obj/getPageByPersId`, {
            params: {
              persGuid: localStorage.getItem("userid"),
              objType: 5,
              pageNum: this.pageIndex_dxs,
              pageSize: this.pageSize_dxs,
              adName: this.model_dxs_name
            }
          })
          .then((res) => {
            console.log(res)
            if (res.status == 200 && res.data.data != null) {
              var obj = res.data.data;
              this.tableData_dxsList = obj.list;
              // this.tableData_common = obj.list;
              this.recordTotal_dxs = obj.total;
            }
          })
      },
      loadTreeData3(node, resolve) {
        if (node.level === 0) {
          axios.get(`/pdcApi/pers/position/getOrgByPid?orgId=0`, {
              params: {}
            })
            .then((res) => {
              console.log("机构......", res)
              if (res.status == 200 && res.data.data != null) {
                var obj = res.data.data[0];
                var tree = [];
                obj.olBisInspOrg['orgNm'] = obj.olBisInspOrg['orgNm'] + `(${obj.onLineCount}/${obj.count})`;
                tree.push(obj.olBisInspOrg);
                return resolve(tree);
              }
            })
            .catch(function (error) {
              console.log(error);
            });

        }
        if (node.level > 1) {
          axios.get(`/pdcApi/pers/position/getOrgByPid`, {
              params: {
                orgId: "1"
              }
            })
            .then((res) => {
              console.log("机构......", res)
              if (res.status == 200 && res.data.data != null) {
                var obj = res.data.data[0];
                var tree = [];
                obj.olBisInspOrg['orgNm'] = obj.olBisInspOrg['orgNm'] + `(${obj.onLineCount}/${obj.count})`;
                tree.push(obj.olBisInspOrg);
                return resolve(tree);
              }
            })
            .catch(function (error) {
              console.log(error);
            });
          return resolve([]);
        }
      },
      toHome() {
        this.view.center = [106, 33];
        this.view.zoom = 5;
      },
      refreashOnline() {
        if (this.bAdmin) {
          this.activeTabName = "three";
          this.curOrgId = "1";
          this.initTree();
        }
        this.$message({
          message: '刷新成功！',
          type: 'success'
        });
      },
      handleTabClick(tab, event) {
        this.curNode = "1";
      },
      handleNodeClick(data) {
        console.log("handleNodeClick...........", data);
        if (data) {
          if (!this.bAdmin && data.id == "1") {
            this.curId = data.id__;
          } else {
            if (data.id == "1") {
              this.curId = "";
            } else {
              this.curId = data.id;
            }
          }
          this.getOnlinePeoples();
          // this.updatePeopleOnMap();
          this.loadPoint_people("point_people");
        }
      },
      handleNodeClick3(data) {
        console.log(data);
        if (data) {
          if (data.orgId == "1") {
            this.curOrgId = "1";
          } else {
            this.curOrgId = data.orgId;
          }
          this.curNode = data.orgId;
          this.getOnlinePeoples2();
          // this.updatePeopleOnMap();
          this.loadPoint_people("point_people");
        }
      },
      handleSizeChange: function (pageSize) {
        this.rowIndex = 0;
        this.pageSize = pageSize;
        // this.getOnlinePeoples();
        if (!this.bAdmin) {
          this.getOnlinePeoples();
        } else if (this.activeTabName == "three") {
          this.getOnlinePeoples2();
        } else {
          this.getOnlinePeoples();
        }
      },
      handleCurrentChange: function (pageNum) {
        this.rowIndex = 0;
        this.pageIndex = pageNum;
        // this.getOnlinePeoples();
        if (!this.bAdmin) {
          this.getOnlinePeoples();
        } else if (this.activeTabName == "three") {
          this.getOnlinePeoples2();
        } else {
          this.getOnlinePeoples();
        }
      },
      people_sortEvent(column, prop, order) {
        console.log(column, prop, order)
        if (column.column == null)
          return;
        // this.orderField = column.prop;
        if (column.order == "ascending") {
          this.sortBy = "asc";
        } else if (column.order == "descending") {
          this.sortBy = "desc";
        }
        this.orderField = column.prop.replace(/\B([A-Z])/g, '_$1').toLowerCase()
        if (!this.bAdmin) {
          this.getOnlinePeoples();
        } else if (this.activeTabName == "three") {
          this.getOnlinePeoples2();
        } else {
          this.getOnlinePeoples();
        }
      },
      handleSizeChange_shuihui: function (pageSize) {
        this.pageSize_shuihui = pageSize;
        this.loadTableShuihui();
      },
      handleCurrentChange_shuihui: function (pageNum) {
        this.pageIndex_shuihui = pageNum;
        this.loadTableShuihui();
      },
      handleSizeChange_country: function (pageSize) {
        this.pageSize_country = pageSize;
        this.loadTableCountry();
      },
      handleCurrentChange_country: function (pageNum) {
        this.pageIndex_country = pageNum;
        this.loadTableCountry();
      },
      handleSizeChange_dxs: function (pageSize) {
        this.pageSize_country = pageSize;
        this.loadTableDxs();
      },
      handleCurrentChange_dxs: function (pageNum) {
        this.pageIndex_country = pageNum;
        this.loadTableDxs();
      },
      handleSizeChange_shuiku: function (pageSize) {
        this.pageSize_shuiku = pageSize;
        this.loadTableShuiku();
      },
      handleCurrentChange_shuiku: function (pageNum) {
        this.pageIndex_shuiku = pageNum;
        this.loadTableShuiku();
      },
      location(index, row) {
        console.log(row)
        if (row == null)
          return
        // if (row.persPosition == null) {
        //   this.$message('暂无位置信息！');
        //   return
        // }
        var layerId = "point_peopleTrail2";
        if (this.map.findLayerById(layerId)) {
          this.map.remove(this.map.findLayerById(layerId))
        }
        // if (this.map.findLayerById(layerId)) {
        //   this.map.findLayerById(layerId).removeAll();
        // }
        if (this.timer != "") {
          clearInterval(this.timer)
        }
        this.processLineShow = false;
        this.processLineShow_people = true;
        this.getPeopleDetail(row.guid)
        axios.get(`/pdcApi/pers/position/getPersPosition`, {
            params: {
              persId: row.guid
            }
          })
          .then((res) => {
            // console.log("", res)
            var _data = res.data.data;
            if (_data != null) {
              var lon = _data.longitude;
              var lat = _data.latitude;
              this.view.center = [lon, lat];
              this.view.zoom = 6;
              esriLoader.loadModules(["esri/geometry/Point", "esri/symbols/SimpleMarkerSymbol",
                  "esri/layers/GraphicsLayer",
                  "esri/Graphic"
                ], this.options)
                .then(([Point, SimpleMarkerSymbol, GraphicsLayer, Graphic]) => {
                  let graphicLayer = this.map.findLayerById(layerId);
                  if (graphicLayer == null) {
                    graphicLayer = new GraphicsLayer();
                    graphicLayer.id = layerId;
                    this.map.reorder(graphicLayer, 500);
                    this.map.add(graphicLayer);
                  }
                  // graphicLayer.removeAll();
                  let point = new Point(lon, lat);
                  let symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 8, null, 'red');
                  var marker_Symbol = {
                    type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
                    color: [226, 119, 40],
                    outline: { // autocasts as new SimpleLineSymbol()
                      color: [255, 255, 255],
                      width: 2
                    }
                  };
                  var symbol_picture = {
                    type: "picture-marker", // autocasts as new PictureMarkerSymbol()
                    url: "/src/static/" + 'people' + ".png",
                    width: 20,
                    height: 24,
                    angle: 0
                  };
                  var symbol__ = (index == -1 ? marker_Symbol : symbol_picture);
                  _data.point_type = 1;
                  var attr = _data;
                  let graphic = new Graphic(point, symbol__, attr,
                    null);
                  let graphic2 = new Graphic(point, symbol__, attr,
                    null);
                  graphicLayer.add(graphic2);
                  graphicLayer.add(graphic);
                  this.timer = setInterval(() => {
                    graphicLayer.visible = !graphicLayer.visible;
                  }, 500);
                })
            }

          })
          .catch(function (error) {
            console.log(error);
          });
      },
      location2(lon, lat, size = 18) {
        // return
        if (lon == undefined || lon == null || lat == undefined || lat == null) {
          this.$message({
            message: '暂无位置信息！',
            type: 'warning'
          });
          return
        }

        var layerId = "point_temper";
        if (this.map.findLayerById(layerId)) {
          this.map.remove(this.map.findLayerById(layerId))
        }
        if (this.timer2 != "") {
          clearInterval(this.timer2)
        }
        this.view.center = [lon, lat];
        // this.view.zoom = 6;
        esriLoader.loadModules(["esri/geometry/Point", "esri/symbols/SimpleMarkerSymbol",
            "esri/layers/GraphicsLayer",
            "esri/Graphic"
          ], this.options)
          .then(([Point, SimpleMarkerSymbol, GraphicsLayer, Graphic]) => {
            let graphicLayer = this.map.findLayerById(layerId);
            if (graphicLayer == null) {
              graphicLayer = new GraphicsLayer();
              graphicLayer.id = layerId;
              this.map.reorder(graphicLayer, 900);
              this.map.add(graphicLayer);
            }
            let point = new Point(lon, lat);
            let symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, size, null, 'red');
            var marker_Symbol = {
              type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
              color: [255, 0, 0],
              outline: { // autocasts as new SimpleLineSymbol()
                color: [255, 255, 255],
                width: 2
              }
            };
            var symbol__ = marker_Symbol;
            let graphic = new Graphic(point, symbol, null,
              null);
            graphicLayer.add(graphic);
            this.timer2 = setInterval(() => {
              graphicLayer.visible = !graphicLayer.visible;
            }, 500);
          })
      },
      location3(index, row) {
        console.log(row)
        if (row == null)
          return
        var layerId = "point_peopleTrail2";
        if (this.map.findLayerById(layerId)) {
          this.map.remove(this.map.findLayerById(layerId))
        }
        if (this.timer != "") {
          clearInterval(this.timer)
        }
        this.processLineShow = false;
        this.processLineShow_people = true;
        this.getPeopleDetail(row.guid)
        axios.get(`/pdcApi/pers/position/getPersPosition`, {
            params: {
              persId: row.guid
            }
          })
          .then((res) => {
            var _data = res.data.data;
            if (_data != null) {
              var lon = _data.longitude;
              var lat = _data.latitude;
              this.view.center = [lon, lat];
              this.view.zoom = 6;
              esriLoader.loadModules(["esri/geometry/Point", "esri/symbols/SimpleMarkerSymbol",
                  "esri/layers/GraphicsLayer",
                  "esri/Graphic"
                ], this.options)
                .then(([Point, SimpleMarkerSymbol, GraphicsLayer, Graphic]) => {
                  let graphicLayer = this.map.findLayerById(layerId);
                  if (graphicLayer == null) {
                    graphicLayer = new GraphicsLayer();
                    graphicLayer.id = layerId;
                    this.map.reorder(graphicLayer, 500);
                    this.map.add(graphicLayer);
                  }
                  // graphicLayer.removeAll();
                  let point = new Point(lon, lat);
                  let symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 8, null, 'red');
                  var marker_Symbol = {
                    type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
                    color: [226, 119, 40],
                    outline: { // autocasts as new SimpleLineSymbol()
                      color: [255, 255, 255],
                      width: 2
                    }
                  };
                  var symbol_picture = {
                    type: "picture-marker", // autocasts as new PictureMarkerSymbol()
                    url: "/src/static/" + 'people' + ".png",
                    width: 20,
                    height: 24,
                    angle: 0
                  };
                  var symbol__ = (index == -1 ? marker_Symbol : symbol_picture);
                  _data.point_type = 1;
                  var attr = _data;
                  let graphic = new Graphic(point, symbol__, attr,
                    null);
                  let graphic2 = new Graphic(point, symbol__, attr,
                    null);
                  graphicLayer.add(graphic2);
                  graphicLayer.add(graphic);
                  this.timer = setInterval(() => {
                    graphicLayer.visible = !graphicLayer.visible;
                  }, 500);
                })
            }

          })
          .catch(function (error) {
            console.log(error);
          });
      },

      formatter_peopleType(row, column) {
        if (row.pertype == "1") {
          return "组长"
        } else if (row.pertype == "2") {
          return "水库运行管理"
        } else if (row.pertype == "3") {
          return "质量安全专家"
        } else if (row.pertype == "4") {
          return "联络员"
        } else {
          return "--"
        }
      },
      formatter_index() {
        console.log(111111)
        var ss = this.pageSize * (this.pageIndex - 1)
        return 1;
      },
      indexMethod(index) {
        return (index + 1) + this.pageSize * (this.pageIndex - 1)
      },
      indexMethod_shuiku(index) {
        return (index + 1) + this.pageSize_shuiku * (this.pageIndex_shuiku - 1)
      },
      indexMethod_shuihui(index) {
        return (index + 1) + this.pageSize_shuihui * (this.pageIndex_shuihui - 1)
      },
      indexMethod_country(index) {
        return (index + 1) + this.pageSize_country * (this.pageIndex_country - 1)
      },
      indexMethod_dxs(index) {
        return (index + 1) + this.pageSize_dxs * (this.pageIndex_dxs - 1)
      },
      formatter_peoplePhone(row, column) {
        console.log(11)
        if (row.mobilenumb) {
          return row.mobilenumb.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
        }
      },
      formatter_peopleTime(row, column) {
        if (row.persPosition) {
          return row.persPosition.operateTime || "--";
        } else {
          return "--";
        }
      },
      bGroupManager(val) {
        this.curId = "";
        this.getOnlinePeoples();
        // alert(this.model_groupManager)
      },
      bPeopleOnline(val) {
        // this.curId = "";
        if (this.activeTabName == "three") {
          this.getOnlinePeoples2();
          this.loadPoint_people("point_people");
        } else {
          this.getOnlinePeoples();
          this.loadPoint_people("point_people");
        }
      },
      bShuikuFinish(val) {
        console.log(111)
      },
      bShuikuStatistic(val) {
        if (this.model_shuiku_statistic) {
          this.loadShuikuStatistic();
          this.loadShuikuStatisticCityByCode3()
        } else {
          var layer = this.map.findLayerById("shuiku_statistic");
          var layer2 = this.map.findLayerById("shuiku_statistic_lable");

          var layer_ = this.map.findLayerById("shuiku_statistic_city");
          var layer2_ = this.map.findLayerById("shuiku_statistic_city_lable");
          if (layer != null) {
            this.map.remove(layer)
            this.map.remove(layer2)
            this.map.remove(layer_)
            this.map.remove(layer2_)
          }
        }
        return
        var layer = this.map.findLayerById("shuiku_statistic");
        var layer2 = this.map.findLayerById("shuiku_statistic_lable");
        this.map_title = "省级水库统计图";
        this.bShowTitle = this.model_shuiku_statistic;
        if (layer != null) {
          layer.visible = this.model_shuiku_statistic;
          layer2.visible = this.model_shuiku_statistic;
        } else {
          this.loadShuikuStatistic();
          // $.each(xzqData, (index, e) => {
          //   this.loadShuikuStatisticCityByCode(e.adCode)
          // })
          // this.loadShuikuStatisticCityByCode2()
          this.loadShuikuStatisticCityByCode3()
        }
      },
      setLayerVisibleById(layerId, visible) {
        var layer = this.map.findLayerById(layerId);
        if (layer != null) {
          layer.visible = visible;
        }
      },
      searchPeople(val) {
        // this.curId = "";
        if (this.activeTabName == "three") {
          // this.getOnlinePeoples(false);
          this.getOnlinePeoples2();
        } else {
          this.getOnlinePeoples();
        }
      },
      getOnlinePeoples(flag = true) {
        axios.get(`/pdcApi/pers/position/findPersListByClassify`, {
            params: {
              pageNum: this.pageIndex,
              pageSize: this.pageSize,
              count: false,
              orderBy: this.orderField + " " + this.sortBy,
              id: flag ? (this.bAdmin ? this.curId : (this.curId || "-")) : "-",
              persName: this.model_peopleName,
              // pertype: this.model_groupManager ? "1" : "",
              status: this.model_peopleOnline ? "1" : ""
            }
          })
          .then((res) => {
            console.log("人员......", res)
            if (res.status == 200 && res.data.data != null) {
              var obj = res.data.data;
              this.tableData_peopleList = obj.list;
              this.recordTotal = obj.total;
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      getOnlinePeoples2() {
        // alert()
        axios.get(`/pdcApi/pers/position/findPersListByOrgId`, {
            params: {
              pageNum: this.pageIndex,
              pageSize: this.pageSize,
              orderBy: this.orderField + " " + this.sortBy,
              orgId: this.curOrgId,
              persName: this.model_peopleName,
              status: this.model_peopleOnline ? "1" : ""
            }
          })
          .then((res) => {
            console.log("人员......", res)
            if (res.status == 200 && res.data.data != null) {
              var obj = res.data.data;
              this.tableData_peopleList = obj.list;
              this.recordTotal = obj.total;
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      updatePeopleOnMap() {
        axios.get(`/pdcApi/pers/position/findList`, {
            params: {
              // pageNum: this.pageIndex,
              // pageSize: this.pageSize,
              id: this.curId,
              persId: this.curId == "" ? "37C8098DA7C4475A9E717F700F1FB63A" : "",
            }
          })
          .then((res) => {
            console.log("人员筛选......", res)
            if (res.status == 200 && res.data.data != null) {
              var obj = res.data.data;
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      //创建地图
      createMap: function () {
        var _this = this;
        esriLoader.loadModules(["esri/Map", "esri/views/MapView", "esri/layers/WebTileLayer", "esri/layers/TileLayer",
            "esri/Basemap", "esri/layers/support/LOD", "esri/layers/MapImageLayer", "esri/widgets/ScaleBar"
          ], _this.options)
          .then(([Map, MapView, WebTileLayer, TileLayer, Basemap, LOD, MapImageLayer, ScaleBar]) => {
            var url__ = "http://10.1.17.58:6080/arcgis/rest/services/drought/MapServer";
            var url__2 = "http://10.1.17.61:6080/arcgis/rest/services/sqhs_xzbj_new/MapServer";
            var layer_tile = new TileLayer({
              id: "t_map",
              url: url__2,
              spatialReference: {
                wkid: 3857
              }
            });
            var imageLayer = {
              urlTemplate: "http://10.1.7.160:81/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX=${level}&TILEROW=${row}&TILECOL=${col}",
              id: "id_image",
            }

            var iamgeLabel = {
              urlTemplate: "http://10.1.7.160:81/sia_w/wmts?service=wmts&request=gettile&version=1.0.0&layer=sia&format=tiles&tilematrixset=w&tilecol=${col}&tilerow=${row}&tilematrix=${level}",
              id: "id_image_label",
            };

            var iamgeLabel_tdt = {
              urlTemplate: "http://t0.tianditu.gov.cn/cia_w/wmts?service=wmts&request=gettile&version=1.0.0&v=4.0&tk=66b63588d9f26d7be3394ac366a45e9f&layer=cia&format=tiles&tilematrixset=w&tilecol=${col}&tilerow=${row}&tilematrix=${level}",
              id: "id_image_label",
            };

            var iamgeLabel_tdt2 = {
              // urlTemplate: "http://t0.tianditu.gov.cn/img_w/wmts?service=wmts&request=gettile&version=1.0.0&v=4.0&tk=66b63588d9f26d7be3394ac366a45e9f&layer=img&format=tiles&tilematrixset=w&tilecol=${col}&tilerow=${row}&tilematrix=${level}",
              // id: "id_image_label2",
              urlTemplate: "http://t{subDomain}.tianditu.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&tk=66b63588d9f26d7be3394ac366a45e9f&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX=${level}&TILEROW=${row}&TILECOL=${col}",
              id: "id_image",
              subDomains: ['0', '1', '2', '3', "4", "5", "6"]
            };

            var riverWMTS = {
              urlTemplate: "http://10.1.7.160:81/dlb_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=dlb&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX=${level}&TILEROW=${row}&TILECOL=${col}",
              id: "id_River",
            };
            var riverLabel = {
              urlTemplate: "http://10.1.7.160:81/dia_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=dia&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX=${level}&TILEROW=${row}&TILECOL=${col}",
              id: "id_river_label",
            };
            let map_layer = new WebTileLayer(imageLayer);
            let map_layer2 = new WebTileLayer(iamgeLabel);
            let map_layer_tdt = new WebTileLayer(iamgeLabel_tdt);
            let map_layer_tdt2 = new WebTileLayer(iamgeLabel_tdt2);
            let map_layer_river = new WebTileLayer(riverWMTS);
            let map_layer_riverLabel = new WebTileLayer(riverLabel);
            // let map_layer = new WebTileLayer(aaa);
            var mapImageLayer = new MapImageLayer({
              url: url__2
            });
            map_layer.visible = true;
            var customBasemap = new Basemap({
              baseLayers: [map_layer],
              title: "Custom Basemap",
              id: "myBasemap"
            });
            var map = new Map({
              basemap: customBasemap,
              logo: false
            });
            _this.map = map;
            if (_this.bAdmin)
              _this.loadPoint_people("point_people");
            // _this.$store.commit('newMap', map);
            var view = new MapView({
              container: "viewDiv", // Reference to the scene div created in step 5
              map: map, // Reference to the map object created before the scene
              zoom: 4, // Sets zoom level based on level of detail (LOD)
              center: [104, 36], // Sets center point of view using longitude,latitude,
              logo: false,
            });
            _this.view = view;
            window.mapView = view;
            view.ui.remove("zoom");

            var scaleBar = new ScaleBar({
              view: view,
              unit: "metric",
              declaredClass: "my-mapScalebar"
            });
            // Add widget to the bottom left corner of the view
            view.ui.add(scaleBar, {
              position: "bottom-right"
            });

            view.when(function () {
              console.log("屏幕宽：", window.screen.width);
              console.log("屏幕高：", window.screen.height);
              // toolBar.init(map, view);
              _this.map.basemap.baseLayers.add(map_layer_tdt);
              _this.map.basemap.baseLayers.add(map_layer_river);
              _this.map.basemap.baseLayers.add(map_layer_riverLabel);
              // _this.loadPoint('point_shuihui');
              _this.loadPoint_('point_shuihui');
              _this.timeInterval_people = setInterval(() => {
                _this.loadPoint_people("point_people")
              }, 300000);
              // _this.loadPoint_people('point_people');
              _this.loadPoint_shuiku('point_shuiku');
              _this.loadPoint_dxs('point_dxs_water');
              _this.loadPoint_contry_water('point_contry_water');
              // _this.loadShuikuStatistic();
              // layer.msg("加载完成")
              // _this.$message({
              //   message: '加载完成',
              //   type: 'success'
              // });
              if (window.screen.width > 1366) {
                _this.minZoom = 5;
                view.zoom = 5;
                view.center = [106, 33];
              }
            })
            // view.ui.add(toolBar.createToolBar2(), "top-right");
            view.on("click", function (evt) {
              evt.stopPropagation();
              // console.log(evt);
              // console.log(_this.view)
              var screenPoint = {
                x: evt.x,
                y: evt.y
              };
              _this.view.hitTest(screenPoint).then((res) => {
                if (res.results.length > 0) {
                  // console.log("hit.....", res)
                  _this.showMore = false;
                  _this.processLineShow = false;
                  _this.processLineShow_country_water = false;
                  _this.processLineShow_people = false;
                  _this.processLineShow_shuiku = false;
                  var obj = res.results[0].graphic.attributes;
                  console.log('hit...', obj)
                  if (obj.point_type == 0) { //水毁
                    if (_this.showMore_sh) {
                      let height = $("#draggableContainer").height();
                      $("#draggableContainer").height(height - 200)
                      $(".drag-body-class").height(height - 200)
                      _this.showMore_sh = false;
                    }
                    _this.processLineShow_people = false;
                    _this.processLineShow = true;
                    _this.tableData2 = obj.list;
                    _this.dlg_info = obj.wtdstNm;
                    _this.curEventInfo = obj;
                    _this.curEventInfo.wtdstState = _this.curEventInfo.wtdstState == 1 ? "已完成" : "未完成";
                    for (let key in _this.curEventInfo) {
                      if (_this.curEventInfo[key] == null) {
                        _this.curEventInfo[key] = "暂无";
                      }
                    }
                  } else if (obj.point_type == 1) { //人
                    _this.processLineShow = false;
                    _this.processLineShow_people = true;
                    _this.getProblomListByPerid(obj.persId)
                    _this.getPeopleDetail(obj.persId)
                    // _this.view.center = [_this.curEventInfo_people.lon, _this.curEventInfo_people.lat];

                    _this.dlg_info_people = obj.persName;
                    _this.curEventInfo_people = obj;
                    for (let key in _this.curEventInfo_people) {
                      if (_this.curEventInfo_people[key] == null) {
                        _this.curEventInfo_people[key] = "暂无";
                      }
                    }
                  } else if (obj.point_type == 2) { //水库
                    _this.rgstrId = obj.rgstrId;
                    _this.processLineShow = false;
                    _this.processLineShow_country_water = false;
                    _this.processLineShow_people = false;
                    _this.processLineShow_shuiku = true;
                    // _this.shuikuInfo = obj;
                    request.get(`/dc/insp/rsvrRgstr/${_this.rgstrId}`).then(res => {
                      if (res.success) {
                        _this.shuikuInfo = res.data;
                        // alert(formatDateTimeD())
                        _this.shuikuInfo.resCreateTime = formatDateTime2(_this.shuikuInfo.resCreateTime)
                          .substring(0, 10);
                      }
                    }).catch(err => {

                    })
                  } else if (obj.point_type == 3) { //人饮
                    _this.processLineShow = false;
                    _this.processLineShow_shuiku = false;
                    _this.processLineShow_people = false;
                    _this.getObjId = obj.objId;
                    _this.getRyData();
                    _this.processLineShow_country_water = true;
                  } else if (obj.point_type == 5) { //水库统计
                    _this.loadShuikuPointByCode(obj);
                  } else if (obj.point_type == 6) { //地下水
                    _this.modal_dixiashui = true;
                    _this.stcd = obj.stcd;
                    _this.djbId = obj.id;
                    _this.currentObjectId = obj.objId;
                  }
                  // console.log(obj)
                }
              })
            })
            view.watch("zoom", function (e) {
              var zoom = view.zoom;
              if (zoom >= 19) {
                view.zoom = 18;
              }
              if (zoom > 6) {
                // _this.loadShuikuStatisticCityByCode('41')
                _this.setLayerVisibleById("shuiku_statistic_city", true);
                _this.setLayerVisibleById("shuiku_statistic_city_lable", true);
                _this.setLayerVisibleById("shuiku_statistic", false);
                _this.setLayerVisibleById("shuiku_statistic_lable", false);
              } else {
                _this.setLayerVisibleById("shuiku_statistic", true);
                _this.setLayerVisibleById("shuiku_statistic_lable", true);
                _this.setLayerVisibleById("shuiku_statistic_city", false);
                _this.setLayerVisibleById("shuiku_statistic_city_lable", false);
              }
              _this.minZoom = 5;
              if (view.zoom < _this.minZoom) {
                view.zoom = _this.minZoom;
                view.center = [106, 33];
                // return;
              }
              // if (toolBar.bIsMainMap && view.zoom > 11) {
              //   view.zoom = 11;
              // }
              // console.log(zoom);
              console.log("zoom...", zoom)
              if ((zoom % 1 !== 0)) {
                return;
              }

              // if (_this.lastLevel == zoom)
              //   return
              // console.log(view.zoom - 3);
              // stationLayer.zoom_ = zoom - 3;
              // _this.curMapLevel = stationLayer.zoom_;
              // stationLayer.queryStation();
              // /**/
              // toolBar.setSlider(view.zoom);
              // _this.lastLevel = zoom;
            })
          })
          .catch(err => {
            console.error(err);
          });
      },
      loadPoint: function (layerId) {
        var _this = this;
        var obj = {
          "pageNum": 1,
          "pageSize": 1000
        };
        axios({
            method: 'post',
            url: '/pdcApi/dc/insp/bisInspWtdst/queryListWithPblm',
            data: obj
          })
          .then((data_) => {
            console.log(data_)
            var name = layerId;
            esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
              "esri/layers/FeatureLayer",
              "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
              "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
            ], _this.options).then(([SimpleMarkerSymbol, Point,
              FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
            ]) => {
              var graphiclayer = new GraphicsLayer({
                id: `${name}`
              });
              graphiclayer.visible = false;
              // var graphiclayer_lb = new GraphicsLayer({
              //   id: "lable_" + level
              // });
              // _this.tableData_shuihuiList = data_.data.data.list;
              var __data = data_.data.data.list;
              $.each(__data, function (index, e) {
                if (e.wtdstLgtd == null || e.wtdstLttd == null)
                  return true
                var lgtd = e.wtdstLgtd;
                var lttd = e.wtdstLttd;
                var name = e.wtdstNm;
                var state = e.wkstate || '2';
                var pt = new Point(lgtd, lttd);
                var symbol_picture = {
                  type: "picture-marker", // autocasts as new PictureMarkerSymbol()
                  url: "/src/static/" + 'shuihui' + state + ".png",
                  width: 20,
                  height: 25,
                  angle: 0
                };
                var symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 5, null, new Color(
                  "#FF0000"));
                var marker_Symbol = {
                  type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
                  color: [226, 119, 40],
                  outline: { // autocasts as new SimpleLineSymbol()
                    color: [255, 255, 255],
                    width: 2
                  }
                };
                var textSymbol = new TextSymbol({
                  color: "black",
                  haloColor: "black",
                  haloSize: "1px",
                  text: name,
                  xoffset: 3,
                  yoffset: -10,
                  horizontalAlignment: "left",
                  kerning: true,
                  font: { // autocast as esri/symbols/Font
                    size: 9,
                    family: "system-ui",
                    // weight: "bolder"
                  }
                });
                var markerSymbol = symbol_picture;
                e.point_type = 0;
                var attr = e;
                var graphic = new Graphic(pt, markerSymbol, attr, null);
                graphiclayer.graphics.add(graphic);
                var graphic_lb = new Graphic(pt, textSymbol, null, null);
                // graphiclayer_lb.graphics.add(graphic_lb);
              })
              _this.map.add(graphiclayer);
              _this.map.reorder(graphiclayer, 100);
              // toolBar.map.add(graphiclayer_lb);
              // layer.msg("加载完成")
            })
          });
      },
      loadPoint_: function (layerId) {
        var _this = this;
        axios.get(`/pdcApi/dc/insp/obj/getObjByPersId`, {
            params: {
              persGuid: localStorage.getItem("userid"),
              objType: 3
            }
          })
          .then((data_) => {
            console.log(data_)
            var name = layerId;
            esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
              "esri/layers/FeatureLayer",
              "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
              "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
            ], _this.options).then(([SimpleMarkerSymbol, Point,
              FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
            ]) => {
              var graphiclayer = new GraphicsLayer({
                id: `${name}`
              });
              graphiclayer.visible = false;
              // var graphiclayer_lb = new GraphicsLayer({
              //   id: "lable_" + level
              // });
              // _this.tableData_shuihuiList = data_.data.data.list;
              var __data = data_.data.data;
              $.each(__data, function (index, e) {
                if (e.lgtd == null || e.lttd == null)
                  return true
                var lgtd = e.lgtd;
                var lttd = e.lttd;
                var name = e.wtdstNm;
                var state = e.wtdstState || '2';
                var pt = new Point(lgtd, lttd);
                var symbol_picture = {
                  type: "picture-marker", // autocasts as new PictureMarkerSymbol()
                  url: "/src/static/" + 'shuihui' + state + ".png",
                  width: 20,
                  height: 25,
                  angle: 0
                };
                var symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 5, null, new Color(
                  "#FF0000"));
                var marker_Symbol = {
                  type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
                  color: [226, 119, 40],
                  outline: { // autocasts as new SimpleLineSymbol()
                    color: [255, 255, 255],
                    width: 2
                  }
                };
                var textSymbol = new TextSymbol({
                  color: "black",
                  haloColor: "black",
                  haloSize: "1px",
                  text: name,
                  xoffset: 3,
                  yoffset: -10,
                  horizontalAlignment: "left",
                  kerning: true,
                  font: { // autocast as esri/symbols/Font
                    size: 9,
                    family: "system-ui",
                    // weight: "bolder"
                  }
                });
                var markerSymbol = symbol_picture;
                e.point_type = 0;
                var attr = e;
                var graphic = new Graphic(pt, markerSymbol, attr, null);
                graphiclayer.graphics.add(graphic);
                var graphic_lb = new Graphic(pt, textSymbol, null, null);
                // graphiclayer_lb.graphics.add(graphic_lb);
              })
              _this.map.add(graphiclayer);
              _this.map.reorder(graphiclayer, 100);
              // toolBar.map.add(graphiclayer_lb);
              // layer.msg("加载完成")
            })
          });
      },
      loadPoint_people: function (layerId) {
        var _this = this;
        // if (this.map.findLayerById(layerId)) {
        //   this.map.findLayerById(layerId).removeAll();
        //   this.map.remove(this.map.findLayerById(layerId))
        // }
        // if (this.map.findLayerById(layerId)) {
        //   this.map.findLayerById(layerId).removeAll();
        //   this.map.remove(this.map.findLayerById(layerId))
        // }
        var params_ = {};
        if (this.activeTabName == "three") {
          params_ = {
            orgId: this.curOrgId,
            // persId: this.curId == "" ? "37C8098DA7C4475A9E717F700F1FB63A" : ""
          }
        } else {
          params_ = {
            id: this.curId,
            // persId: localStorage.getItem("userid")
          }
        }
        axios.get(`/pdcApi/pers/position/findList`, {
            // axios.get(`/src/static/point_people.json`, {
            params: params_
          })
          .then(function (response) {
            if (response.status == 200) {
              if (_this.map.findLayerById(layerId)) {
                _this.map.findLayerById(layerId).removeAll();
                _this.map.remove(_this.map.findLayerById(layerId))
              }
              if (_this.map.findLayerById(layerId)) {
                _this.map.findLayerById(layerId).removeAll();
                _this.map.remove(_this.map.findLayerById(layerId))
              }
              var data_ = response.data;
              console.log(data_)
              var name = layerId;
              esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
                "esri/layers/FeatureLayer",
                "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
                "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
              ], _this.options).then(([SimpleMarkerSymbol, Point,
                FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
              ]) => {
                //
                var graphiclayer = new GraphicsLayer({
                  id: `${name}`
                });
                var graphiclayer_temp = new GraphicsLayer({
                  id: `map_layer_temp`
                });
                // var graphiclayer_lb = new GraphicsLayer({
                //   id: "lable_" + level
                // });
                $.each(data_.data, function (index, e) {
                  if (e.latitude == null || e.longitude == null)
                    return true
                  if (_this.model_peopleOnline && e.status == "0")
                    return true;
                  var picName = "xhuser_hgy";
                  if (e.status == "1") {
                    picName = "xhuser_hgy";
                  } else if (e.status == "0") {
                    picName = "offline";
                  }
                  var lgtd = e.longitude;
                  var lttd = e.latitude;
                  var name = e.persName;
                  var pt = new Point(lgtd, lttd);
                  var symbol_picture = {
                    type: "picture-marker", // autocasts as new PictureMarkerSymbol()
                    url: "/src/static/" + picName + ".png",
                    width: 20,
                    height: 24,
                    angle: 0
                  };
                  var symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 5, null, new Color(
                    "#FF0000"));
                  var marker_Symbol = {
                    type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
                    color: [226, 119, 40],
                    outline: { // autocasts as new SimpleLineSymbol()
                      color: [255, 255, 255],
                      width: 2
                    }
                  };
                  var textSymbol = new TextSymbol({
                    color: "black",
                    haloColor: "black",
                    haloSize: "1px",
                    text: name,
                    xoffset: 3,
                    yoffset: -10,
                    horizontalAlignment: "left",
                    kerning: true,
                    font: { // autocast as esri/symbols/Font
                      size: 9,
                      family: "system-ui",
                      // weight: "bolder"
                    }
                  });
                  var markerSymbol = symbol_picture;
                  e.point_type = 1;
                  var attr = e;
                  var graphic = new Graphic(pt, markerSymbol, attr, null);
                  graphiclayer.graphics.add(graphic);
                  var graphic_lb = new Graphic(pt, textSymbol, null, null);
                  // graphiclayer_lb.graphics.add(graphic_lb);
                })
                _this.map.add(graphiclayer);
                _this.map.add(graphiclayer_temp);
                _this.map.reorder(graphiclayer, 20);
                // toolBar.map.add(graphiclayer_lb);
                // layer.msg("加载完成")
              })
            }
          })
          .catch(function (error) {
            console.log(error);
          });
        return

        $.ajax({
          type: 'get',
          dataType: "json",
          // url: `/pdcApi/dc/insp/bisInspWtdst/queryListWithPblm`,
          url: `./static/json/point_people.json`,
          data: {},
          success: function (data_) {
            console.log(data_)
            var name = "point_people";
            esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
              "esri/layers/FeatureLayer",
              "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
              "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
            ], _this.options).then(([SimpleMarkerSymbol, Point,
              FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
            ]) => {
              //
              var graphiclayer = new GraphicsLayer({
                id: `${name}_0`
              });
              // var graphiclayer_lb = new GraphicsLayer({
              //   id: "lable_" + level
              // });
              $.each(data_.data, function (index, e) {
                if (e.wtdstLgtd == null || e.wtdstLttd == null)
                  return true
                var lgtd = e.wtdstLgtd;
                var lttd = e.wtdstLttd;
                var name = e.wtdstNm;
                var pt = new Point(parseInt(lgtd), parseInt(lttd));
                var symbol_picture = {
                  type: "picture-marker", // autocasts as new PictureMarkerSymbol()
                  url: "/src/static/" + 'shuihui_p' + ".png",
                  width: 9,
                  height: 9,
                  angle: 0
                };
                var symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 5, null, new Color(
                  "#FF0000"));
                var marker_Symbol = {
                  type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
                  color: [226, 119, 40],
                  outline: { // autocasts as new SimpleLineSymbol()
                    color: [255, 255, 255],
                    width: 2
                  }
                };
                var textSymbol = new TextSymbol({
                  color: "black",
                  haloColor: "black",
                  haloSize: "1px",
                  text: name,
                  xoffset: 3,
                  yoffset: -10,
                  horizontalAlignment: "left",
                  kerning: true,
                  font: { // autocast as esri/symbols/Font
                    size: 9,
                    family: "system-ui",
                    // weight: "bolder"
                  }
                });
                var markerSymbol = symbol_picture;
                var attr = e;
                var graphic = new Graphic(pt, markerSymbol, attr, null);
                graphiclayer.graphics.add(graphic);
                var graphic_lb = new Graphic(pt, textSymbol, null, null);
                // graphiclayer_lb.graphics.add(graphic_lb);
              })
              _this.map.add(graphiclayer);
              _this.map.reorder(graphiclayer, 100);
              // toolBar.map.add(graphiclayer_lb);
              // layer.msg("加载完成")
            })
          },
          error: function (data) {}
        })
      },
      loadPoint_dxs: function (layerId) {
        var _this = this;
        // axios.post(`/pdcApi/dc/insp/base/getPageRsvrList`, {
        axios.get(`/pdcApi/dc/insp/obj/getObjByPersId`, {
            // this.$axios.get(`./static/json/point_people.json`, {
            params: {
              persGuid: localStorage.getItem("userid"),
              objType: 5
            }
          })
          .then(function (response) {
            if (response.status == 200) {
              var data_ = response.data;
              console.log("dxs......", data_)
              var name = layerId;
              // return
              esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
                "esri/layers/FeatureLayer",
                "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
                "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
              ], _this.options).then(([SimpleMarkerSymbol, Point,
                FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
              ]) => {
                var graphiclayer = new GraphicsLayer({
                  id: `${name}`
                });
                graphiclayer.visible = false;
                // var graphiclayer_lb = new GraphicsLayer({
                //   id: "lable_" + level
                // });
                $.each(data_.data, function (index, e) {
                  if (e.lgtdPc == null || e.lttdPc == null)
                    return true
                  var lgtd = e.lgtdPc;
                  var lttd = e.lttdPc;
                  var name = e.stnm;
                  var pt = new Point(lgtd, lttd);
                  var symbol_picture = {
                    type: "picture-marker", // autocasts as new PictureMarkerSymbol()
                    url: "/src/static/" + 'dxs' + ".png",
                    width: 20,
                    height: 24,
                    angle: 0
                  };


                  var markerSymbol = symbol_picture;
                  e.point_type = 6; //地下水
                  var attr = e;
                  var graphic = new Graphic(pt, markerSymbol, attr, null);
                  graphiclayer.graphics.add(graphic);
                })
                _this.map.add(graphiclayer);
                _this.map.reorder(graphiclayer, 100);
                // toolBar.map.add(graphiclayer_lb);
                // layer.msg("加载完成")
              })
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      loadPoint_shuiku: function (layerId) {
        var _this = this;
        // axios.post(`/pdcApi/dc/insp/base/getPageRsvrList`, {
        axios.get(`/pdcApi/dc/insp/obj/getObjByPersId`, {
            // this.$axios.get(`./static/json/point_people.json`, {
            params: {
              persGuid: localStorage.getItem("userid"),
              objType: 1
            }
          })
          .then(function (response) {
            if (response.status == 200) {
              var data_ = response.data;
              console.log("shuiku......", data_)
              var name = layerId;
              // return
              esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
                "esri/layers/FeatureLayer",
                "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
                "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
              ], _this.options).then(([SimpleMarkerSymbol, Point,
                FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
              ]) => {
                var graphiclayer = new GraphicsLayer({
                  id: `${name}`
                });
                graphiclayer.visible = false;
                // var graphiclayer_lb = new GraphicsLayer({
                //   id: "lable_" + level
                // });
                $.each(data_.data, function (index, e) {
                  if (e.longitude == null || e.latitude == null)
                    return true
                  var lgtd = e.longitude;
                  var lttd = e.latitude;
                  var name = e.nm;
                  var pt = new Point(lgtd, lttd);
                  var symbol_picture = {
                    type: "picture-marker", // autocasts as new PictureMarkerSymbol()
                    url: "/src/static/" + 'shuiku0' + ".png",
                    width: 20,
                    height: 24,
                    angle: 0
                  };
                  var symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 5, null, new Color(
                    "#FF0000"));
                  var marker_Symbol = {
                    type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
                    color: [226, 119, 40],
                    outline: { // autocasts as new SimpleLineSymbol()
                      color: [255, 255, 255],
                      width: 2
                    }
                  };
                  var textSymbol = new TextSymbol({
                    color: "black",
                    haloColor: "black",
                    haloSize: "1px",
                    text: name,
                    xoffset: 3,
                    yoffset: -10,
                    horizontalAlignment: "left",
                    kerning: true,
                    font: { // autocast as esri/symbols/Font
                      size: 9,
                      family: "system-ui",
                      // weight: "bolder"
                    }
                  });
                  var markerSymbol = symbol_picture;
                  e.point_type = 2;
                  var attr = e;
                  var graphic = new Graphic(pt, markerSymbol, attr, null);
                  graphiclayer.graphics.add(graphic);
                  var graphic_lb = new Graphic(pt, textSymbol, null, null);
                  // graphiclayer_lb.graphics.add(graphic_lb);
                })
                _this.map.add(graphiclayer);
                _this.map.reorder(graphiclayer, 100);
                // toolBar.map.add(graphiclayer_lb);
                // layer.msg("加载完成")
              })
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      loadPoint_shuiku2(points, layerId = 'point_shuiku') {
        var _this = this;
        if (this.map.findLayerById(layerId)) {
          // this.map.remove(this.map.findLayerById(layerId))
          this.map.findLayerById(layerId).visible = false;
        }
        var name = layerId + "_temp";
        if (this.map.findLayerById(name)) {
          this.map.remove(this.map.findLayerById(name))
        }
        // this.view.zoom = 12;
        esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
          "esri/layers/FeatureLayer",
          "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
          "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
        ], _this.options).then(([SimpleMarkerSymbol, Point,
          FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
        ]) => {
          var graphiclayer = new GraphicsLayer({
            id: `${name}`
          });
          graphiclayer.visible = true;
          // var graphiclayer_lb = new GraphicsLayer({
          //   id: "lable_" + level
          // });
          $.each(points, function (index, e) {
            var lgtd = e.lgtd;
            var lttd = e.lttd;
            if (lgtd == null || lttd == null)
              return true
            var name = e.nm;
            var pt = new Point(lgtd, lttd);
            var symbol_picture = {
              type: "picture-marker", // autocasts as new PictureMarkerSymbol()
              url: "/src/static/" + 'shuiku0' + ".png",
              width: 16,
              height: 20,
              angle: 0
            };
            var symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 5, null, new Color(
              "#FF0000"));
            var marker_Symbol = {
              type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
              color: [226, 119, 40],
              outline: { // autocasts as new SimpleLineSymbol()
                color: [255, 255, 255],
                width: 2
              }
            };
            var textSymbol = new TextSymbol({
              color: "black",
              haloColor: "black",
              haloSize: "1px",
              text: name,
              xoffset: 3,
              yoffset: -10,
              horizontalAlignment: "left",
              kerning: true,
              font: { // autocast as esri/symbols/Font
                size: 9,
                family: "system-ui",
                // weight: "bolder"
              }
            });
            var markerSymbol = symbol_picture;
            e.point_type = 2;
            var attr = e;
            var graphic = new Graphic(pt, markerSymbol, attr, null);
            graphiclayer.graphics.add(graphic);
            var graphic_lb = new Graphic(pt, textSymbol, null, null);
            // graphiclayer_lb.graphics.add(graphic_lb);
          })
          _this.map.add(graphiclayer);
          _this.map.reorder(graphiclayer, 100);

          // toolBar.map.add(graphiclayer_lb);
          // layer.msg("加载完成")
        })
      },
      loadPoint_contry_water: function (layerId) {
        var _this = this;
        // axios.post(`/pdcApi/dc/insp/base/getPageCwsList`, {
        axios.get(`/pdcApi/dc/insp/obj/getObjByPersId`, {
            // this.$axios.get(`./static/json/point_people.json`, {
            params: {
              persGuid: localStorage.getItem("userid"),
              objType: 2
            }
          })
          .then(function (response) {
            if (response.status == 200) {
              var data_ = response.data;
              console.log("contry_water......", data_)
              var name = layerId;
              esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
                "esri/layers/FeatureLayer",
                "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
                "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
              ], _this.options).then(([SimpleMarkerSymbol, Point,
                FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
              ]) => {
                //
                var graphiclayer = new GraphicsLayer({
                  id: `${name}`
                });
                graphiclayer.visible = false;
                // var graphiclayer_lb = new GraphicsLayer({
                //   id: "lable_" + level
                // });
                $.each(data_.data, function (index, e) {
                  if (e.lgtd == null || e.lttd == null)
                    return true
                  // var lgtd = (e.lowLeftLong + e.upRightLong) / 2;
                  // var lttd = (e.lowLeftLat + e.upRightLat) / 2;
                  var lgtd = e.lgtd;
                  var lttd = e.lttd;
                  var name = e.nm;
                  var pt = new Point(lgtd, lttd);
                  var symbol_picture = {
                    type: "picture-marker", // autocasts as new PictureMarkerSymbol()
                    url: "/src/static/" + 'country3' + ".png",
                    width: 20,
                    height: 24,
                    angle: 0
                  };
                  var symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 5, null, new Color(
                    "#FF0000"));
                  var marker_Symbol = {
                    type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
                    color: [226, 0, 0],
                    outline: { // autocasts as new SimpleLineSymbol()
                      color: [255, 255, 255],
                      width: 2
                    }
                  };
                  var textSymbol = new TextSymbol({
                    color: "black",
                    haloColor: "black",
                    haloSize: "1px",
                    text: name,
                    xoffset: 3,
                    yoffset: -10,
                    horizontalAlignment: "left",
                    kerning: true,
                    font: { // autocast as esri/symbols/Font
                      size: 9,
                      family: "system-ui",
                      // weight: "bolder"
                    }
                  });
                  var markerSymbol = symbol_picture;
                  e.point_type = 3;
                  var attr = e;
                  var graphic = new Graphic(pt, markerSymbol, attr, null);
                  graphiclayer.graphics.add(graphic);
                  var graphic_lb = new Graphic(pt, textSymbol, null, null);
                  // graphiclayer_lb.graphics.add(graphic_lb);
                })
                _this.map.add(graphiclayer);
                _this.map.reorder(graphiclayer, 100);
                // toolBar.map.add(graphiclayer_lb);
                // layer.msg("加载完成")
              })
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      closeModal() {
        this.processLineShow = false
      },
      closeModal_people() {
        this.processLineShow_people = false
        if (this.map.findLayerById("polyline_people")) {
          this.map.findLayerById("polyline_people").removeAll();
          this.map.reorder("polyline_people", 100);
        }
        if (this.map.findLayerById("point_peopleTrail")) {
          this.map.findLayerById("point_peopleTrail").removeAll();
          this.map.reorder("point_peopleTrail", 100);
        }
      },
      closeModal_peopleTrail() {
        this.processLineShow_peopleTrail = false;
      },
      closeModal_peopleTable() {
        this.processLineShow_peopleTable = false;
      },
      closeModal_shuihuiTable() {
        this.processLineShow_shuihuiTable = false;
      },
      closeModal_countrywaterTable() {
        this.processLineShow_countrywaterTable = false;
      },
      closeModal_dxsTable() {
        this.processLineShow_dxsTable = false;
      },
      closeModal_shuikuTable() {
        this.processLineShow_shuikuTable = false;
      },
      closeModal_result() {
        this.processLineShow_result = false;
      },
      closeModal_data_common() {
        this.processLineShow_data_common = false;

      },
      closeModal_XXX() {
        this.processLineShow_XXX = false;
      },
      closeModal_common() {
        this.processLineShow_common = false;
      },
      handleClick(row) {
        this.showMore_sh = true;
      },
      handleClick_people(row) {
        console.log(row);
        if (row) {
          this.listEventClick(row.pblmId);
        }
        // this.dialogInfo2 = true;
      },
      handleClick_searchResult(tab, event) {

      },
      getProblomListByPerid(perid) {
        var _this = this;
        axios.post(`/pdcApi/dc/insp/pblm/list/${perid}`, {
            // axios.get(`/src/static/point_people.json`, {
            params: {}
          })
          .then(function (response) {
            if (response.status == 200) {
              var data_ = response.data;
              console.log(data_)
              _this.tableData5 = []
              _this.tableData5 = data_.data.list;
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      getPeopleDetail(perid) {
        var _this = this;
        axios.post(`/pdcApi/QRCode/${perid}`, {
            params: {}
          })
          .then(function (response) {
            if (response.status == 200) {
              var data_ = response.data;
              console.log("people...", data_)
              _this.peopleDetail = data_.data;
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      //xiangqing
      closeDraggable: function () {
        this.showEventProcess = false;
      },
      //点击上报事件 详情  弹出事件详情框
      listEventClick(proId) {
        // this.showEventProcess = true;
        // return
        axios.get(`/pdcApi/dc/insp/pblm/${proId}`).then((res) => {
          this.eventDetailObj = res.data.data;
          if (this.eventDetailObj) {
            this.eventDetailObj.imageUrlArray = [];
            $.each(this.eventDetailObj.gwComFiles, (index, e) => {
              this.eventDetailObj.imageUrlArray.push({
                imgsrc: "/pdcApi" + e.filePath
              })
            })
            console.log("pic,,,", this.eventDetailObj.imageUrlArray);
            this.showEventProcess = true;
          }
        })
      },

      timestampToTime(row, column) {
        var date = new Date(row.collTime)
        var Y = date.getFullYear() + '-'
        var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : '0' + date.getMonth() + 1) + '-'
        var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '
        var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
        var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
        return Y + M + D + h + m
      },

      processState(row, column) {
        return row.pblmStat == '1' ? "已上报" : "未上报";
      },

      peopleTrail(id, bDraw = true) {
        var _this = this;
        console.log(this.value5)
        if (this.value5 == "") {
          this.$message({
            message: '请选择轨迹时间范围！',
            type: 'warning'
          });
          return
        }
        axios.get(`/pdcApi/pers/position/findListByPersId`, {
            // this.$axios.get(`./static/json/point_people_trail.json`, {
            params: {
              pageNum: 1,
              pageSize: 10,
              operateTimeFrom: this.value5[0],
              operateTimeTo: this.value5[1],
              count: 0,
              persId: id,
              //  "56c9f61a563543e685d63c600bcee438"
            }
          })
          .then(function (response) {
            if (response.status == 200) {
              if (_this.map.findLayerById("polyline_people")) {
                _this.map.findLayerById("polyline_people").removeAll();
              }
              if (_this.map.findLayerById("point_peopleTrail")) {
                _this.map.findLayerById("point_peopleTrail").removeAll();
              }
              var data_ = response.data;
              console.log("轨迹......", data_)
              var name = "polyline_people";
              esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
                "esri/layers/FeatureLayer",
                "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
                "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
              ], _this.options).then(([SimpleMarkerSymbol, Point,
                FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
              ]) => {
                var graphiclayer = _this.map.findLayerById(name);
                if (!graphiclayer) {
                  graphiclayer = new GraphicsLayer({
                    id: `${name}`
                  });
                }
                // var coords = [[116.358073,39.888671],[116.30205729,39.82487917]];
                var coords = [];
                // _this.loadPoint_peopleTrail(data_.data);
                _this.tableData_peopleTrail = data_.data;
                if (!bDraw) {
                  _this.processLineShow_peopleTrail = !_this.processLineShow_peopleTrail;
                  return
                }

                // _this.processLineShow_peopleTrail = true;
                // return
                var points = [];
                $.each(data_.data, function (index, e) {
                  if (e.longitude == null || e.latitude == null)
                    return true

                  var lgtd = e.longitude;
                  var lttd = e.latitude;
                  var name = e.persName;

                  if (index != 0) {
                    var a = data_.data[index - 1];
                    var lastPoint = new Point(a.longitude, a.latitude);
                    var curPoint = new Point(lgtd, lttd);
                    var ss = lastPoint.distance(curPoint);
                    if (parseFloat(ss) < 0.0001 && data_.data.length != (index + 1)) {
                      return true
                    }
                    // console.log("distance.....", ss)
                  }

                  var rightPoint = new Point(lgtd, lttd);
                  points.push(rightPoint);

                  coords.push([lgtd, lttd]);
                })

                _this.loadPoint_peopleTrail2(points);


                var polyline = {
                  type: "polyline", // autocasts as new Polyline()
                  paths: coords
                };

                var lineSymbol = {
                  type: "simple-line", // autocasts as SimpleLineSymbol()
                  color: [226, 119, 40],
                  width: 4,
                  // style: "short-dot"
                };

                var lineAtt = {
                  Name: "Keystone Pipeline",
                  Owner: "TransCanada",
                  Length: "3,456 km"
                };

                var polylineGraphic = new Graphic({
                  geometry: polyline,
                  symbol: lineSymbol,
                  attributes: lineAtt,
                });
                graphiclayer.add(polylineGraphic);
                _this.map.add(graphiclayer);
                _this.map.reorder(graphiclayer, 100);
                _this.view.extent = polylineGraphic.geometry.extent;
                _this.view.zoom = _this.view.zoom - 1;
              })
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      loadPoint_peopleTrail: function (points) {
        //
        var _this = this;
        var name = "point_peopleTrail";
        esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
          "esri/layers/FeatureLayer",
          "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
          "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
        ], _this.options).then(([SimpleMarkerSymbol, Point,
          FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
        ]) => {
          var graphiclayer = _this.map.findLayerById(name);
          if (!graphiclayer) {
            graphiclayer = new GraphicsLayer({
              id: `${name}`
            });
          }
          var startLon = 0;
          var startLat = 0;
          $.each(points, function (index, e) {
            if (e.longitude == null || e.latitude == null)
              return true
            var lgtd = e.longitude;
            var lttd = e.latitude;
            var name = e.persName;

            if (index != 0) {
              var a = points[index - 1];
              var lastPoint = new Point(a.longitude, a.latitude);
              var curPoint = new Point(lgtd, lttd);
              var ss = lastPoint.distance(curPoint);

              if (parseFloat(ss) < 0.0010 && points.length != (index + 1)) {
                return true
              }
              console.log("distance.....", ss)
            }
            var pt = new Point(lgtd, lttd);
            var symbol_picture = {
              type: "picture-marker", // autocasts as new PictureMarkerSymbol()
              url: "/src/static/" + 'dis' + ".png",
              width: 23,
              height: 23,
              angle: 0
            };

            var marker_Symbol = {
              type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
              color: [0, 0, 255],
              outline: { // autocasts as new SimpleLineSymbol()
                color: [255, 255, 255],
                width: 2
              }
            };
            var marker_Symbol2 = {
              type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
              color: [0, 255, 0],
              outline: { // autocasts as new SimpleLineSymbol()
                color: [255, 255, 255],
                width: 2
              }
            };
            var markerSymbol = null;
            if (points.length == (index + 1)) {
              markerSymbol = symbol_picture;
            } else if (index == 0) {
              markerSymbol = marker_Symbol2;
            } else {
              markerSymbol = marker_Symbol;
            }
            // e.point_type = 2;
            var attr = e;
            var graphic = new Graphic(pt, markerSymbol, attr, null);
            graphiclayer.graphics.add(graphic);
            // var graphic_lb = new Graphic(pt, textSymbol, null, null);
          })
          _this.map.add(graphiclayer);
          _this.map.reorder(graphiclayer, 200);
        })
      },
      loadPoint_peopleTrail2: function (points) {
        var _this = this;
        var name = "point_peopleTrail";
        esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
          "esri/layers/FeatureLayer",
          "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
          "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer", "esri/geometry/Multipoint"
        ], _this.options).then(([SimpleMarkerSymbol, Point,
          FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer, Multipoint
        ]) => {
          var graphiclayer = _this.map.findLayerById(name);
          if (!graphiclayer) {
            graphiclayer = new GraphicsLayer({
              id: `${name}`
            });
          }

          var symbol_picture = {
            type: "picture-marker", // autocasts as new PictureMarkerSymbol()
            url: "/src/static/" + 'dis' + ".png",
            width: 23,
            height: 23,
            angle: 0
          };
          var marker_Symbol = {
            type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
            color: [0, 0, 255],
            size:5,
            outline: { // autocasts as new SimpleLineSymbol()
              color: [255, 255, 255],
              width: 1
            }
          };
          var marker_Symbol2 = {
            type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
            color: [0, 255, 0],
            outline: { // autocasts as new SimpleLineSymbol()
              color: [255, 255, 255],
              width: 2
            }
          };
          $.each(points, function (index, e) {
            if (e.longitude == null || e.latitude == null)
              return true
            var markerSymbol = null;
            if (points.length == (index + 1)) {
              markerSymbol = symbol_picture;
            } else if (index == 0) {
              markerSymbol = marker_Symbol2;
            } else {
              markerSymbol = marker_Symbol;
            }
            var graphic = new Graphic(e, markerSymbol, null, null);
            graphiclayer.graphics.add(graphic);
          })
          var first_graphic = new Graphic(points[0], marker_Symbol2, null, null);
          graphiclayer.graphics.add(first_graphic);
          _this.map.add(graphiclayer);
          _this.map.reorder(graphiclayer, 200);
        })
      },
      mytest(params) {
        console.log('layer....', params)
        if (typeof params === 'boolean') {
          this.model_shuiku_statistic = params;
          this.bShuikuStatistic()
        } else {
          if (parseInt(params[1])) {
            this.activeName_data_common = params[3]
            this.processLineShow_data_common = true;
          }
          var layer = this.map.findLayerById(params[0]);
          if (layer != null) {
            layer.visible = (parseInt(params[1]) ? true : false);
            this[params[2]] = (parseInt(params[1]) ? true : false);
          }
        }
      },

      shifouRadio(val) {
        if (val == "1") {
          return "是";
        } else if (val == "2" || val == "0") {
          return "否";
        }
      },
      youwuRadio(val) {
        if (val == "1") {
          return "有";
        } else if (val == "2" || val == "0") {
          return "无";
        }
      },
      // 人饮关闭
      closeModal_country_water() {
        this.processLineShow_country_water = false;
      },
      //  水库关闭
      closeModal_shuiku() {
        this.processLineShow_shuiku = false;
      },
      closeDraggable_shxq() {
        this.showMore_sh = false;
      },
      //地下水关闭
      closeModal_dixiashui() {
        this.modal_dixiashui = false;
      },

      nyhandleChange(val) {
        if (val == '1') {
          this.getNysgcData()

        }
      },
      skhandleChange(val) {
        if (val == '1') {
          this.sxjbyq = {
            "rgstrId": "",
            'recPersId': "",
            "emerPlanSameExta": "",
            "emerPlanSameAppr": "",
            "emerPlanSameEme": "",
            "emerPlanSameSpeed": "",
            "schPlanSameExta": "",
            "schPlanSameAppr": "",
            "schPlanSameSpeed": "",
            "rainForc": "",
          };
          request.get(`/dc/insp/baseExt/get/${this.rgstrId}`).then(res => {
            if (res.data) {
              this.sxjbyq = res.data;
              // alert(formatDateTimeD())
            }
          }).catch(err => {

          })

        } else if (val == '2') {
          this.sgzrr = {
            "dutyId": '',
            "hasPatrolPers": "", //是否有巡查责任人
            "hasTechPers": "", //是否有技术责任人
            "hasWiunWaoLegPers": "", //是否有行政责任人
            "patrolPers": "", //巡查责任人姓名
            "patrolPersDuty": "", //巡查责任人职务
            "patrolPersResu": "", //巡查责任人履职情况 0  1  2
            "patrolPersTel": "", //巡查责任人电话
            "rgstrId": "", //水库督查登记ID
            "techPers": "", //技术责任人姓名
            "techPersDuty": "", //技术责任人职务
            "techPersResu": "", //技术责任人履职情况
            "techPersTel": "", //技术责任人电话
            "wiunWaoLegPers": "", //行政责任人姓名
            "wiunWaoLegPersDuty": "", //行政责任人职务
            "wiunWaoLegPersResu": "", //行政责任人履职情况
            "wiunWaoLegPersTel": "", //行政责任人电话
          };
          request.get(`/dc/insp/basePres/get/${this.rgstrId}`).then(res => {
            if (res.data) {
              this.sgzrr = res.data;
            }
          }).catch(err => {

          })

        } else if (val == '3') {
          this.skgcst = {
            "mngrnId": '',
            "rgstrId": '',
            "recPersId": '',
            "safeCommontNote": '',
            "safeComment": "",
            "retainRegular": '',
            "hasRetainRegular": '',
            "hasWdEmnic": '',
            "hasManagePers": '',
            "hasSpeManage": '',
            "noRetainRegular": '',
            "canNotRetainWater": '',
            "dikeHasLeak": '',
            "leakMakeSafe": '',
            "hasAstable": '',
            "hasSetMainFl": '',
            "isMainFlNormal": '',
            "hasSetPourFl": '',
            "pourFyIsNormal": '',
            "havFlLowLimLev": '',
            "gtFlLowLimLev": '',
            "extDamSafeAppr": '',
            "ifReinForce": '',
            "ifComplateAccAll": '',
            "ifManageRegRel": '',
            "manageRegRelNote": '',
            "ifDamWarnLogo": '',
            "recPers2": '',
            "recPersTel": '',
            "status": '',
          };
          request.get(`/dc/insp/safeExtManage/get/${this.rgstrId}`).then(res => {
            if (res.data) {
              this.skgcst = res.data;
            }
          }).catch(err => {

          })

        } else if (val == '4') {
          this.zfqkData = [];
          request.get(`/dc/insp/baseView/get/${this.rgstrId}`).then(res => {
            let obj = res.data;
            if (obj) {
              this.zfqkData.push(obj)
            }
          }).catch(err => {

          })
        } else if (val == '5') {
          this.wtqdData = [];
          request.get(`/dc/insp/rsvrRgstr/list/${this.rgstrId}`).then(res => {
            let obj = res.data.list;
            if (obj) {
              this.wtqdData.push(obj[0]);

            }
          }).catch(err => {

          })
        }
        console.log(val);
      },
      clearTempData() {
        var layerId = "point_peopleTrail2";
        if (this.map.findLayerById(layerId)) {
          this.map.findLayerById(layerId).removeAll();
        }
        layerId = "point_temper";
        if (this.map.findLayerById(layerId)) {
          this.map.remove(this.map.findLayerById(layerId))
        }
        layerId = "point_shuiku_temp";
        if (this.map.findLayerById(layerId)) {
          this.map.remove(this.map.findLayerById(layerId))
        }
        layerId = "map_layer_temp";
        if (this.map.findLayerById(layerId)) {
          this.map.remove(this.map.findLayerById(layerId))
        }
      },
      transData(objs, idStr, pidStr, chindrenStr) {
        var a = objs;
        var r = [],
          hash = {},
          id = idStr,
          pid = pidStr,
          children = chindrenStr,
          i = 0,
          j = 0,
          len = a.length;
        for (; i < len; i++) {
          hash[a[i][id]] = a[i];
        }
        for (; j < len; j++) {
          var aVal = a[j],
            hashVP = hash[aVal[pid]];
          if (hashVP) {
            !hashVP[children] && (hashVP[children] = []);
            hashVP[children].push(aVal);
          } else {
            r.push(aVal);
          }
        }
        return r;
      },
      formatDate(date_, format) {
        var date = {
          "M+": date_.getMonth() + 1,
          "d+": date_.getDate(),
          "h+": date_.getHours(),
          "m+": date_.getMinutes(),
          "s+": date_.getSeconds(),
          "q+": Math.floor((date_.getMonth() + 3) / 3),
          "S+": date_.getMilliseconds()
        };
        if (/(y+)/i.test(format)) {
          format = format.replace(RegExp.$1, (date_.getFullYear() + '').substr(4 - RegExp.$1.length));
        }
        for (var k in date) {
          if (new RegExp("(" + k + ")").test(format)) {
            format = format.replace(RegExp.$1, RegExp.$1.length == 1 ?
              date[k] : ("00" + date[k]).substr(("" + date[k]).length));
          }
        }
        return format;
      },
      getDistance(lat1, lng1, lat2, lng2) {
        var radLat1 = lat1 * Math.PI / 180.0;
        var radLat2 = lat2 * Math.PI / 180.0;
        var a = radLat1 - radLat2;
        var b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0;
        var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) +
          Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
        s = s * 6378.137; // EARTH_RADIUS;
        s = Math.round(s * 10000) / 10000;
        return s;
      },
      formatter_coordinateX(row, column) {
        if (row.longitude) {
          return row.longitude.toFixed(4)
        }
      },
      formatter_coordinateY(row, column) {
        if (row.latitude) {
          return row.latitude.toFixed(4)
        }
      },
      formatter_shuihui_type(row, column) {
        if (row.wtdstState == 0) {
          return "未完成"
        } else if (row.wtdstState == 1) {
          return "处理中"
        } else if (row.wtdstState == 2) {
          return "已完成"
        }
      },
      formatter_shuiku_type(row, column) {
        switch (row.rsType) {
          case "1":
            return "山丘水库"
            break;
          case "2":
            return "平原水库"
            break;
          case "3":
            return "地下水库"
            break;
          default:
            return "--"
            break;
        }
      },
      formatter_shuiku_pro_type(row, column) {
        switch (row.engScal) {
          case "1":
            return "大(1)型"
            break;
          case "2":
            return "大(2)型"
            break;
          case "3":
            return "中型"
            break;
          case "4":
            return "小(1)型"
            break;
          case "5":
            return "小(2)型"
            break;
          default:
            return "其它"
            break;
        }
      },
      formatEngScal(val) {
        switch (val) {
          case '1':
            val = '大（1）型';
            break;
          case '2':
            val = '大（2）型';
            break;
          case '3':
            val = '中型';
            break;
          case '4':
            val = '小（1）型';
            break;
          case '5':
            val = '小（2）型';
            break;
          case '9':
            val = '其他';
            break;
        }
        return val;
      },
      formatdamType(val) {
        switch (val) {
          case '1':
            val = '混凝土坝';
            break;
          case '2':
            val = '碾压混凝土坝';
            break;
          case '3':
            val = '浆砌石坝';
            break;
          case '4':
            val = '土坝';
            break;
          case '5':
            val = '堆石坝';
            break;
          case '6':
            val = '挡水坝';
            break;
          case '7':
            val = '其它';
            break;
        }
        return val;
      },
      formatter_country_xzqh(row, column) {
        switch (row.adGrad) {
          case "1":
            return "中国"
            break;
          case "2":
            return "省级"
            break;
          case "3":
            return "市级"
            break;
          case "4":
            return "县级"
            break;
          case "5":
            return "乡级"
            break;
          case "6":
            return "乡级"
            break;
          default:
            return "--"
            break;
        }
      },
      peopleTrailRowClick(row, column, event) {
        // row.guid = row.persId;
        // this.location(-1, row)
        this.location2(row.longitude, row.latitude)
      },
      loadShuikuStatistic() {
        axios.get(`/pdcApi/dc/att/rsBase/getRsCountByAdCode?adCode=000000000000&adGrad=2`, {
            params: {}
          })
          .then((res) => {
            if (res.status == 200 && res.data.data != undefined) {
              // console.log("统计。。。。。", res)
              this.loadShuikuStatisticPoint(xzqData, res.data.data, "shuiku_statistic");
              setTimeout(() => {
                this.toHome();
              }, 500)
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      loadShuikuStatisticPoint(data_, StatisData = [], layerId = "shuiku_statistic", visible = true) {
        // console.log("xzqData.............................", xzqData)
        var _this = this;
        var name = layerId;
        esriLoader.loadModules(["esri/symbols/SimpleMarkerSymbol", "esri/geometry/Point",
          "esri/layers/FeatureLayer",
          "esri/layers/support/LabelClass", "esri/symbols/TextSymbol",
          "esri/Color", "esri/Graphic", "esri/layers/GraphicsLayer"
        ], _this.options).then(([SimpleMarkerSymbol, Point,
          FeatureLayer, LabelClass, TextSymbol, Color, Graphic, GraphicsLayer
        ]) => {
          //
          var graphiclayer = null;
          var graphiclayer_lb = null;
          if (this.map.findLayerById(name)) {
            graphiclayer = this.map.findLayerById(name)
            graphiclayer_lb = this.map.findLayerById(name + "_lable")
          } else {
            graphiclayer = new GraphicsLayer({
              id: `${name}`
            });
            graphiclayer_lb = new GraphicsLayer({
              id: name + "_lable"
            });
          }
          graphiclayer.visible = visible;
          // var graphiclayer_lb = new GraphicsLayer({
          //   id: name + "_lable"
          // });
          graphiclayer_lb.visible = visible;
          $.each(data_, function (index, e) {
            var lgtd = e.x;
            var lttd = e.y;
            if (lgtd == null || lttd == null)
              return true
            if (StatisData.length != 0) {
              e.total = 0;
            }
            $.each(StatisData, (index2, e2) => {
              if (e2.adCode == e.adCode) {
                e.total = e2.rsCount;
                return false;
              }
            })
            var name = e.adName;
            var pt = new Point(lgtd, lttd);
            var symbol_picture = {
              type: "picture-marker", // autocasts as new PictureMarkerSymbol()
              url: "/src/static/" + 'info4' + ".png",
              width: 37,
              height: 20,
              angle: 0
            };
            var symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 5, null, new Color(
              "#FF0000"));
            var marker_Symbol = {
              type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
              color: [226, 119, 40],
              outline: { // autocasts as new SimpleLineSymbol()
                color: [255, 255, 255],
                width: 2
              }
            };
            var textSymbol = new TextSymbol({
              color: "#f3eda9",
              haloColor: "black",
              haloSize: "1px",
              text: e.total,
              // xoffset: '16px',
              yoffset: '-4px',
              horizontalAlignment: "center",
              kerning: true,
              font: { // autocast as esri/symbols/Font
                size: 10,
                family: "system-ui",
                weight: "bolder",
              }
            });
            var markerSymbol = symbol_picture;
            e.point_type = 5; //水库统计
            // e.total = 998;
            var attr = e;
            var graphic = new Graphic(pt, markerSymbol, attr, null);
            graphiclayer.graphics.add(graphic);
            var graphic_lb = new Graphic(pt, textSymbol, attr, null);
            graphiclayer_lb.graphics.add(graphic_lb);
          })
          _this.map.add(graphiclayer);
          _this.map.reorder(graphiclayer, 100);
          _this.map.add(graphiclayer_lb);
          _this.map.reorder(graphiclayer_lb, 600);
          // setTimeout(() => {
          //   _this.toHome();
          // }, 500)
          // layer.msg("加载完成")
        })
        // $.each(xzqData, (index, e) => {})
      },
      loadShuikuPointByCodeTable(obj) {
        axios({
          method: 'post',
          url: '/pdcApi/dc/insp/base/getPageRsvrList',
          data: {
            "addvcd": obj.adCode.substr(0, 2),
            "engScal": "",
            "name": "",
            "orderby": "",
            "pageNum": this.pageIndex_shuiku,
            "pageSize": this.pageSize_shuiku,
            "persid": "",
            "ptype": "",
            "rsAdmDep": "",
            "type": ""
          }
        }).then((res) => {
          console.log("bycodeTable。。。。。", res)
          if (res.status == 200 && res.data.data) {
            var objs = res.data.data;
          }
        })
      },
      loadShuikuPointByCode(obj) {
        var code = "";
        if (obj.adGrad == "1") {
          code = obj.adCode.substr(0, 2);
          this.view.center = [obj.x, obj.y];
          this.view.zoom = 7;
          return
        } else if (obj.adGrad == "2") {
          code = obj.adCode.substr(0, 4);
        }
        // this.loadShuikuStatisticCityByCode(obj.adCode.substr(0, 6))
        // return
        axios({
          method: 'post',
          url: '/pdcApi/dc/insp/base/getRsvrList',
          data: {
            "addvcd": code, //obj.adCode.substr(0, 2),
            "engScal": "",
            "name": "",
            "orderby": "",
            "pageNum": 0,
            "pageSize": 0,
            "persid": "",
            "ptype": "",
            "rsAdmDep": "",
            "type": ""
          }
        }).then((res) => {
          console.log("bycode。。。。。", res)
          if (res.status == 200 && res.data.data) {
            var objs = res.data.data;
            this.loadPoint_shuiku2(objs);
            this.tableHeaders_XXX = [{
              fieldName: "code",
              aliasName: "编码",
              width: 120
            }, {
              fieldName: "nm",
              aliasName: "名称",
              width: 110
            }, {
              fieldName: "locat",
              aliasName: "位置",
              width: 120
            }]
            this.tableData_XXX = objs;
            this.processLineShow_XXX = true;
          }
        })
        this.loadShuikuPointByCodeTable(obj);
        this.getBound(obj.adCode.substr(0, 6));
      },
      searchByName(type) {
        if (type == 1) {
          this.loadTableShuihui();
        } else if (type == 3) {
          this.loadTableShuiku();
        } else if (type == 2) {
          this.loadTableCountry();
        } else if (type == 5) {
          this.loadTableDxs();
        }
      },
      regionChange(data) {
        console.log(data);
        if (data.area) {
          this.getBound(data.area.key);
        } else
        if (data.city) {
          this.getBound(data.city.key);
        } else
        if (data.province) {
          this.getBound(data.province.key);
        }
        // this.getBound();
      },
      getBound(addvcd) {

        //获取边界
        var _this = this;
        if (addvcd) {
          esriLoader.loadModules(["esri/geometry/Point", "esri/tasks/QueryTask", "esri/tasks/support/Query",
              "esri/layers/GraphicsLayer", "esri/Graphic"
            ], _this.options)
            .then(([Point, QueryTask, Query, GraphicsLayer, Graphic]) => {
              // var mapPoint = new Point({
              //   x: x,
              //   y: y
              // });
              let graphicLayer = _this.map.findLayerById("map_layer_temp");
              if (graphicLayer == null) {
                graphicLayer = new GraphicsLayer();
                graphicLayer.id = "map_layer_temp";
                _this.map.reorder(graphicLayer, 500);
                _this.map.add(graphicLayer);
              }
              graphicLayer.removeAll();

              var query = new Query();
              // query.geometry = mapPoint;
              query.where = `CODE = '${addvcd}' and 1=1`;
              // query.spatialRelationship = "within"
              query.outFields = ["CODE", "NAME"];
              query.returnGeometry = true;
              var sub = ""
              if (addvcd.substring(2, 6) == '0000') { //省
                sub = "/3";
              } else if (addvcd.substring(4, 6) == '00') {
                sub = "/5";
              } else {
                sub = "/4";
              }
              var queryTask = new QueryTask(_this.map_server + sub);
              queryTask.execute(query).then(function (result) {

                // console.log("geo......", result)
                if (result.features.length == 0) return;
                var feature = result.features[0]
                var CODE = feature.attributes.CODE.toString();
                var prov = feature.attributes.NAME.toString();
                var polylineSymbol = {
                  type: "simple-line", // autocasts as SimpleLineSymbol()
                  color: 'red',
                  width: 2
                };
                _this.polylineGraphic = new Graphic({
                  geometry: feature.geometry,
                  symbol: polylineSymbol,
                });
                _this.view.extent = feature.geometry.extent;
                _this.view.zoom = _this.view.zoom - 1;
                graphicLayer.add(_this.polylineGraphic);
              });
            })
        }
      },
      loadShuikuStatisticCityByCode(code) {
        esriLoader.loadModules(["esri/geometry/Point", "esri/tasks/QueryTask", "esri/tasks/support/Query",
            "esri/layers/GraphicsLayer", "esri/Graphic"
          ], this.options)
          .then(([Point, QueryTask, Query, GraphicsLayer, Graphic]) => {
            var query = new Query();
            query.where = `CODE like '${code.substr(0,2)}%' and 1=1`;
            query.outFields = ["CODE", "NAME", "CapitalX", "CapitalY"];
            query.returnGeometry = false;
            var queryTask = new QueryTask(this.map_server + '/5');
            queryTask.execute(query).then((result) => {
              console.log("attr......", result)
              if (result.features.length == 0) return;
              var xzq = [];
              $.each(result.features, (index, e) => {
                var attr = e.attributes;
                var obj = {
                  'adCode': attr.CODE,
                  'adName': attr.NAME,
                  'adGrad': '2',
                  'x': attr.CapitalX,
                  'y': attr.CapitalY
                }
                xzq.push(obj);
              });

              // this.loadShuikuStatisticPoint(xzq, [], 'shuiku_statistic_city', false)

              $.ajax({
                url: '/pdcApi/dc/att/rsBase/getRsCountByAdCode',
                type: 'get', //GET
                async: false, //或false,是否异步
                data: {
                  adCode: code
                },
                dataType: 'json', //返回的数据格式：
                success: function (data) {
                  console.log("shuiku........." + index, data)
                  this.loadShuikuStatisticPoint(xzq, [], 'shuiku_statistic_city', false)
                },
                error: function (xhr, textStatus) {},
              })

              // await axios.get(`/pdcApi/dc/att/rsBase/getRsCountByAdCode`, {
              //     params: {
              //       adCode: code
              //     }
              //   })
              //   .then((res) => {
              //     if (res.status == 200 && res.data.data != undefined) {
              //       this.loadShuikuStatisticPoint(xzq, [], 'shuiku_statistic_city', false)
              //     }
              //   })
              //   .catch(function (error) {
              //     console.log(error);
              //   });
            })
          })
      },
      loadShuikuStatisticCityByCode2() {
        var xzq = [];
        $.each(xzqCity, (index, e) => {
          var attr = e.attributes;
          var obj = {
            'adCode': attr.CODE,
            'adName': attr.NAME,
            'adGrad': '2',
            'x': attr.CapitalX,
            'y': attr.CapitalY,
          }
          xzq.push(obj);
        });
        this.loadShuikuStatisticPoint(xzq, [], 'shuiku_statistic_city', false)
      },
      loadShuikuStatisticCityByCode3() {
        axios.get(`/pdcApi/dc/att/rsBase/getRsCountByAdCode?adCode=000000000000&adGrad=3`, {
            params: {}
          })
          .then((res) => {
            if (res.status == 200 && res.data.data != undefined) {
              var xzq = [];
              $.each(res.data.data, (index, e) => {
                var attr = e;
                var obj = {
                  'adCode': attr.adCode,
                  'adName': attr.adName,
                  'adGrad': '2',
                  'x': attr.lgtd,
                  'y': attr.lttd,
                  'total': attr.rsCount
                }
                if (attr.rsCount != null) {
                  xzq.push(obj);
                }
              });
              this.loadShuikuStatisticPoint(xzq, [], 'shuiku_statistic_city', false)
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
      initTree() {
        // this.getOnlinePeoples();
        if (this.bAdmin) {
          this.curOrgId = "1";
          this.getOnlinePeoples2();
        } else {
          // 权限
          axios.get(`/pdcApi/pers/position/findNodeByPersId`, {
              params: {
                persId: localStorage.getItem("userid")
              }
            })
            .then((res) => {
              console.log("权限....", res);
              if (res.status == 200 && res.data.data != undefined) {
                // console.log("机构。。。。", res)
                $.each(res.data.data, (index, e) => {
                  e.pnm = e.pnm + `(${e.onLineCount}/${e.count})`
                })
                var trData = this.transData(res.data.data, 'id', 'pid', 'children');
                var total = 0;
                var onlineTotal = 0;
                var id = "";
                $.each(trData, (index, e) => {
                  total += e.count;
                  onlineTotal += e.onLineCount;
                  id += `${e.id},`;
                })
                id = id.substring(0, id.length - 1);
                this.treeData4[0].children = trData;
                this.treeData4[0].id__ = id;
                this.treeData4[0].pnm = this.treeData4[0].pnm + `(${onlineTotal}/${total})`;
                console.log("权限tree。。。。", this.treeData4)
                console.log("权限root-id。。。。", id)
                this.curId = id || '-';
                //
                this.loadPoint_people('point_people')
                if (!this.bAdmin)
                  this.getOnlinePeoples();
              }
            })
            .catch(function (error) {
              console.log(error);
            });
          // this.getOnlinePeoples();
        }
        //流域
        // axios.get(`/pdcApi/pers/position/findClassify`, {
        //     params: {
        //       type: 2
        //     }
        //   })
        //   .then((res) => {
        //     // console.log("流域......", res)
        //     if (res.status == 200) {
        //       this.treeData[0].children = res.data.data;
        //       var total = 0;
        //       var total2 = 0;
        //       $.each(this.treeData[0].children, (index, e) => {
        //         e.pnm = `${e.pnm}(${e.onLineCount}/${e.count})`;
        //         total += e.count;
        //         total2 += e.onLineCount;
        //       })
        //       this.treeData[0].pnm = `${this.treeData[0].pnm}(${total2}/${total})`;
        //     }

        //   })
        //   .catch(function (error) {
        //     console.log(error);
        //   });
        //专项
        axios.get(`/pdcApi/pers/position/findClassify`, {
            params: {
              type: 1
            }
          })
          .then((res) => {
            if (res.status == 200) {
              this.treeData2 = [{
                id: "1",
                pnm: '全国',
                children: []
              }]
              this.treeData2[0].children = res.data.data;
              var total = 0;
              var total2 = 0;
              $.each(this.treeData2[0].children, (index, e) => {
                e.pnm = `${e.pnm}(${e.onLineCount}/${e.count})`;
                total += e.count;
                total2 += e.onLineCount;
              })
              this.treeData2[0].pnm = `${this.treeData2[0].pnm}(${total2}/${total})`;
            }
          })
          .catch(function (error) {
            console.log(error);
          });

        //机构
        axios.get(`/pdcApi/pers/position/findOrgList`, {
            params: {}
          })
          .then((res) => {
            if (res.status == 200 && res.data.data != undefined) {
              console.log("机构。。。。", res)
              $.each(res.data.data, (index, e) => {
                e.orgNm = e.orgNm + `(${e.onLineCount}/${e.count})`
              })
              var trData = this.transData(res.data.data, 'orgId', 'orgPid', 'children');
              // console.log("机构tree。。。。", trData)
              this.treeData3 = trData;
            }
          })
          .catch(function (error) {
            console.log(error);
          });

      },
      /****/



      getRyData() {
        getTableId_ny(this.getObjId, this.recPersId).then((res) => {
          this.YnEngId = res.data.engId;
          this.getRygcData();
        })
      },
      getRygcData() {
        let getObj = {
          engId: this.YnEngId
        };
        request.post(`/dc/insp/manageResponsibility/queryListByPage`, getObj).then((res) => {
          console.log(res);
          this.countryWaterInfo = {
            recPersId: '',
            adCode: '',
            personAmount: '',
            focusSupplyPerc: '',
            waterSupplyPerc: '',
            isGovRes: '',
            isConRes: '',
            isDeptRes: '',
            isCntyDept: '',
            isCntyFunc: '',
            isCntyFee: '',
            isQuailtyChk: '',
            pracFee: '',
            visitDate: '',
            visitorIds: '',
            status: '',
            recPers2: '',
            recPersTel: '',
            accompany: '',
            mngrId: ''
          };
          if (res.data.list.length) {
            this.countryWaterInfo = res.data.list[0];
          }
        }).catch(function (error) {
          console.log(error);
        });
      },
      getNysgcData() {
        request.post(`/dc/insp/vlgdrinkProjManage/queryListByPage`, {
            pageNum: this.pageIndex,
            pageSize: this.pageSize,
            engId: this.YnEngId
          })
          .then(res => {
            if (res.success) {
              var obj = res.data;
              this.tableData6 = obj.list;
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      },
    },
    beforeMount() {
      axios.defaults.headers.common['persId'] = localStorage.getItem("userid");
      axios.defaults.headers.common['orgId'] = localStorage.getItem("orgId");
      this.bAdmin = localStorage.getItem("isAdmin") == 1 ? true : false;
      this.activeTabName = this.bAdmin ? "three" : "fourth";
      this.initTree();
    },

  }

</script>

<style scoped>
  #viewDiv {
    height: 100%;
    overflow-y: auto;
  }

  .ivu-row {
    text-align: left;
  }

  .text {
    font-size: 14px;
  }

  .item {
    margin-bottom: 5px;
  }

</style>
<style>
  .text {
    font-size: 14px;
  }

  .kjr-card .box-card {
    width: 480px;
  }

  #kjrmap .el-input.is-disabled .el-input__inner {
    width: 220px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: rgba(51, 51, 51, 1);
    background: rgba(255, 255, 255, 1);
    border: 1px solid rgba(0, 105, 213, 1);
    border-radius: 4px;
    font-size: 14px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: rgba(51, 51, 51, 1);
  }

  #kjrmap .nywater2 .el-input.is-disabled .el-input__inner {
    width: 180px;
  }

  #kjrmap .el-textarea.is-disabled .el-textarea__inner {
    width: 593px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: rgba(51, 51, 51, 1);
    background: rgba(255, 255, 255, 1);
    border: 1px solid rgba(0, 105, 213, 1);
    border-radius: 4px;
  }

  #kjrmap .process_line {
    /* width: 30%; */
    /* padding-left: 20px; */
    border-radius: 8px;
    overflow: hidden;
    text-align: left;
  }

  #kjrmap .process_line .el-input {
    width: 0;
  }

  #kjrmap .process_line .el-pagination .el-input {
    width: 100px !important;
  }

  #kjrmap .process_line .input2 .el-input {
    width: 160px;
  }

  #kjrmap .process_line .title {
    font-size: 16px;
    font-family: PingFang-SC-Bold;
    font-weight: bold;
    color: rgba(0, 156, 238, 1);
    /* border-left: 4px solid rgba(0, 156, 238, 1); */
    padding-left: 5px;
  }

  #kjrmap .el-dialog__header {
    padding: 16px 14px !important;
    background-color: #d9edff;
    text-align: center;
    border-bottom: solid 1px #aec2d4;
    color: black;
  }

  #kjrmap .el-dialog__headerbtn .el-dialog__close {
    color: #333 !important;
    font-size: 30px;
    margin-top: -5px;
  }

  #kjrmap .el-dialog__body {
    background-color: #fff;
    padding: 10px 20px;
  }

  #kjrmap .process_line .item {
    margin-bottom: 0px;
    margin-top: 5px;
  }

  #kjrmap .process_line .content {
    width: 100%;
    /* height: 227px; */
    overflow-y: auto;
    /* background-color: aqua; */
  }

  #kjrmap .process_line .content4 {
    display: inline-block;
    width: 100%;
    /* height: 110px; */
    overflow-y: auto;
    /* margin-bottom: 32px; */
    /* border: 1px solid #dddddd; */
    padding-bottom: 8px;
    /*margin-left: 30px;*/
  }

  #kjrmap .process_line .content6 {
    display: inline-block;
    width: 25%;
    /*height: 310px;*/
    overflow-y: auto;
    /* margin-bottom: 32px; */
    border: 1px solid #dddddd;
    margin-bottom: 6px;
  }

  #kjrmap .process_line .content3 {
    width: 100%;
    height: 127px;
    overflow-y: auto;
    /* background-color: aqua; */
  }

  #kjrmap .process_line .content2 {
    width: 100%;
    height: 400px;
    overflow-y: auto;
    /* background-color: aqua; */
  }

  #kjrmap .process_line .item2 {
    /* margin: 20px 30px; */
    margin-top: 10px;
    /*width: 34%;*/
    display: inline-block;
  }

  #kjrmap .process_line .item_sk {
    /* margin: 20px 30px; */
    margin-top: 10px;
    width: 34%;
    display: inline-block;
  }

  #kjrmap .process_line .item5,
  #kjrmap .process_line .item6 {
    /* margin: 20px 30px; */
    margin-top: 10px;
    width: 49%;
    display: inline-block;
  }

  #kjrmap .process_line .item5 .label {
    width: 160px !important;
  }

  #kjrmap .process_line .item6 .label {
    width: 260px !important;
  }

  #kjrmap .process_line .item2 .label2 {
    /*text-decoration: underline;*/
  }

  #kjrmap .process_line .item .label5 {
    display: inline-block;
    width: 100px;
    text-align: right;
    /*font-size: 14px;*/
    /*font-family: PingFang-SC-Bold;*/
    /*font-weight: bold;*/
    font-size: 14px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: rgba(102, 102, 102, 1);
  }

  #kjrmap .process_line .item .label {
    display: inline-block;
    width: 80px;
    text-align: right;
    font-size: 14px;
    font-family: PingFang-SC-Bold;
    font-weight: 700;
    color: #333;
  }

  #kjrmap .process_line .item .label {
    /*display: inline-block;*/
    /*width: 150px;*/
    /*text-align: right;*/
    /*font-size: 14px;*/
    /*font-family: MicrosoftYaHei;*/
    /*font-weight: 400;*/
    /*color: rgba(102,102,102,1);*/
  }

  #kjrmap .process_line .item .label2 {
    font-size: 14px;
  }

  #kjrmap .process_line .item .label2 {
    font-size: 13px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: rgba(51, 51, 51, 1);
  }

  #kjrmap .process_line .item .tags {
    display: inline-block;
  }

  #kjrmap .process_line .item .tags span {
    padding: 6px 15px;
    margin-right: 10px;
    font-size: 14px;
    color: #666;
    text-align: center;
    border: solid 1px #0096ff;
    border-radius: 3px;
  }

  #kjrmap .process_line .el-input__inner {
    border-color: #007eff;
  }

  #kjrmap .process_line .dialog-footer {
    width: 30%;
    margin: 0 auto;
    padding-top: 10px;
    display: flex;
    justify-content: space-around;
    text-align: center;
  }



  #kjrmap .eventInfo-panel {
    position: absolute;
    top: 150px;
    right: 0px;
    width: 400px;
    height: 300px;
    background-color: aqua;
  }

  #kjrmap .eventInfo-panel .title {
    position: relative;
    width: 100%;
    height: 35px;
    background-color: rgb(197, 203, 238);
    font-size: 20px;
  }

  #kjrmap .eventInfo-panel .title span {
    display: table-cell;
    vertical-align: middle;
    text-align: center
  }

  #kjrmap .eventInfo-panel .content {
    position: relative;
    width: 100%;
    height: 300px;
    background-color: rgb(230, 238, 238);
  }

  #kjrmap .el-table th>.cell {
    font-size: 14px;
    font-family: MicrosoftYaHei-Bold;
    font-weight: bold;
    color: rgba(51, 51, 51, 1);
  }

  #kjrmap .el-collapse-item__header {
    font-size: 14px;
    font-family: MicrosoftYaHei-Bold;
    font-weight: bold;
    color: rgba(51, 51, 51, 1);
    text-indent: 25px;
    background: rgba(246, 248, 251, 1);
    box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
  }

  #kjrmap .box-card {
    width: 100%;
    height: 100px;
    /*text-align: center;*/
    margin-bottom: 5px;
    /* position: relative; */
    /* left: 5vh; */
    display: inline-block;
    font-size: 14px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: rgba(51, 51, 51, 1);
  }

  #kjrmap .nywater1 .box-card {
    width: 49%;
    height: 140px;
    text-align: left;
  }

  #kjrmap .nywater2 .box-card {
    width: 49%;
    height: 240px;
    text-align: left;
  }

  #kjrmap .box-card .span100 {
    display: inline-block;
    width: 105px;
    text-align: right;
  }

  #kjrmap .nywater1 .box-card .span100,
  #kjrmap .nywater2 .box-card .span100 {
    display: inline-block;
    width: 160px;
    text-align: right;
  }

  #kjrmap .nywater2 .box-card .span100 {
    display: inline-block;
    width: 140px;
    text-align: right;
  }

  #kjrmap .box-card .span110 {
    display: inline-block;
    width: 126px;
    text-align: right;
  }

  #kjrmap .box-card .span150 {
    display: inline-block;
    width: 150px;
    text-align: right;
  }

  #kjrmap .el-card__header {
    padding: 5px 10px;
  }

  #kjrmap .box-card .el-input {
    width: 110px;
  }

  #kjrmap .box-card .el-input__inner {
    border-color: #FFFFFF;
  }

  #kjrmap .kjr-input .el-input__inner {
    border-color: #ccc;
  }

  #kjrmap .people-table .el-checkbox__input.is-checked+.el-checkbox__label {
    color: #ecf5ff !important;

  }

  #kjrmap .people-table .el-checkbox__label {
    color: #ecf5ff !important;
  }

  #kjrmap .btn-toolbar .btn-group img:HOVER {
    border: 1px solid #000;
    background-color: skyblue;
  }

  #kjrmap .toolbarSelected {
    /**工具栏按钮选中的样式**/
    border: 1px solid #000;
    background-color: skyblue;
  }

  #kjrmap .node-treeViewDiv {
    color: #2e2e2e;
  }

  #kjrmap .node-searchResultDiv {
    color: #2e2e2e;
  }

  #kjrmap .el-tabs--border-card {
    height: 480px !important;
  }

  #kjrmap .el-tabs--border-card>.el-tabs__content {
    padding: 6px !important;
  }

  #kjrmap .el-tree-node>.el-tree-node__children {
    overflow-x: auto !important;
  }

  .btn-toolbar>.btn,
  .btn-toolbar>.btn-group,
  .btn-toolbar>.input-group {
    margin-left: 1px;
  }

  .tal {
    text-align: left;
    padding-left: 10px;
  }

  .mt10 {
    margin-top: 10px;
  }

  #kjrmap .el-card__body {
    padding: 10px;
  }

  #kjrmap .el-card__body .el-tabs__nav-scroll {
    background-color: #d4e5f7;
    padding: 0px 16px;
  }

  #kjrmap .zrr .el-input.is-disabled .el-input__inner {
    width: 110px;
    padding: 0 0 0 10px;
  }

  #kjrmap .mr0 .el-radio {
    /*color: #606266;*/
    /*font-weight: 500;*/
    /*line-height: 1;*/
    /*cursor: pointer;*/
    /*white-space: nowrap;*/
    /*outline: 0;*/
    margin-right: 0 !important;
  }

  #kjrmap .esri-scale-bar__line {
    background-color: white !important;
  }

  .esri-scale-bar__line--top:before,
  .esri-scale-bar__line--top:after,
  .esri-scale-bar__line--bottom:before,
  .esri-scale-bar__line--bottom:after {
    background-color: white !important;
  }

  #kjrmap .esri-scale-bar__label {
    color: white !important;
  }

  /* #kjrmap .esri-ui-bottom-right {
    z-index: 9999 !important;
  }

  #kjrmap .esri-ui-bottom-right {
    position: absolute !important;
    right: 2px !important;
    bottom: 67px !important;
  } */

  /* #kjrmap .el-table--border th,
  .el-table__fixed-right-patch {
    background: rgba(240, 240, 240, 1);
    box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1), 0px 1px 0px 0px rgba(0, 0, 0, 0.1), -1px 0px 0px 0px rgba(0, 0, 0, 0.1);
  } */

  .layer-control {
    z-index: 2000;
    position: absolute;
    left: 0px;
    width: 900px;
    height: 100px;
    bottom: 0px;
  }

  .layer-control2 {
    z-index: 2000;
    position: absolute;
    left: 0px;
    width: 100px;
    height: 100px;
    bottom: 0px;
  }

  .map-search-input {
    z-index: 2000;
    position: absolute;
    left: 10px;
  }

  .map-search-input .el-input-group,
  .map-search-input .el-input {
    width: 220px !important;
  }

  .map-search-input .el-input-group--append .el-input__inner {
    background-color: rgba(0, 0, 0, .1) !important;
    color: white !important;
  }


  .map-search-input .el-input-group__append {
    background-color: rgba(0, 0, 0, .2) !important;
    color: white !important;
  }

  .map-title {
    z-index: 2000;
    margin-top: 20px;
    font-size: 18px;
    color: white;
    position: absolute;
    text-align: center;
    left: 600px;
    width: calc(100% - 1200px);
    font-weight: bold;
    font-size: 22px;
    /* left: 300px; */
  }

  .map-toolBar {
    z-index: 2000;
    position: absolute;
    right: 10px;
    top: 110px;
    border: 1px solid rgba(255, 255, 255, 0.32);
    padding: 0px 12px;
    padding-top: 5px;
    border-radius: 7px;
    background-color: #3232325c;
  }

  .map-toolBar img {
    cursor: pointer;
    width: 27px;
    height: 27px;
  }

  .rg-default-btn {
    padding: 3px 16px !important;
  }

  .layer-legend .tips {
    position: absolute;
    top: 100px;
    /* bottom: 50px; */
    /* left: 516px; */
    right: 10px;
    font-size: 18px;
    color: #fff;
    text-align: left;
    line-height: 30px;
    background-color: rgba(0, 0, 0, .1);
    padding: 6px;
    border-radius: 8px;
  }

  /* .layer-legend .tips p {
    display: inline-flex;
    margin-right: 20px;
  } */

  .layer-legend .tips p img {
    margin-right: 20px;
  }

  .layer-legend .tips span {
    font-size: 14px;
  }

  .layer-table {
    position: absolute;
    top: 120px;
    left: 100px;
    z-index: 2000;
    height: 600px;
    width: 700px;
    /* background-color: blue; */
  }

  .people-table {
    z-index: 2000;
    position: absolute;
    right: 50px;
    /* width: 900px; */
    /* height: 100px; */
    bottom: 10px;
    padding: 4px;
    background-color: rgba(146, 137, 137, 0.4);
    border-radius: 5px;
  }


  .el-row {
    margin-bottom: 20px;

    &:last-child {
      margin-bottom: 0;
    }
  }

  .el-col {
    border-radius: 4px;
  }

  .bg-purple-dark {
    /* background: #99a9bf; */
  }

  .bg-purple {
    /* background: #d3dce6; */
  }

  .bg-purple-light {
    /* background: #e5e9f2; */
  }

  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }

  .row-bg {
    padding: 10px 0;
    /* background-color: #f9fafc; */
  }

  .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
    background-color: #c6def9 !important;
  }


  .el-carousel__item h3 {
    color: #475669;
    font-size: 18px;
    opacity: 0.75;
    line-height: 300px;
    margin: 0;
  }

  .el-carousel__item:nth-child(2n) {
    background-color: #99a9bf;
  }

  .el-carousel__item:nth-child(2n+1) {
    background-color: #d3dce6;
  }

</style>

<style>
  /*屏蔽esri标注*/
  .esri-ui .esri-attribution {
    display: none;
  }

  #kjrmap .eventDetailClass {
    z-index: 600;
  }

  #eventDetailTitle {
    padding: 15px;
    /* flex-basis:5%; */
    background-color: rgb(62, 123, 246);
    border-radius: 5px 5px 0px 0px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  #kjrmap .lableClass {
    text-align: end;
    width: 57%;
    padding-right: 20px;
    border-bottom: 1px solid #c3c2c2;
    margin: 3px 0px 0px 0px;
  }

  #kjrmap .lableClass1 {
    margin: 3px 0px 0px 0px;
    width: 30%;
    color: blue;
  }

  #kjrmap .tableStyle {
    font-size: 14px;
    border-collapse: collapse;
    border: 1px solid #cccccc;
    width: 100%;
    background-color: White;
  }

  #kjrmap .tableStyle tr {
    color: #333333;
  }

  #kjrmap .tableStyle td {
    border-left: 1pt solid windowtext;
    border-right: 1pt solid windowtext;
    border-bottom: 1pt solid windowtext;
    border-color: #dddddd;
    height: 24px;
    padding: 1px 2px 1px 4px;
  }

  #kjrmap .name {
    text-align: right;
    /* padding-right: 5px; */
    min-height: 30px;
    background-color: #ffffff;
    line-height: 30px;
  }

  #kjrmap .river_box {}

  #kjrmap .river_box a {
    width: 123px;
    height: 85px;
    /* background: url(../images/images_bg.png) no-repeat; */
    display: block;
    padding: 5px;
    float: left;
    margin: 5px 5px 0 0;
  }

  #kjrmap .river_box a img {
    width: 111px;
    height: 74px;
    margin: 3px 5px;
  }

  #kjrmap .btn-paperView:hover {
    /* background: #c0fdf5 url(../images/icon/btn-paperView.png) no-repeat 5px 60%; */
    cursor: pointer;
  }

  #kjrmap .btn-paperView {
    /* background: #fff url(../images/icon/btn-paperView.png) no-repeat 5px 60%; */
    padding: 0px 5px 0px 23px;
    display: inline-block;
    white-space: nowrap;
    word-break: keep-all;
    word-wrap: normal;
    border: #b3aba9 1px solid;
    border-radius: 3px;
    margin: 6px 4px 0 0;
    line-height: 24px;
  }


  #kjrmap .item3 {
    width: 32%;
    margin: auto;
    display: inline-block;
    vertical-align: top;
  }

  #kjrmap .mt20 {
    margin-top: 20px;
  }

  #kjrmap .spanStyle {
    width: 100px;
    white-space: nowrap;
    /*强制span不换行*/
    display: inline-block;
    /*将span当做块级元素对待*/
    overflow: hidden;
    /*超出宽度部分隐藏*/
    text-overflow: ellipsis;
    /*超出部分以点号代替*/
  }

  #kjrmap .mt10 {
    margin-top: 10px;
    width: 24%;
    display: inline-block;
  }

  #kjrmap .mt15 {
    margin-top: 10px;
  }

  #kjrmap .mt30 {
    margin-top: 10px;
    width: 30%;
    display: inline-block;
  }

  #kjrmap .clearfix {
    font-size: 14px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: rgba(51, 51, 51, 1);
  }

  /*.sgzzr */
  #kjrmap .sgzzr .box-card .mt10,
  #kjrmap .skgc .box-card .mt10 {
    margin-top: 10px;
    width: 32%;
    display: inline-block;
  }

  #kjrmap .sgzzr .box-card .span100 {
    display: inline-block;
    width: 120px;
    text-align: right;
  }

  #kjrmap .sgzzr .box-card {
    height: 160px;
    margin-bottom: 5px;
    display: inline-block;
  }

  #kjrmap .ml10 {
    margin-left: 10px;
    font-size: 12px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: rgba(51, 51, 51, 1);
  }

  #kjrmap .skgc .box-card {
    height: 140px;
    margin-bottom: 5px;
    display: inline-block;
  }

  #kjrmap .skgc .box-card .span110 {
    display: inline-block;
    width: 140px;
    text-align: right;
  }

  #kjrmap .clearfix {
    text-indent: 25px;
  }

  #kjrmap .rg-select__content {
    color: white !important;
  }

  #kjrmap .rg-select__caret {
    color: white !important;
  }

  .v-dropdown-container {
    background-color: rgba(255, 255, 255, .5) !important;
  }

  .rg-select__list li {
    color: black !important;
    /* background-color: rgba(50, 50, 50, 0.45) !important; */
  }

  /* .rg-select__list li ::hover{
    color: orange !important;
  } */

  /* ul.rg-select__list li {
    color: #c0c4cc !important;
  } */

</style>