Jelajahi Sumber

Merge branch 'develop3.0' of http://106.12.23.251:10080/TEAMMODEL/TEAMModelOS into develop3.0

CrazyIter 5 tahun lalu
induk
melakukan
df500ec069

+ 14 - 0
TEAMModelOS/ClientApp/src/css/dark-iview-drawer.less

@@ -0,0 +1,14 @@
+.dark-iview-drawer {
+    .ivu-drawer-content {
+        background: #404040;
+    }
+
+    .ivu-drawer-header {
+        border-color: #606060;
+    }
+
+    .ivu-drawer-header
+    p, .ivu-drawer-header-inner{
+        color:white;
+    }
+}

+ 2 - 1
TEAMModelOS/ClientApp/src/locale/lang/en-US/courseManage.js

@@ -23,8 +23,9 @@ export default {
         teachers1: 'teacher settings',
         addTeacher: 'add out of school teacher',
         searchHolder: 'ID or name search',
-        courseTime: 'course period setting',
+        courseTime: 'time interval setting',
         courseClassroom: 'Classroom:',
+        addTime: 'Add time period',
         text: 'To',
         courseTag: 'weekday course',
         start: 'Start',

+ 2 - 1
TEAMModelOS/ClientApp/src/locale/lang/zh-CN/courseManage.js

@@ -23,8 +23,9 @@ export default {
         teachers1: '任课教师设置',
         addTeacher: '添加校外教师',
         searchHolder: 'ID或姓名搜索',
-        courseTime: '课程时段设置',
+        courseTime: '时段设置',
         courseClassroom: '授课教室:',
+        addTime:'添加时段',
         text: '至',
         courseTag: '平日课程',
         start: '开始',

+ 2 - 1
TEAMModelOS/ClientApp/src/locale/lang/zh-TW/courseManage.js

@@ -23,8 +23,9 @@ export default {
         teachers1: '任課教師設定',
         addTeacher: '添加校外教師',
         searchHolder: 'ID或姓名蒐索',
-        courseTime: '課程時段設定',
+        courseTime: '時段設定',
         courseClassroom: '授課教室:',
+        addTime: '添加時段',
         text: '至',
         courseTag: '平日課程',
         start: '開始',

+ 1 - 0
TEAMModelOS/ClientApp/src/view/Home.vue

@@ -207,4 +207,5 @@
     @import '../css/dark-iview-loading.less';
     @import '../css/disabled-iview-form.less';
     @import '../css/common-style.less';
+    @import '../css/dark-iview-drawer.less';
 </style>

+ 1 - 2
TEAMModelOS/ClientApp/src/view/coursemgmt/CourseBaseSetting.vue

@@ -80,11 +80,10 @@
                             <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" 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>

+ 36 - 19
TEAMModelOS/ClientApp/src/view/newcourse/NewAdminCourse.less

@@ -148,20 +148,10 @@
         .classroom-base-set {
             width: 100%;
             height: 100%;
-            /*display: flex;
-            flex-direction: row;*/
-            .class-qrcode-box {
+            .class-time-box {
                 width: 400px;
                 height: 100%;
                 padding-left: 10px;
-
-                .qrcode-label {
-                    color: @second-textColor;
-                    margin-top: 40px;
-                    text-align: center;
-                    margin-bottom: 20px;
-                    font-size: 15px;
-                }
             }
 
             .classroom-base-info {
@@ -254,8 +244,7 @@
         }
 
         .course-time-detail {
-            width: ~"calc(100% - 75px)";
-
+            width:100%;
             .course-frequently {
                 width: 100%;
                 overflow: auto;
@@ -263,18 +252,12 @@
                 .course-date {
                     float: right;
                     margin-right: 50px;
-                    width: 127px;
-                }
-
-                .course-week {
-                    width: 180px;
                 }
             }
 
             .course-time {
                 margin-top: 10px;
                 position: relative;
-                text-align: center;
                 width: 100%;
                 height: 40px;
 
@@ -460,4 +443,38 @@
     display: inline-block;
     width: 100%;
     text-align: center;
+}
+.course-time-info-header{
+    width:100%;
+    height:40px;
+    line-height:40px;
+    border-bottom:1px solid @borderColor;
+    color:@second-textColor;
+    padding-left:20px;
+}
+.time-line-item {
+    display: flex;
+    align-items: center;
+    cursor:pointer;
+}
+.time-setting-item {
+    .time {
+        font-size: 18px;
+    }
+
+    .content {
+        color: aqua;
+    }
+}
+.time-action-item {
+    display: none;
+    width: 100px;
+    text-align: center;
+}
+
+.time-line-item:hover .time-action-item {
+    display: block !important;
+}
+.action-btn-icon{
+    margin:5px;
 }

+ 169 - 40
TEAMModelOS/ClientApp/src/view/newcourse/NewAdminCourse.vue

@@ -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;
     }