Skip to content

P
pica.cloud.web-education-admin
提交 38fc3a73 编写于 作者: guangjun.yang's avatar guangjun.yang
浏览文件
操作

Merge remote-tracking branch 'origin/dev-learning-report-0507' into dev-edu-lern-20190621

上级 8aaf70ac cf7edc10
展开全部 隐藏空白字符变更
内嵌 并排
正在显示 包含 2264 行增加 和 31 行删除
package-lock.json
浏览文件 @ 38fc3a73
...@@ -2777,7 +2777,8 @@ ...@@ -2777,7 +2777,8 @@
"ansi-regex": { "ansi-regex": {
"version": "2.1.1", "version": "2.1.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"aproba": { "aproba": {
"version": "1.2.0", "version": "1.2.0",
...@@ -3179,7 +3180,8 @@ ...@@ -3179,7 +3180,8 @@
"safe-buffer": { "safe-buffer": {
"version": "5.1.1", "version": "5.1.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"safer-buffer": { "safer-buffer": {
"version": "2.1.2", "version": "2.1.2",
...@@ -3234,6 +3236,7 @@ ...@@ -3234,6 +3236,7 @@
"version": "3.0.1", "version": "3.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"ansi-regex": "^2.0.0" "ansi-regex": "^2.0.0"
} }
...@@ -3277,12 +3280,14 @@ ...@@ -3277,12 +3280,14 @@
"wrappy": { "wrappy": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"yallist": { "yallist": {
"version": "3.0.2", "version": "3.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
} }
} }
}, },
......
src/router/router.js
浏览文件 @ 38fc3a73
...@@ -12,11 +12,15 @@ const addManager = r => require.ensure([], () => r(require('../views/education/a ...@@ -12,11 +12,15 @@ const addManager = r => require.ensure([], () => r(require('../views/education/a
const itemRole = r => require.ensure([], () => r(require('../views/system/item-role.vue')), 'item-role') const itemRole = r => require.ensure([], () => r(require('../views/system/item-role.vue')), 'item-role')
const msgPush = r => require.ensure([], () => r(require('../views/msgpush/msg-push.vue')), 'msg-push') const msgPush = r => require.ensure([], () => r(require('../views/msgpush/msg-push.vue')), 'msg-push')
import patientsRouters from './patients' import patientsRouters from './patients'
import followRouters from './follow' import followRouters from './follow'
const reportLis = r => require.ensure([], () => r(require('../views/learning/report-list.vue')), 'report-list')
const itemList = r => require.ensure([], () => r(require('../views/learning/item-list.vue')), 'item-list')
const nameList = r => require.ensure([], () => r(require('../views/learning/name-list.vue')), 'name-list')
const dataAlignment = r => require.ensure([], () => r(require('../views/learning/data-alignment.vue')), 'data-alignment')
const courseTraining = r => require.ensure([], () => r(require('../views/learning/course-training.vue')), 'course-training')
export default [{ export default [{
path: '/', path: '/',
component: App, component: App,
...@@ -56,6 +60,21 @@ export default [{ ...@@ -56,6 +60,21 @@ export default [{
},{ },{
path: '/item-role', path: '/item-role',
component: itemRole component: itemRole
},{
path: '/report-list',
component: reportLis
},{
path: '/item-list',
component: itemList
},{
path: '/data-alignment',
component: dataAlignment
},{
path: '/name-list',
component: nameList
},{
path: '/course-training',
component: courseTraining
}, },
{ {
path: '/msg-push', path: '/msg-push',
......
src/utils/env-config.js
浏览文件 @ 38fc3a73
...@@ -3,12 +3,12 @@ ...@@ -3,12 +3,12 @@
*/ */
export const envConfig = { export const envConfig = {
development: { development: {
// baseUrl: 'https://dev-sc.yunqueyi.com/',
// // baseUrl: 'http://10.177.15.180:10202/', // // baseUrl: 'http://10.177.15.180:10202/',
// // baseUrl: 'http://192.168.140.14:10201/', // // baseUrl: 'http://192.168.140.14:10201/',
// baseUrl: 'https://test1-sc.yunqueyi.com/', // baseUrl: 'https://test1-sc.yunqueyi.com/',
//baseUrl: 'https://uat-sc.yunqueyi.com/', //baseUrl: 'https://uat-sc.yunqueyi.com/',
// baseUrl: 'http://10.177.15.150:11905/',
baseUrl: 'https://dev-sc.yunqueyi.com/', baseUrl: 'https://dev-sc.yunqueyi.com/',
apiUrl: 'https://dev-api.yunqueyi.com/', apiUrl: 'https://dev-api.yunqueyi.com/',
qiniuFileUrl: "https://dev-sc.yunqueyi.com/contents/admin/qiniu/token1", qiniuFileUrl: "https://dev-sc.yunqueyi.com/contents/admin/qiniu/token1",
......
src/utils/filter.js
浏览文件 @ 38fc3a73
...@@ -157,6 +157,13 @@ const vueFilter = { ...@@ -157,6 +157,13 @@ const vueFilter = {
return '普通用户' return '普通用户'
} }
}, },
joinTraining: (value) => {
if(value == "1") {
return '是'
}else {
return '否'
}
},
} }
export default vueFilter export default vueFilter
\ No newline at end of file
src/utils/operation.js
浏览文件 @ 38fc3a73
...@@ -28,7 +28,7 @@ export function getIntersect(a, b) { ...@@ -28,7 +28,7 @@ export function getIntersect(a, b) {
//获取id的list //获取id的list
export function getIdList(data) { export function getIdList(data) {
let list = []; let list = [];
if(typeof data === 'undefined') { if (typeof data === 'undefined') {
return list; return list;
} }
if (data.constructor === Array) { if (data.constructor === Array) {
...@@ -208,7 +208,7 @@ function addEmpty(data) { ...@@ -208,7 +208,7 @@ function addEmpty(data) {
label: "全部地区", label: "全部地区",
value: "0", value: "0",
} }
for(let i=0;i<data.length;i++) { for (let i = 0; i < data.length; i++) {
after.push(data[i]); after.push(data[i]);
} }
return after; return after;
...@@ -236,7 +236,7 @@ export function getEcologyList() { ...@@ -236,7 +236,7 @@ export function getEcologyList() {
cityName: '上海市', cityName: '上海市',
countyName: '浦东新区', countyName: '浦东新区',
townName: '--', townName: '--',
},{ }, {
id: '124', id: '124',
name: '上海第二人民医院', name: '上海第二人民医院',
hospitalLevelName: '二甲医院', hospitalLevelName: '二甲医院',
...@@ -244,7 +244,7 @@ export function getEcologyList() { ...@@ -244,7 +244,7 @@ export function getEcologyList() {
cityName: '上海市', cityName: '上海市',
countyName: '浦东新区', countyName: '浦东新区',
townName: '--', townName: '--',
},{ }, {
id: '125', id: '125',
name: '上海第三人民医院', name: '上海第三人民医院',
hospitalLevelName: '二甲医院', hospitalLevelName: '二甲医院',
...@@ -255,7 +255,7 @@ export function getEcologyList() { ...@@ -255,7 +255,7 @@ export function getEcologyList() {
}] }]
return dataList; return dataList;
} }
export function getEcologySelect (data) { export function getEcologySelect(data) {
// let ecologyist = [{ // let ecologyist = [{
// label: '上海小生态', // label: '上海小生态',
// value: '1', // value: '1',
...@@ -264,7 +264,7 @@ export function getEcologySelect (data) { ...@@ -264,7 +264,7 @@ export function getEcologySelect (data) {
// value: '2', // value: '2',
// }]; // }];
let ecologyist = []; let ecologyist = [];
for(let i=0;i<data.length;i++) { for (let i = 0; i < data.length; i++) {
let obj = { let obj = {
label: data[i].name, label: data[i].name,
value: data[i].id, value: data[i].id,
...@@ -272,4 +272,96 @@ export function getEcologySelect (data) { ...@@ -272,4 +272,96 @@ export function getEcologySelect (data) {
ecologyist.push(obj); ecologyist.push(obj);
} }
return ecologyist; return ecologyist;
}
export function isOverlap(startA,endA,startB,endB) {
let maxStart = Math.max(startA,startB);
let minEnd = Math.min(endA,endB);
console.log('maxStart',maxStart,'minEnd',minEnd);
if(maxStart <= minEnd) {
return true;
} else {
return false;
}
}
export function getRegionOption() {
let option = [{
value: 'zhejiang',
label: '浙江',
children: [{
value: 'hangzhou',
label: '杭州',
children: [{
value: 'xihu',
label: '西湖区'
}, {
value: 'donghu',
label: '东湖区'
}]
}]
}];
return option;
}
export function getPicOption(title,legendData, colorData, seriesData) {
let option = {
title: {
text: title,
x: "center"
},
legend: {
orient: "vertical",
left: "left",
data: legendData
},
color: colorData,
backgroundColor: '#F3F3F3',
series: [
{
name: "",
type: "pie",
// radius: "55%",
center: ["50%", "60%"],
data: seriesData,
}
]
};
return option;
}
export function getBarOption(xAxisData, seriesData) {
let option = {
title: {
text: "用户年龄发布",
x: "center"
},
color: ['#3398DB'],
backgroundColor: '#F3F3F3',
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
data: xAxisData,
// axisTick: {
// alignWithLabel: true
// }
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '',
type: 'bar',
barWidth: '75%',
data: seriesData,
}
]
};
return option;
} }
\ No newline at end of file
src/views/education/add-manager.vue
浏览文件 @ 38fc3a73
此差异已折叠。
src/views/layout/slidebar.vue
浏览文件 @ 38fc3a73
...@@ -65,7 +65,6 @@ ...@@ -65,7 +65,6 @@
title: '数据总览', title: '数据总览',
icon: 'el-icon-menu', icon: 'el-icon-menu',
index: 'home', index: 'home',
},{ },{
title: '教培项目', title: '教培项目',
icon: 'el-icon-message', icon: 'el-icon-message',
...@@ -161,7 +160,6 @@ ...@@ -161,7 +160,6 @@
} }
}, },
methods: { methods: {
setFollowSide(){ setFollowSide(){
const followSider = { const followSider = {
title: '随访管理', title: '随访管理',
...@@ -192,11 +190,9 @@ ...@@ -192,11 +190,9 @@
utils.checkAuthFunc().then(res=>{ utils.checkAuthFunc().then(res=>{
console.log(res) console.log(res)
if(res==3){ if(res==3){
}else{ }else{
return return
} }
let env = process.env.BUILD_ENV; let env = process.env.BUILD_ENV;
let src = ''; let src = '';
if( (env == 'development') || (env == 'dev') ){ // 本地开发环境 || jenkins dev if( (env == 'development') || (env == 'dev') ){ // 本地开发环境 || jenkins dev
...@@ -211,11 +207,8 @@ ...@@ -211,11 +207,8 @@
location.href = src; location.href = src;
// let newTab=window.open('about:blank'); // let newTab=window.open('about:blank');
// newTab.location = src; // newTab.location = src;
}) })
} }
}, },
} }
} }
...@@ -280,5 +273,3 @@ ...@@ -280,5 +273,3 @@
} }
} }
</style> </style>
src/views/learning/course-analysis.vue 0 → 100644
浏览文件 @ 38fc3a73
<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 class="weight">{{ item.num }} </span> {{ item.unit }}
</div>
</el-card>
</div>
<el-table
:data="tableData"
class="course-table">
<el-table-column prop="name" label="课程名" align="center">
</el-table-column>
<el-table-column prop="courseTime" label="课程时长" align="center">
</el-table-column>
<el-table-column prop="personTime" label="人均学习时长" align="center">
</el-table-column>
<el-table-column prop="joinNum" label="参与培训人数" align="center">
</el-table-column>
<el-table-column prop="completeNum" 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="primary"
size="small"
>查看名单</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="formInline.pageNo"
:page-sizes="[10, 30, 50, 100]"
:page-size="formInline.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</template>
<script>
import { create } from "domain";
import { openLoading, closeLoading } from "../../utils/utils";
let vm = null;
export default {
props: {
formInline: {
type: Object
},
activeName: {
type: String
}
},
data() {
return {
cardData: [],
tableData: [],
totalRows: 0,
}
},
created() {
vm = this;
this.getCardData();
this.search();
},
mounted: function() {
this.$on('search',()=>{
console.log(this.formInline);
this.getCardData();
this.search();
})
},
methods: {
getCardData() {
this.cardData = [
{
title: '项目所有课程数',
num: 9,
unit: '门课程',
},{
title: '项目所有课程总时长',
num: 500,
unit: '分钟',
},{
title: '项目人均学习时长',
num: 265,
unit: '分钟',
}
];
},
search() {
this.tableData = [{
id: 1,
name: '科学诊治高血压',
courseTime: '120分钟',
personTime: '90分钟',
joinNum: '9892',
completeNum: '5992',
},{
id: 2,
name: '科学诊心脏病',
courseTime: '120分钟',
personTime: '90分钟',
joinNum: '9892',
completeNum: '5992',
}];
},
checkName(data) {
this.$router.push("course-training");
},
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
this.formInline.pageSize = val;
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.formInline.pageNo = val;
this.search();
},
},
}
</script>
<style lang="scss">
.course-analysis-wrap {
background: #fff;
padding: 10px;
.weight {
font-weight: bold;
}
.title:after {
clear: both
}
.box-card {
width: 240px;
margin-right: 30px;
float: left;
.box-content {
text-align: center;
height: 40px;
}
}
.course-table {
top: 20px;
}
}
</style>
\ No newline at end of file
src/views/learning/course-training.vue 0 → 100644
浏览文件 @ 38fc3a73
<template>
<div class="course-training-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<p class="course-p">地区：{{ region }}</p>
<p class="course-p">选择机构：{{ organization }}</p>
<div class="course-search">
<el-input placeholder="查询姓名" v-model="formData.name" class="input-with-select">
<el-button class="course-button" type="primary" slot="append" @click="search">查询</el-button>
</el-input>
</div>
<el-table
:data="tableData"
class="course-table">
<el-table-column prop="name" label="姓名" align="center">
</el-table-column>
<el-table-column prop="sex" label="性别" align="center">
</el-table-column>
<el-table-column prop="age" label="年龄" align="center">
</el-table-column>
<el-table-column prop="professional" label="职称" align="center">
</el-table-column>
<el-table-column prop="post" label="职务" align="center">
</el-table-column>
<el-table-column prop="organization" label="机构" align="center">
</el-table-column>
<el-table-column prop="region" label="地区" align="center">
</el-table-column>
<el-table-column prop="join" label="是否参与培训" align="center">
<template slot-scope="scope">
<span>{{ scope.row.join | joinTraining }}</span>
</template>
</el-table-column>
<el-table-column prop="complete" label="是否完成培训" align="center">
<template slot-scope="scope">
<span>{{ scope.row.complete | joinTraining }}</span>
</template>
</el-table-column>
<el-table-column prop="date" label="完成培训日期" align="center">
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="formData.pageNo"
:page-sizes="[10, 30, 50, 100]"
: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";
let vm = null;
export default {
components: {
BreadCrumb
},
props: {
formInline: {
type: Object
}
},
data() {
return {
curmbFirst: "学情报告",
curmbSecond: "项目管理",
formData: {
name: '',
pageNo: 1,
pageSize: 10,
},
region: '浙江省/杭州市/西湖区',
organization: '杭州市中心医院',
tableData: [],
totalRows: 0,
};
},
// computed: {
// ...mapGetters([
// "_token",
// ])
// },
created() {
vm = this;
// console.log("formInline:", this.formInline);
this.search();
},
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
search() {
console.log(this.formData.name);
this.tableData = [{
name: '张三',
sex: '男',
age: '30',
professional: '主任医师',
post: '医生',
organization: '上海复旦大学附属华山医院',
region: '上海静安区',
join: '1',
complete: '1',
date: '2019-10-11',
}];
},
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
this.formData.pageSize = val;
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.formData.pageNo = val;
this.search();
},
}
};
</script>
<style lang="scss">
.course-training-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;
}
.course-search {
margin: 35px auto;
width: 800px;
}
.course-button {
color: #fff;
}
}
}
</style>
\ No newline at end of file
src/views/learning/crowd-analysis.vue 0 → 100644
浏览文件 @ 38fc3a73
<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 class="chart">
<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
}
},
data() {
return {
radio: 1,
updateCrowd: false,
sexData: []
};
},
created() {
vm = this;
this.$nextTick(function() {
this.search();
});
},
mounted: function() {
commonUtil.resizeHeight();
//父组件传值
this.$on("search", () => {
this.updateCrowd = true;
this.search();
});
this.$on("init", () => {
this.$nextTick(function() {
this.search();
});
});
if (this.activeName == "second") {
this.updateResize();
}
},
methods: {
search() {
if (this.activeName == "second") {
this.getEducationData();
this.getJobData();
this.getSexData();
this.getAgeData();
}
},
updateResize() {
this.$nextTick(function() {
let chartEducation = echarts.init(document.getElementById("education"));
let chartJob = echarts.init(document.getElementById("job"));
let chartAge = echarts.init(document.getElementById("age"));
window.onresize = function() {
chartEducation.resize();
chartJob.resize();
chartAge.resize();
};
});
},
updateRadio(value) {
console.log(value);
this.search();
},
//用户学历分布
getEducationData() {
let data = [22, 50, 350, 80, 95];
if (this.updateCrowd == true) {
data = [33, 90, 100, 22, 75];
}
this.educationDivision(data);
},
//用户职务分布
getJobData() {
let data = [27, 70, 65, 50];
this.jobDivision(data);
},
//用户性别分布
getSexData() {
this.sexData = [
{
src: require("../../assets/image/man.png"),
type: "男性",
num: 21715
},
{
src: require("../../assets/image/weman.png"),
type: "女性",
num: 19715
},
{
src: require("../../assets/image/question.png"),
type: "未完善信息",
num: 1715
}
];
},
//用户年龄分布
getAgeData() {
let data = [1000, 25000, 15000, 8000, 7000, 500];
this.ageDivision(data);
},
educationDivision(data) {
let myChart = echarts.init(this.$refs.education);
let legendData = ["博士", "硕士", "本科", "大专", "大专以下"];
let colorData = ["#FF9F7F", "#FFDB5C", "#E062AE", "#37A2DA", "#67E0E3"];
let seriesData = [
{ value: 22, name: "博士" },
{ value: 50, name: "硕士" },
{ value: 350, name: "本科" },
{ value: 80, name: "大专" },
{ value: 95, name: "大专以下" }
];
for (let i = 0; i < data.length; i++) {
seriesData[i].value = data[i];
}
let option = operationData.getPicOption(
"用户学历分布",
legendData,
colorData,
seriesData
);
myChart.setOption(option);
},
jobDivision(data) {
let myChart = echarts.init(this.$refs.job);
let legendData = ["医生", "护士", "医护人员", "其他"];
let colorData = ["#FF9F7F", "#37A2DA", "#67E0E3", "#FFDB5C"];
let seriesData = [
{ value: 270, name: "医生" },
{ value: 70, name: "护士" },
{ value: 65, name: "医护人员" },
{ value: 50, name: "其他" }
];
for (let i = 0; i < data.length; i++) {
seriesData[i].value = data[i];
}
let option = operationData.getPicOption(
"用户职务分布",
legendData,
colorData,
seriesData
);
myChart.setOption(option);
},
ageDivision(data) {
let myChart = echarts.init(this.$refs.age);
let xAxisData = [
"16-30",
"30-40",
"40-50",
"50-60",
"60以上",
"未完善信息"
];
let seriesData = data;
let option = operationData.getBarOption(xAxisData, seriesData);
myChart.setOption(option);
}
}
};
</script>
<style lang="scss">
.crowd-analysis-wrap {
background: #fff;
padding: 10px;
.header-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.crowd-radio {
position: relative;
left: 50%;
margin-left: -119px;
.is-active {
.el-radio-button__inner {
// background: #fff;
// color: #409EFF;
}
}
}
.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: 10px auto;
text-align: center;
font-weight: bold;
}
.sex {
position: relative;
top: 0;
left: 0;
.sex-item {
float: left;
height: 350px;
width: 33.3%;
.sex-img {
margin: 0 auto;
position: relative;
left: 10%;
width: 80%;
}
.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
src/views/learning/data-alignment.vue 0 → 100644
浏览文件 @ 38fc3a73
<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">保存修改</el-button>
</el-col>
<el-col :span="3">
<el-button class="add-button" size="small" type="primary">取消</el-button>
</el-col>
</el-row>
</div>
<div class="form">
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<el-form ref="serchForm" :model="formInline" label-width="100px" style="width:100%;">
<el-col :span="6">
<el-form-item label="参与项目状态:">
<el-select
v-model="formInline.pregStatus"
size="small"
style="width: 100%;"
placeholder="请选择项目状态"
>
<el-option
v-for="(item,index) in preStaSelect"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="统计状态:">
<el-select
v-model="formInline.mathStatus"
size="small"
style="width: 100%;"
placeholder="请选择统计状态"
>
<el-option
v-for="(item,index) in mathStaSelect"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-form>
</el-row>
</div>
<div class="data-main">
<el-row class="select" type="flex" justify="end">
<el-col :span="3">
<div class="title">已选中{{multipleSelection.length}}条数据</div>
</el-col>
<el-col :span="3">
<el-button class="add-button" size="small" @click="includeMath">全部归入统计</el-button>
</el-col>
<el-col :span="3">
<el-button class="add-button" size="small" @click="removeMath">全部移出统计</el-button>
</el-col>
</el-row>
<el-table
border
center
ref="multipleTable"
:data="mathDate"
tooltip-effect="dark"
style="width: 100%"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column prop="name" label="姓名" min-width="80"></el-table-column>
<el-table-column prop="joinStatus" label="项目参与状态" width="120"></el-table-column>
<el-table-column prop="progress" label="所属机构" min-width="120" show-overflow-tooltip></el-table-column>
<el-table-column prop="desk" label="科室" show-overflow-tooltip></el-table-column>
<el-table-column prop="rank" label="级别" show-overflow-tooltip></el-table-column>
<el-table-column prop="province" label="省/直辖市" show-overflow-tooltip></el-table-column>
<el-table-column prop="city" label="市" show-overflow-tooltip></el-table-column>
<el-table-column prop="district" label="区/县" show-overflow-tooltip></el-table-column>
<el-table-column prop="address" label="乡镇/街道" show-overflow-tooltip></el-table-column>
<el-table-column fixed="right" label="操作" min-width="180">
<template slot-scope="scope">
<el-radio v-model="scope.row.radio" label="1" @change="handleClick(scope.row)">归入统计</el-radio>
<el-radio v-model="scope.row.radio" label="2" @change="handleClick(scope.row)">移除统计</el-radio>
</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="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</template>
<script>
let vm
export default {
data() {
return {
formInline: {
pregStatus: "",
mathStatus: ""
},
preStaSelect: [
//项目状态
{
label: "未参与项目",
value: "1"
},
{
label: "参与项目",
value: "2"
},
{
label: "完成项目",
value: "3"
}
],
mathStaSelect: [
//项目状态
{
label: "归入统计",
value: "1"
},
{
label: "移除统计",
value: "2"
}
],
mathDate: [
{
name: "张医生",
joinStatus: "完成项目",
progress: "谈西社区卫生服务站",
desk: "全科",
rank: "一甲",
province: "河北省",
city: "石家庄市",
district: "长安区",
address: "建北街道",
radio: '1'
}
],
multipleSelection: [], //被选中的行
totalRows: 0, //数据总数
pageNo: 1, //当前是第几页
pageSize: 20 //页面总数
};
},
created() {
vm = this
},
methods: {
// 将选中行放入数组
handleSelectionChange(val) {
this.multipleSelection = val
console.log(this.multipleSelection)
},
handleClick(row) {
console.log(row);
},
// 更改数据显示数量
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
},
// 换页
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
},
// 全部统计
includeMath() {
if (!this.multipleSelection) {
return;
}
this.multipleSelection.forEach(el => {
el.radio = '1'
})
},
// 全部不统计
removeMath() {
if (!this.multipleSelection) {
return;
}
this.multipleSelection.forEach(el => {
el.radio = '2'
})
}
}
};
</script>
<style lang='scss' rel='stylesheet/scss'>
.data-alignment {
background: #fff;
.alignment-header {
padding: 20px;
margin: 0 30px;
border-bottom: 1px solid #000;
}
.form {
padding: 30px;
}
.data-main {
padding: 0 40px;
.select {
margin-bottom: 30px;
}
}
}
</style>
src/views/learning/examination-analysis.vue 0 → 100644
浏览文件 @ 38fc3a73
<template>
<div class="examination-analysis">
<div class="box">
<el-card class="box-card" v-for="(item , index) in cardData" :key="index">
<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>
<div class="table">
<el-table :data="tableData" style="width: 100%" border>
<el-table-column prop="name" label="考试名" min-width="200" align="center"></el-table-column>
<el-table-column prop="joinNum" label="参与考试人数" min-width="100" align="center"></el-table-column>
<el-table-column prop="passNum" label="通过考试人数" min-width="80" align="center"></el-table-column>
<el-table-column prop="goodNum" label="成绩优秀人数" min-width="80" align="center"></el-table-column>
<el-table-column prop="startNum" label="成绩合格人数" min-width="80" align="center"></el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="200">
<template slot-scope="scope">
<el-button 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>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="searchParam.pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="searchParam.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";
let vm
export default {
data() {
return {
tableData: [
{
name: "asd",
joinNum: 123123,
passNum: 123,
goodNum: 12,
startNum: 111
}
],
cardData: [
{
title: "项目所有考试数",
num: 9,
unit: "门考试"
},
{
title: "项目所有考题数",
num: 120,
unit: "道题"
}
],
totalRows: 0, //数据总数
searchParam: {
pageNo: 1, //当前是第几页
pageSize: 20, //页面总数
}
};
},
created() {
vm = this
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
// 搜索列表
search(flag) {
if(flag) vm.searchParam.pageNo = 1
openLoading(vm);
let params = {};
vm.GET(url, params).then(res => {
closeLoading(vm);
if (res.code == "000000") {
} else {
vm.$message.info(res.message);
}
});
},
// 跳转查看名单页面
go(row) {
vm.$router.push('/name-list')
},
// 更改数据显示数量
handleSizeChange(val) {
console.log(`每页 ${val} 条`)
vm.searchParam.pageSize = val
vm.search()
},
// 换页
handleCurrentChange(val) {
console.log(`当前页: ${val}`)
vm.searchParam.pageNo = value
vm.search()
}
}
};
</script>
<style lang='scss' rel='stylesheet/scss'>
.examination-analysis {
background: #fff;
.box {
overflow: hidden;
}
.table {
margin-top: 30px;
}
}
</style>
src/views/learning/item-list.vue 0 → 100644
浏览文件 @ 38fc3a73
<template>
<div class="course-analysis-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<el-form ref="formInline" :model="formInline" label-width="75px" style="width:100%;">
<el-col :span="5">
<el-form-item label="选择地区：">
<el-cascader
:options="optionsRegion"
v-model="formInline.region"
@change="handleChange"
></el-cascader>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="选择日期：">
<el-date-picker
v-model="formInline.date"
size="small"
type="daterange"
placeholder="请选择开始时间"
range-separator="~"
value-format="yyyy-MM-dd 00:00:00"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="default" size="small" @click="reset">重置</el-button>
<el-button type="primary" size="small" @click="search" style="margin-left:0;">查询</el-button>
</el-col>
</el-form>
</el-row>
<el-row>
<el-col :span="5">
<el-form ref="formInline" :model="formInline" label-width="75px" style="width:100%;">
<el-form-item label="选择机构：">
<el-select
size="small"
v-model="formInline.organization"
placeholder="请选择发布状态"
@change="changeOrganization"
>
<el-option
v-for="item in organizationList"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
</el-form>
</el-col>
</el-row>
<div class="choose">{{ chooseOrganization }}</div>
<div class="button-group">
<el-button type="default" size="small" @click="exportExcel">导出Excel</el-button>
<el-button type="default" size="small" @click="changeDate" v-if="activeName=='first'">数据调整</el-button>
<el-button type="default" size="small" @click="update" v-else>修改范围</el-button>
<el-button type="primary" size="small" @click="release">发布报告</el-button>
</div>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="参与情况" name="first">
<part-in></part-in>
</el-tab-pane>
<el-tab-pane label="人群分析" name="second">
<crowd-analysis ref="childCrowd" :formInline="formInline" :activeName="activeName">
</crowd-analysis>
</el-tab-pane>
<el-tab-pane label="课程分析" name="third">
<course-analysis ref="childCourse" :formInline="formInline" :activeName="activeName">
</course-analysis>
</el-tab-pane>
<el-tab-pane label="考试分析" name="fourth">
<examination-analysisfrom></examination-analysisfrom>
</el-tab-pane>
<el-tab-pane label="学习效果分析" name="fifth" lazy>
<learning-effect></learning-effect>
</el-tab-pane>
</el-tabs>
</div>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import CourseAnalysis from "./course-analysis.vue";
import CrowdAnalysis from "./crowd-analysis.vue";
import PartIn from './part-in.vue';
import ExaminationAnalysisfrom from './examination-analysis.vue';
import LearningEffect from './learning-effect.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';
let vm = null;
export default {
components: {
BreadCrumb,
CourseAnalysis,
CrowdAnalysis,
PartIn,
ExaminationAnalysisfrom,
LearningEffect
},
data() {
return {
curmbFirst: "学情报告",
curmbSecond: "项目列表",
organizationList: [
{
label: "西湖区第二人民医院",
value: "1"
},
{
label: "杭州市中医院",
value: "2"
}
],
chooseOrganization: "",
optionsRegion: [],
formInline: {
region: [],
date: "",
organization: "",
pageNo: 1,
pageSize: 10
},
activeName: "first"
};
},
computed: {
...mapGetters([
"_token"
// "idType",
// "masterAdministratorFlag"
])
},
created() {
vm = this;
this.getRegionOption();
},
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
handleClick(tab, event) {
//console.log(tab, event);
console.log('activeName',this.activeName);
if(tab.name == "second") {
this.$refs.childCrowd.$emit("init");
}
},
handleChange(value) {
console.log(value);
},
changeOrganization(value) {
for (let i = 0; i < this.organizationList.length; i++) {
if (value == this.organizationList[i].value) {
this.chooseOrganization = this.organizationList[i].label;
}
}
},
getRegionOption() {
this.optionsRegion = operationData.getRegionOption();
},
search() {
//console.log(this.formInline,this.activeName);
if (this.activeName == "first") {
} 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") {
} else if (this.activeName == "fifth") {
}
},
reset() {},
exportExcel() {
console.log('excel');
},
update() {},
release() {},
changeDate() {
this.$router.push('/data-alignment')
}
}
};
</script>
<style lang="scss">
.course-analysis-wrap {
.component-content {
background: #fff;
padding: 10px;
.header-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.button-group {
// position: absolute;
// right: 100px;
float: right;
margin-right: 20px;
}
.choose {
font-size: 12px;
margin-bottom: 20px;
}
.el-tabs__item.is-active {
color: #409eff;
}
.el-tabs__header {
width: 81%;
}
}
}
</style>
\ No newline at end of file
src/views/learning/learning-effect.vue 0 → 100644
浏览文件 @ 38fc3a73
<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>
src/views/learning/name-list.vue 0 → 100644
浏览文件 @ 38fc3a73
<template>
<div class="name-list">
<el-card class="where">
<p>地区: {{params.address}}</p>
<p>选择机构: {{params.pregress}}</p>
<el-row :gutter="20" class="input-box">
<el-col :span="12" :offset="6">
<el-input placeholder="查询姓名" v-model="name" class="input-search">
<el-button slot="append" class="search-btn" type="primary">查询</el-button>
</el-input>
</el-col>
</el-row>
</el-card>
<el-card>
<el-table :data="joinData" style="width: 100%">
<el-table-column prop="name" label="姓名" min-width="80" align="center"></el-table-column>
<el-table-column prop="sex" label="性别" min-width="100" align="center"></el-table-column>
<el-table-column prop="age" label="年龄" min-width="80" align="center"></el-table-column>
<el-table-column prop="title" label="职称" min-width="80" align="center"></el-table-column>
<el-table-column prop="duty" label="职务" min-width="80" align="center"></el-table-column>
<el-table-column prop="pregress" label="机构" min-width="200" align="center"></el-table-column>
<el-table-column prop="region" label="地区" min-width="80" align="center"></el-table-column>
<el-table-column prop="join" label="是否参与考试" min-width="80" align="center"></el-table-column>
<el-table-column prop="pass" label="是否通过考试" min-width="80" align="center"></el-table-column>
<el-table-column prop="paddTime" label="通过考试日期" min-width="80" align="center"></el-table-column>
<el-table-column prop="level" label="考试成绩等级" min-width="80" align="center"></el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png">
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
</el-card>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="searchParam.pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="searchParam.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</template>
<script>
export default {
data() {
return {
params: {
address: "浙江省/杭州市/西湖区",
pregress: "杭州市中医院、杭州市第七人民医院"
},
name: "",
joinData: [{
name: 'asd',
sex: '男',
age: 30,
title: '主任医师',
duty: '医生',
pregress: '上海市复旦大学附属华山医院',
region: '上海市徐汇区',
join: '是',
pass: '是',
paddTime: '2019-10-10',
level: '合格'
}],
totalRows: 0, //数据总数
searchParam: {
pageNo: 1, //当前是第几页
pageSize: 20 //页面总数
}
};
},
methods: {
// 搜索列表
search(flag) {
if(flag) vm.searchParam.pageNo = 1
openLoading(vm);
let params = {};
vm.GET(url, params).then(res => {
closeLoading(vm);
if (res.code == "000000") {
} else {
vm.$message.info(res.message);
}
});
},
// 重置搜索信息
resetMessage() {
this.selectProgress = {
status: "",
name: ""
};
vm.search();
},
// 更改数据显示数量
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
vm.searchParam.pageSize = val
vm.search()
},
// 换页
handleCurrentChange(val) {
console.log(`当前页: ${val}`)
vm.searchParam.pageNo = value
vm.search()
},
}
};
</script>
<style lang='scss' rel='stylesheet/scss'>
.name-list {
.where {
p {
line-height: 40px;
}
.input-box {
margin-top: 40px;
.search-btn {
color: #fff;
border: none;
}
}
}
}
</style>
src/views/learning/part-in.vue 0 → 100644
浏览文件 @ 38fc3a73
<template>
<div class="part-in">
<el-card>
<el-table :data="reportDetail" style="width: 100%">
<el-table-column prop="coverOrganizationNum" label="项目覆盖机构数" align="center"></el-table-column>
<el-table-column prop="coverPeopleNum" label="项目覆盖人数" align="center"></el-table-column>
<el-table-column prop="joinPeopleNum" label="项目参与人数" align="center"></el-table-column>
<el-table-column prop="finishPeopleNum" label="项目完成人数" align="center"></el-table-column>
<el-table-column prop="goodPeopleNum" label="成绩优秀人数" align="center"></el-table-column>
<el-table-column prop="standardPeopleNum" label="成绩合格人数" align="center"></el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png">
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
</el-card>
<div class="charts" ref="chartsBox" v-show="isShowEcharts"></div>
<el-card class="finish-table" v-show="!isShowEcharts">
<el-table :data="finishDetail" style="width: 100%" border>
<el-table-column prop="name" label="姓名" align="center"></el-table-column>
<el-table-column prop="desk" label="科室" align="center"></el-table-column>
<el-table-column prop="join" label="是否参与项目" align="center"></el-table-column>
<el-table-column prop="finish" label="是否完成项目" align="center"></el-table-column>
<el-table-column prop="endTime" label="完成项目日期" align="center"></el-table-column>
</el-table>
</el-card>
</div>
</template>
<script>
import { openLoading, closeLoading } from "../../utils/utils"
const echarts = require("echarts")
let vm;
export default {
data() {
return {
reportDetail: [
{
// 报告详情数据
coverOrganizationNum:2,
coverPeopleNum: 0,
joinPeopleNum: 0,
finishPeopleNum: 0,
goodPeopleNum: 0,
standardPeopleNum: 0
}
],
// 图表数据
chartOption: {
xAxisData: ["周一", "周二", "周三", "周一", "周二", "周三"],
seriesPass: [120, 132, 101, 120, 132, 101],
seriesJoin: [220, 182, 191, 220, 182, 191]
},
// 只有一个机构时显示人员完成情况
finishDetail:[{
name: '',
desk: '',
join: '是',
finish: '是',
endTime: '12-12-12'
}],
};
},
computed: {
isShowEcharts() {
return vm.reportDetail[0].coverOrganizationNum > 1
}
},
created() {
vm = this;
},
mounted() {
vm.initEcharts();
},
methods: {
// 初始化图表
initEcharts() {
openLoading(vm);
let myChart = echarts.init(vm.$refs["chartsBox"])
myChart.setOption(vm.initEchartOption(vm.chartOption))
closeLoading(vm)
},
// 图表参数
initEchartOption(params) {
// 图表相关的数据
let option = {
color: ['#1E90FF','#32CD32'],
title: {
text: "排行榜",
x: "left",
textStyle: {
//主标题文本样式{"fontSize": 18,"fontWeight": "bolder","color": "#333"}
fontSize: 20,
fontStyle: "normal",
fontWeight: "normal",
color: "#000"
}
},
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
}
},
legend: {
data: ["完成人数", "参与人数"],
bottom: 0
},
grid: {
left: "3%",
right: "4%",
bottom: "10%",
containLabel: true
},
xAxis: [
{
type: "category",
data: params.xAxisData
}
],
yAxis: [
{
type: "value"
}
],
series: [
{
name: "完成人数",
type: "bar",
stack: "人数",
barMaxWidth: "80",
data: params.seriesPass
},
{
name: "参与人数",
type: "bar",
stack: "人数",
barMaxWidth: "80",
data: params.seriesJoin
}
]
}
return option
}
}
};
</script>
<style lang='scss' rel='stylesheet/scss'>
.part-in {
.charts {
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;
margin-top: 50px;
padding: 20px;
}
.finish-table {
margin-top: 30px;
background: #fff;
}
}
</style>
src/views/learning/report-list.vue 0 → 100644
浏览文件 @ 38fc3a73
<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="selectProgress" label-width="75px" style="width:100%;">
<el-col :span="6">
<el-form-item label="项目状态:">
<el-select
v-model="selectProgress.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="selectProgress.name" size="small" placeholder="请输入项目名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="default" size="small" @click="resetMessage" style="margin-left:0;">重置</el-button>
<el-button type="primary" size="small" @click="search(1)">查询</el-button>
</el-col>
</el-form>
</el-row>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="name" label="项目名称" min-width="200" align="center"></el-table-column>
<el-table-column prop="status" label="项目状态" min-width="100" align="center"></el-table-column>
<el-table-column prop="startTime" label="开始时间" min-width="80" align="center"></el-table-column>
<el-table-column prop="endTime" label="结束时间" min-width="80" align="center"></el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="200">
<template slot-scope="scope">
<el-button 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>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="searchParam.pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="searchParam.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</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: "项目列表",
selectProgress: {
//搜索信息
status: "",
name: ""
},
statusSelect: [
//项目状态
{
label: "进行中",
value: "1"
},
{
label: "已结束",
value: "2"
}
],
tableData: [
// table数据
{
name: "one",
status: "进行中",
startTime: "12-12-12",
endTime: "23-23-23"
}
],
totalRows: 0, //数据总数
searchParam: {
pageNo: 1, //当前是第几页
pageSize: 20 //页面总数
}
};
},
components: {
BreadCrumb
},
created() {
vm = this;
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
// 搜索列表
search(flag) {
if(flag) vm.searchParam.pageNo = 1
openLoading(vm)
let params = {}
vm.GET(url, params).then(res => {
closeLoading(vm);
if (res.code == "000000") {
} else {
vm.$message.info(res.message)
}
})
},
// 重置搜索信息
resetMessage() {
this.selectProgress = {
status: "",
name: ""
};
vm.search()
},
// 更改数据显示数量
handleSizeChange(val) {
console.log(`每页 ${val} 条`)
vm.searchParam.pageSize = val
vm.search()
},
// 换页
handleCurrentChange(val) {
console.log(`当前页: ${val}`)
vm.searchParam.pageNo = value
vm.search()
},
//跳转到报告详情页
go(row) {
vm.$router.push({path:"/item-list",params: row})
}
}
};
</script>
<style lang="scss">
.item-list {
.itemlist-content {
padding: 10px;
background: #fff;
}
}
</style>
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或