Commit 55bfb3fc authored by 黄奎's avatar 黄奎

页面修改

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