Skip to content

C
confucius
Commit 67c9c961 authored by 罗超's avatar 罗超
Browse files
Options

2

parent c84feae8
Hide whitespace changes
Inline Side-by-side
Showing with 445 additions and 639 deletions
src/pages/studyAbroad/subscribe.vue
View file @ 67c9c961
...@@ -2,155 +2,57 @@ ...@@ -2,155 +2,57 @@
<div class="page-body"> <div class="page-body">
<div class="col row wrap q-mr-lg q-col-gutter-md searchBox"> <div class="col row wrap q-mr-lg q-col-gutter-md searchBox">
<div class="col-2"> <div class="col-2">
<q-select <q-select filled dense v-model="msg.TeacherId" option-value="TId" option-label="TeacherName"
filled :options="TeacherList" emit-value map-options label="老师" @input="getData" />
dense
v-model="msg.TeacherId"
option-value="TId"
option-label="TeacherName"
:options="TeacherList"
emit-value
map-options
label="老师"
@input="getData"
/>
</div> </div>
<div class="col-2"> <div class="col-2">
<q-select <q-select filled dense v-model="msg.ClassRoomId" option-value="RoomId" option-label="RoomName"
filled :options="classroomList" emit-value map-options label="教室" @input="getData" />
dense
v-model="msg.ClassRoomId"
option-value="RoomId"
option-label="RoomName"
:options="classroomList"
emit-value
map-options
label="教室"
@input="getData"
/>
</div> </div>
<div class="col-2"> <div class="col-2">
<q-select <q-select filled dense v-model="msg.ClassType" option-value="Id" option-label="label" :options="ClassTypeList"
filled emit-value map-options label="课程类型" @input="getData" />
dense
v-model="msg.ClassType"
option-value="Id"
option-label="label"
:options="ClassTypeList"
emit-value
map-options
label="课程类型"
@input="getData"
/>
</div> </div>
<div class="col-2"> <div class="col-2">
<q-select <q-select filled dense v-model="msg.AppointState" option-value="Id" option-label="label"
filled :options="AppointStateList" emit-value map-options label="约课状态" @input="getData" />
dense
v-model="msg.AppointState"
option-value="Id"
option-label="label"
:options="AppointStateList"
emit-value
map-options
label="约课状态"
@input="getData"
/>
</div> </div>
<div class="col-2"> <div class="col-2">
<q-field filled dense label="选择日期" stack-label> <q-field filled dense label="选择日期" stack-label>
<template v-slot:control> <template v-slot:control>
<el-date-picker <el-date-picker v-model="selectedDate" type="date" size="mini" placeholder="开始日期" format="yyyy-MM-dd"
v-model="selectedDate" value-format="yyyy-MM-dd" :clearable="false" @change="changeDate">
type="date"
size="mini"
placeholder="开始日期"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
:clearable="false"
@change="changeDate"
>
</el-date-picker> </el-date-picker>
</template> </template>
</q-field> </q-field>
</div> </div>
<div class="col-2"> <div class="col-2">
<q-select <q-select filled dense v-model="viewType" option-value="value" option-label="name" :options="viewTypeList"
filled emit-value map-options label="显示模式" @input="changeDate" />
dense
v-model="viewType"
option-value="value"
option-label="name"
:options="viewTypeList"
emit-value
map-options
label="显示模式"
@input="changeDate"
/>
</div> </div>
</div> </div>
<div class="row justify-center items-center q-mt-sm"> <div class="row justify-center items-center q-mt-sm">
<q-btn <q-btn dense text-color="primary" flat unelevated :label="viewType == 'day' ? '上一天' : '上一周'"
dense @click="calendarPrev" />
text-color="primary"
flat
unelevated
:label="viewType == 'day' ? '上一天' : '上一周'"
@click="calendarPrev"
/>
<q-separator vertical /> <q-separator vertical />
<q-btn <q-btn dense text-color="primary" flat unelevated :label="viewType == 'day' ? '下一天' : '下一周'"
dense @click="calendarNext" />
text-color="primary"
flat
unelevated
:label="viewType == 'day' ? '下一天' : '下一周'"
@click="calendarNext"
/>
</div> </div>
<div class="viewbox"> <div class="viewbox">
<q-calendar <q-calendar v-model="selectedDate" :view="viewType" ref="calendar" locale="zh-CN" class="calendar-container "
v-model="selectedDate" bordered no-scroll hour24-format :interval-start="8" :interval-count="15" :interval-height="60" animated
:view="viewType" transition-prev="slide-right" transition-next="slide-left" :weekdays="[1, 2, 3, 4, 5, 6, 0]"
ref="calendar" @input="onModelChanged" @click:date2="onClickDate2" @click:day:header2="onClickDayHeader2"
locale="zh-CN" @click:interval2="onClickInterval2" @click:time2="onClickTime2"
class="calendar-container " @click:interval:header2="onClickIntervalHeader2">
bordered
no-scroll
hour24-format
:interval-start="8"
:interval-count="15"
:interval-height="60"
animated
transition-prev="slide-right"
transition-next="slide-left"
:weekdays="[1, 2, 3, 4, 5, 6, 0]"
@input="onModelChanged"
@click:date2="onClickDate2"
@click:day:header2="onClickDayHeader2"
@click:interval2="onClickInterval2"
@click:time2="onClickTime2"
@click:interval:header2="onClickIntervalHeader2"
>
<template #day-header="{ timestamp }"> <template #day-header="{ timestamp }">
<div v-if="viewType == 'week'"> <div v-if="viewType == 'week'">
<q-badge <q-badge :color="item.bg" :label="item.TeacherName" v-for="(item, index) in legendList" :key="index"
:color="item.bg" class="q-mr-xs" />
:label="item.TeacherName"
v-for="(item, index) in legendList"
:key="index"
class="q-mr-xs"
/>
</div> </div>
<div class="flex no-wrap" v-if="viewType == 'day'"> <div class="flex no-wrap" v-if="viewType == 'day'">
<q-badge <q-badge :color="item.bg" :label="item.TeacherName" v-for="(item, index) in legendList" :key="index"
:color="item.bg" style="height:20px" :style="{ width: `${(1 / legendList.length) * 100}%` }" />
:label="item.TeacherName"
v-for="(item, index) in legendList"
:key="index"
style="height:20px"
:style="{ width: `${(1 / legendList.length) * 100}%` }"
/>
</div> </div>
</template> </template>
...@@ -158,13 +60,10 @@ ...@@ -158,13 +60,10 @@
<div v-for="(item, index) in events" :key="index"> <div v-for="(item, index) in events" :key="index">
<div v-if="item.ClassDate == timestamp.date"> <div v-if="item.ClassDate == timestamp.date">
<div v-for="(_item, _index) in item.RList" :key="_index"> <div v-for="(_item, _index) in item.RList" :key="_index">
<div <div v-for="(__item, __index) in _item.SubList" :key="__index"
v-for="(__item, __index) in _item.SubList"
:key="__index"
class="my-event justify-center ellipsis courseItem" class="my-event justify-center ellipsis courseItem"
:class="badgeClasses(__item, 'body', _item.TeacherId)" :class="badgeClasses(__item, 'body', _item.TeacherId)"
style="overflow:hidden;box-shadow: 0px 10px 10px 0 rgba(36, 36, 36, 0.2);" style="overflow:hidden;box-shadow: 0px 10px 10px 0 rgba(36, 36, 36, 0.2);" :style="
:style="
badgeStyles( badgeStyles(
__item, __item,
'body', 'body',
...@@ -173,86 +72,48 @@ ...@@ -173,86 +72,48 @@
_index, _index,
item.RList.length item.RList.length
) )
" " @click.stop="
@click.stop="
showDetail(__item, item.ClassDate, _item.TeacherId) showDetail(__item, item.ClassDate, _item.TeacherId)
" ">
>
<el-popover placement="top-start" width="200" trigger="hover"> <el-popover placement="top-start" width="200" trigger="hover">
<div slot="reference" style="height:80vh;position:relative"> <div slot="reference" style="height:80vh;position:relative">
<q-badge <q-badge rounded color="red" label="未成班" style="position:absolute;top:0;right:0" v-if="
rounded
color="red"
label="未成班"
style="position:absolute;top:0;right:0"
v-if="
viewType == 'day' && viewType == 'day' &&
isShowTag( isShowTag(__item.GuestList, __item.ScrollMinNum)
__item.GuestList, " />
__item.ScrollMinNum <q-icon name="lock_open" color="dark" style="position:absolute;top:0;right:0" v-if="
)
"
/>
<q-icon
name="lock_open"
color="dark"
style="position:absolute;top:0;right:0"
v-if="
viewType == 'week' && viewType == 'week' &&
isShowTag( isShowTag(__item.GuestList, __item.ScrollMinNum)
__item.GuestList, " />
__item.ScrollMinNum <div v-if="viewType == 'day' || item.RList.length == 1" class="q-pa-xs">
)
"
/>
<div
v-if="viewType == 'day' || item.RList.length == 1"
class="q-pa-xs"
>
<!-- <div class="flex"> <!-- <div class="flex">
<span class="detailLabel">老师：</span <span class="detailLabel">老师：</span
><span>{{ _item.TeacherName }}</span> ><span>{{ _item.TeacherName }}</span>
</div> --> </div> -->
<div class="flex"> <div class="flex">
<span class="detailLabel">教室：</span <span class="detailLabel">教室：</span>{{ __item.RoomName }}
>{{ __item.RoomName }}
</div> </div>
<div class="flex no-wrap" v-if="__item.ClassType !== 2"> <div class="flex no-wrap" v-if="__item.ClassType !== 2">
<span class="detailLabel">进度：</span <span class="detailLabel">进度：</span><span>{{ __item.Ranks }}/{{ __item.TotalPlanNum }}</span>
><span
>{{ __item.Ranks }}/{{ __item.TotalPlanNum }}</span
>
</div> </div>
<div class="row flex no-wrap"> <div class="row flex no-wrap">
<span class="detailLabel">课程：</span> <span class="detailLabel">课程：</span>
<div class="detailValue">{{ __item.CourseName }}</div> <div class="detailValue">{{ __item.CourseName }}</div>
</div> </div>
<div class="flex no-wrap"> <div class="flex no-wrap">
<span class="detailLabel">班级：</span <span class="detailLabel">班级：</span><span>{{ __item.ClassName }}</span>
><span>{{ __item.ClassName }}</span>
</div> </div>
<div class="flex no-wrap"> <div class="flex no-wrap">
<span class="detailLabel">时间：</span <span class="detailLabel">时间：</span><span>{{ __item.StartTime }}-{{ __item.EndTime }}</span>
><span
>{{ __item.StartTime }}-{{ __item.EndTime }}</span
>
</div> </div>
<div class="flex no-wrap"> <div class="flex no-wrap">
<span class="detailLabel"> <span class="detailLabel">
类型：<span></span 类型：<span></span><span v-if="__item.ClassType == 1">跟班</span><span
><span v-if="__item.ClassType == 1">跟班</span v-if="__item.ClassType == 2">试听课</span><span v-if="__item.ClassType == 3">约课</span></span>
><span v-if="__item.ClassType == 2">试听课</span
><span v-if="__item.ClassType == 3"
>约课</span
></span
>
</div> </div>
<div class="flex no-wrap" v-if="__item.ClassType !== 2"> <div class="flex no-wrap" v-if="__item.ClassType !== 2">
<span class="detailLabel">进度：</span <span class="detailLabel">进度：</span><span>{{ __item.Ranks }}/{{ __item.TotalPlanNum }}</span>
><span
>{{ __item.Ranks }}/{{ __item.TotalPlanNum }}</span
>
<span class="q-ml-sm">{{ <span class="q-ml-sm">{{
__item.CourseGradeName __item.CourseGradeName
}}</span> }}</span>
...@@ -260,51 +121,35 @@ ...@@ -260,51 +121,35 @@
<div class="flex no-wrap" v-if="__item.ClassType !== 2"> <div class="flex no-wrap" v-if="__item.ClassType !== 2">
<span class="detailLabel">学员：</span> <span class="detailLabel">学员：</span>
<div> <div>
<span <span v-for="(x, y) in __item.GuestList" :key="y"
v-for="(x, y) in __item.GuestList" style="white-space:nowrap;display:inline-block" class="q-mr-xs">
:key="y"
style="white-space:nowrap;"
>
{{ x.GuestName }} {{ x.GuestName }}
<span v-if="x.AppointType == 2">(补)</span> <span v-if="x.AppointType == 2">(补)</span>
<span v-if="x.AppointType == 3">(重)</span>, <span v-if="x.AppointType == 3">(重)</span>
</span> </span>
</div> </div>
</div> </div>
<div class="flex no-wrap" v-if="__item.ClassType == 3"> <div class="flex no-wrap" v-if="__item.ClassType == 3">
<span class="detailLabel"> <span class="detailLabel">状态：</span>
状态：<span <div>
v-if="__item.AppointState == 1" <span v-if="__item.AppointState == 1" style="color:#ef5350">待确认</span>
style="color:#ef5350" <span v-if="__item.AppointState == 2" style="color:#21ba45">已确认</span>
>待确认</span <q-btn color="accent" size="xs" label="确认" v-if="
><span __item.AppointState == 1 &&
v-if="__item.AppointState == 2" __item.GuestList.length >=
style="color:#21ba45" __item.ScrollMinNum &&
>已确认</span auth.IsEdit
> " @click="
<q-btn confirmSub(
color="accent" item.ClassDate,
size="xs" _item.TeacherId,
label="确认" __item
v-if=" )
__item.AppointState == 1 && " />
__item.GuestList.length >= </div>
__item.ScrollMinNum &&
auth.IsEdit
"
@click="
confirmSub(
item.ClassDate,
_item.TeacherId,
__item
)
"
/>
</span>
</div> </div>
<div class="flex no-wrap" v-if="__item.ClassType == 3"> <div class="flex no-wrap" v-if="__item.ClassType == 3">
<span class="">最小成班人数：</span <span class="">最小成班人数：</span><span>{{ __item.ScrollMinNum }}</span>
><span>{{ __item.ScrollMinNum }}</span>
</div> </div>
<!-- <div class="flex no-wrap" v-if="__item.ClassType == 3"> <!-- <div class="flex no-wrap" v-if="__item.ClassType == 3">
<span class="">最大成班人数：</span <span class="">最大成班人数：</span
...@@ -313,108 +158,69 @@ ...@@ -313,108 +158,69 @@
</div> </div>
</div> </div>
<div style="position:relative"> <div style="position:relative">
<q-badge <q-badge rounded color="red" label="未成班" style="position:absolute;top:0;right:0"
rounded v-if="isShowTag(__item.GuestList, __item.ScrollMinNum)" />
color="red"
label="未成班"
style="position:absolute;top:0;right:0"
v-if="
isShowTag(
__item.GuestList,
__item.ScrollMinNum
)
"
/>
<div class="flex"> <div class="flex">
<span class="detailLabel">老师：</span <span class="detailLabel">老师：</span><span>{{ _item.TeacherName }}</span>
><span>{{ _item.TeacherName }}</span>
</div> </div>
<div class="flex"> <div class="flex">
<span class="detailLabel">教室：</span <span class="detailLabel">教室：</span>{{ __item.RoomName }}
>{{ __item.RoomName }}
</div> </div>
<div class="flex no-wrap"> <div class="flex no-wrap">
<span class="detailLabel">课程：</span <span class="detailLabel">课程：</span><span>{{ __item.CourseName }}</span>
><span>{{ __item.CourseName }}</span>
</div> </div>
<div class="flex no-wrap"> <div class="flex no-wrap">
<span class="detailLabel">班级：</span <span class="detailLabel">班级：</span><span>{{ __item.ClassName }}</span>
><span>{{ __item.ClassName }}</span>
</div> </div>
<div class="flex no-wrap"> <div class="flex no-wrap">
<span class="detailLabel">时间：</span <span class="detailLabel">时间：</span><span>{{ __item.StartTime }}-{{ __item.EndTime }}</span>
><span
>{{ __item.StartTime }}-{{ __item.EndTime }}</span
>
</div> </div>
<div class="flex no-wrap" v-if="__item.ClassType !== 2"> <div class="flex no-wrap" v-if="__item.ClassType !== 2">
<span class="detailLabel">进度：</span <span class="detailLabel">进度：</span><span>{{ __item.Ranks }}/{{ __item.TotalPlanNum }}</span>
><span
>{{ __item.Ranks }}/{{ __item.TotalPlanNum }}</span
>
<span class="q-ml-sm">{{ <span class="q-ml-sm">{{
__item.CourseGradeName __item.CourseGradeName
}}</span> }}</span>
</div> </div>
<div class="flex no-wrap"> <div class="flex no-wrap">
<span class="detailLabel"> 类型：</span <span class="detailLabel"> 类型：</span><span v-if="__item.ClassType == 1">跟班</span><span
><span v-if="__item.ClassType == 1">跟班</span v-if="__item.ClassType == 2">试听课</span><span v-if="__item.ClassType == 3">约课</span>
><span v-if="__item.ClassType == 2">试听课</span
><span v-if="__item.ClassType == 3">约课</span>
</div> </div>
<div class="flex no-wrap" v-if="__item.ClassType !== 2"> <div class="flex no-wrap" v-if="__item.ClassType !== 2">
<span class="detailLabel">学员：</span> <span class="detailLabel">学员：</span>
<div> <div>
<span <div v-for="(x, y) in __item.GuestList" :key="y"
v-for="(x, y) in __item.GuestList" style="white-space:nowrap;display:inline-block" class="q-mr-sm">
:key="y"
style="white-space:nowrap"
>
{{ x.GuestName }} {{ x.GuestName }}
<span v-if="x.AppointType == 2">(补)</span> <span v-if="x.AppointType == 2">(补)</span>
<span v-if="x.AppointType == 3">(重)</span>, <span v-if="x.AppointType == 3">(重)</span>
</span> </div>
</div> </div>
</div> </div>
<div class="flex no-wrap" v-if="__item.ClassType == 3"> <div class="flex no-wrap" v-if="__item.ClassType == 3">
<span class="detailLabel"> <span class="detailLabel">状态：</span>
状态：<span <div>
v-if="__item.AppointState == 1" <span v-if="__item.AppointState == 1" style="color:#ef5350">待确认</span>
style="color:#ef5350" <span v-if="__item.AppointState == 2" style="color:#21ba45">已确认</span>
>待确认</span <q-btn color="accent" size="xs" label="确认" v-if="
><span
v-if="__item.AppointState == 2"
style="color:#21ba45"
>已确认</span
>
<q-btn
color="accent"
size="xs"
label="确认"
v-if="
__item.AppointState == 1 && __item.AppointState == 1 &&
__item.GuestList.length >= __item.GuestList.length >=
__item.ScrollMinNum && __item.ScrollMinNum &&
auth.IsEdit auth.IsEdit
" " @click="
@click="
confirmSub( confirmSub(
item.ClassDate, item.ClassDate,
_item.TeacherId, _item.TeacherId,
__item __item
) )
" " />
/> </div>
</span>
</div> </div>
<div class="flex no-wrap" v-if="__item.ClassType == 3"> <div class="flex no-wrap" v-if="__item.ClassType == 3">
<span class="">最小成班人数：</span <span class="">最小成班人数：</span><span>{{ __item.ScrollMinNum }}</span>
><span>{{ __item.ScrollMinNum }}</span>
</div> </div>
<!-- <div class="flex no-wrap" v-if="__item.ClassType == 3"> <!-- <div class="flex no-wrap" v-if="__item.ClassType == 3">
<span class="">最大成班人数：</span <span class="">最大成班人数：</span><span>{{ __item.ScrollMaxNum }}</span>
><span>{{ __item.ScrollMaxNum }}</span>
</div> --> </div> -->
</div> </div>
</el-popover> </el-popover>
...@@ -425,392 +231,392 @@ ...@@ -425,392 +231,392 @@
</template> </template>
</q-calendar> </q-calendar>
</div> </div>
<SubscribeForm <SubscribeForm v-model="showForm" :editType="editType" :dateObj="dateObj" :saveObj="saveObj" :auth="auth"
v-model="showForm" :teacherList="TeacherList2" @success="successHandle" />
:editType="editType"
:dateObj="dateObj"
:saveObj="saveObj"
:auth="auth"
:teacherList="TeacherList2"
@success="successHandle"
/>
</div> </div>
</template> </template>
<script> <script>
import { import {
GetAppointmentPlanStat, GetAppointmentPlanStat,
SetSureAppointment, SetSureAppointment,
GetAppointmentConfig GetAppointmentConfig
} from "../../api/studyabroad/subscribe.js"; } from "../../api/studyabroad/subscribe.js";
import { date } from "quasar"; import {
import { date
getTeacherDropDownList, } from "quasar";
queryClassRoomList import {
} from "../../api/school/index"; getTeacherDropDownList,
import SubscribeForm from "../../components/stuMan/subscribe/subscribeForm"; queryClassRoomList
import QCalendar from "@quasar/quasar-ui-qcalendar"; } from "../../api/school/index";
import SubscribeForm from "../../components/stuMan/subscribe/subscribeForm";
import QCalendar from "@quasar/quasar-ui-qcalendar";
export default { export default {
data() { data() {
return { return {
config: { config: {
AdvanceDay: 0, AdvanceDay: 0,
AppointDay: 7 AppointDay: 7
},
pickerOptions: {
disabledDate: time => {
let timeRange = this.config.AppointDay * 24 * 60 * 60 * 1000;
let _maxTime = Date.now() - 8.64e7 + timeRange; // 最大时间
return (
time.getTime() < Date.now() - 8.64e7 || time.getTime() > _maxTime
);
}
},
viewType: "week",
viewTypeList: [
{
name: "天视图",
value: "day"
},
{
name: "周视图",
value: "week"
}
],
showForm: false,
editType: 1,
selectedDate: "",
msg: {
StartDate: "",
EndDate: "",
TeacherId: 0,
ClassRoomId: 0,
ClassType: 0,
AppointState: 0
},
TeacherList: [],
classroomList: [],
ClassTypeList: [
{
label: "全部",
Id: 0
},
{
label: "跟班",
Id: 1
},
{
label: "试听课",
Id: 2
}, },
{ pickerOptions: {
label: "约课", disabledDate: time => {
Id: 3 let timeRange = this.config.AppointDay * 24 * 60 * 60 * 1000;
} let _maxTime = Date.now() - 8.64e7 + timeRange; // 最大时间
], return (
AppointStateList: [ time.getTime() < Date.now() - 8.64e7 || time.getTime() > _maxTime
{ );
label: "全部", }
Id: 0
}, },
{ viewType: "week",
label: "待确认", viewTypeList: [{
Id: 1 name: "天视图",
value: "day"
},
{
name: "周视图",
value: "week"
}
],
showForm: false,
editType: 1,
selectedDate: "",
msg: {
StartDate: "",
EndDate: "",
TeacherId: 0,
ClassRoomId: 0,
ClassType: 0,
AppointState: 0
}, },
{ TeacherList: [],
label: "已确认", classroomList: [],
Id: 2 ClassTypeList: [{
label: "全部",
Id: 0
},
{
label: "跟班",
Id: 1
},
{
label: "试听课",
Id: 2
},
{
label: "约课",
Id: 3
}
],
AppointStateList: [{
label: "全部",
Id: 0
},
{
label: "待确认",
Id: 1
},
{
label: "已确认",
Id: 2
}
],
colorList: [
"blue-grey",
"purple",
"orange",
"pink",
"green",
"teal",
"secondary",
"info",
"pink",
"deep-purple",
"blue",
"cyan",
"cyan-8",
"brown",
"blue-grey"
],
legendList: [],
TeacherList2: [],
events: [],
dateObj: {},
saveObj: {},
auth: {
IsEdit: false
} }
],
colorList: [
"blue-grey",
"purple",
"orange",
"pink",
"green",
"teal",
"secondary",
"info",
"pink",
"deep-purple",
"blue",
"cyan",
"cyan-8",
"brown",
"blue-grey"
],
legendList: [],
TeacherList2: [],
events: [],
dateObj: {},
saveObj: {},
auth: {
IsEdit: false
}
};
},
components: {
SubscribeForm
},
mounted() {
this.selectedDate = QCalendar.today();
this.getTeacherList();
this.getclassroom();
this.msg.StartDate = this.$refs.calendar.lastStart;
this.msg.EndDate = this.$refs.calendar.lastEnd;
this.getData();
this.getAppointmentConfig();
const ActionMenuList = JSON.parse(localStorage.getItem("loginUserInfo"))
.data.ActionMenuList;
const res = ActionMenuList.find(e => {
return e.FunctionCode == "subscribe_edit";
});
if (res) {
this.auth.IsEdit = true;
} else {
this.auth.IsEdit = false;
}
},
methods: {
badgeClasses(event, type, TeacherId) {
const bg = this.getColor(TeacherId);
return {
[`text-white bg-${bg}`]: true
}; };
}, },
badgeStyles(event, type, timeStartPos, timeDurationHeight, index, total) { components: {
const s = {}; SubscribeForm
if (timeStartPos) { },
s.top = timeStartPos(event.StartTime) + "px"; mounted() {
} this.selectedDate = QCalendar.today();
if (timeDurationHeight) { this.getTeacherList();
let gap = this.calcGap(event.StartTime, event.EndTime); this.getclassroom();
s.height = timeDurationHeight(gap) + "px"; this.msg.StartDate = this.$refs.calendar.lastStart;
} this.msg.EndDate = this.$refs.calendar.lastEnd;
s["align-items"] = "flex-start"; this.getData();
s.left = 0; this.getAppointmentConfig();
s.width = "100%"; const ActionMenuList = JSON.parse(localStorage.getItem("loginUserInfo"))
const singleW = (1 / total) * 100; .data.ActionMenuList;
s.width = singleW + "%"; const res = ActionMenuList.find(e => {
if (index == 0) { return e.FunctionCode == "subscribe_edit";
s.left = 0; });
if (res) {
this.auth.IsEdit = true;
} else { } else {
s.left = singleW * index + "%"; this.auth.IsEdit = false;
} }
return s;
},
getHeight(event, timeDurationHeight) {
let gap = this.calcGap(event.StartTime, event.EndTime);
let height = timeDurationHeight(gap) + "px";
return { height: height + "px" };
},
calendarNext() {
this.$refs.calendar.next();
setTimeout(() => {
this.msg.StartDate = this.$refs.calendar.lastStart;
this.msg.EndDate = this.$refs.calendar.lastEnd;
this.getData();
}, 100);
}, },
calendarPrev() { methods: {
this.$refs.calendar.prev(); badgeClasses(event, type, TeacherId) {
setTimeout(() => { const bg = this.getColor(TeacherId);
this.msg.StartDate = this.$refs.calendar.lastStart; return {
this.msg.EndDate = this.$refs.calendar.lastEnd; [`text-white bg-${bg}`]: true
this.getData(); };
}, 100); },
}, badgeStyles(event, type, timeStartPos, timeDurationHeight, index, total) {
getTeacherList() { const s = {};
getTeacherDropDownList({ LeaveStatus: 1, IsShow: 1 }).then(res => { if (timeStartPos) {
if (res.Code == 1) { s.top = timeStartPos(event.StartTime) + "px";
this.TeacherList = JSON.parse(JSON.stringify(res.Data));
var obj = {
TeacherName: "不限",
TId: 0
};
this.TeacherList.unshift(obj);
this.TeacherList2 = JSON.parse(JSON.stringify(res.Data));
this.TeacherList2.unshift({
TeacherName: "请选择",
TId: 0
});
this.legendList = JSON.parse(JSON.stringify(res.Data));
this.legendList.forEach((item, index) => {
item.bg = this.colorList[index];
});
} }
}); if (timeDurationHeight) {
}, let gap = this.calcGap(event.StartTime, event.EndTime);
getclassroom() { s.height = timeDurationHeight(gap) + "px";
queryClassRoomList({}).then(res => {
if (res.Code == 1) {
this.classroomList = res.Data;
var obj = {
RoomName: "不限",
RoomId: 0
};
this.classroomList.unshift(obj);
} }
}); s["align-items"] = "flex-start";
}, s.left = 0;
getData() { s.width = "100%";
GetAppointmentPlanStat(this.msg).then(res => { const singleW = (1 / total) * 100;
// this.events = res.Data; s.width = singleW + "%";
let data = JSON.parse(JSON.stringify(res.Data)); if (index == 0) {
res.Data.map((e, i) => { s.left = 0;
data[i].RList = []; } else {
e.RList.map(x => { s.left = singleW * index + "%";
this.legendList.map(y => { }
if (y.TId == x.TeacherId) { return s;
data[i].RList.push(x); },
} getHeight(event, timeDurationHeight) {
let gap = this.calcGap(event.StartTime, event.EndTime);
let height = timeDurationHeight(gap) + "px";
return {
height: height + "px"
};
},
calendarNext() {
this.$refs.calendar.next();
setTimeout(() => {
this.msg.StartDate = this.$refs.calendar.lastStart;
this.msg.EndDate = this.$refs.calendar.lastEnd;
this.getData();
}, 100);
},
calendarPrev() {
this.$refs.calendar.prev();
setTimeout(() => {
this.msg.StartDate = this.$refs.calendar.lastStart;
this.msg.EndDate = this.$refs.calendar.lastEnd;
this.getData();
}, 100);
},
getTeacherList() {
getTeacherDropDownList({
LeaveStatus: 1,
IsShow: 1
}).then(res => {
if (res.Code == 1) {
this.TeacherList = JSON.parse(JSON.stringify(res.Data));
var obj = {
TeacherName: "不限",
TId: 0
};
this.TeacherList.unshift(obj);
this.TeacherList2 = JSON.parse(JSON.stringify(res.Data));
this.TeacherList2.unshift({
TeacherName: "请选择",
TId: 0
});
this.legendList = JSON.parse(JSON.stringify(res.Data));
this.legendList.forEach((item, index) => {
item.bg = this.colorList[index];
});
}
});
},
getclassroom() {
queryClassRoomList({}).then(res => {
if (res.Code == 1) {
this.classroomList = res.Data;
var obj = {
RoomName: "不限",
RoomId: 0
};
this.classroomList.unshift(obj);
}
});
},
getData() {
GetAppointmentPlanStat(this.msg).then(res => {
// this.events = res.Data;
let data = JSON.parse(JSON.stringify(res.Data));
res.Data.map((e, i) => {
data[i].RList = [];
e.RList.map(x => {
this.legendList.map(y => {
if (y.TId == x.TeacherId) {
data[i].RList.push(x);
}
});
}); });
}); });
this.events = data;
}); });
this.events = data; },
}); changeDate() {
}, setTimeout(() => {
changeDate() { this.msg.StartDate = this.$refs.calendar.lastStart;
setTimeout(() => { this.msg.EndDate = this.$refs.calendar.lastEnd;
this.msg.StartDate = this.$refs.calendar.lastStart; this.getData();
this.msg.EndDate = this.$refs.calendar.lastEnd; }, 500);
this.getData(); },
}, 500); calcGap(s, e) {
}, let timeStamp = Date.now();
calcGap(s, e) { let formatStr = date.formatDate(timeStamp, "YYYY-MM-DD");
let timeStamp = Date.now(); let start = new Date(formatStr + " " + s).getTime();
let formatStr = date.formatDate(timeStamp, "YYYY-MM-DD"); let end = new Date(formatStr + " " + e).getTime();
let start = new Date(formatStr + " " + s).getTime(); let res = (end - start) / 60000;
let end = new Date(formatStr + " " + e).getTime(); return res;
let res = (end - start) / 60000; },
return res; getColor(TeacherId) {
}, let bg = "";
getColor(TeacherId) { this.legendList.filter(item => {
let bg = ""; if (item.TId == TeacherId) {
this.legendList.filter(item => { bg = item.bg;
if (item.TId == TeacherId) { }
bg = item.bg; });
return bg;
},
onModelChanged(date) {},
onClickDate2(data) {},
onClickDayHeader2(data) {},
onClickInterval2(data) {},
onClickTime2(data) {
//小于今天，不显示弹窗
if (this.showAddStu(data.scope.timestamp.date) && this.auth.IsEdit) {
this.showForm = true;
this.editType = 1;
this.saveObj = {};
this.dateObj = data.scope.timestamp;
} }
}); },
return bg; onClickIntervalHeader2(data) {},
}, showDetail(data, date, tid) {
onModelChanged(date) {},
onClickDate2(data) {},
onClickDayHeader2(data) {},
onClickInterval2(data) {},
onClickTime2(data) {
//小于今天，不显示弹窗
if (this.showAddStu(data.scope.timestamp.date) && this.auth.IsEdit) {
this.showForm = true; this.showForm = true;
this.editType = 1; this.editType = 2;
this.saveObj = {}; this.dateObj.date = date;
this.dateObj = data.scope.timestamp; this.saveObj = data;
} this.saveObj.Tid = tid;
}, },
onClickIntervalHeader2(data) {}, confirmSub(date, id, item) {
showDetail(data, date, tid) { if (item.EnrollNum < item.ScrollMinNum) {
this.showForm = true;
this.editType = 2;
this.dateObj.date = date;
this.saveObj = data;
this.saveObj.Tid = tid;
},
confirmSub(date, id, item) {
if (item.EnrollNum < item.ScrollMinNum) {
this.$q.notify({
message: `最小开班人数为${item.ScrollMinNum}`,
position: "top",
type: "negative"
});
return;
}
const msg = {
Date: date,
TeacherId: id,
ShiftSort: item.ShiftSort
};
SetSureAppointment(msg).then(res => {
if (res.Code == 1) {
this.$q.notify({ this.$q.notify({
message: "操作成功", message: `最小开班人数为${item.ScrollMinNum}`,
position: "top", position: "top",
type: "positive" type: "negative"
}); });
this.getData(); return;
} }
}); const msg = {
}, Date: date,
successHandle() { TeacherId: id,
this.getData(); ShiftSort: item.ShiftSort
}, };
isShowTag(arr, min) { SetSureAppointment(msg).then(res => {
let n=0 if (res.Code == 1) {
arr.map((e)=>{ this.$q.notify({
if(e.AppointType!==3){ message: "操作成功",
n+=1 position: "top",
type: "positive"
});
this.getData();
}
});
},
successHandle() {
this.getData();
},
isShowTag(arr, min) {
let n = 0;
arr.map(e => {
if (e.AppointType !== 3) {
n += 1;
}
});
if (n < min) {
return true;
} else {
return false;
}
},
getAppointmentConfig() {
GetAppointmentConfig({}).then(res => {
this.config = res.Data;
});
},
showAddStu(date) {
if (new Date(date).getTime() < new Date(QCalendar.today()).getTime()) {
return false;
} else {
return true;
} }
})
if (n < min) {
return true;
} else {
return false;
}
},
getAppointmentConfig() {
GetAppointmentConfig({}).then(res => {
this.config = res.Data;
});
},
showAddStu(date) {
if (new Date(date).getTime() < new Date(QCalendar.today()).getTime()) {
return false;
} else {
return true;
} }
} }
} };
};
</script> </script>
<style lang="scss"> <style lang="scss">
.viewbox { .viewbox {
// width:1500px; overflow-x: auto;
overflow-x: auto; box-sizing: border-box;
box-sizing: border-box; }
}
.calendar-container { .calendar-container {
position: relative; position: relative;
// height: calc(100% - 32px); overflow: auto;
// width: 200%; }
overflow: auto;
} .my-event {
.my-event { position: absolute;
position: absolute; font-size: 12px;
font-size: 12px; }
}
.searchBox .el-input__inner { .searchBox .el-input__inner {
border: none; border: none;
background-color: transparent; background-color: transparent;
} }
.searchBox .el-input .el-input__inner,
.el-select .el-input {
border-radius: 0;
height: 25px;
}
.courseItem {
height: 100%;
}
.detailLabel {
width: 35px;
white-space: nowrap;
}
.detailValue {
width: 100%;
display: inline-block;
}
.searchBox .el-input .el-input__inner,
.el-select .el-input {
border-radius: 0;
height: 25px;
}
.courseItem {
// overflow: auto;
// padding: 3px;
height: 100%;
}
.detailLabel {
width: 35px;
white-space: nowrap;
}
.detailValue {
width: 100%;
display: inline-block;
}
</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