<template>
|
<div class="bajgxt-home">
|
<div class="head-title">
|
<span>智慧保安监管模块</span>
|
</div>
|
<span class="sub-title" @click.stop="goSystemHome">进入系统</span>
|
<div class="content">
|
<div class="left">
|
<div class="left1">
|
<!-- <img src="../../../public/img/bajgxt/line.jpg" /> -->
|
<div class="title-pane">
|
<img src="../../../public/img/bajgxt/icon1.png" />
|
<span>各辖区单位统计情况</span>
|
</div>
|
<div class="leftEchartTitle">
|
<div class="block1"></div>
|
<span>自招保安单位</span>
|
<span>{{ leftData.zz }}</span>
|
<span>个</span>
|
</div>
|
<div class="leftEchartTitle leftEchartTitle2">
|
<div class="block1"></div>
|
<span>保安培训学校</span>
|
<span>{{ leftData.px }}</span>
|
<span>个</span>
|
</div>
|
<div class="leftEchartTitle leftEchartTitle3">
|
<div class="block1"></div>
|
<span>本市保安公司</span>
|
<span>{{ leftData.fw }}</span>
|
<span>个</span>
|
</div>
|
<!-- <div class="leftEchartTitle leftEchartTitle4">
|
<div class="block1"></div>
|
<span>武装守押公司</span>
|
<span>{{ leftData.wz }}</span>
|
<span>个</span>
|
</div> -->
|
<div class="leftEchartTitle leftEchartTitle4">
|
<div class="block1"></div>
|
<span>分公司</span>
|
<span>{{ leftData.kqy }}</span>
|
<span>个</span>
|
</div>
|
<div id="left1Echart" v-loading="left1loading"></div>
|
</div>
|
<div class="left2">
|
<div class="title-pane2">
|
<img src="../../../public/img/bajgxt/icon1.png" />
|
<span>保安员持证情况</span>
|
<span
|
class="left2-btn btn1"
|
:class="[left2EchartType === 0 ? 'bayHover' : '']"
|
@click="getHolderNum(0)"
|
>辖区统计</span
|
>
|
<span
|
class="left2-btn btn2"
|
:class="[left2EchartType === 1 ? 'bayHover' : '']"
|
@click="getHolderNum(1)"
|
>男女结构</span
|
>
|
</div>
|
|
<div v-if="left2EchartType === 1" class="leftEchartTitle xbNan">
|
<div class="block1"></div>
|
<span>男</span>
|
<span>{{ leftData.nan }}</span>
|
<span>人</span>
|
</div>
|
<div v-if="left2EchartType === 1" class="leftEchartTitle xbNv">
|
<div class="block1"></div>
|
<span>女</span>
|
<span>{{ leftData.nv }}</span>
|
<span>人</span>
|
</div>
|
<div id="left2Echart" v-loading="left2loading"></div>
|
</div>
|
</div>
|
<div class="middle" v-loading="middleloading">
|
<div class="mapimg">
|
<!-- <div class="textBox">
|
<transition name="slide">
|
<p class="text" :key="text.id">{{ text.val }}</p>
|
</transition>
|
</div> -->
|
|
<!-- <div></div> -->
|
<div class="mapBtn" @click="setMapData(2)">
|
<img src="../../../public/img/bajgxt/car.png" alt />
|
<div class="text">
|
<span>押运车辆</span>
|
<span>{{ carNum }}</span>
|
</div>
|
</div>
|
<div class="mapBtn" @click="setMapData(1)">
|
<img src="../../../public/img/bajgxt/peo.png" alt />
|
<div class="text">
|
<span>保安员</span>
|
<span>{{ peoNum }}</span>
|
</div>
|
</div>
|
<div class="mapBtn" @click="setMapData(3)">
|
<img src="../../../public/img/bajgxt/gun.png" alt />
|
<div class="text">
|
<span>枪支</span>
|
<span>{{ gunNum }}</span>
|
</div>
|
</div>
|
<div id="map"></div>
|
</div>
|
<div class="table">
|
<div class="table-title">武装押运实时定位</div>
|
<div class="lefttop"></div>
|
<div class="leftbottom"></div>
|
<div class="righttop"></div>
|
<div class="rightbottom"></div>
|
<div class="bottom-table">
|
<el-table :data="tableData" stripe ref="indexTable">
|
<template v-if="curTableType === 2">
|
<el-table-column
|
:key="curTableType"
|
type="index"
|
label="序号"
|
width="50"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
prop="mode"
|
label="车辆型号"
|
width="180"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="personInCharge"
|
label="责任人"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="dateForProduction"
|
label="出厂日期"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="detailObj"
|
label="厂商"
|
></el-table-column>
|
</template>
|
<template v-if="curTableType === 1">
|
<el-table-column
|
:key="curTableType"
|
type="index"
|
label="序号"
|
width="50"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="realName"
|
label="押运人员名称"
|
width="180"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="address"
|
label="联系地址"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="deptName"
|
label="所属公司"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="phone"
|
label="联系电话"
|
></el-table-column>
|
<!-- <el-table-column :key="curTableType" prop="bz" label="备注">
|
</el-table-column>-->
|
</template>
|
<template v-if="curTableType === 3">
|
<el-table-column
|
:key="curTableType"
|
type="index"
|
label="序号"
|
width="50"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="gunMode"
|
label="枪支类型"
|
width="180"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="personInCharge"
|
label="责任人"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="issueTime"
|
label="发证日期"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
show-overflow-tooltip
|
prop="validTime"
|
label="有效日期"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
prop="issueUnit"
|
label="发证单位"
|
></el-table-column>
|
<el-table-column
|
:key="curTableType"
|
prop="cardNumber"
|
label="用枪编号"
|
></el-table-column>
|
</template>
|
</el-table>
|
</div>
|
</div>
|
</div>
|
<div class="right">
|
<div class="right1">
|
<div class="title-pane1">
|
<img src="../../../public/img/bajgxt/icon2.png" />
|
<span>保安员预警统计</span>
|
|
<avue-input-tree
|
default-expand-all
|
v-model="value1"
|
placeholder="南昌市公安局"
|
type="tree"
|
:dic="options1"
|
:props="props"
|
@change="handleNodeClick1"
|
></avue-input-tree>
|
</div>
|
<div class="right-content" v-loading="right1loading">
|
<span
|
class="left2-btn date"
|
:class="[poorPerformanceType === 1 ? 'bayHover' : '']"
|
@click="getPoorPerformance(1)"
|
>当日</span
|
>
|
<span
|
class="left2-btn mounce"
|
:class="[poorPerformanceType === 2 ? 'bayHover' : '']"
|
@click="getPoorPerformance(2)"
|
>当月</span
|
>
|
<span
|
class="left2-btn all"
|
:class="[poorPerformanceType === 3 ? 'bayHover' : '']"
|
@click="getPoorPerformance(3)"
|
>全部</span
|
>
|
<div class="card-list" style="margin-top: 21px">
|
<img src="../../../public/img/bajgxt/u4.png" />
|
<img src="../../../public/img/bajgxt/u256.png" />
|
<img src="../../../public/img/bajgxt/u1.png" />
|
<span class="showDialog" @click="shoeDialog('xs')">{{
|
rightData.poorPerformance
|
}}</span>
|
<span class="showDialog" @click="shoeDialog('xs')"
|
>现实表现差</span
|
>
|
</div>
|
<div class="card-list">
|
<img src="../../../public/img/bajgxt/u4.png" />
|
<img src="../../../public/img/bajgxt/u230.png" />
|
<img src="../../../public/img/bajgxt/u1.png" />
|
<span class="showDialog" @click="shoeDialog('zg')">{{
|
rightData.qualification
|
}}</span>
|
<span class="showDialog" @click="shoeDialog('zg')"
|
>资格审查异常</span
|
>
|
</div>
|
</div>
|
<!-- <div class="card-text"> -->
|
<!-- <span>现实表现差</span><span>902,432</span><span>起</span
|
><span>审查情况</span><span>22222</span><span>起</span>-->
|
<!-- </div> -->
|
<!-- <div id="right1Echart"></div> -->
|
</div>
|
<div class="right2">
|
<div class="title-pane1">
|
<img src="../../../public/img/bajgxt/icon2.png" />
|
<span>保安公司预警统计</span>
|
|
<!-- <el-select
|
ref="treeForm2"
|
v-model="node2.title"
|
placeholder="请选择"
|
>
|
<el-option style="height: auto" :value="node2">
|
<el-tree
|
:data="options2"
|
default-expand-all
|
node-key="id"
|
@node-click="handleNodeClick2"
|
:props="props"
|
>
|
</el-tree>
|
</el-option>
|
</el-select> -->
|
<avue-input-tree
|
default-expand-all
|
v-model="value2"
|
placeholder="请选择内容"
|
type="tree"
|
:dic="options2"
|
:props="props"
|
@change="handleNodeClick2"
|
></avue-input-tree>
|
</div>
|
<div class="right-content" v-loading="right2loading">
|
<div class="rightData rightData1" @click="shoeDialog('wg')">
|
<img src="../../../public/img/bajgxt/u231.png" alt />
|
<div class="text">
|
<span>违规经营</span>
|
<span>{{ rightData.wgNum }}个</span>
|
</div>
|
</div>
|
<div class="rightData rightData2" @click="shoeDialog('jy')">
|
<img src="../../../public/img/bajgxt/u232.png" alt />
|
<div class="text">
|
<span>经营不善</span>
|
<span>{{ rightData.materialNum }}个</span>
|
</div>
|
</div>
|
<div class="rightData rightData3" @click="shoeDialog('ym')">
|
<img src="../../../public/img/bajgxt/u233.png" alt />
|
<div class="text">
|
<span>有名无实</span>
|
<span>{{ rightData.ymwsNum }}个</span>
|
</div>
|
</div>
|
<div class="rightData rightData4" @click="shoeDialog('jg')">
|
<img src="../../../public/img/bajgxt/111.png" alt />
|
<div class="text">
|
<span>监管处罚</span>
|
<span>{{ rightData.punishNum }}个</span>
|
</div>
|
</div>
|
<!-- <div class="card-list">
|
<img src="../../../public/img/bajgxt/u4.png" />
|
<img src="../../../public/img/bajgxt/u235.png" />
|
<img src="../../../public/img/bajgxt/u1.png" />
|
<span>{{ rightData.socialSecurity }}</span>
|
<span>未缴纳社保</span>
|
</div>
|
<div class="card-list">
|
<img src="../../../public/img/bajgxt/u4.png" />
|
<img src="../../../public/img/bajgxt/u251.png" />
|
<img src="../../../public/img/bajgxt/u1.png" />
|
<span>{{ rightData.noholder }}</span>
|
<span>未持证</span>
|
</div> -->
|
</div>
|
<!-- <div class="card-text"> -->
|
<!-- <span>未缴纳社保情况</span><span>902,432</span><span>起</span
|
><span>未持证情况</span><span>22222</span><span>起</span>-->
|
<!-- </div> -->
|
<!-- <div id="right2Echart"></div> -->
|
</div>
|
<div class="right3">
|
<div class="title-pane2">
|
<img src="../../../public/img/bajgxt/icon3.png" />
|
<span>分局预警占比情况</span>
|
</div>
|
<div id="right3Echart" v-loading="right3loading"></div>
|
</div>
|
</div>
|
</div>
|
|
<!-- 弹框表格 -->
|
<el-dialog
|
class="dialog"
|
:title="gridData.title"
|
v-loading="dialogloading"
|
element-loading-text="数据加载中"
|
:visible.sync="dialogTableVisible"
|
>
|
<div class="dialog-table">
|
<el-table :data="gridData.data">
|
<template v-if="gridData.type === 'zg' || gridData.type === 'xs'">
|
<el-table-column
|
label="序号"
|
width="50"
|
:key="gridData.type"
|
type="index"
|
>
|
</el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="realName"
|
label="保安姓名"
|
:show-overflow-tooltip="true"
|
width="100"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="deptName"
|
label="保安公司"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="sex"
|
label="性别"
|
:formatter="sexFormatter"
|
:show-overflow-tooltip="true"
|
width="100"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="cardid"
|
label="身份证号"
|
:show-overflow-tooltip="true"
|
width="180"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="age"
|
label="年龄"
|
:show-overflow-tooltip="true"
|
width="100"
|
></el-table-column>
|
<!-- <el-table-column
|
prop="birthday"
|
label="出生日期"
|
:show-overflow-tooltip="true"
|
></el-table-column> -->
|
<el-table-column
|
:key="gridData.type"
|
prop="securitynumber"
|
label="保安员证编号"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="phone"
|
label="联系方式"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
v-if="gridData.type === 'zg'"
|
:key="gridData.type"
|
prop="examinationType"
|
label="审查状态"
|
:formatter="examinationFormatter"
|
:show-overflow-tooltip="true"
|
width="100"
|
></el-table-column>
|
<el-table-column
|
v-if="gridData.type === 'zg'"
|
:key="gridData.type"
|
prop="examinationMx"
|
label="审查明细"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
v-if="gridData.type === 'zg'"
|
:key="gridData.type"
|
prop="emails"
|
label="审查异常备注"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
v-if="gridData.type === 'xs'"
|
:key="gridData.type"
|
prop="score"
|
label="现实表现情况"
|
:show-overflow-tooltip="true"
|
width="150"
|
:formatter="scoreFormatter"
|
></el-table-column>
|
</template>
|
<template v-if="gridData.type === 'wg'">
|
<el-table-column
|
label="序号"
|
width="50"
|
:key="gridData.type"
|
type="index"
|
>
|
</el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="enterpriseName"
|
label="公司名称"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="znum"
|
label="保安员数量"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="cznum"
|
label="持证保安"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="czl"
|
label="持证率"
|
:show-overflow-tooltip="true"
|
width="150"
|
>
|
</el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="sbnum"
|
label="缴纳社保人数"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="sbl"
|
label="缴纳社保比例"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
</template>
|
<template v-if="gridData.type === 'jy'">
|
<el-table-column
|
label="序号"
|
width="50"
|
:key="gridData.type"
|
type="index"
|
>
|
</el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="enterpriseName"
|
label="公司名称"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="znum"
|
label="保安员数量"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="cznum"
|
label="持证保安"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="painum"
|
label="派遣人数"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="fwnum"
|
label="服务对象数量"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="pql"
|
label="派遣率"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="pjpqrs"
|
label="平均派遣人数"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
</template>
|
<template v-if="gridData.type === 'ym'">
|
<el-table-column
|
label="序号"
|
width="50"
|
:key="gridData.type"
|
type="index"
|
>
|
</el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="enterpriseName"
|
label="公司名称"
|
:show-overflow-tooltip="true"
|
width="450"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="znum"
|
label="保安员数量"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="cznum"
|
label="持证保安"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="painum"
|
label="派遣人数"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="fwnum"
|
label="服务对象数量"
|
:show-overflow-tooltip="true"
|
></el-table-column
|
>gridData
|
</template>
|
<template v-if="gridData.type === 'jg'">
|
<el-table-column
|
label="序号"
|
width="50"
|
:key="gridData.type"
|
type="index"
|
>
|
</el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="enterpriseName"
|
label="公司名称"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="punishtype"
|
label="处罚类别"
|
:formatter="punishType"
|
:show-overflow-tooltip="true"
|
width="150"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="punishreason"
|
label="处罚原因"
|
:show-overflow-tooltip="true"
|
width="200"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="penalty"
|
label="处罚单位"
|
:show-overflow-tooltip="true"
|
width="200"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="punishtime"
|
label="处罚时间"
|
:show-overflow-tooltip="true"
|
width="100"
|
></el-table-column>
|
</template>
|
<template v-if="gridData.type === 'ywdx_gs'">
|
<el-table-column
|
label="序号"
|
width="50"
|
:key="gridData.type"
|
type="index"
|
>
|
</el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="enterprisename"
|
label="保安公司名称"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="stats"
|
label="保安公司类型"
|
:formatter="companyFormatter"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
<el-table-column
|
:key="gridData.type"
|
prop="jurisdictionName"
|
label="所属辖区"
|
:show-overflow-tooltip="true"
|
></el-table-column>
|
</template>
|
</el-table>
|
</div>
|
|
<el-pagination
|
@current-change="changePage"
|
@size-change="changePage"
|
:current-page.sync="gridData.current"
|
:page-size="10"
|
layout="total, prev, pager, next, jumper"
|
:total="gridData.total"
|
>
|
</el-pagination>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import "./echarts-auto-tooltip";
|
// import "ol/ol.css";
|
import * as echarts from "echarts";
|
import optionJs from "./indexEchart";
|
// import TileLayer from "ol/layer/Tile";
|
import XYZ from "ol/source/XYZ";
|
// import { Map, View } from "ol";
|
// import { Tile, Group } from "ol/layer";
|
// import { OSM, TileJSON } from "ol/source";
|
// import VectorLayer from "ol/layer/Vector";
|
// import VectorSource from "ol/source/Vector";
|
|
// import Feature from "ol/Feature.js";
|
// import Point from "ol/geom/Point.js";
|
// import { Fill, Stroke, Circle, Style, Icon } from "ol/style";
|
// import GeoJSON from "ol/format/GeoJSON";
|
// import axios from "../../router/axios";
|
import {
|
securityTotal,
|
holderNum,
|
securityPer,
|
getLiveLocationVoList,
|
lazyTreeJu,
|
noholderNum,
|
noSocialSecurity,
|
selectFj,
|
selectBx,
|
selectExtype,
|
seCountUg,
|
seCountI,
|
selectExtypeUser,
|
qualificationPages,
|
xsbxPages,
|
selectCf,
|
selectCl,
|
selectYs,
|
selectJy,
|
selectWg,
|
punishList,
|
lazyTrees,
|
getSecurityUnitInfoPage,
|
getSelectPeo,
|
getSelectCar,
|
getSelectGun
|
} from "../../api/index/index";
|
import { getPeopleList, getPosition, getNewPeople } from "@/api/map/people";
|
import { getCarList, getNewPosition } from "@/api/map/car";
|
import { getGunList } from "@/api/map/gun";
|
|
import car from "@/assets/img/car.png";
|
import peo from "@/assets/img/people.png";
|
import gun from "@/assets/img/gun.png";
|
|
import website from "@/config/website";
|
|
export default {
|
data() {
|
return {
|
map: null,
|
curTableType: 2,
|
tableData: [],
|
value1: "",
|
carVectorLayer: null,
|
peoVectorLayer: null,
|
gunVectorLayer: null,
|
|
options1: [],
|
value2: "",
|
options2: [],
|
rightData: {
|
poorPerformance: 0,
|
qualification: 0,
|
materialNum: 0,
|
punishNum: 0,
|
wgNum: 0,
|
ymwsNum: 0
|
},
|
carNum: 0,
|
peoNum: 0,
|
gunNum: 0,
|
mapData: null,
|
echarts: {
|
left1Echart: null,
|
left2Echart: null,
|
mapEchart: null,
|
right3Echart: null
|
},
|
left1loading: true,
|
left2loading: true,
|
middleloading: true,
|
right1loading: true,
|
right2loading: true,
|
right3loading: true,
|
textArr: [],
|
number: 0,
|
leftData: {
|
zz: 0,
|
px: 0,
|
fw: 0,
|
wz: 0,
|
kqy: 0,
|
nan: 0,
|
nv: 0
|
},
|
left2EchartType: 0,
|
poorPerformanceType: 3,
|
dialogTableVisible: false,
|
gridData: {
|
data: [],
|
total: 0,
|
current: 1,
|
type: "zg",
|
title: "资格异常人员清单"
|
},
|
dialogTable: {
|
wgTable: [],
|
jyTable: [],
|
ymTable: []
|
},
|
props: {
|
children: "children",
|
label: "title",
|
value: "id"
|
},
|
// props2: {
|
// children: "children",
|
// label: "enterpriseName",
|
// value: "departmentid"
|
// },
|
node1: {}, //选中的记录
|
node2: {},
|
params: null,
|
peopleGps: {},
|
carGps: {}
|
};
|
},
|
computed: {
|
text() {
|
return {
|
id: this.number,
|
val: this.textArr[this.number]
|
};
|
}
|
},
|
methods: {
|
getPeoplePosition() {
|
getNewPeople({ type: 1, workerId: "1457916357495537665" }).then(
|
result => {
|
var res = result.data.data;
|
if (JSON.stringify(res) != "{}") {
|
var csGps = window.coordtransform.bd09togcj02(
|
Number(res.longitude),
|
Number(res.latitude)
|
);
|
// var arr = res.data.sort(function(a, b) {
|
// return a["date"] < b["date"] ? 1 : -1;
|
// });
|
this.peopleGps = {
|
LGTD: csGps[0],
|
LTTD: csGps[1]
|
};
|
}
|
this.getCarPosition();
|
}
|
);
|
},
|
getCarPosition() {
|
getNewPosition({ type: 2, workerId: "赣AD77669" }).then(result => {
|
var res = result.data.data;
|
if (JSON.stringify(res) != "{}") {
|
this.carGps = {
|
LGTD: Number(res.longitude),
|
LTTD: Number(res.latitude)
|
};
|
}
|
this.getTableData();
|
});
|
},
|
//点击节点
|
handleNodeClick1(data) {
|
this.value1 = data;
|
this.right1loading = true;
|
this.getPoorPerformance(3);
|
},
|
//点击节点
|
handleNodeClick2(data) {
|
this.value2 = data;
|
this.peoWarning();
|
},
|
sexFormatter(row, column) {
|
if (row.sex === 1) {
|
return "男";
|
} else if (row.sex === 2) {
|
return "女";
|
}
|
},
|
examinationFormatter(row) {
|
if (row.examinationType === "1") {
|
return "异常";
|
} else if (row.examinationType === "0") {
|
return "正常";
|
}
|
},
|
scoreFormatter(row) {
|
if (row.score === "3") {
|
return "差";
|
}
|
},
|
punishType(row) {
|
if (row.punishtype === "0") {
|
return "警告";
|
} else if (row.punishtype === "1") {
|
return "罚款";
|
} else if (row.punishtype === "2") {
|
return "没收违法所得";
|
} else if (row.punishtype === "3") {
|
return "没收非法财物";
|
} else if (row.punishtype === "4") {
|
return "责令停止施工";
|
} else if (row.punishtype === "5") {
|
return "责令停止使用";
|
} else if (row.punishtype === "6") {
|
return "责令停止违法行为";
|
} else if (row.punishtype === "7") {
|
return "责令停业";
|
}
|
},
|
shoeDialog1(type) {
|
this.gridData.data = [];
|
this.gridData.total = 0;
|
this.gridData.current = 1;
|
this.gridData.type = type;
|
this.showDialogTable(type);
|
},
|
showDialogTable(type) {
|
let param = this.params;
|
this.dialogTableVisible = true;
|
this.dialogloading = true;
|
if (type === "ywdx_gs") {
|
this.gridData.title = param.name + "保安公司统计";
|
if (param.name) {
|
let arr = this.options1[0].children.filter(
|
a => a.title === param.name
|
);
|
if (arr[0] && arr[0].id) {
|
getSecurityUnitInfoPage({
|
jurisdiction: arr[0].id,
|
current: this.gridData.current,
|
size: 10
|
}).then(res => {
|
if (res.data.code === 200) {
|
this.gridData.data = res.data.data.records;
|
this.gridData.total = res.data.data.total;
|
}
|
this.dialogloading = false;
|
});
|
}
|
}
|
}
|
},
|
// 左侧表的接口返回数据
|
initEchart() {
|
securityTotal().then(res => {
|
if (res.data.code == 200) {
|
let securityData = res.data.data;
|
if (!this.echarts.left1Echart) {
|
this.echarts.left1Echart = echarts.init(
|
document.getElementById("left1Echart")
|
);
|
}
|
this.echarts.left1Echart.setOption(optionJs.left1Data(securityData));
|
this.echarts.left1Echart.on("click", params => {
|
this.params = params;
|
this.shoeDialog1("ywdx_gs");
|
});
|
} else {
|
this.$message.error(res.msg);
|
}
|
this.left1loading = false;
|
});
|
seCountI({ jurisdiction: "", deptid: "" }).then(res => {
|
if (res.data.code == 200) {
|
let data = res.data.data;
|
data.forEach(item => {
|
if (item.stats === "0") {
|
this.leftData.zz = item.num;
|
}
|
if (item.stats === "1") {
|
this.leftData.px = item.num;
|
}
|
if (item.stats === "2") {
|
this.leftData.fw = item.num;
|
}
|
if (item.stats === "3") {
|
this.leftData.wz = item.num;
|
}
|
if (item.stats === "4") {
|
this.leftData.kqy = item.num;
|
}
|
});
|
} else {
|
this.$message.error(res.msg);
|
}
|
});
|
selectFj().then(res => {
|
// debugger;
|
if (res.data.code === 200) {
|
if (!this.echarts.right3Echart) {
|
this.echarts.right3Echart = echarts.init(
|
document.getElementById("right3Echart")
|
);
|
}
|
this.echarts.right3Echart.setOption(
|
optionJs.right3Data(res.data.data)
|
);
|
} else {
|
this.$message.error(res.msg);
|
}
|
this.right3loading = false;
|
});
|
},
|
|
getHolderNum(type) {
|
this.left2EchartType = type;
|
this.left2loading = true;
|
if (this.echarts.left2Echart) {
|
this.echarts.left2Echart.clear();
|
}
|
if (type === 0) {
|
holderNum().then(res => {
|
if (res.data.code === 200) {
|
let data = res.data.data;
|
this.echarts.left2Echart = echarts.init(
|
document.getElementById("left2Echart")
|
);
|
this.echarts.left2Echart.setOption(optionJs.left2Data(data), true);
|
} else {
|
this.$message.error(res.msg);
|
}
|
this.left2loading = false;
|
});
|
} else {
|
seCountUg({ jurisdiction: "", deptid: "" }).then(res => {
|
if (res.data.code === 200) {
|
this.echarts.left2Echart = echarts.init(
|
document.getElementById("left2Echart")
|
);
|
this.echarts.left2Echart.setOption(
|
optionJs.left3Data(res.data.data, true)
|
);
|
this.leftData.nan = res.data.data[0].mnum;
|
this.leftData.nv = res.data.data[0].gnum;
|
}
|
this.left2loading = false;
|
});
|
}
|
},
|
initMapEchart(data, type) {
|
if (!this.echarts.mapEchart) {
|
this.echarts.mapEchart = echarts.init(document.getElementById("map"));
|
}
|
this.echarts.mapEchart.setOption(optionJs.middleData(data, type));
|
echartAutoTools.loopShowTooltip(
|
this.echarts.mapEchart,
|
optionJs.middleData(data, type),
|
{ loopSeries: true }
|
);
|
},
|
setMapData(type) {
|
this.middleloading = true;
|
this.curTableType = type;
|
this.tableData = this.mapData[type]["table"];
|
this.initMapEchart(this.mapData[type], type);
|
this.middleloading = false;
|
this.textArr = [];
|
if (type === 2) {
|
this.tableData.forEach(item => {
|
let obj =
|
"押运车辆型号" +
|
item.mode +
|
",责任人" +
|
item.personInCharge +
|
",出厂日期" +
|
item.dateForProduction +
|
",厂商" +
|
item.detailObj;
|
this.textArr.push(obj);
|
});
|
} else if (type === 1) {
|
this.tableData.forEach(item => {
|
let obj =
|
"押运人员" +
|
item.realName +
|
",联系地址" +
|
item.address +
|
",所属公司" +
|
item.deptName +
|
",联系电话" +
|
item.phone;
|
this.textArr.push(obj);
|
});
|
} else if (type === 3) {
|
this.tableData.forEach(item => {
|
let obj =
|
"枪支类型" +
|
item.gunMode +
|
",责任人" +
|
item.personInCharge +
|
",发证日期" +
|
item.issueTime +
|
",有效日期" +
|
item.validTime +
|
",发证单位" +
|
item.issueUnit +
|
",用枪编号" +
|
item.cardNumber;
|
this.textArr.push(obj);
|
});
|
}
|
},
|
// 获取表格及地图上的数据
|
getTableData() {
|
this.mapData = {
|
1: {
|
table: [],
|
geoData: []
|
},
|
2: {
|
table: [],
|
geoData: []
|
},
|
3: {
|
table: [],
|
geoData: []
|
}
|
};
|
// 获取人员列表
|
getSelectPeo({ type: 1, deptId: "1460129345988239362" }).then(res => {
|
var records = res.data.data;
|
records.forEach(m => {
|
let obj = {
|
address: m.address,
|
realName: m.real_name,
|
deptName: m.deptName,
|
phone: m.phone,
|
id: m.id
|
};
|
this.mapData[1]["geoData"].push([
|
Number(this.peopleGps.LGTD),
|
Number(this.peopleGps.LTTD)
|
]);
|
this.mapData[1]["table"].push(obj);
|
});
|
this.peoNum = this.mapData[1]["table"].length;
|
});
|
|
//获取车辆列表
|
getSelectCar({
|
type: 1,
|
deptId: "1460129345988239362"
|
}).then(res => {
|
var records = res.data.data;
|
records.forEach(m => {
|
let obj = {
|
mode: m.mode,
|
personInCharge: m.person_in_charge,
|
dateForProduction: m.date_for_production,
|
detailObj: m.brand,
|
// location: m.address,
|
// name: m.name,
|
// company: m.deptName,
|
// tel: m.phone,
|
id: m.id
|
};
|
this.mapData[2]["geoData"].push([
|
Number(this.carGps.LGTD),
|
Number(this.carGps.LTTD)
|
]);
|
this.mapData[2]["table"].push(obj);
|
});
|
this.carNum = this.mapData[2]["table"].length;
|
this.setMapData(2);
|
});
|
|
// 获取枪支列表
|
getLiveLocationVoList({
|
type: 3
|
}).then(res => {
|
if (res.data.code === 200) {
|
let records = res.data.data;
|
records.forEach(m => {
|
let obj = {
|
gunMode: m.number,
|
personInCharge: m.linkman,
|
issueTime: m.issueTime,
|
validTime: m.validTime,
|
issueUnit: m.issueUnit,
|
cardNumber: m.gunNum,
|
id: m.id
|
};
|
debugger
|
this.mapData[3]["geoData"].push([
|
Number(m.longitude),
|
Number(m.latitude)
|
]);
|
this.mapData[3]["table"].push(obj);
|
});
|
this.gunNum = this.mapData[3]["table"].length;
|
}
|
});
|
// getLiveLocationVoList({ type: type }).then(res => {
|
// if (res.data.code === 200) {
|
// let allData = res.data.data;
|
// allData.forEach(m => {
|
// let obj = {
|
// location: m.location,
|
// name: m.name,
|
// number: m.number,
|
// linkman: m.linkman,
|
// company: m.company,
|
// tel: m.tel,
|
// carNum: m.carNum
|
// };
|
|
// // let geoObj = {
|
// // name: type,
|
// // value: [Number(m.longitude), Number(m.latitude)],
|
// // };
|
// // if (m.type === 1) {
|
// // middleData[m.type]["geoData"].push([
|
// // Number(this.peopleGps.LGTD),
|
// // Number(this.peopleGps.LTTD)
|
// // ]);
|
// // middleData[m.type]["table"].push(obj);
|
// // } else if (m.type === 2) {
|
// // middleData[m.type]["geoData"].push([
|
// // Number(this.carGps.LGTD),
|
// // Number(this.carGps.LTTD)
|
// // ]);
|
// // middleData[m.type]["table"].push(obj);
|
// // } else {
|
// // middleData[m.type]["geoData"].push([
|
// // Number(m.longitude),
|
// // Number(m.latitude)
|
// // ]);
|
// // middleData[m.type]["table"].push(obj);
|
// // }
|
// middleData[m.type]["geoData"].push([
|
// Number(m.longitude),
|
// Number(m.latitude)
|
// ]);
|
// middleData[m.type]["table"].push(obj);
|
// });
|
// this.carNum = middleData[2]["table"].length;
|
// this.peoNum = middleData[1]["table"].length;
|
// this.gunNum = middleData[3]["table"].length;
|
// this.mapData = middleData;
|
// this.setMapData(2);
|
// } else {
|
// this.$message.error(res.msg);
|
// }
|
// });
|
},
|
|
// 获取辖区列表
|
getOfficeData() {
|
lazyTrees().then(res => {
|
if (res.data.code === 200) {
|
this.options1 = res.data.data;
|
this.options2 = res.data.data;
|
this.value1 = this.options1[0].value || "";
|
this.value2 = this.options2[0].value || "";
|
this.node1 = this.options1[0];
|
this.node2 = this.options1[0];
|
// 获取完辖区列表之后再获取具体数据
|
this.peoWarning();
|
// this.getQualification();
|
this.getPoorPerformance(3);
|
} else {
|
this.$message.error(res.msg);
|
}
|
});
|
},
|
// 资格审查异常名单
|
shoeDialog(type) {
|
this.gridData.title = "";
|
this.gridData.type = type;
|
this.gridData.current = 1;
|
this.gridData.total = 0;
|
this.dialogTableVisible = true;
|
if (type === "zg") {
|
this.gridData.title = "资格异常人员清单";
|
this.getQualificationPages(1);
|
} else if (type === "wg") {
|
this.gridData.title =
|
"违规经营公司清单（持证人数低于50%、缴纳社保人数低于50%）";
|
this.getWgTable();
|
} else if (type === "jy") {
|
this.gridData.title = "经营不善公司清单（服务对象数量为0）";
|
this.getJyTable();
|
} else if (type === "ym") {
|
this.gridData.title = "有名无实公司清单（保安员数量为0）";
|
this.getYmTable();
|
} else if (type === "jg") {
|
this.gridData.title = "受监管处罚公司清单（保安公司存在被处罚记录）";
|
this.getPunishList(1);
|
} else if (type === "xs") {
|
this.gridData.title = "现实表现差人员清单";
|
this.getXsbxPages(1);
|
}
|
},
|
getWgTable() {
|
this.dialogTable.wgTable.forEach(item => {
|
let czl = 0;
|
if (Number(item.cznum) !== 0 && Number(item.znum) !== 0) {
|
czl =
|
((Number(item.cznum) / Number(item.znum)) * 100).toFixed(2) + "%";
|
}
|
item["czl"] = czl;
|
let sbl = 0;
|
if (Number(item.sbnum) !== 0 && Number(item.znum) !== 0) {
|
czl =
|
((Number(item.sbnum) / Number(item.znum)) * 100).toFixed(2) + "%";
|
}
|
item["sbl"] = sbl;
|
});
|
this.gridData.data = this.dialogTable.wgTable.slice(0, 10);
|
this.gridData.total = this.dialogTable.wgTable.length;
|
},
|
getJyTable() {
|
this.dialogTable.jyTable.forEach(item => {
|
let pql = 0;
|
if (Number(item.painum) !== 0 && Number(item.znum) !== 0) {
|
pql =
|
((Number(item.painum) / Number(item.znum)) * 100).toFixed(2) + "%";
|
}
|
item["pql"] = pql;
|
let pjpqrs = 0;
|
if (Number(item.painum) !== 0 && Number(item.fwnum) !== 0) {
|
pjpqrs =
|
((Number(item.painum) / Number(item.fwnum)) * 100).toFixed(2) + "%";
|
}
|
item["pjpqrs"] = pjpqrs;
|
});
|
this.gridData.data = this.dialogTable.jyTable.slice(0, 10);
|
this.gridData.total = this.dialogTable.jyTable.length;
|
},
|
getYmTable() {
|
this.gridData.data = this.dialogTable.ymTable.slice(0, 10);
|
this.gridData.total = this.dialogTable.ymTable.length;
|
},
|
getPunishList(page) {
|
this.gridData.current = page;
|
this.dialogloading = true;
|
this.gridData.data = [];
|
let params = {
|
current: this.gridData.current,
|
size: 10,
|
jurisdiction: this.value2
|
};
|
punishList(params).then(res => {
|
if (res.data.code === 200) {
|
this.gridData.data = res.data.data.records;
|
this.gridData.total = res.data.data.total;
|
}
|
this.dialogloading = false;
|
});
|
},
|
changePage(page) {
|
if (this.gridData.type === "zg") {
|
this.getQualificationPages(page);
|
} else if (this.gridData.type === "wg") {
|
this.gridData.data = this.dialogTable.wgTable.slice(
|
10 * (page - 1),
|
10 * page
|
);
|
} else if (this.gridData.type === "jy") {
|
this.gridData.data = this.dialogTable.jyTable.slice(
|
10 * (page - 1),
|
10 * page
|
);
|
} else if (this.gridData.type === "ym") {
|
this.gridData.data = this.dialogTable.jyTable.slice(
|
10 * (page - 1),
|
10 * page
|
);
|
} else if (this.gridData.type === "jg") {
|
this.getPunishList(page);
|
} else if (this.gridData.type === "ywdx_gs") {
|
this.showDialogTable(this.gridData.type);
|
} else if (this.gridData.type === "xs") {
|
this.getXsbxPages(page);
|
}
|
},
|
// 现实表现差弹框
|
getXsbxPages(page) {
|
this.gridData.current = page;
|
this.dialogloading = true;
|
this.gridData.data = [];
|
let types = this.poorPerformanceType.toString()
|
let params = {
|
current: this.gridData.current,
|
size: 10,
|
jurisdiction: this.value1,
|
type:types
|
};
|
xsbxPages(params).then(res => {
|
if (res.data.code === 200) {
|
this.gridData.data = res.data.data.records;
|
this.gridData.total = res.data.data.total;
|
}
|
this.dialogloading = false;
|
});
|
},
|
getQualificationPages(page) {
|
this.gridData.current = page;
|
this.dialogloading = true;
|
this.gridData.data = [];
|
let types = this.poorPerformanceType.toString();
|
let params = {
|
current: this.gridData.current,
|
size: 10,
|
jurisdiction: this.value1,
|
examinationType: 1,
|
types: types
|
};
|
qualificationPages(params).then(res => {
|
if (res.data.code === 200) {
|
this.gridData.data = res.data.data.records;
|
this.gridData.total = res.data.data.total;
|
}
|
this.dialogloading = false;
|
});
|
},
|
// 公司受处罚数量
|
getPunishNum() {
|
// selectCf({ jurisdiction: this.value2 }).then(res => {
|
// if (res.data.code === 200) {
|
// this.rightData.punishNum = res.data.data.count;
|
// } else {
|
// this.$message.error(res.msg);
|
// }
|
// this.right2loading = false;
|
// });
|
let params = {
|
current: this.gridData.current,
|
size: 10,
|
jurisdiction: this.value2
|
};
|
punishList(params).then(res => {
|
if (res.data.code === 200) {
|
this.gridData.data = res.data.data.records;
|
this.gridData.total = res.data.data.total;
|
this.rightData.punishNum = res.data.data.total;
|
}
|
this.dialogloading = false;
|
});
|
},
|
// 经营不善
|
getMaterial() {
|
selectJy({ jurisdiction: this.value2 }).then(res => {
|
if (res.data.code === 200) {
|
this.rightData.materialNum = res.data.data.count;
|
this.dialogTable.jyTable = res.data.data.List;
|
} else {
|
this.$message.error(res.msg);
|
}
|
this.right2loading = false;
|
});
|
},
|
// 有名无实
|
getselectYs() {
|
selectYs({ jurisdiction: this.value2 }).then(res => {
|
if (res.data.code === 200) {
|
this.rightData.ymwsNum = res.data.data.count;
|
this.dialogTable.ymTable = res.data.data.List;
|
} else {
|
this.$message.error(res.msg);
|
}
|
this.right2loading = false;
|
});
|
},
|
// 违规经营
|
getselectWg() {
|
selectWg({ jurisdiction: this.value2 }).then(res => {
|
if (res.data.code === 200) {
|
this.rightData.wgNum = res.data.data.count;
|
this.dialogTable.wgTable = res.data.data.list;
|
} else {
|
this.$message.error(res.msg);
|
}
|
this.right2loading = false;
|
});
|
},
|
// 现实表现差
|
getPoorPerformance(type) {
|
this.right1loading = true;
|
this.poorPerformanceType = type;
|
this.rightData.poorPerformance = 0;
|
this.rightData.qualification = 0;
|
|
// if (type === 1) {
|
// this.rightData.poorPerformance = 2;
|
// this.rightData.qualification = 3;
|
// this.right1loading = false;
|
// } else if (type === 2) {
|
// this.rightData.poorPerformance = 11;
|
// this.rightData.qualification = 14;
|
// this.right1loading = false;
|
// } else if (type === 3) {
|
// this.rightData.poorPerformance = 32;
|
// this.rightData.qualification = 45;
|
selectBx({
|
jurisdiction: this.value1,
|
type: this.poorPerformanceType
|
}).then(res => {
|
if (res.data.code === 200) {
|
this.rightData.poorPerformance = res.data.data[0].count;
|
} else {
|
this.$message.error(res.msg);
|
}
|
this.right1loading = false;
|
});
|
selectExtype({
|
jurisdiction: this.value1,
|
type: this.poorPerformanceType
|
}).then(res => {
|
if (res.data.code === 200) {
|
this.rightData.qualification = res.data.data[0].count;
|
} else {
|
this.$message.error(res.msg);
|
}
|
});
|
// selectExtypeUser().then(res => {
|
// if (res.status === 200) {
|
// this.rightData.qualification = res.data;
|
// } else {
|
// this.$message.error(res.msg);
|
// }
|
// });
|
// }
|
// this.right1loading = false;
|
},
|
peoWarning() {
|
this.rightData.materialNum = 0;
|
this.rightData.punishNum = 0;
|
this.rightData.wgNum = 0;
|
this.rightData.ymwsNum = 0;
|
this.right2loading = true;
|
this.getPunishNum();
|
this.getMaterial();
|
this.getselectWg();
|
this.getselectYs();
|
},
|
|
companyWarning() {
|
this.right1loading = true;
|
this.getPoorPerformance(3);
|
// this.getQualification();
|
},
|
|
goSystemHome() {
|
// this.$router.push({ path: "/register/index" });
|
// this.$router.push({ path: "/securityGuardManagement/register" });
|
this.$router.push({ path: website.fistPage.value });
|
}
|
},
|
mounted() {
|
this.getPeoplePosition();
|
// this.getCarPosition();
|
this.initEchart();
|
this.getHolderNum(0);
|
// this.getPoorPerformance(3);
|
// this.getTableData("car");
|
// this.initMap();
|
// this.getTableData(0);
|
// this.initMapEchart();
|
this.getOfficeData();
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
// 适配分辨率1280*1024
|
@media screen and (max-width: 1280px) {
|
@import "./index_1280_1024.scss";
|
}
|
// 适配分辨率1600*900
|
@media screen and (min-width: 1281px) and (max-width: 1600px) {
|
@import "./index_1600_900.scss";
|
}
|
// 适配分辨率1920*1080
|
@media screen and (min-width: 1601px) {
|
@import "./index.scss";
|
}
|
|
// @import "./index.scss";
|
/deep/ .el-select-dropdown {
|
border: 1px solid #9199ab;
|
background-color: #022c53;
|
}
|
/deep/ .el-select-dropdown__item.hover,
|
/deep/ .el-select-dropdown__item:hover {
|
background-color: #03203e;
|
}
|
/deep/ .el-loading-mask {
|
background-color: transparent !important;
|
}
|
/deep/ .el-table .cell {
|
text-align: center;
|
}
|
</style>
|
