提交 c63ea58d 编写于 作者: guangjun.yang's avatar guangjun.yang

删除之前的代码

上级 7627ae0d
<template>
<div class="data-alignment">
<div class="alignment-header">
<el-row>
<el-col :span="18">
<div class="title">数据调整</div>
</el-col>
<el-col :span="3">
<el-button class="add-button" size="small" type="primary" @click="saveUpdate">保存修改</el-button>
</el-col>
<el-col :span="3">
<el-button class="add-button" size="small" @click="close">取消</el-button>
</el-col>
</el-row>
</div>
<div class="text">
<p>地区:{{ dialogData.region }}</p>
<p>选择机构:{{ dialogData.organization }}</p>
</div>
<el-form
class="form-update"
ref="serchForm"
:model="formData"
label-width="100px"
style="width:40%;"
>
<el-form-item label="项目成绩:">
<el-select
v-model="formData.achievementStatus"
size="small"
style="width: 100%;"
placeholder="请选择项目成绩"
>
<el-option
v-for="(item,index) in achievementList"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="统计状态:">
<el-select
v-model="formData.status"
size="small"
style="width: 100%;"
placeholder="请选择统计状态"
>
<el-option
v-for="(item,index) in statusList"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="姓名:">
<el-input v-model="formData.doctorName" placeholder="请输入人员名称"></el-input>
</el-form-item>
</el-form>
<div class="form-button">
<el-button @click="searchData()" type="primary">查询</el-button>
<el-button @click="resetForm()">重置</el-button>
</div>
<!-- <div class="line"></div> -->
<p class="explain">说明:只有被勾选中的人才会归入数据统计范围,不勾的不会统计</p>
<el-table
class="data-main"
border
center
ref="multipleTable"
:data="tableData"
tooltip-effect="dark"
@selection-change="handleSelectionChange"
:row-key="getRowKeys"
>
<el-table-column type="selection" width="55" :reserve-selection="true"></el-table-column>
<el-table-column prop="name" label="姓名" min-width="80"></el-table-column>
<el-table-column prop="projectStatus" label="项目状态" width="120">
<template slot-scope="scope">{{ scope.row.projectStatus | projectStatus }}</template>
</el-table-column>
<el-table-column prop="projectResult" label="项目成绩" width="120">
<template slot-scope="scope">{{ scope.row.projectResult | recordValue }}</template>
</el-table-column>
<el-table-column prop="hospitalName" label="机构" min-width="120" show-overflow-tooltip></el-table-column>
<el-table-column prop="departmentName" label="科室" show-overflow-tooltip></el-table-column>
<el-table-column prop="provinceName" label="省/直辖市" show-overflow-tooltip></el-table-column>
<el-table-column prop="cityName" label="市" show-overflow-tooltip></el-table-column>
<el-table-column prop="countyName" label="区/县" show-overflow-tooltip></el-table-column>
<el-table-column prop="townName" label="乡镇/街道" show-overflow-tooltip></el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png" />
<p>没有相关数据,请重新选择查询范围</p>
</div>
</div>
</el-table>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="formData.pageNo"
:page-sizes="[20, 50 ,100, 200]"
:page-size="formData.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
<el-dialog title="发布学情报告" :visible.sync="dialogVisible" width="30%" append-to-body>
<p style="color:red">项目【{{ projectName }}】的数据修改</p>
<p>确认需要更新学情报告吗?</p>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="updateData()">确定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { openLoading, closeLoading } from "../../utils/utils";
import * as operationData from "../../utils/operation";
let vm;
export default {
props: {
formInline: {
type: Object
},
organizationList: {
type: Array
},
dialogData: {
type: Object
}
},
data() {
return {
formData: {
achievementStatus: "",
status: 1,
doctorName: '',
pageNo: 1,
pageSize: 20,
},
achievementList: [
//项目状态
{
label: "全部",
value: '',
},
{
label: "通过",
value: 1
},
{
label: "不通过",
value: 2
},
{
label: "无成绩",
value: 3
}
],
statusList: [
//项目状态
{
label: "全部",
value: 1
},
{
label: "归入统计",
value: 2
},
{
label: "移除统计",
value: 3
},
],
tableData: [],
multipleSelection: [], //被选中的行
totalRows: 0, //数据总数
getRowKeys(row) {
return row.doctorId;
},
selectedData: [],
dialogVisible: false,
projectId: "",
projectName: "",
changedDoctor: [],
changedDoctor2: [],
lookedDoctor: [],
};
},
created() {
vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "id");
this.projectName = vm.getUrlSearch(window.location.href, "projectName");
// this.search();
console.log(vm.dialogData);
},
mounted: function() {
//父组件传值
this.$on("search", () => {
// this.lookedDoctor = [];
// this.changedDoctor = [];
// this.changedDoctor2 = [];
// this.$refs.multipleTable.clearSelection();
this.resetForm();
// this.search();
});
},
methods: {
// 将选中行放入数组
handleSelectionChange(rows) {
this.changedDoctor = [];
this.changedDoctor2 = [];
this.selectedData = [];
if (rows) {
rows.forEach(row => {
if (row) {
this.changedDoctor.push(row.doctorId);
}
});
}
this.changedDoctor2 = operationData.getDifference(
this.lookedDoctor,
this.changedDoctor
);
console.log(
"选",
this.changedDoctor,
"没",
this.changedDoctor2
);
},
// 更改数据显示数量
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
vm.formData.pageSize = val;
vm.formData.pageNo = 1;
vm.search();
},
// 换页
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
vm.formData.pageNo = val;
vm.search();
},
close() {
this.$emit("closeDialog");
},
searchData() {
vm.formData.pageNo = 1;
vm.search();
},
search() {
setTimeout(function(){
openLoading(vm);
},20);
let checkAll = operationData.hasAll(vm.formInline.organization);
let req = {
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,
status: vm.formData.status,
doctorName: vm.formData.doctorName,
pageNo: vm.formData.pageNo,
pageSize: vm.formData.pageSize,
};
vm.POST("stats/report/getProjectData", req).then(res => {
// closeLoading(vm);
if (res.code == "000000") {
vm.tableData = res.data.projectData;
vm.totalRows = res.data.count;
let idList = operationData.getDoctorIdList(vm.tableData);
// console.log('idList',idList);
vm.lookedDoctor = operationData.getUnion(
vm.lookedDoctor,
idList
);
vm.initDoctorChoose();
}
});
},
initDoctorChoose() {
let tableStatus = vm.tableData;
if(typeof tableStatus === 'undefined') {
return;
}
tableStatus.forEach(row => {
let idList = [];
idList[0] = row.doctorId;
let intersect = operationData.getIntersect(idList,this.changedDoctor);
let intersect2 = operationData.getIntersect(idList,this.changedDoctor2);
// console.log('intersect',intersect,'intersect2',intersect2);
//debugger;
if(intersect.length > 0) {
//选中
//this.$refs.multipleOrganization.toggleRowSelection(row);
} else if (intersect2.length > 0) {
//不选
} else {
if (row.status == 1) {
this.$nextTick(function() {
this.$refs.multipleTable.toggleRowSelection(row);
});
}
}
});
},
//重置
resetForm() {
this.lookedDoctor = [];
this.changedDoctor = [];
this.changedDoctor2 = [];
this.$refs.multipleTable.clearSelection();
vm.formData = Object.assign(
{},
{
achievementStatus: "",
status: 1,
doctorName: '',
pageNo: 1,
pageSize: 20,
}
);
vm.search();
},
saveUpdate() {
this.dialogVisible = true;
},
updateData() {
let req = {
projectId: vm.projectId,
removeDoctorIdList: operationData.getAjustmentList(vm.changedDoctor2),
joinDoctorIdList: operationData.getAjustmentList(vm.changedDoctor),
};
openLoading(vm);
vm.POST("stats/report/peopleAdjustment", req).then(res => {
closeLoading(vm);
vm.$message(res.message);
if (res.code == "000000") {
this.$emit("closeSearch");
}
});
this.dialogVisible = false;
}
}
};
</script>
<style lang='scss' rel='stylesheet/scss'>
.data-alignment {
background: #fff;
.alignment-header {
padding: 20px;
margin: 0 30px;
border-bottom: 1px solid #606266;
}
.text {
margin-top: 30px;
margin-left: 98px;
font-size: 13px;
color: #606266;
}
.form-update {
margin: 30px 0px 0px 60px;
}
.form-button {
width: 45%;
top: -62px;
position: relative;
left: 50%;
}
.line {
margin: -20px 30px 30px 30px;
width: 100%;
border-bottom: 1px solid #606266;
}
.explain {
margin: 10px 0 10px 38px;
font-size: 13px;
color: #606266;
}
.data-main {
margin-left: 36px;
width: 90%;
// padding: 0 40px;
.select {
margin-bottom: 30px;
}
}
.pagination {
margin-right: 10px;
}
}
</style>
<template>
<div class="export-download">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<div class="p-title">任务列表</div>
<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
prop="title"
label="名称"
align="center"
min-width="150"
show-overflow-tooltip
></el-table-column>
<el-table-column prop="time" label="时间" align="center" min-width="120">
<template slot-scope="scope">{{ scope.row.time }}</template>
</el-table-column>
<el-table-column prop="status" label="状态" align="left" min-width="30">
<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 label="操作" fixed="right" align="center" min-width="70">
<template slot-scope="scope">
<el-button
:disabled="scope.row.buttonStatus"
size="small"
type="text"
v-if="scope.row.status != 2"
@click="update(scope.row)"
>{{ scope.row.buttonText }}</el-button>
<div v-if="scope.row.status == 2">-</div>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png" />
<p>没有相关数据,请重新选择查询范围</p>
</div>
</div>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="param.pageNo"
:page-sizes="[20, 50 ,100 ,200]"
:page-size="param.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import * as commonUtil from "../../utils/utils";
import { openLoading, closeLoading } from "../../utils/utils";
import axios from "axios";
let vm = null;
export default {
components: {
BreadCrumb
},
data() {
return {
curmbFirst: "学情报告",
curmbSecond: "任务列表",
projectId: "",
tableData: [],
param: {
pageSize: 20,
pageNo: 1
},
totalRows: 0,
totalTime: 3,
queryData: {},
listType: "2"
// buttonText: "刷新",
// buttonStatus: false,
};
},
created() {
vm = this;
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();
},
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
handleClick(tab, event) {
vm.listType = tab.name;
vm.search()
},
setButton() {
for (let i = 0; i < vm.tableData.length; i++) {
vm.tableData[i].index = i;
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].buttonStatus = false;
} else if (vm.tableData[i].status == 0) {
vm.tableData[i].buttonText = "刷新";
vm.tableData[i].buttonStatus = false;
} else if (vm.tableData[i].status == 2) {
vm.tableData[i].buttonText = "刷新";
vm.tableData[i].buttonStatus = true;
}
}
},
search() {
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: ""
};
vm.GET("stats/mission/missionlist", reqList).then(res => {
if (res.code == "000000") {
vm.tableData = res.data.list;
vm.totalRows = res.data.totalSize;
vm.setButton();
}
});
},
getDownLoadStatus(row) {
// 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
};
vm.GET("stats/mission/missionlist", reqList).then(res => {
if (res.code == "000000") {
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);
if (updateStatus == 1) {
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].fileUrl = res.data.list[0].url;
} else if (updateStatus == 0) {
vm.tableData[row.index].title = vm.tableData[row.index].title + " ";
vm.tableData[row.index].buttonText = "刷新";
} else if (updateStatus == 2) {
vm.tableData[row.index].title = vm.tableData[row.index].title + " ";
vm.tableData[row.index].buttonText = "刷新";
vm.tableData[row.index].buttonStatus = true;
}
} else {
vm.$message(res.message);
vm.tableData[row.index].title = vm.tableData[row.index].title + " ";
vm.tableData[row.index].buttonText = "刷新";
}
});
},
downLoad(row) {
setTimeout(() => {
window.open(row.fileUrl);
}, 500);
},
exportTime(row) {
vm.$router.push("item-list-old?downloadId="+row.id);
},
update(row) {
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);
}
} else {
this.$nextTick(function() {
console.log(vm.tableData[row.index]);
let nowTime = vm.totalTime;
vm.tableData[row.index].title = vm.tableData[row.index].title + " ";
vm.tableData[row.index].buttonText = nowTime + "s后可以刷新";
vm.tableData[row.index].buttonStatus = true;
let clock = window.setInterval(() => {
nowTime--;
vm.tableData[row.index].title = vm.tableData[row.index].title + " ";
vm.tableData[row.index].buttonText = nowTime + "s后可以刷新";
if (nowTime <= 0) {
window.clearInterval(clock);
vm.tableData[row.index].title =
vm.tableData[row.index].title + " ";
// vm.tableData[row.index].buttonText = "刷新";
vm.tableData[row.index].buttonStatus = false; //这里重新开启
vm.getDownLoadStatus(row);
}
}, 1000);
});
}
},
// 更改数据显示数量
handleSizeChange(val) {
vm.param.pageSize = val;
vm.param.pageNo = 1;
vm.search();
},
// 换页
handleCurrentChange(val) {
vm.param.pageNo = val;
vm.search();
}
}
};
</script>
<style lang="scss">
.export-download {
.component-content {
background: #fff;
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>
\ No newline at end of file
<template>
<div class="course-analysis-wrap">
<div class="box-list">
<div v-for="(item , index) in cardData" :key="index" class="box-card" v-bind:class="{ 'box-last': index == 2 }">
<!-- <el-card class="box-card" v-bind:class="{ 'box-last': index == 2 }"> -->
<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 v-if="downloadId == null">
<el-table :data="tableData" 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 prop="averageTime" label="人均学习时长" align="center">
<template slot-scope="scope">{{ scope.row.averageTime | getAvgTime }}</template>
</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">
<template slot-scope="scope">
<el-button class="button-jump" @click="goPage(scope.row)" type="text" size="small">查看名单</el-button>
</template>
</el-table-column>
<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 prop="averageTime" label="人均学习时长" align="center">
<template slot-scope="scope">{{ scope.row.averageTime | getAvgTime }}</template>
</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">
<template slot-scope="scope">
<el-button class="button-jump" @click="goPage(scope.row)" type="text" size="small">查看名单</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png" />
<p>没有相关数据,请重新选择查询范围</p>
</div>
</div>
</el-table>
</div>
<div class="pagination">
<el-pagination
class="pagination"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="[20, 50 ,100, 200]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</template>
<script>
import { create } from "domain";
import * as operationData from "../../utils/operation";
import { openLoading, closeLoading } from "../../utils/utils";
let vm = null;
export default {
props: {
formInline: {
type: Object
},
activeName: {
type: String
},
dialogData: {
type: Object
},
organizationList: {
type: Array
},
timeInfoData: {
type: Object
},
},
data() {
return {
cardData: [],
tableData: [],
totalRows: 0,
projectId: "",
pageNo: 1,
pageSize: 20,
timeInfoChild: {},
downloadId: null,
};
},
watch: {
timeInfoData: {
deep: true,
handler(nv, ov) {
vm.timeInfoChild = nv;
}
}
},
created() {
vm = this;
vm.projectId = vm.getUrlSearch(window.location.href, "id");
vm.downloadId = vm.getUrlSearch(window.location.href, "downloadId");
},
mounted: function() {
this.$on("search", () => {
// console.log(this.formInline);
this.pageNo = 1;
this.search();
});
this.$on("init", () => {
this.$nextTick(function() {
if (vm.formInline.region.length != 0) {
this.search();
}
});
});
this.$on("reset", () => {
this.pageNo = 1;
this.pageSize = 20;
this.tableData = [];
this.cardData = [];
});
this.$on("static", () => {
vm.getStatic();
});
},
methods: {
getStatic() {
// console.log(vm.timeInfoChild);
let courseAnalysisModel = vm.timeInfoChild.courseAnalysisModel;
vm.setCardData(courseAnalysisModel);
vm.tableData = courseAnalysisModel.pCourseList;
vm.totalRows = courseAnalysisModel.totalSize;
},
setCardData(data) {
vm.totalRows = data.projectCourseCount;
let cardData = [
{
title: "项目所有课程数",
value: "0门"
},
{
title: "项目所有课程总时长",
value: "0分钟"
},
{
title: "项目人均学习时长",
value: "0分钟"
}
];
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(type) {
// 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 = {
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.pageNo,
pageSize: vm.pageSize,
};
// console.log("3 req", req);
openLoading(vm);
vm.POST("stats/report/course", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
if (type !== 2) {
vm.setCardData(res.data);
}
vm.tableData = res.data.pCourseList;
vm.totalRows = res.data.totalSize;
} else {
// vm.$message(res.message);
}
});
},
goPage(data) {
let routerData = {};
if(vm.downloadId == null) {
// console.log("dialogData", this.dialogData);
routerData = this.dialogData;
routerData.projectId = vm.projectId;
routerData.projectName = vm.getUrlSearch(
window.location.href,
"projectName"
);
routerData.tableType = 1;
routerData.courseId = data.courseId;
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 = 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});
let routeData = this.$router.resolve({
path: "/name-list-old",
query: routerData
});
window.open(routeData.href, "_blank");
},
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
vm.pageSize = val;
vm.pageNo = 1;
if(vm.downloadId == null) {
vm.search();
}
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
vm.pageNo = val;
if(vm.downloadId == null) {
vm.search();
}
}
}
};
</script>
<style lang="scss">
.course-analysis-wrap {
background: #fff;
overflow: hidden;
.spacing {
position: relative;
width: 100%;
height: 20px;
background: #f0f2f5;
}
.chart-title {
position: relative;
margin-top: 17px;
margin-left: 30px;
width: 100%;
height: 60px;
font-size: 18px;
font-weight: 600;
line-height: 60px;
color: #000000;
}
.box-list {
position: relative;
height: 120px;
background: #f0f2f5;
.box-card {
position: relative;
background-color: #ffffff;
width: 32%;
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%;
}
}
.course-table {
top: 20px;
padding: 0;
width: 95%;
margin:0 auto 20px auto;
.button-jump {
color: #449284;
}
}
.pagination {
margin-top: 30px;
margin-right: 13px;
}
}
</style>
\ No newline at end of file
<template>
<div class="crowd-analysis-wrap">
<el-radio-group class="crowd-radio" v-model="radio" size="small" @change="updateRadio">
<el-radio-button label="0">全部人员</el-radio-button>
<el-radio-button label="1">参与项目</el-radio-button>
<el-radio-button label="2">通过项目</el-radio-button>
</el-radio-group>
<div v-show="!showData" class="empty">
<p>"没有相关数据,请重新选择查询范围"</p>
</div>
<div class="chart" v-show="showData">
<div class="item" id="education" ref="education"></div>
<div class="item item-right" id="job" ref="job"></div>
</div>
<div class="chart" v-show="showData">
<div class="item">
<div class="title">人员性别分布</div>
<div class="sex">
<div class="sex-item" v-for="(item , index) in sexData" :key="index">
<!-- <img class="sex-img" v-bind:src="item.src" /> -->
<!-- <el-progress class="sex-img" :color="item.color" :stroke-width=12 type="circle" :percentage="item.rate"></el-progress> -->
<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-type">{{ item.type }}</p>
</div>
</div>
</div>
<div class="item item-right" id="age" ref="age"></div>
</div>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import { create } from "domain";
import { mapGetters } from "vuex";
import { openLoading, closeLoading } 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 { setTimeout } from "timers";
let vm = null;
export default {
components: {
BreadCrumb
},
props: {
formInline: {
type: Object
},
activeName: {
type: String
},
organizationList: {
type: Array
},
timeInfoData: {
type: Object
},
},
data() {
return {
radio: 0,
sexData: [
{
color: '#1890FF',
type: "男性",
num: 0,
rate: 0,
},
{
color: '#FB5B52',
type: "女性",
num: 0,
rate: 0,
},
{
color: '#5D7092',
type: "未完善信息",
num: 0,
rate: 0,
}
],
projectId: "",
crowdData: {},
showData: true,
echartsData: {
chart1: {},
chart2: {},
chart3: {},
},
downloadId: null,
timeInfoChild: {},
};
},
watch: {
timeInfoData: {
deep: true,
handler(nv, ov) {
vm.timeInfoChild = nv;
}
}
},
created() {
vm = this;
vm.projectId = vm.getUrlSearch(window.location.href, "id");
vm.downloadId = vm.getUrlSearch(window.location.href, "downloadId");
},
mounted: function() {
// commonUtil.resizeHeight();
//父组件传值
this.$on("search", () => {
vm.radio = 0;
this.search();
});
this.$on("init", () => {
this.$nextTick(function() {
if (vm.formInline.region.length != 0) {
this.search();
}
});
});
this.$on("reset", () => {
this.showData = false;
this.crowdData = {};
});
this.$on("static", () => {
vm.getStatic();
});
},
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() {
let checkAll = operationData.hasAll(vm.formInline.organization);
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
};
// console.log("2 req", req);
openLoading(vm);
vm.POST("stats/report/userAnalysis_pc/"+vm.radio, req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
// if(res.data.educationList.length == 0 && res.data.jobTitle.length == 0 ) {
// vm.$message("没有相关数据,请重新选择查询范围");
// this.showData = false;
// } else {
// this.showData = true;
// }
this.crowdData = res.data;
setTimeout(function() {
vm.educationDivision(res.data.eduList);
vm.jobDivision(res.data.titleList);
vm.getSexData(res.data.sexList);
vm.ageDivision(res.data.ageList);
},20);
} else {
vm.$message(res.message);
}
});
},
updateResize() {
this.$nextTick(function() {
window.onresize = function() {
vm.echartsData.chart1.resize();
vm.echartsData.chart2.resize();
vm.echartsData.chart3.resize();
};
});
},
updateRadio(value) {
if(vm.downloadId == null) {
console.log(value,vm.radio);
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(data) {
let sexList = data;
let sexData = [
{
color: '#1890FF',
type: "男性",
num: 0,
rate: 0,
},
{
color: '#FB5B52',
type: "女性",
num: 0,
rate: 0,
},
{
color: '#5D7092',
type: "未完善信息",
num: 0,
rate: 0,
}
];
let sum = 0;
if(sexList.length > 0) {
for(let i = 0 ; i<sexList.length; i++) {
sum += sexList[i].value;
// sexData[i].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) {
// console.log('this.$refs.education',this.$refs.education)
let myChart = echarts.init(this.$refs.education);
let educationList = data;
let legendData = [];
let seriesData = [];
let colorData = ["#7453FF", "#3BA0FF", "#5D7092", "#39AF9A", "#FFBC3D", "#FF9A4B", "#8A2BE2"];
for (let i = 0; i < educationList.length; i++) {
legendData[i] = educationList[i].name;
seriesData[i] = educationList[i];
}
let option = operationData.getPicOption(
"人员学历发布",
legendData,
colorData,
seriesData
);
myChart.setOption(option);
vm.echartsData.chart1 = myChart;
vm.updateResize();
},
jobDivision(data) {
let myChart2 = echarts.init(this.$refs.job);
let titleList = data;
let legendData = [];
let seriesData = [];
let colorData = ["#3BA0FF", "#366BCB", "#39AF9A", "#FFBC3D", "#FFBC3D", "#67E0E3", "#8A2BE2"];
for (let i = 0; i < titleList.length; i++) {
legendData[i] = titleList[i].name;
seriesData[i] = titleList[i];
}
let option = operationData.getPicOption(
"人员职务分布",
legendData,
colorData,
seriesData
);
myChart2.setOption(option);
vm.echartsData.chart2 = myChart2;
vm.updateResize();
},
ageDivision(data) {
let myChart3 = echarts.init(this.$refs.age);
let xAxisData = [];
let seriesData = [];
let ageList = data;
for (let i = 0; i < ageList.length; i++) {
// xAxisData[i] = ageList[i].name;
if(ageList[i].value != 0) {
xAxisData.push(ageList[i].name);
}
}
for (let i = 0; i < ageList.length; i++) {
// seriesData[i] = ageList[i].value;
if(ageList[i].value != 0) {
seriesData.push(ageList[i].value);
}
}
let option = operationData.getBarOption(xAxisData, seriesData);
myChart3.setOption(option);
vm.echartsData.chart3 = myChart3;
vm.updateResize();
}
}
};
</script>
<style lang="scss">
.crowd-analysis-wrap {
// background: #fff;
overflow: hidden;
// padding: 10px;
.header-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.crowd-radio {
position: relative;
left: 50%;
margin-top: 25px;
margin-left: -119px;
.is-active {
.el-radio-button__inner {
// background: #fff;
// color: #409EFF;
}
}
}
.empty {
height: 300px;
line-height: 300px;
color: #FF3399;
text-align: center;
}
.chart {
position: relative;
margin: 20px auto 0 auto;
width: 1124px;
overflow-x: hidden;
.item {
position: relative;
float: left;
margin-right: 20px;
padding: 0;
// width: 48%;
width: 552px;
height: 360px;
background: #ffffff;
// border: 1px solid #dedede;
.title {
position: relative;
margin-top: 20px;
margin-left: 20px;
font-size: 18px;
font-weight: bold;
}
.sex {
position: relative;
top: 42px;
left: 0;
.sex-item {
float: left;
width: 184px;
.sex-img {
margin: 0 auto;
position: relative;
// left: 16%;
height: 125px;
width: 125px;
}
.sex-num {
margin-top: 18px;
height:24px;
line-height:24px;
font-size:24px;
font-weight:600;
text-align: center;
}
.sex-type {
margin-top: 8px;
height:14px;
font-size:14px;
color: #999999;
text-align: center;
}
}
}
}
.item-right {
margin-right: 0;
}
}
}
</style>
\ No newline at end of file
<template>
<div class="data-all-wrap">
<div v-if="dataType == 0" class="data-chart">
<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" v-bind:class="{ 'box-last': index == 2 }">
<el-tooltip v-if="index == 2" class="item-tool" placement="bottom-end" effect="light">
<div slot="content">
<p v-for="text in item.content">{{ text }}</p>
</div>
<i class="el-icon-question notice"></i>
</el-tooltip>
<div class="left-content">
<p class="title">{{ item.title }}</p>
<p class="value">{{ item.value }}</p>
</div>
<div class="vertical"></div>
<div class="right-content">
<p class="has">{{ item.hasKey }}:{{ item.hasNum }}</p>
<p class="should">{{ item.shouldKey }}:{{ item.shouldNum }}</p>
</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-distributeChart">
<div class="distributeChart" id="distributeChart" ref="distributeChart"></div>
<div class="data-text">
<div class="content-text">
<p v-for="item in distributeList" >{{item.label}}{{item.value}}</p>
</div>
</div>
</div>
</div>
<div class="spacing"></div>
<div class="chart-title">证书级别按学历发布情况</div>
<div class="chart-recordChart">
<div class="recordChart" id="recordChart" ref="recordChart"></div>
<div class="data-text">
<div class="content-text">
<p v-for="item in recordList" >{{item.label}}{{item.value}}</p>
</div>
</div>
</div>
<div v-if="certFlag != 0">
<div class="spacing"></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">按获证人数排名</el-radio-button>
<el-radio-button label="2">按获证比例排名</el-radio-button>
<el-radio-button label="3">按参与人数排名</el-radio-button>
</el-radio-group>
</div>
<div class="chartCert" id="certificateChart" ref="certificateChart"></div>
<div class="spacing"></div>
<div class="chart-title">在线培训完成时长情况</div>
<div class="chartDuration" id="durationChart" ref="durationChart"></div>
<div class="chart-remarks">注:在线培训完成时长=完成项目时间-开始参与项目时间</div>
</div>
</div>
<div v-if="dataType == 1" class="data-table">
<div class="box-list">
<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" v-bind:class="{ 'box-last': index == 1 }"> -->
<el-tooltip v-if="index == 1" class="item-tool" placement="bottom-end" effect="light">
<div slot="content">
<p v-for="text in item.content">{{ text }}</p>
</div>
<i class="el-icon-question notice"></i>
</el-tooltip>
<div class="left-content">
<p class="title">{{ item.title }}</p>
<p class="value">{{ item.value }}</p>
</div>
<div class="vertical"></div>
<div class="right-content">
<p class="has">{{ item.hasKey }}:{{ item.hasNum }}</p>
<p class="should">{{ item.shouldKey }}:{{ item.shouldNum }}</p>
</div>
<!-- </el-card> -->
</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-title">项目人员情况</div>
<el-tabs v-if="downloadId == null" class="tabs-person" v-model="tableType" type="card" @tab-click="handlePerson">
<el-tab-pane label="已获证" name="1"></el-tab-pane>
<el-tab-pane label="未获证" name="2"></el-tab-pane>
<el-tab-pane label="未参与" name="3"></el-tab-pane>
</el-tabs>
<el-table :data="tableData" class="person-table">
<el-table-column v-if="tableType == '1'" prop="rankNo" 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">
<template slot-scope="scope">
<span>{{ scope.row.sex | sexValue}}</span>
</template>
</el-table-column>
<el-table-column prop="departmentName" label="科室" align="center"></el-table-column>
<el-table-column prop="joinFlag" label="是否参与项目" align="center">
<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>
<div class="chart-remarks">注:本报表数据来源仅包括有摸底考的课程培训。</div>
<div class="pagination">
<el-pagination
class="pagination"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="formTable.pageNo"
:page-sizes="[20, 30, 100 ,200]"
:page-size="formTable.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</div>
</div>
</template>
<script>
import { openLoading, closeLoading } 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 { setTimeout } from "timers";
let vm = null;
export default {
props: {
formInline: {
type: Object
},
activeName: {
type: String
},
organizationNum: {
type: Number
},
organizationList: {
type: Array
},
timeInfoData: {
type: Object
},
},
data() {
return {
roleType: "L1",
projectId: "",
dataType: 0,
tableType: "1",
echartsData: {
chart0: {},
chart1: {},
chart2: {},
chart3: {}
},
distributeList: [],
recordList: [],
cardData: [],
rankType: "1",
rankOptions: [
{
value: 1,
label: "按获证比例排名"
},
{
value: 2,
label: "按参与人数排名"
}
],
tableData: [],
tableDateTime: [],
totalRows: 0,
formDwmy: {
pageNo: 1,
pageSize: 20,
},
formTable: {
pageNo: 1,
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() {
vm = this;
vm.projectId = vm.getUrlSearch(window.location.href, "id");
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) {
//多个机构
setTimeout(function(){
vm.setRecordChart(vm.timeInfoChild.genSituationModel.eduData);
if(vm.certFlag !== 0) {
vm.setCertificateChart(vm.timeInfoChild.genSituationModel.studyRankMap[0]);
vm.setDurationChart(vm.timeInfoChild.genSituationModel.costRank);
}
},20)
} else {
//单个几个
let genSituationModel = vm.timeInfoChild.genSituationModel;
vm.totalRows = genSituationModel.personData.length;
vm.tableData = genSituationModel.personData;
}
},
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.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 = [
{
value: "0%",
title: "机构参与率",
hasKey: "已参与机构数",
hasNum: "0",
shouldKey: "应参与机构数",
shouldNum: "0",
content: [
"机构参与率:已参与机构数/应参与机构数*100% ",
"应参与机构数:筛选范围下,所有圈选机构数量,包含白名单反退出来的机构",
"已参与机构数:筛选范围下,在应参与机构中,机构学员有参与项目行为的机构数量"
]
},
{
value: "0%",
title: "人员参与率",
hasKey: "已参与人数",
hasNum: "0",
shouldKey: "应参与人数",
shouldNum: "0",
content: [
"人员参与率:已参与人数/应参与人数*100%",
"应参与人数:筛选范围下,所圈选人员数量",
"已参与人数:筛选范围下,在应参与人员中,有参与项目行为的人员数量"
]
},
{
value: "0%",
title: "获证率",
hasKey: "已获证人数",
hasNum: "0",
shouldKey: "应参与人数",
shouldNum: "0",
content: [
"获证率:已完成人数/应参与人数*100%",
"应参与人数:筛选范围下,所圈选人员数量",
"已获证人数:筛选范围下,在应参与人员中,已获证的人员数量"
]
}
];
if(data == null) {
//数据为空
if(vm.dataType == 0) {
vm.cardData = cardData;
} else if(vm.dataType == 1) {
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() {
// setTimeout(function() {
// window.onresize = function() {
// vm.echartsData.chart0.resize();
// vm.echartsData.chart1.resize();
// vm.echartsData.chart2.resize();
// vm.echartsData.chart3.resize();
// };
// },100);
},
setDistributeChart(data) {
let keyName = ['未获证人数','优秀人数','良好人数','及格人数','不及格人数'];
let keyName2 = ['未获证人数占比','优秀人数占比','良好人数占比','及格人数占比','不及格人数占比'];
let distributeList = [];
let legendData = [];
let seriesData = [];
for(let i = 0; i<data.length ; i++) {
let obj = {
label: keyName[data[i].certId],
value: data[i].doneCount,
};
distributeList.push(obj);
legendData.push(keyName2[data[i].certId])
let objSer = {
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);
vm.echartsData.chart0 = myChart;
vm.updateResize();
},
setRecordChart(data) {
let recordList = [
{
label: '博士后',
value: 0,
},
{
label: '博士',
value: 0,
},
{
label: '硕士',
value: 0,
},
{
label: '本科',
value: 0,
},
{
label: '大专',
value: 0,
},
{
label: '中专及以下',
value: 0,
},
{
label: '其他',
value: 0,
},
]
let keyName = ['未获证人数','获优秀人数','获良好人数','获及格人数','获不及格人数'];
let legendData = [];
let xAxisData = ["博士后","博士", "硕士", "本科", "大专", "中专及以下", "其他"];
for(let i = 0; i<data.length; i++) {
// console.log('data[i]',data[i].certList);
let certList = data[i].certList;
legendData.push(keyName[data[i].certId]);
for(let a = 0; a < certList.length ; a++) {
recordList[a].value += certList[a].value;
}
}
let seriesData = [];
let seriesArr = [];
let seriesName = [];
let index = 0;
for(let x = data.length - 1 ; x >= 0 ; x--) {
let certList = data[x].certList;
seriesArr[index] = [];
seriesName.push(keyName[data[x].certId]);
for(let y = 0; y < certList.length ; y++) {
seriesArr[index].push(certList[y].value);
}
index++;
}
for(let z = 0; z < seriesArr.length ; z++) {
let seriesObj = {
name: seriesName[z],
type: "bar",
stack: "总量",
barWidth: 18,
label: {
normal: {
show: true,
rotate: -90,
}
},
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);
vm.echartsData.chart1 = myChart;
vm.updateResize();
},
changeRank(value) {
if(vm.downloadId == null) {
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";
}
vm.POST("stats/report/studyRank/"+value, req).then(res => {
closeLoading(vm);
vm.setCertificateChart(res.data.studyRank);
});
} else {
let index = parseInt(value) - 1;
vm.setCertificateChart(vm.timeInfoChild.genSituationModel.studyRankMap[index]);
}
},
setCertificateChart(data) {
let xAxisData = [];
let seriesJoin = [];
let seriesCert = [];
let seriesRate = [];
for(let i = 0 ; i < data.length ; i++) {
xAxisData.push(data[i].subName);
seriesJoin.push(data[i].joinCount);
seriesCert.push(data[i].certCount);
seriesRate.push(data[i].certRate);
}
let myChart = echarts.init(this.$refs.certificateChart);
let option = chartData.certificateOption(xAxisData, seriesJoin, seriesCert, seriesRate);
myChart.setOption(option);
vm.echartsData.chart2 = myChart;
vm.updateResize();
},
setDurationChart(data) {
let xAxisData = [];
let seriesData = [];
for(let i = 0 ; i<data.length ; i++) {
xAxisData.push(data[i].subName);
seriesData.push(data[i].costTime);
}
let myChart = echarts.init(this.$refs.durationChart);
let option = chartData.durationOption(xAxisData, seriesData);
myChart.setOption(option);
vm.echartsData.chart3 = myChart;
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) {
console.log(`每页 ${val} 条`);
vm.formTable.pageSize = val;
vm.formTable.pageNo = 1;
vm.searchPerson(1);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
vm.formTable.pageNo = val;
vm.searchPerson(1);
},
}
};
</script>
<style lang="scss">
.el-tooltip__popper.is-light[x-placement^=bottom-end] {
width: 330px;
background-color: #449284;
border-color: #449284;
color: #ffffff;
.popper__arrow::after {
border-bottom-color: #449284;
}
.popper__arrow {
border-bottom-color: #449284;
}
}
.data-all-wrap {
background: #fff;
overflow: hidden;
// padding: 10px;
.box-list {
position: relative;
padding: 30px 30px 0 30px;
height: 136px;
// .box {
// height: 106px;
// }
.box-card {
position: relative;
background-color: #e3efed;
color: #449284;
width: 32%;
margin-right: 2%;
height: 106px;
float: left;
.notice {
position: absolute;
z-index: 999;
top: 21px;
right: 14px;
width: 16px;
height: 16px;
}
.el-card__header {
border-bottom-width: 0;
}
.el-card__body {
padding: 0px;
}
.left-content {
position: relative;
float: left;
width: 33%;
height: 106px;
text-align: left;
padding: 23px 0 0 20px;
.title {
font-size: 14px;
height: 14px;
line-height: 14px;
}
.value {
margin-top: 20px;
height: 22px;
font-size: 30px;
line-height: 22px;
font-weight: 500;
}
}
.vertical {
position: absolute;
left: 34%;
float: left;
margin-top: 23px;
width:1px;
height:57px;
background-color: #C1D8D4;
}
.right-content {
position: relative;
float: left;
width: 64%;
height: 106px;
text-align: left;
font-size: 14px;
padding: 23px 0 0 29px;
p {
height: 14px;
line-height: 14px;
}
.should {
margin-top: 28px;
}
}
}
.box-card2 {
width: 49%;
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;
}
}
.rank-radio {
position: relative;
}
.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 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;
margin: 20px auto 0 auto;
width: 1064px;
height: 380px;
}
.chart-distributeChart {
position: relative;
margin: 20px auto 0 auto;
// height: 320px;
width: 100%;
overflow-x: hidden;
.distributeChart {
position: relative;
// float: left;
margin: 0 auto;
// width: 70%;
width: 618px;
height: 320px;
}
.data-text {
position: absolute;
top: 0;
right: 0;
width: 30%;
height: 320px;
.content-text {
position: relative;
margin-top: 78px;
margin-left: 35%;
text-align: left;
p {
margin-top: 20px;
height:12px;
font-size:12px;
font-weight:400;
color:rgba(102,102,102,1);
line-height:12px;
}
}
}
}
.chart-recordChart {
position: relative;
margin: 20px auto 0 auto;
// height: 350px;
min-width: 1064px;
overflow-x: hidden;
.recordChart {
position: relative;
float: left;
// width: 83.5%;
width: 910px;
height: 416px;
}
.data-text {
position: relative;
float: left;
width: 120px;
height: 416px;
.content-text {
position: relative;
margin-top: 100px;
text-align: left;
p {
margin-top: 20px;
height:12px;
font-size:12px;
font-weight:400;
color:rgba(102,102,102,1);
line-height:12px;
}
}
}
}
.person {
position: relative;
margin-top: 20px;
width: 100%;
.tabs-person {
margin: 0 auto;
width: 95%;
.el-tabs__header {
margin-bottom: 0px;
}
.el-tabs__nav-scroll {
margin-left: 0px;
}
}
.person-title {
position: relative;
margin: 30px 0 25px 30px;
height: 25px;
font-size:18px;
font-weight:600;
line-height: 25px;
color: #000000;
}
.person-radio {
margin-top: 10px;
.el-radio-button {
.el-radio-button__inner {
border:0 solid #666666 !important;
box-shadow: 0;
}
}
.is-active {
border-radius: 10px 10px 0px 0px;
border-bottom: 2px solid #666666 !important;
.el-radio-button__inner{
border-radius:10px 10px 0px 0px;
background:#DFDFDF !important;
border:0 solid #666666 !important;
box-shadow: 0;
}
}
}
.person-table {
padding: 0;
width: 95%;
margin:0 auto 20px auto;
}
.pagination {
margin-top: 30px;
margin-right: 13px;
}
}
}
</style>
\ No newline at end of file
<template>
<div class="examination-analysis">
<div class="box-list">
<div v-for="(item , index) in cardData" :key="index" class="box-card" v-bind:class="{ 'box-last': index == 2 }">
<!-- <el-card class="box-card" v-bind:class="{ 'box-last': index == 2 }"> -->
<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="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 class="chart" id="examScore" ref="examScore"></div>
<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="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>
</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>
</div>
</div>
</el-table>
</div>
<div class="pagination">
<el-pagination
class="pagination"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="[20, 50 ,100, 200]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</template>
<script>
import { log } from "util";
import { openLoading, closeLoading } 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";
let vm;
export default {
props: {
formInline: {
type: Object
},
activeName: {
type: String
},
dialogData: {
type: Object
},
organizationList: {
type: Array
},
timeInfoData: {
type: Object
},
},
data() {
return {
projectId: "",
tableData: [],
cardData: [],
totalRows: 0, //数据总数
pageNo: 1, //当前是第几页
pageSize: 20, //页面总数
labelTd: [],
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() {
vm = this;
vm.projectId = vm.getUrlSearch(window.location.href, "id");
vm.downloadId = vm.getUrlSearch(window.location.href, "downloadId");
},
// 挂载到Dom完成时
mounted: function() {
this.$on("search", () => {
// console.log(this.formInline);
this.pageNo = 1;
this.search();
this.searchTable();
});
this.$on("init", () => {
this.$nextTick(function() {
if (vm.formInline.region.length != 0) {
this.search();
this.searchTable();
}
});
});
this.$on("reset", () => {
this.pageNo = 1;
this.pageSize = 20;
this.tableData = [];
this.cardData = [];
});
this.$on("static", () => {
vm.getStatic();
});
},
methods: {
// 搜索列表
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() {
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
};
// console.log("4 req", req);
openLoading(vm);
vm.POST("stats/report/exam", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.examData = res.data;
vm.setCardData(res.data);
vm.setExamTimes(res.data.examTimesList);
vm.setExamScore(res.data.examScoreList);
} else {
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;
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;
}
});
},
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) {
let routerData = {};
if(vm.downloadId == null) {
routerData = this.dialogData;
routerData.projectId = vm.projectId;
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.examId = data.examId;
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});
let routeData = this.$router.resolve({
path: "/name-list-old",
query: routerData
});
window.open(routeData.href, "_blank");
},
// 更改数据显示数量
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
vm.pageSize = val;
vm.pageNo = 1;
if(vm.downloadId == null) {
vm.searchTable();
}
},
// 换页
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
vm.pageNo = val;
if(vm.downloadId == null) {
vm.searchTable();
}
}
}
};
</script>
<style lang='scss' rel='stylesheet/scss'>
.examination-analysis {
background: #fff;
overflow: hidden;
.weight {
font-weight: bold;
}
.el-card {
border-width: 0px;
}
.el-card.is-always-shadow {
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.1);
}
.line {
background: #e4e4e4;
height: 80px;
width: 1px;
float: left;
margin-top: 20px;
}
.table {
margin-top: 30px;
}
.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: 32%;
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;
}
.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>
<template>
<div class="learning-effect">
<div class="box-list">
<div v-for="(item , index) in cardData" :key="index" class="box-card" v-bind:class="{ 'box-last': index == 1 }">
<!-- <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>
</template>
<script>
import { openLoading, closeLoading } 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";
let vm = null;
export default {
props: {
formInline: {
type: Object
},
activeName: {
type: String
},
timeInfoData: {
type: Object
},
},
data() {
return {
cardData: [],
echartsData: {
chart1: {},
chart2: {}
},
timeInfoChild: {},
};
},
watch: {
timeInfoData: {
deep: true,
handler(nv, ov) {
vm.timeInfoChild = nv;
}
}
},
created() {
vm = this;
vm.projectId = vm.getUrlSearch(window.location.href, "id");
},
mounted() {
commonUtil.resizeHeight();
this.$on("search", () => {
this.search();
});
this.$on("static", () => {
vm.getStatic();
});
},
methods: {
getStatic() {
let studyEffectDto = vm.timeInfoChild.studyEffectAnalysisModel.studyEffectDto;
vm.initCard(studyEffectDto);
vm.setEducation(studyEffectDto.educationEffectList);
vm.setLearning(studyEffectDto.knowledgeEffectList);
},
updateResize() {
this.$nextTick(function() {
window.onresize = function() {
vm.echartsData.chart1.resize();
vm.echartsData.chart2.resize();
};
});
},
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 = "000";
// }
// console.log("0 req", req);
vm.POST("stats/report/studyEffect", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.initCard(res.data);
setTimeout(function() {
vm.setEducation(res.data.educationEffectList);
vm.setLearning(res.data.knowledgeEffectList);
}, 20);
}
});
},
initCard(data) {
let cardData = [
{
value: "0%",
title: "培训前总正确率"
},
{
value: "0%",
title: "培训前后正确率"
}
];
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);
vm.echartsData.chart1 = myChart;
vm.updateResize();
},
setLearning(data) {
let myChart = echarts.init(this.$refs.learning);
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.knowledgeEffect(xAxisData, seriesBefore ,seriesAfter);
myChart.setOption(option);
vm.echartsData.chart2 = myChart;
vm.updateResize();
}
}
};
</script>
<style lang='scss' rel='stylesheet/scss'>
.learning-effect {
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>
<template>
<div class="item-list-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird" :jumPathThird="jumPathThird"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<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="选择地区:">
<!-- :props="props" -->
<el-col :span="12">
<el-cascader
size="small"
ref="cascaderRegion"
:options="optionsRegion"
:props="props"
v-model="formInline.region"
@change="handleChange"
filterable
change-on-select
placeholder="请先选择地区后再进行查询"
style="width:330px"
></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 label="选择机构:">
<el-select
size="small"
v-model="formInline.organization"
:placeholder="organizationNotice"
@change="changeOrganization"
multiple
collapse-tags
:disabled="areaLen < 3"
style="width:330px"
>
<el-option
v-for="item in organizationList"
:key="item.index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<div class="tag-group">
<el-tag
v-for="tag in tags"
:key="tag.value"
type="info"
closable
@close="handleTagClose(tag)"
>{{ tag.label }}</el-tag>
</div>
<el-form-item label="选择时间:">
<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>
<div class="buttom-line"></div>
<!-- <el-form-item label v-if="showOriginal !== 1">
<el-checkbox size="small" v-model="formInline.checked">查看原始数据</el-checkbox>
</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>
</el-form>
<div class="button-group">
<el-button v-if="roleType == 1 || roleType == 2" type="default" size="small" @click="changeDate">数据修改</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>
</div>
<div class="item-tab"></div>
<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="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
ref="childPart"
:formInline="formInline"
:activeName="activeName"
:organizationNum="organizationNum"
:organizationList="organizationList"
></part-in>
</el-tab-pane> -->
<el-tab-pane label="人群分析" name="second">
<crowd-analysis
ref="childCrowd"
:formInline="formInline"
:activeName="activeName"
:organizationList="organizationList"
:timeInfoData="timeInfoData"
></crowd-analysis>
</el-tab-pane>
<el-tab-pane label="课程分析" name="third" v-if="displayCourse == 1">
<course-analysis
ref="childCourse"
:formInline="formInline"
:activeName="activeName"
:dialogData="dialogData"
:organizationList="organizationList"
:timeInfoData="timeInfoData"
></course-analysis>
</el-tab-pane>
<el-tab-pane label="考试分析" name="fourth" v-if="displayExam == 1">
<examination-analysisfrom
ref="childExam"
:formInline="formInline"
:activeName="activeName"
:dialogData="dialogData"
:organizationList="organizationList"
:timeInfoData="timeInfoData"
></examination-analysisfrom>
</el-tab-pane>
<el-tab-pane label="学习效果分析" name="fifth" v-if="displayEffect == 1">
<learning-effect
ref="childEffect"
:formInline="formInline"
:activeName="activeName"
:timeInfoData="timeInfoData"
></learning-effect>
</el-tab-pane>
</el-tabs>
<el-dialog title="提示" :visible.sync="dialogVisible" width="30%" center>
<p style="text-align:center">由于导出数据较大,预估需要花费 5 小时左右。确定继续导出吗?</p>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取消</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>
</el-dialog>
<el-dialog title :visible.sync="dialogUpdate" width="80%" center>
<!-- <el-button @click="dialogUpdate = false">取 消</el-button> -->
<data-alignment
ref="childAlignment"
@closeDialog="dialogUpdate = false"
@closeSearch="closeSearch"
:formInline="formInline"
:dialogData="dialogData"
:organizationList="organizationList"
></data-alignment>
</el-dialog>
</div>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import CourseAnalysis from "./item-course-analysis.vue";
import CrowdAnalysis from "./item-crowd-analysis.vue";
import PartIn from "./item-part-in.vue";
import ExaminationAnalysisfrom from "./item-examination-analysis.vue";
import LearningEffect from "./item-learning-effect.vue";
import DataAlignment from "./data-alignment.vue";
import DataAll from "./item-data-all.vue";
import { create } from "domain";
import { mapGetters } from "vuex";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
import * as operationData from "../../utils/operation";
import { log } from "util";
import html2Canvas from 'html2canvas'
import JsPDF from 'jspdf'
let vm = null;
export default {
components: {
BreadCrumb,
CourseAnalysis,
CrowdAnalysis,
PartIn,
ExaminationAnalysisfrom,
LearningEffect,
DataAlignment,
DataAll,
},
data() {
return {
curmbFirst: "学情报告",
curmbSecond: "项目列表",
curmbThird: "",
jumPathThird: "/report-list",
projectId: "",
projectName: "",
exportStatus: false,
organizationList: [],
optionsRegion: [],
props: {
lazy: true,
lazyLoad(node, resolve) {
const { level } = node;
if (node.level >= 1) {
console.log("node", node);
let req = {
projectId: vm.projectId,
regionId: node.data.value
};
vm.GET("stats/region", req).then(res => {
let newData = vm.setRegionOptionMore(res.data.list);
console.log("newData", newData);
resolve(newData);
});
}
}
},
showOriginal: 2,
roleType: '',
formInline: {
region: [],
date: "",
organization: [],
checked: false,
timeFlag: 1,
during: null,
pageNo: 1,
pageSize: 20,
},
organizationNotice: '选择地区筛选到区才能选择机构',
dialogData: {
region: "全部",
// regionData: "",
organization: ""
// organizationData: "",
},
tags: [],
activeName: "zero",
organizationNum: 0,
dialogVisible: false,
dialogUpdate: false,
displayExam: 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: {
...mapGetters(["_token"])
},
watch: {
tags: function(val) {
this.setDialogData();
}
},
created() {
vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "id");
this.projectName = vm.getUrlSearch(window.location.href, "projectName");
this.curmbThird = vm.getUrlSearch(window.location.href, "projectName");
this.downloadId = vm.getUrlSearch(window.location.href, "downloadId");
this.checkShowType();
// this.getDisplay();
// this.search();
// this.getRegionOption();
},
mounted: function() {
commonUtil.resizeHeight();
},
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) {
let reqInfo = {
projectId: vm.projectId,
};
openLoading(vm);
vm.GET("stats/region/info", reqInfo).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.showOriginal = res.data.status;
vm.roleType = res.data.roleType;
vm.displayCourse = res.data.existCourse;
vm.displayExam = res.data.existExam;
vm.displayEffect = res.data.existEffect;
vm.certFlag = res.data.certFlag;
vm.getRegionOption();
}
});
},
beforeLeave(activeName, oldActiveName) {
// console.log('action',activeName,'oldActive',oldActiveName)
},
handleClick(tab, event) {
// 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) {
this.formInline.organization = [];
this.tags = [];
setTimeout(function() {
console.log('行政区域改变',vm.$refs["cascaderRegion"].inputValue);
vm.dialogData.region = vm.$refs["cascaderRegion"].inputValue;
// vm.dialogData.regionData = value[value.length-1];
// console.log('vm.dialogData.region',vm.dialogData.region)
}, 20);
// console.log('region',value,vm.formInline);
let areaArr = value[value.length -1].split('_');
vm.areaLen = areaArr.length;
console.log('areaArr!!',areaArr);
if (areaArr.length >= 3) {
this.getOrganizationList();
this.organizationNotice = "请选择机构";
} else {
this.organizationNotice = "选择地区筛选到区才能选择机构";
}
},
setRegionOptionMore(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.leaf = true;
}
option.push(obj);
}
return option;
},
changeOrganization(value) {
// console.log('formInline',this.formInline.organization);
this.tags = [];
//选了全部的情况下
for (let a = 0; a < this.formInline.organization.length; a++) {
if (this.formInline.organization[a] == 0) {
//选了全部
let tagItem = {
label: "全部",
value: 0
};
this.tags.push(tagItem);
return;
}
}
//没选全部
for (let i = 0; i < this.organizationList.length; i++) {
for (let j = 0; j < value.length; j++) {
if (value[j] == this.organizationList[i].value) {
// console.log('value[j]',j,value[j],this.organizationList[i].label )
let tagItem = {
label: this.organizationList[i].label,
value: this.organizationList[i].value
};
this.tags.push(tagItem);
}
}
}
},
handleTagClose(tag) {
// console.log(tag);
//选了全部的情况下
if (this.tags.length > 0 && this.tags[0].value == 0) {
this.tags.splice(0, 1);
this.formInline.organization = [];
return;
}
//没全部的情况下
for (let i = 0; i < this.tags.length; i++) {
if (tag.value == this.tags[i].value) {
this.tags.splice(i, 1);
this.formInline.organization.splice(
this.formInline.organization.indexOf(tag.value),
1
);
break;
}
}
},
getMoreRegion() {
let http = new Promise((resolve, reject) => {
let req = {
provinceId: 350
};
vm.GET("basic-data/position/cities", req).then(res => {
resolve(res);
});
});
console.log("http值", http);
return http;
},
//获取地区
getRegionOption() {
let req = {
projectId: vm.projectId,
};
openLoading(vm);
vm.GET("stats/region", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.formInline.region = [];
vm.formInline.region[0] = res.data.list[0].id;
vm.optionsRegion = operationData.setRegionOptionNew(
res.data.list
);
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() {
vm.organizationList = [];
let regionId = vm.formInline.region[vm.formInline.region.length - 1];
let req = {
projectId: vm.projectId,
regionId : regionId
};
openLoading(vm);
vm.GET("stats/region/hospital", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
this.organizationList = operationData.getLearnOrganization(
res.data.list
);
}
});
},
getOrganizationNum() {
//选择全部
let num = 0;
if (this.tags.length == 0) {
return;
}
if (this.tags[0].value == 0) {
num = this.organizationList.length - 1;
return num;
}
//没有选择全部
num = this.tags.length;
return num;
},
closeSearch() {
vm.dialogUpdate = false;
vm.getDisplay(2);
vm.search();
},
setExportReq() {
vm.exportReq = {
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,
};
},
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-old?projectId="+vm.projectId+'&listType=2');
} else {
vm.$message(res.message)
}
vm.dialogSearch = false;
});
},
search() {
console.log(vm.formInline);
if(vm.formInline.timeFlag == 1) {
//截止昨日
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() {
vm.formInline = Object.assign(
{},
{
region: [],
date: "",
organization: [],
checked: false,
pageNo: 1,
pageSize: 20,
}
);
vm.tags = [];
if (this.activeName == "first") {
this.$refs.childPart.$emit("reset");
} else if (this.activeName == "second") {
this.$refs.childCrowd.$emit("reset");
} else if (this.activeName == "third") {
this.$refs.childCourse.$emit("reset");
} else if (this.activeName == "fourth") {
this.$refs.childExam.$emit("reset");
}
},
exportExcel() {
if(vm.downloadId == null) {
//按钮置灰三秒
vm.exportStatus = true;
setTimeout(function() {
vm.exportStatus = false;
},3000);
this.dialogVisible = true;
} else {
let downloadUrl = vm.timeInfoData.excelDownUrl;
setTimeout(() => {
window.open(downloadUrl);
}, 500);
}
},
exportHttp() {
let req = vm.exportReq;
openLoading(vm);
vm.POST("stats/export/current", req).then(res => {
closeLoading(vm);
if(res.code == "000000") {
vm.$router.push("export-download-old?projectId="+vm.projectId+'&listType=1');
} else {
vm.$message(res.message)
}
vm.dialogVisible = false;
});
},
getCityName() {
let city = '';
let region = vm.dialogData.region;
console.log('region',region,typeof region,region == '');
if(region != '') {
city = region.split(' / ').join('');
console.log('city',city);
}
return city;
},
toDownload() {
let checkAll = operationData.hasAll(vm.formInline.organization)
let routerData = {
// projectId : vm.projectId,
projectId : '',
};
vm.$router.push({ path: "export-download-old", query: routerData });
},
setDialogData() {
//传递给dialog数据
this.dialogData.organization = "";
for (let x = 0; x < this.tags.length; x++) {
this.dialogData.organization += this.tags[x].label + "、";
}
let len = this.dialogData.organization.length;
this.dialogData.organization = this.dialogData.organization.substring(
0,
len - 1
);
},
changeDate() {
if (vm.formInline.region.length == 0) {
const h = this.$createElement;
vm.$message({
message: h('p', { style: 'color: #FF3399' }, '请先选择地区后再进行修改 ')
});
return;
}
this.setDialogData();
this.dialogUpdate = true;
this.$nextTick(function() {
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>
<style lang="scss">
.item-list-wrap {
.component-content {
// position: relative;
// background: #fff;
padding: 10px;
.header-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.item-form {
position: relative;
// margin-bottom: 20px;
padding: 10px 0 10px 0;
background: #fff;
width: 100%;
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 {
position: absolute;
width: 140px;
top: 78px;
right: 10px;
.el-button--default{
border:1px solid #449284;
color: #449284;
}
}
.col-text {
font-size: 12px;
}
}
.button-group {
position: relative;
// right: 100px;
float: right;
margin-right: 20px;
z-index: 999;
.el-button {
border:1px solid #449284;
color: #449284;
}
}
.choose {
font-size: 12px;
margin-bottom: 20px;
}
.item-tab {
width: 100%;
height: 46px;
background: #F0F2F5;
position: absolute;
}
.el-tabs__item.is-active {
color: #409eff;
}
.el-tabs__header {
width: 100%;
background: #fff;
margin-bottom: 20px;
.el-tabs__nav-scroll {
margin-left: 30px;
}
}
.el-tabs__nav-wrap::after {
height: 0px;
}
.tag-group {
margin-left: 78px;
margin-bottom: 20px;
.el-tag {
margin-right: 20px;
}
}
.el-tabs__active-bar {
background-color: #449284;
}
}
}
</style>
\ No newline at end of file
<template>
<div class="part-in-wrap">
<div v-show="!showData" class="empty">
<p>"没有相关数据,请重新选择查询范围"</p>
</div>
<div v-for="(item , index) in cardData" :key="index" class>
<el-card class="box-card">
<div slot="header" class="title">
<span class="weight">{{ item.title }}</span>
</div>
<div class="box-content">
<span class="weight">{{ item.num }}</span>
</div>
</el-card>
<div class="line"></div>
</div>
<div v-if="showChart" class="charts" id="rankChart" ref="rankChart"></div>
<!-- <div class="charts" id="age" ref="age"></div> -->
<el-table
v-if="showTable"
v-show="organizationNum < 2"
:data="finishDetail"
class="project-table"
style="width: 100%;margin-bottom: 30px;"
border
>
<el-table-column prop="name" label="姓名" align="center"></el-table-column>
<el-table-column prop="departmentName" label="科室" align="center"></el-table-column>
<el-table-column prop="joinStatus" label="是否参与项目" align="center">
<template slot-scope="scope">{{ scope.row.joinStatus | partJoin }}</template>
</el-table-column>
<el-table-column prop="projectStatus" label="是否完成项目" align="center">
<template slot-scope="scope">{{ scope.row.projectStatus | partFinish }}</template>
</el-table-column>
<el-table-column prop="finishTime" label="完成项目日期" align="center">
<template slot-scope="scope">{{ scope.row.finishTime }}</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png">
<p>没有相关数据,请重新选择查询范围</p>
</div>
</div>
</el-table>
</div>
</template>
<script>
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
import * as operationData from "../../utils/operation";
import echarts from "echarts";
import { setTimeout } from "timers";
let vm = null;
export default {
props: {
formInline: {
type: Object
},
activeName: {
type: String
},
organizationNum: {
type: Number
},
organizationList: {
type: Array
}
},
data() {
return {
// 只有一个机构时显示人员完成情况
projectId: "",
finishDetail: [],
cardData: [],
showChart: false,
showTable: false,
showData: false,
};
},
created() {
vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "id");
},
mounted: function() {
// commonUtil.resizeHeight();
this.$on("search", () => {
this.search();
});
this.$on("init", () => {
this.$nextTick(function() {
if (vm.formInline.region.length != 0) {
this.search();
}
});
});
this.$on("reset", () => {
this.showData = false;
this.showChart = false;
this.showTable = false;
this.finishDetail = [];
this.cardData = [];
});
// if (this.activeName == "first") {
// this.updateResize();
// }
},
methods: {
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)
console.log(vm.formInline,checkAll,vm.organizationList);
let req = {
projectId: vm.projectId,
ids: operationData.getIds(vm.formInline,vm.organizationList,checkAll),
type: operationData.getSearchType(vm.formInline,checkAll),
originalFlag: vm.formInline.checked == false ? 0 : 1
};
console.log("1 req", req);
openLoading(vm);
vm.reportGET("report/portal/getParticipateInfo", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
this.getCardData(res.data);
vm.showData = true;
if(res.data.participateHospitalCount == 0 && res.data.participatePeopleCount == 0) {
vm.$message("没有相关数据,请重新选择查询范围");
}
} else {
vm.$message(res.message);
}
});
vm.reportGET("report/portal/top", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
this.getRank(res.data);
this.getTableData(res.data);
}
});
},
updateResize() {
this.$nextTick(function() {
let chartRank = echarts.init(document.getElementById("rankChart"));
window.onresize = function() {
chartRank.resize();
};
});
},
getTableData(data) {
if (vm.formInline.region.length >= 3 && vm.organizationNum == 1) {
vm.showTable = true;
vm.finishDetail = data.hospitalPeopleList;
} else {
vm.showTable = false;
}
},
getRank(data) {
let xAxisData = [];
let seriesData = [];
for (let i = 0; i < data.top.length; i++) {
xAxisData[i] = data.top[i].name;
seriesData[i] = data.top[i].percentage;
}
if(vm.organizationNum == 1 || xAxisData.length <= 1) {
vm.showChart = false;
}
if (xAxisData.length > 1 && vm.organizationNum !=1) {
vm.showChart = true;
setTimeout(function() {
let myChart = echarts.init(vm.$refs.rankChart);
let optionValue = operationData.getRank(xAxisData, seriesData);
myChart.setOption(optionValue);
vm.updateResize();
}, 200);
}
},
getCardData(data) {
vm.cardData = [
{
title: "应参与机构数",
num: data.participateHospitalCount,
},
{
title: "已参与机构数",
num: data.hasParticipateHospitalCount,
},
{
title: "应参与人数",
num: data.participatePeopleCount,
},
{
title: "已参与人数",
num: data.hasParticipatePeopleCount,
},
{
title: data.type == 1 ? "项目完成人数" : "项目获证人数",
num: data.acquireCertificatePeopleCount,
},
];
if(data.manyCertificate != null) {
for(let i=0;i<data.manyCertificate.length;i++) {
let obj = {
title: data.manyCertificate[i].name,
num: data.manyCertificate[i].value,
}
if(obj.title != null) {
vm.cardData.push(obj);
}
}
}
// vm.cardData[0].num = data.participateHospitalCount;
// vm.cardData[1].num = data.participatePeopleCount;
// vm.cardData[2].num = data.hasParticipatePeopleCount;
// vm.cardData[3].num = data.acquireCertificatePeopleCount;
},
}
};
</script>
<style lang='scss'>
.part-in-wrap {
background: #fff;
overflow: hidden;
// padding: 10px;
.empty {
height: 300px;
line-height: 300px;
color: #FF3399;
text-align: center;
}
.el-card {
border-width: 0px;
}
.el-card.is-always-shadow {
box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.1);
}
.line {
background: #e4e4e4;
height: 80px;
width: 1px;
float: left;
margin-top: 20px;
}
.box-card {
width: 13%;
margin-right: 1%;
font-size: 14px;
float: left;
.el-card__header {
border-bottom-width: 0;
}
.title {
text-align: center;
}
.box-content {
text-align: center;
height: 40px;
font-size: 15px;
}
}
.charts {
top: 20px;
margin-left: 10%;
width: 80%;
border-radius: 4px;
border: 1px solid #ebeef5;
background-color: #fff;
overflow: hidden;
color: #303133;
-webkit-transition: 0.3s;
transition: 0.3s;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
height: 600px;
background: #fff;
padding: 20px;
}
.project-table {
top: 15px;
background: #fff;
}
}
</style>
<template>
<div class="name-list-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird" :curmbFouth="curmbFouth" :jumPathThird="jumPathThird" :jumPathFouth="jumPathFouth"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<p class="course-p">地区:{{ queryData.region }}</p>
<p class="course-p">选择机构:{{ queryData.organization }}</p>
<el-form
class="form-update"
ref="serchForm"
:model="formData"
label-width="100px"
style="width:40%;"
>
<el-form-item v-if="tableType == 1" label="课程完成状态:">
<el-select
v-model="formData.learnFlag"
size="small"
style="width: 100%;"
placeholder="请选择状态"
>
<el-option
v-for="(item,index) in statusList"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item v-if="tableType == 2" label="考试成绩等级:">
<el-select v-model="formData.gradeFlag" size="small" style="width: 100%;" placeholder="请选择状态">
<el-option
v-for="(item,index) in rankList"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="查询姓名: ">
<el-input size="small" placeholder="查询姓名" v-model="formData.doctorName"></el-input>
</el-form-item>
</el-form>
<div class="form-button">
<el-button @click="searchData()" type="primary">查询</el-button>
<el-button @click="resetForm()">重置</el-button>
</div>
<el-table :data="tableData" class="course-table">
<el-table-column prop="doctorName" 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="titleName" 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 v-if="tableType == 1" prop="finishFlag" label="参与课程状态" align="center">
<template slot-scope="scope">
<span>{{ scope.row.finishFlag | finishFlagType }}</span>
</template>
</el-table-column>
<el-table-column
v-if="tableType == 1"
prop="finishTime"
label="完成培训日期"
align="center"
min-width="150"
>
<template slot-scope="scope">
<span>{{ scope.row.finishTime }}</span>
</template>
</el-table-column>
<el-table-column
v-if="tableType == 2"
prop="passTime"
label="通过考试日期"
min-width="150"
align="center"
>
<template slot-scope="scope">
<span>{{ scope.row.passTime }}</span>
</template>
</el-table-column>
<el-table-column
v-if="tableType == 2"
prop="gradeName"
label="考试成绩等级"
min-width="80"
align="center"
>
<template slot-scope="scope">
<span>{{ scope.row.gradeName }}</span>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png">
<p>没有相关数据,请重新选择查询范围</p>
</div>
</div>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="formData.pageNo"
:page-sizes="[20, 50 ,100, 200]"
:page-size="formData.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import { create } from "domain";
import { mapGetters } from "vuex";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
import * as operationData from "../../utils/operation";
let vm = null;
export default {
components: {
BreadCrumb
},
props: {
formInline: {
type: Object
}
},
data() {
return {
curmbFirst: "学情报告",
curmbSecond: "项目管理",
curmbThird: "",
curmbFouth: "",
jumPathThird: "/report-list",
jumPathFouth: "",
formData: {
doctorName: "",
learnFlag: -1,
gradeFlag: -1,
pageNo: 1,
pageSize: 20,
},
region: "",
organization: "",
tableData: [],
tableType: 1,
totalRows: 0,
statusList: [
{
value: -1,
label: "全部"
},
{
value: 0,
label: "未参与"
},
{
value: 1,
label: "未完成"
},
{
value: 2,
label: "已完成"
}
],
rankList: [
{
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: {
// ...mapGetters([
// "_token",
// ])
// },
created() {
vm = this;
vm.base = vm.getUrlSearch(window.location.href, "base");
vm.getInitData();
vm.search();
},
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
getHostital() {
let req = {
projectId: vm.queryData.projectId,
hospitalIds: vm.queryData.ids,
};
vm.reportGET("report/portal/getHostitalName", req).then(res => {
if (res.code == "000000") {
}
});
},
getInitData() {
vm.queryData = this.$route.query;
vm.tableType = vm.queryData.tableType;
vm.curmbThird = vm.getUrlSearch(window.location.href, "projectName");
vm.jumPathFouth = '/item-list?id=' + vm.queryData.projectId + '&projectName=' + vm.queryData.projectName;
console.log("queryData", vm.queryData);
// if(vm.queryData.hospitalIdList.length > 0) {
// vm.getHostital();
// }
},
searchData() {
vm.formData.pageNo = 1;
vm.search();
},
search() {
let query = this.queryData;
if (this.tableType == 1) {
vm.curmbFouth = "课程培训情况";
//课程分析
// console.log('this.tableType',this.tableType)
let req = {
projectId: query.projectId,
beginDate: query.beginDate,
endDate: query.endDate,
hospitalIdList: operationData.getHospitalIdList(query.hospitalIdList),
originalFlag: query.originalFlag,
regionId: query.regionId,
timeFlag: query.timeFlag,
courseId: query.courseId,
type: vm.formData.learnFlag,
name: vm.formData.doctorName,
pageNo: vm.formData.pageNo,
pageSize: vm.formData.pageSize,
};
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);
vm.POST(reqUrl, req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
if(res.data.totalCount == 0 ) {
vm.$message("没有相关数据,请重新选择查询范围");
}
vm.tableData = res.data.list;
vm.totalRows = res.data.totalCount;
} else {
vm.$message(res.message);
}
});
} else if (this.tableType == 2) {
vm.curmbFouth = "考试培训情况";
//考试分析
let req = {
projectId: query.projectId,
beginDate: query.beginDate,
endDate: query.endDate,
hospitalIdList: operationData.getHospitalIdList(query.hospitalIdList),
originalFlag: query.originalFlag,
regionId: query.regionId,
timeFlag: query.timeFlag,
examId: query.examId,
gradeFlag: vm.formData.gradeFlag,
doctorName: vm.formData.doctorName,
pageNo: vm.formData.pageNo,
pageSize: vm.formData.pageSize,
};
let reqUrl = '';
if(vm.base == null) {
reqUrl = 'stats/report/getUserList';
} else {
reqUrl = 'stats/export/time/info/exam';
}
// console.log("exam req", req);
openLoading(vm);
vm.POST(reqUrl, req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
if(res.data.totalCount == 0 ) {
vm.$message("没有相关数据,请重新选择查询范围");
}
vm.tableData = res.data.list;
vm.totalRows = res.data.totalCount;
} else {
vm.$message(res.message);
}
});
}
},
resetForm() {
vm.formData = Object.assign(
{},
{
doctorName: "",
learnFlag: -1,
gradeFlag: -1,
pageNo: 1,
pageSize: 20,
}
);
vm.search();
},
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
this.formData.pageSize = val;
this.formData.pageNo = 1;
this.search();
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.formData.pageNo = val;
this.search();
}
}
};
</script>
<style lang="scss">
.name-list-wrap {
.component-content {
background: #fff;
padding: 10px;
.header-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.course-p {
margin: 30px 0 20px 30px;
font-size: 13px;
color: #606266;
}
.form-update {
margin: 30px 0px 0px 20px;
}
.form-button {
width: 45%;
top: -62px;
position: relative;
left: 50%;
}
}
}
</style>
\ No newline at end of file
<template>
<div class="item-list">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="itemlist-content screenSet" id="screenSet">
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<el-form ref="serchForm" :model="formData" label-width="75px" style="width:100%;">
<el-col :span="6">
<el-form-item label="项目状态:">
<el-select
v-model="formData.status"
size="small"
style="width: 100%;"
placeholder="请选择项目状态"
>
<el-option
v-for="(item,index) in statusSelect"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item>
<el-input v-model="formData.name" size="small" placeholder="请输入项目名称">
<i slot="suffix" class="el-icon-search"></i>
</el-input>
</el-form-item>
</el-col>
<el-col :span="12" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="primary" size="small" @click="searchData()">查询</el-button>
<el-button type="default" size="small" @click="resetForm()" style="margin-left:0;">重置</el-button>
</el-col>
</el-form>
</el-row>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="projectName" label="项目名称" min-width="200" align="center"></el-table-column>
<el-table-column prop="timeStatus" label="项目状态" min-width="80" align="center">
<template slot-scope="scope">
{{ scope.row.timeStatus | reportStatus }}
</template>
</el-table-column>
<el-table-column prop="projectBegintime" label="开始时间" min-width="160" align="center">
<template slot-scope="scope">{{ scope.row.projectBegintime }}</template>
</el-table-column>
<el-table-column prop="projectEndtime" label="结束时间" min-width="160" align="center">
<template slot-scope="scope">{{ scope.row.projectEndtime }}</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="200">
<template slot-scope="scope">
<el-button style="color:#509284" type="text" size="small" @click="go(scope.row)">查看学情报告</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png" />
<p>没有找到符合的结果</p>
</div>
</div>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="formData.pageNo"
:page-sizes="[20, 50 ,100, 200]"
:page-size="formData.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from "vuex";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
import BreadCrumb from "../../components/breadcrumb.vue";
let vm = null;
export default {
data() {
return {
curmbFirst: "学情报告",
curmbSecond: "项目列表",
formData: {
//搜索信息
status: "",
name: "",
pageNo: 1, //当前是第几页
pageSize: 20 //页面总数
},
statusSelect: [
//项目状态
{
label: "全部",
value: ""
},
{
label: "进行中",
value: 1
},
{
label: "已结束",
value: 2
}
],
tableData: [],
totalRows: 0, //数据总数
idType: '',
};
},
components: {
BreadCrumb
},
created() {
vm = this;
vm.idType = localStorage.getItem('storageIdType');
vm.search();
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
searchData() {
vm.formData.pageNo = 1;
vm.search();
},
// 搜索列表
search() {
let req = {};
req = this.formData;
openLoading(vm);
vm.GET("portal/portalInfo/getPortalReportProject", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
if(res.data.totalRows == 0) {
vm.$message("没有找到符合的结果");
}
vm.tableData = res.data.projectList;
vm.totalRows = res.data.totalRows;
} else {
vm.$message(res.message);
}
});
},
// 重置搜索信息
resetForm() {
this.formData = {
status: "",
name: "",
pageNo: 1, //当前是第几页
pageSize: 20 //页面总数
};
vm.search();
},
// 更改数据显示数量
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
vm.formData.pageSize = val;
vm.search();
},
// 换页
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
vm.formData.pageNo = val;
vm.search();
},
//跳转到报告详情页
go(row) {
let routerData = {
id: row.id,
projectName: row.projectName,
};
vm.$router.push({ path: "/item-list-old" , query: routerData });
}
}
};
</script>
<style lang="scss">
.item-list {
.itemlist-content {
padding: 10px;
background: #fff;
}
}
</style>
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册