Skip to content

T
tea-resources-web
Commit f23bc3e3 authored by WBY1026's avatar WBY1026
Browse files
Options

完成4个页面,接口初步核对

parent 32a73a35
Show whitespace changes
Inline Side-by-side
Showing with 942 additions and 126 deletions
src/api/dataStatistics/classView.js 0 → 100644
View file @ f23bc3e3
import request from '@/utils/request'
/**
* 查询左上
* @param params
* @returns {AxiosPromise}
*/
export function getDifficultyLevel() {
return request({
url: '/blesson/getDifficultyLevel',
method: 'get'
})
}
/**
* 查询右上
* @param params
* @returns {AxiosPromise}
*/
export function getClassPlan(flag) {
return request({
url: '/blesson/getClassPlan?flag=' + flag,
method: 'get'
})
}
/**
* 查询左下
* @param params
* @returns {AxiosPromise}
*/
export function getTecClassify(flag) {
return request({
url: '/blesson/getTecClassify?flag=' + flag,
method: 'get'
})
}
/**
* 查询右下
* @param params
* @returns {AxiosPromise}
*/
export function getJobClassify() {
return request({
url: '/blesson/getJobClassify',
method: 'get'
})
}
/**
* 查询email
* @param params
* @returns {AxiosPromise}
*/
export function queryEmail(params) {
return request({
baseURL: process.env.VUE_APP_INTERNAL,
url: '/log/verify/queryEmail',
method: 'get',
params
})
}
/**
* 查询email
* @param params
* @returns {AxiosPromise}
*/
// export function sendEmail(params) {
// return request({
// baseURL: process.env.VUE_APP_INTERNAL,
// url: '/log/verify/sendEmail',
// method: 'post',
// data: params
// })
// }
/**
* 验证登录
* @param params
* @returns {AxiosPromise}
*/
// export function verUrl(params) {
// return request({
// baseURL: process.env.VUE_APP_INTERNAL,
// url: '/log/verify/verUrl',
// method: 'post',
// data: params
// })
// }
/**
* 验证登录
* @param params
* @returns {AxiosPromise}
*/
// export function updatePassW(params) {
// return request({
// baseURL: process.env.VUE_APP_INTERNAL,
// url: '/log/verify/updatePassW',
// method: 'get',
// params: params
// })
// }
src/views/dataStatistics/assessView/index.vue
View file @ f23bc3e3
<template>
<div class="errLog-manage">
考核视图
<div class="list">
<div class="title">
<div class="decoration"></div>
<div class="text">统计列表</div>
</div>
<div style="padding-bottom: 10px;">
<span style="font-size: 16px;">课程名称:</span>
<span>
<el-input v-model="input" placeholder="请输入" style="width: 140px; margin-left: 10px;"></el-input>
<el-button type="primary" style="margin-left: 10px;">查询</el-button>
<el-button>重置</el-button>
</span>
</div>
<el-table
v-loading="loading"
border
:data="list"
@cell-click="clickTable"
stripe
:header-cell-style="{background:'rgb(250,250,250)'}">
<el-table-column type="index" width="55" label="序号" align="center" />
<el-table-column label="课程名称" align="center" prop="lessonName" />
<el-table-column label="试题数量" align="center" prop="testNumber" width="130"
:show-overflow-tooltip="true" />
<el-table-column label="总分" align="center" prop="full" :show-overflow-tooltip="true" />
<el-table-column label="及格分数" align="center" prop="line"></el-table-column>
<el-table-column label="参与考核人数" align="center" prop="participant"></el-table-column>
<el-table-column label="平均分" align="center" prop="avg"></el-table-column>
<el-table-column label="最高分 " align="center" prop="max"></el-table-column>
<el-table-column label="最低分" align="center" prop="min"></el-table-column>
<el-table-column label="满分人数 " align="center" prop="fullNumber"></el-table-column>
<el-table-column label="满分人数占比" align="center" prop="fullScale"></el-table-column>
<el-table-column label="及格人数" align="center" prop="passNumber"></el-table-column>
<el-table-column label="及格人数占比" align="center" prop="passScale"></el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
@pagination="getList"
/>
</div>
<!-- 点击列表数据后的右弹窗 -->
<el-drawer
title="统计明细"
:visible.sync="drawer"
direction="rtl"
:before-close="handleClose"
size="50%">
<!-- 内容 -->
<div style="width: 90%; margin-left: 5%;">
<div>课程名称:</div>
<div>未开始人数:</div>
<el-table v-loading="loading" border :data="detailList">
<el-table-column type="index" width="55" label="序号" align="center" />
<el-table-column v-for="(column, index) in drawerHead" :key="index"
:label="column.label" align="center" :prop="column.prop">
</el-table-column>
</el-table>
<pagination
v-show="detailTotal>0"
:total="detailTotal"
:page.sync="detailQueryParams.page"
:limit.sync="detailQueryParams.rows"
@pagination="detailGetList"
/>
</div>
</el-drawer>
</div>
</template>
......@@ -13,6 +86,117 @@ export default {
data() {
return {
// 查询部分
input: '',
// 是否加载
loading: false,
// 底部列表数据
list: [
{
lessonName: 'xxxx',
testNumber: '2',
full: '3',
line: '4',
participant: '5',
avg: '6',
max: '7',
min: '7',
fullNumber: '7',
fullScale: '7',
passNumber: '7',
passScale: '7',
},
{
lessonName: 'xxxx',
testNumber: '2',
full: '3',
line: '4',
participant: '5',
avg: '6',
max: '7',
min: '7',
fullNumber: '7',
fullScale: '7',
passNumber: '7',
passScale: '7',
},
{
lessonName: 'xxxx',
testNumber: '2',
full: '3',
line: '4',
participant: '5',
avg: '6',
max: '7',
min: '7',
fullNumber: '7',
fullScale: '7',
passNumber: '7',
passScale: '7',
},
],
// 查询参数
total: 20,
queryParams: {
page: 1,
rows: 10,
username: '',
loginTime: ''
},
// 下面的两个要同时获得,保证能对得上
// 抽屉列表的表头信息
drawerHead: [
{label: '用户类型',prop: 'userType'},
{label: '单位类型',prop: 'companyType'},
{label: '所属单位',prop: 'affiliatedUnit'},
{label: '登录名',prop: 'loginName'},
{label: '用户姓名',prop: 'userName'},
],
// 抽屉列表信息
detailList: [
{
userType: '1',
companyType: '2',
affiliatedUnit: '3',
loginName: '4',
userName: '5',
},
{
userType: '1',
companyType: '2',
affiliatedUnit: '3',
loginName: '4',
userName: '5',
},
{
userType: '1',
companyType: '2',
affiliatedUnit: '3',
loginName: '4',
userName: '5',
},
{
userType: '1',
companyType: '2',
affiliatedUnit: '3',
loginName: '4',
userName: '5',
},
],
// 抽屉列表查询参数
detailTotal: 20,
detailQueryParams: {
page: 1,
rows: 10,
username: '',
loginTime: ''
},
// 右到左的抽屉相关数据
drawer: false,
}
},
computed: {
......@@ -27,8 +211,72 @@ export default {
},
methods: {
/** 查询分页 */
getList() {
// this.loading = true
// list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
// this.list = response.rows
// this.total = response.total
// this.loading = false
// })
},
/** 查询分页 */
detailGetList() {
// this.loading = true
// list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
// this.list = response.rows
// this.total = response.total
// this.loading = false
// })
},
// 右侧弹窗关闭逻辑
handleClose(done) {
done()
},
// 获取被点击的格的信息
clickTable(row,column,event,cell) {
this.drawer = true
// 行信息
console.log(row)
// 列信息
console.log(column)
console.log(event)
console.log(cell)
},
}
}
</script>
<style lang="scss" scoped></style>
\ No newline at end of file
<style lang="scss" scoped>
.list {
margin-left: 1%;
margin-top: 20px;
width: 98%;
height: 500px;
border-radius: 4px;
// box-shadow: 0 0 5px rgba(63, 63, 63, 0.4);
.title {
position: relative;
padding: 10px;
height: 50px;
.decoration {
float: left;
margin-top: 6px;
width: 8px;
height: 16px;
background-color: rgba(64, 158, 255, 1);
}
.text {
float: left;
margin-left: 5px;
margin-top: 5px;
font-size: 16px;
}
}
}
</style>
\ No newline at end of file
src/views/dataStatistics/classView/index.vue
View file @ f23bc3e3
......@@ -16,16 +16,28 @@
<div class="title">
<div class="decoration"></div>
<div class="text">课程方案</div>
<div class="button">
<el-button-group>
<el-button @click="change1" :type="button1">企业</el-button>
<el-button @click="change2" :type="button2">院校</el-button>
</el-button-group>
</div>
</div>
<div id="chart5" class="chart"></div>
<div id="chart6" class="chart"></div>
<div id="chart7" class="chart"></div>
<div id="chart8" class="chart"></div>
<div id="chart8" class="chart" v-show="button1 != ''"></div>
</div>
<div class="downLeft">
<div class="title">
<div class="decoration"></div>
<div class="text">技术分布</div>
<div class="button">
<el-button-group>
<el-button @click="change3" :type="button3">企业</el-button>
<el-button @click="change4" :type="button4">院校</el-button>
</el-button-group>
</div>
</div>
<div id="bar1"></div>
</div>
......@@ -51,13 +63,14 @@
stripe
:header-cell-style="{background:'rgb(250,250,250)'}">
<el-table-column type="index" width="55" label="序号" align="center" />
<el-table-column label="课程名称" align="center" prop="className" />
<el-table-column label="课时数" align="center" prop="classHour" width="130"
<el-table-column label="课程名称" align="center" prop="lessonName" />
<el-table-column label="课时数" align="center" prop="lessonHour" width="130"
:show-overflow-tooltip="true" />
<el-table-column label="学习总人数" align="center" prop="allPeople" :show-overflow-tooltip="true" />
<el-table-column label="未开始人数" align="center" prop="noStart"></el-table-column>
<el-table-column label="学习完成人数" align="center" prop="complete"></el-table-column>
<el-table-column label="参与考核人数" align="center" prop="participants"></el-table-column>
<el-table-column label="学习总人数" align="center" prop="totalNumber" :show-overflow-tooltip="true" />
<el-table-column label="未开始人数" align="center" prop="notStart"></el-table-column>
<el-table-column label="学习中人数" align="center" prop="learning"></el-table-column>
<el-table-column label="学习完成人数" align="center" prop="finish"></el-table-column>
<el-table-column label="参与考核人数" align="center" prop="examed"></el-table-column>
</el-table>
<pagination
v-show="total>0"
......@@ -83,12 +96,9 @@
<div>未开始人数:</div>
<el-table v-loading="loading" border :data="detailList">
<el-table-column type="index" width="55" label="序号" align="center" />
<el-table-column label="用户类型" align="center" prop="userType" />
<el-table-column label="单位类型" align="center" prop="companyType" width="130"
:show-overflow-tooltip="true" />
<el-table-column label="所属单位" align="center" prop="affiliatedUnit" :show-overflow-tooltip="true" />
<el-table-column label="登录名" align="center" prop="loginName"></el-table-column>
<el-table-column label="用户姓名" align="center" prop="userName"></el-table-column>
<el-table-column v-for="(column, index) in drawerHead" :key="index"
:label="column.label" align="center" :prop="column.prop">
</el-table-column>
</el-table>
<pagination
......@@ -106,78 +116,59 @@
<script>
import { getDataCache, setDataCache } from '@/assets/js/filterData'
import { getDifficultyLevel, getClassPlan, getTecClassify, getJobClassify } from '@/api/dataStatistics/classView'
import { color } from 'echarts'
export default {
name: 'classView',
data() {
return {
// 切换按钮
button1: 'primary',
button2: '',
button3: 'primary',
button4: '',
// 是否加载
loading: false,
// 底部列表数据
list: [
{
className: '1',
classHour: '2',
allPeople: '3',
noStart: '4',
complete: '5',
participants: '6',
},
{
className: '1',
classHour: '2',
allPeople: '3',
noStart: '4',
complete: '5',
participants: '6',
lessonName: '1',
lessonHour: '2',
totalNumber: '3',
notStart: '4',
learning: '5',
finish: '6',
examed: '6',
},
{
className: '1',
classHour: '2',
allPeople: '3',
noStart: '4',
complete: '5',
participants: '6',
lessonName: '1',
lessonHour: '2',
totalNumber: '3',
notStart: '4',
learning: '5',
finish: '6',
examed: '6',
},
{
className: '1',
classHour: '2',
allPeople: '3',
noStart: '4',
complete: '5',
participants: '6',
lessonName: '1',
lessonHour: '2',
totalNumber: '3',
notStart: '4',
learning: '5',
finish: '6',
examed: '6',
},
{
className: '1',
classHour: '2',
allPeople: '3',
noStart: '4',
complete: '5',
participants: '6',
},
{
className: '1',
classHour: '2',
allPeople: '3',
noStart: '4',
complete: '5',
participants: '6',
},
{
className: '1',
classHour: '2',
allPeople: '3',
noStart: '4',
complete: '5',
participants: '6',
},
{
className: '1',
classHour: '2',
allPeople: '3',
noStart: '4',
complete: '5',
participants: '6',
lessonName: '1',
lessonHour: '2',
totalNumber: '3',
notStart: '4',
learning: '5',
finish: '6',
examed: '6',
}
],
// 查询参数
......@@ -188,6 +179,16 @@ export default {
username: '',
loginTime: ''
},
// 下面的两个要同时获得,保证能对得上
// 抽屉列表的表头信息
drawerHead: [
{label: '用户类型',prop: 'userType'},
{label: '单位类型',prop: 'companyType'},
{label: '所属单位',prop: 'affiliatedUnit'},
{label: '登录名',prop: 'loginName'},
{label: '用户姓名',prop: 'userName'},
],
// 抽屉列表信息
detailList: [
{
......@@ -322,6 +323,7 @@ export default {
},
mounted() {
this.init()
this.drawChart1()
this.drawChart2()
this.drawChart3()
......@@ -353,6 +355,103 @@ export default {
// })
},
// 初始化
init() {
// 获取左上卡数据
getDifficultyLevel()
.then((res)=>{
let data = res.data
this.data.data1Percent = 100
this.data.data1[0].value = data.total
this.data.data2Percent = data.simple/data.total*10
this.data.data2[0].value = data.simple
this.data.data2[1].value = data.total - data.simple
this.data.data3Percent = data.general/data.total*10
this.data.data3[0].value = data.general
this.data.data3[1].value = data.total - data.general
this.data.data4Percent = data.difficulty/data.total*10
this.data.data4[0].value = data.difficulty
this.data.data4[1].value = data.total - data.difficulty
this.drawChart1()
this.drawChart2()
this.drawChart3()
this.drawChart4()
// console.log(this.data);
})
.catch((err)=>{
console.log(err);
})
// 获取右上数据
getClassPlan(1)
.then((res)=>{
let data = res.data
this.data.data5Percent = 100
this.data.data5[0].value = data.total
this.data.data6Percent = data.leadingEdge/data.total*10
this.data.data6[0].value = data.leadingEdge
this.data.data6[1].value = data.total - data.leadingEdge
this.data.data7Percent = data.postAbility/data.total*10
this.data.data7[0].value = data.postAbility
this.data.data7[1].value = data.total - data.postAbility
this.data.data7[0].name = '岗位能力准入'
this.data.data8Percent = data.universalCapability/data.total*10
this.data.data8[0].value = data.universalCapability
this.data.data8[1].value = data.total - data.universalCapability
this.drawChart5()
this.drawChart6()
this.drawChart7()
this.drawChart8()
})
.catch((err)=>{
console.log(err);
})
// 获取左下数据
getTecClassify(1)
.then((res)=>{
let data = res.data
this.barData.bar1data.y[0] = data.nvironmentalAwareness
this.barData.bar1data.y[1] = data.intelligentDecision
this.barData.bar1data.y[2] = data.controlExecution
this.barData.bar1data.y[3] = data.systemDesign
this.barData.bar1data.y[4] = data.privateCommunications
this.barData.bar1data.y[5] = data.bigDataCloudControl
this.barData.bar1data.y[6] = data.vehicleRoadCoordination
this.bar1()
})
.catch((err)=>{
console.log(err);
})
// 获取右下数据
getJobClassify()
.then((res)=>{
let data = res.data
this.barData.bar2data.y[0] = data.dcae
this.barData.bar2data.y[1] = data.wccse
this.barData.bar2data.y[2] = data.sae
this.barData.bar2data.y[3] = data.siae
this.barData.bar2data.y[4] = data.pae
this.barData.bar2data.y[5] = data.ate
this.bar2()
})
.catch((err)=>{
console.log(err);
})
// 获取下方列表数据
},
// 右侧弹窗关闭逻辑
handleClose(done) {
......@@ -369,6 +468,106 @@ export default {
console.log(cell)
},
// 按钮切换
change1() {
this.button1 = 'primary',
this.button2 = '',
// 获取右上数据
getClassPlan(1)
.then((res)=>{
let data = res.data
this.data.data5Percent = 100
this.data.data5[0].value = data.total
this.data.data6Percent = data.leadingEdge/data.total*10
this.data.data6[0].value = data.leadingEdge
this.data.data6[1].value = data.total - data.leadingEdge
this.data.data7Percent = data.postAbility/data.total*10
this.data.data7[0].value = data.postAbility
this.data.data7[1].value = data.total - data.postAbility
this.data.data7[0].name = '岗位能力准入'
this.data.data8Percent = data.universalCapability/data.total*10
this.data.data8[0].value = data.universalCapability
this.data.data8[1].value = data.total - data.universalCapability
this.drawChart5()
this.drawChart6()
this.drawChart7()
this.drawChart8()
})
.catch((err)=>{
console.log(err);
})
},
change2() {
this.button1 = '',
this.button2 = 'primary',
// 获取右上数据
getClassPlan(0)
.then((res)=>{
let data = res.data
this.data.data5Percent = 100
this.data.data5[0].value = data.total
this.data.data6Percent = data.leadingEdge/data.total*10
this.data.data6[0].value = data.leadingEdge
this.data.data6[1].value = data.total - data.leadingEdge
this.data.data7Percent = data.postAbility/data.total*10
this.data.data7[0].value = data.postAbility
this.data.data7[1].value = data.total - data.postAbility
this.data.data7[0].name = '基础能力培养'
this.drawChart5()
this.drawChart6()
this.drawChart7()
})
.catch((err)=>{
console.log(err);
})
},
change3() {
this.button3 = 'primary',
this.button4 = '',
// 获取左下数据
getTecClassify(1)
.then((res)=>{
let data = res.data
this.barData.bar1data.y[0] = data.nvironmentalAwareness
this.barData.bar1data.y[1] = data.intelligentDecision
this.barData.bar1data.y[2] = data.controlExecution
this.barData.bar1data.y[3] = data.systemDesign
this.barData.bar1data.y[4] = data.privateCommunications
this.barData.bar1data.y[5] = data.bigDataCloudControl
this.barData.bar1data.y[6] = data.vehicleRoadCoordination
this.bar1()
})
.catch((err)=>{
console.log(err);
})
},
change4() {
this.button3 = '',
this.button4 = 'primary',
// 获取左下数据
getTecClassify(0)
.then((res)=>{
let data = res.data
this.barData.bar1data.y[0] = data.nvironmentalAwareness
this.barData.bar1data.y[1] = data.intelligentDecision
this.barData.bar1data.y[2] = data.controlExecution
this.barData.bar1data.y[3] = data.systemDesign
this.barData.bar1data.y[4] = data.privateCommunications
this.barData.bar1data.y[5] = data.bigDataCloudControl
this.barData.bar1data.y[6] = data.vehicleRoadCoordination
this.bar1()
})
.catch((err)=>{
console.log(err);
})
},
// 常用配置项需要整合提出来,不然太复杂
......@@ -407,7 +606,7 @@ export default {
left: 'center', //定位
top: '42%', // 定位
style: { // 样式
text: this.data.data1Percent, //文字
text: this.data.data1[0].value, //文字
fontSize: 26, //文字大小
textAlign: 'center', //定位
width: 50,
......@@ -468,7 +667,7 @@ export default {
left: 'center', //定位
top: '42%', // 定位
style: { // 样式
text: this.data.data2Percent, //文字
text: this.data.data2[0].value, //文字
fontSize: 26, //文字大小
textAlign: 'center', //定位
width: 50,
......@@ -529,7 +728,7 @@ export default {
left: 'center', //定位
top: '42%', // 定位
style: { // 样式
text: this.data.data3Percent, //文字
text: this.data.data3[0].value, //文字
fontSize: 26, //文字大小
textAlign: 'center', //定位
width: 50,
......@@ -590,7 +789,7 @@ export default {
left: 'center', //定位
top: '42%', // 定位
style: { // 样式
text: this.data.data4Percent, //文字
text: this.data.data4[0].value, //文字
fontSize: 26, //文字大小
textAlign: 'center', //定位
width: 50,
......@@ -651,7 +850,7 @@ export default {
left: 'center', //定位
top: '42%', // 定位
style: { // 样式
text: this.data.data5Percent, //文字
text: this.data.data5[0].value, //文字
fontSize: 26, //文字大小
textAlign: 'center', //定位
width: 50,
......@@ -712,7 +911,7 @@ export default {
left: 'center', //定位
top: '42%', // 定位
style: { // 样式
text: this.data.data6Percent, //文字
text: this.data.data6[0].value, //文字
fontSize: 26, //文字大小
textAlign: 'center', //定位
width: 50,
......@@ -773,7 +972,7 @@ export default {
left: 'center', //定位
top: '42%', // 定位
style: { // 样式
text: this.data.data7Percent, //文字
text: this.data.data7[0].value, //文字
fontSize: 26, //文字大小
textAlign: 'center', //定位
width: 50,
......@@ -834,7 +1033,7 @@ export default {
left: 'center', //定位
top: '42%', // 定位
style: { // 样式
text: this.data.data8Percent, //文字
text: this.data.data8[0].value, //文字
fontSize: 26, //文字大小
textAlign: 'center', //定位
width: 50,
......@@ -1039,6 +1238,7 @@ export default {
position: absolute;
left: 20px;
top: 20px;
width: 100%;
.decoration {
float: left;
......@@ -1054,8 +1254,15 @@ export default {
margin-top: 5px;
font-size: 16px;
}
.button {
position: relative;
float: right;
margin-right: 80px;
z-index: 99;
}
}
.chart {
float: left;
width: 25%;
......@@ -1078,6 +1285,8 @@ export default {
position: absolute;
left: 20px;
top: 10px;
width: 100%;
.decoration {
float: left;
......@@ -1093,6 +1302,12 @@ export default {
margin-top: 5px;
font-size: 16px;
}
.button {
position: relative;
float: right;
margin-right: 80px;
z-index: 99;
}
}
#bar1 {
......
src/views/dataStatistics/companyView/index.vue
View file @ f23bc3e3
<template>
<!-- 单位视图 -->
<div class="companyView">
<div class="upCard">
<div class="left">
......@@ -67,14 +68,14 @@
stripe
:header-cell-style="{background:'rgb(250,250,250)'}">
<el-table-column type="index" width="55" label="序号" align="center" />
<el-table-column label="单位名称" align="center" prop="companyName" />
<el-table-column label="学员人数" align="center" prop="studentNum" width="130"
<el-table-column label="单位名称" align="center" prop="unitName" />
<el-table-column label="学员人数" align="center" prop="studentNumber" width="130"
:show-overflow-tooltip="true" />
<el-table-column label="付费课程数" align="center" prop="payClassNum" :show-overflow-tooltip="true" />
<el-table-column label="试用课程数" align="center" prop="testClassName"></el-table-column>
<el-table-column label="完成必修课人次" align="center" prop="completeNum"></el-table-column>
<el-table-column label="未完成必修课人次" align="center" prop="uncompleteNum"></el-table-column>
<el-table-column label="必修考核记录数 " align="center" prop="recordNum"></el-table-column>
<el-table-column label="付费课程数" align="center" prop="payed" :show-overflow-tooltip="true" />
<el-table-column label="试用课程数" align="center" prop="noPay"></el-table-column>
<el-table-column label="完成必修课人次" align="center" prop="finish"></el-table-column>
<el-table-column label="未完成必修课人次" align="center" prop="notFinish"></el-table-column>
<el-table-column label="必修考核记录数 " align="center" prop="exam"></el-table-column>
</el-table>
<pagination
v-show="total>0"
......@@ -100,12 +101,9 @@
<div>未开始人数:</div>
<el-table v-loading="loading" border :data="detailList">
<el-table-column type="index" width="55" label="序号" align="center" />
<el-table-column label="用户类型" align="center" prop="userType" />
<el-table-column label="单位类型" align="center" prop="companyType" width="130"
:show-overflow-tooltip="true" />
<el-table-column label="所属单位" align="center" prop="affiliatedUnit" :show-overflow-tooltip="true" />
<el-table-column label="登录名" align="center" prop="loginName"></el-table-column>
<el-table-column label="用户姓名" align="center" prop="userName"></el-table-column>
<el-table-column v-for="(column, index) in drawerHead" :key="index"
:label="column.label" align="center" :prop="column.prop">
</el-table-column>
</el-table>
<pagination
......@@ -165,41 +163,42 @@ export default {
// 底部列表数据
list: [
{
companyName: 'xxxx',
studentNum: '2',
payClassNum: '3',
testClassName: '4',
completeNum: '5',
uncompleteNum: '6',
recordNum: '7',
unitName: 'xxxx',
studentNumber: '2',
payed: '3',
noPay: '4',
finish: '5',
notFinish: '6',
exam: '7',
},
{
companyName: 'xxxx',
studentNum: '2',
payClassNum: '3',
testClassName: '4',
completeNum: '5',
uncompleteNum: '6',
recordNum: '7',
unitName: 'xxxx',
studentNumber: '2',
payed: '3',
noPay: '4',
finish: '5',
notFinish: '6',
exam: '7',
},
{
companyName: 'xxxx',
studentNum: '2',
payClassNum: '3',
testClassName: '4',
completeNum: '5',
uncompleteNum: '6',
recordNum: '7',
unitName: 'xxxx',
studentNumber: '2',
payed: '3',
noPay: '4',
finish: '5',
notFinish: '6',
exam: '7',
},
{
companyName: 'xxxx',
studentNum: '2',
payClassNum: '3',
testClassName: '4',
completeNum: '5',
uncompleteNum: '6',
recordNum: '7',
unitName: 'xxxx',
studentNumber: '2',
payed: '3',
noPay: '4',
finish: '5',
notFinish: '6',
exam: '7',
},
],
// 查询参数
total: 20,
......@@ -210,6 +209,16 @@ export default {
loginTime: ''
},
// 下面的两个要同时获得,保证能对得上
// 抽屉列表的表头信息
drawerHead: [
{label: '用户类型',prop: 'userType'},
{label: '单位类型',prop: 'companyType'},
{label: '所属单位',prop: 'affiliatedUnit'},
{label: '登录名',prop: 'loginName'},
{label: '用户姓名',prop: 'userName'},
],
// 抽屉列表信息
detailList: [
{
......@@ -265,7 +274,7 @@ export default {
},
methods: {
/** 查询登录日志列表 */
/** 查询分页 */
getList() {
// this.loading = true
// list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
......@@ -274,7 +283,7 @@ export default {
// this.loading = false
// })
},
/** 查询登录日志列表 */
/** 查询分页 */
detailGetList() {
// this.loading = true
// list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
......
src/views/dataStatistics/userView/index.vue
View file @ f23bc3e3
<template>
<div class="errLog-manage">
用户视图
<div class="list">
<div class="title">
<div class="decoration"></div>
<div class="text">统计列表</div>
</div>
<div style="padding-bottom: 10px;">
<span style="font-size: 16px;">姓名:</span>
<span>
<el-input v-model="input" placeholder="请输入" style="width: 140px; margin-left: 10px;"></el-input>
<el-button type="primary" style="margin-left: 10px;">查询</el-button>
<el-button>重置</el-button>
</span>
</div>
<el-table
v-loading="loading"
border
:data="list"
@cell-click="clickTable"
stripe
:header-cell-style="{background:'rgb(250,250,250)'}">
<el-table-column type="index" width="55" label="序号" align="center" />
<el-table-column label="姓名" align="center" prop="name" />
<el-table-column label="所属单位" align="center" prop="unitName" width="130"
:show-overflow-tooltip="true" />
<el-table-column label="手机号" align="center" prop="phone" :show-overflow-tooltip="true" />
<el-table-column label="累计完成课时数" align="center" prop="lessonHour"></el-table-column>
<el-table-column label="计划课程总数" align="center" prop="total"></el-table-column>
<el-table-column label="学习中课程数" align="center" prop="learning"></el-table-column>
<el-table-column label="已学完课程数 " align="center" prop="finish"></el-table-column>
<el-table-column label="未开始课程数" align="center" prop="notStart"></el-table-column>
<el-table-column label="参与考核课程数 " align="center" prop="examedNumber"></el-table-column>
<el-table-column label="未考核课程数 " align="center" prop="notExamedNumber"></el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
@pagination="getList"
/>
</div>
<!-- 点击列表数据后的右弹窗 -->
<el-drawer
title="统计明细"
:visible.sync="drawer"
direction="rtl"
:before-close="handleClose"
size="50%">
<!-- 内容 -->
<div style="width: 90%; margin-left: 5%;">
<div>课程名称:</div>
<div>未开始人数:</div>
<el-table v-loading="loading" border :data="detailList">
<el-table-column type="index" width="55" label="序号" align="center" />
<el-table-column v-for="(column, index) in drawerHead" :key="index"
:label="column.label" align="center" :prop="column.prop">
</el-table-column>
</el-table>
<pagination
v-show="detailTotal>0"
:total="detailTotal"
:page.sync="detailQueryParams.page"
:limit.sync="detailQueryParams.rows"
@pagination="detailGetList"
/>
</div>
</el-drawer>
</div>
</template>
......@@ -13,6 +84,111 @@ export default {
data() {
return {
// 查询部分
input: '',
// 是否加载
loading: false,
// 底部列表数据
list: [
{
name: 'xxxx',
unitName: '2',
phone: '3',
lessonHour: '4',
total: '5',
learning: '6',
finish: '7',
notStart: '7',
examedNumber: '7',
notExamedNumber: '7',
},
{
name: 'xxxx',
unitName: '2',
phone: '3',
lessonHour: '4',
total: '5',
learning: '6',
finish: '7',
notStart: '7',
examedNumber: '7',
notExamedNumber: '7',
},
{
name: 'xxxx',
unitName: '2',
phone: '3',
lessonHour: '4',
total: '5',
learning: '6',
finish: '7',
notStart: '7',
examedNumber: '7',
notExamedNumber: '7',
},
],
// 查询参数
total: 20,
queryParams: {
page: 1,
rows: 10,
username: '',
loginTime: ''
},
// 下面的两个要同时获得,保证能对得上
// 抽屉列表的表头信息
drawerHead: [
{label: '用户类型',prop: 'userType'},
{label: '单位类型',prop: 'companyType'},
{label: '所属单位',prop: 'affiliatedUnit'},
{label: '登录名',prop: 'loginName'},
{label: '用户姓名',prop: 'userName'},
],
// 抽屉列表信息
detailList: [
{
userType: '1',
companyType: '2',
affiliatedUnit: '3',
loginName: '4',
userName: '5',
},
{
userType: '1',
companyType: '2',
affiliatedUnit: '3',
loginName: '4',
userName: '5',
},
{
userType: '1',
companyType: '2',
affiliatedUnit: '3',
loginName: '4',
userName: '5',
},
{
userType: '1',
companyType: '2',
affiliatedUnit: '3',
loginName: '4',
userName: '5',
},
],
// 抽屉列表查询参数
detailTotal: 20,
detailQueryParams: {
page: 1,
rows: 10,
username: '',
loginTime: ''
},
// 右到左的抽屉相关数据
drawer: false,
}
},
computed: {
......@@ -27,8 +203,72 @@ export default {
},
methods: {
/** 查询分页 */
getList() {
// this.loading = true
// list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
// this.list = response.rows
// this.total = response.total
// this.loading = false
// })
},
/** 查询分页 */
detailGetList() {
// this.loading = true
// list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
// this.list = response.rows
// this.total = response.total
// this.loading = false
// })
},
// 右侧弹窗关闭逻辑
handleClose(done) {
done()
},
// 获取被点击的格的信息
clickTable(row,column,event,cell) {
this.drawer = true
// 行信息
console.log(row)
// 列信息
console.log(column)
console.log(event)
console.log(cell)
},
}
}
</script>
<style lang="scss" scoped></style>
\ No newline at end of file
<style lang="scss" scoped>
.list {
margin-left: 1%;
margin-top: 20px;
width: 98%;
height: 500px;
border-radius: 4px;
// box-shadow: 0 0 5px rgba(63, 63, 63, 0.4);
.title {
position: relative;
padding: 10px;
height: 50px;
.decoration {
float: left;
margin-top: 6px;
width: 8px;
height: 16px;
background-color: rgba(64, 158, 255, 1);
}
.text {
float: left;
margin-left: 5px;
margin-top: 5px;
font-size: 16px;
}
}
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment