From 79d9fc857559982b00b68b2d709807bdc4cd286f Mon Sep 17 00:00:00 2001
From: Administrator <admin>
Date: Mon, 11 Apr 2022 10:58:17 +0800
Subject: [PATCH] minio 地址修改
---
src/views/securityAnalysis/index.vue | 1280 ++++++++++++++++++++++++++++++++++++++++-----------------
1 files changed, 897 insertions(+), 383 deletions(-)
diff --git a/src/views/securityAnalysis/index.vue b/src/views/securityAnalysis/index.vue
index 6589e25..c1649f8 100644
--- a/src/views/securityAnalysis/index.vue
+++ b/src/views/securityAnalysis/index.vue
@@ -2,63 +2,333 @@
<div class="securityAnalysis">
<!-- securityAnalysis -->
<div class="securityAnalysisleft">
- <div class="examine" ref="ech1">
- <!-- 保安员审查情况统计
+ <!-- 保安员审查情况统计
<div>饼图</div> -->
+ <!-- </div> -->
+
+ <div class="examinesBtn" v-if="examineBtnVisiable">
+ <!-- <el-radio-group
+ v-model="tabPosition"
+ size="small"
+ @change="handleClick"
+ >
+ <el-radio-button label="1">保安员审查情况统计</el-radio-button>
+ <el-radio-button label="2">企业登录预警情况统计</el-radio-button>
+ </el-radio-group> -->
+ <el-dropdown class="examinesBtnChouse" @command="handleClick">
+ <span class="el-dropdown-link">
+ {{ examinesBtnChousetext }} <i class="el-icon-caret-bottom"></i>
+ </span>
+ <el-dropdown-menu slot="dropdown">
+ <el-dropdown-item command="1">保安员审查情况统计</el-dropdown-item>
+ <el-dropdown-item command="2"
+ >企业登录预警情况统计</el-dropdown-item
+ >
+ </el-dropdown-menu>
+ </el-dropdown>
+ <!-- <div class="examinesBtnChouse">
+ {{ examinesBtnChousetext }} <i class="el-icon-caret-bottom"></i>
+ </div> -->
</div>
- <div class="certificate" ref="ech2">
- <!-- 保安员持证情况统计
+ <div class="examines" v-show="showECH1">
+ <img
+ src="http://61.131.136.25:2080/img/table.png"
+ alt=""
+ class="myToolbox"
+ @click="openMyToolBox('保安员审查情况明细', 1)"
+ />
+ <div id="ech1" class="examinesin" ref="ech1">1</div>
+ </div>
+ <div class="examiness" v-show="!showECH1">
+ <img
+ src="http://61.131.136.25:2080/img/table.png"
+ alt=""
+ class="myToolbox"
+ @click="openMyToolBox('企业登录情况明细', 7)"
+ />
+ <div id="ech1s" class="examinessin" ref="ech1s"></div>
+ </div>
+ <!-- 保安员审查情况统计
<div>饼图</div> -->
+ <div class="certificate">
+ <img
+ src="http://61.131.136.25:2080/img/table.png"
+ alt=""
+ class="myToolbox"
+ @click="openMyToolBox('保安员持证情况明细', 2)"
+ />
+ <div class="certificatein" ref="ech2">
+ <!-- 保安员持证情况统计
+ <div>饼图</div> -->
+ </div>
</div>
+
+ <!-- <div class="czbut"></div> -->
</div>
<div class="securityAnalysiscenter">
- <div class="examination" ref="ech3">
- <!-- 保安员考试情况统计
+ <div class="examination">
+ <img
+ src="http://61.131.136.25:2080/img/table.png"
+ alt=""
+ class="myToolbox"
+ @click="openMyToolBox('保安员考试情况明细', 3)"
+ />
+ <div class="examinationin" ref="ech3">
+ <!-- 保安员考试情况统计
<div>堆叠面积图</div> -->
+ </div>
</div>
- <div class="dispatchUnit" ref="ech4">
- <!-- 派遣服务单位统计
+
+ <div class="dispatchUnit">
+ <img
+ src="http://61.131.136.25:2080/img/table.png"
+ alt=""
+ class="myToolbox"
+ @click="openMyToolBox('派遣服务单位明细', 4)"
+ />
+ <div class="dispatchUnitin" ref="ech4">
+ <!-- 派遣服务单位统计
<div>柱状图</div> -->
+ </div>
</div>
</div>
<div class="securityAnalysisright">
- <div class="dispatchSecurity" ref="ech5">
- <!-- 保安派遣情况统计
+ <div class="dispatchSecurity">
+ <img
+ src="http://61.131.136.25:2080/img/table.png"
+ alt=""
+ class="myToolbox"
+ @click="openMyToolBox('保安员年龄分布情况明细', 5)"
+ />
+ <div class="dispatchSecurityin" ref="ech5">
+ <!-- 保安员年龄分布情况统计
<div>饼图</div> -->
+ </div>
</div>
- <div class="socialSecurity" ref="ech6">
- <!-- 社保缴纳情况统计
+ <div class="socialSecurity">
+ <img
+ src="http://61.131.136.25:2080/img/table.png"
+ alt=""
+ class="myToolbox"
+ @click="openMyToolBox('保安员学历分布情况明细', 6)"
+ />
+ <div class="socialSecurityin" ref="ech6">
+ <!-- 社保缴纳情况统计
<div>饼图</div> -->
+ </div>
</div>
+ </div>
+ <div>
+ <el-dialog
+ width="80%"
+ :title="titles"
+ append-to-body
+ :visible.sync="dialogVisible"
+ lock-scroll="false"
+ top="1vh"
+ center
+ >
+ <situation
+ :card="{ deptId: deptid, jurisdiction: jurisdiction }"
+ v-if="sees == 1"
+ >
+ <!-- 保安员审查情况统计 -->
+ </situation>
+
+ <loginRecord :card="{ jurisdiction: jurisdiction }" v-if="sees == 7">
+ <!-- 保安员审查情况统计 -->
+ </loginRecord>
+
+ <certificate
+ :card="{ deptId: deptid, jurisdiction: jurisdiction }"
+ v-if="sees == 2"
+ >
+ <!-- 保安员持证情况统计 -->
+ </certificate>
+ <examination
+ :card="{ deptid: deptid, jurisdiction: jurisdiction }"
+ v-if="sees == 3"
+ >
+ <!-- 保安员考试情况统计 -->
+ </examination>
+ <dispatch
+ :card="{ deptId: deptid, jurisdiction: jurisdiction }"
+ v-if="sees == 4"
+ >
+ <!-- 派遣服务单位 注意deptId I为大写 -->
+ </dispatch>
+ <assignment
+ :card="{ deptid: deptid, jurisdiction: jurisdiction }"
+ v-if="sees == 5"
+ >
+ <!-- 保安派遣情况 -->
+ </assignment>
+ <socialSecurity
+ :card="{ deptid: deptid, jurisdiction: jurisdiction }"
+ :reself="dialogVisible"
+ v-if="sees == 6"
+ >
+ <!-- 社保缴纳情况 -->
+ </socialSecurity>
+ </el-dialog>
</div>
</div>
</template>
-
<script>
import {
getinformationselectExtype, //保安员审查情况统计
getinformationselectHold, //保安员持证
getinformationselectDis, //派遣服务单位
getinformationstatistics, //保安员考试情况统计
- getinformationselectDisp, //保安派遣数量
+ getExamStatisInfo, //保安员考试情况统计
+ getinformationselectDisp, //保安派遣情况
+ getAgeStatistics, //保安员年龄分布情况
getinformationselectSoil, //社保缴纳情况统计
+ getEducationStatistics,
+ getLoginDataStatistics
} from "@/api/securityAnalysis/securityAnalysis";
-import { lang } from "moment";
+import { mapGetters } from "vuex";
+import { mapState } from "vuex";
+import { getRoleDetail } from "@/api/system/role";
+import certificate from "./child/certificate.vue";
+import examination from "./child/examination.vue";
+import situation from "./child/situation.vue";
+import loginRecord from "./child/loginRecord.vue";
+import dispatch from "./child/dispatch.vue";
+import assignment from "./child/assignment.vue";
+import socialSecurity from "./child/socialSecurity.vue";
export default {
+ components: {
+ certificate,
+ examination,
+ situation,
+ dispatch,
+ assignment,
+ socialSecurity,
+ loginRecord
+ },
data() {
return {
EC1: "", //保安员审查情况统计 // 饼图
+ EC1s: "", //登录预警统计 // 饼图
EC2: "", //保安员持证情况统计 // 饼图
EC3: "", //保安员考试情况统计 // 堆叠面积图
EC4: "", //派遣服务单位统计 // 柱状图
EC5: "", //保安派遣情况统计 // 饼图
EC6: "", //社保缴纳情况统计 // 饼图
- deptid: "1412222599212257282",
+ deptid: "",
+ oneVisiable: true,
+ examineBtnVisiable: true,
+ jurisdiction: "",
+ tabPosition: 1,
+ examinetionTitle: "保安员审查情况统计",
+ examine1: [],
+ dialogVisible: false,
+ titles: "",
+ sees: "",
+ colors: ["#29C093", "#F34A4A"], //[正常，异常]；
+ showECH1: true, //显示保安员审查情况统计或企业登录预警情况统计
+ changeSizeTime: null,
+ examinesBtnChousetext: "保安员审查情况统计"
};
},
+ computed: {
+ ...mapState({
+ userInfo: state => state.user.userInfo
+ }),
+ ...mapGetters(["windowWidth", "windowHeight"]),
+ ids1() {
+ let ids1 = [];
+ this.selectionList1.forEach(ele => {
+ ids1.push(ele.id);
+ });
+ return ids1.join(",");
+ },
+ ids2() {
+ let ids2 = [];
+ this.selectionList2.forEach(ele => {
+ ids2.push(ele.id);
+ });
+ return ids2.join(",");
+ }
+ },
+ watch: {
+ dialogVisible() {
+ if (this.dialogVisible == false && this.sees == "1") {
+ this.getEC1(this.tabPosition);
+ }
+ if (this.dialogVisible == false && this.sees == "2") {
+ this.getEC2();
+ }
+ if (this.dialogVisible == false && this.sees == "3") {
+ this.getEC3();
+ }
+ if (this.dialogVisible == false && this.sees == "4") {
+ this.getEC4();
+ }
+ if (this.dialogVisible == false && this.sees == "5") {
+ this.getEC5();
+ }
+ if (this.dialogVisible == false && this.sees == "6") {
+ this.getEC6();
+ }
+ },
+ windowWidth() {
+ let that = this;
+ if (that.changeSizeTime) {
+ return;
+ } else {
+ that.changeSizeTime = setTimeout(() => {
+ that.changeSize();
+ clearTimeout(that.changeSizeTime);
+ that.changeSizeTime = null;
+ }, 600);
+ }
+ },
+ windowHeight() {
+ let that = this;
+ if (that.changeSizeTime) {
+ return;
+ } else {
+ that.changeSizeTime = setTimeout(() => {
+ that.changeSize();
+ clearTimeout(that.changeSizeTime);
+ that.changeSizeTime = null;
+ }, 600);
+ }
+ }
+ },
methods: {
+ //更新图表尺寸
+ changeSize() {
+ console.log("更新图表尺寸");
+ this.EC1.resize();
+ this.EC1s.resize();
+ this.EC2.resize();
+ this.EC3.resize();
+ this.EC4.resize();
+ this.EC5.resize();
+ this.EC6.resize();
+ },
+ //tab 切换
+ handleClick(val) {
+ // if (val == this.tabPosition) {
+ // return;
+ // }
+ if (val == 1) {
+ this.showECH1 = true;
+ this.examinesBtnChousetext = "保安员审查情况统计";
+ } else {
+ this.showECH1 = false;
+ this.examinesBtnChousetext = "企业登录预警情况统计";
+ }
+ this.tabPosition = val;
+ this.getEC1(val);
+ },
creatOurEcharts() {
+ // return;
this.EC1 = echarts.init(this.$refs.ech1);
+ this.EC1s = echarts.init(this.$refs.ech1s);
this.EC2 = echarts.init(this.$refs.ech2);
this.EC3 = echarts.init(this.$refs.ech3);
this.EC4 = echarts.init(this.$refs.ech4);
@@ -66,126 +336,161 @@
this.EC6 = echarts.init(this.$refs.ech6);
this.biginOUREC();
},
- getEC1() {
- var that = this;
- getinformationselectExtype(this.deptid).then((res) => {
- // console.log(res);
- var a = res.data.data[0];
- var d = [
+ changedata(a, ok, no, okmsg, nomsg) {
+ var d = [];
+ if (a.length != 0) {
+ var yes = 0,
+ not = 0;
+ for (var k in a) {
+ yes += a[k][ok];
+ not += a[k][no];
+ }
+ d = [
{
- value: a.bzc,
- name: "未审核",
+ value: yes,
+ name: okmsg
},
{
- value: a.zc,
- name: "已审核",
- },
+ value: not,
+ name: nomsg
+ }
];
-
- that.setEC1(d);
- });
+ } else {
+ d = [
+ {
+ value: 0,
+ name: okmsg
+ },
+ {
+ value: 0,
+ name: nomsg
+ }
+ ];
+ }
+ // console.log(d, ok, no);
+ return d;
+ },
+ getTime() {
+ var data = new Date();
+ var time = data.toLocaleString().slice(0, 9);
+ return time;
+ },
+ GetPercent(num, total) {
+ num = parseFloat(num);
+ total = parseFloat(total);
+ if (isNaN(num) || isNaN(total)) {
+ return "-";
+ }
+ return total <= 0
+ ? "0%"
+ : Math.round((num / total) * 10000) / 100.0 + "%";
+ },
+ openMyToolBox(titles, id) {
+ var that = this;
+ that.dialogVisible = true;
+ that.sees = id;
+ that.titles = titles;
+ },
+ gettoolbox(title, titles, id) {
+ //由于在1366，,768分辨率下，会被覆盖掉不能点击，所以放弃
+ return;
+ var that = this;
+ return {
+ show: false,
+ itemSize: 25,
+ top: 5,
+ right: 15,
+ feature: {
+ myTool1: {
+ show: true,
+ zlevel: 999,
+ z: 999,
+ title: "点击查看详情",
+ icon: "image://http://61.131.136.25:2080/img/table.png",
+ onclick: function() {
+ that.dialogVisible = true;
+ that.sees = id;
+ that.titles = titles;
+ }
+ }
+ }
+ };
+ },
+ setColor(d, color) {
+ for (var k in d) {
+ var itemStyle = {
+ color: color[k]
+ };
+ d[k]["itemStyle"] = itemStyle;
+ }
+ console.log(d);
+ return d;
+ },
+ getEC1(tab) {
+ var that = this;
+ if (tab == 1) {
+ getinformationselectExtype(this.deptid, this.jurisdiction)
+ .then(res => {
+ var a = res.data.data;
+ var b = that.changedata(a, "zc", "bzc", "情况正常", "情况异常");
+ that.setEC1(b);
+ that.EC1.resize();
+ })
+ .catch(res => {
+ var b = that.changedata([], "zc", "bzc", "情况正常", "情况异常");
+ that.setEC1(b);
+ that.EC1.resize();
+ });
+ }
+ if (tab == 2) {
+ getLoginDataStatistics(this.jurisdiction).then(res => {
+ var b = res.data.data;
+ var data = [
+ {
+ value: b[0],
+ name: "近14天登录企业数"
+ },
+ {
+ value: b[1],
+ name: "近14天未登录企业数"
+ }
+ ];
+ that.setEC1s(data);
+ that.EC1s.resize();
+ });
+ }
},
setEC1(d) {
+ this.examine1 = [
+ {
+ title: "审查时间：",
+ value: this.getTime()
+ },
+ {
+ title: "问题保安员人数：",
+ value: d[1].value + "人"
+ },
+ {
+ title: "问题保安员比例：",
+ value: this.GetPercent(+d[1].value, +d[0].value + +d[1].value)
+ }
+ ];
var option, data;
- if (d) {
- data = d;
- } else {
- data = [
- { value: 1048, name: "搜索引擎" },
- { value: 735, name: "直接访问" },
- { value: 580, name: "邮件营销" },
- { value: 484, name: "联盟广告" },
- { value: 300, name: "视频广告" },
- ];
- }
- // console.log(data);
+ data = this.setColor(d, this.colors);
option = {
title: {
- text: "保安员审查情况统计",
- // subtext: "纯属虚构",
- left: "center",
+ text: this.examinetionTitle,
+ top: 25,
+ left: "center"
},
tooltip: {
- trigger: "item",
+ trigger: "item"
},
legend: {
- orient: "vertical",
- left: "left",
+ x: "center",
+ y: "90%"
},
- series: [
- {
- // name: "访问来源",
- type: "pie",
- radius: "50%",
- // data: data,
- data: [
- { value: 1, name: "在逃人员" },
- { value: 3, name: "吸毒人员" },
- { value: 10, name: "刑释解教人员" },
- { value: 5, name: "社会闲散青少年" },
- { value: 11, name: "艾滋病人" },
- { value: 26, name: "其他人员" },
- ],
- emphasis: {
- itemStyle: {
- shadowBlur: 10,
- shadowOffsetX: 0,
- shadowColor: "rgba(0, 0, 0, 0.5)",
- },
- },
- },
- ],
- };
-
- this.EC1.setOption(option);
- },
- getEC2() {
- var that = this;
- getinformationselectHold(this.deptid).then((res) => {
- var a = res.data.data[0];
- console.log(res);
- var d = [
- {
- value: a.wcz,
- name: "未持证",
- },
- {
- value: a.cz,
- name: "持证",
- },
- ];
-
- that.setEC2(d);
- });
- },
- setEC2(d) {
- var option;
- var option, data;
- if (d) {
- data = d;
- } else {
- data = [
- { value: 1048, name: "搜索引擎" },
- { value: 735, name: "直接访问" },
- { value: 580, name: "邮件营销" },
- { value: 484, name: "联盟广告" },
- { value: 300, name: "视频广告" },
- ];
- }
- // console.log(data);
- option = {
- title: {
- text: "保安员持证情况统计",
- // subtext: "纯属虚构",
- left: "center",
- },
- tooltip: {
- trigger: "item",
- },
- legend: {
- orient: "vertical",
- left: "left",
- },
+ // toolbox: this.gettoolbox("审查情况查询", "保安员审查情况明细", 1),
series: [
{
// name: "访问来源",
@@ -196,280 +501,398 @@
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
- shadowColor: "rgba(0, 0, 0, 0.5)",
- },
+ shadowColor: "rgba(0, 0, 0, 0.5)"
+ }
},
- },
- ],
- };
-
- this.EC2.setOption(option);
- },
- getEC3() {
- var that = this;
- getinformationstatistics(this.deptid).then((res) => {
- var a = res.data.data,
- s = [],
- l = [];
- console.log(a); // 0 :理论 1：实操
- for (var k in a[0]) {
- l.push(a[0][k]);
- s.push(a[1][k]);
- }
- this.setEC3(s, l);
- });
- },
- setEC3(s, l) {
- var xd = [],
- sd = [],
- ld = [];
- for (var i = 0; i < 100; i++) {
- xd.push(i + "分");
- }
- console.log(sd);
- var option = {
- title: {
- text: "保安员考试情况统计",
- left: "center",
- top: 20,
- },
- tooltip: {
- trigger: "axis",
- axisPointer: {
- type: "cross",
label: {
- backgroundColor: "#6a7985",
- },
- },
- // formatter(params) {
- // console.log(params);
- // var str = "";
- // for (var x in params) {
- // str += params[x].axisValue + ":" + params[x].data + "/n";
- // }
- // return str;
- // },
- formatter:
- "<span>实操成绩</span>({b0}) : {c0}<span>人</span><br /><span>理论成绩</span>({b1}) : {c1}<span>人</span>",
- },
- legend: {
- data: ["实操成绩", "理论成绩"],
- },
- toolbox: {
- feature: {
- saveAsImage: {},
- },
- },
- grid: {
- left: "3%",
- right: "5%",
- bottom: "3%",
- containLabel: true,
- },
- xAxis: [
- {
- type: "category",
- boundaryGap: false,
- // data: ["0~60分", "60~80分", "80~90分", "90~100分"],
- data: xd,
- },
- ],
- yAxis: [
- {
- type: "value",
- },
- ],
- series: [
- {
- name: "实操成绩",
- type: "line",
- stack: "总量",
- areaStyle: {},
- emphasis: {
- focus: "series",
- },
- // data: [1, 2, 3, 1],
- data: [
- 1, 0, 0, 0, 3, 2, 1, 0, 4, 0, 5, 0, 4, 0, 0, 9, 7, 0, 2, 0, 5, 0,
- 0, 0, 7, 9, 0, 0, 7, 0, 5, 0, 7, 1, 0, 9, 2, 0, 0, 0, 3, 0, 0, 0,
- 7, 9, 0, 0, 7, 0, 5, 0, 7, 24, 2, 9, 7, 37, 0, 3, 5, 0, 0, 0, 7,
- 9, 1, 0, 7, 0, 5, 4, 2, 0, 0, 9, 7, 35, 0, 0, 3, 0, 0, 12, 7, 9,
- 0, 0, 7, 0, 2, 0, 7, 0, 0, 9, 7, 0, 0, 1,
- ],
- // data: s,
- },
- {
- name: "理论成绩",
- type: "line",
- stack: "总量",
- areaStyle: {},
- emphasis: {
- focus: "series",
- },
- data: [
- 4, 0, 5, 0, 7, 3, 2, 9, 7, 1, 0, 3, 5, 0, 9, 7, 0, 2, 0, 0, 7, 0,
- 2, 0, 7, 0, 0, 9, 5, 0, 0, 0, 7, 9, 0, 0, 7, 0, 5, 0, 7, 1, 0, 9,
- 2, 0, 0, 50, 3, 0, 30, 0, 7, 9, 0, 20, 7, 40, 0, 0, 0, 7, 9, 1, 0,
- 7, 0, 5, 4, 2, 0, 0, 9, 7, 35, 0, 0, 3, 0, 0, 12, 7, 9, 0, 7, 0,
- 0, 11, 0, 0, 0, 3, 2, 1, 0, 4, 0, 5, 0, 3,
- ],
- // data: l,
- },
- ],
+ formatter: "{name|{b}}\n({d}%)",
+ rich: {
+ time: {
+ fontSize: 10,
+ color: "#999"
+ }
+ }
+ }
+ }
+ ]
};
- this.EC3.setOption(option);
+ this.EC1.setOption(option);
},
- getEC4() {
- var that = this;
- getinformationselectDis(this.deptid).then((res) => {
- var a = res.data.data,
- xd = [],
- d = [];
- // console.log(a);
- for (var k in a) {
- xd.push(a[k].name);
- d.push(a[k].num);
- }
- that.setEC4(d, xd);
- });
- },
- setEC4(d, xd) {
- var xxd = [
- "一月",
- "二月",
- "三月",
- "四月",
- "五月",
- "六月",
- "七月",
- "八月",
- "九月",
- "十月",
- "一月",
- "二月",
- ],
- dd = [120, 200, 150, 80, 70, 110, 130, 120, 200, 150, 80, 70];
- var option = {
- title: {
- text: "派遣服务单位统计",
- left: "center",
- },
- xAxis: {
- type: "category",
- data: xxd,
- // data: xd,
- },
- yAxis: {
- type: "value",
- },
- tooltip: {
- trigger: "item",
- },
- series: [
- {
- data: dd,
- // data: d,
- type: "bar",
- },
- ],
- };
- this.EC4.setOption(option);
- },
- getEC5() {
- var that = this;
- getinformationselectDisp(this.deptid).then((res) => {
- var a = res.data.data,
- d = [];
- // console.log(a);
- for (var k in a) {
- d.push({
- value: a[k].num,
- name: a[k].real_name,
- });
- }
- that.setEC5(d);
- });
- },
- setEC5(d) {
- var option;
-
+ //登录情况统计
+ setEC1s(d) {
+ var option, data;
+ data = this.setColor(d, this.colors);
option = {
title: {
- text: "保安派遣情况统计",
- // subtext: "纯属虚构",
- left: "center",
+ text: "",
+ top: 25,
+ left: "center"
},
tooltip: {
- trigger: "item",
+ trigger: "item"
},
legend: {
- orient: "vertical",
- left: "left",
+ x: "center",
+ y: "90%"
},
+ // toolbox: this.gettoolbox("登录情况查询", "企业登录情况明细", 7),
+ series: [
+ {
+ type: "pie",
+ radius: "50%",
+ data: data,
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: "rgba(0, 0, 0, 0.5)"
+ }
+ },
+ label: {
+ formatter: "{name|{b}}\n({d}%)",
+ rich: {
+ time: {
+ fontSize: 10,
+ color: "#999"
+ }
+ }
+ }
+ }
+ ]
+ };
+ this.EC1s.setOption(option);
+ },
+ getEC2() {
+ var that = this;
+ getinformationselectHold(this.deptid, this.jurisdiction)
+ .then(res => {
+ var a = res.data.data;
+ var b = that.changedata(a, "cz", "wcz", "持证", "未持证");
+ that.setEC2(b);
+ })
+ .catch(res => {
+ var b = that.changedata([], "cz", "wcz", "持证", "未持证");
+ that.setEC2(b);
+ });
+ },
+ setEC2(data) {
+ var option;
+ var that = this;
+ data = this.setColor(data, this.colors);
+ // console.log(data, "持证");
+ option = {
+ title: {
+ text: "保安员持证情况统计",
+ // subtext: "纯属虚构",
+ top: 25,
+ left: "center"
+ },
+ tooltip: {
+ trigger: "item"
+ },
+ legend: {
+ // orient: "vertical",
+ // left: "left", x: "center",
+ x: "center",
+ y: "83%"
+ },
+ // toolbox: this.gettoolbox("持证情况查询", "保安员持证情况明细", 2),
series: [
{
// name: "访问来源",
type: "pie",
radius: "50%",
- // data: d,
- data: [
- {
- value: 4,
- name: "未派遣",
- },
- {
- value: 3,
- name: "已派遣",
- },
- ],
+ data: data,
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
- shadowColor: "rgba(0, 0, 0, 0.5)",
- },
+ shadowColor: "rgba(0, 0, 0, 0.5)"
+ }
},
- },
+ label: {
+ formatter: "{name|{b}}\n({d}%)",
+ rich: {
+ time: {
+ fontSize: 10,
+ color: "#999"
+ }
+ }
+ }
+ }
+ ]
+ };
+
+ this.EC2.setOption(option);
+ },
+ getEC3() {
+ getExamStatisInfo(this.deptid, this.jurisdiction).then(res => {
+ this.setEC3(res.data.data);
+ });
+ },
+ //考试数据统计
+ setEC3(data) {
+ //获取年份
+ const seriesdata = [];
+ data.forEach(item => {
+ if (item.type == 1) {
+ seriesdata.push({
+ name: item.name + "-合格人数",
+ type: "bar",
+ stack: item.name,
+ emphasis: {
+ focus: "series"
+ },
+ data: item.examSocreStatis
+ });
+ }
+ if (item.type == 2) {
+ seriesdata.push({
+ name: item.name + "-不合格人数",
+ type: "bar",
+ stack: item.name,
+ emphasis: {
+ focus: "series"
+ },
+ data: item.examSocreStatis
+ });
+ }
+ });
+ var datetime = [
+ "1月",
+ "2月",
+ "3月",
+ "4月",
+ "5月",
+ "6月",
+ "7月",
+ "8月",
+ "9月",
+ "10月",
+ "11月",
+ "12月"
+ ];
+ //echarts 图表数据
+ var option = {
+ title: {
+ text: "保安员考试情况统计",
+ left: "center",
+ top: 20
+ },
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ type: "shadow"
+ }
+ },
+ color: ["#91CD76", "#EF6667"],
+ legend: {
+ data: ["a", "b"],
+ icon: "circle",
+ itemWidth: 10,
+ itemHeight: 10,
+ itemGap: 20
+ },
+ // toolbox: this.gettoolbox("考试情况查询", "保安员考试情况明细", 3),
+ grid: {
+ left: "3%",
+ right: "4%",
+ bottom: "3%",
+ containLabel: true
+ },
+ xAxis: [
+ {
+ type: "category",
+ data: datetime
+ }
],
+ yAxis: [
+ {
+ type: "value"
+ }
+ ],
+ series: seriesdata
+ };
+
+ this.EC3.setOption(option);
+ },
+ getEC4() {
+ var date = new Date();
+ var nowYear = date.getFullYear();
+ var that = this;
+ getinformationselectDis(this.deptid, this.jurisdiction).then(res => {
+ var a = res.data,
+ d = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
+
+ var setNum = (start, end, i) => {
+ // console.log(start, end, i);
+ for (let a = +start - 1; a < +end; a++) {
+ ++d[a];
+ }
+ };
+ for (var k = 0; k < a.length; k++) {
+ var overYear = a[k].end_time.slice(0, 4);
+ var overMout = a[k].end_time.slice(5, 7);
+ var bigYear = a[k].start_time.slice(0, 4);
+ var bigMout = a[k].start_time.slice(5, 7);
+ if (overYear > nowYear) {
+ if (bigYear < nowYear) {
+ setNum(1, 12, k);
+ } else if (bigYear == nowYear) {
+ setNum(+bigMout, 12, k);
+ }
+ } else if (overYear == nowYear) {
+ if (bigYear < nowYear) {
+ setNum(1, +overMout, k);
+ } else if (bigYear == nowYear) {
+ setNum(+bigMout, +overMout, k);
+ }
+ }
+ }
+ that.setEC4(d);
+ });
+ },
+ setEC4(data) {
+ var xxd = [
+ "1月",
+ "2月",
+ "3月",
+ "4月",
+ "5月",
+ "6月",
+ "7月",
+ "8月",
+ "9月",
+ "10月",
+ "11月",
+ "12月"
+ ];
+ var date = new Date();
+ var d = date.getFullYear();
+ // console.log(d);
+ var option = {
+ title: {
+ text: "派遣服务单位统计",
+ top: 20,
+ left: "center"
+ },
+ xAxis: {
+ type: "category",
+ data: xxd
+ // data: xd,
+ },
+ // toolbox: this.gettoolbox("派遣单位查询", "派遣服务单位明细", 4),
+ yAxis: {
+ type: "value"
+ },
+ tooltip: {
+ trigger: "item",
+ formatter: d + "年{b} : {c} 个"
+ },
+ series: [
+ {
+ data: data,
+ type: "bar"
+ }
+ ]
+ };
+ this.EC4.setOption(option);
+ },
+ getEC5() {
+ var that = this;
+ getAgeStatistics(this.deptid, this.jurisdiction).then(res => {
+ var data = res.data.data;
+ var a = [
+ {
+ value: data[0],
+ name: "18-30周岁"
+ },
+ {
+ value: data[1],
+ name: "30-45周岁"
+ },
+ {
+ value: data[2],
+ name: "45-60周岁"
+ }
+ ];
+ console.log(a, "111111");
+ this.setEC5(a);
+ });
+ },
+ setEC5(d) {
+ var option;
+ // d = this.setColor(d, this.colors);
+ option = {
+ title: {
+ text: "保安员年龄分布情况统计",
+ // subtext: "纯属虚构",
+ top: 25,
+ left: "center"
+ },
+ tooltip: {
+ trigger: "item"
+ },
+ // toolbox: this.gettoolbox(
+ // "保安员年龄分布情况查询",
+ // "保安员年龄分布情况明细",
+ // 5
+ // ),
+ legend: {
+ x: "center",
+ y: "90%"
+ },
+ series: [
+ {
+ type: "pie",
+ radius: "50%",
+ data: d,
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: "rgba(0, 0, 0, 0.5)"
+ }
+ },
+ label: {
+ formatter: "{b}\n({d}%)"
+ }
+ }
+ ]
};
this.EC5.setOption(option);
},
getEC6() {
var that = this;
- getinformationselectSoil(this.deptid).then((res) => {
- var a = res.data.data[0];
- // console.log(a);
- var d = [
- {
- value: a.nmuwj,
- name: "未缴纳社保",
- },
- {
- value: a.numj,
- name: "已缴纳社保",
- },
- ];
-
- that.setEC6(d);
+ getEducationStatistics(this.deptid, this.jurisdiction).then(res => {
+ var a = res.data.data;
+ that.setEC6(a);
});
},
setEC6(d) {
var option;
-
+ // d = this.setColor(d, this.colors);
option = {
title: {
- text: "社保缴纳情况统计",
- // subtext: "纯属虚构",
- left: "center",
+ text: "保安员学历分布情况统计",
+ top: 25,
+ left: "center"
},
tooltip: {
- trigger: "item",
+ trigger: "item"
},
+ // toolbox: this.gettoolbox(
+ // "保安员学历分布情况查询",
+ // "保安员学历分布情况明细",
+ // 6
+ // ),
legend: {
- orient: "vertical",
- left: "left",
+ // orient: "vertical",
+ // left: "left",
+ x: "center",
+ y: "83%"
},
series: [
{
@@ -481,17 +904,30 @@
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
- shadowColor: "rgba(0, 0, 0, 0.5)",
- },
+ shadowColor: "rgba(0, 0, 0, 0.5)"
+ }
},
- },
- ],
+ label: {
+ // alignTo: "edge",
+ formatter: "{name|{b}}\n({d}%)",
+ // minMargin: 5,
+ // edgeDistance: 10,
+ // lineHeight: 15,
+ rich: {
+ time: {
+ fontSize: 10,
+ color: "#999"
+ }
+ }
+ }
+ }
+ ]
};
this.EC6.setOption(option);
},
biginOUREC() {
- this.getEC1();
+ this.getEC1(1);
this.getEC2();
this.getEC3();
this.getEC4();
@@ -503,34 +939,61 @@
// this.setEC4();
// this.setEC5();
// this.setEC6();
- },
+ }
+ },
+ created() {
+ if (
+ this.userInfo.role_name == "保安公司管理员" ||
+ this.userInfo.role_name == "分公司管理员"
+ ) {
+ this.examinetionTitle = "保安员审查情况统计";
+ this.examineBtnVisiable = false;
+ } else {
+ this.examinetionTitle = "";
+ }
},
mounted() {
this.$nextTick(() => {
- this.creatOurEcharts();
+ var roleIds = this.userInfo.role_id.split(",");
+ roleIds.forEach(roleId => {
+ getRoleDetail(roleId).then(res => {
+ var roleAlias = res.data.data.roleAlias;
+ var roleName = res.data.data.roleName;
+ if (roleName != "保安公司管理员" && roleName != "分公司管理员") {
+ this.deptid = "";
+ this.jurisdiction = this.userInfo.jurisdiction;
+ } else {
+ this.deptid = this.userInfo.dept_id;
+ this.jurisdiction = "";
+ }
+ this.creatOurEcharts();
+ });
+ });
});
- // console.log(echarts);
- },
+ }
};
</script>
<style lang="scss">
-$widths: 30%;
+$widths: 20%;
.securityAnalysis {
width: 100%;
- height: 100%;
+ height: calc(100% - 35px);
// border: 1px solid #000;
display: flex;
align-items: center;
justify-content: space-around;
box-sizing: border-box;
+
.securityAnalysisleft,
.securityAnalysiscenter,
.securityAnalysisright {
- // border: 1px solid #000;
- width: 30%;
+ // // border: 1px solid #000;
+ position: relative;
+ width: 29%;
height: 100%;
- box-sizing: border-box;
+ // border: 1px solid red;
+ // box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-around;
@@ -539,26 +1002,77 @@
.securityAnalysiscenter {
width: 40% !important;
}
- .examine,
- .certificate,
.examination,
.dispatchUnit,
.dispatchSecurity,
.socialSecurity {
+ position: relative;
width: 100%;
height: 49%;
// border: 1px solid #000;
box-sizing: border-box;
background-color: #fff;
}
- // .securityAnalysisleft {
- // width: $widths;
- // }
- // .securityAnalysiscenter {
- // width: $widths;
- // }
- // .securityAnalysisright {
- // width: $widths;
- // }
+
+ .certificate {
+ position: relative;
+ width: 100%;
+ height: 49%;
+ // top: 13.3rem;
+ box-sizing: border-box;
+ background-color: #fff;
+ }
+
+ .examinesBtn {
+ top: 0;
+ left: 0;
+ position: absolute;
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background-color: #fff;
+ .examinesBtnChouse {
+ background-color: #409eff;
+ padding: 5px 10px;
+ border-radius: 5px;
+ color: #fff;
+ position: relative;
+ top: 20px;
+ z-index: 900;
+ text-align: center;
+ }
+ }
+ .examines,
+ .examiness {
+ width: 100%;
+ height: 49%;
+ // display: flex;
+ // align-items: center;
+ background-color: #fff;
+ }
+
+ //myself
+ .examinesin,
+ .examinessin,
+ .certificatein,
+ .examinationin,
+ .dispatchUnitin,
+ .dispatchSecurityin,
+ .socialSecurityin {
+ width: 100%;
+ height: 100%;
+ }
+ .myToolbox {
+ position: absolute;
+ top: 14px;
+ right: 20px;
+ width: 25px;
+ height: 25px;
+ cursor: pointer;
+ z-index: 1000;
+ &:hover {
+ }
+ }
}
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.9.3