Skip to content

C
confucius
Commit 55bfb3fc authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 3c8ddefd
Hide whitespace changes
Inline Side-by-side
Showing with 738 additions and 762 deletions
src/pages/stuMan/StudentProgress.vue
View file @ 55bfb3fc
<template> <template>
<div <div class="column"
class="column"
style="background-color: #e3e6ed; overflow: hidden; position: absolute; left: 0; right: 0; top: 0; bottom: 0;" style="background-color: #e3e6ed; overflow: hidden; position: absolute; left: 0; right: 0; top: 0; bottom: 0;"
@click="cancleCellHandle" @click="cancleCellHandle">
>
<study-header @change="getStudents" ref="studyHeaderRef"></study-header> <study-header @change="getStudents" ref="studyHeaderRef"></study-header>
<div class="sptable-box col" id="sptable"> <div class="sptable-box col" id="sptable">
<div class="sptable-wrap" v-loading="loading"> <div class="sptable-wrap" v-loading="loading">
...@@ -11,12 +9,7 @@ ...@@ -11,12 +9,7 @@
<thead> <thead>
<tr class="sticky-header"> <tr class="sticky-header">
<th class="sticky-column stubg">学员</th> <th class="sticky-column stubg">学员</th>
<th <th class="stubg cursor-pointer" v-for="(x, i) in students" :key="i" @click="showStuRight(x)">
class="stubg cursor-pointer"
v-for="(x, i) in students"
:key="i"
@click="showStuRight(x)"
>
{{ x.GuestName }} {{ x.GuestName }}
</th> </th>
</tr> </tr>
...@@ -26,36 +19,28 @@ ...@@ -26,36 +19,28 @@
<td class="sticky-column coursebg">课程</td> <td class="sticky-column coursebg">课程</td>
<td class="coursebg " v-for="(x, i) in students" :key="i"> <td class="coursebg " v-for="(x, i) in students" :key="i">
<template v-if="x.CourseRate<=6"> <template v-if="x.CourseRate<=6">
{{ x.NewCourseName }} <q-tooltip anchor="top middle" :offset="[10, 10]">
{{x.CourseName}}
</q-tooltip>
{{ x.NewCourseName }}
</template> </template>
<template v-else> <template v-else>
{{ x.CourseName }} {{ x.CourseName }}
</template> </template>
</td> </td>
</tr> </tr>
<tr> <tr>
<td class="sticky-column teacherbg">班主任</td> <td class="sticky-column teacherbg">班主任</td>
<td <td class="teacherbg cursor-pointer " v-for="(x, i) in students" @click="showDialogHandle(x, 1)" :key="i">
class="teacherbg cursor-pointer "
v-for="(x, i) in students"
@click="showDialogHandle(x, 1)"
:key="i"
>
{{ x.HeadMasterName }} {{ x.HeadMasterName }}
</td> </td>
</tr> </tr>
<tr> <tr>
<td class="sticky-column studybg">方式</td> <td class="sticky-column studybg">方式</td>
<td <td @click="showDialogHandle(x, 2)" class="cursor-pointer " :class="{
@click="showDialogHandle(x, 2)"
class="cursor-pointer "
:class="{
'study-online-bg': x.TeachingMethod == 2, 'study-online-bg': x.TeachingMethod == 2,
studybg: x.TeachingMethod != 2 studybg: x.TeachingMethod != 2
}" }" v-for="(x, i) in students" :key="i">
v-for="(x, i) in students"
:key="i"
>
{{ x.TeachingMethod == 2 ? "线上" : "面授" }} {{ x.TeachingMethod == 2 ? "线上" : "面授" }}
</td> </td>
</tr> </tr>
...@@ -63,27 +48,19 @@ ...@@ -63,27 +48,19 @@
<td class="sticky-column defaultBg"> <td class="sticky-column defaultBg">
进度<br />({{ currentCourse.ClassHours }}课时) 进度<br />({{ currentCourse.ClassHours }}课时)
</td> </td>
<td <td @click="showDialogHandle(x, 3)" v-for="(x, i) in students" :key="i" :class="{
@click="showDialogHandle(x, 3)"
v-for="(x, i) in students"
:key="i"
:class="{
stop: stop:
currentCourse.ClassHours - x.ClassProgress < 0 || currentCourse.ClassHours - x.ClassProgress < 0 ||
x.ScheduleStatus == 1 x.ScheduleStatus == 1
}" }" class="cursor-pointer ">
class="cursor-pointer " <div v-if="
>
<div
v-if="
(currentCourse.CourseRate == 10 || (currentCourse.CourseRate == 10 ||
currentCourse.CourseRate == 11 currentCourse.CourseRate == 11
? x.TotalTimes ? x.TotalTimes
: currentCourse.ClassHours) - : currentCourse.ClassHours) -
x.ClassProgress < x.ClassProgress <
0 || x.ScheduleStatus == 1 0 || x.ScheduleStatus == 1
" ">
>
<div>暂停排课</div> <div>暂停排课</div>
<div style="font-size: 12px;font-family: microsoft yahei;"> <div style="font-size: 12px;font-family: microsoft yahei;">
{{ {{
...@@ -100,29 +77,22 @@ ...@@ -100,29 +77,22 @@
: "正常排课" : "正常排课"
}} }}
</div> </div>
<span style="font-size: 12px;font-family: microsoft yahei;" <span style="font-size: 12px;font-family: microsoft yahei;">剩余{{
>剩余{{
(currentCourse.CourseRate == 10 || (currentCourse.CourseRate == 10 ||
currentCourse.CourseRate == 11 currentCourse.CourseRate == 11
? x.TotalTimes ? x.TotalHours
: currentCourse.ClassHours) - x.ClassProgress : currentCourse.ClassHours) - x.ClassProgress
}}课时</span }}课时</span>
>
</td> </td>
</tr> </tr>
<tr> <tr>
<td class="sticky-column studybg">备注</td> <td class="sticky-column studybg">备注</td>
<td <td v-for="(x, i) in students" :key="i"
v-for="(x, i) in students"
:key="i"
style="word-wrap: break-word;white-space: wrap; max-width: 150px; vertical-align: middle;" style="word-wrap: break-word;white-space: wrap; max-width: 150px; vertical-align: middle;"
@click="changeRemark(i)" @click="changeRemark(i)" @blur="setRemark(i)" :contenteditable="i == currentRemark"
@blur="setRemark(i)" :ref="`stu_remark_${x.GuestId}`">
:contenteditable="i == currentRemark" {{ x.XGRemark }}
:ref="`stu_remark_${x.GuestId}`" </td>
>
{{ x.XGRemark }}
</td>
</tr> </tr>
<tr> <tr>
<td :colspan="students.length + 1">&nbsp;</td> <td :colspan="students.length + 1">&nbsp;</td>
...@@ -132,12 +102,8 @@ ...@@ -132,12 +102,8 @@
<td class="sticky-column defaultBg" style="text-align: left;"> <td class="sticky-column defaultBg" style="text-align: left;">
{{ x.ChapterName }} {{ x.ChapterName }}
</td> </td>
<td <td v-for="(y, yi) in x.assemble" @click.stop="() => resetContextmenu(i, yi)"
v-for="(y, yi) in x.assemble" @contextmenu.prevent="e => contextMenuHandle(i, yi, e,y)" :key="yi" :class="{
@click.stop="() => resetContextmenu(i, yi)"
@contextmenu.prevent="e => contextMenuHandle(i, yi, e,y)"
:key="yi"
:class="{
'disable-class': y && y.overlayer, 'disable-class': y && y.overlayer,
'focus-box': coor[0] == i && coor[1] == yi, 'focus-box': coor[0] == i && coor[1] == yi,
'unchecked':y &&y.State==1, 'unchecked':y &&y.State==1,
...@@ -146,8 +112,7 @@ ...@@ -146,8 +112,7 @@
'onlineStudy':y &&y.State==3 && y.AttendanceMethod==2, 'onlineStudy':y &&y.State==3 && y.AttendanceMethod==2,
'notChecked':y &&y.State==3 && y.AttendanceMethod==3, 'notChecked':y &&y.State==3 && y.AttendanceMethod==3,
'study-normal':y &&y.State==3 && y.AttendanceMethod==1 'study-normal':y &&y.State==3 && y.AttendanceMethod==1
}" }">
>
<template v-if="y&&(y.State<3||y.State==6)"> <template v-if="y&&(y.State<3||y.State==6)">
{{ y.StateName }} {{ y.StateName }}
</template> </template>
...@@ -155,7 +120,7 @@ ...@@ -155,7 +120,7 @@
{{ y.AttendanceMethodName }} {{ y.AttendanceMethodName }}
</template> </template>
<q-tooltip :offset="[0, 0]" v-if="y && !y.overlayer" :ref="`plantime_${i}_${yi}`"> <q-tooltip :offset="[0, 0]" v-if="y && !y.overlayer" :ref="`plantime_${i}_${yi}`">
<div style="width:200px"> <div style="width:200px">
<div class="row items-center q-mb-sm"> <div class="row items-center q-mb-sm">
<div class="col-3 q-mr-sm">上课日期:</div> <div class="col-3 q-mr-sm">上课日期:</div>
<div class="col">{{ y.Date }} {{ y.StartTime }} - {{ y.EndTime }}</div> <div class="col">{{ y.Date }} {{ y.StartTime }} - {{ y.EndTime }}</div>
...@@ -178,43 +143,21 @@ ...@@ -178,43 +143,21 @@
</tr> </tr>
</tbody> </tbody>
</table> </table>
<q-card <q-card class="rounded-borders" v-if="locationMenu[0] > 0 && locationMenu[0] > 0"
class="rounded-borders"
v-if="locationMenu[0] > 0 && locationMenu[0] > 0"
style="width: 200px; position: absolute; z-index: 9;margin-left: -100px;" style="width: 200px; position: absolute; z-index: 9;margin-left: -100px;"
:style="{ left: locationMenu[0] + 'px', top: locationMenu[1] + 'px' }" :style="{ left: locationMenu[0] + 'px', top: locationMenu[1] + 'px' }">
>
<q-list bordered> <q-list bordered>
<q-item <q-item v-close-popup clickable @click="showDialogHandle(students[coor[1]], 4)" v-if="currentMenuState==0">
v-close-popup
clickable
@click="showDialogHandle(students[coor[1]], 4)"
v-if="currentMenuState==0"
>
<q-item-section>立即排课</q-item-section> <q-item-section>立即排课</q-item-section>
</q-item> </q-item>
<q-item <q-item v-close-popup clickable @click="confirmSub" v-if="currentMenuState==1">
v-close-popup
clickable
@click="confirmSub"
v-if="currentMenuState==1"
>
<q-item-section>确认排课</q-item-section> <q-item-section>确认排课</q-item-section>
</q-item> </q-item>
<q-item <q-item v-close-popup clickable v-if="currentMenuState==1||currentMenuState==2"
v-close-popup @click="showDialogHandle(students[coor[1]], 4)">
clickable
v-if="currentMenuState==1||currentMenuState==2"
@click="showDialogHandle(students[coor[1]], 4)"
>
<q-item-section>修改排课</q-item-section> <q-item-section>修改排课</q-item-section>
</q-item> </q-item>
<q-item <q-item v-close-popup clickable v-if="currentMenuState==1||currentMenuState==2" @click="getPlan">
v-close-popup
clickable
v-if="currentMenuState==1||currentMenuState==2"
@click="getPlan"
>
<q-item-section class="text-negative">取消排课</q-item-section> <q-item-section class="text-negative">取消排课</q-item-section>
</q-item> </q-item>
<!-- <q-item <!-- <q-item
...@@ -230,83 +173,49 @@ ...@@ -230,83 +173,49 @@
</div> </div>
<div class="cusor-tools row"> <div class="cusor-tools row">
<div class="col row"> <div class="col row">
<div <div class="item" @click="changeCourseHandle(x)" :class="{ active: x.CourseId == currentCourse.CourseId }"
class="item" v-for="(x, i) in list" :key="i">
@click="changeCourseHandle(x)"
:class="{ active: x.CourseId == currentCourse.CourseId }"
v-for="(x, i) in list"
:key="i"
>
{{ x.CourseName }} {{ x.CourseName }}
</div> </div>
</div> </div>
<scroll-bar <scroll-bar targetBox="sptable" targetWrap="sptableWrap" @scrollChange="scrollHandle" ref="scrollBar">
targetBox="sptable" </scroll-bar>
targetWrap="sptableWrap"
@scrollChange="scrollHandle"
ref="scrollBar"
></scroll-bar>
<div class="q-ml-md row items-center"> <div class="q-ml-md row items-center">
<span>{{ Math.ceil(zoom * 100) }}%</span> <span>{{ Math.ceil(zoom * 100) }}%</span>
<q-btn <q-btn @click="resetZoom" color="primary" v-show="zoom != 1"
@click="resetZoom"
color="primary"
v-show="zoom != 1"
style="padding: 0; font-size: 11px !important;font-family: microsoft yahei !important; font-weight: 400;" style="padding: 0; font-size: 11px !important;font-family: microsoft yahei !important; font-weight: 400;"
flat flat label="重置" />
label="重置"
/>
</div> </div>
</div> </div>
<q-dialog v-if="showDialog != 0" v-model="dialogVisible" persistent> <q-dialog v-if="showDialog != 0" v-model="dialogVisible" persistent>
<set-student-teacher <set-student-teacher :stuInfo="currentStu" @close="() => (showDialog = 0)" v-if="showDialog == 1"
:stuInfo="currentStu" @success="setTeacherHandle"></set-student-teacher>
@close="() => (showDialog = 0)" <set-study-method :stuInfo="currentStu" @close="() => (showDialog = 0)" v-if="showDialog == 2"
v-if="showDialog == 1" @success="setStudyHandle"></set-study-method>
@success="setTeacherHandle" <set-study-status :stuInfo="currentStu" @close="() => (showDialog = 0)" v-if="showDialog == 3"
></set-student-teacher> @success="settGuestScheduleHandle"></set-study-status>
<set-study-method <set-study-plan :stuInfo="currentStu" :sourceList="sourceStudents" :chapters="chapters" :rate="currentCourse"
:stuInfo="currentStu" :coor="coor" @close="() => (showDialog = 0)" v-if="showDialog == 4" @success="setStudyPlayHandle"
@close="() => (showDialog = 0)" :planTime="currentSchedu"></set-study-plan>
v-if="showDialog == 2"
@success="setStudyHandle"
></set-study-method>
<set-study-status
:stuInfo="currentStu"
@close="() => (showDialog = 0)"
v-if="showDialog == 3"
@success="settGuestScheduleHandle"
></set-study-status>
<set-study-plan
:stuInfo="currentStu"
:sourceList="sourceStudents"
:chapters="chapters"
:rate="currentCourse"
:coor="coor"
@close="() => (showDialog = 0)"
v-if="showDialog == 4"
@success="setStudyPlayHandle"
:planTime="currentSchedu"
></set-study-plan>
</q-dialog> </q-dialog>
</div> </div>
<studentRight-form <studentRight-form v-if="stuInfoVisible" :save-obj="stuOption" @close="() => (stuInfoVisible = false)">
v-if="stuInfoVisible" </studentRight-form>
:save-obj="stuOption"
@close="() => (stuInfoVisible = false)"
></studentRight-form>
<q-dialog v-model="cancelConfirm" persistent> <q-dialog v-model="cancelConfirm" persistent>
<q-card> <q-card>
<q-card-section class="row items-center"> <q-card-section class="row items-center">
<div>你正在执行取消已确认学员的上课计划，请确认以下操作</div> <div>你正在执行取消已确认学员的上课计划，请确认以下操作</div>
<div class="q-mt-sm"> <div class="q-mt-sm">
<q-radio v-model="adminCancelChosenOpera" checked-icon="task_alt" unchecked-icon="panorama_fish_eye" val="yes" label="扣除学员课时按缺勤处理" /> <q-radio v-model="adminCancelChosenOpera" checked-icon="task_alt" unchecked-icon="panorama_fish_eye"
<q-radio v-model="adminCancelChosenOpera" checked-icon="task_alt" unchecked-icon="panorama_fish_eye" val="no" label="无损取消" /> val="yes" label="扣除学员课时按缺勤处理" />
<q-radio v-model="adminCancelChosenOpera" checked-icon="task_alt" unchecked-icon="panorama_fish_eye"
val="no" label="无损取消" />
</div> </div>
</q-card-section> </q-card-section>
<q-card-actions align="right"> <q-card-actions align="right">
<q-btn flat label="不执行此次操作" color="primary" v-close-popup /> <q-btn flat label="不执行此次操作" color="primary" v-close-popup />
<q-btn unelevated label="确认选择" @click="checkRemoveChosenHandle" :disable="adminCancelChosenOpera==''" color="primary" v-close-popup /> <q-btn unelevated label="确认选择" @click="checkRemoveChosenHandle" :disable="adminCancelChosenOpera==''"
color="primary" v-close-popup />
</q-card-actions> </q-card-actions>
</q-card> </q-card>
</q-dialog> </q-dialog>
...@@ -314,643 +223,710 @@ ...@@ -314,643 +223,710 @@
</template> </template>
<script> <script>
import scrollBar from "src/components/common/scrollBar.vue"; import scrollBar from "src/components/common/scrollBar.vue";
import { import {
queryCoursePage, queryCoursePage,
queryChapterTree, queryChapterTree,
queryScheduleCourseStu queryScheduleCourseStu
} from "../../api/course/index"; } from "../../api/course/index";
import { SetSureAppointment } from "../../api/studyabroad/subscribe.js"; import {
import { getStudentInfo } from "src/api/school/index"; SetSureAppointment
import { setGuestRemark } from "src/api/studentmsg/index"; } from "../../api/studyabroad/subscribe.js";
import setStudentTeacher from "./components/setStudentTeacher.vue"; import {
import SetStudyMethod from "./components/setStudyMethod.vue"; getStudentInfo
import SetStudyStatus from "./components/setStudyStatus.vue"; } from "src/api/school/index";
import StudyHeader from "./components/studyHeader.vue"; import {
import studentRightForm from "src/components/school/student/studentRight-form.vue"; setGuestRemark
import SetStudyPlan from "./components/setStudyPlan.vue"; } from "src/api/studentmsg/index";
import {getStuAppointPlan,cancelStuAppointment} from 'src/api/scheduling/schedu' import setStudentTeacher from "./components/setStudentTeacher.vue";
export default { import SetStudyMethod from "./components/setStudyMethod.vue";
components: { import SetStudyStatus from "./components/setStudyStatus.vue";
scrollBar, import StudyHeader from "./components/studyHeader.vue";
setStudentTeacher, import studentRightForm from "src/components/school/student/studentRight-form.vue";
SetStudyMethod, import SetStudyPlan from "./components/setStudyPlan.vue";
SetStudyStatus, import {
StudyHeader, getStuAppointPlan,
studentRightForm, cancelStuAppointment
SetStudyPlan } from 'src/api/scheduling/schedu'
}, export default {
meta: { components: {
title: "学员学习进度表" scrollBar,
}, setStudentTeacher,
data() { SetStudyMethod,
return { SetStudyStatus,
list: [], StudyHeader,
loading: true, studentRightForm,
msg: { SetStudyPlan
pageIndex: 1,
pageSize: 120,
rowsPerPage: 120,
CourseName: "",
QCateIds: "",
IsQPrice: 1,
Status: "0",
Saleplat: 0,
CourseSubject: 1,
SaleState: 1
},
showDialog: 0,
dialogVisible: false,
currentCourse: {},
currentStu: {},
chapters: [],
currentRemark: 0,
students: [],
sourceStudents: [],
assemble: [],
zoom: 1,
stuInfoVisible: false,
stuOption: {},
queryParemeter: {
HeadMasterId: 0,
GuestState: -1,
ScheduleStatus: -1,
TeachingMethod: -1,
GuestName: ""
},
coor: [-1, -1],
locationMenu: [0, 0],
currentMenuState:0,
currentSchedu:null,
cancelConfirm:false,
adminCancelChosenOpera:'',
updatePlan:{}
};
},
methods: {
scrollHandle(e) {
const box = document.querySelector("#sptable");
box.scrollLeft = e;
},
getCourse() {
this.loading = true;
queryCoursePage(this.msg)
.then(res => {
this.loading = false;
this.list = res.Data.PageData.reverse();
this.currentCourse = this.list[0];
this.getChapters();
})
.catch(() => {
this.loading = false;
});
},
getChapters() {
if (!this.currentCourse || !this.currentCourse.CourseId) return;
this.loading = true;
queryChapterTree({ CourseId: this.currentCourse.CourseId })
.then(res => {
this.loading = false;
this.chapters = res.Data;
this.getStudents();
})
.catch(() => {
this.loading = false;
});
},
changeCourseHandle(item) {
this.currentCourse = item;
this.getChapters();
},
changeRemark(i) {
this.currentRemark = i;
},
setStudyPlayHandle(){
this.showDialog = 0;
this.getStudentByStoreage()
},
getStudents(playload = null) {
if (!this.currentCourse || !this.currentCourse.CourseId) return;
this.loading = true;
if (playload)
this.queryParemeter = { ...this.queryParemeter, ...playload };
if (this.currentCourse.CourseRate != this.queryParemeter.CourseRate) {
this.queryParemeter.CourseRate = this.currentCourse.CourseRate;
this.getStudentByStoreage();
} else {
this.getStudentByCache();
}
}, },
getStudentByCache() { meta: {
let tempArray = []; title: "学员学习进度表"
const q = this.queryParemeter;
this.sourceStudents.forEach(x => {
if (q.HeadMasterId != 0 && x.HeadMasterId != q.HeadMasterId) return;
if (q.GuestState != -1 && x.GuestState != q.GuestState) return;
if (q.ScheduleStatus != -1 && x.ScheduleStatus != q.ScheduleStatus)
return;
if (q.TeachingMethod != -1 && x.TeachingMethod != q.TeachingMethod)
return;
if (
q.GuestName &&
q.GuestName != "" &&
!x.GuestName.includes(q.GuestName)
)
return;
tempArray.push(x);
});
this.students = tempArray;
this.setFillChapters();
this.assembleHandler();
this.loading = false;
}, },
getStudentByStoreage() { data() {
this.sourceStudents = []; return {
this.students = []; list: [],
const parameters = { loading: true,
HeadMasterId: 0, msg: {
GuestState: -1, pageIndex: 1,
ScheduleStatus: -1, pageSize: 120,
TeachingMethod: -1, rowsPerPage: 120,
GuestName: "", CourseName: "",
CourseRate: this.queryParemeter.CourseRate QCateIds: "",
IsQPrice: 1,
Status: "0",
Saleplat: 0,
CourseSubject: 1,
SaleState: 1
},
showDialog: 0,
dialogVisible: false,
currentCourse: {},
currentStu: {},
chapters: [],
currentRemark: 0,
students: [],
sourceStudents: [],
assemble: [],
zoom: 1,
stuInfoVisible: false,
stuOption: {},
queryParemeter: {
HeadMasterId: 0,
GuestState: -1,
ScheduleStatus: -1,
TeachingMethod: -1,
GuestName: ""
},
coor: [-1, -1],
locationMenu: [0, 0],
currentMenuState: 0,
currentSchedu: null,
cancelConfirm: false,
adminCancelChosenOpera: '',
updatePlan: {}
}; };
queryScheduleCourseStu(parameters)
.then(r => {
this.sourceStudents = r.Data;
this.getStudentByCache();
})
.catch(() => {
this.loading = false;
});
}, },
setFillChapters() { methods: {
if ( scrollHandle(e) {
this.currentCourse.CourseRate == 10 || const box = document.querySelector("#sptable");
this.currentCourse.CourseRate == 11 box.scrollLeft = e;
) { },
//TotalTimes getCourse() {
let maxTemp = 0; this.loading = true;
this.students.forEach(stu => { queryCoursePage(this.msg)
if (stu.TotalTimes && stu.TotalTimes > maxTemp) .then(res => {
maxTemp = stu.TotalTimes; this.loading = false;
this.list = res.Data.PageData.reverse();
this.currentCourse = this.list[0];
this.getChapters();
})
.catch(() => {
this.loading = false;
});
},
getChapters() {
if (!this.currentCourse || !this.currentCourse.CourseId) return;
this.loading = true;
queryChapterTree({
CourseId: this.currentCourse.CourseId
})
.then(res => {
this.loading = false;
this.chapters = res.Data;
this.getStudents();
})
.catch(() => {
this.loading = false;
});
},
changeCourseHandle(item) {
this.currentCourse = item;
this.getChapters();
},
changeRemark(i) {
this.currentRemark = i;
},
setStudyPlayHandle() {
this.showDialog = 0;
this.getStudentByStoreage()
},
getStudents(playload = null) {
if (!this.currentCourse || !this.currentCourse.CourseId) return;
this.loading = true;
if (playload)
this.queryParemeter = {
...this.queryParemeter,
...playload
};
if (this.currentCourse.CourseRate != this.queryParemeter.CourseRate) {
this.queryParemeter.CourseRate = this.currentCourse.CourseRate;
this.getStudentByStoreage();
} else {
this.getStudentByCache();
}
},
getStudentByCache() {
let tempArray = [];
const q = this.queryParemeter;
this.sourceStudents.forEach(x => {
if (q.HeadMasterId != 0 && x.HeadMasterId != q.HeadMasterId) return;
if (q.GuestState != -1 && x.GuestState != q.GuestState) return;
if (q.ScheduleStatus != -1 && x.ScheduleStatus != q.ScheduleStatus)
return;
if (q.TeachingMethod != -1 && x.TeachingMethod != q.TeachingMethod)
return;
if (
q.GuestName &&
q.GuestName != "" &&
!x.GuestName.includes(q.GuestName)
)
return;
tempArray.push(x);
}); });
if (maxTemp > 0) { this.students = tempArray;
for (let i = 0; i < maxTemp; i++) { this.setFillChapters();
this.chapters.push({ this.assembleHandler();
ChapterId: i + 1, this.loading = false;
ChapterName: `第${i + 1}次`, },
ChapterGradeNo: i+1 getStudentByStoreage() {
}); this.sourceStudents = [];
this.students = [];
const parameters = {
HeadMasterId: 0,
GuestState: -1,
ScheduleStatus: -1,
TeachingMethod: -1,
GuestName: "",
CourseRate: this.queryParemeter.CourseRate
};
queryScheduleCourseStu(parameters)
.then(r => {
this.sourceStudents = r.Data;
this.getStudentByCache();
})
.catch(() => {
this.loading = false;
});
},
setFillChapters() {
if (
this.currentCourse.CourseRate == 10 ||
this.currentCourse.CourseRate == 11
) {
//TotalTimes
let maxTemp = 0;
this.students.forEach(stu => {
if (stu.TotalTimes && stu.TotalTimes > maxTemp)
maxTemp = stu.TotalTimes;
});
if (maxTemp > 0) {
for (let i = 0; i < maxTemp; i++) {
this.chapters.push({
ChapterId: i + 1,
ChapterName: `第${i + 1}次`,
ChapterGradeNo: i + 1
});
}
this.currentCourse.ClassHours = maxTemp;
} }
this.currentCourse.ClassHours = maxTemp;
} }
} },
}, assembleHandler() {
assembleHandler() { this.assemble = [];
this.assemble = []; this.chapters.forEach((x, i) => {
this.chapters.forEach((x, i) => { x.assemble = [];
x.assemble = []; this.students.forEach(stu => {
this.students.forEach(stu => { const r = stu.CourseItems.find(
const r = stu.CourseItems.find( item => item.ChapterId == x.ChapterGradeNo
item => item.ChapterId == x.ChapterGradeNo );
); if (
if ( !r &&
!r && (this.currentCourse.CourseRate == 10 ||
(this.currentCourse.CourseRate == 10 || this.currentCourse.CourseRate == 11) &&
this.currentCourse.CourseRate == 11) && stu.TotalTimes < i + 1
stu.TotalTimes < i + 1 ) {
) { x.assemble.push({
x.assemble.push({ overlayer: true }); overlayer: true
});
} else {
x.assemble.push(r);
}
});
});
this.$nextTick(() => {
this.$refs.scrollBar.calcHandle();
});
},
handleWheel(event) {
if (event.ctrlKey === true || event.metaKey === true) {
if (event.deltaY > 0) {
this.zoomOut();
} else { } else {
x.assemble.push(r); this.zoomIn();
} }
}); this.$refs.scrollBar.calcHandle();
}); event.preventDefault();
this.$nextTick(() => { return false;
this.$refs.scrollBar.calcHandle();
});
},
handleWheel(event) {
if (event.ctrlKey === true || event.metaKey === true) {
if (event.deltaY > 0) {
this.zoomOut();
} else {
this.zoomIn();
} }
},
zoomIn() {
// 放大逻辑
if (this.zoom < 4) this.zoom += 0.05;
},
zoomOut() {
// 缩小逻辑
if (this.zoom > 0.1) this.zoom -= 0.05;
},
resetZoom() {
this.zoom = 1;
this.$refs.scrollBar.calcHandle(); this.$refs.scrollBar.calcHandle();
event.preventDefault(); },
return false; showDialogHandle(stu, type) {
} this.currentStu = stu;
}, this.showDialog = type;
zoomIn() { this.dialogVisible = true;
// 放大逻辑 },
if (this.zoom < 4) this.zoom += 0.05; setTeacherHandle(playload) {
}, this.showDialog = 0;
zoomOut() { const i = this.students.findIndex(
// 缩小逻辑 x => x.GuestId == this.currentStu.GuestId
if (this.zoom > 0.1) this.zoom -= 0.05; );
}, if (i < 0) return;
resetZoom() { this.students[i].HeadMasterName = playload.HeadMasterName;
this.zoom = 1; this.students[i].HeadMasterId = playload.HeadMasterId;
this.$refs.scrollBar.calcHandle(); },
}, setStudyHandle(playload) {
showDialogHandle(stu, type) { this.showDialog = 0;
this.currentStu = stu; const i = this.students.findIndex(
this.showDialog = type; x => x.GuestId == this.currentStu.GuestId
this.dialogVisible = true; );
}, if (i < 0) return;
setTeacherHandle(playload) { this.students[i].TeachingMethod = playload;
this.showDialog = 0; },
const i = this.students.findIndex( settGuestScheduleHandle(playload) {
x => x.GuestId == this.currentStu.GuestId this.showDialog = 0;
); const i = this.students.findIndex(
if (i < 0) return; x => x.GuestId == this.currentStu.GuestId
this.students[i].HeadMasterName = playload.HeadMasterName; );
this.students[i].HeadMasterId = playload.HeadMasterId; const j = this.sourceStudents.findIndex(
}, x => x.GuestId == this.currentStu.GuestId
setStudyHandle(playload) { );
this.showDialog = 0; if (i < 0) return;
const i = this.students.findIndex( this.students[i] = {
x => x.GuestId == this.currentStu.GuestId ...this.students[i],
); ...playload
if (i < 0) return; };
this.students[i].TeachingMethod = playload; this.sourceStudents[j] = {
}, ...this.sourceStudents[j],
settGuestScheduleHandle(playload) { ...playload
this.showDialog = 0; };
const i = this.students.findIndex( },
x => x.GuestId == this.currentStu.GuestId resetContextmenu(i, yi) {
); this.locationMenu = [-1, -1];
const j = this.sourceStudents.findIndex( this.coor = [i, yi];
x => x.GuestId == this.currentStu.GuestId },
); setRemark(i) {
if (i < 0) return; const user = this.students[i];
this.students[i] = { ...this.students[i], ...playload }; const dom = this.$refs[`stu_remark_${user.GuestId}`];
this.sourceStudents[j] = { ...this.sourceStudents[j], ...playload }; if (dom && dom.length > 0) {
}, setGuestRemark({
resetContextmenu(i, yi) { XGRemark: dom[0].innerText,
this.locationMenu = [-1, -1]; GuestId: user.GuestId
this.coor = [i, yi]; }).then(r => {
}, if (r.Code != 1) {
setRemark(i) { this.$q.notify({
const user = this.students[i]; color: "negative",
const dom = this.$refs[`stu_remark_${user.GuestId}`]; message: "操作失败",
if (dom && dom.length > 0) { position: "top"
setGuestRemark({ });
XGRemark: dom[0].innerText, }
GuestId: user.GuestId });
}).then(r => { }
if (r.Code != 1) { },
showStuRight(obj) {
if (obj) {
this.$q.loading.show();
console.log(obj.StuId);
getStudentInfo({
StuId: obj.StuId
})
.then(r => {
this.stuOption = r.Data;
this.stuOption.noEdit = true;
this.stuInfoVisible = true;
this.$q.loading.hide();
})
.catch(e => {
this.$q.loading.hide();
});
}
},
confirmSub() {
this.$q.loading.show()
const msg = {
Date: this.currentSchedu.Date,
TeacherId: this.currentSchedu.TeacherId,
ShiftSort: this.currentSchedu.ShiftSort
};
SetSureAppointment(msg).then(res => {
this.$q.loading.hide()
if (res.Code == 1) {
this.$q.notify({ this.$q.notify({
color: "negative", message: "操作成功",
message: "操作失败", position: "top",
position: "top" type: "positive"
}); });
this.getStudentByStoreage()
} }
}); });
} },
}, contextMenuHandle(i, yi, e, y) {
showStuRight(obj) { this.currentMenuState = y ? y.State : 0
if (obj) { this.currentSchedu = y
this.$q.loading.show(); const tips = this.$refs[`plantime_${i}_${yi}`]
console.log(obj.StuId); if (tips && tips.length > 0) {
getStudentInfo({ StuId: obj.StuId }) tips[0].hide()
.then(r => {
this.stuOption = r.Data;
this.stuOption.noEdit = true;
this.stuInfoVisible = true;
this.$q.loading.hide();
})
.catch(e => {
this.$q.loading.hide();
});
}
},
confirmSub() {
this.$q.loading.show()
const msg = {
Date: this.currentSchedu.Date,
TeacherId: this.currentSchedu.TeacherId,
ShiftSort: this.currentSchedu.ShiftSort
};
SetSureAppointment(msg).then(res => {
this.$q.loading.hide()
if (res.Code == 1) {
this.$q.notify({
message: "操作成功",
position: "top",
type: "positive"
});
this.getStudentByStoreage()
} }
this.coor = [i, yi];
}); const t = e.target;
}, let top = t.offsetTop + t.offsetHeight;
contextMenuHandle(i, yi, e,y) { top =
this.currentMenuState = y?y.State:0 document.querySelector(".sptable-wrap").offsetHeight < top + 48 ?
this.currentSchedu = y t.offsetTop - 48 :
const tips = this.$refs[`plantime_${i}_${yi}`] top;
if(tips && tips.length>0){ //sptable-wrap
tips[0].hide() this.locationMenu = [(t.offsetLeft + t.offsetWidth / 2) * this.zoom, top * this.zoom];
} },
this.coor = [i, yi]; cancleCellHandle() {
const t = e.target; this.coor = [-1, -1];
let top = t.offsetTop + t.offsetHeight; this.locationMenu = [-1, -1];
top = },
document.querySelector(".sptable-wrap").offsetHeight < top + 48 getPlan() {
? t.offsetTop - 48 const y = this.currentSchedu
: top; this.$q.loading.show()
//sptable-wrap getStuAppointPlan({
this.locationMenu = [(t.offsetLeft + t.offsetWidth / 2)*this.zoom, top*this.zoom]; AccountId: y.AccountId,
}, Date: y.Date,
cancleCellHandle() { ShiftSort: y.ShiftSort
this.coor = [-1, -1]; }).then(r => {
this.locationMenu = [-1, -1]; if (r.Code == 1) {
}, const d = r.Data
getPlan(){ this.updatePlan = d
const y = this.currentSchedu this.canclePlanClassHandler()
this.$q.loading.show() } else {
getStuAppointPlan({AccountId:y.AccountId,Date:y.Date,ShiftSort:y.ShiftSort}).then(r=>{ this.$q.loading.hide()
if(r.Code==1){ }
const d = r.Data })
this.updatePlan = d },
this.canclePlanClassHandler() canclePlanClassHandler() {
}else{ if (this.currentSchedu.State == 2) {
this.$q.loading.hide() this.adminCancelChosenOpera = ''
this.cancelConfirm = true
} else if (this.currentSchedu.State == 1) {
this.adminCancelChosenOpera = 'no'
this.cancelConfirm = false
this.removePlanHandle()
} }
}) this.$q.loading.hide()
}, },
canclePlanClassHandler(){ checkRemoveChosenHandle() {
if(this.currentSchedu.State==2){ if (this.adminCancelChosenOpera == '') {
this.adminCancelChosenOpera = '' this.errorMsgHandle('请选择执行的内容')
this.cancelConfirm=true return
}else if(this.currentSchedu.State==1){ }
this.adminCancelChosenOpera = 'no' this.cancelConfirm = false
this.cancelConfirm=false
this.removePlanHandle() this.removePlanHandle()
} },
this.$q.loading.hide() errorMsgHandle(msg) {
this.$q.notify({
color: "negative",
message: msg,
position: "top"
});
},
removePlanHandle() {
this.$q.loading.show()
var chosenList = []
this.updatePlan.ChooseStuList.forEach(x => {
chosenList.push({
AppointId: x.AppointmentId,
IsCalcStuCheck: this.adminCancelChosenOpera == 'yes' ? 1 : 0
})
})
cancelStuAppointment({
AccountId: this.currentSchedu.AccountId,
Date: this.updatePlan.Date,
ShiftSort: this.updatePlan.ShiftSort,
ChooseStuList: chosenList
}).then(r => {
this.$q.loading.hide()
if (r.Code == 1) {
this.getStudentByStoreage();
this.$q.notify({
icon: "iconfont icon-chenggong",
color: "accent",
timeout: 2000,
message: "取消成功！",
position: "top"
});
return
}
})
},
}, },
checkRemoveChosenHandle(){ created() {
if(this.adminCancelChosenOpera==''){ this.getCourse();
this.errorMsgHandle('请选择执行的内容')
return
}
this.cancelConfirm = false
this.removePlanHandle()
}, },
errorMsgHandle(msg){ mounted() {
this.$q.notify({ document.addEventListener("wheel", this.handleWheel, {
color: "negative", passive: false
message: msg,
position: "top"
}); });
}, },
removePlanHandle(){ beforeDestroy() {
this.$q.loading.show() document.removeEventListener("wheel", this.handleWheel, {
var chosenList = [] passive: false
this.updatePlan.ChooseStuList.forEach(x=>{ });
chosenList.push({ }
AppointId:x.AppointmentId, };
IsCalcStuCheck: this.adminCancelChosenOpera=='yes'?1:0
})
})
cancelStuAppointment({
AccountId:this.currentSchedu.AccountId,
Date:this.updatePlan.Date,
ShiftSort:this.updatePlan.ShiftSort,
ChooseStuList:chosenList
}).then(r=>{
this.$q.loading.hide()
if(r.Code==1){
this.getStudentByStoreage();
this.$q.notify({
icon: "iconfont icon-chenggong",
color: "accent",
timeout: 2000,
message: "取消成功！",
position: "top"
});
return
}
})
},
},
created() {
this.getCourse();
},
mounted() {
document.addEventListener("wheel", this.handleWheel, { passive: false });
},
beforeDestroy() {
document.removeEventListener("wheel", this.handleWheel, { passive: false });
}
};
</script> </script>
<style> <style>
.sptable-box { .sptable-box {
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow-y: auto; overflow-y: auto;
padding-bottom: 20px; padding-bottom: 20px;
/* user-select: none; */ /* user-select: none; */
background: #fff; background: #fff;
} }
.sptable-box .sptable-wrap {
position: relative; .sptable-box .sptable-wrap {
} position: relative;
}
.sptable-box::-webkit-scrollbar {
width: 6px; .sptable-box::-webkit-scrollbar {
height: 6px; width: 6px;
} height: 6px;
.sptable-box::-webkit-scrollbar-thumb { }
background-color: #888;
border-radius: 6px; .sptable-box::-webkit-scrollbar-thumb {
} background-color: #888;
border-radius: 6px;
.sptable-box::-webkit-scrollbar-thumb:hover { }
background-color: #555;
} .sptable-box::-webkit-scrollbar-thumb:hover {
.sptable-box::-webkit-scrollbar-track { background-color: #555;
background-color: #f1f1f1; }
}
.sptable { .sptable-box::-webkit-scrollbar-track {
border-collapse: collapse; background-color: #f1f1f1;
border: 1px solid #2a363b; }
border-top: none;
min-width: 100%; .sptable {
} border-collapse: collapse;
.sptable td, border: 1px solid #2a363b;
.sptable th { border-top: none;
border-right: 1px solid #2a363b; min-width: 100%;
border-bottom: 1px solid #2a363b; }
padding: 6px 15px;
/* min-width: 200px; */ .sptable td,
white-space: nowrap; .sptable th {
text-align: center; border-right: 1px solid #2a363b;
color: #000; border-bottom: 1px solid #2a363b;
outline: none; padding: 6px 15px;
position: relative; /* min-width: 200px; */
} white-space: nowrap;
.sptable td.focus-box::before, text-align: center;
.sptable td:focus::before { color: #000;
position: absolute; outline: none;
content: " "; position: relative;
display: block; }
top: -1px;
left: -1px; .sptable td.focus-box::before,
right: -1px; .sptable td:focus::before {
bottom: -1px; position: absolute;
z-index: 15; content: " ";
border: 3px solid #418f1f; display: block;
pointer-events: none; top: -1px;
} left: -1px;
.sptable tr td:last-child { right: -1px;
border-right: none; bottom: -1px;
} z-index: 15;
.sptable tr:last-child td:last-child { border: 3px solid #418f1f;
border: none; pointer-events: none;
} }
.sptable .sticky-header th {
position: sticky; .sptable tr td:last-child {
top: 0px; border-right: none;
background: #fff; }
z-index: 2;
border-bottom: none; .sptable tr:last-child td:last-child {
} border: none;
.sptable .sticky-column { }
position: sticky;
left: 0px; .sptable .sticky-header th {
background: #fff; position: sticky;
box-shadow: inset -4px -2px 0px -3px #1fbb7d; top: 0px;
border-right: 0; background: #fff;
z-index: 1; z-index: 2;
} border-bottom: none;
.sptable .sticky-header th::before, }
.sptable .sticky-header th::after,
.sptable-box::before, .sptable .sticky-column {
.sptable .sticky-column::before { position: sticky;
position: absolute; left: 0px;
content: ""; background: #fff;
display: block; box-shadow: inset -4px -2px 0px -3px #1fbb7d;
width: 1px; border-right: 0;
background: #2a363b; z-index: 1;
top: 0; }
left: -1px;
bottom: 0; .sptable .sticky-header th::before,
z-index: 15; .sptable .sticky-header th::after,
height: 100%; .sptable-box::before,
} .sptable .sticky-column::before {
.sptable-box::before { position: absolute;
left: 0; content: "";
top: 55px; display: block;
} width: 1px;
.sptable .sticky-header th::before { background: #2a363b;
top: 0; top: 0;
left: 0; left: -1px;
width: 100%; bottom: 0;
height: 1px; z-index: 15;
} height: 100%;
.sptable .sticky-header th::after { }
top: unset;
bottom: 0; .sptable-box::before {
left: 0; left: 0;
width: 100%; top: 55px;
height: 1px; }
background: #1fbb7d;
} .sptable .sticky-header th::before {
.sptable .sticky-header .sticky-column { top: 0;
z-index: 3; left: 0;
border-right: 0; width: 100%;
} height: 1px;
.sptable-box .cusor-tools { }
position: absolute;
left: 0; .sptable .sticky-header th::after {
right: 0; top: unset;
bottom: 0; bottom: 0;
height: 27px; left: 0;
background: #e3e6ed; width: 100%;
border-top: 1px solid #c9ccd2; height: 1px;
border-bottom: 1px solid #c9ccd2; background: #1fbb7d;
border-left: 1px solid #2a363b; }
border-right: 1px solid #2a363b;
z-index: 9; .sptable .sticky-header .sticky-column {
padding: 0 30px; z-index: 3;
} border-right: 0;
.sptable-box .cusor-tools .item { }
height: 22px;
line-height: 22px; .sptable-box .cusor-tools {
border: 1px solid transparent; position: absolute;
border-radius: 5px; left: 0;
border-top-left-radius: 0; right: 0;
border-top-right-radius: 0; bottom: 0;
font-size: 12px; height: 27px;
color: #000; background: #e3e6ed;
padding: 0 15px; border-top: 1px solid #c9ccd2;
cursor: pointer; border-bottom: 1px solid #c9ccd2;
position: relative; border-left: 1px solid #2a363b;
} border-right: 1px solid #2a363b;
.sptable-box .cusor-tools .item:hover { z-index: 9;
background: #cfcfcf; padding: 0 30px;
} }
.sptable-box .cusor-tools .item.active {
background: #fff !important; .sptable-box .cusor-tools .item {
cursor: default !important; height: 22px;
border-color: #c9ccd2; line-height: 22px;
border-top: transparent; border: 1px solid transparent;
margin-top: -1px; border-radius: 5px;
font-weight: bold; border-top-left-radius: 0;
color: #007a6b; border-top-right-radius: 0;
height: 23px; font-size: 12px;
line-height: 23px; color: #000;
} padding: 0 15px;
.sptable .coursebg { cursor: pointer;
background: #f5cd79; position: relative;
} }
.sptable .stubg {
background: #26de81; .sptable-box .cusor-tools .item:hover {
} background: #cfcfcf;
.sptable .teacherbg { }
background: #778beb;
} .sptable-box .cusor-tools .item.active {
.sptable .studybg { background: #fff !important;
background: #cf6a87; cursor: default !important;
} border-color: #c9ccd2;
.sptable .study-online-bg { border-top: transparent;
background: #fa8231; margin-top: -1px;
} font-weight: bold;
.sptable .stop { color: #007a6b;
background: #fc427b; height: 23px;
} line-height: 23px;
.sptable .defaultBg { }
background: #dfe4ea;
} .sptable .coursebg {
.sptable .study-normal { background: #f5cd79;
background: #20bf6b; }
}
.sptable .disable-class { .sptable .stubg {
background: #e3e6ed; background: #26de81;
cursor: not-allowed; }
}
.sptable .unchecked { .sptable .teacherbg {
background: #778ca3; background: #778beb;
} }
.sptable .unstudy {
background: #58B19F; .sptable .studybg {
} background: #cf6a87;
.sptable .onlineStudy{ }
background: #8854d0;
} .sptable .study-online-bg {
.sptable .notChecked{ background: #fa8231;
background: #eb3b5a; }
}
.sptable .notFreeCancle{ .sptable .stop {
background: #acacac; background: #fc427b;
} }
.sptable .defaultBg {
background: #dfe4ea;
}
.sptable .study-normal {
background: #20bf6b;
}
.sptable .disable-class {
background: #e3e6ed;
cursor: not-allowed;
}
.sptable .unchecked {
background: #778ca3;
}
.sptable .unstudy {
background: #58B19F;
}
.sptable .onlineStudy {
background: #8854d0;
}
.sptable .notChecked {
background: #eb3b5a;
}
.sptable .notFreeCancle {
background: #acacac;
}
</style> </style>
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