2024年5月21日 修复教学单元内容的问题

src/router/routes/modules/stuzy/stuzy.ts

@@ -62,6 +62,15 @@ const stuzy: AppRouteModule = {
         title: '通知公告',
       },
     },
+    {
+      path: 'stuJiaoXueDanYuanNeiRong',
+      name: 'stuJiaoXueDanYuanNeiRong',
+      component: () => import('/@/views/zy/jiaoXueDanYuanNeiRong/stuIndex.vue'),
+      meta: {
+        title: '教学单元内容',
+      },
+    },
+
   ]
 }
 

src/views/site/studentWdkc/studentMenu.vue

@@ -11,7 +11,7 @@
                     <template #title>课程介绍</template>
                     <a-menu-item key="1" @click="getGzt('kcjs')">课程介绍</a-menu-item>
                     <a-menu-item key="2" @click="getGzt('tzgg')">通知公告</a-menu-item>
-                    <a-menu-item key="3">教学单元</a-menu-item>
+                    <a-menu-item key="3" @click="getGzt('stuJiaoXueDanYuanNeiRong')">教学单元</a-menu-item>
                   </a-sub-menu>
                   <a-sub-menu key="sub4">
                     <template #title>测验/作业</template>
@@ -65,6 +65,9 @@
       href = "/stuzy/studentMain";
     }else if(zytype=='tzgg'){//通知公告
       href = "/stuzy/StudentGonggaoList";
+    }else if(zytype == 'stuJiaoXueDanYuanNeiRong'){
+      router.push({ name: 'stuJiaoXueDanYuanNeiRong', query: { rwbh,xqxn,type } });
+      return;
     }
 
     router.push({path:href,query: {rwbh,xqxn,type}});

src/views/zy/jiaoXueDanYuanNeiRong/downloadAssembly.vue

@@ -0,0 +1,44 @@
+<template>
+  <div class="ant-upload-list ant-upload-list-text">
+    <div class="ant-upload-list-text-container">
+      <div class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text" v-if="getFilePath()">
+        <div class="ant-upload-list-item-info">
+          <span class="ant-upload-span">
+            <div class="ant-upload-text-icon">
+              <Icon icon="ant-design:paper-clip-outlined"/>
+            </div>
+            <a target="_blank" rel="noopener noreferrer" class="ant-upload-list-item-name" :title="getFileName()" :href="getFilePath()">{{ getFileName() }}</a>
+          </span>
+        </div>
+        <div class="ant-upload-list-item-progress" style="display: none;"></div>
+      </div>
+      <a-empty v-else/>
+    </div>
+  </div>
+
+</template>
+<script lang="ts" name="jiaoXueDanYuanNeiRongIndexDownload" setup>
+  import { getFileAccessHttpUrl } from '/@/utils/common/compUtils'
+  const props = defineProps({
+    filePath: { type: String },
+    fileName: { type: String },
+  });
+
+  function getFileName(){
+    if(props.fileName){
+      return props.fileName;
+    }else{
+      if(!props.filePath) return '';
+      let pathList = props.filePath?.replaceAll('\\','/').split('/');
+      if(pathList.length){
+        return pathList[pathList.length-1] || '';
+      }
+      return '';
+    }
+  }
+
+  function getFilePath(){
+    if(!props.filePath) return null;
+    return getFileAccessHttpUrl(props.filePath);
+  }
+</script>

src/views/zy/jiaoXueDanYuanNeiRong/index2.vue

@@ -3,15 +3,22 @@
 
   <!-- <a-affix :offset-top="0" :target="() => doctomen"> -->
   <div class="topButton">
-    <a-space>
-      <a-button type="primary" @click="save" :loading="saveLoading">保存</a-button>
-      <a-button @click="reload">刷新</a-button>
-      <a-button type="primary" @click="addOne()" class="addBtn" title="新增一级"><Icon icon="ant-design:plus-outlined"/>新增标题</a-button>
+    <a-space v-if="!isPreview">
+      <a-button type="primary" @click="save" :loading="saveLoading" title="保存"><Icon icon="ant-design:save-outlined"/>保存</a-button>
+      <a-button @click="reload"><Icon icon="ant-design:reload-outlined"/>刷新</a-button>
+      <a-button type="primary" @click="addOne()" class="addBtn" title="新增标题"><Icon icon="ant-design:plus-outlined"/>新增标题</a-button>
+      <a-button type="" v-if="!isPreview" @click="() => isPreview = true" class="addBtn" title="预览"><Icon icon="ant-design:fund-view-outlined"/>预览</a-button>
     </a-space>
+    <template v-else>
+      <a-space>
+        <a-button @click="reload"><Icon icon="ant-design:reload-outlined"/>刷新</a-button>
+        <a-button type="" @click="() => isPreview = false" class="addBtn" title="返回"><Icon icon="ant-design:fund-view-outlined"/>返回</a-button>
+      </a-space>
+    </template>
   </div>
   <!-- </a-affix> -->
-
-  <div class="maxDiv">
+  <stuIndex v-show="isPreview" :hiddenBtn="true"/>
+  <div v-show="!isPreview" class="maxDiv">
     <a-empty v-if="!dataSource || !dataSource.length"/>
     <draggable v-bind="draggableBind" v-model="dataSource">
       <template #item="{ element: one }">
@@ -19,7 +26,7 @@
           <!-- 下一层 -->
           <a-card>
             <a-collapse ghost expandIconPosition="right">
-              <a-collapse-panel :key="one._id">
+              <a-collapse-panel :key="one._id" forceRender>
                 <template #header>
                   <div class="topDiv">
                     <div>{{ one.sort }}：</div>
@@ -41,7 +48,7 @@
                       <!-- 下一层 -->
                       <a-card>
                         <a-collapse ghost expandIconPosition="right">
-                          <a-collapse-panel :key="two._id" :showArrow="false">
+                          <a-collapse-panel :key="two._id" :showArrow="false" forceRender>
                             <template #header>
                               <div class="twoTopDiv">
                                 <div class="topDiv">
@@ -55,9 +62,9 @@
                             </template>
                             <template #extra>
                               <a-space>
-                              <a-button type="primary" class="addBtn" title="展开收起"><Icon icon="ant-design:plus-outlined"/>上传资源</a-button>
-                              <a-button type="primary" danger @click="delTwo($event, one, two)" class="addBtn" title="删除此项及以下"><Icon icon="ant-design:delete"/>删除</a-button>
-                            </a-space>
+                                <a-button type="primary" class="addBtn" title="展开收起"><Icon icon="ant-design:plus-outlined"/>上传资源</a-button>
+                                <a-button type="primary" danger @click="delTwo($event, one, two)" class="addBtn" title="删除此项及以下"><Icon icon="ant-design:delete"/>删除</a-button>
+                              </a-space>
                             </template>
                             <div style="padding-top: 1rem;">
                               <a-space>
@@ -95,11 +102,11 @@
                                       <template v-if="three.type == 'video'">
                                         <!-- <j-upload v-model:value="three.filePath" maxCount="1" suffixList="avi,mov,mkv,mpeg,asf,3gp,wmv,mp4,flv,rmvb"/> video/mp4,video/webm,video/ogv-->
                                         <j-upload v-if="three.isEdit" v-model:value="three.filePath" maxCount="1" text="上传视频" accept=".mp4,.webm,.ogv" :forceAcceptVerify="true"/>
-                                        <div v-else class="ainput">&nbsp;{{ three.filePath }}</div>
+                                        <downloadAssembly v-else :filePath="three.filePath"/>
                                       </template>
                                       <template v-if="three.type == 'document'">
                                         <j-upload v-if="three.isEdit" v-model:value="three.filePath" maxCount="1"/>
-                                        <div v-else class="ainput">&nbsp;{{ three.filePath }}</div>
+                                        <downloadAssembly v-else :filePath="three.filePath"/>
                                       </template>
                                       <template v-if="three.type == 'richText'">
                                         <j-editor v-if="three.isEdit" v-model:value="three.richText"/>
@@ -148,6 +155,8 @@
   import draggable from 'vuedraggable';
   import JUpload from '/@/components/Form/src/jeecg/components/JUpload/JUpload.vue';
   import JEditor from '/@/components/Form/src/jeecg/components/JEditor.vue';
+  import downloadAssembly from '/@/views/zy/jiaoXueDanYuanNeiRong/downloadAssembly.vue';
+  import stuIndex from './stuIndex.vue';
 
   //当前路由信息
   const { currentRoute } = useRouter();
@@ -160,6 +169,7 @@
 
   const isNotMove = ref<boolean>(true);
   const saveLoading = ref<boolean>(false);
+  const isPreview = ref<boolean>(false);
 
   //公共的拖动排序组件绑定数据
   const draggableBind = ref<Object>({
@@ -199,16 +209,30 @@
     loadData();
   }
 
-  function loadData() {
+  async function loadData() {
     dataSource.value = [];
     let params = {
       rwbh,
       xqxn,
     }
-    listAll(params).then(res => {
+    await listAll(params).then(res => {
       dataRecursion(res, (x) => x._id = x.id);
       dataSource.value = res;
     });
+    nextTick(() => {
+      // setTimeout(() => {
+        expandAllTable();
+        // nextTick(() => {
+        //   expandAllTable();
+        // });
+      // }, 1000);
+    });
+  }
+
+  function expandAllTable() {
+    document.querySelectorAll('.max .ant-collapse-header').forEach(x => {
+      if(x.getAttribute('aria-expanded') == 'false') x.click()
+    });
   }
 
   //递归执行方法

src/views/zy/jiaoXueDanYuanNeiRong/stuIndex.vue

@@ -0,0 +1,509 @@
+<template>
+  <div class="max">
+
+  <!-- <a-affix :offset-top="0" :target="() => doctomen"> -->
+  <div class="topButton" v-if="!props.hiddenBtn">
+    <a-space>
+      <!-- <a-button type="primary" @click="save" :loading="saveLoading">保存</a-button> -->
+      <a-button @click="reload"><Icon icon="ant-design:reload-outlined"/>刷新</a-button>
+      <!-- <a-button type="primary" @click="addOne()" class="addBtn" title="新增一级"><Icon icon="ant-design:plus-outlined"/>新增标题</a-button> -->
+    </a-space>
+  </div>
+  <!-- </a-affix> -->
+
+  <div class="maxDiv">
+    <a-empty v-if="!dataSource || !dataSource.length"/>
+    <div v-for="(one, oneIndex) in dataSource" :key="oneIndex">
+      <div class="box">
+        <!-- 下一层 -->
+        <a-card>
+          <a-collapse ghost expandIconPosition="right">
+            <a-collapse-panel :key="one._id" forceRender>
+              <template #header>
+                <div class="topDiv">
+                  <div>{{ one.sort }}：</div>
+                  <div class="inputd">
+                    <div class="ainput ainputNoEdit" @click="(e) => { stop(e); }">&nbsp;{{ one.title }}</div>
+                  </div>
+                </div>
+              </template>
+              <!-- <template #extra>
+                <a-space>
+                  <div><a-button type="primary" @click="addTwo($event, one)" class="twoBtn addBtn" title="新增二级"><Icon icon="ant-design:plus-outlined"/>新增章节</a-button></div>
+                  <div><a-button type="primary" danger @click="delOne($event, one)" class="addBtn" title="删除此项及以下"><Icon icon="ant-design:delete"/>删除</a-button></div>
+                </a-space>
+              </template> -->
+              <div v-for="(two, twoIndex) in one.childrenList" :key="twoIndex">
+                <div class="box">
+                  <!-- 下一层 -->
+                  <a-card>
+                    <a-collapse ghost expandIconPosition="right">
+                      <a-collapse-panel :key="two._id" forceRender>
+                        <template #header>
+                          <div class="twoTopDiv">
+                            <div class="topDiv">
+                              <div>{{ one.sort }}.{{ two.sort }}：</div>
+                              <div class="twoInputd">
+                                <!-- <a-input v-if="two.isEdit" :value="two.title" @change="changeInput($event, two, 'title')" @blur="() => { two.isEdit = false }" @click="stop" class="ainput"/> -->
+                                <div class="ainput ainputNoEdit" @click="(e) => { stop(e); }" >&nbsp;{{ two.title }}</div>
+                              </div>
+                            </div>
+                          </div>
+                        </template>
+                        <!-- <template #extra>
+                          <a-space>
+                            <a-button type="primary" class="addBtn" title="展开收起"><Icon icon="ant-design:plus-outlined"/>上传资源</a-button>
+                            <a-button type="primary" danger @click="delTwo($event, one, two)" class="addBtn" title="删除此项及以下"><Icon icon="ant-design:delete"/>删除</a-button>
+                          </a-space>
+                        </template> -->
+                        <!-- <div style="padding-top: 1rem;">
+                          <a-space>
+                            <div><a-button type="primary" @click="addThree($event, two, 'video')" class="addBtn"><Icon icon="ant-design:video-camera-outlined"/>视频</a-button></div>
+                            <div><a-button type="primary" @click="addThree($event, two, 'document')" class="addBtn"><Icon icon="ant-design:file-outlined"/>文档</a-button></div>
+                            <div><a-button type="primary" @click="addThree($event, two, 'richText')" class="addBtn"><Icon icon="ant-design:file-text-outlined"/>富文本</a-button></div>
+                          </a-space>
+                        </div> -->
+                        <div v-for="(three, threeIndex) in two.childrenList" :key="threeIndex">
+                          <div class="box">
+                            <a-card>
+                              <template #title>
+                                {{ one.sort }}.{{ two.sort }}.{{ three.sort }}
+                                <template v-if="three.type == 'video'">
+                                  <Icon icon="ant-design:video-camera-outlined" />视频
+                                </template>
+                                <template v-else-if="three.type == 'document'">
+                                  <Icon icon="ant-design:file-outlined" />文档
+                                </template>
+                                <template v-else-if="three.type == 'richText'">
+                                  <Icon icon="ant-design:file-text-outlined" />富文本
+                                </template>
+                              </template>
+                              <!-- <template #extra>
+                                <a-space>
+                                  <a-button type="primary" v-if="three.isEdit" @click="() => three.isEdit = false" class="addBtn"><Icon icon="ant-design:edit"/>确认</a-button>
+                                  <a-button type="primary" v-if="!three.isEdit" @click="() => three.isEdit = true" class="addBtn"><Icon icon="ant-design:edit"/>编辑</a-button>
+                                <a-button type="primary" danger @click="delThree($event, two, three)" class="addBtn"><Icon icon="ant-design:delete"/>删除</a-button>
+                              </a-space>
+                              </template> -->
+                              <div class="topDiv">
+                                <template v-if="three.type == 'video'">
+                                  <!-- <j-upload v-model:value="three.filePath" maxCount="1" suffixList="avi,mov,mkv,mpeg,asf,3gp,wmv,mp4,flv,rmvb"/> video/mp4,video/webm,video/ogv-->
+                                  <!-- <j-upload v-if="three.isEdit" v-model:value="three.filePath" maxCount="1" text="上传视频" accept=".mp4,.webm,.ogv" :forceAcceptVerify="true"/> -->
+                                  <!-- <div class="ainput">&nbsp;{{ getFileAccessHttpUrl(three.filePath) }}</div> -->
+                                  <!-- <downloadAssembly :filePath="three.filePath"/> -->
+                                  <downloadAssembly :filePath="three.filePath"/>
+                                </template>
+                                <template v-if="three.type == 'document'">
+                                  <!-- <j-upload v-if="three.isEdit" v-model:value="three.filePath" maxCount="1"/> -->
+                                  <downloadAssembly :filePath="three.filePath"/>
+                                </template>
+                                <template v-if="three.type == 'richText'">
+                                  <!-- <j-editor v-if="three.isEdit" v-model:value="three.richText"/> -->
+                                  <div class="richText" v-html="three.richText"></div>
+                                </template>
+                                <!-- <template v-if="three.type == 'classroomTest'">
+                                  随堂测试
+                                </template>
+                                <template v-if="three.type == 'discuss'">
+                                  讨论
+                                </template> -->
+                              </div>
+                            </a-card>
+                          </div>
+                        </div>
+                      </a-collapse-panel>
+                    </a-collapse>
+                  </a-card>
+                </div>
+              </div>
+            </a-collapse-panel>
+          </a-collapse>
+        </a-card>
+      </div>
+      <!-- <template #footer> -->
+        <!-- <a-button @click="sureChange" type="primary" style="margin-top: 100px">确定</a-button> -->
+      <!-- </template> -->
+      </div>
+  </div>
+</div>
+
+
+</template>
+
+<script lang="ts" name="jiaoXueDanYuanNeiRongIndex" setup>
+  import { ref, reactive, onMounted, unref, nextTick, watch } from 'vue';
+  import { Input, Popover, Pagination, Empty, Affix as aAffix } from 'ant-design-vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { useMessage } from "/@/hooks/web/useMessage";
+  import { useRouter } from 'vue-router';
+  import { randomString, simpleDebounce } from '/@/utils/common/compUtils'
+
+  import draggable from 'vuedraggable';
+  import JUpload from '/@/components/Form/src/jeecg/components/JUpload/JUpload.vue';
+  import JEditor from '/@/components/Form/src/jeecg/components/JEditor.vue';
+  import downloadAssembly from '/@/views/zy/jiaoXueDanYuanNeiRong/downloadAssembly.vue';
+
+  //当前路由信息
+  const { currentRoute } = useRouter();
+  const { query } = unref(currentRoute);
+  const { rwbh, xqxn, type } = query;//获取传递参数
+
+
+  const props = defineProps({
+    hiddenBtn: { type: Boolean, default: false },
+  });
+
+  // watch(() => props.hiddenBtn, () => {
+    // reload();
+  // });
+
+
+
+  const { createConfirm, createMessage } = useMessage();
+  const queryParam = ref<any>({});
+  const dataSource = ref<any>([]);
+
+  const isNotMove = ref<boolean>(true);
+  const saveLoading = ref<boolean>(false);
+
+  //公共的拖动排序组件绑定数据
+  const draggableBind = ref<Object>({
+    sort: false,
+    //唯一键
+    itemKey: '_id',
+    // onStart: moveDraggable,
+    // onAdd: onAddFn,
+    // onRemove: onRemoveFn,
+    // onUpdate: onUpdateFn,
+    //有效移动后触发
+    onEnd: endDraggable,
+    //鼠标按下触发
+    // onChoose: simpleDebounce(chooseDraggable, 500),
+    // onChoose: chooseDraggable,
+    //鼠标松开后触发
+    // onUnchoose: unchooseDraggable,
+    // onSort: onSortFn,
+    // onFilter: onFilterFn,
+    // onClone: onCloneFn,
+    // onMove: onMoveFn,
+  });
+
+  enum Api {
+  list = '/teachingunitcontent/kcTeachingUnitContentOne/allList',
+  edit = '/teachingunitcontent/kcTeachingUnitContentOne/edit',
+}
+
+  /**
+   * 列表接口
+   * @param params
+   */
+  const listAll = (params) => defHttp.get({ url: Api.list, params });
+  const editAll = (params) => defHttp.post({ url: Api.edit, params }, { isTransformResponse: true });
+
+
+  function reload() {
+    loadData();
+  }
+
+  async function loadData() {
+    dataSource.value = [];
+    let params = {
+      rwbh,
+      xqxn,
+    }
+    await listAll(params).then(res => {
+      dataRecursion(res, (x) => x._id = x.id);
+      dataSource.value = res;
+    });
+    nextTick(() => {
+      // setTimeout(() => {
+        expandAllTable();
+        // nextTick(() => {
+        //   expandAllTable();
+        // });
+      // }, 1000);
+    });
+  }
+
+  function expandAllTable() {
+    document.querySelectorAll('.max .ant-collapse-header').forEach(x => {
+      if(x.getAttribute('aria-expanded') == 'false') x.click()
+    });
+  }
+
+  //递归执行方法
+  function dataRecursion(list, fn){
+    let _list = list;
+    _list.forEach((x,i) => {
+      fn(x,i);
+      if(x.childrenList && x.childrenList.length){
+        dataRecursion(x.childrenList, fn);
+      }
+    })
+  }
+
+  //刷新数据的排序
+  function refreshDataSort(){
+    dataRecursion(dataSource.value, (x, i) => x.sort = i+1);
+  }
+
+  //创建新的节点
+  function createNoneData(){
+    let data = {
+      //临时ID，兼容新增和修改
+      _id: randomString(32),
+      title: null,
+      sort: 0,
+      childrenList: [],
+    }
+    return data;
+  }
+
+  function stop(e) {
+    e?.stopPropagation();
+  }
+
+  function changeInput(e, pdata, key) {
+    let { target } = e;
+    let { value } = target;
+    pdata[key] = value;
+  }
+
+  function addOne(){
+    dataSource.value.push(createNoneData());
+    createMessage.success('添加标题成功！');
+    nextTick(() => {
+      refreshDataSort();
+    })
+  }
+
+  function delOne(e, one){
+    stop(e);
+    let index = dataSource.value.findIndex(x => x == one);
+    if(index == -1) return;
+    dataSource.value.splice(index, 1);
+    createMessage.success('删除标题成功！');
+    nextTick(() => {
+      refreshDataSort();
+    })
+  }
+
+  // function insertOne(index){
+  //   dataSource.value.splice(index,0, createNoneData());
+  // }
+
+  //获取祖宗级对象
+  function getBtnEle(e, className){
+    if(e){
+      //如果一级就是，直接甩出去
+      if(e?.classList?.contains(className)){
+        return e;
+      } else {
+        //如果父节点也没有，往更父的节点查找
+        return getBtnEle(e.parentElement, className);
+      }
+      // //如果父节点也没有，往更深的
+      // if(!e.parentElement.classList.contains(className)){
+      //   //不存在
+      //   console.log('111111',e.parentElement);
+      // }else{
+      //   console.log('2222',e.parentElement);
+      //   return e.parentElement;
+      // }
+    }
+  }
+
+  function addTwo(e, one){
+    let btn = getBtnEle(e.target, 'twoBtn');
+    if(btn == null){
+      console.error('出大事了！');
+      return;
+    }
+
+    let tab = null;
+    document.querySelectorAll('.maxDiv .box .ant-collapse-header').forEach(x => {
+      let twoBtn = x.querySelector('.twoBtn');
+      if(twoBtn == btn){
+        tab = x;
+      }
+    });
+    let ariaExpanded = tab.getAttribute('aria-expanded');
+
+    if(ariaExpanded == 'false') {
+    }else{
+      stop(e);
+    }
+    if(one.childrenList){
+      one.childrenList.push(createNoneData());
+    }else{
+      one.childrenList = [ createNoneData() ];
+    }
+
+    createMessage.success('添加章节成功！');
+    nextTick(() => {
+      refreshDataSort();
+    })
+  }
+
+  function delTwo(e, one, two){
+    stop(e);
+    let index = one.childrenList.findIndex(x => x == two);
+    if(index == -1) return;
+    one.childrenList.splice(index, 1);
+    createMessage.success('删除章节成功！');
+    nextTick(() => {
+      refreshDataSort();
+    })
+  }
+
+  // function insertTwo(one, index){
+  //   one.childrenList.splice(index,0, createNoneData());
+  // }
+
+  function addThree(e, two, type){
+    stop(e);
+    let data = createNoneData();
+    delete data.title;
+    data.type = type;
+    data.richText = null;
+    data.filePath = null;
+    if(two.childrenList){
+      two.childrenList.push(data);
+    }else{
+      two.childrenList = [ data ];
+    }
+    createMessage.success('新增成功！');
+    nextTick(() => {
+      refreshDataSort();
+    })
+  }
+
+  function delThree(e, two, three){
+    stop(e);
+    let index = two.childrenList.findIndex(x => x == three);
+    if(index == -1) return;
+    two.childrenList.splice(index, 1);
+
+    createMessage.success('删除成功！');
+    nextTick(() => {
+      refreshDataSort();
+    })
+  }
+
+
+  //移动结束时触发，如果未移动则不触发，刷新排序,
+  function endDraggable(){
+    //移动后如果有富文本编辑器则会失效，需要此法重置一下
+    isNotMove.value = false;
+    nextTick(() => {
+      isNotMove.value = true;
+      refreshDataSort();
+    })
+  }
+
+  //按下鼠标按键后触发
+  // function chooseDraggable(){
+  //   // isNotMove.value = false;
+  // }
+
+  //松开鼠标按键后触发
+  // function unchooseDraggable(){
+  //   // isNotMove.value = true;
+  // }
+
+  // function onAddFn() { console.log('onAddFn'); }
+  // function onRemoveFn() { console.log('onRemoveFn'); }
+  // function onUpdateFn() { console.log('onUpdateFn'); }
+  // function onChooseFn() { console.log('onChooseFn'); }
+  // function onUnchooseFn() { console.log('onUnchooseFn'); }
+  // function onSortFn() { console.log('onSortFn'); }
+  // function onFilterFn() { console.log('onFilterFn'); }
+  // function onCloneFn() { console.log('onCloneFn'); }
+  // function onMoveFn() { console.log('onMoveFn'); }
+
+  // //移动时触发，关闭富文本编辑器
+  // function moveDraggable() {
+  //   console.log('move');
+  //   isNotMove.value = false;
+  // }
+
+  async function save(){
+    saveLoading.value = true;
+    console.log(unref(dataSource));
+    let saveData = {
+      rwbh,
+      xqxn,
+      teachingUnitContentOneList: unref(dataSource),
+    }
+    if(!saveData.rwbh || !saveData.xqxn){
+      createMessage.error('无法保存！');
+      saveLoading.value = false;
+      return;
+    }else if(!saveData.teachingUnitContentOneList || !saveData.teachingUnitContentOneList.length){
+      createMessage.warn('请添加数据！');
+      saveLoading.value = false;
+      return;
+    }
+    await editAll(saveData);
+    saveLoading.value = false;
+  }
+
+  loadData();
+</script>
+
+<style lang="less" scoped>
+.max {
+  height: calc(-142px + 100vh);
+  min-height: calc(-142px + 100vh);
+  max-height: calc(-142px + 100vh);
+  overflow: hidden;
+  .maxDiv {
+    height: calc(-170px + 100vh);
+    overflow-y: auto;
+  }
+}
+
+.box {
+  margin: .5rem 0 0 0;
+  .itemTop {
+    width: 100%;
+  }
+}
+
+.topButton {
+  padding-top: 10px;
+}
+
+.ainput {
+  width: 100%;
+}
+.ainputNoEdit {
+  border: #d9d9d9 solid 1px;
+}
+
+.inputd {
+  width: calc(100% - 35px);
+}
+.topDiv {
+  width: 100%;
+  display: flex;
+  flex-wrap: nowrap;
+  justify-content: flex-start;
+  align-items: center;
+}
+.twoInputd {
+  width: calc(100% - 45px);
+}
+.twoTopDiv {
+  width: 100%;
+}
+
+.richText {
+  max-height: 400px;
+  overflow: auto;
+}
+
+:deep(.maxDiv) .ant-collapse-header{
+  align-items: center;
+}
+</style>