From b6d9bbb38cc344d1538439750c3db5a4a6b0d79a Mon Sep 17 00:00:00 2001
From: zhengpz <1838927346@qq.com>
Date: Sun, 22 Aug 2021 17:53:53 +0800
Subject: [PATCH] 首页及表完善
---
src/views/securityUnitOperation/securityEchart.js | 113 ++++++-
src/views/home/index.vue | 71 ++--
src/api/index/index.js | 5
src/views/statisticalQueryManagement/companyDetails.vue | 113 ++++++-
src/views/statisticalQueryManagement/securityGuardStatistics.vue | 217 +++++++++++----
src/views/securityUnitOperation/economicAnalysis.vue | 19 +
src/views/securityUnitOperation/economicTable.vue | 2
src/views/securityUnitOperation/operationAnalysis.vue | 255 +++++++++++++++--
src/views/securityUnitOperation/operationTable.vue | 37 +
9 files changed, 647 insertions(+), 185 deletions(-)
diff --git a/src/api/index/index.js b/src/api/index/index.js
index 1f9bb78..ae279e0 100644
--- a/src/api/index/index.js
+++ b/src/api/index/index.js
@@ -88,10 +88,11 @@
});
};
// 资格审查异常人员清单
-export const qualificationPages = () => {
+export const qualificationPages = (params) => {
return request({
url: "/api/blade-user/pages",
- method: "get"
+ method: "get",
+ params: params
});
};
// 监管处罚数量
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 78d00b7..323cc02 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -274,12 +274,10 @@
<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="getQualificationPages">{{
+ <span class="showDialog" @click="shoeDialog">{{
rightData.qualification
}}</span>
- <span class="showDialog" @click="getQualificationPages"
- >资格审查异常</span
- >
+ <span class="showDialog" @click="shoeDialog">资格审查异常</span>
</div>
</div>
<!-- <div class="card-text"> -->
@@ -309,21 +307,21 @@
<div class="rightData rightData1">
<img src="../../../public/img/bajgxt/u231.png" alt />
<div class="text">
- <span>数据更新异常</span>
+ <span>违规经营</span>
<span>45个</span>
</div>
</div>
<div class="rightData rightData2">
<img src="../../../public/img/bajgxt/u232.png" alt />
<div class="text">
- <span>材料不齐全</span>
+ <span>经营不善</span>
<span>{{ rightData.materialNum }}个</span>
</div>
</div>
<div class="rightData rightData3">
<img src="../../../public/img/bajgxt/u233.png" alt />
<div class="text">
- <span>业务经营异常</span>
+ <span>有名无实</span>
<span>12个</span>
</div>
</div>
@@ -377,17 +375,32 @@
<el-table-column type="index"> </el-table-column>
<el-table-column prop="realName" label="保安姓名"></el-table-column>
<el-table-column prop="deptName" label="保安公司"></el-table-column>
- <el-table-column prop="sexName" label="性别"></el-table-column>
- <el-table-column prop="" label="身份证号"></el-table-column>
- <el-table-column prop="" label="年龄"></el-table-column>
- <el-table-column prop="" label="出生日期"></el-table-column>
- <el-table-column prop="" label="保安员证编号"></el-table-column>
- <el-table-column prop="" label="联系方式"></el-table-column>
- <el-table-column prop="" label="审查状态"></el-table-column>
- <el-table-column prop="" label="审查明细"></el-table-column>
+ <el-table-column
+ prop="sex"
+ label="性别"
+ :formatter="sexFormatter"
+ ></el-table-column>
+ <el-table-column prop="cardid" label="身份证号"></el-table-column>
+ <el-table-column prop="age" label="年龄"></el-table-column>
+ <el-table-column prop="birthday" label="出生日期"></el-table-column>
+ <el-table-column
+ prop="securitynumber"
+ label="保安员证编号"
+ ></el-table-column>
+ <el-table-column prop="phone" label="联系方式"></el-table-column>
+ <el-table-column
+ prop="examinationType"
+ label="审查状态"
+ :formatter="examinationFormatter"
+ ></el-table-column>
+ <el-table-column
+ prop="examinationMx"
+ label="审查明细"
+ ></el-table-column>
</el-table>
<el-pagination
@current-change="getQualificationPages"
+ @size-change="getQualificationPages"
:current-page="gridData.current"
:page-size="10"
layout="total, prev, pager, next, jumper"
@@ -505,17 +518,13 @@
}
},
methods: {
- startMove() {
- // eslint-disable-next-line
- let timer = setTimeout(() => {
- if (this.number === 2) {
- this.number = 0;
- } else {
- this.number += 1;
- }
- this.startMove();
- }, 2000); // 滚动不需要停顿则将2000改成动画持续时间
+ sexFormatter(row, column) {
+ row.sex = row.sex === 1 ? "男" : "女";
},
+ examinationFormatter(row) {
+ row.examinationType = row.examinationType === "1" ? "不正常" : "正常";
+ },
+
// 左侧表的接口返回数据
initEchart() {
securityTotal().then(res => {
@@ -832,23 +841,26 @@
});
},
// 资格审查异常名单
+ shoeDialog() {
+ this.gridData.current = 1;
+ this.gridData.total = 0;
+ this.dialogTableVisible = true;
+ this.getQualificationPages(1);
+ },
getQualificationPages(page) {
this.gridData.current = page;
- this.dialogTableVisible = true;
this.dialogloading = true;
this.gridData.data = [];
- this.gridData.total = 0;
let params = {
current: this.gridData.current,
size: 10,
- examinationType: this.poorPerformanceType,
+ examinationType: 1,
jurisdiction: this.value1
};
qualificationPages(params).then(res => {
if (res.data.code === 200) {
this.gridData.data = res.data.data.records;
this.gridData.total = res.data.data.total;
- // this.gridData.current = res.data.data.current;
}
this.dialogloading = false;
});
@@ -944,7 +956,6 @@
}
},
mounted() {
- this.startMove();
this.initEchart();
this.getHolderNum(0);
this.getPoorPerformance(3);
diff --git a/src/views/securityUnitOperation/economicAnalysis.vue b/src/views/securityUnitOperation/economicAnalysis.vue
index 50446a7..9d2752c 100644
--- a/src/views/securityUnitOperation/economicAnalysis.vue
+++ b/src/views/securityUnitOperation/economicAnalysis.vue
@@ -73,13 +73,13 @@
</el-row>
<el-row :gutter="20">
<el-col :span="16">
- <div class="rowContent">
+ <div class="rowContent" v-loading="loading1">
<span class="span-title">社保缴纳</span>
<div id="middleEchart1"></div>
</div>
</el-col>
<el-col :span="8">
- <div class="rowContent">
+ <div class="rowContent" v-loading="loading2">
<span class="span-title">派遣人员占比</span>
<div id="middleEchart2"></div>
</div>
@@ -87,8 +87,8 @@
</el-row>
<el-row>
<el-col :span="24">
- <div class="rowContent">
- <span class="span-title">公司经济运转趋势</span>
+ <div class="rowContent" v-loading="loading3">
+ <span class="span-title">年龄趋势</span>
<div id="bottomEchart"></div>
</div>
</el-col>
@@ -151,7 +151,10 @@
addPaiQ: 0,
sheBPerson: 0,
addSheBPerson: 0
- }
+ },
+ loading1: true,
+ loading2: true,
+ loading3: true
};
},
methods: {
@@ -173,6 +176,7 @@
this.getCompanys();
},
pieChange() {
+ this.loading2 = true;
let params = {
jurisdiction: this.value1,
deptid: this.value2
@@ -186,6 +190,7 @@
} else {
this.$message.error(res.msg);
}
+ this.loading2 = false;
});
},
getCompanys() {
@@ -234,6 +239,7 @@
});
},
getQueryYearSoil() {
+ this.loading1 = true;
let params = {
jurisdiction: this.value1,
deptid: this.value2
@@ -249,6 +255,7 @@
echartJs.economicMiddle(res.data.data, res1.data.data)
);
}
+ this.loading1 = false;
});
} else {
this.$message.error(res.msg);
@@ -256,6 +263,7 @@
});
},
getQueryYearAn() {
+ this.loading3 = true;
let params = {
jurisdiction: this.value1,
deptid: this.value2
@@ -269,6 +277,7 @@
} else {
this.$message.error(res.msg);
}
+ this.loading3 = false;
});
},
changeCompanys() {
diff --git a/src/views/securityUnitOperation/economicTable.vue b/src/views/securityUnitOperation/economicTable.vue
index 129dc33..cf7fa57 100644
--- a/src/views/securityUnitOperation/economicTable.vue
+++ b/src/views/securityUnitOperation/economicTable.vue
@@ -275,7 +275,7 @@
methods: {
dateChange() {},
getTableData() {
- selectJj().then(res => {
+ selectJj({ current: 1, size: 10 }).then(res => {
if (res.data.code === 200) {
this.tableData = res.data.data;
this.loading = false;
diff --git a/src/views/securityUnitOperation/operationAnalysis.vue b/src/views/securityUnitOperation/operationAnalysis.vue
index 4aa5080..1134e14 100644
--- a/src/views/securityUnitOperation/operationAnalysis.vue
+++ b/src/views/securityUnitOperation/operationAnalysis.vue
@@ -7,15 +7,20 @@
<img src="../../../public/img/bajgxt/u1618.png" />
<span>数据概览</span>
- <el-select class="select0" v-model="value0" placeholder="请选择">
+ <!-- <el-select class="select0" v-model="value0" placeholder="请选择">
<el-option
v-for="item in options0"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
- </el-select>
- <el-select class="select1" v-model="value1" placeholder="请选择" @change="fenjuChange">
+ </el-select> -->
+ <el-select
+ class="select1"
+ v-model="value1"
+ placeholder="请选择"
+ @change="fenjuChange"
+ >
<el-option
v-for="item in options1"
:key="item.id"
@@ -23,7 +28,12 @@
:value="item.id"
></el-option>
</el-select>
- <el-select class="select2" v-model="value2" placeholder="请选择" @change="changeCompanys">
+ <el-select
+ class="select2"
+ v-model="value2"
+ placeholder="请选择"
+ @change="changeCompanys"
+ >
<el-option
v-for="item in options2"
:key="item.departmentid"
@@ -37,38 +47,38 @@
<div class="col-content">
<div class="box-card">
<span>总保安数</span>
- <span>{{card.baoanTotal}}</span>
- <span>较上月增加{{card.addbaoanTotal}}人</span>
+ <span>{{ card.baoanTotal }}</span>
+ <span>较上月增加{{ card.addbaoanTotal }}人</span>
</div>
<div class="box-card">
<span>正常保安员</span>
- <span>{{card.zcBaoan}}</span>
- <span>较上月增加{{card.addzcBaoan}}人</span>
+ <span>{{ card.zcBaoan }}</span>
+ <span>较上月增加{{ card.addzcBaoan }}人</span>
</div>
<div class="box-card">
<span>持证保安员</span>
- <span>{{card.czBaoan}}</span>
- <span>较上月增加{{card.addczBaoan}}人</span>
+ <span>{{ card.czBaoan }}</span>
+ <span>较上月增加{{ card.addczBaoan }}人</span>
</div>
<div class="box-card">
<span>过考保安员</span>
- <span>{{card.gkBaoan}}</span>
- <span>较上月增加{{card.addgkBaoan}}人</span>
+ <span>{{ card.gkBaoan }}</span>
+ <span>较上月增加{{ card.addgkBaoan }}人</span>
</div>
<div class="box-card">
<span>服务客户</span>
- <span>{{card.kh}}</span>
- <span>较上月增加{{card.addkh}}家</span>
+ <span>{{ card.kh }}</span>
+ <span>较上月增加{{ card.addkh }}家</span>
</div>
<div class="box-card">
<span>缴纳社保</span>
- <span>{{card.sheb}}</span>
- <span>较上月增加{{card.addsheb}}人</span>
+ <span>{{ card.sheb }}</span>
+ <span>较上月增加{{ card.addsheb }}人</span>
</div>
<div class="box-card">
<span>保安派遣</span>
- <span>{{card.baoanPq}}</span>
- <span>较上月增加{{card.addbaoanPq}}人</span>
+ <span>{{ card.baoanPq }}</span>
+ <span>较上月增加{{ card.addbaoanPq }}人</span>
</div>
</div>
</div>
@@ -76,23 +86,47 @@
</el-row>
<el-row :gutter="20">
<el-col :span="16">
- <div class="rowContent">
+ <div class="rowContent" v-loading="loading1">
<span class="span-title">保安类数据统计</span>
<div id="middleEchart1"></div>
</div>
</el-col>
<el-col :span="8">
- <div class="rowContent">
+ <div class="rowContent" v-loading="loading2">
<span class="span-title">服务客户</span>
<div id="middleEchart2"></div>
</div>
</el-col>
</el-row>
- <el-row>
- <el-col :span="24">
- <div class="rowContent">
+ <el-row :gutter="20">
+ <el-col :span="16">
+ <div class="rowContent" v-loading="loading3">
<span class="span-title">公司运营趋势</span>
<div id="bottomEchart"></div>
+ </div>
+ </el-col>
+ <el-col :span="8">
+ <div class="rowContent" v-loading="loading4">
+ <span class="span-title">年龄结构</span>
+ <div class="leftEchartTitle qing">
+ <div class="block1"></div>
+ <span>青年</span>
+ <span>11</span>
+ <span>人</span>
+ </div>
+ <div class="leftEchartTitle zhong">
+ <div class="block1"></div>
+ <span>中年</span>
+ <span>321</span>
+ <span>人</span>
+ </div>
+ <div class="leftEchartTitle lao">
+ <div class="block1"></div>
+ <span>老年</span>
+ <span>123</span>
+ <span>人</span>
+ </div>
+ <div id="bottomEchart1"></div>
</div>
</el-col>
</el-row>
@@ -158,17 +192,48 @@
}
],
options1: [],
- options2: []
+ options2: [],
+ enterpriseName: "",
+ loading1: true,
+ loading2: true,
+ loading3: true,
+ loading4: false,
+ echartDom: {
+ middleEchart1: null,
+ middleEchart2: null,
+ bottomEchart: null,
+ bottomEchart1: null
+ }
};
},
methods: {
setEchart() {
+ this.loading3 = true;
let data = [];
- let bottomEchart = echarts.init(document.getElementById("bottomEchart"));
- bottomEchart.setOption(echartJs.bottomOption1(data));
+ if (!this.echartDom.bottomEchart) {
+ this.echartDom.bottomEchart = echarts.init(
+ document.getElementById("bottomEchart")
+ );
+ this.echartDom.bottomEchart.setOption(echartJs.bottomOption1(data));
+ }
+ this.loading3 = false;
+
+ let data1 = [];
+ if (!this.echartDom.bottomEchart1) {
+ this.echartDom.bottomEchart1 = echarts.init(
+ document.getElementById("bottomEchart1")
+ );
+ this.echartDom.bottomEchart1.setOption(echartJs.bottomOption2(data1));
+ }
},
toOperationTable() {
- this.$router.push({ path: "/securityUnitOperation/operationTable" });
+ this.$router.push({
+ path:
+ "/securityUnitOperation/operationTable?jurisdiction =" +
+ this.value2 +
+ "&enterpriseName =" +
+ this.enterpriseName
+ });
},
getFenju() {
this.options1 = [];
@@ -190,7 +255,9 @@
getCompanys({ jurisdiction: this.value1 }).then(res => {
if (res.data.code === 200) {
this.options2 = res.data.data;
+ debugger
this.value2 = this.options2[0] ? this.options2[0].departmentid : "";
+ this.enterpriseName = this.options2[0] ? this.options2[0].enterpriseName : "";
this.changeCompanys();
}
});
@@ -223,31 +290,43 @@
});
},
getQueryYearKh() {
+ this.loading2 = true;
let params = {
jurisdiction: this.value1,
deptid: this.value2
};
queryYearKh(params).then(res => {
if (res.data.code === 200) {
- let middleEchart2 = echarts.init(
- document.getElementById("middleEchart2")
+ if (!this.echartDom.middleEchart2) {
+ this.echartDom.middleEchart2 = echarts.init(
+ document.getElementById("middleEchart2")
+ );
+ }
+ this.echartDom.middleEchart2.setOption(
+ echartJs.middleOption2(res.data.data)
);
- middleEchart2.setOption(echartJs.middleOption2(res.data.data));
}
+ this.loading2 = false;
});
},
getQueryYearG() {
+ this.loading1 = true;
let params = {
jurisdiction: this.value1,
deptid: this.value2
};
- queryYearG().then(res => {
+ queryYearG(params).then(res => {
if (res.data.code === 200) {
- let middleEchart1 = echarts.init(
- document.getElementById("middleEchart1")
+ if (!this.echartDom.middleEchart1) {
+ this.echartDom.middleEchart1 = echarts.init(
+ document.getElementById("middleEchart1")
+ );
+ }
+ this.echartDom.middleEchart1.setOption(
+ echartJs.middleOption1(res.data.data)
);
- middleEchart1.setOption(echartJs.middleOption1(res.data.data));
}
+ this.loading1 = false;
});
},
// 清空之前的查询结果
@@ -270,6 +349,11 @@
};
},
changeCompanys() {
+ this.options2.forEach(item => {
+ if (item.value === this.value2) {
+ this.enterpriseName = item.enterpriseName;
+ }
+ });
this.clear();
this.getQueryCounts();
this.getQueryYearKh();
@@ -289,8 +373,9 @@
}
#bottomEchart,
#middleEchart1,
-#middleEchart2 {
- height: calc(100% - 40px);
+#middleEchart2,
+#bottomEchart1 {
+ height: calc(100% - 25px);
width: 100%;
}
.el-row:first-child {
@@ -378,4 +463,102 @@
margin-top: 15px;
margin-left: 36px;
}
+.leftEchartTitle {
+ height: 30px;
+ display: flex;
+ line-height: 30px;
+ margin-top: 10px;
+ margin-left: 28px;
+ position: absolute;
+ .block1 {
+ width: 23px;
+ height: 13px;
+ background: #2ec7c9;
+ border-radius: 3px;
+ margin-top: 9px;
+ }
+ span:nth-child(2) {
+ color: #fff;
+ font-size: 13px;
+ margin: 0px 10px 0px 3px;
+ }
+ span:nth-child(3) {
+ color: #2ec7c9;
+ font-size: 17px;
+ font-weight: 700;
+ display: block;
+ width: 65px;
+ text-align: center;
+ }
+ span:nth-child(4) {
+ font-size: 13px;
+ color: #2ec7c9;
+ }
+}
+.leftEchartTitle.qing {
+ right: 37px;
+ margin-top: 42px;
+ .block1 {
+ width: 30px;
+ height: 15px;
+ background: #73c0de;
+ margin-top: 7px;
+ }
+ span:nth-child(2) {
+ color: #fff;
+ font-size: 13px;
+ }
+ span:nth-child(3) {
+ color: #73c0de;
+ font-size: 17px;
+ }
+ span:nth-child(4) {
+ font-size: 13px;
+ color: #73c0de;
+ }
+}
+.leftEchartTitle.zhong {
+ right: 37px;
+ margin-top: 83px;
+ .block1 {
+ width: 30px;
+ height: 15px;
+ background: #fac858;
+ margin-top: 7px;
+ }
+ span:nth-child(2) {
+ color: #fff;
+ font-size: 13px;
+ }
+ span:nth-child(3) {
+ color: #fac858;
+ font-size: 17px;
+ }
+ span:nth-child(4) {
+ font-size: 13px;
+ color: #fac858;
+ }
+}
+.leftEchartTitle.lao {
+ right: 37px;
+ margin-top: 125px;
+ .block1 {
+ width: 30px;
+ height: 15px;
+ background: #91cc75;
+ margin-top: 7px;
+ }
+ span:nth-child(2) {
+ color: #fff;
+ font-size: 13px;
+ }
+ span:nth-child(3) {
+ color: #91cc75;
+ font-size: 17px;
+ }
+ span:nth-child(4) {
+ font-size: 13px;
+ color: #91cc75;
+ }
+}
</style>
diff --git a/src/views/securityUnitOperation/operationTable.vue b/src/views/securityUnitOperation/operationTable.vue
index 0ac115f..a280ff1 100644
--- a/src/views/securityUnitOperation/operationTable.vue
+++ b/src/views/securityUnitOperation/operationTable.vue
@@ -136,7 +136,6 @@
label: "缴纳社保保安数"
}
],
- search: true,
rules: [
{
required: true,
@@ -154,17 +153,19 @@
},
{
label: "所属辖区",
- prop: "jurname",
+ prop: "jurisdiction",
searchSpan: 4,
- type: "select",
+ // cascaderItem: ["city", "area"],
+ // dicUrl: "/api/information/lazyTreeJu",
+ // dicMethod:'post',
props: {
label: "title",
- value: "value"
+ value: "id"
},
- // cascaderItem: ["city", "area"],
- // dicUrl:subofficeOptions,
- dicData: this.subOfficeData,
+ dicData: [],
search: true,
+ // overHidden: true,
+ type: "tree",
rules: [
{
required: true,
@@ -238,15 +239,29 @@
getSubOfficeData() {
lazyTreeJu().then(res => {
if (res.data.code === 200) {
- this.subOfficeData = res.data.data;
- this.subOfficeValue = this.subOfficeData[0].value || "";
+ console.log(res.data, 99)
+
+ this.tableOption.column.forEach(item => {
+
+ if (item.label == "所属辖区") {
+ item.dicData = res.data.data
+ }
+ })
+ // this.subOfficeData = res.data.data;
+ // this.subOfficeValue = this.subOfficeData[0].value || "";
} else {
this.$message.error(res.msg);
}
});
},
getTableData() {
- selectTb().then(res => {
+ let params = {
+ jurisdiction: "",
+ enterpriseName: "",
+ size: 1,
+ current: 10
+ };
+ selectTb(params).then(res => {
if (res.data.code === 200) {
this.tableData = res.data.data;
this.loading = false;
@@ -274,7 +289,7 @@
// }
},
mounted() {
- this.getSubOfficeData();
+ this.getSubOfficeData();
this.getTableData();
}
};
diff --git a/src/views/securityUnitOperation/securityEchart.js b/src/views/securityUnitOperation/securityEchart.js
index f88d5c9..9162c8c 100644
--- a/src/views/securityUnitOperation/securityEchart.js
+++ b/src/views/securityUnitOperation/securityEchart.js
@@ -26,15 +26,15 @@
"#96dee8"
],
grid: {
- top: "10%",
+ top: "15%",
left: "3%",
right: "4%",
- bottom: "15%",
+ bottom: "0%",
containLabel: true
},
legend: {
- data: ["趋势"],
- bottom: "0%",
+ data: ["服务对象数量"],
+ top: "0%",
textStyle: {
color: "#fff"
}
@@ -71,7 +71,6 @@
]
},
yAxis: {
- name: "（元）",
type: "value",
axisLabel: {
color: "#fff"
@@ -79,7 +78,7 @@
},
series: [
{
- name: "趋势",
+ name: "服务对象数量",
data: data,
type: "line",
smooth: true,
@@ -113,21 +112,21 @@
"#96dee8"
],
grid: {
- top: "10%",
+ top: "15%",
left: "3%",
right: "4%",
- bottom: "15%",
+ bottom: "0%",
containLabel: true
},
legend: {
- data: ["趋势"],
- bottom: "0%",
+ data: ["保安员数量", "派遣数量", "持证数量"],
+ top: "0%",
textStyle: {
color: "#fff"
}
},
tooltip: {
- trigger: "item",
+ trigger: "axis",
backgroundColor: "#031952",
color: "#fff",
borderWidth: "0", //边框宽度设置1
@@ -158,7 +157,7 @@
]
},
yAxis: {
- name: "（元）",
+ // name: "（元）",
type: "value",
axisLabel: {
color: "#fff"
@@ -166,11 +165,22 @@
},
series: [
{
- name: "趋势",
- data: [10, 20, 14, 15, 16, 17, 24, 15, 3, 7, 11, 23],
+ name: "保安员数量",
type: "line",
- smooth: true,
- areaStyle: {}
+ stack: "总量",
+ data: [120, 132, 101, 134, 90, 230, 210, 113, 221, 42, 152, 111]
+ },
+ {
+ name: "派遣数量",
+ type: "line",
+ stack: "总量",
+ data: [220, 182, 191, 234, 290, 330, 310, 111, 110, 91, 111, 131]
+ },
+ {
+ name: "持证数量",
+ type: "line",
+ stack: "总量",
+ data: [150, 232, 201, 154, 190, 330, 410, 90, 91, 93, 112, 133]
}
]
};
@@ -413,8 +423,72 @@
};
return option;
}
+function bottomOption2(alldata) {
+ let option = {
+ tooltip: {
+ trigger: "item",
+ formatter: "{a}<br>{b}:{c}({d}%)",
+ axisPointer: {
+ type: "shadow"
+ },
+ backgroundColor: "#031952", //设置背景图片 rgba格式
+ color: "#fff",
+ borderWidth: "0", //边框宽度设置1
+ // borderColor: "gray", //设置边框颜色
+ textStyle: {
+ color: "#fff" //设置文字颜色
+ }
+ },
+ // legend: {
+ // data: ["青年", "中年", "老年"],
+ // top: "0%",
+ // itemHeight: 10,
+ // textStyle: {
+ // color: "#fff"
+ // }
+ // },
+ color: [
+ "#73c0de",
+ "#fac858",
+ "#91cc75",
+ "#3ba272",
+ "#fc8452",
+ "#9a60b4",
+ "#3fb1e3",
+ "#6be6c1",
+ "#626c91",
+ "#a0a7e6",
+ "#c4ebad",
+ "#96dee8"
+ ],
+ grid: {
+ top: "10%",
+ left: "5%",
+ right: "30%",
+ bottom: "4%",
+ containLabel: true
+ },
+ series: [
+ {
+ name: "年龄结构",
+ type: "pie",
+ center: ["33%", "50%"],
+ radius: "70%",
+ data: [
+ { value: 1048, name: "青年" },
+ { value: 735, name: "中年" },
+ { value: 580, name: "老年" }
+ ],
+ label: {
+ color: "#fff"
+ }
+ }
+ ]
+ };
+ return option;
+}
-function economicMiddle(data1,data2) {
+function economicMiddle(data1, data2) {
let sbData = [];
let pqData = [];
for (var a in data1) {
@@ -576,7 +650,7 @@
},
data: [
{ value: allData.PCount, name: "已派遣人数" },
- { value: allData.WPCount, name: "未派遣人" }
+ { value: allData.WPCount, name: "未派遣人数" }
]
}
]
@@ -590,5 +664,6 @@
middleOption1,
middleOption2,
economicMiddle,
- economicPieOption
+ economicPieOption,
+ bottomOption2
};
diff --git a/src/views/statisticalQueryManagement/companyDetails.vue b/src/views/statisticalQueryManagement/companyDetails.vue
index 3b80bd2..e441586 100644
--- a/src/views/statisticalQueryManagement/companyDetails.vue
+++ b/src/views/statisticalQueryManagement/companyDetails.vue
@@ -2,12 +2,19 @@
<basic-container>
<avue-crud
:option="tableOption"
- :data="tableData"
- :page.sync="tablePage"
:table-loading="loading"
+ :data="tableData"
+ :page.sync="page"
:permission="permissionList"
- :before-open="beforeOpen"
- @date-change="dateChange"
+ ref="crud"
+ @row-update="rowUpdates"
+ @row-save="rowSave"
+ @search-change="searchChange"
+ @search-reset="searchReset"
+ @current-change="currentChange"
+ @size-change="sizeChange"
+ @refresh-change="refreshChange"
+ @on-load="onLoad"
>
</avue-crud>
</basic-container>
@@ -21,6 +28,12 @@
name: "公司人员详情",
data() {
return {
+ page: {
+ pageSize: 10,
+ currentPage: 1,
+ total: 0
+ },
+ query: {},
value1: "",
value2: "",
tableData: [
@@ -61,11 +74,6 @@
// send: "是"
// }
],
- tablePage: {
- pageSize: 10,
- currentPage: 1,
- total: 0
- },
tableOption: {
excelBtn: true,
delBtn: false,
@@ -303,17 +311,84 @@
}
},
methods: {
- dateChange() {},
- getTableData() {
- selectUIn({ deptid: "1412222709480509442",current: 1, size: 10 }).then(
- res => {
- if (res.data.code === 200) {
- this.tableData = res.data.data;
- this.loading = false;
- }
+ rowSave(row, done, loading) {
+ adddata(row).then(
+ () => {
+ this.onLoad(this.page);
+ this.$message({
+ type: "success",
+ message: "操作成功!"
+ });
+ done();
+ },
+ error => {
+ window.console.log(error);
+ loading();
}
);
- }
+ },
+ rowUpdates(row, index, done, loading) {
+ update(row).then(
+ () => {
+ this.onLoad(this.page);
+ this.$message({
+ type: "success",
+ message: "操作成功!"
+ });
+ done();
+ },
+ error => {
+ window.console.log(error);
+ loading();
+ }
+ );
+ },
+ searchChange(params, done) {
+ this.query = params;
+ this.page.currentPage = 1;
+ this.onLoad(this.page, params);
+ done();
+ },
+
+ searchReset() {
+ this.query = {};
+ this.onLoad(this.page);
+ },
+ currentChange(currentPage) {
+ this.page.currentPage = currentPage;
+ },
+ sizeChange(pageSize) {
+ this.page.pageSize = pageSize;
+ },
+ refreshChange() {
+ this.onLoad(this.page, this.query);
+ },
+ onLoad(page, params = {}) {
+ this.loading = true;
+ // if (!params) {
+ // params = { current: page.currentPage, size: page.pageSize };
+ // }
+ let param = {};
+ param["deptid"] = "1412222709480509442";
+ param["current"] = page.currentPage;
+ param["size"] = page.pageSize;
+ selectUIn(param).then(res => {
+ const data = res.data.data;
+ this.page.total = data.total;
+ this.tableData = res.data.data;
+ // this.data = data.records;
+ this.loading = false;
+ // this.selectionClear();
+ });
+ },
+ // getTableData() {
+ // selectUIn(param).then(res => {
+ // if (res.data.code === 200) {
+ // this.tableData = res.data.data;
+ // this.loading = false;
+ // }
+ // });
+ // }
// downExcel() {
// let et = XLSX.utils.table_to_book(document.getElementById("table"));
// let etout = XLSX.write(et, {
@@ -335,7 +410,7 @@
// }
},
mounted() {
- this.getTableData();
+ // this.getTableData();
}
};
</script>
diff --git a/src/views/statisticalQueryManagement/securityGuardStatistics.vue b/src/views/statisticalQueryManagement/securityGuardStatistics.vue
index 5a9e63c..e11611d 100644
--- a/src/views/statisticalQueryManagement/securityGuardStatistics.vue
+++ b/src/views/statisticalQueryManagement/securityGuardStatistics.vue
@@ -2,12 +2,19 @@
<basic-container>
<avue-crud
:option="tableOption"
+ :table-loading="loading"
:data="tableData"
- :page.sync="tablePage"
- :table-loading="loading"
+ :page.sync="page"
:permission="permissionList"
- :before-open="beforeOpen"
- @date-change="dateChange"
+ ref="crud"
+ @row-update="rowUpdates"
+ @row-save="rowSave"
+ @search-change="searchChange"
+ @search-reset="searchReset"
+ @current-change="currentChange"
+ @size-change="sizeChange"
+ @refresh-change="refreshChange"
+ @on-load="onLoad"
@row-click="handleRowClick"
class="rowClick"
>
@@ -19,10 +26,17 @@
import XLSX from "xlsx";
import { mapGetters } from "vuex";
import { selectLi } from "../../api/statisticalQueryManagement/statisticalQueryManagement";
+import { lazyTreeJu } from "../../api/index/index";
export default {
name: "业务情况统计",
data() {
return {
+ page: {
+ pageSize: 10,
+ currentPage: 1,
+ total: 0
+ },
+ query: {},
value1: "",
value2: "",
tableData: [
@@ -63,11 +77,6 @@
// socialSecurity: "21535",
// },
],
- tablePage: {
- pageSize: 10,
- currentPage: 1,
- total: 0,
- },
tableOption: {
align: "center",
viewBtn: true,
@@ -93,7 +102,7 @@
prop: "deptname",
search: true,
searchSpan: 4,
- display: false,
+ display: false
},
{
label: "所属辖区",
@@ -101,71 +110,71 @@
searchSpan: 4,
type: "select",
props: {
- label: "label",
- value: "value",
+ label: "title",
+ value: "value"
},
- // cascaderItem: ["city", "area"],
- // dicUrl:subofficeOptions,
+ // dicUrl: "/api/information/lazyTreeJu",
+ // dicMethod:'post',
dicData: [
- {
- value: "0",
- label: "南昌市公安局",
- },
- {
- value: "2",
- label: "东湖分局",
- },
- {
- value: "3",
- label: "西湖分局",
- },
- {
- value: "4",
- label: "青云谱分局",
- },
- {
- value: "5",
- label: "青山湖分局",
- },
+ // {
+ // value: "0",
+ // label: "南昌市公安局"
+ // },
+ // {
+ // value: "2",
+ // label: "东湖分局"
+ // },
+ // {
+ // value: "3",
+ // label: "西湖分局"
+ // },
+ // {
+ // value: "4",
+ // label: "青云谱分局"
+ // },
+ // {
+ // value: "5",
+ // label: "青山湖分局"
+ // }
],
search: true,
rules: [
{
required: true,
message: "请选择所属辖区",
- trigger: "blur",
- },
- ],
+ trigger: "blur"
+ }
+ ]
},
{
label: "保安员总数",
prop: "num",
- display: false,
+ display: false
},
{
label: "持证上岗人数",
prop: "cznum",
- display: false,
+ display: false
},
{
label: "未派遣人数",
prop: "wpaiqnum",
- display: false,
+ display: false
},
{
label: "派遣人数",
prop: "paiqnum",
- display: false,
+ display: false
},
{
label: "未采集照片人数",
prop: "wcaijnum",
- display: false,
+ display: false
},
{
label: "资格审查异常人数",
prop: "yicnum",
- display: false,
+ display: false
},
// {
// label: "过考保安人数",
@@ -175,12 +184,12 @@
{
label: "缴纳社保人数",
prop: "sbnum",
- display: false,
- },
- ],
+ display: false
+ }
+ ]
},
companyName: "",
- loading:true,
+ loading: true
};
},
computed: {
@@ -190,26 +199,110 @@
addBtn: this.vaildData(this.permission.post_add, false),
viewBtn: this.vaildData(this.permission.post_view, false),
delBtn: this.vaildData(this.permission.post_delete, false),
- editBtn: this.vaildData(this.permission.post_edit, false),
+ editBtn: this.vaildData(this.permission.post_edit, false)
};
- },
+ }
},
methods: {
+ getSubOfficeData() {
+ lazyTreeJu().then(res => {
+ if (res.data.code === 200) {
+ this.tableOption.column.forEach(item => {
+ if (item.label == "所属辖区") {
+ item.dicData = res.data.data;
+ }
+ });
+ } else {
+ this.$message.error(res.msg);
+ }
+ });
+ },
+ rowSave(row, done, loading) {
+ adddata(row).then(
+ () => {
+ this.onLoad(this.page);
+ this.$message({
+ type: "success",
+ message: "操作成功!"
+ });
+ done();
+ },
+ error => {
+ window.console.log(error);
+ loading();
+ }
+ );
+ },
+ rowUpdates(row, index, done, loading) {
+ update(row).then(
+ () => {
+ this.onLoad(this.page);
+ this.$message({
+ type: "success",
+ message: "操作成功!"
+ });
+ done();
+ },
+ error => {
+ window.console.log(error);
+ loading();
+ }
+ );
+ },
+ searchChange(params, done) {
+ this.query = params;
+ this.page.currentPage = 1;
+ this.onLoad(this.page, params);
+ done();
+ },
+
+ searchReset() {
+ this.query = {};
+ this.onLoad(this.page);
+ },
+ currentChange(currentPage) {
+ this.page.currentPage = currentPage;
+ },
+ sizeChange(pageSize) {
+ this.page.pageSize = pageSize;
+ },
+ refreshChange() {
+ this.onLoad(this.page, this.query);
+ },
+ onLoad(page, params = {}) {
+ this.loading = true;
+ // if (!params) {
+ // params = { current: page.currentPage, size: page.pageSize };
+ // }
+ let param = {};
+ param["jurisdiction"] = params["jurname"] ? params["jurname"] : "";
+ param["deptid"] = "";
+ param["current"] = page.currentPage;
+ param["size"] = page.pageSize;
+ selectLi(param).then(res => {
+ const data = res.data.data;
+ this.page.total = data.total;
+ this.tableData = res.data.data;
+ // this.data = data.records;
+ console.log(this.data);
+ this.loading = false;
+ // this.selectionClear();
+ });
+ },
// toCompanyDetails() {
// this.$router.push({ path: "/statisticalQueryManagement/companyDetails" });
// },
handleRowClick(row, event, column) {
this.$router.push({ path: "/statisticalQueryManagement/companyDetails" });
},
- dateChange() {},
- getTableData() {
- selectLi({current: 1, size: 10 }).then(res => {
- if (res.data.code === 200) {
- this.tableData = res.data.data;
- this.loading = false;
- }
- });
- }
+ // getTableData() {
+ // selectLi({ current: 1, size: 10 }).then(res => {
+ // if (res.data.code === 200) {
+ // this.tableData = res.data.data;
+ // this.loading = false;
+ // }
+ // });
+ // }
// downExcel() {
// let et = XLSX.utils.table_to_book(document.getElementById("table"));
// let etout = XLSX.write(et, {
@@ -231,12 +324,12 @@
// }
},
mounted() {
- this.getTableData();
- },
+ this.getSubOfficeData();
+ }
};
</script>
-<style lang="scss" scoped>
-/deep/ .rowClick .el-table__row:hover td{
+<style lang="scss" scoped>
+/deep/ .rowClick .el-table__row:hover td {
cursor: pointer;
}
</style>
--
Gitblit v1.9.3