Skip to content

P
pica-learning-report
提交 695eee7d 编写于 作者: guangjun.yang's avatar guangjun.yang
浏览文件
操作

对接其它三个tab的接口

上级 1aaf9201
展开全部 隐藏空白字符变更
内嵌 并排
正在显示 包含 2875 行增加 和 630 行删除
components/bussiness/charts/chart-column-horizontal-tc-long.vue
浏览文件 @ 695eee7d
......@@ -7,6 +7,16 @@
<script>
import { format } from "path";
let vm = null;
let paramData = [
"生活方\n式干预",
"生活方\n式",
"本科",
"大专",
"中专以下",
"大专",
"中专以下",
"中专以下"
];
export default {
props: {
id: {
......@@ -31,7 +41,7 @@ export default {
"生活方\n式",
"本科",
"大专",
"中专以下",
"中专以下",
"大专",
"中专以下",
"中专以下"
......@@ -41,34 +51,10 @@ export default {
data() {
return {
chartWidth: "300px",
chartHeight: "350px"
};
},
created() {
if (process.client) {
let clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
// this.chartWidth = (clientWidth * ).toFixed(0) + "px";
this.chartWidth = clientWidth + "px";
console.log(clientWidth);
this.chartHeight = 54 * this.paramData.length + "px";
}
},
mounted() {
vm = this;
this.drawColumn();
},
methods: {
// 画
drawColumn() {
// 基于准备好的dom，初始化echarts实例
let chartColumn = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
let options = {
color: vm.colors,
chartHeight: "350px",
options: {
// color: vm.colors,
color: ["#FFB01B", "#39AF9A"],
tooltip: {
trigger: "axis",
axisPointer: {
......@@ -120,7 +106,7 @@ export default {
yAxis: {
axisTick: false,
type: "category",
data: vm.paramData,
data: paramData,
textStyle: {
fontSize: 12,
color: "#676869"
......@@ -171,8 +157,135 @@ export default {
}
}
]
};
chartColumn.setOption(options);
}
};
},
created() {
if (process.client) {
let clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = clientWidth + "px";
this.chartHeight = 54 * this.paramData.length + "px";
}
},
mounted() {
vm = this;
this.drawColumn();
},
methods: {
// 画
drawColumn() {
// 基于准备好的dom，初始化echarts实例
let chartColumn = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
// let options = {
// color: vm.colors,
// tooltip: {
// trigger: "axis",
// axisPointer: {
// // 坐标轴指示器，坐标轴触发有效
// type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
// }
// },
// legend: {
// show: false,
// top: 20,
// data: ["培训前正确率", "培训后正确率"],
// textStyle: {
// fontSize: 12,
// // fontWeight: "bolder",
// color: "#676869"
// }
// },
// grid: {
// top: "2%",
// left: "3%",
// right: "6%",
// bottom: "0%",
// containLabel: true,
// borderWidth: 0
// },
// lineStyle: {
// color: "#fff"
// },
// xAxis: {
// axisTick: false,
// type: "value",
// axisLabel: {
// show: false,
// formatter: "{value}",
// textStyle: {
// color: "#676869"
// }
// },
// axisLine: {
// lineStyle: {
// color: "#676869",
// width: 0
// }
// },
// splitLine: {
// show: false
// }
// },
// yAxis: {
// axisTick: false,
// type: "category",
// data: vm.paramData,
// textStyle: {
// fontSize: 12,
// color: "#676869"
// },
// splitLine: {
// show: false
// },
// axisLabel: {
// formatter: "{value}",
// textAlign: "left",
// textStyle: {
// textAlign: "left",
// color: "#676869"
// }
// },
// axisLine: {
// lineStyle: {
// color: "#676869",
// width: 0
// }
// }
// },
// series: [
// {
// name: "培训前正确率",
// data: [12, 200, 150, 80, 70, 110, 130, 130],
// type: "bar",
// barWidth: 15, //柱图宽度
// label: {
// normal: {
// formatter: "{c}%",
// show: true,
// position: "inside"
// }
// }
// },
// {
// name: "培训后正确率",
// data: [120, 20, 160, 80, 70, 110, 130, 130],
// type: "bar",
// barWidth: 15, //柱图宽度
// label: {
// normal: {
// formatter: "{c}%",
// show: true,
// position: "inside"
// }
// }
// }
// ]
// };
chartColumn.setOption(this.options);
}
}
};
......
components/bussiness/charts/chart-column-horizontal-tc.vue
浏览文件 @ 695eee7d
......@@ -6,9 +6,13 @@
</template>
<script>
import { format } from "path";
let vm = null;
let vm = null, chartColumn = null;
export default {
props: {
dataList: {
type: Array,
default: () => []
},
id: {
type: String,
default: "chartColumnTCId"
......@@ -19,9 +23,7 @@ export default {
"#FFB01B",
"#39AF9A",
"#5D7092",
"#FF9A4B",
"#abb7bb",
"#76d2d2"
"#FF9A4B"
]
}
},
......@@ -38,18 +40,37 @@ export default {
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(0) + 'px';
console.log(clientWidth);
}
},
watch: {
dataList: {
handler(newVal) {
let yAxisData = [], series0Data = [], series1Data = []
yAxisData = newVal.map( item => {
return item.classifyName
})
series0Data = this.dataList.map( item => {
return item.beforeRate
})
series1Data = this.dataList.map( item => {
return item.afterRate
})
this.drawColumn(yAxisData.splice(0, 5), series0Data.splice(0, 5), series1Data.splice(0, 5));
},
deep: false
}
},
mounted() {
vm = this;
this.drawColumn();
this.drawColumn([], [], []);
},
methods: {
// 画
drawColumn() {
drawColumn(yAxisData, series0Data, series1Data) {
// 基于准备好的dom，初始化echarts实例
let chartColumn = this.$echarts.init(document.getElementById(this.id));
chartColumn = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
let options = {
color: vm.colors,
......@@ -97,7 +118,8 @@ export default {
yAxis: {
axisTick: false,
type: "category",
data: ["生活方\n式干预", "生活方\n式", "本科", "大专", "中专以下"],
data: yAxisData,
// data: ["生活方\n式干预", "生活方\n式", "本科", "大专", "中专以下"],
textStyle: {
fontSize: 12,
color: "#676869"
......@@ -120,13 +142,15 @@ export default {
series: [
{
name: "培训前正确率",
data: [12, 200, 150, 80, 70, 110, 130],
data: series0Data,
// data: [12, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 15 //柱图宽度
},
{
name: "培训后正确率",
data: [120, 20, 160, 80, 70, 110, 130],
data: series1Data,
// data: [120, 20, 160, 80, 70, 110, 130],
type: "bar",
barWidth: 15 //柱图宽度
}
......
components/bussiness/charts/chart-column-vertical copy.vue 0 → 100644
浏览文件 @ 695eee7d
<!-- 柱状图-竖向 -->
<template>
<section class="chart-pie">
<div :id="id" :style="{width: chartWidth, height: chartHeight}"></div>
</section>
</template>
<script>
import { format } from "path";
let vm = null;
export default {
props: {
id: {
type: String,
default: "chartColumnId"
},
colors: {
type: Array,
default: () => [
"#FFB01B",
"#39AF9A",
"#5D7092",
"#FF9A4B",
"#abb7bb",
"#76d2d2"
]
}
},
data() {
return {
chartWidth: "300px",
chartHeight: "235px"
};
},
created() {
if (process.client) {
let clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(0) + 'px';
console.log(clientWidth);
// if (clientWidth <= 320) {
// this.chartWidth = "260px";
// } else if (clientWidth <= 360) {
// this.chartWidth = "320px";
// } else if (clientWidth <= 375) {
// this.chartWidth = "340px";
// } else if (clientWidth <= 414) {
// this.chartWidth = "375px";
// } else {
// this.chartWidth = (clientWidth * 0.8).toFixed(0) + 'px';
// }
}
},
mounted() {
vm = this;
this.drawColumn();
},
methods: {
// 画
drawColumn() {
// 基于准备好的dom，初始化echarts实例
let chartColumn = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
let options = {
color: vm.colors,
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
}
},
// legend: {
// top: 20,
// data: ["获优秀人数", "获及格人数", "未获证人数"],
// textStyle: {
// fontSize: 12,
// // fontWeight: "bolder",
// color: "#676869"
// }
// },
grid: {
top: "10%",
left: "3%",
right: "6%",
bottom: "6%",
containLabel: true
},
lineStyle: {
color: "#676869"
},
yAxis: {
axisTick: false,
type: "value",
axisLabel: {
formatter: "{value}",
textStyle: {
color: "#676869"
}
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
},
xAxis: {
axisTick: false,
type: "category",
data: ["其他", "中专以下", "大专", "本科", "硕士"],
textStyle: {
fontSize: 12,
color: "#676869"
},
axisLabel: {
formatter: "{value}",
textStyle: {
color: "#676869"
}
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
},
series: [
{
name: "获优秀人数",
data: [120, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 20 //柱图宽度
}
]
};
chartColumn.setOption(options);
}
}
};
</script>
<style lang="scss" scoped>
.chart-pie {
position: relative;
top: -6px;
// height: 280px;
margin: 15px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.04);
border-radius: 6px;
border: 1px solid rgba(231, 232, 233, 1);
}
</style>
components/bussiness/charts/chart-column-vertical-score.vue 0 → 100644
浏览文件 @ 695eee7d
<!-- 柱状图-竖向 -->
<template>
<section class="chart-pie">
<div :id="id" :style="{width: chartWidth, height: chartHeight}"></div>
</section>
</template>
<script>
import { format } from "path";
let vm = null, chartColumn = null;
export default {
props: {
id: {
type: String,
default: "chartColumnId"
},
colors: {
type: Array,
default: () => [
"#FFB01B",
"#39AF9A",
"#5D7092",
"#FF9A4B",
]
},
dataList: {
tpye: Array,
default: () => []
}
},
data() {
return {
chartWidth: "300px",
chartHeight: "235px",
xAxisData: [],
seriesData: [],
options: {
color: ['#FFB01B'],
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
}
},
// legend: {
// top: 20,
// data: ["获优秀人数", "获及格人数", "未获证人数"],
// textStyle: {
// fontSize: 12,
// // fontWeight: "bolder",
// color: "#676869"
// }
// },
grid: {
top: "10%",
left: "3%",
right: "6%",
bottom: "6%",
containLabel: true
},
lineStyle: {
color: "#676869"
},
yAxis: {
axisTick: false,
type: "value",
axisLabel: {
formatter: "{value}",
textStyle: {
color: "#676869"
}
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
},
xAxis: {
axisTick: false,
type: "category",
data: [],
// data: ["其他", "中专以下", "大专", "本科", "硕士"],
textStyle: {
fontSize: 12,
color: "#676869"
},
axisLabel: {
formatter: "{value}",
textStyle: {
color: "#676869"
}
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
},
series: [
{
name: "考试人数",
data: [],
// data: [120, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 20 //柱图宽度
}
]
}
};
},
watch: {
dataList: {
handler(newVal) {
// debugger
this.xAxisData = newVal.map( item => {
return item.timesStr
})
this.seriesData = newVal.map( item => {
return item.count
})
this.options.xAxis.data = this.xAxisData;
this.options.series[0].data = this.seriesData;
chartColumn.setOption(this.options, true);
},
deep: true
}
},
created() {
if (process.client) {
let clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(0) + 'px';
console.log(clientWidth);
// if (clientWidth <= 320) {
// this.chartWidth = "260px";
// } else if (clientWidth <= 360) {
// this.chartWidth = "320px";
// } else if (clientWidth <= 375) {
// this.chartWidth = "340px";
// } else if (clientWidth <= 414) {
// this.chartWidth = "375px";
// } else {
// this.chartWidth = (clientWidth * 0.8).toFixed(0) + 'px';
// }
}
},
mounted() {
vm = this;
this.drawColumn();
},
methods: {
// 画
drawColumn() {
// 基于准备好的dom，初始化echarts实例
chartColumn = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
// let options = {
// color: vm.colors,
// tooltip: {
// trigger: "axis",
// axisPointer: {
// // 坐标轴指示器，坐标轴触发有效
// type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
// }
// },
// // legend: {
// // top: 20,
// // data: ["获优秀人数", "获及格人数", "未获证人数"],
// // textStyle: {
// // fontSize: 12,
// // // fontWeight: "bolder",
// // color: "#676869"
// // }
// // },
// grid: {
// top: "10%",
// left: "3%",
// right: "6%",
// bottom: "6%",
// containLabel: true
// },
// lineStyle: {
// color: "#676869"
// },
// yAxis: {
// axisTick: false,
// type: "value",
// axisLabel: {
// formatter: "{value}",
// textStyle: {
// color: "#676869"
// }
// },
// axisLine: {
// lineStyle: {
// color: "#efefef",
// width: 1
// }
// }
// },
// xAxis: {
// axisTick: false,
// type: "category",
// data: [],
// // data: ["其他", "中专以下", "大专", "本科", "硕士"],
// textStyle: {
// fontSize: 12,
// color: "#676869"
// },
// axisLabel: {
// formatter: "{value}",
// textStyle: {
// color: "#676869"
// }
// },
// axisLine: {
// lineStyle: {
// color: "#efefef",
// width: 1
// }
// }
// },
// series: [
// {
// name: "获优秀人数",
// data: [],
// // data: [120, 200, 150, 80, 70, 110, 130],
// type: "bar",
// barWidth: 20 //柱图宽度
// }
// ]
// };
chartColumn.setOption(this.options, true);
}
}
};
</script>
<style lang="scss" scoped>
.chart-pie {
position: relative;
top: -6px;
// height: 280px;
margin: 15px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.04);
border-radius: 6px;
border: 1px solid rgba(231, 232, 233, 1);
}
</style>
components/bussiness/charts/chart-column-vertical-tc.vue
浏览文件 @ 695eee7d
......@@ -6,9 +6,13 @@
</template>
<script>
import { format } from "path";
let vm = null;
let vm = null, chartColumn = null;
export default {
props: {
dataList: {
type: Array,
default: () => []
},
id: {
type: String,
default: "chartColumnTCId"
......@@ -20,8 +24,6 @@ export default {
"#39AF9A",
"#5D7092",
"#FF9A4B",
"#abb7bb",
"#76d2d2"
]
}
},
......@@ -41,15 +43,34 @@ export default {
console.log(clientWidth);
}
},
watch: {
dataList: {
handler(newVal) {
let yAxisData = [], series0Data = [], series1Data = []
yAxisData = newVal.map( item => {
return item.classifyName
})
series0Data = this.dataList.map( item => {
return item.beforeRate
})
series1Data = this.dataList.map( item => {
return item.afterRate
})
this.drawColumn(yAxisData.splice(0, 5), series0Data.splice(0, 5), series1Data.splice(0, 5));
},
deep: false
}
},
mounted() {
vm = this;
this.drawColumn();
this.drawColumn([], [], []);
},
methods: {
// 画
drawColumn() {
drawColumn(yAxisData, series0Data, series1Data) {
// 基于准备好的dom，初始化echarts实例
let chartColumn = this.$echarts.init(document.getElementById(this.id));
chartColumn = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
let options = {
color: vm.colors,
......@@ -97,7 +118,8 @@ export default {
xAxis: {
axisTick: false,
type: "category",
data: ["博士", "硕士", "本科", "大专", "中专以下", "其他"],
// data: ["博士", "硕士", "本科", "大专", "中专以下", "其他"],
data: yAxisData,
textStyle: {
fontSize: 12,
color: "#676869"
......@@ -118,58 +140,19 @@ export default {
series: [
{
name: "培训前正确率",
data: [120, 200, 150, 80, 70, 110, 130],
data: series0Data,
// data: [120, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 15 //柱图宽度
},
{
name: "培训后正确率",
data: [120, 20, 160, 80, 70, 110, 130],
data: series1Data,
// data: [120, 20, 160, 80, 70, 110, 130],
type: "bar",
barWidth: 15 //柱图宽度
}
]
// series: [
// {
// name: "获优秀人数",
// type: "bar",
// stack: "总量",
// barWidth: 16, //柱图宽度
// label: {
// normal: {
// show: false,
// position: "insideRight"
// }
// },
// data: [320, 302, 301, 334, 390, 330, 320]
// },
// {
// name: "获及格人数",
// type: "bar",
// stack: "总量",
// barWidth: 16, //柱图宽度
// label: {
// normal: {
// show: false,
// position: "insideRight"
// }
// },
// data: [120, 132, 101, 134, 90, 230, 210]
// },
// {
// name: "未获证人数",
// type: "bar",
// stack: "总量",
// barWidth: 16, //柱图宽度
// label: {
// normal: {
// show: false,
// position: "insideRight"
// }
// },
// data: [220, 182, 191, 234, 290, 330, 310]
// }
// ]
};
chartColumn.setOption(options);
}
......
components/bussiness/charts/chart-column-vertical-times.vue 0 → 100644
浏览文件 @ 695eee7d
<!-- 柱状图-竖向 -->
<template>
<section class="chart-pie">
<div :id="id" :style="{width: chartWidth, height: chartHeight}"></div>
</section>
</template>
<script>
import { format } from "path";
let vm = null, chartColumn = null;
export default {
props: {
id: {
type: String,
default: "chartColumnId"
},
colors: {
type: Array,
default: () => [
"#FFB01B",
"#39AF9A",
"#5D7092",
"#FF9A4B",
"#abb7bb",
"#76d2d2"
]
},
dataList: {
tpye: Array,
default: () => []
}
},
data() {
return {
chartWidth: "300px",
chartHeight: "235px",
xAxisData: [],
seriesData: [],
options: {
color: ['#39AF9A'],
tooltip: {
trigger: "axis",
axisPointer: {
// 坐标轴指示器，坐标轴触发有效
type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
}
},
// legend: {
// top: 20,
// data: ["获优秀人数", "获及格人数", "未获证人数"],
// textStyle: {
// fontSize: 12,
// // fontWeight: "bolder",
// color: "#676869"
// }
// },
grid: {
top: "10%",
left: "3%",
right: "6%",
bottom: "6%",
containLabel: true
},
lineStyle: {
color: "#676869"
},
yAxis: {
axisTick: false,
type: "value",
axisLabel: {
formatter: "{value}",
textStyle: {
color: "#676869"
}
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
},
xAxis: {
axisTick: false,
type: "category",
data: [],
// data: ["其他", "中专以下", "大专", "本科", "硕士"],
textStyle: {
fontSize: 12,
color: "#676869"
},
axisLabel: {
formatter: "{value}",
textStyle: {
color: "#676869"
}
},
axisLine: {
lineStyle: {
color: "#efefef",
width: 1
}
}
},
series: [
{
name: "考试人数",
data: [],
// data: [120, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 20 //柱图宽度
}
]
}
};
},
watch: {
dataList: {
handler(newVal) {
let cList = newVal.slice(0, 5);
this.xAxisData = cList.map( item => {
return item.timesStr
})
this.seriesData = cList.map( item => {
return item.count
})
this.options.xAxis.data = this.xAxisData;
this.options.series[0].data = this.seriesData;
chartColumn.setOption(this.options, true);
},
deep: true
}
},
created() {
if (process.client) {
let clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(0) + 'px';
console.log(clientWidth);
// if (clientWidth <= 320) {
// this.chartWidth = "260px";
// } else if (clientWidth <= 360) {
// this.chartWidth = "320px";
// } else if (clientWidth <= 375) {
// this.chartWidth = "340px";
// } else if (clientWidth <= 414) {
// this.chartWidth = "375px";
// } else {
// this.chartWidth = (clientWidth * 0.8).toFixed(0) + 'px';
// }
}
},
mounted() {
vm = this;
this.drawColumn();
},
methods: {
// 画
drawColumn() {
// 基于准备好的dom，初始化echarts实例
chartColumn = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
// let options = {
// color: vm.colors,
// tooltip: {
// trigger: "axis",
// axisPointer: {
// // 坐标轴指示器，坐标轴触发有效
// type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
// }
// },
// // legend: {
// // top: 20,
// // data: ["获优秀人数", "获及格人数", "未获证人数"],
// // textStyle: {
// // fontSize: 12,
// // // fontWeight: "bolder",
// // color: "#676869"
// // }
// // },
// grid: {
// top: "10%",
// left: "3%",
// right: "6%",
// bottom: "6%",
// containLabel: true
// },
// lineStyle: {
// color: "#676869"
// },
// yAxis: {
// axisTick: false,
// type: "value",
// axisLabel: {
// formatter: "{value}",
// textStyle: {
// color: "#676869"
// }
// },
// axisLine: {
// lineStyle: {
// color: "#efefef",
// width: 1
// }
// }
// },
// xAxis: {
// axisTick: false,
// type: "category",
// data: [],
// // data: ["其他", "中专以下", "大专", "本科", "硕士"],
// textStyle: {
// fontSize: 12,
// color: "#676869"
// },
// axisLabel: {
// formatter: "{value}",
// textStyle: {
// color: "#676869"
// }
// },
// axisLine: {
// lineStyle: {
// color: "#efefef",
// width: 1
// }
// }
// },
// series: [
// {
// name: "获优秀人数",
// data: [],
// // data: [120, 200, 150, 80, 70, 110, 130],
// type: "bar",
// barWidth: 20 //柱图宽度
// }
// ]
// };
chartColumn.setOption(this.options, true);
}
}
};
</script>
<style lang="scss" scoped>
.chart-pie {
position: relative;
top: -6px;
// height: 280px;
margin: 15px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.04);
border-radius: 6px;
border: 1px solid rgba(231, 232, 233, 1);
}
</style>
components/bussiness/charts/chart-column-vertical.vue
浏览文件 @ 695eee7d
......@@ -6,7 +6,7 @@
</template>
<script>
import { format } from "path";
let vm = null;
let vm = null, chartColumn = null;
export default {
props: {
id: {
......@@ -23,47 +23,20 @@ export default {
"#abb7bb",
"#76d2d2"
]
},
dataList: {
tpye: Array,
default: () => []
}
},
data() {
return {
chartWidth: "300px",
chartHeight: "235px"
};
},
created() {
if (process.client) {
let clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(0) + 'px';
console.log(clientWidth);
// if (clientWidth <= 320) {
// this.chartWidth = "260px";
// } else if (clientWidth <= 360) {
// this.chartWidth = "320px";
// } else if (clientWidth <= 375) {
// this.chartWidth = "340px";
// } else if (clientWidth <= 414) {
// this.chartWidth = "375px";
// } else {
// this.chartWidth = (clientWidth * 0.8).toFixed(0) + 'px';
// }
}
},
mounted() {
vm = this;
this.drawColumn();
},
methods: {
// 画
drawColumn() {
// 基于准备好的dom，初始化echarts实例
let chartColumn = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
let options = {
color: vm.colors,
chartHeight: "235px",
xAxisData: [],
seriesData: [],
options: {
// color: this.colors,
tooltip: {
trigger: "axis",
axisPointer: {
......@@ -109,7 +82,8 @@ export default {
xAxis: {
axisTick: false,
type: "category",
data: ["其他", "中专以下", "大专", "本科", "硕士"],
data: [],
// data: ["其他", "中专以下", "大专", "本科", "硕士"],
textStyle: {
fontSize: 12,
color: "#676869"
......@@ -130,13 +104,140 @@ export default {
series: [
{
name: "获优秀人数",
data: [120, 200, 150, 80, 70, 110, 130],
data: [],
// data: [120, 200, 150, 80, 70, 110, 130],
type: "bar",
barWidth: 20 //柱图宽度
}
]
};
chartColumn.setOption(options);
}
};
},
watch: {
dataList: {
handler(newVal) {
// debugger
this.xAxisData = newVal.map( item => {
return item.timesStr
})
this.seriesData = newVal.map( item => {
return item.count
})
this.options.xAxis.data = this.xAxisData;
this.options.series[0].data = this.seriesData;
chartColumn.setOption(this.options, true);
},
deep: true
}
},
created() {
if (process.client) {
let clientWidth =
window.outerWidth ||
document.body.clientWidth ||
document.documentElement.clientWidth;
this.chartWidth = (clientWidth * 0.9).toFixed(0) + 'px';
console.log(clientWidth);
// if (clientWidth <= 320) {
// this.chartWidth = "260px";
// } else if (clientWidth <= 360) {
// this.chartWidth = "320px";
// } else if (clientWidth <= 375) {
// this.chartWidth = "340px";
// } else if (clientWidth <= 414) {
// this.chartWidth = "375px";
// } else {
// this.chartWidth = (clientWidth * 0.8).toFixed(0) + 'px';
// }
}
},
mounted() {
vm = this;
this.drawColumn();
},
methods: {
// 画
drawColumn() {
// 基于准备好的dom，初始化echarts实例
chartColumn = this.$echarts.init(document.getElementById(this.id));
// 绘制图表
// let options = {
// color: vm.colors,
// tooltip: {
// trigger: "axis",
// axisPointer: {
// // 坐标轴指示器，坐标轴触发有效
// type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
// }
// },
// // legend: {
// // top: 20,
// // data: ["获优秀人数", "获及格人数", "未获证人数"],
// // textStyle: {
// // fontSize: 12,
// // // fontWeight: "bolder",
// // color: "#676869"
// // }
// // },
// grid: {
// top: "10%",
// left: "3%",
// right: "6%",
// bottom: "6%",
// containLabel: true
// },
// lineStyle: {
// color: "#676869"
// },
// yAxis: {
// axisTick: false,
// type: "value",
// axisLabel: {
// formatter: "{value}",
// textStyle: {
// color: "#676869"
// }
// },
// axisLine: {
// lineStyle: {
// color: "#efefef",
// width: 1
// }
// }
// },
// xAxis: {
// axisTick: false,
// type: "category",
// data: [],
// // data: ["其他", "中专以下", "大专", "本科", "硕士"],
// textStyle: {
// fontSize: 12,
// color: "#676869"
// },
// axisLabel: {
// formatter: "{value}",
// textStyle: {
// color: "#676869"
// }
// },
// axisLine: {
// lineStyle: {
// color: "#efefef",
// width: 1
// }
// }
// },
// series: [
// {
// name: "获优秀人数",
// data: [],
// // data: [120, 200, 150, 80, 70, 110, 130],
// type: "bar",
// barWidth: 20 //柱图宽度
// }
// ]
// };
chartColumn.setOption(this.options, true);
}
}
};
......
components/bussiness/course-times-list.vue
浏览文件 @ 695eee7d
......@@ -7,50 +7,21 @@
<li>人均学习时长</li>
</ul>
<ul class="list">
<li v-for="(item, index) in rankList" :key="index">
<span>高血压降压药物药…</span>
<span>60分钟</span>
<span>23分钟</span>
<li v-for="(item, index) in dataList" :key="index">
<span>{{item.courseName}}</span>
<span>{{item.courseTime}}分钟</span>
<span>{{item.averageTime}}分钟</span>
</li>
</ul>
</div>
</template>
<script>
// {
// "subId":10000,
// "subName":null,
// "certCount":0,
// "joinCount":0,
// "certRate":0,
// "costTime":2000
// }
export default {
props: {
rankList: {
dataList: {
type: Array,
default: () => [
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
}
]
}
},
methods: {
getRankImgUrl(index) {
return require(`../../assets/images/rank-${index + 1}.png`);
default: () => []
}
}
};
......
components/bussiness/exam-list.vue
浏览文件 @ 695eee7d
......@@ -6,9 +6,9 @@
<li>参与通过率</li>
</ul>
<ul class="list">
<li v-for="(item, index) in rankList" :key="index">
<span>高血压降压药物药物物理学…</span>
<span>83%</span>
<li v-for="(item, index) in dataList" :key="index">
<span>{{item.examName}}</span>
<span>{{(item.joinRate * 100).toFixed(0)}}%</span>
</li>
</ul>
</div>
......@@ -16,32 +16,13 @@
<script>
export default {
props: {
rankList: {
dataList: {
type: Array,
default: () => [
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
}
]
default: () => []
}
},
methods: {
getRankImgUrl(index) {
return require(`../../assets/images/rank-${index + 1}.png`);
}
}
};
</script>
......
components/bussiness/exam-score-list.vue
浏览文件 @ 695eee7d
......@@ -6,9 +6,9 @@
<li>考试人数(个)</li>
</ul>
<ul class="list">
<li v-for="(item, index) in rankList" :key="index">
<span>{{index + 1}}</span>
<span>88</span>
<li v-for="(item, index) in dataList" :key="index">
<span>{{item.times}}</span>
<span>{{item.count}}</span>
</li>
</ul>
</div>
......@@ -16,33 +16,12 @@
<script>
export default {
props: {
rankList: {
dataList: {
type: Array,
default: () => [
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
}
]
default: () => []
}
},
methods: {
getRankImgUrl(index) {
return require(`../../assets/images/rank-${index + 1}.png`);
}
}
};
</script>
<style scoped lang="scss">
......
components/bussiness/exam-times-list copy.vue 0 → 100644
浏览文件 @ 695eee7d
<!-- 完成项目考试次数情况 -->
<template>
<div class="exam-times-wrapper">
<ul class="title">
<li>考试次数(次)</li>
<li>考试人数(个)</li>
</ul>
<ul class="list">
<li v-for="(item, index) in rankList" :key="index">
<span>{{index + 1}}</span>
<span>88</span>
</li>
</ul>
</div>
</template>
<script>
export default {
props: {
rankList: {
type: Array,
default: () => [
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
}
]
}
},
methods: {
getRankImgUrl(index) {
return require(`../../assets/images/rank-${index + 1}.png`);
}
}
};
</script>
<style scoped lang="scss">
.exam-times-wrapper {
font-size: 14px;
.title {
display: flex;
flex-direction: row;
margin: 0 15px;
justify-content: center;
height: 60px;
line-height: 60px;
border-bottom: 1px solid #f0f1f2;
// background: #e3efed;
// border-radius: 6px 6px 0px 0px;
li {
font-size: 14px;
font-weight: 400;
color: #449284;
}
li:nth-child(1) {
text-align: center;
flex: 1;
}
li:nth-child(2) {
flex: 1;
text-align: center;
}
}
.list {
font-size: 16px;
margin: 0 15px 20px;
li {
display: flex;
flex-direction: row;
height: 60px;
line-height: 60px;
// justify-content: space-between;
border-bottom: 1px solid #f0f1f2;
span {
font-weight: 400;
color: #373839;
}
span:nth-child(1) {
flex: 1;
text-align: center;
}
span:nth-child(2) {
flex: 1;
text-align: center;
}
}
}
}
</style>
\ No newline at end of file
components/bussiness/exam-times-list.vue
浏览文件 @ 695eee7d
<!-- 完成项目考试次数情况 -->
<!-- 完成项目考试分数情况 -->
<template>
<div class="exam-times-wrapper">
<ul class="title">
......@@ -6,9 +6,9 @@
<li>考试人数(个)</li>
</ul>
<ul class="list">
<li v-for="(item, index) in rankList" :key="index">
<span>{{index + 1}}</span>
<span>88</span>
<li v-for="(item, index) in dataList" :key="index">
<span>{{item.times}}</span>
<span>{{item.count}}</span>
</li>
</ul>
</div>
......@@ -16,33 +16,12 @@
<script>
export default {
props: {
rankList: {
dataList: {
type: Array,
default: () => [
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
}
]
default: () => []
}
},
methods: {
getRankImgUrl(index) {
return require(`../../assets/images/rank-${index + 1}.png`);
}
}
};
</script>
<style scoped lang="scss">
......
components/bussiness/org-doctor-list.vue
浏览文件 @ 695eee7d
......@@ -2,55 +2,72 @@
<template>
<div class="corse-times-list">
<ul class="title">
<li>已获证</li>
<li>未获证</li>
<li>未参与</li>
<li :class="{'active': cIndex === 0}" @click="tabClick(0)">已获证</li>
<li :class="{'active': cIndex === 1}" @click="tabClick(1)">未获证</li>
<li :class="{'active': cIndex === 2}" @click="tabClick(2)">未参与</li>
</ul>
<ul class="list">
<li v-for="(item, index) in rankList" :key="index">
<span>武强</span>
<span>内科</span>
<span>成绩 98分</span>
<ul v-show="cIndex === 0" class="list">
<li v-for="(item, index) in certUserList" :key="index">
<span>{{item.doctorName}}</span>
<span>{{item.departmentName}}</span>
<span>成绩 {{item.score}}分</span>
</li>
</ul>
<ul v-show="cIndex === 1" class="list">
<li v-for="(item, index) in noCertUserList" :key="index">
<span>{{item.doctorName}}</span>
<span>{{item.departmentName}}</span>
<!-- <span>成绩 {{item.score}}分</span> -->
</li>
</ul>
<ul v-show="cIndex === 2" class="list">
<li v-for="(item, index) in noJoinList" :key="index">
<span>{{item.doctorName}}</span>
<span>{{item.departmentName}}</span>
<!-- <span>成绩 {{item.score}}分</span> -->
</li>
</ul>
</div>
</template>
<script>
// {
// "subId":10000,
// "subName":null,
// "certCount":0,
// "joinCount":0,
// "certRate":0,
// "costTime":2000
// }
export default {
data() {
return {
cIndex: 0,
hasClicked: [true, false, false]
}
},
props: {
rankList: {
certUserList: {
type: Array,
default: () => []
},
noCertUserList: {
type: Array,
default: () => [
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
},
{
province: "福建省",
order: 1
}
]
default: () => []
},
noJoinList: {
type: Array,
default: () => []
},
tabIndex: {
type: String | Number,
default: 0
}
},
watch: {
tabIndex(newVal) {
this.cIndex = newVal;
}
},
methods: {
getRankImgUrl(index) {
return require(`../../assets/images/rank-${index + 1}.png`);
tabClick(index) {
this.cIndex = index;
if(!this.hasClicked[index]) {
this.hasClicked[index] = true;
this.$emit('orgDoctorTabChange', index);
}
}
}
};
......@@ -72,6 +89,16 @@ export default {
font-size: 14px;
font-weight: 400;
color: #979899;
&.active {
color: #373839;
}
&::after {
display: inline-block;
content: '';
width: 6px;
height: 3px;;
border-radius: 3px;
}
}
}
......
components/common/common-card.vue
浏览文件 @ 695eee7d
......@@ -12,23 +12,7 @@ export default {
props: {
cardList: {
type: Array,
default: () => [
{
count: 5,
unitName: "门",
description: "正式考试数"
},
{
count: 5,
unitName: "门",
description: "模拟考试数"
},
{
count: 60,
unitName: "道",
description: "所有考题数"
}
]
default: () => []
},
needBG: {
type: Boolean,
......
components/common/common-header.vue
浏览文件 @ 695eee7d
......@@ -46,7 +46,7 @@ export default {
align-items: center;
text-align: center;
justify-content: center; /* 水平居中 */
font-size: 26px;
font-size: 17px;
span {
display: block;
}
......
components/common/common-swiper-item.vue
浏览文件 @ 695eee7d
......@@ -3,20 +3,20 @@
<section class="common-swiper-item">
<article class="middle">
<div class="title">
<span>获证率</span>
<span>{{certFlag ? '获证率' : '完成率'}}</span>
<span>
<img src="../../assets/images/tips-1.png" />
</span>
</div>
<div class="ratio">
<span>{{(percentData.certificateRate * 100).toFixed(0)}}%</span>
<span>{{(percentData.certificateRate * 100).toFixed(1)}}%</span>
</div>
<div class="statics">
<span>已获证人数 {{percentData.finishCount}}</span>
<span>应参与人数 {{percentData.doctorCount}}</span>
</div>
</article>
<article class="middle-org">
<article v-show="isSingleOrg" class="middle-org">
<div class="title">
<span>人员参与率</span>
<span>
......@@ -24,19 +24,19 @@
</span>
</div>
<div class="ratio">
<span>{{(percentData.certificateRate * 100).toFixed(0)}}%</span>
<span>{{(percentData.doctorRate * 100).toFixed(1)}}%</span>
</div>
<div class="statics">
<span class="grey">已参与人数 {{percentData.finishCount}}</span>
<span class="grey">已参与人数 {{percentData.joinCount}}</span>
<span class="grey">应参与人数 {{percentData.doctorCount}}</span>
</div>
</article>
<article class="mini">
<article v-show="!isSingleOrg" class="mini">
<div class="item">
<div class="wrapper">
<span>
<div class="desc">人员参与率</div>
<div class="ratio">{{(percentData.doctorRate * 100).toFixed(0)}}%</div>
<div class="ratio">{{(percentData.doctorRate * 100).toFixed(1)}}%</div>
</span>
<img src="../../assets/images/tips-2.png" />
</div>
......@@ -47,7 +47,7 @@
<div class="wrapper">
<span>
<div class="desc">机构参与率</div>
<div class="ratio">{{(percentData.hospitalRate * 100).toFixed(0)}}%</div>
<div class="ratio">{{(percentData.hospitalRate * 100).toFixed(1)}}%</div>
</span>
<img src="../../assets/images/tips-3.png" />
</div>
......@@ -74,6 +74,14 @@ export default {
hospitalRate: 0
};
}
},
isSingleOrg: {
type: Boolean,
default: false
},
certFlag: {
type: Number | String,
default: 0
}
},
watch: {
......
components/common/common-tabs.vue
浏览文件 @ 695eee7d
......@@ -3,6 +3,11 @@
<div class="common-tabs-wrapper">
<ul class="common-tabs">
<li
v-show="(item === '课程分析' && projectInfo.existCourse === 1)
|| (item === '考试分析' && projectInfo.existExam === 1)
|| (item === '学习效果分析' && projectInfo.existEffect === 1)
|| item === '总体概况'
|| item === '人群分析'"
v-for="(item, index) in tapList"
:class="{'active': index === cIndex}"
:key="index"
......@@ -22,25 +27,32 @@ export default {
"总体概况",
"人群分析",
"课程分析",
"考试分析",
"学习效果分析"
]
};
},
props: {
projectInfo: {
type: Object
}
},
mounted() {
this.handleTabs(true, true);
// this.handleTabs(true, true);
},
methods: {
clickTab(index) {
this.cIndex = index;
this.$emit("tabClicked", index);
},
handleTabs(needOne, needTwo) {
if(needOne) {
this.tapList.push('考试分析');
}
if(needTwo) {
this.tapList.push('学习效果分析');
}
}
// handleTabs(needOne, needTwo) {
// if(needOne) {
// this.tapList.push('考试分析');
// }
// if(needTwo) {
// this.tapList.push('学习效果分析');
// }
// }
}
};
</script>
......
components/common/pica-org copy 2.vue 0 → 100644
浏览文件 @ 695eee7d
<!-- 选择地区组件 -->
<template>
<div class="select-wrapper">
<div class="mask" @click="cancel" @touchmove.prevent>
<div class="address-wrap" @click.stop>
<div class="tip-header">
<span class="cancel-btn" @click="cancel">取消</span>
<h3>选择机构</h3>
<span class="submit-btn" @click="confirm">确定</span>
<!-- <button :disabled="isDisabled" class="submit-btn" @click="confirm">确定</button> -->
</div>
<div class="address-select">
<ul class="show-address-header">
<!-- <li :class="{ active: isShowProvince }" class="item" @click="tabAddressClick(1)"> -->
<li :class="{ active: isShowProvince }" class="item">
{{
value.provinceName
? value.provinceName
: '请选择'
}}
</li>
</ul>
<div class="address-content" @touchmove.stop>
<ul v-show="isShowProvince" id="province">
<li
v-for="(provinceItem, index) in orgList"
:key="index"
:class="{ active: provinceItem.selected }"
@click="orgSelect(provinceItem, index)"
>
<span>{{ provinceItem.hospitalName }}</span>
<span v-show="provinceItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from "vuex";
import { getProvinceList } from "../../service";
export default {
name: "PicaOrg",
data() {
return {
areaList: {
provinceList: []
},
value: {
provinceId: "",
provinceName: ""
},
isDisabled: true,
isShowProvince: true
};
},
props: {
baseUrl: {
type: String,
default: ""
},
rank: {
type: Number | String,
default: 4
}
},
computed: {
...mapGetters({
orgList: "orgList"
})
},
watch: {
orgList: {
handler(newList) {
// console.log('$$$$$$$$$4', newList)
// this.areaList.provinceList = newList;
// this.areaList.provinceList.map(a => {
// a.selected = false;
// // if (a.provinceId == this.value.provinceId) {
// // a.selected = true;
// // }
// });
newList.map( a => {
a.selected = false
})
return newList
},
deep: true
}
},
created() {
// localStorage.setItem('baseUrl',this.baseUrl);
// this.getProvinceData();
},
methods: {
// async getProvinceData() {
// await getProvinceList().then(res => {
// if (res.code === "000000") {
// this.areaList.provinceList = res.data.provinceList;
// this.areaList.provinceList.map(a => {
// if (a.provinceId == this.value.provinceId) {
// a.selected = true;
// }
// });
// }
// });
// },
orgSelect(item, idx) {
// debugger
this.value.provinceId = item.hospitalId;
// this.value.provinceName = item.hospitalName;
// this.areaList.provinceList.map(a => (a.selected = false));
// this.areaList.provinceList[idx].selected = true;
// this.areaList.provinceList[idx].selected = !this.areaList.provinceList[
// idx
// ].selected;
this.orgList[idx].selected = true;
},
confirm() {
this.$emit("confirm", this.value);
},
cancel() {
this.$emit("cancel", false);
}
}
};
</script>
<style lang="less" scoped>
.select-wrapper {
font-family: PingFangSC-Regular;
.mask {
position: fixed;
z-index: 1000;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: rgba(55, 56, 57, 0.6);
}
.address-wrap {
position: absolute;
width: 100%;
height: 293px;
background-color: #ffffff;
box-sizing: border-box;
bottom: 0;
left: 0;
right: 0;
.tip-header {
position: relative;
height: 58px;
line-height: 58px;
width: 100%;
font-size: 17px;
display: flex;
justify-content: space-between;
padding: 0 15px;
box-sizing: border-box;
.cancel-btn {
color: #999;
}
h3 {
font-size: 18px;
color: #373839;
font-weight: 400;
}
.submit-btn {
font-size: 17px;
outline: none;
border: 1px solid transparent;
background-color: transparent;
color: #449284 !important;
&:disabled {
color: #c7c8c9;
}
}
}
.address-select {
width: 100%;
height: auto;
/*height: 196px;*/
box-sizing: border-box;
.show-address-header {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
position: relative;
padding-bottom: 4px;
&:after {
content: " ";
position: absolute;
left: 0;
bottom: 0;
right: 0;
height: 1px;
border-bottom: 1px solid #f0f1f2;
color: #f0f1f2;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.item {
display: inline-block;
font-size: 15px;
line-height: 35px;
height: 35px;
padding: 0 15px;
box-sizing: border-box;
max-width: 25%;
text-align: left;
color: #676869;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: relative;
&:last-of-type {
padding-right: 15px;
}
&.active {
color: #373839;
font-family: PingFangSC-Medium;
/*font-weight:500;*/
}
&.active:after {
content: " ";
position: absolute;
left: 50%;
bottom: 0;
right: 0;
width: 10px;
height: 3px;
/*border-radius: 2px;*/
border-radius: 30%;
text-align: center;
background-color: #449284;
transform: translateX(-50%);
}
}
}
.address-content {
position: relative;
width: 100%;
height: 100%;
/*height: 196px;*/
overflow: hidden;
box-sizing: border-box;
ul {
width: 100%;
height: 196px;
overflow-y: auto;
box-sizing: border-box;
padding: 10px 13px;
-webkit-overflow-scrolling: touch;
position: static;
-webkit-transform: translateZ(0px);
li {
height: 35px;
line-height: 35px;
font-size: 15px;
width: 100%;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #676869;
cursor: pointer;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: space-between;
-webkit-justify-content: space-between;
&.active {
color: #449284;
}
img {
width: 10px;
height: 10px;
}
}
}
}
}
}
}
</style>
\ No newline at end of file
components/common/pica-org copy 3.vue 0 → 100644
浏览文件 @ 695eee7d
<!-- 选择地区组件 -->
<template>
<div class="select-wrapper">
<div class="mask" @click="cancel" @touchmove.prevent>
<div class="address-wrap" @click.stop>
<div class="tip-header">
<span class="cancel-btn" @click="cancel">取消</span>
<h3>选择机构</h3>
<span class="submit-btn" @click="confirm">确定</span>
<!-- <button :disabled="isDisabled" class="submit-btn" @click="confirm">确定</button> -->
</div>
<div class="address-select">
<ul class="show-address-header">
<!-- <li :class="{ active: isShowProvince }" class="item" @click="tabAddressClick(1)"> -->
<li :class="{ active: isShowProvince }" class="item">
{{
value.provinceName
? value.provinceName
: '请选择'
}}
</li>
</ul>
<div class="address-content" @touchmove.stop>
<ul v-show="isShowProvince" id="province">
<li
v-for="(provinceItem, index) in orgList"
:key="index"
:class="{ active: provinceItem.selected }"
@click="orgSelect(provinceItem, index)"
>
<span>{{ provinceItem.hospitalName }}</span>
<span v-show="provinceItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from "vuex";
import { getProvinceList } from "../../service";
export default {
name: "PicaOrg",
data() {
return {
areaList: {
provinceList: []
},
value: {
provinceId: "",
provinceName: ""
},
isDisabled: true,
isShowProvince: true
};
},
props: {
baseUrl: {
type: String,
default: ""
},
rank: {
type: Number | String,
default: 4
}
},
computed: {
...mapGetters({
orgList: "orgList"
})
},
watch: {
orgList: {
handler(newList) {
// console.log('$$$$$$$$$4', newList)
// this.areaList.provinceList = newList;
// this.areaList.provinceList.map(a => {
// a.selected = false;
// // if (a.provinceId == this.value.provinceId) {
// // a.selected = true;
// // }
// });
newList.map( a => {
a.selected = false
})
return newList
},
deep: true
}
},
created() {
// localStorage.setItem('baseUrl',this.baseUrl);
// this.getProvinceData();
},
methods: {
// async getProvinceData() {
// await getProvinceList().then(res => {
// if (res.code === "000000") {
// this.areaList.provinceList = res.data.provinceList;
// this.areaList.provinceList.map(a => {
// if (a.provinceId == this.value.provinceId) {
// a.selected = true;
// }
// });
// }
// });
// },
orgSelect(item, idx) {
// debugger
this.value.provinceId = item.hospitalId;
// this.value.provinceName = item.hospitalName;
// this.areaList.provinceList.map(a => (a.selected = false));
// this.areaList.provinceList[idx].selected = true;
// this.areaList.provinceList[idx].selected = !this.areaList.provinceList[
// idx
// ].selected;
this.orgList[idx].selected = true;
},
confirm() {
this.$emit("confirm", this.value);
},
cancel() {
this.$emit("cancel", false);
}
}
};
</script>
<style lang="less" scoped>
.select-wrapper {
font-family: PingFangSC-Regular;
.mask {
position: fixed;
z-index: 1000;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: rgba(55, 56, 57, 0.6);
}
.address-wrap {
position: absolute;
width: 100%;
height: 293px;
background-color: #ffffff;
box-sizing: border-box;
bottom: 0;
left: 0;
right: 0;
.tip-header {
position: relative;
height: 58px;
line-height: 58px;
width: 100%;
font-size: 17px;
display: flex;
justify-content: space-between;
padding: 0 15px;
box-sizing: border-box;
.cancel-btn {
color: #999;
}
h3 {
font-size: 18px;
color: #373839;
font-weight: 400;
}
.submit-btn {
font-size: 17px;
outline: none;
border: 1px solid transparent;
background-color: transparent;
color: #449284 !important;
&:disabled {
color: #c7c8c9;
}
}
}
.address-select {
width: 100%;
height: auto;
/*height: 196px;*/
box-sizing: border-box;
.show-address-header {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
position: relative;
padding-bottom: 4px;
&:after {
content: " ";
position: absolute;
left: 0;
bottom: 0;
right: 0;
height: 1px;
border-bottom: 1px solid #f0f1f2;
color: #f0f1f2;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.item {
display: inline-block;
font-size: 15px;
line-height: 35px;
height: 35px;
padding: 0 15px;
box-sizing: border-box;
max-width: 25%;
text-align: left;
color: #676869;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: relative;
&:last-of-type {
padding-right: 15px;
}
&.active {
color: #373839;
font-family: PingFangSC-Medium;
/*font-weight:500;*/
}
&.active:after {
content: " ";
position: absolute;
left: 50%;
bottom: 0;
right: 0;
width: 10px;
height: 3px;
/*border-radius: 2px;*/
border-radius: 30%;
text-align: center;
background-color: #449284;
transform: translateX(-50%);
}
}
}
.address-content {
position: relative;
width: 100%;
height: 100%;
/*height: 196px;*/
overflow: hidden;
box-sizing: border-box;
ul {
width: 100%;
height: 196px;
overflow-y: auto;
box-sizing: border-box;
padding: 10px 13px;
-webkit-overflow-scrolling: touch;
position: static;
-webkit-transform: translateZ(0px);
li {
height: 35px;
line-height: 35px;
font-size: 15px;
width: 100%;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #676869;
cursor: pointer;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: space-between;
-webkit-justify-content: space-between;
&.active {
color: #449284;
}
img {
width: 10px;
height: 10px;
}
}
}
}
}
}
}
</style>
\ No newline at end of file
components/common/pica-org copy 4.vue 0 → 100644
浏览文件 @ 695eee7d
<!-- 选择地区组件 -->
<template>
<div class="select-wrapper">
<div class="mask" @click="cancel" @touchmove.prevent>
<div class="address-wrap" @click.stop>
<div class="tip-header">
<span class="cancel-btn" @click="cancel">取消</span>
<h3>选择机构</h3>
<span class="submit-btn" @click="confirm">确定</span>
<!-- <button :disabled="isDisabled" class="submit-btn" @click="confirm">确定</button> -->
</div>
<div class="address-select">
<ul class="show-address-header">
<!-- <li :class="{ active: isShowProvince }" class="item" @click="tabAddressClick(1)"> -->
<li :class="{ active: isShowProvince }" class="item">
{{
value.provinceName
? value.provinceName
: '请选择'
}}
</li>
</ul>
<div class="address-content" @touchmove.stop>
<ul v-show="isShowProvince" id="province">
<li
v-for="(orgItem, index) in areaList.provinceList"
:key="index"
:class="{ active: orgItem.selected }"
@click="orgSelect(orgItem, index)"
>
<span>{{ orgItem.hospitalName }}</span>
<span v-show="orgItem.selected">
<img src="../../assets/images/sort-select-icon.png" />
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from "vuex";
import { getProvinceList } from "../../service";
export default {
name: "PicaOrg",
data() {
return {
areaList: {
provinceList: []
},
value: {
provinceId: "",
provinceName: ""
},
isDisabled: true,
isShowProvince: true
};
},
props: {
baseUrl: {
type: String,
default: ""
},
rank: {
type: Number | String,
default: 4
}
},
computed: {
...mapGetters({
orgList: "orgList"
})
},
watch: {
orgList: {
handler(newList) {
console.log('$$$$$$$$$4', newList)
this.areaList.provinceList = newList;
this.areaList.provinceList.map(a => {
a.selected = false;
});
},
deep: true
}
},
created() {
},
methods: {
orgSelect(item, idx) {
this.value.provinceId = item.hospitalId;
this.value.provinceName = item.hospitalName;
this.areaList.provinceList[idx].selected = !this.areaList.provinceList[
idx
].selected;
this.$forceUpdate()
},
confirm() {
this.$emit("confirm", this.value);
},
cancel() {
this.$emit("cancel", false);
}
}
};
</script>
<style lang="less" scoped>
.select-wrapper {
font-family: PingFangSC-Regular;
.mask {
position: fixed;
z-index: 1000;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: rgba(55, 56, 57, 0.6);
}
.address-wrap {
position: absolute;
width: 100%;
height: 293px;
background-color: #ffffff;
box-sizing: border-box;
bottom: 0;
left: 0;
right: 0;
.tip-header {
position: relative;
height: 58px;
line-height: 58px;
width: 100%;
font-size: 17px;
display: flex;
justify-content: space-between;
padding: 0 15px;
box-sizing: border-box;
.cancel-btn {
color: #999;
}
h3 {
font-size: 18px;
color: #373839;
font-weight: 400;
}
.submit-btn {
font-size: 17px;
outline: none;
border: 1px solid transparent;
background-color: transparent;
color: #449284 !important;
&:disabled {
color: #c7c8c9;
}
}
}
.address-select {
width: 100%;
height: auto;
/*height: 196px;*/
box-sizing: border-box;
.show-address-header {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: flex;
position: relative;
padding-bottom: 4px;
&:after {
content: " ";
position: absolute;
left: 0;
bottom: 0;
right: 0;
height: 1px;
border-bottom: 1px solid #f0f1f2;
color: #f0f1f2;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
.item {
display: inline-block;
font-size: 15px;
line-height: 35px;
height: 35px;
padding: 0 15px;
box-sizing: border-box;
max-width: 25%;
text-align: left;
color: #676869;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: relative;
&:last-of-type {
padding-right: 15px;
}
&.active {
color: #373839;
font-family: PingFangSC-Medium;
/*font-weight:500;*/
}
&.active:after {
content: " ";
position: absolute;
left: 50%;
bottom: 0;
right: 0;
width: 10px;
height: 3px;
/*border-radius: 2px;*/
border-radius: 30%;
text-align: center;
background-color: #449284;
transform: translateX(-50%);
}
}
}
.address-content {
position: relative;
width: 100%;
height: 100%;
/*height: 196px;*/
overflow: hidden;
box-sizing: border-box;
ul {
width: 100%;
height: 196px;
overflow-y: auto;
box-sizing: border-box;
padding: 10px 13px;
-webkit-overflow-scrolling: touch;
position: static;
-webkit-transform: translateZ(0px);
li {
height: 35px;
line-height: 35px;
font-size: 15px;
width: 100%;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #676869;
cursor: pointer;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
justify-content: space-between;
-webkit-justify-content: space-between;
&.active {
color: #449284;
}
img {
width: 10px;
height: 10px;
}
}
}
}
}
}
}
</style>
\ No newline at end of file
components/common/pica-org.vue
浏览文件 @ 695eee7d
......@@ -7,23 +7,17 @@
<span class="cancel-btn" @click="cancel">取消</span>
<h3>选择机构</h3>
<span class="submit-btn" @click="confirm">确定</span>
<!-- <button :disabled="isDisabled" class="submit-btn" @click="confirm">确定</button> -->
</div>
<div class="address-select">
<ul class="show-address-header">
<!-- <li :class="{ active: isShowProvince }" class="item" @click="tabAddressClick(1)"> -->
<li :class="{ active: isShowProvince }" class="item">
{{
value.provinceName
? value.provinceName
: '请选择'
}}
<li class="item active">
请选择
</li>
</ul>
<div class="address-content" @touchmove.stop>
<ul v-show="isShowProvince" id="province">
<ul id="province">
<li
v-for="(orgItem, index) in areaList.provinceList"
v-for="(orgItem, index) in dataList"
:key="index"
:class="{ active: orgItem.selected }"
@click="orgSelect(orgItem, index)"
......@@ -42,21 +36,12 @@
</template>
<script>
import { mapGetters } from "vuex";
import { getProvinceList } from "../../service";
export default {
name: "PicaOrg",
data() {
return {
areaList: {
provinceList: []
},
value: {
provinceId: "",
provinceName: ""
},
isDisabled: true,
isShowProvince: true
dataList: [],
};
},
props: {
......@@ -78,48 +63,26 @@ export default {
orgList: {
handler(newList) {
console.log('$$$$$$$$$4', newList)
this.areaList.provinceList = newList;
this.areaList.provinceList.map(a => {
this.dataList = newList;
this.dataList.map(a => {
a.selected = false;
// if (a.provinceId == this.value.provinceId) {
// a.selected = true;
// }
});
},
deep: true
}
},
created() {
// localStorage.setItem('baseUrl',this.baseUrl);
// this.getProvinceData();
},
methods: {
// async getProvinceData() {
// await getProvinceList().then(res => {
// if (res.code === "000000") {
// this.areaList.provinceList = res.data.provinceList;
// this.areaList.provinceList.map(a => {
// if (a.provinceId == this.value.provinceId) {
// a.selected = true;
// }
// });
// }
// });
// },
orgSelect(item, idx) {
// debugger
this.value.provinceId = item.hospitalId;
// this.value.provinceName = item.hospitalName;
// this.areaList.provinceList.map(a => (a.selected = false));
// this.areaList.provinceList[idx].selected = true;
this.areaList.provinceList[idx].selected = !this.areaList.provinceList[
idx
].selected;
this.dataList[idx].selected = !this.dataList[idx].selected;
this.$forceUpdate()
},
confirm() {
this.$emit("confirm", this.value);
this.$emit("confirm", this.dataList);
},
cancel() {
this.$emit("cancel", false);
......
package.json
浏览文件 @ 695eee7d
......@@ -18,7 +18,8 @@
"koa": "^2.6.2",
"nuxt": "^2.0.0",
"v-charts": "^1.19.0",
"vant": "^2.2.13"
"vant": "^2.2.13",
"vconsole": "^3.3.4"
},
"devDependencies": {
"@nuxtjs/axios": "^5.5.4",
......
pages/exam-score.vue
浏览文件 @ 695eee7d
<template>
<section>
<CommonHeader title="完成项目考试分数情况"></CommonHeader>
<CommonTitleMini :title="listTitle" :needRightBtn="needRightBtn"></CommonTitleMini>
<ExamScoreList></ExamScoreList>
<CommonTitleMini :title="title" :needRightBtn="needRightBtn"></CommonTitleMini>
<ExamScoreList :dataList="dataList"></ExamScoreList>
<CommonNoMore class="mt-10"></CommonNoMore>
</section>
</template>
<script>
import { mapGetters } from "vuex";
const cookies = require("cookie-universal")();
import { getGeneralExam } from "@/service";
import CommonHeader from "@/components/common/common-header";
import CommonTitleMini from "@/components/common/common-title-mini";
......@@ -15,59 +16,27 @@ import CommonNoMore from "@/components/common/common-no-more";
import ExamScoreList from "@/components/bussiness/exam-score-list";
export default {
props: {
rankList: {
type: Array,
default: () => [
{
subId: 10000,
subName: '福建省',
certCount: 0,
joinCount: 0,
certRate: 0,
costTime: 2000
},
{
subId: 10000,
subName: '上海市',
certCount: 0,
joinCount: 0,
certRate: 0,
costTime: 2000
},
{
subId: 10000,
subName: '浙江省',
certCount: 0,
joinCount: 0,
certRate: 0,
costTime: 2000
},
{
subId: 10000,
subName: '江苏省',
certCount: 0,
joinCount: 0,
certRate: 0,
costTime: 2000
},
{
subId: 10000,
subName: '安徽省',
certCount: 0,
joinCount: 0,
certRate: 0,
costTime: 2000
}
]
}
},
data() {
return {
listTitle: '共120条数据',
title: "共0条数据",
needRightBtn: false,
// projectId: '',
// token: ''
token: "",
// 查询概况数据
queryGDParams: {
beginDate: "",
endDate: "",
hospitalIdList: [],
originalFlag: 1, // 默认值0：0不查看原始数据
projectId: 256,
regionId: "",
timeFlag: 0,
pageCfg: {
type: 1,
pageNo: 0,
pageSize: 0
}
},
dataList: []
};
},
components: {
......@@ -76,24 +45,47 @@ export default {
CommonNoMore,
ExamScoreList
},
computed: {
...mapGetters({
userToken: 'userToken',
projectId: 'projectId'
}),
},
created() {
if(process.client) {
// let projectId = this.$route.query.projectId;
// this.projectId = (this.$route && this.$route.query && this.$route.query.projectId) || "";
// this.token = (this.$router && this.$route.query && this.$route.query.token) || "";
console.log('rank-edu', this.projectId, this.userToken)
if (process.client) {
if(this.$route && this.$route.query) {
let cQuery = this.$route.query
// this.token = cQuery.token || '';
this.queryGDParams.projectId = cQuery.projectId || '';
this.queryGDParams.regionId = cQuery.regionId || '';
this.queryGDParams.hospitalIdList = (cQuery.hospitalIdList || '').split(',') || [];
cookies.set("token", cQuery.token || '');
this.getGeneralExam(this.queryGDParams);
}
// this.token = (this.$route && this.$route.query && this.$route.query.token) || '';
// this.projectId = (this.$route && this.$route.query && this.$route.query.projectId) || 256;
// this.regionId = (this.$route && this.$route.query && this.$route.query.regionId) || '000';
// this.hospitalIdList = (this.$route && this.$route.query && this.$route.query.hospitalIdList) || '';
// this.queryGDParams.projectId = this.projectId;
// this.queryGDParams.regionId = this.regionId;
// this.queryGDParams.hospitalIdList = (this.hospitalIdList && this.hospitalIdList.split(',')) || [];
// cookies.set("token", this.token);
// this.getGeneralExam(this.queryGDParams);
}
},
mounted() {
},
methods: {
// 考试分析
async getGeneralExam(queryData) {
await getGeneralExam(queryData).then(res => {
if (res.code === "000000") {
this.dataList = res.data.examScoreList;
this.title = `共${this.dataList.length}条数据`
}
});
},
}
};
</script>
<style lang="less" scoped>
.mt-10 {
margin-top: 10px !important;
}
.mt-10 {
margin-top: 10px !important;
}
</style>
\ No newline at end of file
pages/exam-times copy.vue 0 → 100644
浏览文件 @ 695eee7d
<template>
<section>
<CommonHeader title="完成项目考试次数情况"></CommonHeader>
<CommonTitleMini :title="title" :needRightBtn="needRightBtn"></CommonTitleMini>
<ExamTimesList></ExamTimesList>
<CommonNoMore class="mt-10"></CommonNoMore>
</section>
</template>
<script>
import { mapGetters } from "vuex";
import CommonHeader from "@/components/common/common-header";
import CommonTitleMini from "@/components/common/common-title-mini";
import CommonNoMore from "@/components/common/common-no-more";
import ExamTimesList from "@/components/bussiness/exam-times-list";
export default {
props: {
dataList: {
type: Array,
default: () => []
}
},
data() {
return {
title: '共120条数据',
needRightBtn: false,
};
},
components: {
CommonHeader,
CommonTitleMini,
CommonNoMore,
ExamTimesList
},
computed: {
...mapGetters({
examTimesList: 'examTimesList',
}),
},
mounted() {
this.title = `共${this.examTimesList.length}条数据`
},
};
</script>
<style lang="less" scoped>
.mt-10 {
margin-top: 10px !important;
}
</style>
\ No newline at end of file
pages/exam-times.vue
浏览文件 @ 695eee7d
<template>
<section>
<CommonHeader title="完成项目考试次数情况"></CommonHeader>
<CommonTitleMini :title="listTitle" :needRightBtn="needRightBtn"></CommonTitleMini>
<ExamTimesList></ExamTimesList>
<CommonTitleMini :title="title" :needRightBtn="needRightBtn"></CommonTitleMini>
<ExamScoreList :dataList="dataList"></ExamScoreList>
<CommonNoMore class="mt-10"></CommonNoMore>
</section>
</template>
<script>
import { mapGetters } from "vuex";
const cookies = require("cookie-universal")();
import { getGeneralExam } from "@/service";
import CommonHeader from "@/components/common/common-header";
import CommonTitleMini from "@/components/common/common-title-mini";
import CommonNoMore from "@/components/common/common-no-more";
import ExamTimesList from "@/components/bussiness/exam-times-list";
import ExamScoreList from "@/components/bussiness/exam-score-list";
export default {
props: {
rankList: {
type: Array,
default: () => [
{
subId: 10000,
subName: '福建省',
certCount: 0,
joinCount: 0,
certRate: 0,
costTime: 2000
},
{
subId: 10000,
subName: '上海市',
certCount: 0,
joinCount: 0,
certRate: 0,
costTime: 2000
},
{
subId: 10000,
subName: '浙江省',
certCount: 0,
joinCount: 0,
certRate: 0,
costTime: 2000
},
{
subId: 10000,
subName: '江苏省',
certCount: 0,
joinCount: 0,
certRate: 0,
costTime: 2000
},
{
subId: 10000,
subName: '安徽省',
certCount: 0,
joinCount: 0,
certRate: 0,
costTime: 2000
}
]
}
},
data() {
return {
listTitle: '共120条数据',
title: "共0条数据",
needRightBtn: false,
// projectId: '',
// token: ''
token: "",
// 查询概况数据
queryGDParams: {
beginDate: "",
endDate: "",
hospitalIdList: [],
originalFlag: 1, // 默认值0：0不查看原始数据
projectId: 256,
regionId: "",
timeFlag: 0,
pageCfg: {
type: 1,
pageNo: 0,
pageSize: 0
}
},
dataList: []
};
},
components: {
CommonHeader,
CommonTitleMini,
CommonNoMore,
ExamTimesList
},
computed: {
...mapGetters({
userToken: 'userToken',
projectId: 'projectId'
}),
ExamScoreList
},
created() {
if(process.client) {
// let projectId = this.$route.query.projectId;
// this.projectId = (this.$route && this.$route.query && this.$route.query.projectId) || "";
// this.token = (this.$router && this.$route.query && this.$route.query.token) || "";
console.log('rank-edu', this.projectId, this.userToken)
if (process.client) {
if(this.$route && this.$route.query) {
let cQuery = this.$route.query
// this.token = cQuery.token || '';
this.queryGDParams.projectId = cQuery.projectId || '';
this.queryGDParams.regionId = cQuery.regionId || '';
this.queryGDParams.hospitalIdList = (cQuery.hospitalIdList || '').split(',') || [];
cookies.set("token", cQuery.token || '');
this.getGeneralExam(this.queryGDParams);
}
// this.token = (this.$router && this.$route.query && this.$route.query.token) || '';
// this.projectId = (this.$router && this.$route.query && this.$route.query.projectId) || 256;
// this.regionId = (this.$router && this.$route.query && this.$route.query.regionId) || '000';
// this.hospitalIdList = (this.$router && this.$route.query && this.$route.query.hospitalIdList) || '';
// this.queryGDParams.projectId = this.projectId;
// this.queryGDParams.regionId = this.regionId;
// this.queryGDParams.hospitalIdList = (this.hospitalIdList && this.hospitalIdList.split(',')) || [];
// cookies.set("token", this.token);
// this.getGeneralExam(this.queryGDParams);
}
},
mounted() {
},
methods: {
// 考试分析
async getGeneralExam(queryData) {
await getGeneralExam(queryData).then(res => {
if (res.code === "000000") {
this.dataList = res.data.examScoreList;
this.title = `共${this.dataList.length}条数据`
}
});
},
}
};
</script>
<style lang="less" scoped>
.mt-10 {
margin-top: 10px !important;
}
.mt-10 {
margin-top: 10px !important;
}
</style>
\ No newline at end of file
pages/index.vue
浏览文件 @ 695eee7d
此差异已折叠。
pages/klg-point.vue
浏览文件 @ 695eee7d
<template>
<section>
<CommonHeader title="培训前后知识点掌握情况"></CommonHeader>
<!-- <CommonTitleMini :title="listTitle" :needRightBtn="needRightBtn"></CommonTitleMini> -->
<TitleKLGPoint :title="listTitle"></TitleKLGPoint>
<ChartColumnHorizontalTCLong class="mt-10"></ChartColumnHorizontalTCLong>
<ChartColumnHorizontalTCLong :dataList="queryGDParams" class="mt-10"></ChartColumnHorizontalTCLong>
<CommonNoMore></CommonNoMore>
</section>
</template>
<script>
import { mapGetters } from "vuex";
const cookies = require("cookie-universal")();
import { getStudyEffect } from "@/service";
import CommonHeader from "@/components/common/common-header";
import CommonTitleMini from "@/components/common/common-title-mini";
import TitleKLGPoint from "@/components/bussiness/title-klg-point";
import CommonNoMore from "@/components/common/common-no-more";
import ChartColumnHorizontalTCLong from "@/components/bussiness/charts/chart-column-horizontal-tc-long";
......@@ -19,37 +18,92 @@ import ChartColumnHorizontalTCLong from "@/components/bussiness/charts/chart-col
export default {
data() {
return {
listTitle: '共10知识点',
listTitle: "共10知识点",
needRightBtn: false,
// projectId: '',
// token: ''
token: '',
// // 查询概况数据
// queryGDParams: {
// beginDate: "",
// endDate: "",
// hospitalIdList: [],
// originalFlag: 1, // 默认值0：0不查看原始数据
// projectId: 256,
// regionId: "",
// timeFlag: 0,
// pageCfg: {
// type: 1,
// pageNo: 0,
// pageSize: 0
// }
// },
// 查询概况数据
queryGDParams: {
beginDate: "",
endDate: "",
hospitalIdList: [],
originalFlag: 1, // 默认值0：0不查看原始数据
projectId: 256,
regionId: "",
timeFlag: 0,
pageNo: 0,
pageSize: 0,
pageCfg: {
type: 1,
pageNo: 0,
pageSize: 0
}
},
knowledgeEffectList: []
};
},
components: {
CommonHeader,
CommonTitleMini,
TitleKLGPoint,
CommonNoMore,
ChartColumnHorizontalTCLong
},
computed: {
...mapGetters({
userToken: 'userToken',
projectId: 'projectId'
}),
},
created() {
if(process.client) {
// let projectId = this.$route.query.projectId;
// this.projectId = (this.$route && this.$route.query && this.$route.query.projectId) || "";
// this.token = (this.$router && this.$route.query && this.$route.query.token) || "";
console.log('rank-edu', this.projectId, this.userToken)
if (process.client) {
if (this.$route && this.$route.query) {
let cQuery = this.$route.query;
let hospitalIdList = cQuery.hospitalIdList || ''
// this.token = cQuery.token || '';
this.queryGDParams.projectId = cQuery.projectId || "";
this.queryGDParams.regionId = cQuery.regionId || "";
this.queryGDParams.hospitalIdList = hospitalIdList && hospitalIdList.split(',') || [];
cookies.set("token", cQuery.token || "");
this.getStudyEffect(this.queryGDParams);
}
// this.token = (this.$route && this.$route.query && this.$route.query.token) || '';
// this.projectId = (this.$route && this.$route.query && this.$route.query.projectId) || 256;
// this.regionId = (this.$route && this.$route.query && this.$route.query.regionId) || '000';
// this.hospitalIdList = (this.$route && this.$route.query && this.$route.query.hospitalIdList) || '';
// this.queryGDParams.projectId = this.projectId;
// this.queryGDParams.regionId = this.regionId;
// this.queryGDParams.hospitalIdList = (this.hospitalIdList && this.hospitalIdList.split(',')) || [];
// cookies.set("token", this.token);
// this.getGeneralExam(this.queryGDParams);
}
},
methods: {
// 学习效果分析
async getStudyEffect(params) {
await getStudyEffect(params).then(res => {
if (res.code === "000000") {
this.knowledgeEffectList = res.data.knowledgeEffectList;
console.log('^^^^^^^^^', this.knowledgeEffectList);
// this.effectCardList[0].count = (res.data.beforeRate * 100).toFixed(0);
// this.effectCardList[1].count = (res.data.afterRate * 100).toFixed(0);
}
});
}
}
};
</script>
<style lang="less" scoped>
.mt-10 {
margin-top: 2px !important;
}
.mt-10 {
margin-top: 2px !important;
}
</style>
\ No newline at end of file
plugins/vue-inject.js
浏览文件 @ 695eee7d
......@@ -2,9 +2,13 @@ import Vue from 'vue'
import rocNative from '@/utils/jsbridge'
import echarts from 'echarts'
import { DropdownMenu, DropdownItem } from 'vant';
Vue.use(DropdownMenu).use(DropdownItem);
// import picaArea from 'pica-area'
// Vue.use(picaArea)
import VConsole from 'vconsole/dist/vconsole.min.js' //import vconsole
let vConsole = new VConsole() // 初始化
Vue.use(DropdownMenu).use(DropdownItem);
Vue.prototype.$echarts = echarts
Vue.prototype.$rocNative = new rocNative();
\ No newline at end of file
service/api.js
浏览文件 @ 695eee7d
......@@ -19,7 +19,6 @@ Axios.interceptors.request.use(
const method = config.method.toLocaleLowerCase();
if (method === 'post' || method === 'put' || method === 'delete') {}
if (config.withCredentials) {
// config.headers.token = 'C284B868425D494386EAEF6C9AE99937';
// config.headers.token = '3EB9111164E84A45B5B00428D52BC966';
config.headers.token = cookies.get('token') || 'C284B868425D494386EAEF6C9AE99937';
}
......
service/index.js
浏览文件 @ 695eee7d
......@@ -82,7 +82,7 @@ export const getGeneralData = async data => {
};
/**
* 根据地区获取机构列表
* 根据地区查询机构
*/
export const getHospitalsByRegionId = async params => {
return request({
......@@ -105,3 +105,102 @@ export const getUserAnalysis = async data => {
url: `stats/report/userAnalysis`
});
};
/**
* 根据地区查询地区下是否有机构
*/
export const getHospitalsCNT = async params => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: `stats/region/hospitals/cnt`
});
};
/**
* 总体情况-选择机构下人员情况
*/
export const getGeneralPersonal = async data => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: `stats/report/generalPersonal/${data.pageCfg.type}/${data.pageCfg.pageNo}/${data.pageCfg.pageSize}`
});
};
/**
* 总体情况-课程分析接口
*/
export const getGeneralCourse = async data => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: `stats/report/course`
// url: `stats/report/course/0/0`
});
};
/**
* 总体情况-考试分析接口
*/
export const getGeneralExam = async data => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: `stats/report/exam`
});
};
/**
* 总体情况-考试分析考试列表
*/
export const getGeneralExamList = async data => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: `stats/report/exam/list`
});
};
/**
* 总体情况-考试分析接口（单个机构）
*/
export const getGeneralExamSingle = async params => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: `stats/report/exam/${params.projectId}/${params.hospitalId}`
});
};
/**
* 查询用户信息和权限
*/
export const getProjectInfo = async params => {
return request({
method: 'get',
params: params,
withCredentials: true,
url: `stats/region/info`
});
};
/**
* 学习效果分析
*/
export const getStudyEffect = async data => {
return request({
method: 'post',
data: data,
withCredentials: true,
url: `stats/report/studyEffect`
});
};
\ No newline at end of file
store/index.js
浏览文件 @ 695eee7d
......@@ -5,52 +5,66 @@ export const state = () => ({
userToken: '',
userMobile: '',
provinceList: [],
orgList: []
orgList: [],
examTimesList: [],
examScoreList: [],
})
export const getters = {
projectId(state) {
return state.projectId
return state.projectId;
},
regionId(state) {
return state.regionId
return state.regionId;
},
regionDegree(state) {
return state.regionDegree
return state.regionDegree;
},
userToken(state) {
return state.userToken
return state.userToken;
},
userMobile(state) {
return state.userMobile
return state.userMobile;
},
provinceList(state) {
return state.provinceList
return state.provinceList;
},
orgList(state) {
return state.orgList
},
return state.orgList;
},
examTimesList(state) {
return state.examTimesList;
},
examScoreList(state) {
return state.examScoreList;
},
}
export const mutations = {
SET_PROJECT_ID(state, projectId) {
state.projectId = projectId
state.projectId = projectId;
},
SET_REGION_ID(state, regionId) {
state.regionId = regionId
state.regionId = regionId;
},
SET_REGION_DEGREE(state, regionDegree) {
state.regionDegree = regionDegree
state.regionDegree = regionDegree;
},
SET_USER_TOKEN(state, userToken) {
state.userToken = userToken
state.userToken = userToken;
},
SET_USER_MOBILE(state, userMobile) {
state.userMobile = userMobile
state.userMobile = userMobile;
},
SET_PROVINCE_LIST(state, provinceList) {
state.provinceList = provinceList
state.provinceList = provinceList;
},
SET_ORG_LIST(state, orgList) {
state.orgList = orgList
state.orgList = orgList;
},
SET_EXAM_TIMES_LIST(state, examTimesList) {
state.examTimesList = examTimesList;
},
SET_EXAM_SCORCE_LIST(state, examScoreList) {
state.examScoreList = examScoreList;
},
}
......@@ -76,4 +90,10 @@ export const actions = {
setOrgList({ commit }, orgList) {
commit('SET_ORG_LIST', orgList);
},
setExamTimesList({ commit }, examTimesList) {
commit('SET_EXAM_TIMES_LIST', examTimesList);
},
setExamScoreList({ commit }, examScoreList) {
commit('SET_EXAM_SCORCE_LIST', examScoreList);
},
}
\ No newline at end of file
utils/enumerate.js
浏览文件 @ 695eee7d
......@@ -8,7 +8,8 @@ export const BASE_URL = {
};
export const SHARE_URL = {
dev: 'https://dev-phome.yunqueyi.com',
// dev: 'https://dev-phome.yunqueyi.com',
dev: 'http://10.177.11.247:4001',
test: 'https://test1-phome.yunqueyi.com',
uat: 'https://uat-phome.yunqueyi.com',
prod: 'https://phome.yunqueyi.com',
......
utils/jsbridge copy.js
浏览文件 @ 695eee7d
......@@ -17,7 +17,7 @@ export const JsBridgeOptions = {
NATIVE_IOS_NAME: 'rociOS',
NATIVE_ANDROID_NAME: '__rocAndroid',
initMethodsWithCallBack: ['getToken', 'getUserInfo'], // value is string
initMethodsWithoutCallBack: ['getUserInfo','gotoLogin', 'appInit', 'goBack', 'shareWechat', 'showNativeToast', 'dispatchEventByModuleCode', 'appBuryingPointEntrust', 'webLoadSuccess'] // value is string
initMethodsWithoutCallBack: ['gotoLogin', 'appInit', 'goBack', 'shareWechat', 'showNativeToast', 'dispatchEventByModuleCode', 'appBuryingPointEntrust', 'webLoadSuccess'] // value is string
}
/**
......
utils/jsbridge.js
浏览文件 @ 695eee7d
......@@ -17,7 +17,7 @@ export const JsBridgeOptions = {
NATIVE_IOS_NAME: 'rociOS',
NATIVE_ANDROID_NAME: '__rocAndroid',
initMethodsWithCallBack: ['getToken', 'getUserInfo'], // value is string
initMethodsWithoutCallBack: ['getUserInfo','gotoLogin', 'appInit', 'goBack', 'shareWechat', 'showNativeToast', 'dispatchEventByModuleCode', 'appBuryingPointEntrust', 'webLoadSuccess'] // value is string
initMethodsWithoutCallBack: ['gotoLogin', 'appInit', 'goBack', 'shareWechat', 'showNativeToast', 'dispatchEventByModuleCode', 'appBuryingPointEntrust', 'webLoadSuccess'] // value is string
}
/**
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或