Skip to content

P
pica.cloud.web-education-admin
提交 e6145256 编写于 作者: zhentian.jia's avatar zhentian.jia
浏览文件
操作

Merge branch 'dev-learning-1120' into 'test-learning-1205' 

Dev learning 1120



See merge request !120
上级 65346331 0e6a1ab2
显示空白字符变更
内嵌 并排
正在显示 包含 3306 行增加 和 1456 行删除
src/utils/filter.js
浏览文件 @ e6145256
...@@ -207,11 +207,11 @@ const vueFilter = { ...@@ -207,11 +207,11 @@ const vueFilter = {
}, },
exportStatus: (value) => { exportStatus: (value) => {
if(value == 0) { if(value == 0) {
return '数据生成中，请稍后---'; return '生成中';
}else if(value == 1) { }else if(value == 1) {
return '数据生成完成'; return '成功';
} else { } else {
return '文件生成失败 请重新操作导出'; return '失败';
} }
}, },
getAvgTime: (value) => { getAvgTime: (value) => {
...@@ -232,6 +232,28 @@ const vueFilter = { ...@@ -232,6 +232,28 @@ const vueFilter = {
} }
return avgTime; return avgTime;
}, },
learnTimeValue: (value) => {
let s = parseInt(value),m = 0, h = 0;//秒，分，小时
if(s==NaN){//错误error
return '';
}
if(s > 60) {
m = parseInt(s/60);
s = parseInt(s%60);
if(m > 60) {
h = parseInt(m/60);
m = parseInt(m%60);
}
}
let result = ""+parseInt(s)+"秒";
if(m > 0) {
result = ""+parseInt(m)+"分"+result;
}
if(h > 0) {
result = ""+parseInt(h)+"小时"+result;
}
return result;
},
getTotalTime: (value) => { getTotalTime: (value) => {
let time = value +'分钟'; let time = value +'分钟';
return time; return time;
...@@ -280,6 +302,54 @@ const vueFilter = { ...@@ -280,6 +302,54 @@ const vueFilter = {
} else if(value == 4) { } else if(value == 4) {
return '已下架'; return '已下架';
} }
},
examRate: (value) => {
let num = (value*100).toFixed(2);
let rate = num + '%';
return rate;
},
sexValue: (value) => {
if(value == 1) {
return '男';
} else if(value == 2) {
return '女';
} else if(value == 0) {
return '未知';
} }
},
joinFlagValue: (value) => {
if(value == 1) {
return '已参与';
} else if(value == 2) {
return '未参与';
}
},
finishFlagValue: (value) => {
if(value == 1) {
return '已完成';
} else if(value == 2) {
return '未完成';
}
},
certGradeValue: (value) => {
if(value == 1) {
return '优秀';
} else if(value == 2) {
return '良好';
} else if(value == 3) {
return '及格';
} else if(value == 4) {
return '不及格';
}
},
finishFlagType: (value) => {
if(value == 0) {
return '未参与';
} else if(value == 1) {
return '未完成';
} else if(value == 2) {
return '已完成';
}
},
} }
export default vueFilter export default vueFilter
\ No newline at end of file
src/utils/learning/chartData.js 0 → 100644
浏览文件 @ e6145256
export function dustributeOption(legendData, seriesData) {
let option = {
title: {
text: "",
x: "left"
},
tooltip: {
trigger: "item",
formatter: "{b} : {d}%"
},
label: {
formatter: "{d}%"
},
color: ['#FF9A4B', '#FFBC3D', '#39AF9A', '#3BA0FF', '#5D7092'],
legend: {
orient: "horizontal",
top: "",
left: "0%",
data: legendData
},
series: [
{
name: "",
type: "pie",
radius: "60%",
center: ["50%", "50%"],
data: seriesData,
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)"
}
}
}
]
};
return option;
}
export function recordOption(legendData, xAxisData, seriesData) {
let option = {
title: {
text: "",
x: "left"
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
shadowStyle: {
shadowColor: '#E3EFED',
width: 36,
},
},
backgroundColor: 'rgba(0,0,0,0.7)',
formatter: function (params) {
let relVal = params[0].name + "人数：";
let value = 0;
for (let i = 0, l = params.length; i < l; i++) {
value += params[i].value;
}
relVal += value + "人";
let divList = [];
divList[0] = "<div style='background: #3BA0FF;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[1] = "<div style='background: #FF9A4B;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[2] = "<div style='background: #FFB01B;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[3] = "<div style='background: #39AF9A;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[4] = "<div style='background: #5D7092;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
for (let j = params.length - 1; j >= 0; j--) {
if(value != 0) {
relVal +=
"<br/>" + divList[j] +
params[j].seriesName +
"占比： " +
(
(100 * parseFloat(params[j].value)) /
parseFloat(value)
).toFixed(2) +
"%";
} else {
relVal +=
"<br/>" + divList[j] +
params[j].seriesName +
"占比： "+ "0%";
}
}
return relVal;
}
},
color: ['#3BA0FF', '#FF9A4B', '#FFB01B', '#39AF9A', '#5D7092'],
legend: {
data: legendData,
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: {
type: "category",
data: xAxisData,
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
},
yAxis: {
type: "value",
name: "人数 (个)",
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
},
series: seriesData,
};
return option;
}
export function certificateOption(xAxisData, seriesJoin, seriesCert, seriesRate) {
let option = {
title: {
text: "",
x: "left"
},
tooltip: {
trigger: "axis",
// axisPointer: {
// type: "cross",
// crossStyle: {
// color: "#999"
// }
// },
axisPointer: {
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
shadowStyle: {
shadowColor: '#E3EFED',
width: 36,
},
},
backgroundColor: 'rgba(0,0,0,0.7)',
formatter: function (params) {
let relVal = "";
let divList = [];
divList[0] = "<div style='background: #5D7092;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[1] = "<div style='background: #FFB01B;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[2] = "<div style='background: #559A99;height: 12px;width: 12px;margin: 5px 5px 0 5px;float: left;border-radius:50%;'></div>";
for (let j = 0, l = params.length; j < l; j++) {
relVal += divList[j] + params[j].seriesName + "： " + params[j].value;
if (j === 2) {
relVal += "%";
} else {
relVal += "<br/>";
}
}
return relVal;
}
},
color: ['#5D7092', '#FFB01B', '#559A99'],
dataZoom: {
show: true,
start: 0,
end: 100
},
legend: {
data: ["参与人数", "获证人数", "获证比例"]
},
grid: {
left: 20,
right: 20,
containLabel: true
},
xAxis: [
{
axisLabel: {
interval: 0,
rotate: 45
},
type: "category",
data: xAxisData,
axisPointer: {
type: "shadow"
},
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
}
],
yAxis: [
{
type: "value",
name: "人数（个）",
axisLabel: {
formatter: "{value} "
},
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
},
{
type: "value",
name: "比例",
min: 0,
max: 100,
show: false,
axisLabel: {
formatter: "{value} %"
},
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
splitLine: {
show: false
}
}
],
series: [
{
name: "参与人数",
barWidth: 10,
type: "bar",
data: seriesJoin,
label: {
show: true,
position: "top",
formatter: "{c}", //这是关键，在需要的地方加上就行了
rotate: -90,
offset: [-5, -15]
}
},
{
name: "获证人数",
barWidth: 10,
type: "bar",
data: seriesCert,
label: {
show: true,
position: "top",
formatter: "{c}", //这是关键，在需要的地方加上就行了
rotate: -90,
offset: [-5, -15]
}
},
{
name: "获证比例",
type: "line",
yAxisIndex: 1,
data: seriesRate,
label: {
show: true,
position: "top",
formatter: "{c}%" //这是关键，在需要的地方加上就行了
}
}
]
};
return option;
}
export function durationOption(xAxisData, seriesData) {
let option = {
title: {
text: "",
x: "left"
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
}
},
color: ['#449284'],
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
dataZoom: {
show: true,
start: 0,
end: 100
},
grid: {
left: 20,
right: 20,
containLabel: true
},
xAxis: [
{
axisLabel: {
interval: 0,
rotate: 35
},
type: "category",
data: xAxisData,
axisTick: {
alignWithLabel: true
},
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
}
],
yAxis: [
{
type: "value",
name: "完成时长 (天)",
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
}
],
series: [
{
name: "时长",
type: "bar",
barWidth: 18,
data: seriesData,
label: {
show: true,
position: "top",
formatter: "{c}", //这是关键，在需要的地方加上就行了
rotate: -90,
offset: [-5, -17]
}
}
]
};
return option;
}
export function educationEffect(xAxisData, seriesBefore, seriesAfter) {
let option = {
title: {
text: ""
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow"
},
formatter: function (params) {
let relVal = params[0].name + "";
let value = 0;
relVal += value + "";
let divList = [];
divList[0] = "<div style='background: #5D7092;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[1] = "<div style='background: #FFB01B;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
for (let j = 0; j <= params.length - 1; j++) {
relVal +=
"<br/>" + divList[j] +
params[j].seriesName +
"： " + params[j].value + "%";
}
return relVal;
}
},
color: ["#FEBB3C", "#39AF9A"],
legend: {
data: ["项目前总正确率", "项目后总正确率"]
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: {
type: "category",
data: xAxisData,
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
},
yAxis: {
min: 0,
max: 100,
type: "value",
axisLabel: {
formatter: "{value} %"
},
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
},
series: [
{
name: "项目前总正确率",
type: "bar",
barWidth: 18,
data: seriesBefore,
label: {
show: true,
position: "top",
formatter: "{c}%",
rotate: -90,
offset: [-5, -17]
}
},
{
name: "项目后总正确率",
type: "bar",
barWidth: 18,
data: seriesAfter,
label: {
show: true,
position: "top",
formatter: "{c}%",
rotate: -90,
offset: [-5, -17]
}
}
]
};
return option;
}
export function knowledgeEffect(xAxisData, seriesBefore, seriesAfter) {
let option = {
title: {
text: ""
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow"
},
formatter: function (params) {
let relVal = params[0].name + "";
let value = 0;
relVal += value + "";
let divList = [];
divList[0] = "<div style='background: #5D7092;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[1] = "<div style='background: #FFB01B;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
for (let j = 0; j <= params.length - 1; j++) {
relVal +=
"<br/>" + divList[j] +
params[j].seriesName +
"： " + params[j].value + "%";
}
return relVal;
}
},
color: ["#FFB01B", "#5D7092"],
dataZoom: {
show: true,
start: 0,
end: 100
},
legend: {
data: ["培训前正确率", "培训后正确率"]
},
grid: {
left: 20,
right: 20,
containLabel: true
},
xAxis: {
axisLabel: {
interval: 0,
rotate: 45
},
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
type: "category",
data: xAxisData,
},
yAxis: {
min: 0,
max: 100,
type: "value",
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
axisLabel: {
formatter: "{value} %"
}
},
series: [
{
name: "培训前正确率",
type: "bar",
barWidth: 18,
data: seriesBefore,
label: {
show: true,
position: "top",
formatter: "{c}%", //这是关键，在需要的地方加上就行了
rotate: -90,
offset: [-5, -17]
},
},
{
name: "培训后正确率",
type: "bar",
barWidth: 18,
data: seriesAfter,
label: {
show: true,
position: "top",
formatter: "{c}%", //这是关键，在需要的地方加上就行了
rotate: -90,
offset: [-5, -17]
}
}
]
};
return option;
}
export function examTimes(xAxisData, seriesData) {
let option = {
title: {
text: "",
x: "left"
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
}
},
color: ['#449284'],
grid: {
left: 20,
right: 20,
containLabel: true
},
dataZoom: {
show: true,
start: 0,
end: 100
},
xAxis: [
{
axisLabel: {
interval: 0,
},
type: "category",
data: xAxisData,
axisTick: {
alignWithLabel: true
},
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
}
],
yAxis: [
{
splitLine: {
show: true
},
type: "value",
name: "人数 (名)",
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
}
],
series: [
{
name: "",
type: "bar",
barWidth: 17,
data: seriesData,
label: {
show: true,
position: "top",
formatter: "{c}",
rotate: -90,
offset: [-5, -15],
}
}
]
};
return option;
}
export function examScore(xAxisData, seriesData) {
let option = {
title: {
text: "",
x: "left"
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
}
},
color: ['#CAA861'],
grid: {
left: 20,
right: 20,
containLabel: true
},
dataZoom: {
show: true,
start: 0,
end: 100
},
xAxis: [
{
axisLabel: {
interval: 0,
},
type: "category",
data: xAxisData,
axisTick: {
alignWithLabel: true
},
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
}
],
yAxis: [
{
splitLine: {
show: true
},
type: "value",
name: "人数 (名)",
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
}
],
series: [
{
name: "",
type: "bar",
barWidth: 17,
data: seriesData,
label: {
show: true,
position: "top",
formatter: "{c}",
rotate: -90,
offset: [-5, -15],
}
}
]
};
return option;
}
export function ringOption(num, color) {
let option = {
title: {
text: num + '%',
x: 'center',
y: 'center',
textStyle: {
fontSize: 24,
fontWeight: 'normal',
color: '#000000',
},
subtextStyle: {
color: "#000000",
fontWeight: 'normal'
}
},
series: [{
type: 'pie',
radius: ['100%', '80%'],
// silent: true,
labelLine: {
show: false
},
data: [{
hoverOffset: 1,
value: num,
itemStyle: {
color: color
},
label: {
show: false
}
},
{
markArea: {
silent: true,
},
value: 100 - num,
itemStyle: {
color: '#F0F2F5'
},
label: {
show: false
}
}
]
}]
};
return option;
}
\ No newline at end of file
src/utils/operation.js
浏览文件 @ e6145256
...@@ -305,6 +305,20 @@ export function setRegionOption2(data) { ...@@ -305,6 +305,20 @@ export function setRegionOption2(data) {
} }
return option; return option;
} }
export function setRegionOptionNew(data) {
let option = [];
for (let i = 0; i < data.length; i++) {
let obj = data[i];
obj.label = data[i].label;
obj.value = data[i].id;
if(obj.degree == 4 || obj.degree == 0 || obj.label == "全部") {
// if(obj.degree == 4 ) {
obj.leaf = true;
}
option.push(obj);
}
return option;
}
export function setAdministrativeId(value) { export function setAdministrativeId(value) {
let areaId = '000'; let areaId = '000';
for (let i = 0; i < value.length; i++) { for (let i = 0; i < value.length; i++) {
...@@ -335,16 +349,17 @@ export function getLearnOrganization(data) { ...@@ -335,16 +349,17 @@ export function getLearnOrganization(data) {
let arr = []; let arr = [];
return arr; return arr;
} }
let organization = [ // let organization = [
{ // {
label: "全部", // label: "全部",
value: 0 // value: 0
}, // },
]; // ];
let organization = [];
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
let obj = { let obj = {
label: data[i].hospital_name, label: data[i].hospitalName,
value: data[i].hospital_id, value: data[i].hospitalId,
index: i, index: i,
}; };
organization.push(obj); organization.push(obj);
...@@ -355,8 +370,9 @@ export function getPicOption(title, legendData, colorData, seriesData) { ...@@ -355,8 +370,9 @@ export function getPicOption(title, legendData, colorData, seriesData) {
let option = { let option = {
title: { title: {
text: title, text: title,
x: "center", x: "left",
top: "3%", left: '20px',
top: "20px",
}, },
tooltip: { tooltip: {
trigger: 'item', trigger: 'item',
...@@ -364,8 +380,8 @@ export function getPicOption(title, legendData, colorData, seriesData) { ...@@ -364,8 +380,8 @@ export function getPicOption(title, legendData, colorData, seriesData) {
}, },
legend: { legend: {
orient: "vertical", orient: "vertical",
top: "3%", top: "center",
left: "left", right: "right",
data: legendData data: legendData
}, },
grid: { grid: {
...@@ -375,13 +391,13 @@ export function getPicOption(title, legendData, colorData, seriesData) { ...@@ -375,13 +391,13 @@ export function getPicOption(title, legendData, colorData, seriesData) {
containLabel: true containLabel: true
}, },
color: colorData, color: colorData,
backgroundColor: '#F3F3F3', backgroundColor: '#FFFFFF',
series: [ series: [
{ {
name: "", name: "",
type: "pie", type: "pie",
radius: "55%", radius: "55%",
center: ["60%", "65%"], center: ["40%", "55%"],
data: seriesData, data: seriesData,
} }
] ]
...@@ -391,12 +407,17 @@ export function getPicOption(title, legendData, colorData, seriesData) { ...@@ -391,12 +407,17 @@ export function getPicOption(title, legendData, colorData, seriesData) {
export function getBarOption(xAxisData, seriesData) { export function getBarOption(xAxisData, seriesData) {
let option = { let option = {
title: { title: {
text: "用户年龄发布", text: "人员年龄分布",
x: "center", x: "left",
top: "3%", left: '20px',
top: "20px",
},
color: ['#5B8FF9'],
backgroundColor: '#FFFFFF',
tooltip: {
trigger: 'item',
formatter: "{b} : {c} "
}, },
color: ['#3398DB'],
backgroundColor: '#F3F3F3',
grid: { grid: {
left: '3%', left: '3%',
right: '4%', right: '4%',
...@@ -409,22 +430,31 @@ export function getBarOption(xAxisData, seriesData) { ...@@ -409,22 +430,31 @@ export function getBarOption(xAxisData, seriesData) {
data: xAxisData, data: xAxisData,
axisLabel: { axisLabel: {
interval: 0 interval: 0
} },
// axisTick: { axisTick: { // 隐藏刻度
// alignWithLabel: true show: false
// } },
axisLine: { //隐藏轴线
show: false
},
} }
], ],
yAxis: [ yAxis: [
{ {
type: 'value' type: 'value',
axisLine: { //隐藏轴线
show: false
},
axisTick: { // 隐藏刻度
show: false
},
} }
], ],
series: [ series: [
{ {
name: '', name: '',
type: 'bar', type: 'bar',
barWidth: 30, barWidth: 18,
data: seriesData, data: seriesData,
} }
] ]
...@@ -592,13 +622,23 @@ export function initRank(data) { ...@@ -592,13 +622,23 @@ export function initRank(data) {
} }
return list; return list;
} }
export function getAvgTime(data) { export function getAvgTime(value) {
let list = [0, 0]; let list = [0,0];
if (data != null && data != '') { let avgTime = '';
list[0] = Math.floor(data / 60); if(value != null && value !='') {
list[1] = data % 60; list[0] = Math.floor(value / 60);
list[1] = value % 60;
} }
return list; if(list[0] == 0 && list[1] == 0) {
avgTime = list[1] + '秒';
} else if(list[0] == 0 && list[1] != 0) {
avgTime = list[1] + '秒';
} else if(list[0] != 0 && list[1] == 0) {
avgTime = list[0] + '分钟';
} else if(list[0] != 0 && list[1] != 0) {
avgTime = list[0] + '分钟' + list[1] + '秒';
}
return avgTime;
} }
export function getComponent(data) { export function getComponent(data) {
let list = []; let list = [];
...@@ -642,3 +682,34 @@ export function setSelectedKeys(checkedKeys, halfCheckedKeys) { ...@@ -642,3 +682,34 @@ export function setSelectedKeys(checkedKeys, halfCheckedKeys) {
} }
return selected; return selected;
} }
export function setDuringTime(time , type) {
let value = time;
if(time == '' || time == null) {
return '';
}
if(type == 'begin') {
value = time[0];
} else if(type == 'end') {
value = time[1];
}
return value;
}
export function setHospitalIdList(data) {
let listStr = '';
if(data == null || data.length == 0) {
return listStr
}
for(let i = 0 ; i<data.length ; i++) {
listStr += data[i]+'_';
}
listStr = listStr.substring(0, listStr.length - 1);
return listStr;
}
export function getHospitalIdList(data) {
let listArr = [];
if(data == null || data == '') {
return listArr
}
listArr = data.split("_")
return listArr;
}
\ No newline at end of file
src/views/learning/data-alignment.vue
浏览文件 @ e6145256
...@@ -102,7 +102,7 @@ ...@@ -102,7 +102,7 @@
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="formData.pageNo" :current-page="formData.pageNo"
:page-sizes="[20, 50 ,100]" :page-sizes="[20, 50 ,100, 200]"
:page-size="formData.pageSize" :page-size="formData.pageSize"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="totalRows" :total="totalRows"
...@@ -239,6 +239,7 @@ export default { ...@@ -239,6 +239,7 @@ export default {
handleSizeChange(val) { handleSizeChange(val) {
console.log(`每页 ${val} 条`); console.log(`每页 ${val} 条`);
vm.formData.pageSize = val; vm.formData.pageSize = val;
vm.formData.pageNo = 1;
vm.search(); vm.search();
}, },
// 换页 // 换页
...@@ -261,15 +262,18 @@ export default { ...@@ -261,15 +262,18 @@ export default {
let checkAll = operationData.hasAll(vm.formInline.organization); let checkAll = operationData.hasAll(vm.formInline.organization);
let req = { let req = {
projectId: vm.projectId, projectId: vm.projectId,
hospitalIdList: vm.formInline.organization,
originalFlag: vm.formInline.checked == false ? 0 : 1,
regionId: vm.formInline.region[vm.formInline.region.length - 1],
timeFlag: vm.formInline.timeFlag,
achievementStatus: vm.formData.achievementStatus, achievementStatus: vm.formData.achievementStatus,
status: vm.formData.status, status: vm.formData.status,
ids: operationData.getIds(vm.formInline,vm.organizationList,checkAll),
type: operationData.getSearchType(vm.formInline,checkAll),
doctorName: vm.formData.doctorName, doctorName: vm.formData.doctorName,
pageNo: vm.formData.pageNo, pageNo: vm.formData.pageNo,
pageSize: vm.formData.pageSize, pageSize: vm.formData.pageSize,
}; };
vm.reportGET("report/portal/getProjectData", req).then(res => { vm.POST("stats/report/getProjectData", req).then(res => {
// closeLoading(vm); // closeLoading(vm);
if (res.code == "000000") { if (res.code == "000000") {
vm.tableData = res.data.projectData; vm.tableData = res.data.projectData;
...@@ -339,7 +343,7 @@ export default { ...@@ -339,7 +343,7 @@ export default {
joinDoctorIdList: operationData.getAjustmentList(vm.changedDoctor), joinDoctorIdList: operationData.getAjustmentList(vm.changedDoctor),
}; };
openLoading(vm); openLoading(vm);
vm.reportPOST("report/portal/peopleAdjustment", req).then(res => { vm.POST("stats/report/peopleAdjustment", req).then(res => {
closeLoading(vm); closeLoading(vm);
vm.$message(res.message); vm.$message(res.message);
if (res.code == "000000") { if (res.code == "000000") {
......
src/views/learning/export-download.vue
浏览文件 @ e6145256
...@@ -2,8 +2,12 @@ ...@@ -2,8 +2,12 @@
<div class="export-download"> <div class="export-download">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb> <bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="component-content screenSet" id="screenSet"> <div class="component-content screenSet" id="screenSet">
<p>导出文件列表</p> <div class="p-title">任务列表</div>
<el-table :data="tableData" style="width: 100%"> <el-tabs v-model="listType" type="card" @tab-click="handleClick">
<el-tab-pane label="查看报告" name="2"></el-tab-pane>
<el-tab-pane label="导出列表" name="1"></el-tab-pane>
</el-tabs>
<el-table :data="tableData" class="table-export" style="width: 100%">
<el-table-column <el-table-column
prop="title" prop="title"
label="名称" label="名称"
...@@ -11,20 +15,25 @@ ...@@ -11,20 +15,25 @@
min-width="150" min-width="150"
show-overflow-tooltip show-overflow-tooltip
></el-table-column> ></el-table-column>
<el-table-column prop="createdTime" label="时间" align="center" min-width="120"> <el-table-column prop="time" label="时间" align="center" min-width="120">
<template slot-scope="scope">{{ scope.row.createdTime }}</template> <template slot-scope="scope">{{ scope.row.time }}</template>
</el-table-column> </el-table-column>
<el-table-column prop="status" label="状态" align="center" min-width="150"> <el-table-column prop="status" label="状态" align="left" min-width="30">
<template slot-scope="scope">{{ scope.row.status | exportStatus }}</template> <template slot-scope="scope">
<span class="logo" v-bind:class="{ 'logo_0': scope.row.status == 0, 'logo_1': scope.row.status == 1, 'logo_2': scope.row.status == 2 }"></span>
<span class="text">{{ scope.row.status | exportStatus }}</span>
</template>
</el-table-column> </el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="70"> <el-table-column label="操作" fixed="right" align="center" min-width="70">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
type="primary"
:disabled="scope.row.buttonStatus" :disabled="scope.row.buttonStatus"
size="small" size="small"
type="text"
v-if="scope.row.status != 2"
@click="update(scope.row)" @click="update(scope.row)"
>{{ scope.row.buttonText }}</el-button> >{{ scope.row.buttonText }}</el-button>
<div v-if="scope.row.status == 2">-</div>
</template> </template>
</el-table-column> </el-table-column>
<div slot="empty"> <div slot="empty">
...@@ -40,7 +49,7 @@ ...@@ -40,7 +49,7 @@
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="param.pageNo" :current-page="param.pageNo"
:page-sizes="[20, 50 ,100]" :page-sizes="[20, 50 ,100 ,200]"
:page-size="param.pageSize" :page-size="param.pageSize"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="totalRows" :total="totalRows"
...@@ -62,7 +71,7 @@ export default { ...@@ -62,7 +71,7 @@ export default {
data() { data() {
return { return {
curmbFirst: "学情报告", curmbFirst: "学情报告",
curmbSecond: "导出下载", curmbSecond: "任务列表",
projectId: "", projectId: "",
tableData: [], tableData: [],
param: { param: {
...@@ -71,7 +80,8 @@ export default { ...@@ -71,7 +80,8 @@ export default {
}, },
totalRows: 0, totalRows: 0,
totalTime: 3, totalTime: 3,
queryData: {} queryData: {},
listType: "2"
// buttonText: "刷新", // buttonText: "刷新",
// buttonStatus: false, // buttonStatus: false,
}; };
...@@ -79,75 +89,94 @@ export default { ...@@ -79,75 +89,94 @@ export default {
created() { created() {
vm = this; vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "projectId"); this.projectId = vm.getUrlSearch(window.location.href, "projectId");
let listType = vm.getUrlSearch(window.location.href, "listType");
if(listType == null) {
vm.listType = '2';
} else {
vm.listType = listType;
}
this.search(); this.search();
}, },
mounted: function() { mounted: function() {
commonUtil.resizeHeight(); commonUtil.resizeHeight();
}, },
methods: { methods: {
handleClick(tab, event) {
vm.listType = tab.name;
vm.search()
},
setButton() { setButton() {
for (let i = 0; i < vm.tableData.length; i++) { for (let i = 0; i < vm.tableData.length; i++) {
vm.tableData[i].index = i; vm.tableData[i].index = i;
if (vm.tableData[i].status == 1) { if (vm.tableData[i].status == 1) {
if(vm.listType == '2') {
vm.tableData[i].buttonText = "查看报告";
} else if(vm.listType == '1') {
vm.tableData[i].buttonText = "下载"; vm.tableData[i].buttonText = "下载";
}
vm.tableData[i].buttonStatus = false; vm.tableData[i].buttonStatus = false;
} else if(vm.tableData[i].status == 0) { } else if (vm.tableData[i].status == 0) {
vm.tableData[i].buttonText = "刷新"; vm.tableData[i].buttonText = "刷新";
vm.tableData[i].buttonStatus = false; vm.tableData[i].buttonStatus = false;
} else if(vm.tableData[i].status == 2) { } else if (vm.tableData[i].status == 2) {
vm.tableData[i].buttonText = "刷新"; vm.tableData[i].buttonText = "刷新";
vm.tableData[i].buttonStatus = true; vm.tableData[i].buttonStatus = true;
} }
} }
}, },
search() { search() {
// this.setButton(); let projectId = "";
let req = { if (vm.projectId != null) {
projectId: vm.projectId projectId = vm.projectId;
};
if(req.projectId == null) {
req.projectId = '';
} }
vm.reportGET("report/downLoad/getDownloadList", req).then(res => { let reqList = {
projectId: projectId,
pageNo: vm.param.pageNo,
pageSize: vm.param.pageSize,
type: parseInt(vm.listType),
id: ""
};
vm.GET("stats/mission/missionlist", reqList).then(res => {
if (res.code == "000000") { if (res.code == "000000") {
vm.tableData = res.data.data; vm.tableData = res.data.list;
vm.totalRows = res.data.totalRows; vm.totalRows = res.data.totalSize;
vm.setButton(); vm.setButton();
} }
}); });
}, },
downLoad(row) {
// vm.queryData = this.$route.query;
// let req = vm.queryData;
// openLoading(vm);
// vm.reportGET("report/downLoad/downLoad", req).then(res => {
// closeLoading(vm);
// // console
// if (res.code == "000000") {
// }
// });
setTimeout(() => {
window.open(row.fileUrl);
}, 500);
},
getDownLoadStatus(row) { getDownLoadStatus(row) {
let req = { // let req = {
// id: row.id
// };
let projectId = "";
if (vm.projectId != null) {
projectId = vm.projectId;
}
let reqList = {
projectId: projectId,
pageNo: vm.param.pageNo,
pageSize: vm.param.pageSize,
type: parseInt(vm.listType),
id: row.id id: row.id
}; };
vm.reportGET("report/downLoad/getDownLoadStatus", req).then(res => { vm.GET("stats/mission/missionlist", reqList).then(res => {
if (res.code == "000000") { if (res.code == "000000") {
vm.tableData[row.index].status = res.data.data; vm.tableData[row.index].status = res.data.list[0].status;
let updateStatus = res.data.list[0].status;
// console.log('res.data.data',res.data.data); // console.log('res.data.data',res.data.data);
if (res.data.data == 1) { if (updateStatus == 1) {
vm.tableData[row.index].title = vm.tableData[row.index].title + " "; vm.tableData[row.index].title = vm.tableData[row.index].title + " ";
// vm.tableData[row.index].buttonText = "下载";
if(vm.listType == '2') {
vm.tableData[row.index].buttonText = "查看报告";
} else if(vm.listType == '1') {
vm.tableData[row.index].buttonText = "下载"; vm.tableData[row.index].buttonText = "下载";
vm.tableData[row.index].fileUrl = res.data.url; }
} else if(res.data.data == 0) { vm.tableData[row.index].fileUrl = res.data.list[0].url;
console.log("res", res, vm.tableData[row.index]); } else if (updateStatus == 0) {
vm.tableData[row.index].title = vm.tableData[row.index].title + " "; vm.tableData[row.index].title = vm.tableData[row.index].title + " ";
vm.tableData[row.index].buttonText = "刷新"; vm.tableData[row.index].buttonText = "刷新";
} else if(res.data.data == 2) { } else if (updateStatus == 2) {
vm.tableData[row.index].title = vm.tableData[row.index].title + " "; vm.tableData[row.index].title = vm.tableData[row.index].title + " ";
vm.tableData[row.index].buttonText = "刷新"; vm.tableData[row.index].buttonText = "刷新";
vm.tableData[row.index].buttonStatus = true; vm.tableData[row.index].buttonStatus = true;
...@@ -159,9 +188,22 @@ export default { ...@@ -159,9 +188,22 @@ export default {
} }
}); });
}, },
downLoad(row) {
setTimeout(() => {
window.open(row.fileUrl);
}, 500);
},
exportTime(row) {
vm.$router.push("item-list?downloadId="+row.id);
},
update(row) { update(row) {
if (vm.tableData[row.index].status == 1) { if (vm.tableData[row.index].status == 1) {
// vm.downLoad(row);
if(vm.listType == '2') {
vm.exportTime(row);
} else if(vm.listType == '1') {
vm.downLoad(row); vm.downLoad(row);
}
} else { } else {
this.$nextTick(function() { this.$nextTick(function() {
console.log(vm.tableData[row.index]); console.log(vm.tableData[row.index]);
...@@ -189,11 +231,12 @@ export default { ...@@ -189,11 +231,12 @@ export default {
// 更改数据显示数量 // 更改数据显示数量
handleSizeChange(val) { handleSizeChange(val) {
vm.param.pageSize = val; vm.param.pageSize = val;
vm.param.pageNo = 1;
vm.search(); vm.search();
}, },
// 换页 // 换页
handleCurrentChange(val) { handleCurrentChange(val) {
vm.param.pageNo = value; vm.param.pageNo = val;
vm.search(); vm.search();
} }
} }
...@@ -204,6 +247,46 @@ export default { ...@@ -204,6 +247,46 @@ export default {
.component-content { .component-content {
background: #fff; background: #fff;
padding: 10px; padding: 10px;
.p-title {
position: relative;
margin-top: 30px;
margin-left: 30px;
margin-bottom: 30px;
height: 25px;
font-size: 18px;
font-weight: 600;
line-height: 25px;
color: #000000;
}
.table-export {
.logo {
margin-top: 8px;
margin-right: 6px;
float: left;
width: 6px;
height: 6px;
border-radius: 50%;
}
.logo_0 {
background: #1890ff;
}
.logo_1 {
background: #52C41A;
}
.logo_2 {
background: #F5222D;
}
.text {
float: left;
}
.el-button--text {
color: #449284;
}
.el-button.is-disabled {
background: #fff !important;
border: 0px solid #fff !important;
}
}
} }
} }
</style> </style>
\ No newline at end of file
src/views/learning/item-course-analysis.vue
浏览文件 @ e6145256
<template> <template>
<div class="course-analysis-wrap"> <div class="course-analysis-wrap">
<div v-for="(item , index) in cardData" :key="index" class=""> <div class="box-list">
<el-card class="box-card"> <div v-for="(item , index) in cardData" :key="index" class="box-card" v-bind:class="{ 'box-last': index == 2 }">
<div slot="header" class="title"> <!-- <el-card class="box-card" v-bind:class="{ 'box-last': index == 2 }"> -->
<span class="weight">{{ item.title }}</span> <p class="value">{{ item.value }}</p>
<p class="title">{{ item.title }}</p>
<!-- </el-card> -->
</div> </div>
<div class="box-content">
<span v-if="item.num !=0" class="weight">{{ item.num }} </span>
<span v-if="item.num !=0">{{ item.unit }} </span>
<span v-if="index == 2 && second !=0" class="weight" >{{ second }} </span>
<span v-if="index == 2 && second !=0">秒</span>
</div> </div>
</el-card> <div class="spacing"></div>
<div v-if="index+1 !== cardData.length" class="line"></div> <!-- <div class="chart-title">考试列表</div> -->
</div> <div v-if="downloadId == null">
<el-table <el-table :data="tableData" class="course-table">
:data="tableData" <el-table-column prop="courseName" label="课程名" align="center"></el-table-column>
class="course-table"> <el-table-column prop="courseTime" label="课程时长" align="center">
<el-table-column prop="courseName" label="课程名" align="center"> <template slot-scope="scope">{{ scope.row.courseTime | getTotalTime }}</template>
</el-table-column> </el-table-column>
<el-table-column prop="courseTotalTime" label="课程时长" align="center"> <el-table-column prop="averageTime" label="人均学习时长" align="center">
<template slot-scope="scope"> <template slot-scope="scope">{{ scope.row.averageTime | getAvgTime }}</template>
{{ scope.row.courseTotalTime | getTotalTime }}
</template>
</el-table-column> </el-table-column>
<el-table-column prop="courseAvgStudyTime" label="人均学习时长" align="center"> <el-table-column prop="joinCount" label="参与培训人数" align="center"></el-table-column>
<el-table-column prop="finishCount" label="完成培训人数" align="center"></el-table-column>
<el-table-column fixed="right" label="操作" min-width="50" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.courseAvgStudyTime | getAvgTime }} <el-button class="button-jump" @click="goPage(scope.row)" type="text" size="small">查看名单</el-button>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="courseLearnerCount" label="参与培训人数" align="center"> <div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png" />
<p>没有相关数据，请重新选择查询范围</p>
</div>
</div>
</el-table>
</div>
<div v-if="downloadId != null">
<el-table :data="tableData.slice((pageNo-1)*pageSize,pageNo*pageSize)" class="course-table">
<el-table-column prop="courseName" label="课程名" align="center"></el-table-column>
<el-table-column prop="courseTime" label="课程时长" align="center">
<template slot-scope="scope">{{ scope.row.courseTime | getTotalTime }}</template>
</el-table-column> </el-table-column>
<el-table-column prop="courseFinishedCount" label="完成培训人数" align="center"> <el-table-column prop="averageTime" label="人均学习时长" align="center">
<template slot-scope="scope">{{ scope.row.averageTime | getAvgTime }}</template>
</el-table-column> </el-table-column>
<el-table-column prop="joinCount" label="参与培训人数" align="center"></el-table-column>
<el-table-column prop="finishCount" label="完成培训人数" align="center"></el-table-column>
<el-table-column fixed="right" label="操作" min-width="50" align="center"> <el-table-column fixed="right" label="操作" min-width="50" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button class="button-jump" @click="goPage(scope.row)" type="text" size="small">查看名单</el-button>
@click="checkName(scope.row)"
type="text"
size="small"
>查看名单</el-button>
</template> </template>
</el-table-column> </el-table-column>
<div slot="empty"> <div slot="empty">
<div class="table-empty"> <div class="table-empty">
<img src="../../assets/image/no-content1.png"> <img src="../../assets/image/no-content1.png" />
<p>没有相关数据，请重新选择查询范围</p> <p>没有相关数据，请重新选择查询范围</p>
</div> </div>
</div> </div>
</el-table> </el-table>
</div>
<div class="pagination"> <div class="pagination">
<el-pagination <el-pagination
class="pagination"
background background
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="pageNo" :current-page="pageNo"
:page-sizes="[20, 50 ,100]" :page-sizes="[20, 50 ,100, 200]"
:page-size="pageSize" :page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="totalRows" :total="totalRows"
...@@ -81,25 +91,38 @@ export default { ...@@ -81,25 +91,38 @@ export default {
}, },
organizationList: { organizationList: {
type: Array type: Array
} },
timeInfoData: {
type: Object
},
}, },
data() { data() {
return { return {
cardData: [], cardData: [],
tableData: [], tableData: [],
totalRows: 0, totalRows: 0,
projectId: '', projectId: "",
pageNo: 1, pageNo: 1,
pageSize: 20, pageSize: 20,
second: 0, timeInfoChild: {},
downloadId: null,
};
},
watch: {
timeInfoData: {
deep: true,
handler(nv, ov) {
vm.timeInfoChild = nv;
}
} }
}, },
created() { created() {
vm = this; vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "id"); vm.projectId = vm.getUrlSearch(window.location.href, "id");
vm.downloadId = vm.getUrlSearch(window.location.href, "downloadId");
}, },
mounted: function() { mounted: function() {
this.$on('search',()=>{ this.$on("search", () => {
// console.log(this.formInline); // console.log(this.formInline);
this.pageNo = 1; this.pageNo = 1;
this.search(); this.search();
...@@ -111,145 +134,217 @@ export default { ...@@ -111,145 +134,217 @@ export default {
} }
}); });
}); });
this.$on("reset",() =>{ this.$on("reset", () => {
this.pageNo = 1; this.pageNo = 1;
this.pageSize = 20; this.pageSize = 20;
this.tableData = []; this.tableData = [];
this.cardData = []; this.cardData = [];
}); });
this.$on("static", () => {
vm.getStatic();
});
}, },
methods: { methods: {
getStatic() {
// console.log(vm.timeInfoChild);
let courseAnalysisModel = vm.timeInfoChild.courseAnalysisModel;
vm.setCardData(courseAnalysisModel);
vm.tableData = courseAnalysisModel.pCourseList;
vm.totalRows = courseAnalysisModel.totalSize;
},
setCardData(data) { setCardData(data) {
vm.totalRows = data.projectCourseCount; vm.totalRows = data.projectCourseCount;
let avgTime = []; let cardData = [
avgTime = operationData.getAvgTime(data.projectAvgStudyTime);
vm.cardData = [
{ {
title: '项目所有课程数', title: "项目所有课程数",
num: data.projectCourseCount, value: "0门"
unit: '门课程', },
},{ {
title: '项目所有课程总时长', title: "项目所有课程总时长",
num: data.projectCourseTotalTime, value: "0分钟"
unit: '分钟', },
},{ {
title: '项目人均学习时长', title: "项目人均学习时长",
num: avgTime[0], value: "0分钟"
unit: '分钟',
} }
]; ];
vm.second = avgTime[1]; cardData[0].value = data.totalSize+'门';
// cardData[1].value = data.pCourseTotalTime+"分钟";
cardData[1].value = operationData.getAvgTime(data.pCourseTotalTime);
cardData[2].value = operationData.getAvgTime(data.pCourseAvg);
vm.cardData = cardData;
}, },
search() { search(type) {
if (vm.formInline.region.length == 0) { // if (vm.formInline.region.length == 0) {
const h = this.$createElement; // const h = this.$createElement;
vm.$message({ // vm.$message({
message: h('p', { style: 'color: #FF3399' }, '请先选择地区后再进行查询 ') // message: h(
}); // "p",
return; // { style: "color: #FF3399" },
} // "请先选择地区后再进行查询 "
let checkAll = operationData.hasAll(vm.formInline.organization) // )
// });
// return;
// }
let checkAll = operationData.hasAll(vm.formInline.organization);
let req = { let req = {
projectId: vm.projectId, projectId: vm.projectId,
ids: operationData.getIds(vm.formInline,vm.organizationList,checkAll), beginDate: operationData.setDuringTime(vm.formInline.during, "begin"),
type: operationData.getSearchType(vm.formInline,checkAll), endDate: operationData.setDuringTime(vm.formInline.during, "end"),
originalFlag: vm.formInline.checked == false ? 0 : 1 hospitalIdList: vm.formInline.organization,
originalFlag: vm.formInline.checked == false ? 0 : 1,
regionId: vm.formInline.region[vm.formInline.region.length - 1],
timeFlag: vm.formInline.timeFlag,
pageNo: vm.pageNo,
pageSize: vm.pageSize,
}; };
console.log("3 req", req); // console.log("3 req", req);
openLoading(vm); openLoading(vm);
vm.reportGET("report/portalProjectCourse/getTotal", req).then(res => { vm.POST("stats/report/course", req).then(res => {
closeLoading(vm); closeLoading(vm);
if (res.code == "000000") { if (res.code == "000000") {
if(res.data.projectCourseCount == 0 ) { if (type !== 2) {
vm.$message("没有相关数据，请重新选择查询范围"); vm.setCardData(res.data);
} }
vm.setCardData(res.data) vm.tableData = res.data.pCourseList;
vm.totalRows = res.data.totalSize;
} else { } else {
vm.$message(res.message); // vm.$message(res.message);
}
});
let reqList = req;
reqList.pageNo = vm.pageNo;
reqList.pageSize = vm.pageSize;
vm.reportGET("report/portalProjectCourse/getCourseList", reqList).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.tableData = res.data.list;
} }
}); });
}, },
checkName(data) { goPage(data) {
console.log('dialogData',this.dialogData);
let checkAll = operationData.hasAll(vm.formInline.organization)
let routerData = {}; let routerData = {};
if(vm.downloadId == null) {
// console.log("dialogData", this.dialogData);
routerData = this.dialogData; routerData = this.dialogData;
routerData.projectId = vm.projectId; routerData.projectId = vm.projectId;
routerData.projectName = vm.getUrlSearch(window.location.href, "projectName"); routerData.projectName = vm.getUrlSearch(
window.location.href,
"projectName"
);
routerData.tableType = 1; routerData.tableType = 1;
routerData.courseId = data.courseId; routerData.courseId = data.courseId;
routerData.ids = operationData.getIds(vm.formInline,vm.organizationList,checkAll); routerData.beginDate = operationData.setDuringTime(vm.formInline.during, "begin"),
routerData.type = operationData.getSearchType(vm.formInline,checkAll); routerData.endDate = operationData.setDuringTime(vm.formInline.during, "end"),
routerData.regionId = vm.formInline.region[vm.formInline.region.length - 1];
routerData.originalFlag = vm.formInline.checked == false ? 0 : 1; routerData.originalFlag = vm.formInline.checked == false ? 0 : 1;
routerData.timeFlag = vm.formInline.timeFlag;
routerData.hospitalIdList = operationData.setHospitalIdList(vm.formInline.organization);
} else {
let reportParamModel = vm.timeInfoChild.reportParamModel;
routerData.base = 'static';
routerData.region = reportParamModel.regionNames;
routerData.organization = reportParamModel.hospitalNames;
routerData.projectId = reportParamModel.projectId,
routerData.projectName = reportParamModel.projectName,
routerData.tableType = 1;
routerData.courseId = data.courseId;
routerData.beginDate = reportParamModel.beginDate;
routerData.endDate = reportParamModel.endDate;
routerData.regionId = reportParamModel.regionId;
routerData.originalFlag = reportParamModel.originalFlag;
routerData.timeFlag = reportParamModel.timeFlag;
routerData.hospitalIdList = operationData.setHospitalIdList(reportParamModel.hospitalIdList);
}
// this.$router.push({ path: '/name-list', query: routerData}); // this.$router.push({ path: '/name-list', query: routerData});
let routeData = this.$router.resolve({ path: '/name-list', query: routerData}); let routeData = this.$router.resolve({
window.open(routeData.href, '_blank'); path: "/name-list",
query: routerData
});
window.open(routeData.href, "_blank");
}, },
handleSizeChange(val) { handleSizeChange(val) {
console.log(`每页 ${val} 条`); console.log(`每页 ${val} 条`);
vm.pageSize = val; vm.pageSize = val;
vm.pageNo = 1;
if(vm.downloadId == null) {
vm.search(); vm.search();
}
}, },
handleCurrentChange(val) { handleCurrentChange(val) {
console.log(`当前页: ${val}`); console.log(`当前页: ${val}`);
vm.pageNo = val; vm.pageNo = val;
if(vm.downloadId == null) {
vm.search(); vm.search();
}, }
}, }
} }
};
</script> </script>
<style lang="scss"> <style lang="scss">
.course-analysis-wrap { .course-analysis-wrap {
background: #fff; background: #fff;
overflow: hidden; overflow: hidden;
padding: 10px; .spacing {
.weight { position: relative;
font-weight: bold; width: 100%;
} height: 20px;
.title:after { background: #f0f2f5;
clear: both
}
.el-card {
border-width: 0px;
} }
.el-card.is-always-shadow { .chart-title {
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.1); position: relative;
} margin-top: 17px;
.line { margin-left: 30px;
background: #e4e4e4; width: 100%;
height: 80px; height: 60px;
width: 1px; font-size: 18px;
float: left; font-weight: 600;
margin-top: 20px; line-height: 60px;
color: #000000;
} }
.box-list {
position: relative;
height: 120px;
background: #f0f2f5;
.box-card { .box-card {
position: relative;
background-color: #ffffff;
width: 32%; width: 32%;
margin-right: 1%; margin-right: 2%;
height: 120px;
float: left; float: left;
.el-card__header { .el-card__header {
border-bottom-width: 0; border-bottom-width: 0;
} }
.title { .el-card__body {
padding: 0px;
}
.value {
color: #373839;
text-align: center; text-align: center;
margin-top: 24px;
margin-bottom: 8px;
height: 45px;
line-height: 45px;
font-size: 32px;
font-weight: 500;
} }
.box-content { .title {
color: #666666;
text-align: center; text-align: center;
height: 40px; font-size: 14px;
height: 20px;
line-height: 20px;
}
}
.box-last {
margin-right: 0%;
} }
} }
.course-table { .course-table {
top: 20px; top: 20px;
margin-bottom: 20px; padding: 0;
width: 95%;
margin:0 auto 20px auto;
.button-jump {
color: #449284;
}
}
.pagination {
margin-top: 30px;
margin-right: 13px;
} }
} }
</style> </style>
\ No newline at end of file
src/views/learning/item-crowd-analysis.vue
浏览文件 @ e6145256
<template> <template>
<div class="crowd-analysis-wrap"> <div class="crowd-analysis-wrap">
<el-radio-group class="crowd-radio" v-model="radio" size="small" @change="updateRadio"> <el-radio-group class="crowd-radio" v-model="radio" size="small" @change="updateRadio">
<el-radio-button label="1">全部用户</el-radio-button> <el-radio-button label="0">全部人员</el-radio-button>
<el-radio-button label="2">参与项目</el-radio-button> <el-radio-button label="1">参与项目</el-radio-button>
<el-radio-button label="3">通过项目</el-radio-button> <el-radio-button label="2">通过项目</el-radio-button>
</el-radio-group> </el-radio-group>
<div v-show="!showData" class="empty"> <div v-show="!showData" class="empty">
<p>"没有相关数据，请重新选择查询范围"</p> <p>"没有相关数据，请重新选择查询范围"</p>
...@@ -11,14 +11,19 @@ ...@@ -11,14 +11,19 @@
<div class="chart" v-show="showData"> <div class="chart" v-show="showData">
<div class="item" id="education" ref="education"></div> <div class="item" id="education" ref="education"></div>
<div class="item item-right" id="job" ref="job"></div> <div class="item item-right" id="job" ref="job"></div>
</div>
<div class="chart" v-show="showData">
<div class="item"> <div class="item">
<div class="title">用户性别分布</div> <div class="title">人员性别分布</div>
<div class="sex"> <div class="sex">
<div class="sex-item" v-for="(item , index) in sexData" :key="index"> <div class="sex-item" v-for="(item , index) in sexData" :key="index">
<img class="sex-img" v-bind:src="item.src" /> <!-- <img class="sex-img" v-bind:src="item.src" /> -->
<p class="sex-type">{{ item.type }}</p> <!-- <el-progress class="sex-img" :color="item.color" :stroke-width=12 type="circle" :percentage="item.rate"></el-progress> -->
<p></p> <div v-if="index == 0" class="sex-img" id="ring0" ref="ring0"></div>
<div v-if="index == 1" class="sex-img" id="ring1" ref="ring1"></div>
<div v-if="index == 2" class="sex-img" id="ring2" ref="ring2"></div>
<p class="sex-num">{{ item.num }}</p> <p class="sex-num">{{ item.num }}</p>
<p class="sex-type">{{ item.type }}</p>
</div> </div>
</div> </div>
</div> </div>
...@@ -33,6 +38,7 @@ import { mapGetters } from "vuex"; ...@@ -33,6 +38,7 @@ import { mapGetters } from "vuex";
import { openLoading, closeLoading } from "../../utils/utils"; import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils"; import * as commonUtil from "../../utils/utils";
import * as operationData from "../../utils/operation"; import * as operationData from "../../utils/operation";
import * as chartData from "../../utils/learning/chartData";
import echarts from "echarts"; import echarts from "echarts";
import { setTimeout } from "timers"; import { setTimeout } from "timers";
let vm = null; let vm = null;
...@@ -49,31 +55,64 @@ export default { ...@@ -49,31 +55,64 @@ export default {
}, },
organizationList: { organizationList: {
type: Array type: Array
} },
timeInfoData: {
type: Object
},
}, },
data() { data() {
return { return {
radio: 1, radio: 0,
sexData: [], sexData: [
{
color: '#1890FF',
type: "男性",
num: 0,
rate: 0,
},
{
color: '#FB5B52',
type: "女性",
num: 0,
rate: 0,
},
{
color: '#5D7092',
type: "未完善信息",
num: 0,
rate: 0,
}
],
projectId: "", projectId: "",
crowdData: {}, crowdData: {},
showData: false, showData: true,
echartsData: { echartsData: {
chart1: {}, chart1: {},
chart2: {}, chart2: {},
chart3: {}, chart3: {},
}, },
downloadId: null,
timeInfoChild: {},
}; };
}, },
watch: {
timeInfoData: {
deep: true,
handler(nv, ov) {
vm.timeInfoChild = nv;
}
}
},
created() { created() {
vm = this; vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "id"); vm.projectId = vm.getUrlSearch(window.location.href, "id");
vm.downloadId = vm.getUrlSearch(window.location.href, "downloadId");
}, },
mounted: function() { mounted: function() {
// commonUtil.resizeHeight(); // commonUtil.resizeHeight();
//父组件传值 //父组件传值
this.$on("search", () => { this.$on("search", () => {
vm.radio = 1; vm.radio = 0;
this.search(); this.search();
}); });
this.$on("init", () => { this.$on("init", () => {
...@@ -87,48 +126,50 @@ export default { ...@@ -87,48 +126,50 @@ export default {
this.showData = false; this.showData = false;
this.crowdData = {}; this.crowdData = {};
}); });
if (this.activeName == "second") { this.$on("static", () => {
} vm.getStatic();
});
}, },
methods: { methods: {
getStatic() {
// console.log(vm.timeInfoChild);
let userAnalysisModel = vm.timeInfoChild.userAnalysisModel;
setTimeout(function() {
vm.educationDivision(userAnalysisModel.eduListInMap[0]);
vm.jobDivision(userAnalysisModel.titleListInMap[0]);
vm.getSexData(userAnalysisModel.sexListInMap[0]);
vm.ageDivision(userAnalysisModel.ageListInMap[0]);
},20);
},
search() { search() {
if (vm.formInline.region.length == 0) {
const h = this.$createElement;
vm.$message({
message: h('p', { style: 'color: #FF3399' }, '请先选择地区后再进行查询 ')
});
return;
}
let checkAll = operationData.hasAll(vm.formInline.organization); let checkAll = operationData.hasAll(vm.formInline.organization);
let req = { let req = {
projectId: vm.projectId, projectId: vm.projectId,
cityOrHospitalId: operationData.getIds(vm.formInline,vm.organizationList,checkAll), beginDate: operationData.setDuringTime(vm.formInline.during, "begin"),
kind: operationData.getSearchType(vm.formInline,checkAll), endDate: operationData.setDuringTime(vm.formInline.during, "end"),
type: vm.radio, hospitalIdList: vm.formInline.organization,
originalFlag: vm.formInline.checked == false ? 0 : 1 originalFlag: vm.formInline.checked == false ? 0 : 1,
regionId: vm.formInline.region[vm.formInline.region.length - 1],
timeFlag: vm.formInline.timeFlag
}; };
console.log("2 req", req); // console.log("2 req", req);
openLoading(vm); openLoading(vm);
vm.reportGET("report/portal/getPeoplesDetails", req).then(res => { vm.POST("stats/report/userAnalysis_pc/"+vm.radio, req).then(res => {
closeLoading(vm); closeLoading(vm);
if (res.code == "000000") { if (res.code == "000000") {
if(res.data.educationList.length == 0 && res.data.jobTitle.length == 0 ) { // if(res.data.educationList.length == 0 && res.data.jobTitle.length == 0 ) {
vm.$message("没有相关数据，请重新选择查询范围"); // vm.$message("没有相关数据，请重新选择查询范围");
this.showData = false; // this.showData = false;
} else { // } else {
this.showData = true; // this.showData = true;
} // }
this.crowdData = res.data; this.crowdData = res.data;
setTimeout(function() { setTimeout(function() {
vm.educationDivision(); vm.educationDivision(res.data.eduList);
vm.jobDivision(); vm.jobDivision(res.data.titleList);
vm.getSexData(); vm.getSexData(res.data.sexList);
vm.ageDivision(); vm.ageDivision(res.data.ageList);
},20); },20);
// this.educationDivision();
// this.jobDivision();
// this.getSexData();
// this.ageDivision();
} else { } else {
vm.$message(res.message); vm.$message(res.message);
} }
...@@ -144,58 +185,87 @@ export default { ...@@ -144,58 +185,87 @@ export default {
}); });
}, },
updateRadio(value) { updateRadio(value) {
if(vm.downloadId == null) {
console.log(value,vm.radio); console.log(value,vm.radio);
this.search(); this.search();
} else {
let index = parseInt(value);
let userAnalysisModel = vm.timeInfoChild.userAnalysisModel;
setTimeout(function() {
vm.educationDivision(userAnalysisModel.eduListInMap[index]);
vm.jobDivision(userAnalysisModel.titleListInMap[index]);
vm.getSexData(userAnalysisModel.sexListInMap[index]);
vm.ageDivision(userAnalysisModel.ageListInMap[index]);
},20);
}
}, },
//用户性别分布 //用户性别分布
getSexData() { getSexData(data) {
let sexList = this.crowdData.sexList; let sexList = data;
// if(sexList.length <3) { let sexData = [
// this.sexData = [];
// return;
// }
this.sexData = [
{ {
src: require("../../assets/image/man.png"), color: '#1890FF',
type: "男性", type: "男性",
num: 0 num: 0,
rate: 0,
}, },
{ {
src: require("../../assets/image/weman.png"), color: '#FB5B52',
type: "女性", type: "女性",
num: 0 num: 0,
rate: 0,
}, },
{ {
src: require("../../assets/image/question.png"), color: '#5D7092',
type: "未完善信息", type: "未完善信息",
num: 0 num: 0,
rate: 0,
} }
]; ];
for(let i=0;i<sexList.length;i++) { let sum = 0;
if(sexList[i].name == "男") {
this.sexData[0].num = sexList[i].value; if(sexList.length > 0) {
} else if(sexList[i].name == "女") { for(let i = 0 ; i<sexList.length; i++) {
this.sexData[1].num = sexList[i].value; sum += sexList[i].value;
} else { // sexData[i].num = sexList[i].value;
this.sexData[2].num = sexList[i].value;
} }
sexData[0].num = sexList[1].value;
sexData[1].num = sexList[2].value;
sexData[2].num = sexList[0].value;
sexData[0].rate = Math.floor(sexList[1].value / sum *10000) / 100;
sexData[1].rate = Math.floor(sexList[2].value / sum *10000) / 100;
sexData[2].rate = Math.floor(sexList[0].value / sum *10000) / 100;
} }
// console.log('this.$refs.ring0',this.$refs.ring0[0]);
let myChartRing0 = echarts.init(this.$refs.ring0[0]);
let option0 = chartData.ringOption(sexData[0].rate, sexData[0].color);
myChartRing0.setOption(option0);
let myChartRing1 = echarts.init(this.$refs.ring1[0]);
let option1 = chartData.ringOption(sexData[1].rate, sexData[1].color);
myChartRing1.setOption(option1);
let myChartRing2 = echarts.init(this.$refs.ring2[0]);
let option2 = chartData.ringOption(sexData[2].rate, sexData[2].color);
myChartRing2.setOption(option2);
vm.sexData = sexData;
}, },
educationDivision(data) { educationDivision(data) {
// console.log('this.$refs.education',this.$refs.education)
let myChart = echarts.init(this.$refs.education); let myChart = echarts.init(this.$refs.education);
let educationList = operationData.removeZero(this.crowdData.educationList); let educationList = data;
let legendData = []; let legendData = [];
let seriesData = []; let seriesData = [];
let colorData = ["#FF9F7F", "#008000", "#E062AE", "#37A2DA", "#0050DC", "#67E0E3", "#8A2BE2"]; let colorData = ["#7453FF", "#3BA0FF", "#5D7092", "#39AF9A", "#FFBC3D", "#FF9A4B", "#8A2BE2"];
// for (let i = 0; i < educationList.length; i++) {
// legendData[i] = educationList[i].name; for (let i = 0; i < educationList.length; i++) {
// } legendData[i] = educationList[i].name;
if(educationList.length > 0) { seriesData[i] = educationList[i];
legendData = ['博士后','博士','硕士','本科','大专','中专及以下','其他'];
} }
seriesData = educationList;
let option = operationData.getPicOption( let option = operationData.getPicOption(
"用户学历分布", "人员学历发布",
legendData, legendData,
colorData, colorData,
seriesData seriesData
...@@ -206,16 +276,16 @@ export default { ...@@ -206,16 +276,16 @@ export default {
}, },
jobDivision(data) { jobDivision(data) {
let myChart2 = echarts.init(this.$refs.job); let myChart2 = echarts.init(this.$refs.job);
let jobTitle = operationData.removeZero(this.crowdData.jobTitle); let titleList = data;
let legendData = []; let legendData = [];
let seriesData = []; let seriesData = [];
let colorData = ["#FF9F7F", "#008000", "#E062AE", "#37A2DA", "#0050DC", "#67E0E3", "#8A2BE2"]; let colorData = ["#3BA0FF", "#366BCB", "#39AF9A", "#FFBC3D", "#FFBC3D", "#67E0E3", "#8A2BE2"];
for (let i = 0; i < jobTitle.length; i++) { for (let i = 0; i < titleList.length; i++) {
legendData[i] = jobTitle[i].name; legendData[i] = titleList[i].name;
seriesData[i] = titleList[i];
} }
seriesData = jobTitle;
let option = operationData.getPicOption( let option = operationData.getPicOption(
"用户职务分布", "人员职务分布",
legendData, legendData,
colorData, colorData,
seriesData seriesData
...@@ -228,7 +298,7 @@ export default { ...@@ -228,7 +298,7 @@ export default {
let myChart3 = echarts.init(this.$refs.age); let myChart3 = echarts.init(this.$refs.age);
let xAxisData = []; let xAxisData = [];
let seriesData = []; let seriesData = [];
let ageList = this.crowdData.ageList; let ageList = data;
for (let i = 0; i < ageList.length; i++) { for (let i = 0; i < ageList.length; i++) {
// xAxisData[i] = ageList[i].name; // xAxisData[i] = ageList[i].name;
if(ageList[i].value != 0) { if(ageList[i].value != 0) {
...@@ -252,9 +322,9 @@ export default { ...@@ -252,9 +322,9 @@ export default {
</script> </script>
<style lang="scss"> <style lang="scss">
.crowd-analysis-wrap { .crowd-analysis-wrap {
background: #fff; // background: #fff;
overflow: hidden; overflow: hidden;
padding: 10px; // padding: 10px;
.header-title { .header-title {
padding: 10px 12px; padding: 10px 12px;
font-size: 12px; font-size: 12px;
...@@ -282,22 +352,23 @@ export default { ...@@ -282,22 +352,23 @@ export default {
.chart { .chart {
position: relative; position: relative;
margin: 20px auto 0 auto; margin: 20px auto 0 auto;
width: 100%; width: 1124px;
// overflow: auto; overflow-x: hidden;
.item { .item {
position: relative; position: relative;
float: left; float: left;
margin-top: 20px; margin-right: 20px;
padding: 0; padding: 0;
width: 48%; // width: 48%;
// height: 20vw; width: 552px;
height: 350px; height: 360px;
border: 1px solid #dedede; background: #ffffff;
// border: 1px solid #dedede;
.title { .title {
position: relative; position: relative;
margin: 15px auto 10px auto; margin-top: 20px;
margin-left: 20px;
font-size: 18px; font-size: 18px;
text-align: center;
font-weight: bold; font-weight: bold;
} }
.sex { .sex {
...@@ -306,30 +377,34 @@ export default { ...@@ -306,30 +377,34 @@ export default {
left: 0; left: 0;
.sex-item { .sex-item {
float: left; float: left;
height: 350px; width: 184px;
width: 33.3%;
.sex-img { .sex-img {
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
left: 10%; // left: 16%;
// width: 80%; height: 125px;
width: 60%; width: 125px;
margin-left: 10%;
} }
.sex-type { .sex-num {
margin-top: 18px;
height:24px;
line-height:24px;
font-size:24px;
font-weight:600;
text-align: center; text-align: center;
} }
.sex-num { .sex-type {
margin-top: 40px; margin-top: 8px;
font-size: 30px; height:14px;
font-weight: bold; font-size:14px;
color: #999999;
text-align: center; text-align: center;
} }
} }
} }
} }
.item-right { .item-right {
float: right; margin-right: 0;
} }
} }
} }
......
src/views/learning/item-data-all.vue
浏览文件 @ e6145256
...@@ -2,9 +2,9 @@ ...@@ -2,9 +2,9 @@
<div class="data-all-wrap"> <div class="data-all-wrap">
<div v-if="dataType == 0" class="data-chart"> <div v-if="dataType == 0" class="data-chart">
<div class="box-list"> <div class="box-list">
<div v-for="(item , index) in cardData" :key="index" class="box"> <!-- <div v-for="(item , index) in cardData" :key="index" class="box"> -->
<el-card class="box-card"> <div v-for="(item , index) in cardData" :key="index" class="box-card" v-bind:class="{ 'box-last': index == 2 }">
<el-tooltip class="item-tool" placement="bottom-end" effect="light"> <el-tooltip v-if="index == 2" class="item-tool" placement="bottom-end" effect="light">
<div slot="content"> <div slot="content">
<p v-for="text in item.content">{{ text }}</p> <p v-for="text in item.content">{{ text }}</p>
</div> </div>
...@@ -19,46 +19,90 @@ ...@@ -19,46 +19,90 @@
<p class="has">{{ item.hasKey }}:{{ item.hasNum }}</p> <p class="has">{{ item.hasKey }}:{{ item.hasNum }}</p>
<p class="should">{{ item.shouldKey }}:{{ item.shouldNum }}</p> <p class="should">{{ item.shouldKey }}:{{ item.shouldNum }}</p>
</div> </div>
</el-card>
<!-- <div v-if="index+1 !== cardData.length" class="line"></div> -->
</div> </div>
<!-- </div> -->
</div> </div>
<div class="date-table">
<el-tabs class="change-range" v-model="checkRange" type="card" @tab-click="handleCheckRange">
<el-tab-pane label="累计" name="1"></el-tab-pane>
<el-tab-pane label="新增" name="2"></el-tab-pane>
</el-tabs>
<el-radio-group class="change-date" v-model="checkTime" size="medium" @change="handleCheckTime">
<el-radio-button label="1">日</el-radio-button>
<el-radio-button label="2">周</el-radio-button>
<el-radio-button label="3">月</el-radio-button>
<el-radio-button label="4">年</el-radio-button>
</el-radio-group>
<el-table :data="tableDateTime" style="width: 100%">
<el-table-column prop="date" label="日期" align="center" min-width="100"></el-table-column>
<el-table-column prop="hospitalCount" label="应参与机构数" align="center"></el-table-column>
<el-table-column prop="hospitalJoinCount" label="已参与机构数" align="center"></el-table-column>
<el-table-column prop="doctorCount" label="应参与人数" align="center"></el-table-column>
<el-table-column prop="doctorJoinCount" label="已参与人数" align="center"></el-table-column>
<el-table-column prop="finishCount" label="获证人数" align="center"></el-table-column>
<el-table-column v-if="gradeFlag[0] == true" prop="grade1Count" label="优秀" align="center"></el-table-column>
<el-table-column v-if="gradeFlag[1] == true" prop="grade2Count" label="良好" align="center"></el-table-column>
<el-table-column v-if="gradeFlag[2] == true" prop="grade3Count" label="及格" align="center"></el-table-column>
<el-table-column v-if="gradeFlag[3] == true" prop="grade4Count" label="不及格" align="center"></el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeDwmy"
@current-change="handleCurrentDwmy"
:current-page="formDwmy.pageNo"
:page-sizes="[20, 30, 100 ,200]"
:page-size="formDwmy.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalCount"
></el-pagination>
</div>
</div>
<div v-if="downloadId == null">
<div class="spacing"></div>
<div class="chart-title">证历分布情况</div> <div class="chart-title">证历分布情况</div>
<div class="chart-distributeChart"> <div class="chart-distributeChart">
<div class="distributeChart" id="distributeChart" ref="distributeChart"></div> <div class="distributeChart" id="distributeChart" ref="distributeChart"></div>
<div class="data-text"> <div class="data-text">
<div class="content-text"> <div class="content-text">
<p v-for="item in distributeList" :key="item.value">{{item.label}}：{{item.value}}人</p> <p v-for="item in distributeList" >{{item.label}}：{{item.value}}人</p>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="spacing"></div>
<div class="chart-title">证书级别按学历发布情况</div> <div class="chart-title">证书级别按学历发布情况</div>
<div class="chart-recordChart"> <div class="chart-recordChart">
<div class="recordChart" id="recordChart" ref="recordChart"></div> <div class="recordChart" id="recordChart" ref="recordChart"></div>
<div class="data-text"> <div class="data-text">
<div class="content-text"> <div class="content-text">
<p v-for="item in recordList" :key="item.value">{{item.label}}：{{item.value}}人</p> <p v-for="item in recordList" >{{item.label}}：{{item.value}}人</p>
</div> </div>
</div> </div>
</div> </div>
<!-- <el-select class="chart-select" v-model="rankType" placeholder="请选择"> <div v-if="certFlag != 0">
<el-option <div class="spacing"></div>
v-for="item in rankOptions" <div class="chart-title-more">
:key="item.value" <p>项目排名情况</p>
:label="item.label" <el-radio-group class="rank-radio" size="medium" v-model="rankType" @change="changeRank">
:value="item.value" <el-radio-button label="1">按获证人数排名</el-radio-button>
></el-option> <el-radio-button label="2">按获证比例排名</el-radio-button>
</el-select>--> <el-radio-button label="3">按参与人数排名</el-radio-button>
<div class="chart-title">培训情况排名</div> </el-radio-group>
<div class="chart" id="certificateChart" ref="certificateChart"></div> </div>
<div class="chartCert" id="certificateChart" ref="certificateChart"></div>
<div class="spacing"></div>
<div class="chart-title">在线培训完成时长情况</div> <div class="chart-title">在线培训完成时长情况</div>
<div class="chart" id="durationChart" ref="durationChart"></div> <div class="chartDuration" id="durationChart" ref="durationChart"></div>
<div class="chart-remarks">注：在线培训完成时长=完成项目时间-开始参与项目时间</div>
</div>
</div> </div>
<div v-if="dataType == 1" class="data-table"> <div v-if="dataType == 1" class="data-table">
<div class="box-list"> <div class="box-list">
<div v-for="(item , index) in cardData" :key="index" class="box"> <div v-for="(item , index) in cardData" :key="index" class="box-card box-card2" v-bind:class="{ 'box-last': index == 1 }">
<el-card class="box-card box-card2"> <!-- <el-card class="box-card box-card2" v-bind:class="{ 'box-last': index == 1 }"> -->
<el-tooltip class="item-tool" placement="bottom-end" effect="light"> <el-tooltip v-if="index == 1" class="item-tool" placement="bottom-end" effect="light">
<div slot="content"> <div slot="content">
<p v-for="text in item.content">{{ text }}</p> <p v-for="text in item.content">{{ text }}</p>
</div> </div>
...@@ -73,36 +117,95 @@ ...@@ -73,36 +117,95 @@
<p class="has">{{ item.hasKey }}:{{ item.hasNum }}</p> <p class="has">{{ item.hasKey }}:{{ item.hasNum }}</p>
<p class="should">{{ item.shouldKey }}:{{ item.shouldNum }}</p> <p class="should">{{ item.shouldKey }}:{{ item.shouldNum }}</p>
</div> </div>
</el-card> <!-- </el-card> -->
<!-- <div v-if="index+1 !== cardData.length" class="line"></div> -->
</div> </div>
</div> </div>
<div class="date-table">
<el-tabs class="change-range" v-model="checkRange" type="card" @tab-click="handleCheckRange">
<el-tab-pane label="累计" name="1"></el-tab-pane>
<el-tab-pane label="新增" name="2"></el-tab-pane>
</el-tabs>
<el-radio-group class="change-date" v-model="checkTime" size="medium" @change="handleCheckTime">
<el-radio-button label="1">日</el-radio-button>
<el-radio-button label="2">周</el-radio-button>
<el-radio-button label="3">月</el-radio-button>
<el-radio-button label="4">年</el-radio-button>
</el-radio-group>
<el-table :data="tableDateTime" style="width: 100%">
<el-table-column prop="date" label="日期" align="center" min-width="100"></el-table-column>
<el-table-column prop="hospitalCount" label="应参与机构数" align="center"></el-table-column>
<el-table-column prop="hospitalJoinCount" label="已参与机构数" align="center"></el-table-column>
<el-table-column prop="doctorCount" label="应参与人数" align="center"></el-table-column>
<el-table-column prop="doctorJoinCount" label="已参与人数" align="center"></el-table-column>
<el-table-column prop="finishCount" label="获证人数" align="center"></el-table-column>
<el-table-column v-if="gradeFlag[0] == true" prop="grade1Count" label="优秀" align="center"></el-table-column>
<el-table-column v-if="gradeFlag[1] == true" prop="grade2Count" label="良好" align="center"></el-table-column>
<el-table-column v-if="gradeFlag[2] == true" prop="grade3Count" label="及格" align="center"></el-table-column>
<el-table-column v-if="gradeFlag[3] == true" prop="grade4Count" label="不及格" align="center"></el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeDwmy"
@current-change="handleCurrentDwmy"
:current-page="formDwmy.pageNo"
:page-sizes="[20, 30, 100 ,200]"
:page-size="formDwmy.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalCount"
></el-pagination>
</div>
</div>
<div class="spacing"></div>
<div class="person"> <div class="person">
<div class="person-title">项目人员情况</div> <div class="person-title">项目人员情况</div>
<!-- <el-radio-group class="person-radio" v-model="tableType" @change="change"> <el-tabs v-if="downloadId == null" class="tabs-person" v-model="tableType" type="card" @tab-click="handlePerson">
<el-radio-button label="0">已获证</el-radio-button> <el-tab-pane label="已获证" name="1"></el-tab-pane>
<el-radio-button label="1">未获证</el-radio-button> <el-tab-pane label="未获证" name="2"></el-tab-pane>
<el-radio-button label="2">未参与</el-radio-button> <el-tab-pane label="未参与" name="3"></el-tab-pane>
</el-radio-group> --> </el-tabs>
<el-table :data="tableData" style="width: 100%"> <el-table :data="tableData" class="person-table">
<el-table-column prop="rank" label="排名" align="center"></el-table-column> <el-table-column v-if="tableType == '1'" prop="rankNo" label="排名" align="center"></el-table-column>
<el-table-column prop="name" label="姓名" align="center"></el-table-column> <el-table-column prop="doctorName" label="姓名" align="center"></el-table-column>
<el-table-column prop="sex" label="性别" align="center"></el-table-column> <el-table-column prop="sex" label="性别" align="center">
<el-table-column prop="department" label="科室" align="center"></el-table-column> <template slot-scope="scope">
<el-table-column prop="join" label="是否参与项目" align="center"></el-table-column> <span>{{ scope.row.sex | sexValue}}</span>
<el-table-column prop="complete" label="是否完成项目" align="center"></el-table-column> </template>
<el-table-column prop="grade" label="证书级别" align="center"></el-table-column> </el-table-column>
<el-table-column prop="certificateDate" label="获证日期" align="center"></el-table-column> <el-table-column prop="departmentName" label="科室" align="center"></el-table-column>
<el-table-column prop="record" label="成绩" align="center"></el-table-column> <el-table-column prop="joinFlag" label="是否参与项目" align="center">
<el-table-column prop="learnTime" label="学习时长" align="center"></el-table-column> <template slot-scope="scope">
<span>{{ scope.row.joinFlag | joinFlagValue}}</span>
</template>
</el-table-column>
<el-table-column prop="finishFlag" label="是否完成项目" align="center">
<template slot-scope="scope">
<span>{{ scope.row.finishFlag | finishFlagValue}}</span>
</template>
</el-table-column>
<el-table-column prop="certGrade" label="证书级别" align="center">
<template slot-scope="scope">
<span>{{ scope.row.certGrade | certGradeValue}}</span>
</template>
</el-table-column>
<el-table-column prop="finishDate" label="获证日期" align="center"></el-table-column>
<el-table-column prop="score" label="成绩" align="center"></el-table-column>
<el-table-column prop="learnTime" min-width="150" label="学习时长" align="center">
<template slot-scope="scope">
<span>{{ scope.row.learnTime | learnTimeValue}}</span>
</template>
</el-table-column>
</el-table> </el-table>
<div class="chart-remarks">注：本报表数据来源仅包括有摸底考的课程培训。</div>
<div class="pagination"> <div class="pagination">
<el-pagination <el-pagination
class="pagination"
background background
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="formTable.pageNo" :current-page="formTable.pageNo"
:page-sizes="[10, 20, 30, 100]" :page-sizes="[20, 30, 100 ,200]"
:page-size="formTable.pageSize" :page-size="formTable.pageSize"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="totalRows" :total="totalRows"
...@@ -116,6 +219,7 @@ ...@@ -116,6 +219,7 @@
import { openLoading, closeLoading } from "../../utils/utils"; import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils"; import * as commonUtil from "../../utils/utils";
import * as operationData from "../../utils/operation"; import * as operationData from "../../utils/operation";
import * as chartData from "../../utils/learning/chartData";
import echarts from "echarts"; import echarts from "echarts";
import { setTimeout } from "timers"; import { setTimeout } from "timers";
let vm = null; let vm = null;
...@@ -132,14 +236,17 @@ export default { ...@@ -132,14 +236,17 @@ export default {
}, },
organizationList: { organizationList: {
type: Array type: Array
} },
timeInfoData: {
type: Object
},
}, },
data() { data() {
return { return {
roleType: "L1", roleType: "L1",
projectId: "", projectId: "",
dataType: 0, dataType: 0,
tableType: "0", tableType: "1",
echartsData: { echartsData: {
chart0: {}, chart0: {},
chart1: {}, chart1: {},
...@@ -149,7 +256,7 @@ export default { ...@@ -149,7 +256,7 @@ export default {
distributeList: [], distributeList: [],
recordList: [], recordList: [],
cardData: [], cardData: [],
rankType: 1, rankType: "1",
rankOptions: [ rankOptions: [
{ {
value: 1, value: 1,
...@@ -161,42 +268,262 @@ export default { ...@@ -161,42 +268,262 @@ export default {
} }
], ],
tableData: [], tableData: [],
tableDateTime: [],
totalRows: 0, totalRows: 0,
formDwmy: {
pageNo: 1,
pageSize: 20,
},
formTable: { formTable: {
pageNo: 1, pageNo: 1,
pageSize: 10, pageSize: 20,
}, },
checkRange: "1",
checkTime: "1",
totalCount: 0,
gradeFlag: [false, false, false, false],
hospitalCnt: '',
hospitalCutList: [],
certFlag: 0,
downloadId: null,
timeInfoChild: {},
}; };
}, },
watch: {
timeInfoData: {
deep: true,
handler(nv, ov) {
vm.timeInfoChild = nv;
}
}
},
created() { created() {
vm = this; vm = this;
vm.projectId = vm.getUrlSearch(window.location.href, "id"); vm.projectId = vm.getUrlSearch(window.location.href, "id");
vm.initCard(); vm.downloadId = vm.getUrlSearch(window.location.href, "downloadId");
},
mounted: function() {
this.$on("search", () => {
vm.gethHspitalsCnt();
});
this.$on("static", () => {
vm.getStatic();
});
},
methods: {
getStatic() {
// console.log(vm.timeInfoChild.reportParamModel);
if(vm.timeInfoChild.reportParamModel.hospitalIdList != null && vm.timeInfoChild.reportParamModel.hospitalIdList.length == 1) {
vm.dataType = 1;
} else {
vm.dataType = 0;
}
// console.log('展示all类型：',vm.dataType)
vm.setStatic();
},
setStatic() {
vm.certFlag = vm.timeInfoChild.doctorInfoRep.certFlag;
vm.searchDwmy();
vm.initCard(vm.timeInfoChild.genSituationModel.percentData);
if(vm.dataType == 0) { if(vm.dataType == 0) {
// vm.setInitWidth(); //多个机构
setTimeout(function() { setTimeout(function(){
// vm.$nextTick(() => { vm.setRecordChart(vm.timeInfoChild.genSituationModel.eduData);
vm.setDistributeChart(); if(vm.certFlag !== 0) {
vm.setRecordChart(); vm.setCertificateChart(vm.timeInfoChild.genSituationModel.studyRankMap[0]);
vm.setDurationChart(); vm.setDurationChart(vm.timeInfoChild.genSituationModel.costRank);
vm.setCertificateChart(); }
// }); },20)
}, 500);
} else { } else {
vm.setTable(); //单个几个
let genSituationModel = vm.timeInfoChild.genSituationModel;
vm.totalRows = genSituationModel.personData.length;
vm.tableData = genSituationModel.personData;
} }
}, },
mounted: function() {}, gethHspitalsCnt() {
methods: { let req = {
initCard() { projectId: vm.projectId,
regionId: vm.formInline.region[vm.formInline.region.length - 1]
};
vm.GET("stats/region/hospitals/cnt", req).then(res => {
if (res.code == "000000") {
vm.hospitalCnt = res.data.hospitalCnt;
// vm.hospitalCnt = 1;
if(vm.hospitalCnt == 1) {
vm.hospitalCutList = res.data.list;
}
// vm.searchType();
vm.getDisplay();
}
});
},
getDisplay() {
let reqInfo = {
projectId: vm.projectId,
};
openLoading(vm);
vm.GET("stats/region/info", reqInfo).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.certFlag = res.data.certFlag;
vm.certFlag = 1;
vm.searchType();
}
});
},
searchType() {
if(vm.formInline.organization.length == 1) {
vm.dataType = 1;
} else {
if(vm.hospitalCnt == 1) {
vm.dataType = 1;
} else {
vm.dataType = 0;
}
}
// console.log('vm.hospitalCnt',vm.hospitalCnt);
if(vm.dataType == 0) {
vm.checkRange = "1";
vm.checkTime = "1",
this.search();
this.searchDwmy();
} else {
this.searchDwmy();
this.searchPerson();
}
},
searchPerson(type) {
let req = {
projectId: vm.projectId,
beginDate: operationData.setDuringTime(vm.formInline.during,'begin'),
endDate: operationData.setDuringTime(vm.formInline.during,'end'),
hospitalIdList: vm.formInline.organization,
originalFlag: vm.formInline.checked == false ? 0 : 1,
regionId: vm.formInline.region[vm.formInline.region.length - 1],
timeFlag: vm.formInline.timeFlag,
pageNo: vm.formTable.pageNo,
pageSize: vm.formTable.pageSize,
};
if(req.hospitalIdList.length == 0) {
req.hospitalIdList = [];
req.hospitalIdList = hospitalCutList[0].hospitalId;
}
openLoading(vm);
if(req.regionId == "000") {
req.regionId = "310";
}
// console.log("0 req", req);
vm.POST("stats/report/generalPersonal/"+vm.tableType, req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
if(type != 1) {
vm.initCard(res.data.percentData);
}
vm.totalRows = res.data.totalSize;
vm.tableData = res.data.personData;
}
});
},
handlePerson(tab, event) {
vm.tableType = tab.name;
vm.formTable.pageNo = 1;
vm.searchPerson(1);
},
search() {
let req = {
projectId: vm.projectId,
beginDate: operationData.setDuringTime(vm.formInline.during,'begin'),
endDate: operationData.setDuringTime(vm.formInline.during,'end'),
hospitalIdList: vm.formInline.organization,
originalFlag: vm.formInline.checked == false ? 0 : 1,
regionId: vm.formInline.region[vm.formInline.region.length - 1],
timeFlag: vm.formInline.timeFlag,
};
openLoading(vm);
if(req.regionId == "000") {
req.regionId = "310";
}
// console.log("0 req", req);
vm.POST("stats/report/general_pc", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.initCard(res.data.percentData);
vm.setDistributeChart(res.data.certData);
vm.setRecordChart(res.data.eduData);
if(vm.certFlag !== 0) {
vm.setCertificateChart(res.data.studyRank);
vm.setDurationChart(res.data.costRank);
}
}
});
},
searchDwmy() {
let req = {};
if(vm.downloadId == null) {
req = {
projectId: vm.projectId,
beginDate: operationData.setDuringTime(vm.formInline.during,'begin'),
endDate: operationData.setDuringTime(vm.formInline.during,'end'),
hospitalIdList: vm.formInline.organization,
originalFlag: vm.formInline.checked == false ? 2 : 1,
regionId: vm.formInline.region[vm.formInline.region.length - 1],
timeFlag: vm.formInline.timeFlag,
timeType: parseInt(vm.checkTime),
dataType: parseInt(vm.checkRange),
pageNo: vm.formDwmy.pageNo,
pageSize: vm.formDwmy.pageSize,
};
} else {
let reportParamModel = vm.timeInfoChild.reportParamModel;
req = {
projectId: reportParamModel.projectId,
beginDate: reportParamModel.beginDate,
endDate: reportParamModel.endDate,
hospitalIdList: reportParamModel.hospitalIdList,
originalFlag: reportParamModel.originalFlag,
regionId: reportParamModel.regionId,
timeFlag: reportParamModel.timeFlag,
timeType: parseInt(vm.checkTime),
dataType: parseInt(vm.checkRange),
pageNo: vm.formDwmy.pageNo,
pageSize: vm.formDwmy.pageSize,
};
}
openLoading(vm);
if(req.regionId == '000') {
req.regionId = '0';
}
vm.POST("stats/dwmy/", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.tableDateTime = res.data.list;
vm.totalCount = res.data.totalCount;
for(let i=0 ; i < res.data.title.length ; i++) {
vm.gradeFlag[i] = res.data.title[i].show;
}
}
});
},
handleCheckRange(tab, event) {
vm.formDwmy.pageNo = 1;
vm.checkRange = tab.name;
vm.searchDwmy();
},
handleCheckTime(value) {
vm.formDwmy.pageNo = 1;
vm.timeType = value;
vm.searchDwmy();
},
initCard(data) {
let cardData = [ let cardData = [
{ {
value: "45%", value: "0%",
title: "机构参与率", title: "机构参与率",
hasKey: "已参与机构数", hasKey: "已参与机构数",
hasNum: "318535", hasNum: "0",
shouldKey: "应参与机构数", shouldKey: "应参与机构数",
shouldNum: "78534", shouldNum: "0",
content: [ content: [
"机构参与率：已参与机构数/应参与机构数*100% ", "机构参与率：已参与机构数/应参与机构数*100% ",
"应参与机构数：筛选范围下，所有圈选机构数量，包含白名单反退出来的机构", "应参与机构数：筛选范围下，所有圈选机构数量，包含白名单反退出来的机构",
...@@ -204,12 +531,12 @@ export default { ...@@ -204,12 +531,12 @@ export default {
] ]
}, },
{ {
value: "78%", value: "0%",
title: "人员参与率", title: "人员参与率",
hasKey: "已参与人数", hasKey: "已参与人数",
hasNum: "878534", hasNum: "0",
shouldKey: "应参与人数", shouldKey: "应参与人数",
shouldNum: "674343", shouldNum: "0",
content: [ content: [
"人员参与率：已参与人数/应参与人数*100%", "人员参与率：已参与人数/应参与人数*100%",
"应参与人数：筛选范围下，所圈选人员数量", "应参与人数：筛选范围下，所圈选人员数量",
...@@ -217,12 +544,12 @@ export default { ...@@ -217,12 +544,12 @@ export default {
] ]
}, },
{ {
value: "71%", value: "0%",
title: "获证率", title: "获证率",
hasKey: "已获证人数", hasKey: "已获证人数",
hasNum: "567", hasNum: "0",
shouldKey: "应参与人数", shouldKey: "应参与人数",
shouldNum: "78534", shouldNum: "0",
content: [ content: [
"获证率：已完成人数/应参与人数*100%", "获证率：已完成人数/应参与人数*100%",
"应参与人数：筛选范围下，所圈选人员数量", "应参与人数：筛选范围下，所圈选人员数量",
...@@ -230,200 +557,130 @@ export default { ...@@ -230,200 +557,130 @@ export default {
] ]
} }
]; ];
if(data == null) {
//数据为空
if(vm.dataType == 0) { if(vm.dataType == 0) {
vm.cardData = cardData; vm.cardData = cardData;
} else if(vm.dataType == 1) { } else if(vm.dataType == 1) {
vm.cardData = cardData.slice(0,2); vm.cardData = cardData.slice(1);
}
return;
}
cardData[2].title = vm.certFlag == 0 ? '完成率' : '获证率';
cardData[2].hasKey = vm.certFlag == 0 ? '已经完成人数' : '已获证人数',
cardData[1].value = data.doctorRate*100 + '%';
cardData[1].hasNum = data.joinCount;
cardData[1].shouldNum = data.doctorCount;
cardData[2].value = data.certificateRate*100 + '%';
cardData[2].hasNum = data.finishCount;
cardData[2].shouldNum = data.doctorCount;
if(vm.dataType == 0) {
cardData[0].value = data.hospitalRate*100 + '%';
cardData[0].hasNum = data.hospitalJoinCount;
cardData[0].shouldNum = data.hospitalCount;
vm.cardData = cardData;
} else if(vm.dataType == 1) {
vm.cardData = cardData.slice(1);
} }
}, },
updateResize() { updateResize() {
setTimeout(function() { // setTimeout(function() {
window.onresize = function() { // window.onresize = function() {
vm.echartsData.chart0.resize(); // vm.echartsData.chart0.resize();
vm.echartsData.chart1.resize(); // vm.echartsData.chart1.resize();
vm.echartsData.chart2.resize(); // vm.echartsData.chart2.resize();
vm.echartsData.chart3.resize(); // vm.echartsData.chart3.resize();
}; // };
},100); // },100);
},
setInitWidth() {
},
setDistributeChart() {
vm.distributeList = [
{
label: '未获证人数',
value: 2290,
},
{
label: '获优秀人数',
value: 1900,
},
{
label: '获及格人数',
value: 150,
},
]
let myChart = echarts.init(this.$refs.distributeChart);
let option = {
title: {
text: "",
x: "left"
},
tooltip: {
trigger: "item",
formatter: "{b} : {c} ({d}%)"
},
label: {
formatter: "{d}%"
},
color: ['#FF9A4B','#39AF9A', '#FFB01B'],
legend: {
orient: "horizontal",
top: "",
left: "40%",
data: ["未获证人数占比", "获优秀人数占比", "获及格人数占比"]
}, },
series: [ setDistributeChart(data) {
{ let keyName = ['未获证人数','优秀人数','良好人数','及格人数','不及格人数'];
name: "", let keyName2 = ['未获证人数占比','优秀人数占比','良好人数占比','及格人数占比','不及格人数占比'];
type: "pie", let distributeList = [];
radius: "60%", let legendData = [];
center: ["65%", "50%"], let seriesData = [];
data: [ for(let i = 0; i<data.length ; i++) {
{ value: 3000, name: "未获证人数占比" }, let obj = {
{ value: 6800, name: "获优秀人数占比" }, label: keyName[data[i].certId],
{ value: 3200, name: "获及格人数占比" } value: data[i].doneCount,
], };
itemStyle: { distributeList.push(obj);
emphasis: {
shadowBlur: 10, legendData.push(keyName2[data[i].certId])
shadowOffsetX: 0, let objSer = {
shadowColor: "rgba(0, 0, 0, 0.5)" name: keyName2[data[i].certId],
} value: data[i].doneCount,
} }
seriesData.push(objSer);
} }
] vm.distributeList = distributeList;
}; let myChart = echarts.init(this.$refs.distributeChart);
let option = chartData.dustributeOption(legendData,seriesData);
myChart.setOption(option); myChart.setOption(option);
vm.echartsData.chart0 = myChart; vm.echartsData.chart0 = myChart;
vm.updateResize(); vm.updateResize();
}, },
setRecordChart() { setRecordChart(data) {
vm.recordList = [ let recordList = [
{
label: '博士后',
value: 0,
},
{ {
label: '博士', label: '博士',
value: 50, value: 0,
}, },
{ {
label: '硕士', label: '硕士',
value: 90, value: 0,
}, },
{ {
label: '本科', label: '本科',
value: 700, value: 0,
}, },
{ {
label: '大专', label: '大专',
value: 20428, value: 0,
}, },
{ {
label: '中专及以下', label: '中专及以下',
value: 34234, value: 0,
}, },
{ {
label: '其他', label: '其他',
value: 2345, value: 0,
}, },
] ]
let myChart = echarts.init(this.$refs.recordChart); let keyName = ['未获证人数','获优秀人数','获良好人数','获及格人数','获不及格人数'];
let option = { let legendData = [];
title: { let xAxisData = ["博士后","博士", "硕士", "本科", "大专", "中专及以下", "其他"];
text: "", for(let i = 0; i<data.length; i++) {
x: "left" // console.log('data[i]',data[i].certList);
}, let certList = data[i].certList;
tooltip: { legendData.push(keyName[data[i].certId]);
trigger: "axis", for(let a = 0; a < certList.length ; a++) {
axisPointer: { recordList[a].value += certList[a].value;
// 坐标轴指示器，坐标轴触发有效 }
type: "shadow", // 默认为直线，可选为：'line' | 'shadow' }
shadowStyle: { let seriesData = [];
shadowColor: '#E3EFED', let seriesArr = [];
width: 36, let seriesName = [];
}, let index = 0;
}, for(let x = data.length - 1 ; x >= 0 ; x--) {
backgroundColor: 'rgba(0,0,0,0.7)', let certList = data[x].certList;
formatter: function(params) { seriesArr[index] = [];
let relVal = params[0].name + "人数："; seriesName.push(keyName[data[x].certId]);
let value = 0; for(let y = 0; y < certList.length ; y++) {
for (let i = 0, l = params.length; i < l; i++) { seriesArr[index].push(certList[y].value);
value += params[i].value; }
} index++;
relVal += value + "人"; }
let divList = []; for(let z = 0; z < seriesArr.length ; z++) {
divList[0] = "<div style='background: #FFB01B;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>"; let seriesObj = {
divList[1] = "<div style='background: #39AF9A;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>"; name: seriesName[z],
divList[2] = "<div style='background: #5D7092;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
for (let j = params.length - 1 ; j >= 0; j--) {
relVal +=
"<br/>" + divList[j] +
params[j].seriesName +
"占比： " +
(
(100 * parseFloat(params[j].value)) /
parseFloat(value)
).toFixed(2) +
"%";
}
return relVal;
}
},
color: ['#FFB01B','#39AF9A', '#5D7092'],
legend: {
data: ["未获证人数", "获优秀人数", "获及格人数"]
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: {
type: "category",
data: ["博士", "硕士", "本科", "大专", "中专及以下", "其他"]
},
yAxis: {
type: "value",
name: "人数 (个)"
},
series: [
{
name: "获及格人数",
type: "bar",
stack: "总量",
barWidth: 18,
label: {
normal: {
show: true,
rotate: -90,
}
},
data: [220, 182, 191, 234, 290, 330]
},
{
name: "获优秀人数",
type: "bar",
stack: "总量",
barWidth: 18,
label: {
normal: {
show: true,
rotate: -90,
}
},
data: [120, 132, 101, 134, 90, 230]
},
{
name: "未获证人数",
type: "bar", type: "bar",
stack: "总量", stack: "总量",
barWidth: 18, barWidth: 18,
...@@ -433,378 +690,97 @@ export default { ...@@ -433,378 +690,97 @@ export default {
rotate: -90, rotate: -90,
} }
}, },
data: [1, 302, 301, 334, 390, 330] data: seriesArr[z],
},
]
}; };
seriesData.push(seriesObj);
}
// console.log('data',legendData,seriesArr,seriesData);
vm.recordList = recordList;
let myChart = echarts.init(this.$refs.recordChart);
let option = chartData.recordOption(legendData, xAxisData, seriesData);
myChart.setOption(option); myChart.setOption(option);
vm.echartsData.chart1 = myChart; vm.echartsData.chart1 = myChart;
vm.updateResize(); vm.updateResize();
}, },
setCertificateChart() { changeRank(value) {
let myChart = echarts.init(this.$refs.certificateChart); if(vm.downloadId == null) {
let option = { let req = {
title: { projectId: vm.projectId,
text: "", beginDate: operationData.setDuringTime(vm.formInline.during,'begin'),
x: "left" endDate: operationData.setDuringTime(vm.formInline.during,'end'),
}, hospitalIdList: vm.formInline.organization,
tooltip: { originalFlag: vm.formInline.checked == false ? 0 : 1,
trigger: "axis", regionId: vm.formInline.region[vm.formInline.region.length - 1],
axisPointer: { timeFlag: vm.formInline.timeFlag,
type: "cross", };
crossStyle: { openLoading(vm);
color: "#999" if(req.regionId == "000") {
} req.regionId = "310";
}, }
backgroundColor: 'rgba(0,0,0,0.7)', vm.POST("stats/report/studyRank/"+value, req).then(res => {
formatter: function(params) { closeLoading(vm);
let relVal = ""; vm.setCertificateChart(res.data.studyRank);
let divList = []; });
divList[0] = "<div style='background: #5D7092;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[1] = "<div style='background: #FFB01B;height: 12px;width: 20px;margin: 5px 5px 0 2px;float: left;border-radius:2px;'></div>";
divList[2] = "<div style='background: #559A99;height: 12px;width: 12px;margin: 5px 5px 0 5px;float: left;border-radius:50%;'></div>";
for (let j = 0, l = params.length; j < l; j++) {
relVal += divList[j] + params[j].seriesName + "： " + params[j].value;
if (j === 2) {
relVal += "%";
} else { } else {
relVal += "<br/>"; let index = parseInt(value) - 1;
} vm.setCertificateChart(vm.timeInfoChild.genSituationModel.studyRankMap[index]);
}
return relVal;
}
},
color: ['#5D7092','#FFB01B', '#559A99'],
dataZoom: {
show: true,
start: 0,
end: 60
},
legend: {
data: ["参与人数", "获证人数", "获证比例"]
},
xAxis: [
{
axisLabel: {
interval: 0,
rotate: 45
},
type: "category",
data: [
"北京市",
"天津市",
"河北省",
"山西省",
"内蒙古自治区",
"辽宁省",
"吉林省",
"黑龙江省",
"上海市",
"江苏省",
"浙江省",
"安徽省",
"福建省",
"江西省",
"山东省",
"河南省",
"湖北省",
"湖南省",
"广东省",
"广西壮族自治区",
"海南省",
"重庆市",
"四川省",
"贵州省",
"云南省",
"西藏自治区",
"陕西省",
"甘肃省",
"青海省",
"宁夏回族自治区",
"新疆维吾尔自治区"
],
axisPointer: {
type: "shadow"
}
}
],
yAxis: [
{
type: "value",
name: "人数（个）",
axisLabel: {
formatter: "{value} "
}
},
{
type: "value",
name: "比例",
min: 0,
max: 100,
axisLabel: {
formatter: "{value} %"
}
}
],
series: [
{
name: "参与人数",
barWidth: 10,
type: "bar",
data: [
10,
52,
200,
334,
390,
330,
220,
10,
52,
200,
334,
390,
330,
220,
10,
52,
200,
334,
390,
330,
220,
10,
52,
200,
334,
390,
330,
220,
10,
52,
200,
334,
390
],
label: {
show: true,
position: "top",
formatter: "{c}", //这是关键，在需要的地方加上就行了
rotate: -90,
offset: [-5, -15]
}
},
{
name: "获证人数",
barWidth: 10,
type: "bar",
data: [9, 8, 100, 200, 200, 55, 10, 9, 8, 100, 200, 200, 55, 10, 9, 8, 100, 200, 200, 55, 10],
label: {
show: true,
position: "top",
formatter: "{c}", //这是关键，在需要的地方加上就行了
rotate: -90,
offset: [-5, -15]
} }
}, },
{ setCertificateChart(data) {
name: "获证比例", let xAxisData = [];
type: "line", let seriesJoin = [];
yAxisIndex: 1, let seriesCert = [];
data: [ let seriesRate = [];
2, for(let i = 0 ; i < data.length ; i++) {
22, xAxisData.push(data[i].subName);
32, seriesJoin.push(data[i].joinCount);
41, seriesCert.push(data[i].certCount);
61, seriesRate.push(data[i].certRate);
10,
20,
23,
55,
67,
91,
6,
2,
22,
32,
41,
61,
10,
20,
23,
55,
67,
91,
6
],
label: {
show: true,
position: "top",
formatter: "{c}%" //这是关键，在需要的地方加上就行了
} }
} let myChart = echarts.init(this.$refs.certificateChart);
] let option = chartData.certificateOption(xAxisData, seriesJoin, seriesCert, seriesRate);
};
myChart.setOption(option); myChart.setOption(option);
vm.echartsData.chart2 = myChart; vm.echartsData.chart2 = myChart;
vm.updateResize(); vm.updateResize();
}, },
setDurationChart() { setDurationChart(data) {
let myChart = echarts.init(this.$refs.durationChart); let xAxisData = [];
let option = { let seriesData = [];
title: { for(let i = 0 ; i<data.length ; i++) {
text: "", xAxisData.push(data[i].subName);
x: "left" seriesData.push(data[i].costTime);
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
}
},
color: ['#449284'],
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
dataZoom: {
show: true,
start: 0,
end: 66
},
xAxis: [
{
axisLabel: {
interval: 0,
rotate: 35
},
type: "category",
data: [
"北京市",
"天津市",
"河北省",
"山西省",
"内蒙古自治区",
"辽宁省",
"吉林省",
"黑龙江省",
"上海市",
"江苏省",
"浙江省",
"安徽省",
"福建省",
"江西省",
"山东省",
"河南省",
"湖北省",
"湖南省",
"广东省",
"广西壮族自治区",
"海南省",
"重庆市",
"四川省",
"贵州省",
"云南省",
"西藏自治区",
"陕西省",
"甘肃省",
"青海省",
"宁夏回族自治区",
"新疆维吾尔自治区"
],
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
type: "value",
name: "完成时长 (天)"
} }
], let myChart = echarts.init(this.$refs.durationChart);
series: [ let option = chartData.durationOption(xAxisData, seriesData);
{
name: "时长",
type: "bar",
barWidth: 17,
data: [
10,
52,
200,
334,
390,
330,
220,
10,
52,
200,
334,
390,
330,
220,
10,
52,
200,
334,
390,
330,
220,
10,
52,
200,
334,
390,
330,
220,
10,
52,
200,
334,
390
],
label: {
show: true,
position: "top",
formatter: "{c}", //这是关键，在需要的地方加上就行了
rotate: -90,
offset: [-5, -15]
}
}
]
};
myChart.setOption(option); myChart.setOption(option);
vm.echartsData.chart3 = myChart; vm.echartsData.chart3 = myChart;
vm.updateResize(); vm.updateResize();
}, },
//日周月年分页
handleSizeDwmy(val) {
console.log(`每页 ${val} 条`);
vm.formDwmy.pageSize = val;
vm.formDwmy.pageNo = 1;
vm.searchDwmy();
},
handleCurrentDwmy(val) {
console.log(`当前页: ${val}`);
vm.formDwmy.pageNo = val;
vm.searchDwmy();
},
//机构人员分页
handleSizeChange(val) { handleSizeChange(val) {
console.log(`每页 ${val} 条`); console.log(`每页 ${val} 条`);
vm.formTable.pageSize = val; vm.formTable.pageSize = val;
vm.formTable.pageNo = 1; vm.formTable.pageNo = 1;
vm.searchPerson(1);
}, },
handleCurrentChange(val) { handleCurrentChange(val) {
console.log(`当前页: ${val}`); console.log(`当前页: ${val}`);
vm.formTable.pageNo = val; vm.formTable.pageNo = val;
vm.searchPerson(1);
}, },
setTable() {
vm.tableData = [
{
id: 1,
rank: 1,
name: '伊娟',
sex: '女',
department: '内科',
join: 1,
complete: 1,
grade: '1级',
certificateDate: '2019-10-11',
record: 100,
learnTime: '4小时23分34秒',
}
];
}
} }
}; };
</script> </script>
...@@ -824,18 +800,21 @@ export default { ...@@ -824,18 +800,21 @@ export default {
.data-all-wrap { .data-all-wrap {
background: #fff; background: #fff;
overflow: hidden; overflow: hidden;
padding: 10px; // padding: 10px;
.box-list { .box-list {
position: relative; position: relative;
// width: 100%; padding: 30px 30px 0 30px;
height: 110px; height: 136px;
// .box {
// height: 106px;
// }
.box-card { .box-card {
position: relative; position: relative;
background-color: #e3efed; background-color: #e3efed;
color: #449284; color: #449284;
width: 31%; width: 32%;
margin-right: 2%; margin-right: 2%;
height: 110px; height: 106px;
float: left; float: left;
.notice { .notice {
position: absolute; position: absolute;
...@@ -855,7 +834,7 @@ export default { ...@@ -855,7 +834,7 @@ export default {
position: relative; position: relative;
float: left; float: left;
width: 33%; width: 33%;
height: 110px; height: 106px;
text-align: left; text-align: left;
padding: 23px 0 0 20px; padding: 23px 0 0 20px;
.title { .title {
...@@ -884,7 +863,7 @@ export default { ...@@ -884,7 +863,7 @@ export default {
position: relative; position: relative;
float: left; float: left;
width: 64%; width: 64%;
height: 110px; height: 106px;
text-align: left; text-align: left;
font-size: 14px; font-size: 14px;
padding: 23px 0 0 29px; padding: 23px 0 0 29px;
...@@ -898,52 +877,120 @@ export default { ...@@ -898,52 +877,120 @@ export default {
} }
} }
.box-card2 { .box-card2 {
width: 48%; width: 49%;
margin-right: 1%; margin-right: 2%;
}
.box-last {
margin-right: 0;
}
}
.spacing {
position: relative;
width: 100%;
height: 20px;
background: #f0f2f5;
}
.date-table {
position: relative;
width: 100%;
margin-top: 20px;
padding: 0 30px 0 30px;
.change-range {
.el-tabs__header {
margin-bottom: 0px;
}
.el-tabs__nav-scroll {
margin-left: 0px;
}
}
.change-date {
position: absolute;
top: 0px;
right: 30px;
} }
} }
.chart-select { .rank-radio {
position: relative; position: relative;
} }
.chart-title { .chart-title {
position: relative; position: relative;
margin-top: 17px; margin-top: 30px;
margin-left: 30px;
height: 25px;
font-size:18px;
font-weight:600;
line-height: 25px;
color: #000000;
}
.chart-title-more {
position: relative;
width: 100%; width: 100%;
height: 60px; height: 70px;
p {
position: relative;
float: left;
width: 400px;
margin-top: 30px;
margin-left: 30px;
height: 25px;
font-size:18px; font-size:18px;
font-weight:600; font-weight:600;
line-height: 60px; line-height: 25px;
color: #000000; color: #000000;
border-bottom: 1px solid #E4E7ED;
} }
.chart { .rank-radio {
position: relative;
margin: 30px 30px 0 0;
float: right;
.el-radio-button__inner {
padding: 7px 11px;
}
}
}
.chart-remarks {
position: relative;
height: 66px;
padding: 20px 0 30px 30px;
font-size: 16px;
font-weight: 400;
line-height: 16px;
color: #666666;
}
.chartCert {
position: relative;
margin: 20px auto 0 auto;
width: 1064px;
height: 462px;
}
.chartDuration {
position: relative; position: relative;
margin: 20px auto 0 auto; margin: 20px auto 0 auto;
// width: 100%; width: 1064px;
width: 860px; height: 380px;
height: 350px;
} }
.chart-distributeChart { .chart-distributeChart {
position: relative; position: relative;
margin: 20px auto 0 auto; margin: 20px auto 0 auto;
height: 350px; // height: 320px;
width: 100%; width: 100%;
overflow-x: hidden; overflow-x: hidden;
.distributeChart { .distributeChart {
position: relative; position: relative;
float: left; // float: left;
margin: 0 auto;
// width: 70%; // width: 70%;
width: 600px; width: 618px;
height: 350px; height: 320px;
} }
.data-text { .data-text {
position: relative; position: absolute;
float: left; top: 0;
right: 0;
width: 30%; width: 30%;
height: 350px; height: 320px;
.content-text { .content-text {
position: relative; position: relative;
margin-top: 135px; margin-top: 78px;
margin-left: 35%; margin-left: 35%;
text-align: left; text-align: left;
p { p {
...@@ -960,25 +1007,24 @@ export default { ...@@ -960,25 +1007,24 @@ export default {
.chart-recordChart { .chart-recordChart {
position: relative; position: relative;
margin: 20px auto 0 auto; margin: 20px auto 0 auto;
height: 350px; // height: 350px;
width: 100%; min-width: 1064px;
overflow-x: hidden; overflow-x: hidden;
.recordChart { .recordChart {
position: relative; position: relative;
float: left; float: left;
// width: 83.5%; // width: 83.5%;
width: 700px; width: 910px;
height: 350px; height: 416px;
} }
.data-text { .data-text {
position: relative; position: relative;
float: left; float: left;
width: 16%; width: 120px;
height: 350px; height: 416px;
.content-text { .content-text {
position: relative; position: relative;
margin-top: 100px; margin-top: 100px;
margin-left: 16%;
text-align: left; text-align: left;
p { p {
margin-top: 20px; margin-top: 20px;
...@@ -995,10 +1041,24 @@ export default { ...@@ -995,10 +1041,24 @@ export default {
position: relative; position: relative;
margin-top: 20px; margin-top: 20px;
width: 100%; width: 100%;
.tabs-person {
margin: 0 auto;
width: 95%;
.el-tabs__header {
margin-bottom: 0px;
}
.el-tabs__nav-scroll {
margin-left: 0px;
}
}
.person-title { .person-title {
position: relative;
margin: 30px 0 25px 30px;
height: 25px;
font-size:18px; font-size:18px;
font-weight:700; font-weight:600;
margin-bottom: 20px; line-height: 25px;
color: #000000;
} }
.person-radio { .person-radio {
margin-top: 10px; margin-top: 10px;
...@@ -1019,6 +1079,15 @@ export default { ...@@ -1019,6 +1079,15 @@ export default {
} }
} }
} }
.person-table {
padding: 0;
width: 95%;
margin:0 auto 20px auto;
}
.pagination {
margin-top: 30px;
margin-right: 13px;
}
} }
} }
</style> </style>
\ No newline at end of file
src/views/learning/item-examination-analysis.vue
浏览文件 @ e6145256
<template> <template>
<div class="examination-analysis"> <div class="examination-analysis">
<div v-for="(item , index) in cardData" :key="index" class="box"> <div class="box-list">
<el-card class="box-card"> <div v-for="(item , index) in cardData" :key="index" class="box-card" v-bind:class="{ 'box-last': index == 2 }">
<div slot="header" class="title"> <!-- <el-card class="box-card" v-bind:class="{ 'box-last': index == 2 }"> -->
<span class="weight">{{ item.title }}</span> <p class="value">{{ item.value }}</p>
<p class="title">{{ item.title }}</p>
<!-- </el-card> -->
</div> </div>
<div class="box-content">
<span class="weight">{{ item.num }}</span>
{{ item.unit }}
</div> </div>
</el-card> <div class="spacing"></div>
<div v-if="index+1 !== cardData.length" class="line"></div> <div class="chart-title">完成项目考试次数情况</div>
<div class="chart" id="examTimes" ref="examTimes"></div>
<div class="chart-remarks">注：本报表数据来源包括用户参加正式考试次数，不包含摸底考试次数。</div>
<div class="spacing"></div>
<!-- <div class="chart-title">完成项目考试分数情况</div> -->
<div class="chart-title-more">
<p>完成项目考试分数情况</p>
<el-radio-group class="rank-radio" size="medium" v-model="rankType" @change="changeRank">
<el-radio-button label="1">1分</el-radio-button>
<el-radio-button label="5">5分</el-radio-button>
<el-radio-button label="10">10分</el-radio-button>
</el-radio-group>
</div> </div>
<div class="table"> <div class="chart" id="examScore" ref="examScore"></div>
<el-table :data="tableData" style="width: 100%" border> <div class="chart-remarks">注：本报表数据来源包括用户参加正式考试，不包含摸底考试。</div>
<div class="spacing"></div>
<div v-if="downloadId == null">
<el-table :data="tableData" border class="exam-table">
<el-table-column prop="examType" label="类型" align="center"></el-table-column>
<el-table-column prop="examName" label="考试名" min-width="150" align="center"></el-table-column> <el-table-column prop="examName" label="考试名" min-width="150" align="center"></el-table-column>
<el-table-column prop="examUserCount" label="参与考试人数" min-width="100" align="center"></el-table-column> <el-table-column prop="doctorCount" label="应参与考试人数" align="center"></el-table-column>
<el-table-column prop="userCountForPassExam" label="通过考试人数" min-width="80" align="center"></el-table-column> <el-table-column prop="passCount" label="通过考试人数" align="center"></el-table-column>
<el-table-column v-if="showTd[0]" prop="userCountList[0]" :label="labelTd[0]" min-width="80" align="center"></el-table-column> <el-table-column prop="passRate" label="整体通过率" align="center">
<el-table-column v-if="showTd[1]" prop="userCountList[1]" :label="labelTd[1]" min-width="80" align="center"></el-table-column> <template slot-scope="scope">{{ scope.row.passRate | examRate }}</template>
<el-table-column v-if="showTd[2]" prop="userCountList[2]" :label="labelTd[2]" min-width="80" align="center"></el-table-column> </el-table-column>
<el-table-column v-if="showTd[3]" prop="userCountList[3]" :label="labelTd[3]" min-width="80" align="center"></el-table-column> <el-table-column prop="joinCount" label="参与考试人数" align="center"></el-table-column>
<el-table-column prop="joinRate" label="参与通过率" align="center">
<template slot-scope="scope">{{ scope.row.joinRate | examRate }}</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="100"> <el-table-column label="操作" fixed="right" align="center" min-width="100">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="text" size="small" @click="goPage(scope.row)">查看名单</el-button> <el-button class="button-jump" type="text" size="small" @click="goPage(scope.row)">查看名单</el-button>
</template> </template>
</el-table-column> </el-table-column>
<div slot="empty"> <div slot="empty">
<div class="table-empty"> <div class="table-empty">
<img src="../../assets/image/no-content1.png"> <img src="../../assets/image/no-content1.png" />
<p>没有相关数据，请重新选择查询范围</p>
</div>
</div>
</el-table>
</div>
<div v-if="downloadId != null">
<el-table :data="tableData.slice((pageNo-1)*pageSize,pageNo*pageSize)" border class="exam-table">
<el-table-column prop="examType" label="类型" align="center"></el-table-column>
<el-table-column prop="examName" label="考试名" min-width="150" align="center"></el-table-column>
<el-table-column prop="doctorCount" label="应参与考试人数" align="center"></el-table-column>
<el-table-column prop="passCount" label="通过考试人数" align="center"></el-table-column>
<el-table-column prop="passRate" label="整体通过率" align="center">
<template slot-scope="scope">{{ scope.row.passRate | examRate }}</template>
</el-table-column>
<el-table-column prop="joinCount" label="参与考试人数" align="center"></el-table-column>
<el-table-column prop="joinRate" label="参与通过率" align="center">
<template slot-scope="scope">{{ scope.row.joinRate | examRate }}</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="100">
<template slot-scope="scope">
<el-button class="button-jump" type="text" size="small" @click="goPage(scope.row)">查看名单</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png" />
<p>没有相关数据，请重新选择查询范围</p> <p>没有相关数据，请重新选择查询范围</p>
</div> </div>
</div> </div>
</el-table> </el-table>
</div> </div>
<!-- 分页 -->
<div class="pagination"> <div class="pagination">
<el-pagination <el-pagination
class="pagination"
background background
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="pageNo" :current-page="pageNo"
:page-sizes="[20, 50 ,100]" :page-sizes="[20, 50 ,100, 200]"
:page-size="pageSize" :page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="totalRows" :total="totalRows"
...@@ -51,11 +94,13 @@ ...@@ -51,11 +94,13 @@
</template> </template>
<script> <script>
import { log } from 'util'; import { log } from "util";
import * as operationData from "../../utils/operation";
import { openLoading, closeLoading } from "../../utils/utils"; import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils"; import * as commonUtil from "../../utils/utils";
let vm import * as operationData from "../../utils/operation";
import * as chartData from "../../utils/learning/chartData";
import echarts from "echarts";
let vm;
export default { export default {
props: { props: {
formInline: { formInline: {
...@@ -69,147 +114,274 @@ export default { ...@@ -69,147 +114,274 @@ export default {
}, },
organizationList: { organizationList: {
type: Array type: Array
} },
timeInfoData: {
type: Object
},
}, },
data() { data() {
return { return {
projectId: '', projectId: "",
tableData: [], tableData: [],
cardData: [], cardData: [],
totalRows: 0, //数据总数 totalRows: 0, //数据总数
pageNo: 1, //当前是第几页 pageNo: 1, //当前是第几页
pageSize: 20, //页面总数 pageSize: 20, //页面总数
labelTd: [], labelTd: [],
showTd: [false,false,false,false], showTd: [false, false, false, false],
echartsData: {
chart0: {},
chart1: {}
},
examData: {},
rankType: '1',
timeInfoChild: {},
downloadId: null,
}; };
}, },
watch: {
timeInfoData: {
deep: true,
handler(nv, ov) {
vm.timeInfoChild = nv;
}
}
},
created() { created() {
vm = this; vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "id"); vm.projectId = vm.getUrlSearch(window.location.href, "id");
vm.downloadId = vm.getUrlSearch(window.location.href, "downloadId");
}, },
// 挂载到Dom完成时 // 挂载到Dom完成时
mounted: function() { mounted: function() {
this.$on('search',()=>{ this.$on("search", () => {
// console.log(this.formInline); // console.log(this.formInline);
this.pageNo = 1; this.pageNo = 1;
this.search(); this.search();
this.searchTable();
}); });
this.$on("init", () => { this.$on("init", () => {
this.$nextTick(function() { this.$nextTick(function() {
if (vm.formInline.region.length != 0) { if (vm.formInline.region.length != 0) {
this.search(); this.search();
this.searchTable();
} }
}); });
}); });
this.$on("reset",() =>{ this.$on("reset", () => {
this.pageNo = 1; this.pageNo = 1;
this.pageSize = 20; this.pageSize = 20;
this.tableData = []; this.tableData = [];
this.cardData = []; this.cardData = [];
}); });
this.$on("static", () => {
vm.getStatic();
});
}, },
methods: { methods: {
setCardData(data) {
vm.totalRows = data.projectExamCount;
vm.cardData = [
{
title: "项目所有考试数",
num: data.projectExamCount,
unit: "门考试"
},
{
title: "项目所有考题数",
num: data.projectExamQuestionCount,
unit: "道题"
}
];
// vm.cardData[0].num = data.projectExamCount;
// vm.cardData[1].num = data.projectExamQuestionCount;
},
// 搜索列表 // 搜索列表
getStatic() {
let examAnalysisModel = vm.timeInfoChild.examAnalysisModel;
vm.setCardData(examAnalysisModel);
vm.setExamTimes(examAnalysisModel.examTimesList);
vm.setExamScore(examAnalysisModel.examScoreList);
vm.tableData = examAnalysisModel.examListDto.examInfoList;
vm.totalRows = examAnalysisModel.examListDto.totalRows;
},
search() { search() {
if (vm.formInline.region.length == 0) {
const h = this.$createElement;
vm.$message({
message: h('p', { style: 'color: #FF3399' }, '请先选择地区后再进行查询 ')
});
return;
}
let checkAll = operationData.hasAll(vm.formInline.organization)
let req = { let req = {
projectId: vm.projectId, projectId: vm.projectId,
ids: operationData.getIds(vm.formInline,vm.organizationList,checkAll), beginDate: operationData.setDuringTime(vm.formInline.during, "begin"),
type: operationData.getSearchType(vm.formInline,checkAll), endDate: operationData.setDuringTime(vm.formInline.during, "end"),
originalFlag: vm.formInline.checked == false ? 0 : 1 hospitalIdList: vm.formInline.organization,
originalFlag: vm.formInline.checked == false ? 0 : 1,
regionId: vm.formInline.region[vm.formInline.region.length - 1],
timeFlag: vm.formInline.timeFlag
}; };
console.log("4 req", req); // console.log("4 req", req);
openLoading(vm); openLoading(vm);
vm.reportGET("report/portalProjectExam/getTotal", req).then(res => { vm.POST("stats/report/exam", req).then(res => {
closeLoading(vm); closeLoading(vm);
if (res.code == "000000") { if (res.code == "000000") {
if(res.data.projectExamCount == 0 ) { vm.examData = res.data;
vm.$message("没有相关数据，请重新选择查询范围");
}
vm.setCardData(res.data); vm.setCardData(res.data);
vm.labelTd = res.data.gradeNameList; vm.setExamTimes(res.data.examTimesList);
vm.setExamScore(res.data.examScoreList);
} else { } else {
vm.$message(res.message); vm.$message(res.message);
} }
}); });
// let reqList = req;
// reqList.pageNo = vm.pageNo;
// reqList.pageSize = vm.pageSize;
// openLoading(vm);
// vm.POST("stats/report/exam/list", req).then(res => {
// closeLoading(vm);
// if (res.code == "000000") {
// vm.tableData = res.data.examInfoList;
// vm.totalRows = res.data.totalRows;
// }
// });
},
searchTable() {
let req = {
projectId: vm.projectId,
beginDate: operationData.setDuringTime(vm.formInline.during, "begin"),
endDate: operationData.setDuringTime(vm.formInline.during, "end"),
hospitalIdList: vm.formInline.organization,
originalFlag: vm.formInline.checked == false ? 0 : 1,
regionId: vm.formInline.region[vm.formInline.region.length - 1],
timeFlag: vm.formInline.timeFlag
};
let reqList = req; let reqList = req;
reqList.pageNo = vm.pageNo; reqList.pageNo = vm.pageNo;
reqList.pageSize = vm.pageSize; reqList.pageSize = vm.pageSize;
vm.reportGET("report/portalProjectExam/getExamList", req).then(res => { openLoading(vm);
vm.POST("stats/report/exam/list", req).then(res => {
closeLoading(vm); closeLoading(vm);
if (res.code == "000000") { if (res.code == "000000") {
vm.tableData = res.data.list; vm.tableData = res.data.examInfoList;
if(res.data.list.length == 0) { vm.totalRows = res.data.totalRows;
return;
}
if(res.data.list[0].userCountList == null || res.data.list[0].userCountList.length == 0) {
vm.showTd = [false,false,false,false];
} else if (res.data.list[0].userCountList.length == 1){
vm.showTd = [true,false,false,false];
} else if (res.data.list[0].userCountList.length == 2){
vm.showTd = [true,true,false,false];
} else if (res.data.list[0].userCountList.length == 3){
vm.showTd = [true,true,true,false];
} else if (res.data.list[0].userCountList.length == 4){
vm.showTd = [true,true,true,true];
}
} }
}); });
},
// setCardData(data) {
vm.totalRows = data.projectExamCount;
let cardData = [
{
title: "项目正式考试数",
value: "0门"
},
{
title: "项目摸底考试数",
value: "0门"
},
{
title: "项目所有考题数",
value: "0道"
}
];
cardData[0].value = data.afterExamCount + "门";
cardData[1].value = data.beforeExamCount + "门";
cardData[2].value = data.examTitleCount + "道";
vm.cardData = cardData;
},
updateResize() {
setTimeout(function() {
window.onresize = function() {
vm.echartsData.chart0.resize();
vm.echartsData.chart1.resize();
};
}, 30);
},
setExamTimes(data) {
let myChart = echarts.init(this.$refs.examTimes);
let xAxisData = [];
let seriesData = [];
for (let i = 0; i < data.length; i++) {
xAxisData.push(data[i].times + "次");
seriesData.push(data[i].count);
}
let option = chartData.examTimes(xAxisData, seriesData);
myChart.setOption(option);
vm.echartsData.chart0 = myChart;
vm.updateResize();
},
changeRank(value) {
console.log(value);
if(vm.downloadId == null) {
if(value == '1') {
vm.setExamScore(vm.examData.examScoreList);
} else if(value == '5') {
vm.setExamScore(vm.examData.fiveExamScoreList);
} else if(value == '10') {
vm.setExamScore(vm.examData.tenExamScoreList);
}
} else {
let examAnalysisModel = vm.timeInfoChild.examAnalysisModel;
if(value == '1') {
vm.setExamScore(examAnalysisModel.examScoreList);
} else if(value == '5') {
vm.setExamScore(examAnalysisModel.fiveExamScoreList);
} else if(value == '10') {
vm.setExamScore(examAnalysisModel.tenExamScoreList);
}
}
},
setExamScore(data) {
let myChart = echarts.init(this.$refs.examScore);
let xAxisData = [];
let seriesData = [];
for (let i = 0; i < data.length; i++) {
xAxisData.push(data[i].timesStr);
seriesData.push(data[i].count);
}
let option = chartData.examScore(xAxisData, seriesData);
myChart.setOption(option);
vm.echartsData.chart1 = myChart;
vm.updateResize();
}, },
// 跳转查看名单页面 // 跳转查看名单页面
goPage(data) { goPage(data) {
let checkAll = operationData.hasAll(vm.formInline.organization)
let routerData = {}; let routerData = {};
if(vm.downloadId == null) {
routerData = this.dialogData; routerData = this.dialogData;
routerData.projectId = vm.projectId; routerData.projectId = vm.projectId;
routerData.projectName = vm.getUrlSearch(window.location.href, "projectName"); routerData.projectName = vm.getUrlSearch(
window.location.href,
"projectName"
);
routerData.tableType = 2;
routerData.examId = data.examId;
routerData.beginDate = operationData.setDuringTime(vm.formInline.during, "begin"),
routerData.endDate = operationData.setDuringTime(vm.formInline.during, "end"),
routerData.regionId = vm.formInline.region[vm.formInline.region.length - 1];
routerData.originalFlag = vm.formInline.checked == false ? 0 : 1;
routerData.timeFlag = vm.formInline.timeFlag;
routerData.hospitalIdList = operationData.setHospitalIdList(vm.formInline.organization);
} else {
let reportParamModel = vm.timeInfoChild.reportParamModel;
routerData.base = 'static';
routerData.region = reportParamModel.regionNames;
routerData.organization = reportParamModel.hospitalNames;
routerData.projectId = reportParamModel.projectId,
routerData.projectName = reportParamModel.projectName,
routerData.tableType = 2; routerData.tableType = 2;
routerData.examId = data.examId; routerData.examId = data.examId;
routerData.ids = operationData.getIds(vm.formInline,vm.organizationList,checkAll); routerData.beginDate = reportParamModel.beginDate;
routerData.type = operationData.getSearchType(vm.formInline,checkAll), routerData.endDate = reportParamModel.endDate;
routerData.originalFlag = vm.formInline.checked == false ? 0 : 1 routerData.regionId = reportParamModel.regionId;
routerData.originalFlag = reportParamModel.originalFlag;
routerData.timeFlag = reportParamModel.timeFlag;
routerData.hospitalIdList = operationData.setHospitalIdList(reportParamModel.hospitalIdList);
}
// this.$router.push({ path: '/name-list', query: routerData}); // this.$router.push({ path: '/name-list', query: routerData});
let routeData = this.$router.resolve({ path: '/name-list', query: routerData}); let routeData = this.$router.resolve({
window.open(routeData.href, '_blank'); path: "/name-list",
query: routerData
});
window.open(routeData.href, "_blank");
}, },
// 更改数据显示数量 // 更改数据显示数量
handleSizeChange(val) { handleSizeChange(val) {
console.log(`每页 ${val} 条`) console.log(`每页 ${val} 条`);
vm.pageSize = val vm.pageSize = val;
vm.search() vm.pageNo = 1;
if(vm.downloadId == null) {
vm.searchTable();
}
}, },
// 换页 // 换页
handleCurrentChange(val) { handleCurrentChange(val) {
console.log(`当前页: ${val}`) console.log(`当前页: ${val}`);
vm.pageNo = val vm.pageNo = val;
vm.search() if(vm.downloadId == null) {
vm.searchTable();
}
} }
} }
}; };
...@@ -219,7 +391,6 @@ export default { ...@@ -219,7 +391,6 @@ export default {
.examination-analysis { .examination-analysis {
background: #fff; background: #fff;
overflow: hidden; overflow: hidden;
padding: 10px;
.weight { .weight {
font-weight: bold; font-weight: bold;
} }
...@@ -236,26 +407,116 @@ export default { ...@@ -236,26 +407,116 @@ export default {
float: left; float: left;
margin-top: 20px; margin-top: 20px;
} }
.box {
}
.table { .table {
margin-top: 30px; margin-top: 30px;
} }
.spacing {
position: relative;
width: 100%;
height: 20px;
background: #f0f2f5;
}
.box-list {
position: relative;
height: 110px;
background: #f0f2f5;
.box-card { .box-card {
width: 48%; position: relative;
margin-right: 1%; background-color: #ffffff;
width: 32%;
margin-right: 2%;
height: 120px;
float: left; float: left;
.el-card__header { .el-card__header {
border-bottom-width: 0; border-bottom-width: 0;
} }
.title { .el-card__body {
padding: 0px;
}
.value {
color: #373839;
text-align: center; text-align: center;
margin-top: 24px;
margin-bottom: 8px;
height: 45px;
line-height: 45px;
font-size: 32px;
font-weight: 500;
} }
.box-content { .title {
color: #666666;
text-align: center; text-align: center;
height: 40px; font-size: 14px;
font-size: 15px; height: 20px;
line-height: 20px;
}
} }
.box-last {
margin-right: 0%;
}
}
.chart-title {
position: relative;
margin-top: 30px;
margin-left: 30px;
height: 25px;
font-size:18px;
font-weight:600;
line-height: 25px;
color: #000000;
}
.chart-title-more {
position: relative;
width: 100%;
height: 70px;
p {
position: relative;
float: left;
width: 400px;
margin-top: 30px;
margin-left: 30px;
height: 25px;
font-size:18px;
font-weight:600;
line-height: 25px;
color: #000000;
}
.rank-radio {
position: relative;
margin: 30px 30px 0 0;
float: right;
.el-radio-button__inner {
padding: 7px 29px;
}
}
}
.chart {
position: relative;
margin: 0 auto 0 auto;
width: 1064px;
height: 380px;
}
.chart-remarks {
position: relative;
height: 66px;
padding: 20px 0 30px 30px;
font-size: 16px;
font-weight: 400;
line-height: 16px;
color: #666666;
}
.exam-table {
top: 20px;
padding: 0;
width: 95%;
margin:0 auto 20px auto;
.button-jump {
color: #449284;
}
}
.pagination {
margin-top: 30px;
margin-right: 13px;
} }
} }
</style> </style>
src/views/learning/item-learning-effect.vue
浏览文件 @ e6145256
<template> <template>
<div class="learning-effect"> <div class="learning-effect">
<el-button type="default" size="small" @click="exportPDF">导出明细</el-button> <div class="box-list">
<div class="education" ref="education"></div> <div v-for="(item , index) in cardData" :key="index" class="box-card" v-bind:class="{ 'box-last': index == 1 }">
<div class="learning" ref="learning"></div> <!-- <el-card class="box-card" v-bind:class="{ 'box-last': index == 1 }"> -->
<p class="value">{{ item.value }}</p>
<p class="title">{{ item.title }}</p>
<!-- </el-card> -->
</div>
</div>
<div class="spacing"></div>
<div class="chart-title">不同学历完成项目前后正确率对比</div>
<div class="chartEdu" ref="education"></div>
<div class="chart-remarks">注：本报表数据来源仅仅统计同时包含摸底考和正式考的课程培训。</div>
<div class="spacing"></div>
<div class="chart-title">培训前后知识点掌握情况</div>
<div class="chartLearn" ref="learning"></div>
<div class="chart-remarks">注：本报表数据来源仅包括有摸底考的课程培训。</div>
</div> </div>
</template> </template>
<script> <script>
import { openLoading, closeLoading } from "../../utils/utils"; import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils"; import * as commonUtil from "../../utils/utils";
import * as operationData from "../../utils/operation";
import * as chartData from "../../utils/learning/chartData";
import echarts from "echarts"; import echarts from "echarts";
import html2Canvas from 'html2canvas'
import JsPDF from 'jspdf'
let vm = null; let vm = null;
export default { export default {
props: {
formInline: {
type: Object
},
activeName: {
type: String
},
timeInfoData: {
type: Object
},
},
data() { data() {
return { return {
cardData: [],
echartsData: { echartsData: {
chart1: {}, chart1: {},
chart2: {} chart2: {}
} },
timeInfoChild: {},
}; };
}, },
watch: {
timeInfoData: {
deep: true,
handler(nv, ov) {
vm.timeInfoChild = nv;
}
}
},
created() { created() {
vm = this; vm = this;
vm.$nextTick(() => { vm.projectId = vm.getUrlSearch(window.location.href, "id");
vm.setEducation();
vm.setLearning();
});
}, },
mounted() { mounted() {
commonUtil.resizeHeight(); commonUtil.resizeHeight();
this.$on("search", () => {
this.search();
});
this.$on("static", () => {
vm.getStatic();
});
}, },
methods: { methods: {
exportPDF() { getStatic() {
let element = ''; let studyEffectDto = vm.timeInfoChild.studyEffectAnalysisModel.studyEffectDto;
element = document.querySelector('.data-all-wrap'); vm.initCard(studyEffectDto);
console.log(element); vm.setEducation(studyEffectDto.educationEffectList);
if(element == null) { vm.setLearning(studyEffectDto.knowledgeEffectList);
return
}
setTimeout(() => {
html2Canvas(element).then(function(canvas) {
let contentWidth = canvas.width;
let contentHeight = canvas.height;
//一页pdf显示html页面生成的canvas高度;
let pageHeight = contentWidth / 592.28 * 841.89;
//未生成pdf的html页面高度
let leftHeight = contentHeight;
//页面偏移
let position = 0;
//a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
let imgWidth = 595.28;
let imgHeight = 592.28 / contentWidth * contentHeight;
let pageData = canvas.toDataURL('image/jpeg', 1.0);
let pdf = new JsPDF('', 'pt', 'a4');
//有两个高度需要区分，一个是html页面的实际高度，和生成pdf的页面高度(841.89)
//当内容未超过pdf一页显示的范围，无需分页
if (leftHeight < pageHeight) {
pdf.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight);
} else {
while (leftHeight > 0) {
pdf.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
leftHeight -= pageHeight;
position -= 841.89;
//避免添加空白页
if (leftHeight > 0) {
pdf.addPage();
}
}
}
let title = "导出学情报告";
pdf.save(title + '.pdf');
});
}, 0);
}, },
updateResize() { updateResize() {
this.$nextTick(function() { this.$nextTick(function() {
...@@ -87,129 +84,161 @@ export default { ...@@ -87,129 +84,161 @@ export default {
}; };
}); });
}, },
setEducation() { search() {
let myChart = echarts.init(this.$refs.education); let req = {
let option = { projectId: vm.projectId,
title: { beginDate: operationData.setDuringTime(vm.formInline.during, "begin"),
text: "" endDate: operationData.setDuringTime(vm.formInline.during, "end"),
}, hospitalIdList: vm.formInline.organization,
tooltip: { originalFlag: vm.formInline.checked == false ? 0 : 1,
trigger: "axis", regionId: vm.formInline.region[vm.formInline.region.length - 1],
axisPointer: { timeFlag: vm.formInline.timeFlag
type: "shadow" };
} openLoading(vm);
}, // if(req.regionId == "000") {
color: ['#5D7092','#FFB01B'], // req.regionId = "000";
legend: { // }
data: ["项目前总正确率", "项目后总正确率"] // console.log("0 req", req);
}, vm.POST("stats/report/studyEffect", req).then(res => {
grid: { closeLoading(vm);
left: "3%", if (res.code == "000000") {
right: "4%", vm.initCard(res.data);
bottom: "3%", setTimeout(function() {
containLabel: true vm.setEducation(res.data.educationEffectList);
}, vm.setLearning(res.data.knowledgeEffectList);
xAxis: { }, 20);
type: "category",
data: ["本科", "大专", "中专及以下", "硕士", "博士", "其他"]
},
yAxis: {
min: 0,
max: 100,
type: "value",
axisLabel: {
formatter: "{value} %"
} }
});
}, },
series: [ initCard(data) {
let cardData = [
{ {
name: "项目前总正确率", value: "0%",
type: "bar", title: "培训前总正确率"
barWidth: 10,
data: [45, 45, 34, 34, 4, 8]
}, },
{ {
name: "项目后总正确率", value: "0%",
type: "bar", title: "培训前后正确率"
barWidth: 10,
data: [70, 66, 67, 67, 24, 24]
} }
] ];
}; cardData[0].value = (data.beforeRate*100).toFixed(2) + "%";
cardData[1].value = (data.afterRate*100).toFixed(2) + "%";
vm.cardData = cardData;
},
setEducation(data) {
let myChart = echarts.init(this.$refs.education);
let xAxisData = [];
let seriesBefore = [];
let seriesAfter = [];
for(let i = 0; i < data.length ; i++) {
xAxisData.push(data[i].classifyName);
seriesBefore.push((data[i].beforeRate*100).toFixed(2));
seriesAfter.push((data[i].afterRate*100).toFixed(2));
}
let option = chartData.educationEffect(xAxisData, seriesBefore ,seriesAfter);
myChart.setOption(option); myChart.setOption(option);
vm.echartsData.chart1 = myChart; vm.echartsData.chart1 = myChart;
vm.updateResize(); vm.updateResize();
}, },
setLearning() { setLearning(data) {
let myChart = echarts.init(this.$refs.learning); let myChart = echarts.init(this.$refs.learning);
let option = { let xAxisData = [];
title: { let seriesBefore = [];
text: "" let seriesAfter = [];
}, for(let i = 0; i < data.length ; i++) {
tooltip: { xAxisData.push(data[i].classifyName);
trigger: "axis", seriesBefore.push((data[i].beforeRate*100).toFixed(2));
axisPointer: { seriesAfter.push((data[i].afterRate*100).toFixed(2));
type: "shadow"
} }
}, let option = chartData.knowledgeEffect(xAxisData, seriesBefore ,seriesAfter);
color: ['#5D7092','#FFB01B'],
legend: {
data: ["培训前正确率", "培训后正确率"]
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: {
axisLabel: {
interval: 0,
rotate: 45
},
type: "category",
data: ["推荐联合用药方案"]
},
yAxis: {
min: 0,
max: 100,
type: "value",
axisLabel: {
formatter: "{value} %"
}
},
series: [
{
name: "培训前正确率",
type: "bar",
barWidth: 10,
data: [45]
},
{
name: "培训后正确率",
type: "bar",
barWidth: 10,
data: [81]
}
]
};
myChart.setOption(option); myChart.setOption(option);
vm.echartsData.chart2 = myChart; vm.echartsData.chart2 = myChart;
vm.updateResize(); vm.updateResize();
}, }
} }
}; };
</script> </script>
<style lang='scss' rel='stylesheet/scss'> <style lang='scss' rel='stylesheet/scss'>
.learning-effect { .learning-effect {
width: 100%;
.learning,
.education {
margin-top: 40px;
min-width: 400px;
height: 400px;
background: #fff; background: #fff;
overflow: hidden;
// padding: 10px;
.spacing {
position: relative;
width: 100%;
height: 20px;
background: #f0f2f5;
}
.box-list {
position: relative;
height: 110px;
background: #f0f2f5;
.box-card {
position: relative;
background-color: #ffffff;
width: 49%;
margin-right: 2%;
height: 120px;
float: left;
.el-card__header {
border-bottom-width: 0;
}
.el-card__body {
padding: 0px;
}
.value {
color: #373839;
text-align: center;
margin-top: 24px;
margin-bottom: 8px;
height: 45px;
line-height: 45px;
font-size: 32px;
font-weight: 500;
}
.title {
color: #666666;
text-align: center;
font-size: 14px;
height: 20px;
line-height: 20px;
}
}
.box-last {
margin-right: 0%;
}
}
.chart-title {
position: relative;
margin-top: 30px;
margin-left: 30px;
height: 25px;
font-size:18px;
font-weight:600;
line-height: 25px;
color: #000000;
}
.chartEdu {
position: relative;
margin: 20px auto 0 auto;
width: 1064px;
height: 380px;
}
.chartLearn {
position: relative;
margin: 20px auto 0 auto;
width: 1064px;
height: 462px;
}
.chart-remarks {
position: relative;
height: 66px;
padding: 20px 0 30px 30px;
font-size: 16px;
font-weight: 400;
line-height: 16px;
color: #666666;
} }
} }
</style> </style>
src/views/learning/item-list.vue
浏览文件 @ e6145256
...@@ -2,9 +2,33 @@ ...@@ -2,9 +2,33 @@
<div class="item-list-wrap"> <div class="item-list-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird" :jumPathThird="jumPathThird"></bread-crumb> <bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird" :jumPathThird="jumPathThird"></bread-crumb>
<div class="component-content screenSet" id="screenSet"> <div class="component-content screenSet" id="screenSet">
<el-form class="item-form" ref="formInline" :model="formInline" label-width="80px"> <div v-if="staticData == 1" class="item-form">
<div class="form-title">查询条件</div>
<div class="form-p">
<p>
<span>选择地区</span>
<span class="span-value">{{ reportParamModel.regionNames }}</span>
</p>
<p>
<span>原始数据</span>
<span class="span-value">{{ reportParamModel.originalFlag == 0 ? '否' : '是' }}</span>
</p>
<p>
<span>选择机构</span>
<span class="span-value">{{ reportParamModel.hospitalNames }}</span>
</p>
<p>
<span >选择时间</span>
<span class="span-value">{{ reportParamModel.beginDate }}-{{ reportParamModel.endDate }}</span>
</p>
</div>
<div class="buttom-line"></div>
</div>
<el-form v-if="staticData == 0" class="item-form" ref="formInline" :model="formInline" label-width="80px">
<div class="form-title">查询条件</div>
<el-form-item label="选择地区："> <el-form-item label="选择地区：">
<!-- :props="props" --> <!-- :props="props" -->
<el-col :span="12">
<el-cascader <el-cascader
size="small" size="small"
ref="cascaderRegion" ref="cascaderRegion"
...@@ -17,6 +41,10 @@ ...@@ -17,6 +41,10 @@
placeholder="请先选择地区后再进行查询" placeholder="请先选择地区后再进行查询"
style="width:330px" style="width:330px"
></el-cascader> ></el-cascader>
</el-col>
<el-col :span="6">
<el-checkbox v-if="showOriginal == 1" size="small" v-model="formInline.checked">查看原始数据</el-checkbox>
</el-col>
</el-form-item> </el-form-item>
<el-form-item label="选择机构："> <el-form-item label="选择机构：">
<el-select <el-select
...@@ -26,7 +54,7 @@ ...@@ -26,7 +54,7 @@
@change="changeOrganization" @change="changeOrganization"
multiple multiple
collapse-tags collapse-tags
:disabled="formInline.region.length < 3" :disabled="areaLen < 3"
style="width:330px" style="width:330px"
> >
<el-option <el-option
...@@ -46,23 +74,62 @@ ...@@ -46,23 +74,62 @@
@close="handleTagClose(tag)" @close="handleTagClose(tag)"
>{{ tag.label }}</el-tag> >{{ tag.label }}</el-tag>
</div> </div>
<el-form-item label v-if="showOriginal == 1"> <el-form-item label="选择时间：">
<el-checkbox size="small" v-model="formInline.checked">查看原始数据</el-checkbox> <el-col :span="12">
<el-select
size="small"
v-model="formInline.timeFlag"
placeholder="请选择"
style="width:330px;"
@change="changeTimeFlag"
>
<el-option
v-for="item in timeFlagList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-col>
<el-col :span="8" v-show="formInline.timeFlag == 2">
<el-date-picker
size="small"
v-model="formInline.during"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-col>
</el-form-item> </el-form-item>
</el-form> <div class="buttom-line"></div>
<div class="form-button"> <!-- <el-form-item label v-if="showOriginal !== 1">
<el-button @click="search()" type="primary">查询</el-button> <el-checkbox size="small" v-model="formInline.checked">查看原始数据</el-checkbox>
<el-button @click="resetForm()">重置</el-button> </el-form-item> -->
<div v-if="staticData == 0" class="form-button">
<el-button size="small" @click="search()" type="primary">查询</el-button>
<el-button size="small" @click="resetForm()">重置</el-button>
</div> </div>
</el-form>
<div class="button-group"> <div class="button-group">
<el-button v-if="roleType == 'L1' || roleType == 'L2'" type="default" size="small" @click="changeDate">数据修改</el-button> <el-button v-if="roleType == 1 || roleType == 2" type="default" size="small" @click="changeDate">数据修改</el-button>
<!-- <el-button type="default" size="small" @click="update" v-else>修改范围</el-button> --> <el-button type="default" size="small" @click="exportPDF">导出PDF</el-button>
<el-button type="default" size="small" :disabled="exportStatus" @click="exportExcel">导出明细</el-button> <el-button type="default" size="small" :disabled="exportStatus" @click="exportExcel">导出明细</el-button>
</div> </div>
<!-- <div class="item-tab"></div> --> <div class="item-tab"></div>
<el-tabs id="item-list-tabs" v-model="activeName" @tab-click="handleClick" :before-leave="beforeLeave"> <el-tabs class="item-list-tabs" ref="tabs" id="item-list-tabs" v-model="activeName" @tab-click="handleClick" :before-leave="beforeLeave">
<el-tab-pane label="参与情况" name="first"> <el-tab-pane label="数据总览" name="zero" >
<data-all
ref="childDataAll"
:formInline="formInline"
:activeName="activeName"
:organizationNum="organizationNum"
:organizationList="organizationList"
:timeInfoData="timeInfoData"
></data-all>
</el-tab-pane>
<!-- <el-tab-pane label="参与情况" name="first">
<part-in <part-in
ref="childPart" ref="childPart"
:formInline="formInline" :formInline="formInline"
...@@ -70,22 +137,24 @@ ...@@ -70,22 +137,24 @@
:organizationNum="organizationNum" :organizationNum="organizationNum"
:organizationList="organizationList" :organizationList="organizationList"
></part-in> ></part-in>
</el-tab-pane> </el-tab-pane> -->
<el-tab-pane label="人群分析" name="second"> <el-tab-pane label="人群分析" name="second">
<crowd-analysis <crowd-analysis
ref="childCrowd" ref="childCrowd"
:formInline="formInline" :formInline="formInline"
:activeName="activeName" :activeName="activeName"
:organizationList="organizationList" :organizationList="organizationList"
:timeInfoData="timeInfoData"
></crowd-analysis> ></crowd-analysis>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="课程分析" name="third"> <el-tab-pane label="课程分析" name="third" v-if="displayCourse == 1">
<course-analysis <course-analysis
ref="childCourse" ref="childCourse"
:formInline="formInline" :formInline="formInline"
:activeName="activeName" :activeName="activeName"
:dialogData="dialogData" :dialogData="dialogData"
:organizationList="organizationList" :organizationList="organizationList"
:timeInfoData="timeInfoData"
></course-analysis> ></course-analysis>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="考试分析" name="fourth" v-if="displayExam == 1"> <el-tab-pane label="考试分析" name="fourth" v-if="displayExam == 1">
...@@ -95,26 +164,30 @@ ...@@ -95,26 +164,30 @@
:activeName="activeName" :activeName="activeName"
:dialogData="dialogData" :dialogData="dialogData"
:organizationList="organizationList" :organizationList="organizationList"
:timeInfoData="timeInfoData"
></examination-analysisfrom> ></examination-analysisfrom>
</el-tab-pane> </el-tab-pane>
<!-- <el-tab-pane label="数据总览" name="zero" > <el-tab-pane label="学习效果分析" name="fifth" v-if="displayEffect == 1">
<data-all <learning-effect
ref="childDataAll" ref="childEffect"
:formInline="formInline" :formInline="formInline"
:activeName="activeName" :activeName="activeName"
:organizationNum="organizationNum" :timeInfoData="timeInfoData"
:organizationList="organizationList" ></learning-effect>
></data-all>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="学习效果分析" name="fifth" :lazy=true>
<learning-effect></learning-effect>
</el-tab-pane> -->
</el-tabs> </el-tabs>
<el-dialog title="提示" :visible.sync="dialogVisible" width="30%" center> <el-dialog title="提示" :visible.sync="dialogVisible" width="30%" center>
<p style="text-align:center">文件正在生成，你可以去“我的导出下载”页，下载文件</p> <p style="text-align:center">由于导出数据较大，预估需要花费 5 小时左右。确定继续导出吗？</p>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">留在当前页</el-button> <el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="toDownload()">去下载</el-button> <el-button type="primary" @click="exportHttp()">继续导出</el-button>
</span>
</el-dialog>
<el-dialog title="提示" :visible.sync="dialogSearch" width="30%" center>
<p style="text-align:center">由于查询数据较大，预估需要花费 5 小时左右。确定继续生成报告吗？</p>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogSearch = false">取消</el-button>
<el-button type="primary" @click="exportTime()">继续生成</el-button>
</span> </span>
</el-dialog> </el-dialog>
<el-dialog title :visible.sync="dialogUpdate" width="80%" center> <el-dialog title :visible.sync="dialogUpdate" width="80%" center>
...@@ -146,6 +219,8 @@ import { openLoading, closeLoading } from "../../utils/utils"; ...@@ -146,6 +219,8 @@ import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils"; import * as commonUtil from "../../utils/utils";
import * as operationData from "../../utils/operation"; import * as operationData from "../../utils/operation";
import { log } from "util"; import { log } from "util";
import html2Canvas from 'html2canvas'
import JsPDF from 'jspdf'
let vm = null; let vm = null;
export default { export default {
...@@ -174,31 +249,14 @@ export default { ...@@ -174,31 +249,14 @@ export default {
lazy: true, lazy: true,
lazyLoad(node, resolve) { lazyLoad(node, resolve) {
const { level } = node; const { level } = node;
if (node.level >= 1) {
console.log("node", node); console.log("node", node);
if (node.level == 1) {
let req = {
provinceId: node.data.value
};
vm.GET("basic-data/position/cities", req).then(res => {
let newData = vm.setMoreOption(res.data.cityList, "cities");
console.log("newData", newData);
resolve(newData);
});
} else if (node.level == 2) {
let req = { let req = {
cityId: node.data.value projectId: vm.projectId,
}; regionId: node.data.value
vm.GET("basic-data/position/counties", req).then(res => {
let newData = vm.setMoreOption(res.data.countyList, "counties");
console.log("newData", newData);
resolve(newData);
});
} else if (node.level == 3) {
let req = {
countyId: node.data.value
}; };
vm.GET("basic-data/position/towns", req).then(res => { vm.GET("stats/region", req).then(res => {
let newData = vm.setMoreOption(res.data.townList, "towns"); let newData = vm.setRegionOptionMore(res.data.list);
console.log("newData", newData); console.log("newData", newData);
resolve(newData); resolve(newData);
}); });
...@@ -208,27 +266,59 @@ export default { ...@@ -208,27 +266,59 @@ export default {
showOriginal: 2, showOriginal: 2,
roleType: '', roleType: '',
formInline: { formInline: {
region: [0], region: [],
date: "", date: "",
organization: [], organization: [],
checked: false, checked: false,
timeFlag: 1,
during: null,
pageNo: 1, pageNo: 1,
pageSize: 20 pageSize: 20,
}, },
organizationNotice: '选择地区筛选到区才能选择机构', organizationNotice: '选择地区筛选到区才能选择机构',
dialogData: { dialogData: {
region: "", region: "全部",
// regionData: "", // regionData: "",
organization: "" organization: ""
// organizationData: "", // organizationData: "",
}, },
tags: [], tags: [],
activeName: "first", activeName: "zero",
organizationNum: 0, organizationNum: 0,
dialogVisible: false, dialogVisible: false,
dialogUpdate: false, dialogUpdate: false,
displayExam: 2, displayExam: 1,
flag: 1, flag: 1,
//v2.0更新data部分
timeFlagList: [
{
value: 1,
label: '截至昨日',
},
{
value: 2,
label: '自定义时间',
}
],
areaLen: 1,
hospitalCnt: 0,
hospitalId: [],
certFlag: 0,
displayCourse: 1,
displayEffect: 1,
exportReq: {},
dialogSearch: false,
downloadId: null,
staticData: 0,
timeInfoData: {},
reportParamModel: {
beginDate: "",
endDate: "",
regionNames: "",
hospitalNames: "",
originalFlag: 1
},
hospitalCntList: [],
}; };
}, },
computed: { computed: {
...@@ -244,84 +334,112 @@ export default { ...@@ -244,84 +334,112 @@ export default {
this.projectId = vm.getUrlSearch(window.location.href, "id"); this.projectId = vm.getUrlSearch(window.location.href, "id");
this.projectName = vm.getUrlSearch(window.location.href, "projectName"); this.projectName = vm.getUrlSearch(window.location.href, "projectName");
this.curmbThird = vm.getUrlSearch(window.location.href, "projectName"); this.curmbThird = vm.getUrlSearch(window.location.href, "projectName");
this.getDisplay(); this.downloadId = vm.getUrlSearch(window.location.href, "downloadId");
this.search(); this.checkShowType();
// this.getDisplay();
// this.search();
// this.getRegionOption(); // this.getRegionOption();
}, },
mounted: function() { mounted: function() {
commonUtil.resizeHeight(); commonUtil.resizeHeight();
}, },
methods: { methods: {
checkShowType() {
if(vm.downloadId == null) {
vm.getDisplay();
}
if(vm.downloadId != null) {
vm.staticData = 1;
vm.exportTimeInfo();
}
},
exportTimeInfo() {
let req = {};
openLoading(vm);
vm.GET("stats/export/time/info/"+ vm.downloadId, req).then(res => {
closeLoading(vm);
if(res.code == "000000") {
vm.timeInfoData = res.data;
vm.reportParamModel = res.data.reportParamModel;
let doctorInfoRep = res.data.doctorInfoRep;
setTimeout(function() {
vm.$refs.childDataAll.$emit("static");
vm.$refs.childCrowd.$emit("static");
if(doctorInfoRep.existCourse == 1) {
vm.$refs.childCourse.$emit("static");
}
if(doctorInfoRep.existExam == 1) {
vm.$refs.childExam.$emit("static");
}
if(doctorInfoRep.existEffect == 1) {
vm.$refs.childEffect.$emit("static");
}
},20);
} else {
vm.$message(res.message);
}
});
},
getDisplay(type) { getDisplay(type) {
let req = { let reqInfo = {
projectId: vm.projectId, projectId: vm.projectId,
projectName: vm.projectName,
}; };
openLoading(vm); openLoading(vm);
vm.reportGET("report/portal/display", req).then(res => { vm.GET("stats/region/info", reqInfo).then(res => {
closeLoading(vm); closeLoading(vm);
if (res.code == "000000") { if (res.code == "000000") {
console.log('vm.showOriginal',res.data)
vm.showOriginal = res.data.status; vm.showOriginal = res.data.status;
vm.roleType = res.data.roleType; vm.roleType = res.data.roleType;
vm.displayCourse = res.data.existCourse;
vm.displayExam = res.data.existExam; vm.displayExam = res.data.existExam;
vm.flag = res.data.flag; vm.displayEffect = res.data.existEffect;
} vm.certFlag = res.data.certFlag;
if(type !=2) {
vm.getRegionOption(); vm.getRegionOption();
} }
}); });
}, },
beforeLeave(activeName, oldActiveName) { beforeLeave(activeName, oldActiveName) {
console.log('action',activeName,'oldActive',oldActiveName) // console.log('action',activeName,'oldActive',oldActiveName)
}, },
handleClick(tab, event) { handleClick(tab, event) {
//console.log(tab, event); // console.log("activeName", this.activeName, tab.name);
// if(tab.name == this.activeName) { // if (tab.name == "first") {
// return; // this.$refs.childPart.$emit("init");
// } else if (tab.name == "second") {
// this.$refs.childCrowd.$emit("init");
// } else if (tab.name == "third") {
// this.$refs.childCourse.$emit("init");
// } else if (tab.name == "fourth") {
// this.$refs.childExam.$emit("init");
// } // }
console.log("activeName", this.activeName, tab.name);
if (tab.name == "first") {
this.$refs.childPart.$emit("init");
} else if (tab.name == "second") {
this.$refs.childCrowd.$emit("init");
} else if (tab.name == "third") {
this.$refs.childCourse.$emit("init");
} else if (tab.name == "fourth") {
this.$refs.childExam.$emit("init");
}
}, },
handleChange(value) { handleChange(value) {
this.formInline.organization = []; this.formInline.organization = [];
this.tags = []; this.tags = [];
setTimeout(function() { setTimeout(function() {
// console.log(vm.$refs["cascaderRegion"].inputValue); console.log('行政区域改变',vm.$refs["cascaderRegion"].inputValue);
vm.dialogData.region = vm.$refs["cascaderRegion"].inputValue; vm.dialogData.region = vm.$refs["cascaderRegion"].inputValue;
// vm.dialogData.regionData = value[value.length-1]; // vm.dialogData.regionData = value[value.length-1];
// console.log('vm.dialogData.region',vm.dialogData.region) // console.log('vm.dialogData.region',vm.dialogData.region)
}, 20); }, 20);
// console.log('region',value,vm.formInline); // console.log('region',value,vm.formInline);
if (value.length >= 3) { let areaArr = value[value.length -1].split('_');
vm.areaLen = areaArr.length;
console.log('areaArr!!',areaArr);
if (areaArr.length >= 3) {
this.getOrganizationList(); this.getOrganizationList();
this.organizationNotice = "请选择机构"; this.organizationNotice = "请选择机构";
} else { } else {
this.organizationNotice = "选择地区筛选到区才能选择机构"; this.organizationNotice = "选择地区筛选到区才能选择机构";
} }
}, },
setMoreOption(data, type) { setRegionOptionMore(data) {
let option = []; let option = [];
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
let obj = data[i]; let obj = data[i];
if (type == "cities") { obj.label = data[i].label;
obj.label = data[i].cityName; obj.value = data[i].id;
obj.value = data[i].cityId; if(obj.degree == 4) {
} else if (type == "counties") {
obj.label = data[i].countyName;
obj.value = data[i].countyId;
// obj.leaf = true;
} else if (type == "towns") {
obj.label = data[i].townName;
obj.value = data[i].townId;
obj.leaf = true; obj.leaf = true;
} }
option.push(obj); option.push(obj);
...@@ -391,45 +509,49 @@ export default { ...@@ -391,45 +509,49 @@ export default {
}, },
//获取地区 //获取地区
getRegionOption() { getRegionOption() {
if(vm.flag == 2 && vm.roleType == "L2") { let req = {
this.optionsRegion = [{id: 11, provinceId: 330, provinceName: "浙江省",value: 330, label: "浙江省"}] projectId: vm.projectId,
} else { };
let req = {};
openLoading(vm); openLoading(vm);
vm.GET("basic-data/position/provinces", req).then(res => { vm.GET("stats/region", req).then(res => {
closeLoading(vm); closeLoading(vm);
// let list = [];
// for(let i =0;i<res.data.provinceList.length;i++) {
// list[i] = res.data.provinceList[i].provinceName;
// }
// console.log(list);
if (res.code == "000000") { if (res.code == "000000") {
this.optionsRegion = operationData.setRegionOption( vm.formInline.region = [];
res.data.provinceList vm.formInline.region[0] = res.data.list[0].id;
vm.optionsRegion = operationData.setRegionOptionNew(
res.data.list
); );
// console.log("this.optionsRegion", this.optionsRegion); vm.search();
vm.gethHspitalsCnt();
} }
}); });
},
gethHspitalsCnt() {
let req = {
projectId: vm.projectId,
regionId: vm.formInline.region[vm.formInline.region.length - 1]
};
vm.GET("stats/region/hospitals/cnt", req).then(res => {
if (res.code == "000000") {
vm.hospitalCnt = res.data.hospitalCnt;
vm.hospitalCntList = res.data.list
} }
});
}, },
//获取机构列表
getOrganizationList() { getOrganizationList() {
this.organizationList = []; vm.organizationList = [];
let countyId = vm.formInline.region[vm.formInline.region.length - 1]; let regionId = vm.formInline.region[vm.formInline.region.length - 1];
let type = 3;
if(vm.formInline.region.length == 4) {
type = 5;
}
let req = { let req = {
projectId: vm.projectId, projectId: vm.projectId,
type: type, regionId : regionId
id: countyId
}; };
openLoading(vm); openLoading(vm);
vm.reportGET("report/portal/getOrganizationList", req).then(res => { vm.GET("stats/region/hospital", req).then(res => {
closeLoading(vm); closeLoading(vm);
if (res.code == "000000") { if (res.code == "000000") {
this.organizationList = operationData.getLearnOrganization( this.organizationList = operationData.getLearnOrganization(
res.data.hospitalList res.data.list
); );
} }
}); });
...@@ -453,21 +575,94 @@ export default { ...@@ -453,21 +575,94 @@ export default {
vm.getDisplay(2); vm.getDisplay(2);
vm.search(); vm.search();
}, },
search() { setExportReq() {
// console.log(this.formInline,this.activeName); vm.exportReq = {
if (this.activeName == "first") { projectId: vm.projectId,
this.organizationNum = this.getOrganizationNum(); beginDate: operationData.setDuringTime(vm.formInline.during,'begin'),
// console.log('this.organizationNum',this.organizationNum) endDate: operationData.setDuringTime(vm.formInline.during,'end'),
this.$nextTick(function() { hospitalIdList: vm.formInline.organization,
this.$refs.childPart.$emit("search"); originalFlag: vm.formInline.checked == false ? 0 : 1,
regionId: vm.formInline.region[vm.formInline.region.length - 1],
timeFlag: vm.formInline.timeFlag,
};
},
changeTimeFlag(value) {
if(value == 1) {
vm.formInline.during = null;
}
},
exportTime() {
let req = {
projectId: vm.projectId,
beginDate: operationData.setDuringTime(vm.formInline.during, "begin"),
endDate: operationData.setDuringTime(vm.formInline.during, "end"),
hospitalIdList: vm.formInline.organization,
originalFlag: vm.formInline.checked == false ? 0 : 1,
regionId: vm.formInline.region[vm.formInline.region.length - 1],
timeFlag: vm.formInline.timeFlag,
hospitalNames: vm.dialogData.organization,
regionNames: vm.dialogData.region,
};
if(vm.organizationList.length == 1) {
req.hospitalIdList = [];
req.hospitalIdList[0] = vm.organizationList[0].value;
}
if(req.regionNames == '全部') {
//全部地区 机构只有一个情况
if(vm.hospitalCntList.length == 1) {
req.hospitalIdList = [];
req.hospitalIdList[0] = vm.hospitalCntList[0].hospitalId;
}
}
openLoading(vm);
vm.POST("stats/export/time", req).then(res => {
closeLoading(vm);
if(res.code == "000000") {
vm.$router.push("export-download?projectId="+vm.projectId+'&listType=2');
} else {
vm.$message(res.message)
}
vm.dialogSearch = false;
}); });
} else if (this.activeName == "second") { },
this.$refs.childCrowd.$emit("search"); search() {
} else if (this.activeName == "third") { console.log(vm.formInline);
this.$refs.childCourse.$emit("search"); if(vm.formInline.timeFlag == 1) {
} else if (this.activeName == "fourth") { //截止昨日
this.$refs.childExam.$emit("search"); vm.setExportReq();
vm.$refs.childDataAll.$emit("search");
vm.$refs.childCrowd.$emit("search");
if(vm.displayCourse == 1) {
vm.$refs.childCourse.$emit("search");
}
if(vm.displayExam == 1) {
vm.$refs.childExam.$emit("search");
}
if(vm.displayEffect == 1) {
vm.$refs.childEffect.$emit("search");
}
} else if(vm.formInline.timeFlag == 2) {
//开始时间结束时间
if(vm.formInline.during == null) {
vm.$message('自定义时间，请选择时间段！')
} else {
vm.dialogSearch = true;
}
} }
// if (this.activeName == "first") {
// this.organizationNum = this.getOrganizationNum();
// // console.log('this.organizationNum',this.organizationNum)
// this.$nextTick(function() {
// this.$refs.childPart.$emit("search");
// });
// } else if (this.activeName == "second") {
// this.$refs.childCrowd.$emit("search");
// } else if (this.activeName == "third") {
// this.$refs.childCourse.$emit("search");
// } else if (this.activeName == "fourth") {
// this.$refs.childExam.$emit("search");
// }
}, },
//重置 //重置
resetForm() { resetForm() {
...@@ -494,35 +689,31 @@ export default { ...@@ -494,35 +689,31 @@ export default {
} }
}, },
exportExcel() { exportExcel() {
if (vm.formInline.region.length == 0) { if(vm.downloadId == null) {
const h = this.$createElement;
vm.$message({
message: h('p', { style: 'color: #FF3399' }, '请先选择地区后再进行导出 ')
});
return;
}
//按钮置灰三秒 //按钮置灰三秒
vm.exportStatus = true; vm.exportStatus = true;
setTimeout(function() { setTimeout(function() {
vm.exportStatus = false; vm.exportStatus = false;
},3000); },3000);
this.dialogVisible = true; this.dialogVisible = true;
//download接口 } else {
let checkAll = operationData.hasAll(vm.formInline.organization) let downloadUrl = vm.timeInfoData.excelDownUrl;
let req = { setTimeout(() => {
projectId : vm.projectId, window.open(downloadUrl);
ids: operationData.getIds(vm.formInline,vm.organizationList,checkAll), }, 500);
type: operationData.getSearchType(vm.formInline,checkAll), }
originalFlag: vm.formInline.checked == false ? 0 : 1, },
projectName: vm.$route.query.projectName, exportHttp() {
cityName: vm.getCityName(), let req = vm.exportReq;
};
openLoading(vm); openLoading(vm);
vm.reportGET("report/downLoad/downLoad", req).then(res => { vm.POST("stats/export/current", req).then(res => {
closeLoading(vm); closeLoading(vm);
// console if(res.code == "000000") {
if (res.code == "000000") { vm.$router.push("export-download?projectId="+vm.projectId+'&listType=1');
} else {
vm.$message(res.message)
} }
vm.dialogVisible = false;
}); });
}, },
getCityName() { getCityName() {
...@@ -543,8 +734,6 @@ export default { ...@@ -543,8 +734,6 @@ export default {
}; };
vm.$router.push({ path: "export-download", query: routerData }); vm.$router.push({ path: "export-download", query: routerData });
}, },
update() {},
release() {},
setDialogData() { setDialogData() {
//传递给dialog数据 //传递给dialog数据
this.dialogData.organization = ""; this.dialogData.organization = "";
...@@ -570,13 +759,61 @@ export default { ...@@ -570,13 +759,61 @@ export default {
this.$nextTick(function() { this.$nextTick(function() {
this.$refs.childAlignment.$emit("search"); this.$refs.childAlignment.$emit("search");
}); });
},
exportPDF() {
openLoading(vm);
let tabsList = vm.$refs.tabs.$children;
for(let i= 1;i<tabsList.length;i++) {
tabsList[i].$el.style.display = 'block';
}
let element = '';
element = document.querySelector('.item-list-tabs .el-tabs__content');
console.log(element);
if(element == null) {
return
}
setTimeout(() => {
html2Canvas(element).then(function(canvas) {
let contentWidth = canvas.width;
let contentHeight = canvas.height;
//一页pdf显示html页面生成的canvas高度;
let pageHeight = contentWidth / 592.28 * 841.89;
//未生成pdf的html页面高度
let leftHeight = contentHeight;
//页面偏移
let position = 0;
//a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
let imgWidth = 595.28;
let imgHeight = 592.28 / contentWidth * contentHeight;
let pageData = canvas.toDataURL('image/jpeg', 1.0);
let pdf = new JsPDF('', 'pt', [contentWidth*0.8,contentHeight*0.8]);
pdf.addImage(pageData, 'JPEG', 0, position, contentWidth*0.8, contentHeight*0.8)
let title = "导出学情报告";
pdf.save(title + '.pdf');
for(let i= 1;i<tabsList.length;i++) {
let idStr = tabsList[i].$el.id;
console.log(idStr,vm.activeName);
if(idStr.indexOf(vm.activeName) == -1) {
tabsList[i].$el.style.display = 'none';
}
} }
closeLoading(vm);
});
}, 0);
},
} }
}; };
</script> </script>
<style lang="scss"> <style lang="scss">
.item-list-wrap { .item-list-wrap {
.component-content { .component-content {
// position: relative;
// background: #fff; // background: #fff;
padding: 10px; padding: 10px;
.header-title { .header-title {
...@@ -586,29 +823,82 @@ export default { ...@@ -586,29 +823,82 @@ export default {
border-bottom: 1px solid #efefef; border-bottom: 1px solid #efefef;
} }
.item-form { .item-form {
padding: 10px; position: relative;
// margin-bottom: 20px;
padding: 10px 0 10px 0;
background: #fff; background: #fff;
width:100%; width: 100%;
border-radius: 4px; border-radius: 4px 4px 0 0;
.form-p {
margin: 17px 0 0 30px;
line-height:20px;
font-size:14px;
color: #666666;
p {
margin-bottom: 12px;
.span-value {
margin-left: 20px;
}
}
}
.buttom-line {
margin: 30px auto 10px auto;
height: 1px;
background: #E4E7ED;
width: 94.66%
}
.form-title {
position: relative;
margin: 20px 0 24px 30px;
height: 25px;
font-size:18px;
font-weight:600;
line-height: 25px;
color: #000000;
}
.el-form-item {
margin-left: 25px;
}
.is-checked {
.el-checkbox__inner {
background-color: #449284;
border-color: #449284;
}
.el-checkbox__label {
color: #449284;
}
} }
.form-button { .form-button {
width: 45%; position: absolute;
top: -120px; width: 140px;
position: relative; top: 78px;
left: 50%; right: 10px;
.el-button--default{
border:1px solid #449284;
color: #449284;
}
}
.col-text {
font-size: 12px;
}
} }
.button-group { .button-group {
position: relative; position: relative;
// right: 100px; // right: 100px;
float: right; float: right;
margin-right: 20px; margin-right: 20px;
z-index: 999;
.el-button {
border:1px solid #449284;
color: #449284;
}
} }
.choose { .choose {
font-size: 12px; font-size: 12px;
margin-bottom: 20px; margin-bottom: 20px;
} }
.item-tab { .item-tab {
width: 95%; width: 100%;
height: 46px; height: 46px;
background: #F0F2F5; background: #F0F2F5;
position: absolute; position: absolute;
...@@ -617,17 +907,26 @@ export default { ...@@ -617,17 +907,26 @@ export default {
color: #409eff; color: #409eff;
} }
.el-tabs__header { .el-tabs__header {
width: 65%; width: 100%;
background: #fff;
margin-bottom: 20px;
.el-tabs__nav-scroll {
margin-left: 30px;
}
} }
.el-tabs__nav-wrap::after { .el-tabs__nav-wrap::after {
height: 0px; height: 0px;
} }
.tag-group { .tag-group {
margin-left: 78px; margin-left: 78px;
margin-bottom: 20px;
.el-tag { .el-tag {
margin-right: 20px; margin-right: 20px;
} }
} }
.el-tabs__active-bar {
background-color: #449284;
}
} }
} }
</style> </style>
\ No newline at end of file
src/views/learning/name-list.vue
浏览文件 @ e6145256
...@@ -31,8 +31,8 @@ ...@@ -31,8 +31,8 @@
<el-option <el-option
v-for="(item,index) in rankList" v-for="(item,index) in rankList"
:key="index" :key="index"
:label="item.gradeName" :label="item.label"
:value="item.gradeFlag" :value="item.value"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
...@@ -46,25 +46,29 @@ ...@@ -46,25 +46,29 @@
</div> </div>
<el-table :data="tableData" class="course-table"> <el-table :data="tableData" class="course-table">
<el-table-column prop="doctorName" label="姓名" align="center"></el-table-column> <el-table-column prop="doctorName" label="姓名" align="center"></el-table-column>
<el-table-column prop="sex" label="性别" align="center"></el-table-column> <el-table-column prop="sex" label="性别" align="center">
<template slot-scope="scope">
<span>{{ scope.row.sex | sexValue}}</span>
</template>
</el-table-column>
<el-table-column prop="age" label="年龄" align="center"></el-table-column> <el-table-column prop="age" label="年龄" align="center"></el-table-column>
<el-table-column prop="titleName" label="职称" align="center"></el-table-column> <el-table-column prop="titleName" label="职称" align="center"></el-table-column>
<el-table-column prop="hospitalName" label="机构" align="center"></el-table-column> <el-table-column prop="hospitalName" label="机构" align="center"></el-table-column>
<el-table-column prop="addressName" label="地区" align="center"></el-table-column> <el-table-column prop="addressName" label="地区" align="center"></el-table-column>
<el-table-column v-if="tableType == 1" prop="learnStatus" label="参与课程状态" align="center"> <el-table-column v-if="tableType == 1" prop="finishFlag" label="参与课程状态" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.row.learnStatus }}</span> <span>{{ scope.row.finishFlag | finishFlagType }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
v-if="tableType == 1" v-if="tableType == 1"
prop="finishedTime" prop="finishTime"
label="完成培训日期" label="完成培训日期"
align="center" align="center"
min-width="150" min-width="150"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.row.finishedTime }}</span> <span>{{ scope.row.finishTime }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
...@@ -102,7 +106,7 @@ ...@@ -102,7 +106,7 @@
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="formData.pageNo" :current-page="formData.pageNo"
:page-sizes="[20, 50 ,100]" :page-sizes="[20, 50 ,100, 200]"
:page-size="formData.pageSize" :page-size="formData.pageSize"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="totalRows" :total="totalRows"
...@@ -159,15 +163,49 @@ export default { ...@@ -159,15 +163,49 @@ export default {
}, },
{ {
value: 1, value: 1,
label: "参与中" label: "未完成"
}, },
{ {
value: 2, value: 2,
label: "已完成" label: "已完成"
} }
], ],
rankList: [], rankList: [
queryData: {} {
value: -1,
label: "全部"
},
{
value: 0,
label: "无成绩"
},
{
value: 1,
label: "优秀"
},
{
value: 2,
label: "良好"
},
{
value: 3,
label: "及格"
},
{
value: 4,
label: "不及格"
},
{
value: 5,
label: "通过"
},
{
value: 6,
label: "不通过"
},
],
queryData: {},
base: null,
}; };
}, },
// computed: { // computed: {
...@@ -177,6 +215,7 @@ export default { ...@@ -177,6 +215,7 @@ export default {
// }, // },
created() { created() {
vm = this; vm = this;
vm.base = vm.getUrlSearch(window.location.href, "base");
vm.getInitData(); vm.getInitData();
vm.search(); vm.search();
}, },
...@@ -200,9 +239,9 @@ export default { ...@@ -200,9 +239,9 @@ export default {
vm.curmbThird = vm.getUrlSearch(window.location.href, "projectName"); vm.curmbThird = vm.getUrlSearch(window.location.href, "projectName");
vm.jumPathFouth = '/item-list?id=' + vm.queryData.projectId + '&projectName=' + vm.queryData.projectName; vm.jumPathFouth = '/item-list?id=' + vm.queryData.projectId + '&projectName=' + vm.queryData.projectName;
console.log("queryData", vm.queryData); console.log("queryData", vm.queryData);
if(vm.queryData.type == 4) { // if(vm.queryData.hospitalIdList.length > 0) {
vm.getHostital(); // vm.getHostital();
} // }
}, },
searchData() { searchData() {
vm.formData.pageNo = 1; vm.formData.pageNo = 1;
...@@ -216,18 +255,27 @@ export default { ...@@ -216,18 +255,27 @@ export default {
// console.log('this.tableType',this.tableType) // console.log('this.tableType',this.tableType)
let req = { let req = {
projectId: query.projectId, projectId: query.projectId,
beginDate: query.beginDate,
endDate: query.endDate,
hospitalIdList: operationData.getHospitalIdList(query.hospitalIdList),
originalFlag: query.originalFlag, originalFlag: query.originalFlag,
ids: query.ids, regionId: query.regionId,
type: query.type, timeFlag: query.timeFlag,
courseId: query.courseId, courseId: query.courseId,
learnFlag: vm.formData.learnFlag, type: vm.formData.learnFlag,
doctorName: vm.formData.doctorName, name: vm.formData.doctorName,
pageNo: vm.formData.pageNo, pageNo: vm.formData.pageNo,
pageSize: vm.formData.pageSize, pageSize: vm.formData.pageSize,
}; };
console.log("course req", req); let reqUrl = '';
if(vm.base == null) {
reqUrl = 'stats/report/courseDetail';
} else {
reqUrl = 'stats/export/time/info/course';
}
console.log("course req", req , reqUrl);
openLoading(vm); openLoading(vm);
vm.reportGET("report/portalProjectCourse/getUserList", req).then(res => { vm.POST(reqUrl, req).then(res => {
closeLoading(vm); closeLoading(vm);
if (res.code == "000000") { if (res.code == "000000") {
if(res.data.totalCount == 0 ) { if(res.data.totalCount == 0 ) {
...@@ -242,28 +290,29 @@ export default { ...@@ -242,28 +290,29 @@ export default {
} else if (this.tableType == 2) { } else if (this.tableType == 2) {
vm.curmbFouth = "考试培训情况"; vm.curmbFouth = "考试培训情况";
//考试分析 //考试分析
let reqRank = {
projectId: query.projectId,
}
vm.reportGET("report/portalProjectExam/getGradeList", reqRank).then(res => {
if (res.code == "000000") {
vm.rankList = operationData.initRank(res.data.list);
}
});
let req = { let req = {
projectId: query.projectId, projectId: query.projectId,
beginDate: query.beginDate,
endDate: query.endDate,
hospitalIdList: operationData.getHospitalIdList(query.hospitalIdList),
originalFlag: query.originalFlag, originalFlag: query.originalFlag,
ids: query.ids, regionId: query.regionId,
type: query.type, timeFlag: query.timeFlag,
examId: query.examId, examId: query.examId,
gradeFlag: vm.formData.gradeFlag, gradeFlag: vm.formData.gradeFlag,
doctorName: vm.formData.doctorName, doctorName: vm.formData.doctorName,
pageNo: vm.formData.pageNo, pageNo: vm.formData.pageNo,
pageSize: vm.formData.pageSize, pageSize: vm.formData.pageSize,
}; };
console.log("exam req", req); let reqUrl = '';
if(vm.base == null) {
reqUrl = 'stats/report/getUserList';
} else {
reqUrl = 'stats/export/time/info/exam';
}
// console.log("exam req", req);
openLoading(vm); openLoading(vm);
vm.reportGET("report/portalProjectExam/getUserList", req).then(res => { vm.POST(reqUrl, req).then(res => {
closeLoading(vm); closeLoading(vm);
if (res.code == "000000") { if (res.code == "000000") {
if(res.data.totalCount == 0 ) { if(res.data.totalCount == 0 ) {
...@@ -275,6 +324,8 @@ export default { ...@@ -275,6 +324,8 @@ export default {
vm.$message(res.message); vm.$message(res.message);
} }
}); });
} }
}, },
resetForm() { resetForm() {
...@@ -293,6 +344,7 @@ export default { ...@@ -293,6 +344,7 @@ export default {
handleSizeChange(val) { handleSizeChange(val) {
console.log(`每页 ${val} 条`); console.log(`每页 ${val} 条`);
this.formData.pageSize = val; this.formData.pageSize = val;
this.formData.pageNo = 1;
this.search(); this.search();
}, },
handleCurrentChange(val) { handleCurrentChange(val) {
......
src/views/learning/report-list.vue
浏览文件 @ e6145256
...@@ -65,7 +65,7 @@ ...@@ -65,7 +65,7 @@
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="formData.pageNo" :current-page="formData.pageNo"
:page-sizes="[20, 50 ,100]" :page-sizes="[20, 50 ,100, 200]"
:page-size="formData.pageSize" :page-size="formData.pageSize"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="totalRows" :total="totalRows"
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或