292 lines
11 KiB
HTML
292 lines
11 KiB
HTML
|
<!doctype html>
|
|||
|
|
<html>
|
|||
|
|
|
|||
|
|
<head>
|
|||
|
|
<title></title>
|
|||
|
|
|
|||
|
|
<vt:include file="inc/meta_api.inc" />
|
|||
|
|
<script src="/Utility/ElementUi/index.js"></script>
|
|||
|
|
<style>
|
|||
|
|
.box-card {
|
|||
|
|
width: 500px;
|
|||
|
|
margin-bottom: 20px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.item {
|
|||
|
|
height: 50px;
|
|||
|
|
line-height: 50px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.item>span {
|
|||
|
|
display: block;
|
|||
|
|
width: 60px;
|
|||
|
|
text-align: right;
|
|||
|
|
float: left;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.item .el-input {
|
|||
|
|
width: auto;
|
|||
|
|
width: calc(100% - 100px);
|
|||
|
|
float: left;
|
|||
|
|
margin-left: 5px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#log-box {
|
|||
|
|
width: calc(100% - 540px);
|
|||
|
|
position: absolute;
|
|||
|
|
right: 8px;
|
|||
|
|
top: 8px;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
|
|||
|
|
<body>
|
|||
|
|
<div id="vue-app">
|
|||
|
|
<!-- 查询框-->
|
|||
|
|
<el-card class="box-card">
|
|||
|
|
<div slot="header" class="clearfix">
|
|||
|
|
<span>按名称或账号查询</span>
|
|||
|
|
<el-button style="float: right; padding: 8px 20px;margin-top: -5px;" type="primary"
|
|||
|
|
@click="getAccountLogs">
|
|||
|
|
查询
|
|||
|
|
</el-button>
|
|||
|
|
</div>
|
|||
|
|
<div class="item">
|
|||
|
|
<span>姓名：</span>
|
|||
|
|
<el-input placeholder="请输入内容" v-model="name" class="textbox"></el-input>
|
|||
|
|
</div>
|
|||
|
|
<div class="item">
|
|||
|
|
<span>账号：</span>
|
|||
|
|
<el-input placeholder="请输入内容" v-model="acc" class="textbox"></el-input>
|
|||
|
|
</div>
|
|||
|
|
</el-card>
|
|||
|
|
<!--学习记录的查询结果-->
|
|||
|
|
<el-card class="box-card" v-show="result.showBox">
|
|||
|
|
<div slot="header" class="clearfix">
|
|||
|
|
<span>来自学习记录（LogForStudentStudy)的查询结果</span>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<el-table :data="result.logs" v-loading="loading" stripe style="width: 100%">
|
|||
|
|
<el-table-column prop="Ac_ID" label="ID" width="100">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ac_Name" label="姓名" width="100">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ac_AccName" label="账号" width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column label="学习记录" width="80" fixed="right">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<el-button @click="getStudyLog(scope.row)" type="text" size="small">查看</el-button>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
</el-card>
|
|||
|
|
<!--账户表的学员信息-->
|
|||
|
|
<el-card class="box-card" v-show="result.showBox">
|
|||
|
|
<div slot="header" class="clearfix">
|
|||
|
|
<span>通过学习记录，反查账户（Accounts)</span>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<el-table :data="result.accounts" v-loading="loading" stripe style="width: 100%">
|
|||
|
|
<el-table-column prop="Ac_ID" label="ID" width="100">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ac_Name" label="姓名" width="100">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ac_AccName" label="账号" width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ac_LastTime" label="最后登录">
|
|||
|
|
</el-table-column>
|
|||
|
|
|
|||
|
|
</el-table>
|
|||
|
|
</el-card>
|
|||
|
|
<el-card class="box-card" v-show="result.showBox">
|
|||
|
|
<div slot="header" class="clearfix">
|
|||
|
|
<span>通过学员姓名，反查账户（Accounts)</span>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<el-table :data="result.acc4name" v-loading="loading" stripe style="width: 100%">
|
|||
|
|
<el-table-column prop="Ac_ID" label="ID" width="100">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ac_Name" label="姓名" width="100">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ac_AccName" label="账号" width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ac_LastTime" label="最后登录">
|
|||
|
|
</el-table-column>
|
|||
|
|
|
|||
|
|
</el-table>
|
|||
|
|
</el-card>
|
|||
|
|
<!-- 学习记录-->
|
|||
|
|
<el-card class="box-card" id="log-box" v-show="log.showBox">
|
|||
|
|
<div slot="header" class="clearfix">
|
|||
|
|
<span><b>{{log.name}}</b> 的学习记录</span>
|
|||
|
|
<template>
|
|||
|
|
<el-select style="display: none" v-model="log.curr_Course" style="float: right" placeholder="课程"
|
|||
|
|
@change="getCourse">
|
|||
|
|
<el-option v-for="item in courses" :key="item.Cou_ID" :label="item.Cou_Name"
|
|||
|
|
:value="item.Cou_ID">
|
|||
|
|
</el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</template>
|
|||
|
|
</div>
|
|||
|
|
<el-table :data="log.logs" stripe style="width: 100%">
|
|||
|
|
<el-table-column prop="Ac_ID" label="ID" width="100">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ac_Name" label="姓名" width="100">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ac_AccName" label="账号" width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Cou_ID" label="课程" :filters="coursesFilter" :filter-method="filterHandler">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
{{scope.row.Org_ID}}
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Ol_ID" label="章节" width="60">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Lss_IP" label="IP">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column prop="Lss_LastTime" label="时间">
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
</el-card>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</body>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
var vm = new Vue({
|
|||
|
|
data: {
|
|||
|
|
name: '', //学员姓名
|
|||
|
|
acc: '', //学员账号
|
|||
|
|
loading: true,
|
|||
|
|
result: {
|
|||
|
|
accounts: new Array(), //查询到学员信息
|
|||
|
|
logs: new Array(), //查询到学员信息
|
|||
|
|
acc4name: new Array(), //通过姓名查询来的账号
|
|||
|
|
success: false,
|
|||
|
|
showBox: false,
|
|||
|
|
showError: false
|
|||
|
|
},
|
|||
|
|
//学习记录
|
|||
|
|
log: {
|
|||
|
|
showBox: false,
|
|||
|
|
name: '', //当学员名称
|
|||
|
|
acid: 0, //当前学员id
|
|||
|
|
logs: new Array(),
|
|||
|
|
course: [],
|
|||
|
|
curr_Course: ''
|
|||
|
|
},
|
|||
|
|
courses: new Array(),
|
|||
|
|
//课程筛选
|
|||
|
|
coursesFilter: new Array()
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
//获取学员账户信息
|
|||
|
|
getAccountLogs: function () {
|
|||
|
|
$api.get('Account/ForLogs', { acc: this.acc, name: this.name }, function () {
|
|||
|
|
vm.result.accounts = [];
|
|||
|
|
vm.result.showBox = true;
|
|||
|
|
vm.loading = true;
|
|||
|
|
}, function () {
|
|||
|
|
vm.loading = false;
|
|||
|
|
}).then(function (response) {
|
|||
|
|
var data = response.data;
|
|||
|
|
if (data.Success) {
|
|||
|
|
vm.result.logs = data.Data;
|
|||
|
|
}
|
|||
|
|
vm.result.acc4name = [];
|
|||
|
|
for (var i = 0; i < vm.result.logs.length; i++) {
|
|||
|
|
var acid = vm.result.logs[i].Ac_ID;
|
|||
|
|
$api.get('Account/ForID', { id: acid }).then(function (d) {
|
|||
|
|
var data = d.data;
|
|||
|
|
if (data.Success) {
|
|||
|
|
vm.result.accounts.push(data.Data);
|
|||
|
|
var acname = data.Data.Ac_Name;
|
|||
|
|
$api.get('Account/ForName', { name: acname }).then(function (d) {
|
|||
|
|
var data = d.data;
|
|||
|
|
if (data.Success) {
|
|||
|
|
for (var j = 0; j < data.Data.length; j++) {
|
|||
|
|
vm.result.acc4name.push(data.Data[j]);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}).catch(function (error) {
|
|||
|
|
console.log(error);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
//获取学员学习记录
|
|||
|
|
getStudyLog: function (acc) {
|
|||
|
|
vm.log.name = acc.Ac_Name;
|
|||
|
|
vm.log.acid = acc.Ac_ID;
|
|||
|
|
vm.log.showBox = true;
|
|||
|
|
$api.get('Account/StudyLog', { acid: acc.Ac_ID, couid: -1 }).then(function (response) {
|
|||
|
|
var data = response.data;
|
|||
|
|
if (data.Success) {
|
|||
|
|
var courses = new Array();
|
|||
|
|
for (var i = 0; i < data.Data.length; i++) {
|
|||
|
|
if (courses.indexOf(data.Data[i].Cou_ID) > -1)
|
|||
|
|
continue;
|
|||
|
|
courses.push(data.Data[i].Cou_ID);
|
|||
|
|
}
|
|||
|
|
vm.courses = [];
|
|||
|
|
vm.coursesFilter = [];
|
|||
|
|
for (var j = 0; j < courses.length; j++) {
|
|||
|
|
$api.get('Course/ForID', { id: courses[j] }).then(function (response) {
|
|||
|
|
var data = response.data;
|
|||
|
|
if (data.Success) {
|
|||
|
|
vm.courses.push(data.Data);
|
|||
|
|
vm.coursesFilter.push({ text: data.Data.Cou_Name, value: data.Data.Cou_ID });
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
vm.log.logs = data.Data;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}).catch(function (error) {
|
|||
|
|
console.log(error);
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
getCourse: function (couid) {
|
|||
|
|
$api.get('Account/StudyLog', { acid: vm.log.acid, couid: couid }).then(function (response) {
|
|||
|
|
var data = response.data;
|
|||
|
|
if (data.Success) {
|
|||
|
|
vm.log.logs = data.Data;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
//获取课程名称
|
|||
|
|
getCourName: function (log) {
|
|||
|
|
var couname = '';
|
|||
|
|
for (var j = 0; j < vm.courses.length; j++) {
|
|||
|
|
if (vm.courses[j].Cou_ID == log.Cou_ID) {
|
|||
|
|
couname = vm.Cou_Name;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return couname;
|
|||
|
|
},
|
|||
|
|
filterHandler(value, row, column) {
|
|||
|
|
const property = column['property'];
|
|||
|
|
var rowid = row[property];
|
|||
|
|
return row[property] === value;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
watch: {
|
|||
|
|
courses: function () {
|
|||
|
|
for (var i = 0; i < vm.courses.length; i++) {
|
|||
|
|
for (var j = 0; j < vm.log.logs.length; j++) {
|
|||
|
|
if (vm.courses[i].Cou_ID == vm.log.logs[j].Cou_ID) {
|
|||
|
|
vm.log.logs[j].Org_ID = vm.courses[i].Cou_Name;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
vm.$mount('#vue-app');
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
</html>
|