初步完成所有人才盘点页面的功能

pull/6/head
yzw 2022-12-02 14:46:42 +08:00
parent f4ed0d0b5d
commit c8df773aa4
2 changed files with 299 additions and 16 deletions

View File

@ -32,6 +32,14 @@ export function getReviewEducation(params) {
})
}
export function getReviewParty(params) {
return request({
url: '/person/review/party',
method: 'get',
params
})
}
export function getReviewPerformance(params) {
return request({
url: '/person/review/performance',

View File

@ -115,14 +115,6 @@
</div>
</div>
<div class="slide">
<div class="section-title">员工专业统计</div>
<div class="section-body">
<div class="sbody-left"></div>
<div class="sbody-right"></div>
</div>
</div>
<div class="slide">
<div class="tab-title">员工学校统计</div>
<div class="section-body">
@ -156,6 +148,63 @@
</div>
</div>
</div>
<!-- <div class="slide">
<div class="section-title">员工专业统计</div>
<div class="section-body">
<div class="sbody-left"></div>
<div class="sbody-right"></div>
</div>
</div> -->
</div>
<div class="section">
<div class="slide">
<h3>员工党务信息统计</h3>
</div>
<div class="slide">
<div class="section-title">员工政治面貌统计</div>
<div class="section-body">
<div class="sbody-left">
<div id="pic_party_face" class="pic"></div>
</div>
<div class="sbody-right">
<p>
恩施卷烟厂的员工中群众占比最多达40.21%其次是中共党员占比32.09%
</p>
</div>
</div>
</div>
<div class="slide">
<div class="section-title">员工党龄统计</div>
<div class="section-body">
<div class="sbody-left">
<div id="pic_party_year" class="pic"></div>
</div>
<div class="sbody-right">
<p>
恩施卷烟厂党员员工的党龄大致可分为两簇一簇党龄区间为1~17另一簇党龄为19~32
</p>
</div>
</div>
</div>
<div class="slide">
<div class="section-title">历年优秀党员统计</div>
<div class="section-body">
<div class="sbody-left">
<div id="pic_party_excellent" class="pic"></div>
</div>
<div class="sbody-right">
<p>
历年优秀党员评选中2021年获得优秀党员荣誉的员工最多达40人
</p>
<p>从人数变化率来看也是2021年变化率最大较2020年提升了近30%</p>
</div>
</div>
</div>
</div>
<div class="section">
@ -455,11 +504,6 @@
</div>
</div>
</div>
<div class="section">
<h3>最后一屏</h3>
<p>这是最后一屏</p>
</div>
</div>
</template>
@ -491,6 +535,11 @@ export default {
workSchoolData: {},
schoolCategory: ["211", "985"],
//
partyFaceData: [],
partyYearData: {},
partyExcellentData: {},
//
fullYearRange: [0, 0],
fullCheckData: null,
@ -631,11 +680,11 @@ export default {
"#1bbc9b",
"#4BBFC3",
"#f3a694",
"#8ba3c7",
"#99bcac",
"#e5a84b",
"#c4c97d",
"#94784f",
"#8ba3c7",
],
// navigation: true,
// navigationTooltips: ["", "", "", ""],
@ -671,10 +720,10 @@ export default {
//
this.showDegreeBar();
} else if (destination == 3) {
//
} else if (destination == 4) {
//
this.showFullSchoolPie();
} else if (destination == 4) {
//
}
}
},
@ -682,6 +731,7 @@ export default {
});
// echarts
//
let chartDom = document.getElementById("pic_gender");
this.genderChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_age");
@ -692,6 +742,7 @@ export default {
this.regionChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_region_city");
this.regionCityChart = echarts.init(chartDom);
//
chartDom = document.getElementById("pic_full_edu");
this.fullEduChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_work_edu");
@ -702,6 +753,14 @@ export default {
this.fullSchoolChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_work_school");
this.workSchoolChart = echarts.init(chartDom);
//
chartDom = document.getElementById("pic_party_face");
this.partyFaceChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_party_year");
this.partyYearChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_party_excellent");
this.partyExcellentChart = echarts.init(chartDom);
//
chartDom = document.getElementById("pic_full_check");
this.fullCheckChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_middle_check");
@ -710,22 +769,26 @@ export default {
this.enshiAdvanceChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_center_advance");
this.centerAdvanceChart = echarts.init(chartDom);
//
chartDom = document.getElementById("pic_work_year");
this.workYearChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_professional");
this.pSkillChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_vocational");
this.vSkillChart = echarts.init(chartDom);
//
chartDom = document.getElementById("pic_center_innovation");
this.centerInnovationChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_enshi_innovation");
this.enshiInnovationChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_paper");
this.paperChart = echarts.init(chartDom);
//
chartDom = document.getElementById("pic_person_activity");
this.personActivityChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_activity");
this.activityChart = echarts.init(chartDom);
//
chartDom = document.getElementById("pic_person_meeting");
this.personMeetingChart = echarts.init(chartDom);
chartDom = document.getElementById("pic_meeting");
@ -919,6 +982,70 @@ export default {
}
);
//
personApi.getReviewParty().then(
(res) => {
let resData = res.data;
//
let partyFaceData = resData["政治面貌"];
let tempArr = [];
for (let key in partyFaceData) {
tempArr.push({ name: key, value: partyFaceData[key] });
}
this.partyFaceData = tempArr;
this.showPartyFaceChart();
//
let partyYearData = resData["党龄"];
let maxAge = 0,
categoryData = [],
valueData = [];
for (let i in partyYearData) {
if (parseInt(i) > maxAge) {
maxAge = i;
}
}
for (let i = 1; i <= maxAge; i++) {
categoryData.push(i);
if (i in partyYearData) {
valueData.push(partyYearData[i]);
} else {
valueData.push(0);
}
}
this.partyYearData = {
category: categoryData,
value: valueData,
};
this.showPartyYearData();
//
let partyExcellentData = resData["历年优秀"];
(categoryData = []), (valueData = []);
let rateData = [],
preValue = 0;
for (let key in partyExcellentData) {
let curValue = partyExcellentData[key];
let rate = 0.0;
if (preValue != 0) {
rate = ((curValue - preValue) / preValue) * 100;
rate = Number(rate.toFixed(2));
}
preValue = curValue;
rateData.push(rate);
categoryData.push(key);
valueData.push(curValue);
}
this.partyExcellentData = {
category: categoryData,
value: valueData,
rate: rateData,
};
this.showPartyExcellentChart();
},
(err) => {
console.log("error", err);
}
);
//
personApi.getReviewPerformance().then(
(res) => {
@ -2817,6 +2944,154 @@ export default {
};
this.projectChart.setOption(option);
},
showPartyFaceChart() {
let option = {
title: {
text: "员工政治面貌分布饼图",
left: "center",
y: "1%",
},
tooltip: {
trigger: "item",
},
legend: {
left: "center",
y: "10%",
},
series: [
{
name: "政治面貌",
type: "pie",
radius: "50%",
data: this.partyFaceData,
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)",
},
},
},
],
};
option && this.partyFaceChart.setOption(option);
},
showPartyYearData() {
let option = {
title: {
text: "员工党龄分布条状图",
left: "center",
y: "1%",
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
},
// legend: {},
grid: {
left: "3%",
right: "8%",
bottom: "3%",
containLabel: true,
},
xAxis: {
type: "value",
name: "人数",
},
yAxis: {
type: "category",
name: "入党年岁",
data: this.partyYearData["category"],
},
series: [
{
name: "人数",
type: "bar",
data: this.partyYearData["value"],
},
],
};
this.partyYearChart.setOption(option);
},
showPartyExcellentChart() {
let option = {
title: {},
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross",
crossStyle: {
color: "#999",
},
},
},
legend: {},
xAxis: [
{
type: "category",
data: this.partyExcellentData["category"],
axisPointer: {
type: "shadow",
},
},
],
yAxis: [
{
type: "value",
name: "优秀人数",
axisLabel: {
formatter: "{value} 人",
},
},
{
type: "value",
name: "变化率",
axisLabel: {
formatter: "{value} %",
},
},
],
dataZoom: [
{
show: true,
start: 0,
end: 100,
},
{
type: "inside",
start: 0,
end: 100,
},
],
series: [
{
name: "历年优秀",
type: "bar",
tooltip: {
valueFormatter: function (value) {
return value + " 人";
},
},
data: this.partyExcellentData["value"],
},
{
name: "变化率",
type: "line",
yAxisIndex: 1,
tooltip: {
valueFormatter: function (value) {
return value + " %";
},
},
data: this.partyExcellentData["rate"],
},
],
};
this.partyExcellentChart.setOption(option);
},
},
};
</script>