|
@@ -52,7 +52,7 @@
|
|
|
<div class="course-classroom-list">
|
|
|
<div class="course-classroom-list-header">
|
|
|
<span class="course-classroom-label">{{$t('courseManage.classroom.classroomList')}}</span>
|
|
|
- <Icon type="md-add" @click="addClassroom(1)" color="white" size="18" style="float:right;margin-right:15px;margin-top:10px;cursor:pointer;"/>
|
|
|
+ <Icon type="md-add" @click="addClassroom(1)" color="white" size="18" style="float:right;margin-right:15px;margin-top:10px;cursor:pointer;" />
|
|
|
</div>
|
|
|
<div class="course-classroom-list-content" v-if="courseList.length > 0">
|
|
|
<div v-for="(item,index) in courseList[currentCourseIndex].classroom" :key="index" @click="changeClassroom(index)" :class="currentClassroomIndex === index ? 'course-classroom-item block-bg block-bg-active':'course-classroom-item block-bg'">
|
|
@@ -108,7 +108,7 @@
|
|
|
<span :class="currentSetIndex === 1 ? 'setting-label setting-label-active':'setting-label'" @click="selectSetIndex(1)">{{$t('courseManage.classroom.studentList')}}</span>
|
|
|
<div class="classroom-student-menu" v-show="currentSetIndex === 1">
|
|
|
<Button type="primary" size="small" style="float:right;margin-right:60px;margin-top:8px;" @click="customGroup">{{$t('courseManage.classroom.autoGroupBtn')}}</Button>
|
|
|
-
|
|
|
+
|
|
|
<div style="float:right;margin-right:40px;">
|
|
|
<span style="margin-right:5px;">{{$t('courseManage.classroom.removeStudent1')}}</span>
|
|
|
<Select v-model="currentGroup" style="width:80px" size="small">
|
|
@@ -149,53 +149,44 @@
|
|
|
</Select>
|
|
|
|
|
|
</div>
|
|
|
- <!--<div class="classroom-info-item">
|
|
|
- <p class="classroom-attr-label">{{$t('courseManage.classroom.classroomNotice')}}</p>
|
|
|
- <div ref="classroomNotice" style="width:90%;margin-top:10px;"></div>
|
|
|
- </div>-->
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
<div slot="right" class="demo-split-pane">
|
|
|
<!--课程时段-->
|
|
|
- <div class="class-qrcode-box animated fadeIn" style="border-left: 1px solid #424242;">
|
|
|
+ <div class="class-time-box" style="border-left: 1px solid #424242;">
|
|
|
+ <div class="course-time-info-header">
|
|
|
+ <span>{{$t('courseManage.base.courseTime')}}</span>
|
|
|
+ <Icon type="md-add" color="white" size="18" @click="addCourseTime" style="float:right;margin-top:10px;margin-right:30px;cursor:pointer;" />
|
|
|
+ <Icon type="md-create" color="white" size="18" @click="editCourseTime(currentTimeIndex)" style="float:right;margin-top:10px;margin-right:20px;cursor:pointer;" />
|
|
|
+ <Icon type="md-trash" color="white" size="18" @click="delCourseTime" style="float:right;margin-top:10px;margin-right:20px;cursor:pointer;" />
|
|
|
+ <Icon type="ios-settings" color="aqua" size="18" @click="showSettingTime" style="margin-top:10px;margin-left:10px;cursor:pointer;" />
|
|
|
+ </div>
|
|
|
<div class="course-time-info-content">
|
|
|
- <div v-if="courseInfo.courseTime.length > 0" class="course-time-item" v-for="(item,index) in courseInfo.courseTime" :key="index">
|
|
|
- <div class="item-order">
|
|
|
- <span class="item-order-index">{{index + 1}}</span>
|
|
|
- <Icon type="md-create" color="white" class="edit-time" size="50" :title="$t('courseManage.tips1')" @click="editCourseTime(index)" />
|
|
|
- </div>
|
|
|
+ <div :class="currentTimeIndex == index ? 'course-time-item block-bg block-bg-active':'course-time-item block-bg'" v-for="(item,index) in courseInfo.classroom[currentClassroomIndex].courseTime" :key="index" @click="selectTime(index)">
|
|
|
<div class="course-time-detail">
|
|
|
<div class="course-frequently">
|
|
|
<Select v-model="item.frequencyCode" :disabled="editTimeIndex !== index" size="small" style="width:112px" @on-change="selectFrequencyCode">
|
|
|
<Option v-for="item in frequencyList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
|
|
</Select>
|
|
|
- <Select v-if="item.frequencyCode === 'week'" multiple v-model="item.frequencyName" class="course-date course-week" :disabled="editTimeIndex !== index" size="small">
|
|
|
+ <Select v-if="item.frequencyCode === 'week'" v-model="item.frequencyName" style="width:112px" class="course-date course-week" :disabled="editTimeIndex !== index" size="small">
|
|
|
<Option v-for="item in weekList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
|
|
</Select>
|
|
|
<DatePicker v-if="item.frequencyCode === 'temporary' || item.frequency === 'month'" v-model="item.frequencyName" :disabled="editTimeIndex !== index" class="course-date" type="date" placeholder="选择日期" size="small" style="" format="yyyy-MM-dd"></DatePicker>
|
|
|
- <span v-if="item.frequencyCode === 'day'" class="course-date" style="color:white;padding-left:24px;">{{$t('courseManage.base.courseTag')}}</span>
|
|
|
</div>
|
|
|
- <div class="course-time">
|
|
|
- <TimePicker v-model="item.beginTime" :disabled="editTimeIndex !== index" format="HH:mm" :placeholder="$t('courseManage.base.start')" size="large" class="course-time-start" style="width: 112px;font-size:18px;"></TimePicker>
|
|
|
- <span style="margin-left: -50px;margin-top:10px;display:inline-block; color:#eeeeee;">{{$t('courseManage.base.text')}}</span>
|
|
|
- <TimePicker v-model="item.endTime" :disabled="editTimeIndex !== index" format="HH:mm" :placeholder="$t('courseManage.base.end')" size="large" class="course-time-end" style="width: 112px;font-size:18px;"></TimePicker>
|
|
|
- </div>
|
|
|
- <div class="course-classroom">
|
|
|
- <Select v-model="item.classroomCode" v-if="editTimeIndex === index" :placeholder="$t('courseManage.base.selectClassroomHolder')" size="small" style="width:calc(100% - 50px);">
|
|
|
- <Option v-for="item in $store.state.schoolBaseInfo.classroomList" :value="item.classroomCode" :key="item.classroomCode">{{ item.classroomName }}</Option>
|
|
|
- </Select>
|
|
|
- <p v-if="editTimeIndex !== index" style="color:white;padding-left:10px;"><span>{{$t('courseManage.base.courseClassroom')}}</span><span>{{getClassroomName(item.classroomCode)}}</span></p>
|
|
|
+ <div class="course-time" v-for="(time,i) in item.times">
|
|
|
+ <TimePicker v-model="item.times[i]" :disabled="editTimeIndex !== index" format="HH:mm" type="timerange" placement="bottom-end" placeholder="00:00 - 00:00" style="width: calc(100% - 50px);"></TimePicker>
|
|
|
+ <Icon type="md-remove-circle" v-show="editTimeIndex == index" style="margin-left:10px;" color="#ed4014" size="18" @click="delTimePeriod(i)" />
|
|
|
</div>
|
|
|
<div class="course-time-action" v-if="editTimeIndex === index">
|
|
|
<div class="smarll-confirm-btn smarll-confirm-btn-active" @click="cancelEditTime(index)">{{$t('courseManage.btnCancel')}}</div>
|
|
|
- <div class="smarll-confirm-btn smarll-confirm-btn-active" style="margin:0px 15px;" @click="showDeleteTime(index)">{{$t('courseManage.btnDel')}}</div>
|
|
|
+ <div class="smarll-confirm-btn smarll-confirm-btn-active" style="margin:0px 15px;" @click="addTimePeriod(index)">{{$t('courseManage.base.addTime')}}</div>
|
|
|
<div class="smarll-confirm-btn smarll-confirm-btn-active" @click="submit('courseTime')">{{$t('courseManage.btnSave')}}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <NoData v-if="courseInfo.courseTime.length == 0" style="margin-top:120px;"></NoData>
|
|
|
+ <NoData v-if="courseInfo.classroom[currentClassroomIndex].courseTime.length == 0" style="margin-top:120px;"></NoData>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -217,6 +208,26 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <Drawer title="作息时间设置" width="320" v-model="timeSettingStatus" class-name="dark-iview-drawer">
|
|
|
+ <div style="width:100%;height:100%;padding-top:25px;">
|
|
|
+ <vuescroll>
|
|
|
+ <Timeline style="color: white;margin-left: 20px;width: fit-content;">
|
|
|
+ <TimelineItem v-for="(item,index) in schoolTimeTable">
|
|
|
+ <div class="time-line-item">
|
|
|
+ <div class="time-setting-item">
|
|
|
+ <p class="time">{{item.time}}</p>
|
|
|
+ <p class="content">{{item.label}}</p>
|
|
|
+ </div>
|
|
|
+ <div class="time-action-item">
|
|
|
+ <Icon type="md-add-circle" @click="showAddTime(index)" class="action-btn-icon" color="#19be6b" size="20" />
|
|
|
+ <Icon type="md-remove-circle" class="action-btn-icon" color="#ed4014" size="20" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </TimelineItem>
|
|
|
+ </Timeline>
|
|
|
+ </vuescroll>
|
|
|
+ </div>
|
|
|
+ </Drawer>
|
|
|
<Modal v-model="deleteCourseStatus"
|
|
|
title="删除课程"
|
|
|
@on-ok="delCourse">
|
|
@@ -225,14 +236,19 @@
|
|
|
<Modal v-model="addCourseStatus"
|
|
|
title="新增课程"
|
|
|
@on-ok="addCourse">
|
|
|
-
|
|
|
+
|
|
|
+ </Modal>
|
|
|
+ <Modal v-model="addTimeStatus"
|
|
|
+ title="添加节点"
|
|
|
+ class-name="dark-iview-modal"
|
|
|
+ @on-ok="confirmAddTime">
|
|
|
+
|
|
|
</Modal>
|
|
|
<Modal v-model="customGroupStatus"
|
|
|
:title="$t('courseManage.classroom.autoGroupBtn')"
|
|
|
@on-ok="comfirmCustomRules" class="custom-group">
|
|
|
<Form :label-width="80" :label-colon="true">
|
|
|
<FormItem :label="$t('courseManage.classroom.studentCountLabel')">
|
|
|
- <!--<span>{{courseClassroomList[currentClassroomIndex].students.length}}人</span>-->
|
|
|
<span>{{0}}人</span>
|
|
|
</FormItem>
|
|
|
<FormItem :label="$t('courseManage.classroom.groupCountLabel')">
|
|
@@ -253,7 +269,7 @@
|
|
|
</FormItem>
|
|
|
</Form>
|
|
|
</Modal>
|
|
|
-
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
@@ -269,9 +285,10 @@
|
|
|
return {
|
|
|
courseInfo: {
|
|
|
id: '1',
|
|
|
+ scopeCode:"",
|
|
|
courseName: '语文阅读',
|
|
|
courseCode: 'T00011120',
|
|
|
- semesterCode:'123',
|
|
|
+ semesterCode:'123',//学期
|
|
|
subjectCode: '',
|
|
|
subjectName: '语文',
|
|
|
classroom: [
|
|
@@ -279,22 +296,35 @@
|
|
|
classroomCode: 'HBCN0202',
|
|
|
teacher: '',
|
|
|
notice:'',//管理员不用设置,授课教师获取到课程才设置
|
|
|
- times: [ //上课时段
|
|
|
+ courseTime: [ //上课时段
|
|
|
{
|
|
|
-
|
|
|
+ "frequencyCode": "day",
|
|
|
+ "frequencyName": "",
|
|
|
+ "times": [
|
|
|
+ ["05:04","05:09"],
|
|
|
+ ["05:04","05:09"]
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ "frequencyCode": "week",
|
|
|
+ "frequencyName": "WED",
|
|
|
+ "times": [
|
|
|
+ ["05:04","05:09"]
|
|
|
+ ]
|
|
|
}
|
|
|
]
|
|
|
}
|
|
|
- ],
|
|
|
- courseTime:[]
|
|
|
+ ]
|
|
|
},
|
|
|
currentCourseIndex:0,
|
|
|
- courseList:[],
|
|
|
+ courseList: [],
|
|
|
customGroupStatus: false,
|
|
|
studentTabelLoading: false,
|
|
|
addCourseStatus: false,
|
|
|
isSearch: false,
|
|
|
deleteCourseStatus: false,
|
|
|
+ timeSettingStatus: false,
|
|
|
+ addTimeStatus: false,
|
|
|
keyWord: '',
|
|
|
courseListShow: [],
|
|
|
split1: 0.55,
|
|
@@ -375,10 +405,6 @@
|
|
|
{
|
|
|
label: '每周课程',
|
|
|
value: 'week'
|
|
|
- },
|
|
|
- {
|
|
|
- label: '临时课程',
|
|
|
- value: 'temporary'
|
|
|
}
|
|
|
],
|
|
|
currentClassroomIndex: 0,
|
|
@@ -412,10 +438,83 @@
|
|
|
value: 'SUN'
|
|
|
}
|
|
|
],
|
|
|
- studentColumn: []
|
|
|
+ studentColumn: [],
|
|
|
+ currentTimeIndex: 0,
|
|
|
+ schoolTimeTable: [
|
|
|
+ {
|
|
|
+ label: '到校',
|
|
|
+ time:'7:00'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '离校',
|
|
|
+ time:'17:00'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ timeNode: {
|
|
|
+ label: '',
|
|
|
+ time:''
|
|
|
+ },
|
|
|
+ timeNodeIndex:0
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ //显示添加时间节点
|
|
|
+ showAddTime(index) {
|
|
|
+ this.addTimeStatus = true
|
|
|
+ this.timeNodeIndex = index
|
|
|
+ },
|
|
|
+ //确认添加时间节点
|
|
|
+ confirmAddTime() {
|
|
|
+
|
|
|
+ },
|
|
|
+ //显示抽屉设置学校时间安排
|
|
|
+ showSettingTime() {
|
|
|
+ this.timeSettingStatus = true
|
|
|
+ },
|
|
|
+ //删除时间
|
|
|
+ delTimePeriod(index) {
|
|
|
+ this.courseInfo.classroom[this.currentClassroomIndex].courseTime[this.editTimeIndex].times.splice(index,1)
|
|
|
+ },
|
|
|
+ //添加时间
|
|
|
+ addTimePeriod() {
|
|
|
+ this.courseInfo.classroom[this.currentClassroomIndex].courseTime[this.editTimeIndex].times.push(
|
|
|
+ ["00:00", "00:00"]
|
|
|
+ )
|
|
|
+ },
|
|
|
+ //添加课程时段
|
|
|
+ addCourseTime() {
|
|
|
+ this.courseInfo.classroom[this.currentClassroomIndex].courseTime.push({
|
|
|
+ "frequencyCode": "week",
|
|
|
+ "frequencyName": "WED",
|
|
|
+ "times": [
|
|
|
+ ["05:04", "05:09"]
|
|
|
+ ]
|
|
|
+ })
|
|
|
+ this.currentTimeIndex = this.courseInfo.classroom[this.currentClassroomIndex].courseTime.length - 1
|
|
|
+ this.editTimeIndex = this.currentTimeIndex
|
|
|
+ },
|
|
|
+ //删除课程时段
|
|
|
+ delCourseTime() {
|
|
|
+ let index = this.currentTimeIndex
|
|
|
+ this.currentTimeIndex = 0
|
|
|
+ this.courseInfo.classroom[this.currentClassroomIndex].courseTime.splice(index,1)
|
|
|
+ },
|
|
|
+ //选择课程时段
|
|
|
+ selectTime(index) {
|
|
|
+ if (this.editTimeIndex !== -1 && this.currentTimeIndex !== index) {
|
|
|
+ this.editTimeIndex = -1
|
|
|
+ }
|
|
|
+ this.currentTimeIndex = index
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ this.editTimeIndex = -1
|
|
|
+ },
|
|
|
+ cancelEditTime(index) {
|
|
|
+ this.editTimeIndex = -1
|
|
|
+ },
|
|
|
+ editCourseTime(index) {
|
|
|
+ this.editTimeIndex = index
|
|
|
+ },
|
|
|
getClassroomName(code) {
|
|
|
let c = []
|
|
|
if (this.$store.state.schoolBaseInfo.classroomList !== undefined) {
|
|
@@ -821,6 +920,36 @@
|
|
|
@import './NewAdminCourse.less';
|
|
|
</style>
|
|
|
<style lang="less">
|
|
|
+ .course-time-item .ivu-select-selection, .course-time-item .ivu-input {
|
|
|
+ background: none;
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
+
|
|
|
+ .course-time-item .ivu-select-disabled .ivu-select-selection, .course-time-item .ivu-input[disabled] {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .course-time-item .course-time .ivu-input[disabled] {
|
|
|
+ font-size: 30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .course-time-item .ivu-select-disabled .ivu-select-selection .ivu-select-arrow {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .disabled-style .ivu-select-disabled .ivu-select-selection .ivu-select-arrow {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .disabled-style .ivu-select-disabled .ivu-select-selection, .disabled-style .ivu-input[disabled] {
|
|
|
+ border: none;
|
|
|
+ font-size: 18px !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .disabled-style .ivu-select-input[disabled] {
|
|
|
+ -webkit-text-fill-color: white;
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
.classroom-student #loadingBox {
|
|
|
margin-top: 0px !important;
|
|
|
}
|