1

src/api/course/index.js

@@ -716,4 +716,42 @@ export function SetTrialLesson(data){
     method: 'post',
     data
   })
-}
\ No newline at end of file
+}
+
+/**
+ * 根据课程编号和章节编号获取单词列表
+ * @param {JSON对象} data 
+ */
+export function GetCourseWordsList(data){
+  return request({
+    url: '/CourseWords/GetCourseWordsList',
+    method: 'post',
+    data
+  })
+}
+
+/**
+ * 根据编号获取单词详情
+ * @param {JSON对象} data 
+ */
+export function GetCourseWords(data){
+  return request({
+    url: '/CourseWords/GetCourseWords',
+    method: 'post',
+    data
+  })
+}
+
+/**
+ * 根据编号获取单词详情
+ * @param {JSON对象} data 
+ */
+export function SetCourseWords(data){
+  return request({
+    url: '/CourseWords/SetCourseWords',
+    method: 'post',
+    data
+  })
+}
+
+

src/pages/course/chapterEditor.vue

@@ -18,7 +18,7 @@
 
             <el-upload class="upload-demo" action="" style="display:inline-block;margin-left:80px;" :accept="accept"
               :show-file-list="false" :http-request="UploadAttachment">
-              <el-button size="small" type="primary">导入单词</el-button>
+              <el-button size="mini" type="primary">导入单词</el-button>
             </el-upload>
           </div>
           <div class="q-mt-lg" style="height:calc(100% - 140px)">
@@ -82,11 +82,39 @@
                 <editor v-model="chapter.Requirement" placeHolder="请输入章节学生学习要求" :config="config" ref="requirement">
                 </editor>
               </div>
+              <div class="text-h6 q-mb-md">单词列表</div>
+              <div class="q-mb-md">
+                <q-table :pagination="pageMsg" no-data-label="暂无相关数据" flat
+                  class="sticky-right-column-table sticky-column-table" separator="none" :data="WordData" :columns="columns"
+                  row-key="name">
+                  <template v-slot:top="props">
+                    <q-space />
+                    <div class="page-option">
+                      <q-btn color="accent" size="sm" class="q-mr-md" icon="add" label="新增单词" @click="EditWord(null)" />
+                    </div>
+                  </template>
+                  <!-- <template v-slot:bottom>
+                        <q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
+                          :input="true" @input="changePage" />
+                      </template> -->
+                  <template v-slot:body-cell-Id="props">
+                    <q-td :props="props">
+                      <div>
+                        <q-btn flat size="xs" icon="edit" color="accent" style="font-weight:400" label="编辑"
+                          @click="EditWord(props.row)" />
+                        <q-btn flat size="xs" icon="delete" color="negative" style="font-weight:400" label="删除"
+                          @click="delWord(props.row)"></q-btn>
+                      </div>
+                    </q-td>
+                  </template>
+                </q-table>
+              </div>
             </div>
           </div>
         </div>
       </template>
     </q-splitter>
+
     <q-btn round padding="md" v-if="chapter && chapter.ChapterId>0" @click="saveChapterUpdate" :loading="submiting"
       color="primary" class="fixed-bottom-right" label="保存" style="z-index:9999999;right:20px;bottom:100px;">
       <template v-slot:loading>
@@ -96,12 +124,15 @@
     <chapter-form v-if="isShowChapter" :CourseId="courseId" :MyChapterNo="MyChapterNo" @close="closeChapterForm"
       @success="refreshPage">
     </chapter-form>
+    <words-form v-if="isShowWordForm" :save-obj="wordObj" :addObj="addObj" @close="closeChapterForm"
+      @success="getAllWords"></words-form>
   </div>
 </template>
 
 <script>
   import editor from "../../components/editor/UeEditor";
   import chapterForm from "../../components/course/chapter-form";
+  import wordsForm from "../../components/course/words-form"
   import {
     queryChapterTree,
     saveChapter,
@@ -110,7 +141,8 @@
     getCourseRate,
     queryCourseInfo,
     deleteChapters,
-    setChaptersRate
+    setChaptersRate,
+    GetCourseWordsList
   } from "../../api/course/index";
   import {
     compareObject
@@ -127,7 +159,8 @@
     },
     components: {
       editor,
-      chapterForm
+      chapterForm,
+      wordsForm
     },
     directives: {
       focus: {
@@ -186,7 +219,46 @@
         splitterModel: 30, //左侧默认占据多大
         isShowChapter: false, //是否显示导入
         chapterObj: {},
-        MyChapterNo: 0
+        MyChapterNo: 0,
+        WordData:[], //单词数组
+        pageMsg:{
+          rowsPerPage: 10000
+        },
+        columns: [{
+            name: 'WordContent',
+            required: true,
+            label: '单词名',
+            align: 'left',
+            field: 'WordContent'
+         },{
+            name: 'WordType',
+            required: true,
+            label: '单词类型',
+            align: 'left',
+            field: 'WordType'
+         },{
+            name: 'WordWrite',
+            required: true,
+            label: '单词写法',
+            align: 'left',
+            field: 'WordWrite'
+         },{
+            name: 'ChineseMean',
+            required: true,
+            label: '中文意思',
+            align: 'left',
+            field: 'ChineseMean'
+         },{
+            name: 'Id',
+            label: '操作',
+            field: 'Id'
+         }],
+         wordObj:{},
+         isShowWordForm:false,
+         addObj:{
+           CourseId:0,
+           ChapterId:0
+         }
       };
     },
     created() {
@@ -199,6 +271,7 @@
         this.initRateList();
         this.getCourseInfo();
       }
+      this.getAllWords(0);
 
     },
     mounted() {
@@ -220,9 +293,40 @@
         UploadLocalSystem(JSON.stringify(fileParams), files.file, res => {
           if (res.Code == 1) {
             this.questionData = res.Data;
+            this.getAllWords();
+          }
+        })
+      },
+      //导入成功获取所有
+      getAllWords(ChapterId) {
+        let msg = {
+          CourseId: this.courseId,
+          ChapterId: ChapterId
+        }
+        GetCourseWordsList(msg).then(res => {
+          console.log(res, '数据');
+          if(res.Code==1){
+            this.WordData = res.Data;
           }
         })
       },
+      //删除单词
+      delWord(Id) {
+
+      },
+      //新增单词
+      addWord(){
+
+      },
+      //新增单词
+      EditWord(obj){
+        if (obj) {
+          this.wordObj = obj
+        } else {
+          this.wordObj = null
+        }
+        this.isShowWordForm = true
+      },
       changeContent() {},
       getCourseInfo() {
         queryCourseInfo({
@@ -238,6 +342,7 @@
         })
       },
       changeNode(data, node, ev) {
+        console.log(data,'点击了');
         if (this.chapter && this.chapter.ChapterId > 0) {
           if (this.defauRateObj.Id != 0) {
             this.chapter.CourseRate = this.defauRateObj.Id
@@ -277,7 +382,10 @@
             this.defauRateObj = x
           }
         })
-
+        this.addObj.CourseId = data.CourseId;
+        this.addObj.ChapterId = data.ChapterId;
+        //点击调用章节下的单词
+        this.getAllWords(data.ChapterNo);
       },
       updateRate() {
         setChaptersRate({
@@ -609,6 +717,7 @@
       },
       closeChapterForm() {
         this.isShowChapter = false;
+        this.isShowWordForm = false;
       },
       refreshPage() {
         this.initTree();
@@ -616,6 +725,7 @@
       }
     }
   };
+
 </script>
 
 <style>
@@ -650,4 +760,5 @@
     font-size: 14px;
     width: 100%
   }
-</style>
\ No newline at end of file
+
+</style>