1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
| <template>
| <el-dialog
| title="学时清单"
| :visible.sync="dialogVisible"
| :modal-append-to-body="false"
| :close-on-click-modal="false"
| width="850px"
| :before-close="handleClose"
| >
| <div v-for="(item,index) in classList" :key="index">
| <span style="font-size: 16px;">{{item.courseName}}:总学时{{item.totalTime}}分钟</span>
| <el-table
| :data="item.userList"
| style="width: 100%;margin-top: 10px">
| <el-table-column
| prop="name"
| label="姓名"
| >
| </el-table-column>
| <el-table-column
| label="身份证号"
| prop="idCard" :show-overflow-tooltip="true">
| </el-table-column>
| <el-table-column
| prop="progress"
| label="当前学时进度"
| >
| <template #default="scope">
| <el-progress :text-inside="true" :stroke-width="26" :percentage="scope.row.progressRate" :status="scope.row.progressStatus"></el-progress>
| </template>
| </el-table-column>
| <el-table-column label="关联上报记录" align="center" class-name="small-padding fixed-width">
| <template #default="scope">
| <el-button
| size="mini"
| type="text"
| style="color: #1890ff"
| @click="openClassHour(scope.row)"
| >查看记录清单</el-button>
| </template>
| </el-table-column>
| <el-table-column label="学时报告" align="center" class-name="small-padding fixed-width">
| <template #default="scope">
| <el-button
| v-if="scope.row.progress == item.totalTime"
| size="mini"
| type="text"
| style="color: #1890ff"
| @click="viewLessonReport(scope.row)"
| >查看学时报告</el-button>
| <div v-else>——</div>
| </template>
| </el-table-column>
| </el-table>
| <pagination
| v-show="item.total>0"
| :total="item.total"
| :page.sync="queryParams.pageIndex"
| :limit.sync="queryParams.pageSize"
| @pagination="getList"
| />
| </div>
| <learningRecord ref="recordRef"></learningRecord>
| <lessonReport ref="lessonRef"></lessonReport>
| </el-dialog>
| </template>
|
| <script >
| import learningRecord from '@/views/onlineEducation/studentSupervision/compontents/learningRecord.vue'
| import lessonReport from '@/views/onlineEducation/studentSupervision/compontents/lessonReport.vue'
| export default {
| name: 'addUser',
| components: {
| lessonReport,
| learningRecord
| },
| data() {
| return {
| dialogVisible: false,
| dialogStatus: '',
| dataForm: {},
| queryParams: {},
| classList: [
| {
| courseName:'课程一',
| totalTime: 130,
| total: 2,
| userList: [
| {
| name: '张三',
| idCard: '320154198514571152',
| progress: 65,
| progressRate: 50,
| progressStatus:'exception'
| },
| {
| name: '李四',
| idCard: '320241198514571152',
| progress: 104,
| progressRate: 80,
| progressStatus:'warning'
| }
| ]
| },
| {
| courseName:'课程二',
| totalTime: 130,
| total: 2,
| userList: [
| {
| name: '张三',
| idCard: '320154198514571152',
| progress: 130,
| progressRate: 100,
| progressStatus:'success'
| },
| {
| name: '李四',
| idCard: '320241198514571152',
| progress: 117,
| progressRate: 90,
| progressStatus:'warning'
| }
| ]
| }
| ]
| }
| },
| created() {
| },
| methods: {
| getList() {
|
| },
| openDialog (type, data) {
| this.dialogVisible = true;
| this.dialogStatus = type;
| },
|
| handleClose() {
| this.dialogVisible = false;
| this.$emit("getList");
| },
| openClassHour(data){
| this.$refs.recordRef.openDialog(data);
| },
| viewLessonReport(data){
| this.$refs.lessonRef.openDialog(data)
| }
|
| }
| }
|
| </script>
| <style scoped>
|
| </style>
|
|
