<template>
|
<div class="app-container">
|
<div >
|
<el-date-picker
|
v-model="time"
|
size="small"
|
type="daterange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
format="yyyy-MM-dd"
|
>
|
</el-date-picker>
|
<el-cascader
|
v-model="queryParams.subjectCode"
|
ref="classifyRef"
|
@change="changeTree"
|
:options="subjectList"
|
:props="{ checkStrictly: true }"
|
clearable
|
size="small"
|
style="margin-left: 30px;"
|
></el-cascader>
|
<!-- <el-select v-model="queryParams.subjectCode" size="small" style="margin-left: 40px;" clearable placeholder="请选择资格类型">-->
|
<!-- <el-option-->
|
<!-- v-for="item in subjectList"-->
|
<!-- :key="item.id"-->
|
<!-- :label="item.name"-->
|
<!-- :value="item.id">-->
|
<!-- </el-option>-->
|
<!-- </el-select>-->
|
<el-input size="small" style="margin-left: 30px;width: 200px" v-model="queryParams.trainOrgName" placeholder="请输入机构"></el-input>
|
<!-- <el-select v-model="queryParams.trainOrgId" size="small" style="margin-left: 40px;" clearable filterable placeholder="请选择所属机构">-->
|
<!-- <el-option-->
|
<!-- v-for="item in trainOrgList"-->
|
<!-- :key="item.id"-->
|
<!-- :label="item.name"-->
|
<!-- :value="item.id">-->
|
<!-- </el-option>-->
|
<!-- </el-select>-->
|
<el-button
|
size="small"
|
type="primary"
|
style="margin-bottom: 10px;margin-left: 20px"
|
@click="handleQuery()"
|
>查询</el-button>
|
<el-button
|
size="small"
|
type="primary"
|
style="margin-bottom: 10px"
|
@click="resetQuery()"
|
>重置</el-button>
|
</div>
|
<el-table v-loading="loading" :data="expertList">
|
<el-table-column label="平台" align="center" prop="institutionName" />
|
<el-table-column label="培训总人数" align="center" prop="studentCount" />
|
<el-table-column label="培训学时达标人数" align="center" prop="finishCount" />
|
<el-table-column label="学时合格率" align="center" prop="classHourRate" />
|
<el-table-column label="考试总人数" align="center" prop="eaxmStudentCount" />
|
<el-table-column label="考试合格人数" align="center" prop="passCount" />
|
<el-table-column label="考试合格率" align="center" prop="passRate">
|
<template #default="scope">
|
<span>{{scope.row.passRate}}%</span>
|
</template>
|
</el-table-column>
|
</el-table>
|
<!-- <pagination-->
|
<!-- v-show="total>0"-->
|
<!-- :total="total"-->
|
<!-- :page.sync="queryParams.pageNum"-->
|
<!-- :limit.sync="queryParams.pageSize"-->
|
<!-- @pagination="getList"-->
|
<!-- />-->
|
</div>
|
</template>
|
|
<script>
|
import moment from 'moment'
|
import { getCount, getSubject } from '@/api/onlineEducation/count'
|
|
export default {
|
name: "count",
|
components: {},
|
data() {
|
return {
|
loading: false,
|
single: true,
|
multiple: true,
|
showSearch: true,
|
addForm: false,
|
total: 0,
|
expertList: [],
|
subjectList: [],
|
queryParams: {
|
pageNum: 1,
|
pageSize: 10,
|
startTime: '',
|
endTime: '',
|
subjectCode: null,
|
trainOrgName: ''
|
},
|
time: [],
|
trainOrgList: []
|
};
|
},
|
created() {
|
this.setDate()
|
this.getSubjectList()
|
this.getList()
|
},
|
methods: {
|
setDate(){
|
const end = new Date();
|
const start = new Date();
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
|
console.log('11',start,end)
|
const s = moment(start).format('YYYY-MM-DD')
|
const e = moment(end).format('YYYY-MM-DD')
|
this.time = [s,e]
|
},
|
changeTree(val) {
|
console.log("label====",this.$refs.classifyRef.getCheckedNodes()[0].value)
|
this.queryParams.subjectCode = this.$refs.classifyRef.getCheckedNodes()[0].value
|
// 我这里只是打印了一下label的值哦,需要赋值的话自己去赋值哦
|
if (this.$refs.classifyRef) {
|
this.$refs.classifyRef.dropDownVisible = false
|
}
|
},
|
getList(){
|
// debugger
|
if(this.time && this.time.length >0){
|
this.queryParams.startTime = moment(this.time[0]).format('YYYY-MM-DD')
|
this.queryParams.endTime = moment(this.time[1]).format('YYYY-MM-DD')
|
}
|
console.log('1111',this.queryParams)
|
this.loading = true;
|
getCount(this.queryParams).then(res => {
|
if (res.code == 200) {
|
this.expertList = res.data.map(item => {
|
return {
|
...item,
|
classHourRate: item.finishCount != 0 && item.studentCount != 0 ? (item.finishCount / item.studentCount).toFixed(2) *100 + '%': '0%'
|
}
|
})
|
this.loading = false;
|
}
|
})
|
this.loading = false;
|
},
|
handleChange(){
|
|
},
|
getSubjectList() {
|
getSubject().then(res => {
|
if (res.code == 200) {
|
console.log('res',res)
|
this.subjectList = this.recursion(res.data)
|
}
|
})
|
},
|
recursion(data){
|
let tmp = []
|
for (let i = 0; i < data.length; i++) {
|
let item = data[i]
|
// children为空
|
if (item.children&& item.children.length==0) {
|
tmp.push({
|
value: item.code,
|
label: item.name
|
})
|
// 有children
|
} else {
|
tmp.push({
|
value: item.code,
|
label: item.name,
|
children: this.recursion(item.children)
|
})
|
}
|
}
|
return tmp;
|
},
|
handleQuery(){
|
this.getList()
|
|
},
|
resetQuery(){
|
this.queryParams = {
|
pageNum: 1,
|
pageSize: 10,
|
startTime: '',
|
endTime: '',
|
subjectCode: null,
|
trainOrgName: ''
|
}
|
this.time = []
|
this.getList()
|
},
|
handleAdd(){
|
|
}
|
}
|
};
|
</script>
|