章节与备课调整

src/components/course/chapter-form.vue

@@ -11,7 +11,7 @@
         </div>
       </div>
       <q-card-section class="q-pt-none scroll" style="max-height:60vh">
-        <q-table :loading="loading" no-data-label="暂无相关数据" flat style="height:400px" selection="multiple"
+        <q-table :loading="loading" no-data-label="暂无相关数据" flat style="height:400px" selection="single"
           :selected.sync="selected" class="sticky-column-table sticky-header-table no-bottom-table" separator="none"
           :pagination="initialPagination" :data="fiterDataList" :columns="columns" hide-bottom row-key="CourseId">
         </q-table>
@@ -21,6 +21,9 @@
         <q-btn label="取消" flat color="grey-10" style="font-weight:400 !important" @click="closeSaveForm" />
         <q-btn label="立即提交" color="accent q-px-md" style="font-weight:400 !important" :loading="saveLoading"
           @click="saveChapter" />
+          <template v-slot:loading>
+            <q-spinner-ios />
+          </template>
       </q-card-actions>
     </q-card>
   </q-dialog>
@@ -115,6 +118,8 @@
           })
           return
         }
+        if(this.saveLoading) return;
+        this.saveLoading=true;
         let msg = {
           CourseIds: '',
           MaxLength: this.MyChapterNo,
@@ -139,6 +144,8 @@
               position: 'top'
             })
           }
+        }).catch(e=>{
+          this.saveLoading=false
         })
 
       }

src/pages/course/lessonPreparation.vue

 <style>
-  .lessonPreparation .lessTop {
+.lessonPreparation .lessTop {
     color: #000000;
     font-weight: bold;
     font-size: 14px;
-  }
+}
 
-  .lessonPreparation .Less_LeftIcon {
+.lessonPreparation .Less_LeftIcon {
     background-color: #3FC4FF;
     width: 2px;
     height: 10px;
-  }
+}
 
-  .lessonPreparation .w260 {
+.lessonPreparation .w260 {
     width: 260px !important;
-  }
+}
 
-  .lessonPreparation .w180 {
+.lessonPreparation .w180 {
     width: 180px !important;
-  }
+}
 
-  .lessonPreparation .less_Time {
+.lessonPreparation .less_Time {
     color: #999999;
     font-size: 13px;
-  }
+}
 
-  .lessonPreparation .teach_Content {
+.lessonPreparation .teach_Content {
     color: #111111;
     font-size: 14px;
     margin: 20px 0;
     font-weight: bold;
-  }
+}
 
-  .lessonPreparation .add_Lesson {
+.lessonPreparation .add_Lesson {
     width: 30px;
     height: 30px;
     background-color: #2961FE;
@@ -41,9 +41,9 @@
     border-radius: 50%;
     display: inline-block;
     cursor: pointer;
-  }
+}
 
-  .lessonPreparation .beikeBtn {
+.lessonPreparation .beikeBtn {
     padding: 6px 30px;
     background-color: #2961FE;
     color: #fff;
@@ -51,9 +51,9 @@
     border-radius: 5px;
     margin-left: 20px;
     cursor: pointer;
-  }
+}
 
-  .lessonPreparation .beikeModule {
+.lessonPreparation .beikeModule {
     padding: 9px 15px;
     background-color: #FFFFFF;
     color: #A1AAB2;
@@ -62,9 +62,9 @@
     margin-right: 20px;
     cursor: pointer;
     border: 1px solid #A1AAB2;
-  }
+}
 
-  .lessonPreparation .teach_Lessback {
+.lessonPreparation .teach_Lessback {
     width: 64.5%;
     height: 50px;
     min-width: 908px;
@@ -72,8 +72,9 @@
     line-height: 50px;
     padding-right: 20px;
     background-color: #F0F5FB;
-  }
-  .lessonPreparation .Less_Delete{
+}
+
+.lessonPreparation .Less_Delete {
     width: 30px;
     height: 30px;
     background-color: red;
@@ -82,48 +83,130 @@
     line-height: 30px;
     border-radius: 50%;
     cursor: pointer;
-    margin-top:5px;
+    margin-top: 5px;
     margin-left: 8px;
     position: absolute;
     right: -10px;
     top: -10px;
     display: none;
-  }
-  .lessonPreparation .Less_Delete:hover{
+}
+
+.lessonPreparation .Less_Delete:hover {
     opacity: 0.6;
-  }
-  .lessonPreparation .w60{
-    width:60px!important;
-  }
-  .lessonPreparation .addbtn{
+}
+
+.lessonPreparation .w60 {
+    width: 60px !important;
+}
+
+.lessonPreparation .addbtn {
     width: 100%;
     height: 45px;
     border-radius: 5px;
     border: 1px dashed #E2E2E2;
     margin-top: 10px;
     cursor: pointer;
-  }
-  .lessonPreparation .cont{
+}
+
+.lessonPreparation .cont {
     padding: 1px;
     border: 1px dashed #FFF;
     position: relative;
-  }
-  .lessonPreparation .cont:hover{
+}
+
+.lessonPreparation .cont:hover {
     border: 1px dashed #E2E2E2;
-  }
-  .lessonPreparation .cont .q-gutter-y-xs > *, .q-gutter-xs > *{
+}
+
+.lessonPreparation .cont .q-gutter-y-xs>*,
+.q-gutter-xs>* {
     margin: 0;
-  }
-  .lessonPreparation .cont:hover .Less_Delete{
+}
+
+.lessonPreparation .cont:hover .Less_Delete {
     display: inline-block;
-  }
-  .lessonPreparation .edui-editor{
-    z-index:99!important;
-  }
+}
+
+.lessonPreparation .edui-editor {
+    z-index: 99 !important;
+}
+
+.prepareTopTitle {
+    display: flex;
+    align-items: center;
+    font-size: 12px;
+}
+
+.prePare_Line {
+    width: 3px;
+    height: 14px;
+    background-color: #3FC4FF;
+    margin-right: 10px;
+}
+
+.preSecond {
+    font-size: 36px;
+    color: #000000;
+    position: relative;
+    margin: 20px 0;
+}
+
+.preSecond:after {
+    position: absolute;
+    content: '';
+    display: inline-block;
+    width: 120px;
+    height: 14px;
+    background: #3FC4FF;
+    position: absolute;
+    left: 0;
+    top: 34px;
+    opacity: 0.8;
+}
+
+.prePare_Content {
+    width: 430px;
+    min-height: 100px;
+    height: auto;
+    background-color: #F0F5FB;
+    padding: 20px;
+    margin: 20px auto;
+}
 </style>
 <template>
-  <div class="page-body lessonPreparation">
-    <div style="width:70%;min-width:908px;">
+<div class="row">
+    <div class="page-body lessonPreparation" style="width:40%" v-if="chapter">
+        <div class="prepareTopTitle q-table__title">
+            <div class="prePare_Line"></div>
+            <div>{{chapter.CourseName}}</div>
+        </div>
+        <div class="preSecond">
+            {{chapter.ChapterName}}
+        </div>
+        <div class="prepareTopTitle q-table__title">
+            <div class="prePare_Line" style="background-color:#2961FE"></div>
+            <div>章节学习内容</div>
+        </div>
+        <div class="prePare_Content" v-if="chapter.ChapterContent!=''" v-html="decodeURIComponent(chapter.ChapterContent)"></div>
+        <div class="prePare_Content text-center q-pa-lg" v-else>暂无内容</div>
+        <div class="prepareTopTitle q-table__title">
+            <div class="prePare_Line" style="background-color:#2961FE"></div>
+            <div>教学目标</div>
+        </div>
+        <div class="prePare_Content" style="background:#F7F0FB" v-if="chapter.Objectives!=''" v-html="decodeURIComponent(chapter.Objectives)">
+        </div>
+        <div class="prePare_Content text-center q-pa-lg" style="background:#F7F0FB" v-else>暂无内容</div>
+        <div class="prepareTopTitle q-table__title">
+            <div class="prePare_Line" style="background:#2961FE"></div>
+            <div>学生学习要求</div>
+        </div>
+        <div class="prePare_Content" style="background:#FBF6F0" v-if="chapter.Requirement!=''" v-html="decodeURIComponent(chapter.Requirement)">
+        </div>
+        <div class="prePare_Content text-center q-pa-lg" style="background:#FBF6F0" v-else>暂无内容</div>
+    </div>
+    <div class="page-body lessonPreparation row col">
+
+        <div>
             <div class="lessTop">备课编辑</div>
             <div style="margin:20px 0;">
                 <span class="Less_LeftIcon"></span>
@@ -148,8 +231,7 @@
                 指導内容
             </div>
             <div style="" v-for="(item,index) in addMsg.LessonPlanList">
-        <q-input filled stack-label maxlength="50" v-model="item.CourseTitle" :dense="false"
-                 class="col-12 q-pb-lg" :label="item.CourseName+'項目'" />
+                <q-input filled stack-label maxlength="50" v-model="item.CourseTitle" :dense="false" class="col-12 q-pb-lg" :label="item.CourseName+'項目'" />
             </div>
             <div class="teach_Content">
                 指導項目
@@ -162,11 +244,9 @@
                 <div class="teach_Content">
                     {{item.CourseName}}上课内容
                 </div>
-        <div class="row q-gutter-xs cont" v-for="(subItem,subIndex) in item.LessonPlanDetailsList"
-          style="margin-top:20px;align-items: self-end;width:100%;">
+                <div class="row q-gutter-xs cont" v-for="(subItem,subIndex) in item.LessonPlanDetailsList" style="margin-top:20px;align-items: self-end;width:100%;">
 
-          <q-input filled stack-label maxlength="20" v-model="subItem.Duration" @keyup.native="checkInteger(subItem,'Duration')" style="width: 100%;"
-            :dense="false" class=" " label="时长" suffix="分钟"/>
+                    <q-input filled stack-label maxlength="20" v-model="subItem.Duration" @keyup.native="checkInteger(subItem,'Duration')" style="width: 100%;" :dense="false" class=" " label="时长" suffix="分钟" />
 
                     <UeEditor class="" style="width: 100%;" v-model="subItem.ProjectContent" :config="config"></UeEditor>
                     <div class="Less_Delete " title="删除详情" @click="delLessInfo(index,subIndex)">
@@ -183,21 +263,21 @@
                 <span class="beikeModule" @click="saveInfo(1)">存为模板</span>
                 <q-btn label="提交" size="md" color="accent q-px-md" @click="saveInfo(0)" />
             </div>
-      <lessoncheck-form v-if="IsShowLessForm" @close="closeTeachSaveForm"
-        @success="refreshPage">
+            <lessoncheck-form v-if="IsShowLessForm" @close="closeTeachSaveForm" @success="refreshPage">
             </lessoncheck-form>
         </div>
     </div>
+</div>
 </template>
 
 <script>
-  import UeEditor from '../../components/editor/UeEditor'
-  import lessoncheckForm from '../../components/course/lessoncheck-form'
-  import {
+import UeEditor from '../../components/editor/UeEditor'
+import lessoncheckForm from '../../components/course/lessoncheck-form'
+import {
     SetClassLessPlan,
     GetClassLessPlan
-  } from '../../api/course/class';
-  export default {
+} from '../../api/course/class';
+export default {
     meta: {
         title: "备课编辑"
     },
@@ -229,8 +309,9 @@
                 initialFrameHeight: 150,
             },
             IsShowLessForm: false,
-        nowDate:'',
-        isShowEdit:false, //是否显示提交按钮
+            nowDate: '',
+            chapter: null,
+            isShowEdit: false, //是否显示提交按钮
         }
     },
     created() {},
@@ -242,20 +323,24 @@
         }
         this.getList();
 
-      var today=new Date();
-      var y=today.getFullYear();
-      var m=today.getMonth()+1;
-      var d=today.getDate();
-      var h=today.getHours();
-      var i=today.getMinutes();
-      var s=today.getSeconds();// 在小于10的数字钱前加一个‘0’
-      this.nowDate = y+'-'+m+'-'+d+' '+ h +':'+i+':'+s;
+        var today = new Date();
+        var y = today.getFullYear();
+        var m = today.getMonth() + 1;
+        var d = today.getDate();
+        var h = today.getHours();
+        var i = today.getMinutes();
+        var s = today.getSeconds(); // 在小于10的数字钱前加一个‘0’
+        this.nowDate = y + '-' + m + '-' + d + ' ' + h + ':' + i + ':' + s;
     },
     methods: {
         getList() {
             GetClassLessPlan(this.msg).then(res => {
+                console.log(res.Data)
                 if (res.Code == 1) {
                     let data = res.Data;
+                    if (data.Chapter) {
+                        this.chapter = data.Chapter
+                    }
                     this.addMsg.CourseNum = data.CourseNum;
                     this.addMsg.ClassId = data.ClassId;
                     this.addMsg.School_Id = data.School_Id;
@@ -266,20 +351,20 @@
                         this.addMsg.LessonPlanList = [];
                     } else {
                         this.addMsg.LessonPlanList = data.LessonPlanList;
-              this.addMsg.LessonPlanList.forEach(x=>{
+                        this.addMsg.LessonPlanList.forEach(x => {
                             x.LessonPlanProjectsList.push({
-                  ProjectContent:''
+                                ProjectContent: ''
                             })
                         })
                     }
                     this.TeacherName = data.TeacherName;
                     this.WorkDate = data.WorkDate;
 
-            var beginTimes =this.nowDate.replace(/-/g,"/"); //当前
-            var endTimes =data.ClassStartTime.replace(/-/g,"/"); //开始时间
-            var a =(Date.parse(endTimes)-Date.parse(beginTimes))/3600/1000;
-            if(a>0){  
-              this.isShowEdit=true; //可以编辑
+                    var beginTimes = this.nowDate.replace(/-/g, "/"); //当前
+                    var endTimes = data.ClassStartTime.replace(/-/g, "/"); //开始时间
+                    var a = (Date.parse(endTimes) - Date.parse(beginTimes)) / 3600 / 1000;
+                    if (a > 0) {
+                        this.isShowEdit = true; //可以编辑
                     }
                 }
             })
@@ -324,40 +409,40 @@
             this.addMsg.LessonPlanList[index].LessonPlanDetailsList.push(obj);
         },
         //删除教案详情
-      delLessInfo(index,subIndex){
-        this.addMsg.LessonPlanList[index].LessonPlanDetailsList.splice(subIndex,1);
+        delLessInfo(index, subIndex) {
+            this.addMsg.LessonPlanList[index].LessonPlanDetailsList.splice(subIndex, 1);
         },
         //删除整个教案
-      delLessOne(index){
-        this.addMsg.LessonPlanList.splice(index,1);
+        delLessOne(index) {
+            this.addMsg.LessonPlanList.splice(index, 1);
         },
         //关闭弹窗
         closeTeachSaveForm() {
             this.IsShowLessForm = false
         },
         //选择模板
-      getModule(){
-        this.IsShowLessForm=true;
+        getModule() {
+            this.IsShowLessForm = true;
         },
         //获取选择模板数据
-      refreshPage(val){
-        if(val && val.LessonPlanList.length>0){
+        refreshPage(val) {
+            if (val && val.LessonPlanList.length > 0) {
                 let data = val.LessonPlanList;
-          data.forEach((x,i)=>{
-            if(i==0){
-              x.LessonPlanId=this.addMsg.LessonPlanList[0].LessonPlanId;
+                data.forEach((x, i) => {
+                    if (i == 0) {
+                        x.LessonPlanId = this.addMsg.LessonPlanList[0].LessonPlanId;
 
-            }else if(i==1){
-              x.LessonPlanId=this.addMsg.LessonPlanList[1].LessonPlanId;
+                    } else if (i == 1) {
+                        x.LessonPlanId = this.addMsg.LessonPlanList[1].LessonPlanId;
 
-            }else {
-              x.LessonPlanId=0;
+                    } else {
+                        x.LessonPlanId = 0;
 
                     }
-            x.LessonPlanDetailsList.forEach(j=>{
+                    x.LessonPlanDetailsList.forEach(j => {
                         j.LessonPlanDetailsId = 0
                     })
-             x.LessonPlanProjectsList.forEach(j=>{
+                    x.LessonPlanProjectsList.forEach(j => {
                         j.LessonPlanProjectsId = 0
                     })
                 })
@@ -367,9 +452,9 @@
         //提交
         saveInfo(num) {
             this.addMsg.IsTemplate = num;
-        for(let i=0;i<this.addMsg.LessonPlanList.length;i++){
-          for(let j=0;j<this.addMsg.LessonPlanList[i].LessonPlanDetailsList.length;j++){
-            if(this.addMsg.LessonPlanList[i].LessonPlanDetailsList[j].ProjectContent==''){
+            for (let i = 0; i < this.addMsg.LessonPlanList.length; i++) {
+                for (let j = 0; j < this.addMsg.LessonPlanList[i].LessonPlanDetailsList.length; j++) {
+                    if (this.addMsg.LessonPlanList[i].LessonPlanDetailsList[j].ProjectContent == '') {
                         this.$q.notify({
                             type: 'negative',
                             position: 'top',
@@ -381,7 +466,7 @@
                 }
             }
             SetClassLessPlan(this.addMsg).then(res => {
-          if(res.Code==1){
+                if (res.Code == 1) {
                     this.$q.notify({
                         icon: 'iconfont icon-chenggong',
                         color: 'accent',
@@ -397,8 +482,7 @@
             })
         },
     },
-  }
-
+}
 </script>
 <style lang="sass">
   @import url('~assets/css/table.sass')

src/pages/course/prepareclassDetails.vue

@@ -145,57 +145,34 @@
 
 <template>
   <div class="row prepareclassDetails">
-    <div class="page-body col">
+    <div class="page-body col" v-if="data.Chapter">
       <div class="prepareTopTitle q-table__title">
         <div class="prePare_Line"></div>
-        <div>0到N3直通车</div>
+        <div>{{data.Chapter.CourseName}}</div>
       </div>
       <div class="preSecond">
-        ～を皮切りに
+        {{data.Chapter.ChapterName}}
       </div>
       <div class="prepareTopTitle q-table__title">
         <div class="prePare_Line" style="background-color:#2961FE"></div>
         <div>章节学习内容</div>
       </div>
-      <div class="prePare_Content">
-        まるごと』第３課「どうぞ　よろしく」。まるごと』第３課ど
-        うぞ　よろしく」まるごと』第３課「どうぞ　よろしく」。ま
-        るごと』第３課どうぞ　よろしく」まるごと』第３課「どうぞ
-        よろしく」。まるごと』第３課どうぞ　よろしく」まるごと』
-        第３課「どうぞ　よろしく」。まるごと』第３課どうぞ　よろ
-        しく」。
-        まるごと』第３課「どうぞ　よろしく」。まるごと』第３課ど
-        うぞ　よろしく」まるごと』第３課「どうぞ　よろしく」。ま
-        るごと』第３課どうぞ　よろしく」まるごと』第３課「どうぞ
-        よろしく」。まるごと』第３課どうぞ　よろしく」まるごと』
-        第３課「どうぞ　よろしく」。まるごと』第３課どうぞ　よろ
-        しく」。
-      </div>
+      <div class="prePare_Content" v-if="data.Chapter.ChapterContent!=''" v-html="decodeURIComponent(data.Chapter.ChapterContent)"></div>
+      <div class="prePare_Content text-center q-pa-lg" v-else>暂无内容</div>
       <div class="prepareTopTitle q-table__title">
         <div class="prePare_Line" style="background-color:#2961FE"></div>
         <div>教学目标</div>
       </div>
-      <div class="prePare_Content" style="background:#F7F0FB">
-        まるごと』第３課「どうぞ　よろしく」。まるごと』第３課ど
-        うぞ　よろしく」まるごと』第３課「どうぞ　よろしく」。ま
-        るごと』第３課どうぞ　よろしく」まるごと』第３課「どうぞ
-        よろしく」。まるごと』第３課どうぞ　よろしく」まるごと』
-        第３課「どうぞ　よろしく」。まるごと』第３課どうぞ　よろ
-        しく」。
+      <div class="prePare_Content" style="background:#F7F0FB" v-if="data.Chapter.Objectives!=''" v-html="decodeURIComponent(data.Chapter.Objectives)">
       </div>
+      <div class="prePare_Content text-center q-pa-lg" style="background:#F7F0FB" v-else>暂无内容</div>
       <div class="prepareTopTitle q-table__title">
         <div class="prePare_Line" style="background:#2961FE"></div>
         <div>学生学习要求</div>
       </div>
-      <div class="prePare_Content" style="background:#FBF6F0">
-        まるごと』第３課「どうぞ　よろしく」。まるごと』第３課ど
-        うぞ　よろしく」まるごと』第３課「どうぞ　よろしく」。ま
-        るごと』第３課どうぞ　よろしく」まるごと』第３課「どうぞ
-        よろしく」。まるごと』第３課どうぞ　よろしく」まるごと』
-        第３課「どうぞ　よろしく」。まるごと』第３課どうぞ　よろ
-        しく」。
+      <div class="prePare_Content" style="background:#FBF6F0" v-if="data.Chapter.Requirement!=''" v-html="decodeURIComponent(data.Chapter.Requirement)">
       </div>
-
+      <div class="prePare_Content text-center q-pa-lg" style="background:#FBF6F0" v-else>暂无内容</div>
     </div>
     <div class="page-body col">
       <div class="q-table__title">备课内容</div>
@@ -385,6 +362,9 @@
 
       },
       mounted(){
+
+
+        
         this.msg.ClassId = this.$route.query.ClassId ? this.$route.query.ClassId:0;
         this.msg.ClassPlanId = this.$route.query.ClassPlanId ? this.$route.query.ClassPlanId:0;
         this.plmsg.ClassId = this.$route.query.ClassId ? this.$route.query.ClassId:0;