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

从1101上拉取的数据

上级 18fb0418
......@@ -22,11 +22,11 @@ const nameList = r => require.ensure([], () => r(require('../views/learning/name
const dataAlignment = r => require.ensure([], () => r(require('../views/learning/data-alignment.vue')), 'data-alignment')
const exportDownload = r => require.ensure([], () => r(require('../views/learning/export-download.vue')), 'export-download')
const reportLisOld = r => require.ensure([], () => r(require('../views/learning-old/report-list.vue')), 'report-list')
const itemListOld = r => require.ensure([], () => r(require('../views/learning-old/item-list.vue')), 'item-list')
const nameListOld = r => require.ensure([], () => r(require('../views/learning-old/name-list.vue')), 'name-list')
const dataAlignmentOld = r => require.ensure([], () => r(require('../views/learning-old/data-alignment.vue')), 'data-alignment')
const exportDownloadOld = r => require.ensure([], () => r(require('../views/learning-old/export-download.vue')), 'export-download')
const reportLisOld = r => require.ensure([], () => r(require('../views/learning-o/report-list.vue')), 'report-list')
const itemListOld = r => require.ensure([], () => r(require('../views/learning-o/item-list.vue')), 'item-list')
const nameListOld = r => require.ensure([], () => r(require('../views/learning-o/name-list.vue')), 'name-list')
const dataAlignmentOld = r => require.ensure([], () => r(require('../views/learning-o/data-alignment.vue')), 'data-alignment')
const exportDownloadOld = r => require.ensure([], () => r(require('../views/learning-o/export-download.vue')), 'export-download')
const itemShield = r => require.ensure([], () => r(require('../views/education/item-shield.vue')), 'item-shield')
const entryManager = r => require.ensure([], () => r(require('../views/education/entry-manager.vue')), 'entry-manager')
......
此差异已折叠。
<template>
<div class="export-download">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<p>导出文件列表</p>
<el-table :data="tableData" style="width: 100%">
<el-table-column
prop="title"
label="名称"
align="center"
min-width="150"
show-overflow-tooltip
></el-table-column>
<el-table-column prop="createdTime" label="时间" align="center" min-width="120">
<template slot-scope="scope">{{ scope.row.createdTime }}</template>
</el-table-column>
<el-table-column prop="status" label="状态" align="center" min-width="150">
<template slot-scope="scope">{{ scope.row.status | exportStatus }}</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="70">
<template slot-scope="scope">
<el-button
type="primary"
:disabled="scope.row.buttonStatus"
size="small"
@click="update(scope.row)"
>{{ scope.row.buttonText }}</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="param.pageNo"
:page-sizes="[20, 50 ,100]"
: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: {}
// buttonText: "刷新",
// buttonStatus: false,
};
},
created() {
vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "projectId");
this.search();
},
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
setButton() {
for (let i = 0; i < vm.tableData.length; i++) {
vm.tableData[i].index = i;
if (vm.tableData[i].status == 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() {
// this.setButton();
let req = {
projectId: vm.projectId
};
if(req.projectId == null) {
req.projectId = '';
}
vm.reportGET("report/downLoad/getDownloadList", req).then(res => {
if (res.code == "000000") {
vm.tableData = res.data.data;
vm.totalRows = res.data.totalRows;
vm.setButton();
}
});
},
downLoad(row) {
// vm.queryData = this.$route.query;
// let req = vm.queryData;
// openLoading(vm);
// vm.reportGET("report/downLoad/downLoad", req).then(res => {
// closeLoading(vm);
// // console
// if (res.code == "000000") {
// }
// });
setTimeout(() => {
window.open(row.fileUrl);
}, 500);
},
getDownLoadStatus(row) {
let req = {
id: row.id
};
vm.reportGET("report/downLoad/getDownLoadStatus", req).then(res => {
if (res.code == "000000") {
vm.tableData[row.index].status = res.data.data;
// console.log('res.data.data',res.data.data);
if (res.data.data == 1) {
vm.tableData[row.index].title = vm.tableData[row.index].title + " ";
vm.tableData[row.index].buttonText = "下载";
vm.tableData[row.index].fileUrl = res.data.url;
} else if(res.data.data == 0) {
console.log("res", res, vm.tableData[row.index]);
vm.tableData[row.index].title = vm.tableData[row.index].title + " ";
vm.tableData[row.index].buttonText = "刷新";
} else if(res.data.data == 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 = "刷新";
}
});
},
update(row) {
if (vm.tableData[row.index].status == 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.search();
},
// 换页
handleCurrentChange(val) {
vm.param.pageNo = value;
vm.search();
}
}
};
</script>
<style lang="scss">
.export-download {
.component-content {
background: #fff;
padding: 10px;
}
}
</style>
\ No newline at end of file
<template>
<div class="course-analysis-wrap">
<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 v-if="item.num !=0" class="weight">{{ item.num }} </span>
<span v-if="item.num !=0">{{ item.unit }} </span>
<span v-if="index == 2 && second !=0" class="weight" >{{ second }} </span>
<span v-if="index == 2 && second !=0"></span>
</div>
</el-card>
<div v-if="index+1 !== cardData.length" class="line"></div>
</div>
<el-table
:data="tableData"
class="course-table">
<el-table-column prop="courseName" label="课程名" align="center">
</el-table-column>
<el-table-column prop="courseTotalTime" label="课程时长" align="center">
<template slot-scope="scope">
{{ scope.row.courseTotalTime | getTotalTime }}
</template>
</el-table-column>
<el-table-column prop="courseAvgStudyTime" label="人均学习时长" align="center">
<template slot-scope="scope">
{{ scope.row.courseAvgStudyTime | getAvgTime }}
</template>
</el-table-column>
<el-table-column prop="courseLearnerCount" label="参与培训人数" align="center">
</el-table-column>
<el-table-column prop="courseFinishedCount" label="完成培训人数" align="center">
</el-table-column>
<el-table-column fixed="right" label="操作" min-width="50" align="center">
<template slot-scope="scope">
<el-button
@click="checkName(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 class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="[20, 50 ,100]"
: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
}
},
data() {
return {
cardData: [],
tableData: [],
totalRows: 0,
projectId: '',
pageNo: 1,
pageSize: 20,
second: 0,
}
},
created() {
vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "id");
},
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 = [];
});
},
methods: {
setCardData(data) {
vm.totalRows = data.projectCourseCount;
let avgTime = [];
avgTime = operationData.getAvgTime(data.projectAvgStudyTime);
vm.cardData = [
{
title: '项目所有课程数',
num: data.projectCourseCount,
unit: '门课程',
},{
title: '项目所有课程总时长',
num: data.projectCourseTotalTime,
unit: '分钟',
},{
title: '项目人均学习时长',
num: avgTime[0],
unit: '分钟',
}
];
vm.second = avgTime[1];
},
search() {
if (vm.formInline.region.length == 0) {
const h = this.$createElement;
vm.$message({
message: h('p', { style: 'color: #FF3399' }, '请先选择地区后再进行查询 ')
});
return;
}
let checkAll = operationData.hasAll(vm.formInline.organization)
let req = {
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("3 req", req);
openLoading(vm);
vm.reportGET("report/portalProjectCourse/getTotal", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
if(res.data.projectCourseCount == 0 ) {
vm.$message("没有相关数据,请重新选择查询范围");
}
vm.setCardData(res.data)
} else {
vm.$message(res.message);
}
});
let reqList = req;
reqList.pageNo = vm.pageNo;
reqList.pageSize = vm.pageSize;
vm.reportGET("report/portalProjectCourse/getCourseList", reqList).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.tableData = res.data.list;
}
});
},
checkName(data) {
console.log('dialogData',this.dialogData);
let checkAll = operationData.hasAll(vm.formInline.organization)
let routerData = {};
routerData = this.dialogData;
routerData.projectId = vm.projectId;
routerData.projectName = vm.getUrlSearch(window.location.href, "projectName");
routerData.tableType = 1;
routerData.courseId = data.courseId;
routerData.ids = operationData.getIds(vm.formInline,vm.organizationList,checkAll);
routerData.type = operationData.getSearchType(vm.formInline,checkAll);
routerData.originalFlag = vm.formInline.checked == false ? 0 : 1;
// this.$router.push({ path: '/name-list-old', 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.search();
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
vm.pageNo = val;
vm.search();
},
},
}
</script>
<style lang="scss">
.course-analysis-wrap {
background: #fff;
overflow: hidden;
padding: 10px;
.weight {
font-weight: bold;
}
.title:after {
clear: both
}
.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: 32%;
margin-right: 1%;
float: left;
.el-card__header {
border-bottom-width: 0;
}
.title {
text-align: center;
}
.box-content {
text-align: center;
height: 40px;
}
}
.course-table {
top: 20px;
margin-bottom: 20px;
}
}
</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="1">全部用户</el-radio-button>
<el-radio-button label="2">参与项目</el-radio-button>
<el-radio-button label="3">通过项目</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 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" />
<p class="sex-type">{{ item.type }}</p>
<p></p>
<p class="sex-num">{{ item.num }}</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 echarts from "echarts";
import { setTimeout } from "timers";
let vm = null;
export default {
components: {
BreadCrumb
},
props: {
formInline: {
type: Object
},
activeName: {
type: String
},
organizationList: {
type: Array
}
},
data() {
return {
radio: 1,
sexData: [],
projectId: "",
crowdData: {},
showData: false,
echartsData: {
chart1: {},
chart2: {},
chart3: {},
},
};
},
created() {
vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "id");
},
mounted: function() {
// commonUtil.resizeHeight();
//父组件传值
this.$on("search", () => {
vm.radio = 1;
this.search();
});
this.$on("init", () => {
this.$nextTick(function() {
if (vm.formInline.region.length != 0) {
this.search();
}
});
});
this.$on("reset", () => {
this.showData = false;
this.crowdData = {};
});
if (this.activeName == "second") {
}
},
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);
let req = {
projectId: vm.projectId,
cityOrHospitalId: operationData.getIds(vm.formInline,vm.organizationList,checkAll),
kind: operationData.getSearchType(vm.formInline,checkAll),
type: vm.radio,
originalFlag: vm.formInline.checked == false ? 0 : 1
};
console.log("2 req", req);
openLoading(vm);
vm.reportGET("report/portal/getPeoplesDetails", 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();
vm.jobDivision();
vm.getSexData();
vm.ageDivision();
},20);
// this.educationDivision();
// this.jobDivision();
// this.getSexData();
// this.ageDivision();
} 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) {
console.log(value,vm.radio);
this.search();
},
//用户性别分布
getSexData() {
let sexList = this.crowdData.sexList;
// if(sexList.length <3) {
// this.sexData = [];
// return;
// }
this.sexData = [
{
src: require("../../assets/image/man.png"),
type: "男性",
num: 0
},
{
src: require("../../assets/image/weman.png"),
type: "女性",
num: 0
},
{
src: require("../../assets/image/question.png"),
type: "未完善信息",
num: 0
}
];
for(let i=0;i<sexList.length;i++) {
if(sexList[i].name == "男") {
this.sexData[0].num = sexList[i].value;
} else if(sexList[i].name == "女") {
this.sexData[1].num = sexList[i].value;
} else {
this.sexData[2].num = sexList[i].value;
}
}
},
educationDivision(data) {
let myChart = echarts.init(this.$refs.education);
let educationList = operationData.removeZero(this.crowdData.educationList);
let legendData = [];
let seriesData = [];
let colorData = ["#FF9F7F", "#008000", "#E062AE", "#37A2DA", "#0050DC", "#67E0E3", "#8A2BE2"];
// for (let i = 0; i < educationList.length; i++) {
// legendData[i] = educationList[i].name;
// }
if(educationList.length > 0) {
legendData = ['博士后','博士','硕士','本科','大专','中专及以下','其他'];
}
seriesData = educationList;
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 jobTitle = operationData.removeZero(this.crowdData.jobTitle);
let legendData = [];
let seriesData = [];
let colorData = ["#FF9F7F", "#008000", "#E062AE", "#37A2DA", "#0050DC", "#67E0E3", "#8A2BE2"];
for (let i = 0; i < jobTitle.length; i++) {
legendData[i] = jobTitle[i].name;
}
seriesData = jobTitle;
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 = this.crowdData.ageList;
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: 100%;
// overflow: auto;
.item {
position: relative;
float: left;
margin-top: 20px;
padding: 0;
width: 48%;
// height: 20vw;
height: 350px;
border: 1px solid #dedede;
.title {
position: relative;
margin: 15px auto 10px auto;
font-size: 18px;
text-align: center;
font-weight: bold;
}
.sex {
position: relative;
top: 42px;
left: 0;
.sex-item {
float: left;
height: 350px;
width: 33.3%;
.sex-img {
margin: 0 auto;
position: relative;
left: 10%;
// width: 80%;
width: 60%;
margin-left: 10%;
}
.sex-type {
text-align: center;
}
.sex-num {
margin-top: 40px;
font-size: 30px;
font-weight: bold;
text-align: center;
}
}
}
}
.item-right {
float: right;
}
}
}
</style>
\ No newline at end of file
<template>
<div class="examination-analysis">
<div v-for="(item , index) in cardData" :key="index" class="box">
<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>
{{ item.unit }}
</div>
</el-card>
<div v-if="index+1 !== cardData.length" class="line"></div>
</div>
<div class="table">
<el-table :data="tableData" style="width: 100%" border>
<el-table-column prop="examName" label="考试名" min-width="150" align="center"></el-table-column>
<el-table-column prop="examUserCount" label="参与考试人数" min-width="100" align="center"></el-table-column>
<el-table-column prop="userCountForPassExam" label="通过考试人数" min-width="80" align="center"></el-table-column>
<el-table-column v-if="showTd[0]" prop="userCountList[0]" :label="labelTd[0]" min-width="80" align="center"></el-table-column>
<el-table-column v-if="showTd[1]" prop="userCountList[1]" :label="labelTd[1]" min-width="80" align="center"></el-table-column>
<el-table-column v-if="showTd[2]" prop="userCountList[2]" :label="labelTd[2]" min-width="80" align="center"></el-table-column>
<el-table-column v-if="showTd[3]" prop="userCountList[3]" :label="labelTd[3]" min-width="80" align="center"></el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="100">
<template slot-scope="scope">
<el-button 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
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="[20, 50 ,100]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</template>
<script>
import { log } from 'util';
import * as operationData from "../../utils/operation";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
let vm
export default {
props: {
formInline: {
type: Object
},
activeName: {
type: String
},
dialogData: {
type: Object
},
organizationList: {
type: Array
}
},
data() {
return {
projectId: '',
tableData: [],
cardData: [],
totalRows: 0, //数据总数
pageNo: 1, //当前是第几页
pageSize: 20, //页面总数
labelTd: [],
showTd: [false,false,false,false],
};
},
created() {
vm = this;
this.projectId = vm.getUrlSearch(window.location.href, "id");
},
// 挂载到Dom完成时
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 = [];
});
},
methods: {
setCardData(data) {
vm.totalRows = data.projectExamCount;
vm.cardData = [
{
title: "项目所有考试数",
num: data.projectExamCount,
unit: "门考试"
},
{
title: "项目所有考题数",
num: data.projectExamQuestionCount,
unit: "道题"
}
];
// vm.cardData[0].num = data.projectExamCount;
// vm.cardData[1].num = data.projectExamQuestionCount;
},
// 搜索列表
search() {
if (vm.formInline.region.length == 0) {
const h = this.$createElement;
vm.$message({
message: h('p', { style: 'color: #FF3399' }, '请先选择地区后再进行查询 ')
});
return;
}
let checkAll = operationData.hasAll(vm.formInline.organization)
let req = {
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("4 req", req);
openLoading(vm);
vm.reportGET("report/portalProjectExam/getTotal", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
if(res.data.projectExamCount == 0 ) {
vm.$message("没有相关数据,请重新选择查询范围");
}
vm.setCardData(res.data);
vm.labelTd = res.data.gradeNameList;
} else {
vm.$message(res.message);
}
});
let reqList = req;
reqList.pageNo = vm.pageNo;
reqList.pageSize = vm.pageSize;
vm.reportGET("report/portalProjectExam/getExamList", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.tableData = res.data.list;
if(res.data.list.length == 0) {
return;
}
if(res.data.list[0].userCountList == null || res.data.list[0].userCountList.length == 0) {
vm.showTd = [false,false,false,false];
} else if (res.data.list[0].userCountList.length == 1){
vm.showTd = [true,false,false,false];
} else if (res.data.list[0].userCountList.length == 2){
vm.showTd = [true,true,false,false];
} else if (res.data.list[0].userCountList.length == 3){
vm.showTd = [true,true,true,false];
} else if (res.data.list[0].userCountList.length == 4){
vm.showTd = [true,true,true,true];
}
}
});
//
},
// 跳转查看名单页面
goPage(data) {
let checkAll = operationData.hasAll(vm.formInline.organization)
let routerData = {};
routerData = this.dialogData;
routerData.projectId = vm.projectId;
routerData.projectName = vm.getUrlSearch(window.location.href, "projectName");
routerData.tableType = 2;
routerData.examId = data.examId;
routerData.ids = operationData.getIds(vm.formInline,vm.organizationList,checkAll);
routerData.type = operationData.getSearchType(vm.formInline,checkAll),
routerData.originalFlag = vm.formInline.checked == false ? 0 : 1
// this.$router.push({ path: '/name-list-old', 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.search()
},
// 换页
handleCurrentChange(val) {
console.log(`当前页: ${val}`)
vm.pageNo = val
vm.search()
}
}
};
</script>
<style lang='scss' rel='stylesheet/scss'>
.examination-analysis {
background: #fff;
overflow: hidden;
padding: 10px;
.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;
}
.box {
}
.table {
margin-top: 30px;
}
.box-card {
width: 48%;
margin-right: 1%;
float: left;
.el-card__header {
border-bottom-width: 0;
}
.title {
text-align: center;
}
.box-content {
text-align: center;
height: 40px;
font-size: 15px;
}
}
}
</style>
<template>
<div class="learning-effect">
<div class="learning" ref="learning"></div>
<div class="education" ref="education"></div>
</div>
</template>
<script>
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
const echarts = require("echarts");
export default {
data() {
return {};
},
mounted() {
commonUtil.resizeHeight();
this.initEcharts();
},
methods: {
// 初始化图表
initEcharts() {
openLoading(this);
let trainChart = echarts.init(this.$refs["learning"]);
let educationChart = echarts.init(this.$refs["education"]);
let trainPara = {
color: ["#FF9999", "#66CCFF"],
text: '培训前后知识点掌握情况变化',
xAxisData: [
"转诊与履约",
"转诊与履约",
"周三",
"治疗原则及降压目标",
"周五",
"治疗原则及降压目标",
"周日"
],
seriesBeforeDate: [20, 32, 31, 34, 39, 33, 32],
seriesAfterDate: [86, 10, 96, 10, 16, 16, 15]
}
let educationPara = {
color: ["#33FFFF", "#FF9999"],
text: '不同学历培训前后正确率对比',
xAxisData: [
"转诊与履约",
"转诊与履约",
"周三",
"治疗原则及降压目标",
"周五",
"治疗原则及降压目标",
"周日"
],
seriesBeforeDate: [20, 32, 31, 34, 39, 33, 32],
seriesAfterDate: [86, 10, 96, 10, 16, 16, 15]
};
// 显示图表。
trainChart.setOption(this.echartOptions(trainPara));
educationChart.setOption(this.echartOptions(educationPara));
closeLoading(this)
},
// 图表的参数
echartOptions(parameter) {
let option = {
color: parameter.color,
title: {
text: parameter.text,
x: "center",
textStyle: {
//主标题文本样式
fontSize: 16,
fontWeight: "bolder",
color: "#333"
}
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow"
}
},
legend: {
data: ["培训前正确率", "培训后正确率"],
right: 0,
top: 20
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: [
{
type: "category",
data: parameter.xAxisData,
axisLabel: {
//坐标轴刻度标签的相关设置。
interval: 0,
rotate: "45"
}
}
],
yAxis: [
{
name: "比率(%)",
type: "value",
axisLabel: {
show: true,
interval: "auto",
formatter: "{value} %"
},
show: true,
axisLine: {
// 轴线
show: false
}
}
],
series: [
{
name: "培训前正确率",
type: "bar",
barGap: "20%",
barMaxWidth: "50",
itemStyle: {
normal: {
label: {
show: true,
position: "top",
formatter: "{c}%"
}
}
},
data: parameter.seriesBeforeDate
},
{
name: "培训后正确率",
type: "bar",
barGap: "20%",
barMaxWidth: "50",
itemStyle: {
normal: {
label: {
show: true,
position: "top",
formatter: "{c}%" //这是关键,在需要的地方加上就行了
}
}
},
data: parameter.seriesAfterDate
}
]
};
return option;
}
}
};
</script>
<style lang='scss' rel='stylesheet/scss'>
.learning-effect {
width: 100%;
.learning,
.education {
margin-top: 40px;
min-width: 400px;
height: 400px;
background: #fff;
}
}
</style>
此差异已折叠。
<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="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]"
: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 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册