2024年5月25日 修复问题

src/views/kc/detection/KcDetectionMain.data.ts

@@ -12,21 +12,26 @@ export const columns: BasicColumn[] = [
     align: "center",
     dataIndex: 'xnxq'
   },
-  {
-    title: '授课日期',
-    align: "center",
-    dataIndex: 'createTime'
-  },
   {
     title: '课程名称',
     align: "center",
     dataIndex: 'kcmc'
   },
   {
-    title: '节次',
+    title: '授课日期',
+    align: "center",
+    dataIndex: ['ketangbiaoInfo', 'skrq']
+  },
+  {
+    title: '授课节次',
     align: "center",
     dataIndex: ['ketangbiaoInfo', 'hh']
   },
+  {
+    title: '选课人数',
+    align: "center",
+    dataIndex: ['ketangbiaoInfo', 'xkrs'],
+  },
 
   // {
   //   title: '任务编号',
@@ -49,25 +54,20 @@ export const columns: BasicColumn[] = [
   //   dataIndex: 'detectionUrl'
   // },
   {
-    title: '检测次数',
+    title: '抓取次数',
     align: "center",
     dataIndex: 'detectionNum'
   },
   {
-    title: '人数(累加)',
+    title: '累计抓取人数',
     align: "center",
     dataIndex: 'allNum'
   },
   {
-    title: '平均数',
+    title: '平均抓取人数',
     align: "center",
     dataIndex: 'averageNum',
   },
-  {
-    title: '选课人数',
-    align: "center",
-    dataIndex: ['ketangbiaoInfo', 'xkrs'],
-  },
   {
     title: '出勤率',
     align: "center",
@@ -108,18 +108,22 @@ export const formSchema: FormSchema[] = [
     field: 'xnxq',
     component: 'Input',
   },
-  {
-    label: '授课日期',
-    field: 'createTime',
-    component: 'Input',
-  },
   {
     label: '课程名称',
     field: 'kcmc',
     component: 'Input',
   },
   {
-    label: '节次',
+    label: '授课日期',
+    field: 'createTime',
+    component: 'Input',
+    render: ({ values }) => {
+      let text = values?.ketangbiaoInfo?.skrq;
+      return h(Input, { value: text, disabled: true });
+    }
+  },
+  {
+    label: '授课节次',
     field: 'ketangbiaoInfo',
     component: 'Input',
     render: ({ values }) => {
@@ -152,17 +156,17 @@ export const formSchema: FormSchema[] = [
     show: false,
   },
   {
-    label: '检测次数',
+    label: '抓取次数',
     field: 'detectionNum',
     component: 'InputNumber',
   },
   {
-    label: '人数(累加)',
+    label: '累计抓取人数',
     field: 'allNum',
     component: 'InputNumber',
   },
   {
-    label: '平均数',
+    label: '平均抓取人数',
     field: 'averageNum',
     component: 'InputNumber',
   },
@@ -257,26 +261,52 @@ export const detectionDetailedListColumns: BasicColumn[] = [
   //   dataIndex: 'jsbh'
   // },
   {
-    title: '检测序号',
+    title: '序号',
     align: "center",
-    dataIndex: 'detectionNum'
+    dataIndex: 'detectionNum',
+    customRender: ({ index }) => {
+      return index+1;
+    },
+  },
+  // {
+  //   title: '序号',
+  //   align: "center",
+  //   dataIndex: 'detectionNum',
+  // },
+  {
+    title: '授课地点',
+    align: "center",
+    dataIndex: 'none1',
+    slots: { customRender: 'skkd' },
   },
   {
-    title: '截取图片',
+    title: '抓取图片',
     align: "center",
     dataIndex: 'detectionOutImgUrl',
     slots: { customRender: 'imgSlot' },
   },
   {
-    title: '检测时间',
+    title: '抓取时间',
     align: "center",
     dataIndex: 'createTime'
   },
   {
-    title: '人数',
+    title: '选课人数',
+    align: "center",
+    dataIndex: 'none2',
+    slots: { customRender: 'xkrs' },
+  },
+  {
+    title: 'AI识别人数',
     align: "center",
     dataIndex: 'num'
   },
+  {
+    title: '到课识别率',
+    align: "center",
+    dataIndex: 'none3',
+    slots: { customRender: 'dksbl' },
+  },
   // {
   //   title: '人数计算结果',
   //   align: "center",

src/views/kc/detection/components/KcDetectionMainModal.vue

@@ -8,6 +8,9 @@
               <span v-if="!text" style="font-size: 12px; font-style: italic">无图片</span>
               <Image v-else :src="getImgView(text)" :preview="record.id" alt="" :width="100"/>
             </template>
+            <template #skkd>{{ getFieldsValue('ketangbiaoInfo')?.ketangbiaoInfo?.skdd }}</template>
+            <template #xkrs>{{ getFieldsValue('ketangbiaoInfo')?.ketangbiaoInfo?.xkrs }}</template>
+            <template #dksbl="{ record }">{{ calcAverageNum(record) }}</template>
           </a-table>
         </div>
       </template>
@@ -27,7 +30,7 @@ import { saveOrUpdate } from '../KcDetectionMain.api';
 const emit = defineEmits(['register', 'success']);
 const isUpdate = ref(true);
 //表单配置
-const [registerForm, { setProps, resetFields, setFieldsValue, validate }] = useForm({
+const [registerForm, { setProps, getFieldsValue, resetFields, setFieldsValue, validate }] = useForm({
   //labelWidth: 150,
   schemas: formSchema,
   showActionButtonGroup: false,
@@ -49,7 +52,7 @@ const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data
   setProps({ disabled: !data?.showFooter })
 });
 //设置标题
-const title = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));
+const title = computed(() => '查看');
 //表单提交事件
 async function handleSubmit(v) {
   try {
@@ -66,6 +69,22 @@ async function handleSubmit(v) {
   }
 }
 
+function calcAverageNum(record){
+  let xkrs = getFieldsValue('ketangbiaoInfo')?.ketangbiaoInfo?.xkrs;
+  let { num: averageNum } = record;
+  let xkrsNum = Number(xkrs);
+  if(!isNaN(xkrsNum) && xkrsNum != 0 && averageNum != 0) {
+    let num = averageNum / xkrsNum * 100;
+    return num.toFixed(2) + '%';
+  }else{
+    if(averageNum == 0){
+      return '0.00' + '%';
+    }else{
+      return '';
+    }
+  }
+}
+
 /**
  * 获取预览图片
  */

src/views/kc/detection/zyZhjsList.vue

@@ -1,10 +1,40 @@
 <template>
   <div style="margin-top: 10px;">
+    <div class="jeecg-basic-table-form-container">
+      <a-form @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
+          <a-row :gutter="24">
+            <a-col :lg="8">
+              <a-form-item label="课程名称">
+                <j-input placeholder="请输入课程名称" v-model:value="queryParam.kcmc"></j-input>
+              </a-form-item>
+            </a-col>
+            <a-col :lg="8">
+              <a-form-item label="授课日期">
+                <a-date-picker :showTime="false" valueFormat="YYYY-MM-DD" :placeholder="'请选择授课日期'" style="width:100%;" v-model:value="queryParam.searchSkrq"></a-date-picker>
+              </a-form-item>
+            </a-col>
+            <a-col :lg="8">
+              <a-form-item label="授课节次">
+                <j-dict-select-tag placeholder="请选择授课节次" v-model:value="queryParam.searchHh" dictCode="skjc"/>
+              </a-form-item>
+            </a-col>
+            <a-col :xl="6" :lg="7" :md="8" :sm="24">
+              <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
+                <a-col :lg="6">
+                  <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
+                  <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset" style="margin-left: 8px">重置</a-button>
+                </a-col>
+              </span>
+            </a-col>
+          </a-row>
+        </a-form>
+    </div>
+
     <!--引用表格-->
     <BasicTable @register="registerTable">
       <!--插槽:table标题-->
       <template #tableTitle>
-      <span style="font-size: 16px;font-weight: bold;">检测情况查询</span>
+      <!-- <span style="font-size: 16px;font-weight: bold;">检测情况查询</span> -->
       </template>
       <!--操作栏-->
       <template #action="{ record }">
@@ -29,7 +59,7 @@
 </template>
 
 <script lang="ts" name="detection-kcDetectionMain" setup>
-import { ref, computed, unref } from 'vue';
+import { ref, reactive, computed, unref } from 'vue';
 import { BasicTable, useTable, TableAction } from '/@/components/Table';
 import { useModal } from '/@/components/Modal';
 import { useListPage } from '/@/hooks/system/useListPage'
@@ -37,12 +67,24 @@ import KcDetectionMainModal from './components/KcDetectionMainModal.vue'
 import { columns, searchFormSchema } from './KcDetectionMain.data';
 import { list, deleteOne, batchDelete, getImportUrl, getExportUrl } from './KcDetectionMain.api';
 import { downloadFile } from '/@/utils/common/renderUtils';
-  import { useRouter } from 'vue-router';
+import { JDictSelectTag, JInput } from '/@/components/Form';
-  const { currentRoute } = useRouter();
+import { useRouter } from 'vue-router';
-  const { query } = unref(currentRoute);
+const { currentRoute } = useRouter();
-  const { rwbh,xqxn } = query;//获取传递参数
+const { query } = unref(currentRoute);
+const { rwbh,xqxn } = query;//获取传递参数
 const checkedKeys = ref<Array<string | number>>([]);
-const queryParam = ref<any>({rwbh});
+const queryParam = ref<any>({ rwbh });
+
+const labelCol = reactive({
+  xs: { span: 24 },
+  sm: { span: 6 },
+});
+const wrapperCol = reactive({
+  xs: { span: 24 },
+  sm: { span: 18 },
+});
+
+
 //注册model
 const [registerModal, { openModal }] = useModal();
 //注册table数据
@@ -85,6 +127,26 @@ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
 
 const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext
 
+/**
+ * 查询
+ */
+  function searchQuery() {
+  reload();
+}
+
+/**
+ * 重置
+ */
+function searchReset() {
+  queryParam.value = {
+    rwbh
+  };
+  selectedRowKeys.value = [];
+  //刷新数据
+  reload();
+}
+
+
 /**
  * 新增事件
  */
@@ -169,4 +231,13 @@ function getDropDownAction(record) {
 
 </script>
 
-<style scoped></style>
+<style scoped>
+.jeecg-basic-table-form-container {
+  padding: 0;
+}
+.table-page-search-submitButtons {
+  display: block;
+  margin-bottom: 24px;
+  white-space: nowrap;
+}
+</style>

src/views/zy/jiaoXueDanYuanNeiRong/index2.vue

@@ -6,7 +6,7 @@
         <div style="font-size: 14px;color: #858588;margin-top: 10px;width:100%;padding: 10px 0 0 10px;">提示：每一个小的章节，都可以上传章节相关的教学资源</div>
         <div class="topButton">
           <a-space v-if="!isPreview">
-            <a-button type="primary" @click="save" :loading="saveLoading" title="保存"><Icon icon="ant-design:save-outlined"/>保存</a-button>
+            <!-- <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>
@@ -35,7 +35,7 @@
                     <Icon icon="ant-design:holder-outlined"/>
                     <div>{{ one.sort }}：</div>
                     <div class="inputd">
-                      <a-input v-if="one.isEdit" :value="one.title" @change="changeInput($event, one, 'title')" @blur="() => { one.isEdit = false }" @click="stop" class="ainput"/>
+                      <a-input v-if="one.isEdit" :value="one.title" @change="changeInput($event, one, 'title')" @blur="() => { one.isEdit = false; editOne(one) }" @click="stop" class="ainput"/>
                       <div v-else class="ainput ainputNoEdit" @click="(e) => { stop(e);one.isEdit = true }" >&nbsp;{{ one.title }}</div>
                     </div>
                   </div>
@@ -61,7 +61,7 @@
                                   <Icon icon="ant-design:holder-outlined"/>
                                   <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"/>
+                                    <a-input v-if="two.isEdit" :value="two.title" @change="changeInput($event, two, 'title')" @blur="() => { two.isEdit = false; editTwo(two) }" @click="stop" class="ainput"/>
                                     <div v-else class="ainput ainputNoEdit" @click="(e) => { stop(e);two.isEdit = true }" >&nbsp;{{ two.title }}</div>
                                   </div>
                                 </div>
@@ -75,7 +75,7 @@
                                 </a-space>
                               </span>
                             </template>
-                            <div style="padding-top: 1rem;">
+                            <div style="padding-top: 1rem;padding-bottom: 1rem;">
                               <a-space>
                                 <div><a-button type="primary" size="small" @click="addThree($event, two, 'video')" class="addBtn"><Icon icon="ant-design:video-camera-outlined"/>视频</a-button></div>
                                 <div><a-button type="primary" size="small" @click="addThree($event, two, 'document')" class="addBtn"><Icon icon="ant-design:file-outlined"/>文档</a-button></div>
@@ -97,76 +97,12 @@
                                   <span class="hand" @click="viewThreePage(three)">{{ three.title }}</span>
                                   <span v-show="three.showBtn">
                                     <a-space>
-                                      <a-button type="primary" size="small" title="预览" @click="viewThreePage(three)" class="addBtn"><Icon icon="ant-design:fund-view-outlined"/></a-button>
+                                      <a-button type="primary" size="small" title="下载" v-if="three.type == 'video' || three.type == 'document'" @click="downloadFile(three)" class="addBtn"><Icon icon="ant-design:vertical-align-bottom-outlined"/></a-button>
+                                      <a-button type="primary" size="small" title="查看" @click="viewThreePage(three)" class="addBtn"><Icon icon="ant-design:fund-view-outlined"/></a-button>
                                       <a-button type="primary" size="small" title="编辑" @click="editThreePage(two, Object.assign({},three), threeIndex)" class="addBtn"><Icon icon="ant-design:edit"/></a-button>
                                       <a-button type="primary" size="small" title="删除" danger @click="delThree($event, two, three)" class="addBtn"><Icon icon="ant-design:delete"/></a-button>
                                     </a-space>
                                   </span>
-
-
-                                  <a-card v-if="false">
-                                    <template #title>
-                                      <div>
-                                        <Icon icon="ant-design:holder-outlined"/>
-                                        {{ one.sort }}.{{ two.sort }}.{{ three.sort }}
-                                        <template v-if="three.type == 'video'">
-                                          <a-tag>
-                                            <Icon icon="ant-design:video-camera-outlined" />视频
-                                          </a-tag>
-                                        </template>
-                                        <template v-else-if="three.type == 'document'">
-                                          <a-tag>
-                                            <Icon icon="ant-design:file-outlined" />文档
-                                          </a-tag>
-                                        </template>
-                                        <template v-else-if="three.type == 'richText'">
-                                          <a-tag>
-                                            <Icon icon="ant-design:file-text-outlined" />富文本
-                                          </a-tag>
-                                        </template>
-                                      </div>
-                                      <div>
-                                        <a-input v-if="three.isEdit" :value="three.title" @change="changeInput($event, three, 'title')" @click="stop" class="ainput"/>
-                                        <div v-else class="ainput ainputNoEdit">&nbsp;{{ three.title }}</div>
-                                      </div>
-                                    </template>
-                                    <template #extra>
-                                      <span v-show="three.showBtn">
-                                        <a-space>
-                                          <a-button type="primary" size="small" v-if="three.isEdit" @click="() => three.isEdit = false" class="addBtn"><Icon icon="ant-design:form-outlined"/></a-button>
-                                          <a-button type="primary" size="small" v-if="!three.isEdit" @click="() => three.isEdit = true" class="addBtn"><Icon icon="ant-design:edit"/></a-button>
-                                          <a-button type="primary" size="small" danger @click="delThree($event, two, three)" class="addBtn"><Icon icon="ant-design:delete"/></a-button>
-                                        </a-space>
-                                      </span>
-                                    </template>
-                                    <div class="threeDiv">
-                                      <div>
-                                        <!-- <a-input v-if="three.isEdit" :value="three.title" @change="changeInput($event, three, 'title')" @click="stop" class="ainput"/>
-                                        <div v-else class="ainput ainputNoEdit">&nbsp;{{ three.title }}</div> -->
-                                      </div>
-                                      <div>
-                                        <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"/>
-                                          <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"/>
-                                          <downloadAssembly v-else :filePath="three.filePath"/>
-                                        </template>
-                                        <template v-if="three.type == 'richText'">
-                                          <j-editor v-if="three.isEdit" v-model:value="three.richText"/>
-                                          <div v-else class="richText" v-html="three.richText"></div>
-                                        </template>
-                                        <!-- <template v-if="three.type == 'classroomTest'">
-                                          随堂测试
-                                        </template>
-                                        <template v-if="three.type == 'discuss'">
-                                          讨论
-                                        </template> -->
-                                      </div>
-                                    </div>
-                                  </a-card>
                                 </div>
                               </template>
                             </draggable>
@@ -220,7 +156,7 @@
   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 { randomString, simpleDebounce, getFileAccessHttpUrl } from '/@/utils/common/compUtils'
 
   import draggable from 'vuedraggable';
   import JUpload from '/@/components/Form/src/jeecg/components/JUpload/JUpload.vue';
@@ -270,16 +206,41 @@
   });
 
   enum Api {
-  list = '/teachingunitcontent/kcTeachingUnitContentOne/allList',
+    list = '/teachingunitcontent/kcTeachingUnitContentOne/allList',
-  edit = '/teachingunitcontent/kcTeachingUnitContentOne/edit',
+    editAll = '/teachingunitcontent/kcTeachingUnitContentOne/editAll',
-}
+
+    addOne = '/teachingunitcontent/kcTeachingUnitContentOne/add',
+    editOne = '/teachingunitcontent/kcTeachingUnitContentOne/edit',
+    delOne = '/teachingunitcontent/kcTeachingUnitContentOne/delete',
+
+    addTwo = '/teachingunitcontent/kcTeachingUnitContentTwo/add',
+    editTwo = '/teachingunitcontent/kcTeachingUnitContentTwo/edit',
+    delTwo = '/teachingunitcontent/kcTeachingUnitContentTwo/delete',
+
+    addThree = '/teachingunitcontent/kcTeachingUnitContentThree/add',
+    editThree = '/teachingunitcontent/kcTeachingUnitContentThree/edit',
+    delThree = '/teachingunitcontent/kcTeachingUnitContentThree/delete',
+
+  }
 
   /**
    * 列表接口
    * @param params
    */
   const listAll = (params) => defHttp.get({ url: Api.list, params });
-  const editAll = (params) => defHttp.post({ url: Api.edit, params }, { isTransformResponse: true });
+  const editAll = (params) => defHttp.post({ url: Api.editAll, params }, { isTransformResponse: true });
+
+  const addOneFetch = (params) => defHttp.post({ url: Api.addOne, params }, { isTransformResponse: false });
+  const editOneFetch = (params) => defHttp.put({ url: Api.editOne, params }, { isTransformResponse: false });
+  const delOneFetch = (params) => defHttp.delete({ url: Api.delOne, params }, { isTransformResponse: false, joinParamsToUrl: true });
+
+  const addTwoFetch = (params) => defHttp.post({ url: Api.addTwo, params }, { isTransformResponse: false });
+  const editTwoFetch = (params) => defHttp.put({ url: Api.editTwo, params }, { isTransformResponse: false });
+  const delTwoFetch = (params) => defHttp.delete({ url: Api.delTwo, params }, { isTransformResponse: false, joinParamsToUrl: true });
+
+  const addThreeFetch = (params) => defHttp.post({ url: Api.addThree, params }, { isTransformResponse: false });
+  const editThreeFetch = (params) => defHttp.put({ url: Api.editThree, params }, { isTransformResponse: false });
+  const delThreeFetch = (params) => defHttp.delete({ url: Api.delThree, params }, { isTransformResponse: false, joinParamsToUrl: true });
 
 
   function reload() {
@@ -332,51 +293,6 @@
     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){
@@ -398,6 +314,74 @@
     }
   }
 
+  //创建新的节点
+  function createNoneData(){
+    let data = {
+      //临时ID，兼容新增和修改
+      _id: randomString(32),
+      rwbh,
+      xqxn,
+      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(){
+    //调用后台保存（创建个新的）
+    let nowData = createNoneData();
+    dataSource.value.push(nowData);
+    refreshDataSort();
+    addOneFetch(nowData).then(res => {
+      if(res.success){
+        nowData.id = res.result.id;
+        createMessage.success('添加标题成功！');
+        // nextTick(() => {
+        //   refreshDataSort();
+        // });
+      }
+    });
+  }
+
+  function editOne(one){
+    editOneFetch(one).then(res => {
+      if(res.success){
+        createMessage.success('修改标题成功！');
+      }
+    });
+  }
+
+  function delOne(e, one){
+    stop(e);
+    //删除
+    delOneFetch({ id: one.id }).then(res => {
+      if(res.success){
+        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 addTwo(e, one){
     let btn = getBtnEle(e.target, 'twoBtn');
     if(btn == null){
@@ -418,27 +402,44 @@
     }else{
       stop(e);
     }
+    let nowData = createNoneData();
+    nowData.pid = one.id;
     if(one.childrenList){
-      one.childrenList.push(createNoneData());
+      one.childrenList.push(nowData);
     }else{
-      one.childrenList = [ createNoneData() ];
+      one.childrenList = [ nowData ];
     }
+    refreshDataSort();
+    addTwoFetch(nowData).then(res => {
+      if(res.success){
+        nowData.id = res.result.id;
+        createMessage.success('添加章节成功！');
+      }
+    });
+  }
 
-    createMessage.success('添加章节成功！');
+  function editTwo(two){
-    nextTick(() => {
+    editTwoFetch(two).then(res => {
-      refreshDataSort();
+      if(res.success){
-    })
+        createMessage.success('修改章节成功！');
+      }
+    });
   }
 
   function delTwo(e, one, two){
     stop(e);
-    let index = one.childrenList.findIndex(x => x == two);
+    delTwoFetch({ id: two.id }).then(res => {
-    if(index == -1) return;
+      if(res.success){
-    one.childrenList.splice(index, 1);
+        let index = one.childrenList.findIndex(x => x == two);
-    createMessage.success('删除章节成功！');
+        if(index == -1) return;
-    nextTick(() => {
+        one.childrenList.splice(index, 1);
-      refreshDataSort();
+        createMessage.success('删除章节成功！');
-    })
+        nextTick(() => {
+          refreshDataSort();
+        })
+      }
+    });
+
   }
 
   // function insertTwo(one, index){
@@ -479,16 +480,24 @@
 
   function delThree(e, two, three){
     stop(e);
-    let index = two.childrenList.findIndex(x => x == three);
+    delThreeFetch({ id: three.id }).then(res => {
-    if(index == -1) return;
+      if(res.success){
-    two.childrenList.splice(index, 1);
+        let index = two.childrenList.findIndex(x => x == three);
+        if(index == -1) return;
+        two.childrenList.splice(index, 1);
 
-    createMessage.success('删除成功！');
+        createMessage.success('删除成功！');
-    nextTick(() => {
+        nextTick(() => {
-      refreshDataSort();
+          refreshDataSort();
-    })
+        })
+      }
+    });
   }
 
+  function downloadFile(three) {
+    let url = getFileAccessHttpUrl(three.filePath);
+    window.open(url,"_blank");
+  }
 
   //移动结束时触发，如果未移动则不触发，刷新排序,
   function endDraggable(){
@@ -523,23 +532,32 @@
       }
     }
 
-    if(!threeIndex){
+    if(!threeIndex && threeIndex !== 0){
+      three.pid = two.id;
       //新增
       if(two.childrenList){
         two.childrenList.push(three);
       }else{
         two.childrenList = [ three ];
       }
-      createMessage.success('新增成功！');
+      refreshDataSort();
+      addThreeFetch(three).then(res => {
+      if(res.success){
+        three.id = res.result.id;
+        createMessage.success('添加成功！');
+      }
+    });
     }else{
       //修改
       two.childrenList[threeIndex] = three;
-      createMessage.success('修改成功！');
+      refreshDataSort();
+      editThreeFetch(three).then(res => {
+        if(res.success){
+          createMessage.success('修改成功！');
+        }
+      });
     }
 
-    nextTick(() => {
-      refreshDataSort();
-    })
 
     threePageOpen.value = false;
 
@@ -657,7 +675,14 @@
   overflow: auto;
 }
 
-:deep(.maxDiv) .ant-collapse-header{
+:deep(.maxDiv){
-  align-items: center;
+  .ant-collapse-header{
+    align-items: center;
+    padding-bottom: 0;
+  }
+  .ant-card-body {
+    padding-top: 0;
+  }
 }
+
 </style>

src/views/zy/jiaoXueDanYuanNeiRong/index2.vue.allSave

@@ -0,0 +1,663 @@
+<template>
+  <div class="max">
+
+  <!-- <a-affix :offset-top="0" :target="() => doctomen"> -->
+    <div style="background: #fff">
+        <div style="font-size: 14px;color: #858588;margin-top: 10px;width:100%;padding: 10px 0 0 10px;">提示：每一个小的章节，都可以上传章节相关的教学资源</div>
+        <div class="topButton">
+          <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="reloadStn"><Icon icon="ant-design:reload-outlined"/>刷新</a-button>
+              <a-button type="" @click="() => { isPreview = false;reloadStn() }" class="addBtn" title="返回"><Icon icon="ant-design:fund-view-outlined"/>返回</a-button>
+            </a-space>
+          </template>
+        </div>
+    </div>
+  <!-- </a-affix> -->
+  <stuIndex ref="stuIndexRef" 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 }">
+        <div class="box">
+          <!-- 下一层 -->
+          <a-card @mouseenter="() => one.showBtn = true" @mouseleave="() => one.showBtn = false">
+            <a-collapse ghost expandIconPosition="right">
+              <a-collapse-panel :key="one._id" forceRender>
+                <template #header>
+                  <div class="topDiv">
+                    <Icon icon="ant-design:holder-outlined"/>
+                    <div>{{ one.sort }}：</div>
+                    <div class="inputd">
+                      <a-input v-if="one.isEdit" :value="one.title" @change="changeInput($event, one, 'title')" @blur="() => { one.isEdit = false }" @click="stop" class="ainput"/>
+                      <div v-else class="ainput ainputNoEdit" @click="(e) => { stop(e);one.isEdit = true }" >&nbsp;{{ one.title }}</div>
+                    </div>
+                  </div>
+                </template>
+                <template #extra>
+                  <span v-show="one.showBtn">
+                    <a-space>
+                      <div><a-button type="primary" size="small" @click="addTwo($event, one)" class="twoBtn addBtn" title="新增章节"><Icon icon="ant-design:plus-outlined"/></a-button></div>
+                      <div><a-button type="primary" size="small" danger @click="delOne($event, one)" class="addBtn" title="删除"><Icon icon="ant-design:delete"/></a-button></div>
+                    </a-space>
+                  </span>
+                </template>
+                <draggable v-bind="draggableBind" v-model="one.childrenList">
+                  <template #item="{ element: two }">
+                    <div class="box">
+                      <!-- 下一层 -->
+                      <a-card @mouseenter="() => two.showBtn = true" @mouseleave="() => two.showBtn = false">
+                        <a-collapse ghost expandIconPosition="right">
+                          <a-collapse-panel :key="two._id" :showArrow="false" forceRender>
+                            <template #header>
+                              <div class="twoTopDiv">
+                                <div class="topDiv">
+                                  <Icon icon="ant-design:holder-outlined"/>
+                                  <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 v-else class="ainput ainputNoEdit" @click="(e) => { stop(e);two.isEdit = true }" >&nbsp;{{ two.title }}</div>
+                                  </div>
+                                </div>
+                              </div>
+                            </template>
+                            <template #extra>
+                              <span v-show="two.showBtn">
+                                <a-space>
+                                  <a-button type="primary" size="small" class="addBtn" title="上传资源"><Icon icon="ant-design:plus-outlined"/></a-button>
+                                  <a-button type="primary" size="small" danger @click="delTwo($event, one, two)" class="addBtn" title="删除"><Icon icon="ant-design:delete"/></a-button>
+                                </a-space>
+                              </span>
+                            </template>
+                            <div style="padding-top: 1rem;">
+                              <a-space>
+                                <div><a-button type="primary" size="small" @click="addThree($event, two, 'video')" class="addBtn"><Icon icon="ant-design:video-camera-outlined"/>视频</a-button></div>
+                                <div><a-button type="primary" size="small" @click="addThree($event, two, 'document')" class="addBtn"><Icon icon="ant-design:file-outlined"/>文档</a-button></div>
+                                <div><a-button type="primary" size="small" @click="addThree($event, two, 'richText')" class="addBtn"><Icon icon="ant-design:file-text-outlined"/>富文本</a-button></div>
+                                <!-- <div><a-button type="primary" @click="addThree($event, two, 'classroomTest')" class="addBtn"><Icon icon="ant-design:plus-outlined"/>随堂测试</a-button></div>
+                                <div><a-button type="primary" @click="addThree($event, two, 'discuss')" class="addBtn"><Icon icon="ant-design:plus-outlined"/>讨论</a-button></div> -->
+                              </a-space>
+                            </div>
+                            <draggable v-bind="draggableBind" v-model="two.childrenList">
+                              <template #item="{ element: three, index: threeIndex }">
+                                <div class="box" @mouseenter="() => three.showBtn = true" @mouseleave="() => three.showBtn = false">
+                                  <Icon icon="ant-design:holder-outlined"/>
+                                  {{ one.sort }}.{{ two.sort }}.{{ three.sort }}
+                                  <a-tag class="hand" @click="viewThreePage(three)">
+                                    <template v-if="three.type == 'video'"><Icon icon="ant-design:video-camera-outlined" />视频</template>
+                                    <template v-if="three.type == 'document'"><Icon icon="ant-design:file-outlined" />文档</template>
+                                    <template v-if="three.type == 'richText'"><Icon icon="ant-design:file-text-outlined" />富文本</template>
+                                  </a-tag>
+                                  <span class="hand" @click="viewThreePage(three)">{{ three.title }}</span>
+                                  <span v-show="three.showBtn">
+                                    <a-space>
+                                      <a-button type="primary" size="small" title="预览" @click="viewThreePage(three)" class="addBtn"><Icon icon="ant-design:fund-view-outlined"/></a-button>
+                                      <a-button type="primary" size="small" title="编辑" @click="editThreePage(two, Object.assign({},three), threeIndex)" class="addBtn"><Icon icon="ant-design:edit"/></a-button>
+                                      <a-button type="primary" size="small" title="删除" danger @click="delThree($event, two, three)" class="addBtn"><Icon icon="ant-design:delete"/></a-button>
+                                    </a-space>
+                                  </span>
+
+
+                                  <a-card v-if="false">
+                                    <template #title>
+                                      <div>
+                                        <Icon icon="ant-design:holder-outlined"/>
+                                        {{ one.sort }}.{{ two.sort }}.{{ three.sort }}
+                                        <template v-if="three.type == 'video'">
+                                          <a-tag>
+                                            <Icon icon="ant-design:video-camera-outlined" />视频
+                                          </a-tag>
+                                        </template>
+                                        <template v-else-if="three.type == 'document'">
+                                          <a-tag>
+                                            <Icon icon="ant-design:file-outlined" />文档
+                                          </a-tag>
+                                        </template>
+                                        <template v-else-if="three.type == 'richText'">
+                                          <a-tag>
+                                            <Icon icon="ant-design:file-text-outlined" />富文本
+                                          </a-tag>
+                                        </template>
+                                      </div>
+                                      <div>
+                                        <a-input v-if="three.isEdit" :value="three.title" @change="changeInput($event, three, 'title')" @click="stop" class="ainput"/>
+                                        <div v-else class="ainput ainputNoEdit">&nbsp;{{ three.title }}</div>
+                                      </div>
+                                    </template>
+                                    <template #extra>
+                                      <span v-show="three.showBtn">
+                                        <a-space>
+                                          <a-button type="primary" size="small" v-if="three.isEdit" @click="() => three.isEdit = false" class="addBtn"><Icon icon="ant-design:form-outlined"/></a-button>
+                                          <a-button type="primary" size="small" v-if="!three.isEdit" @click="() => three.isEdit = true" class="addBtn"><Icon icon="ant-design:edit"/></a-button>
+                                          <a-button type="primary" size="small" danger @click="delThree($event, two, three)" class="addBtn"><Icon icon="ant-design:delete"/></a-button>
+                                        </a-space>
+                                      </span>
+                                    </template>
+                                    <div class="threeDiv">
+                                      <div>
+                                        <!-- <a-input v-if="three.isEdit" :value="three.title" @change="changeInput($event, three, 'title')" @click="stop" class="ainput"/>
+                                        <div v-else class="ainput ainputNoEdit">&nbsp;{{ three.title }}</div> -->
+                                      </div>
+                                      <div>
+                                        <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"/>
+                                          <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"/>
+                                          <downloadAssembly v-else :filePath="three.filePath"/>
+                                        </template>
+                                        <template v-if="three.type == 'richText'">
+                                          <j-editor v-if="three.isEdit" v-model:value="three.richText"/>
+                                          <div v-else class="richText" v-html="three.richText"></div>
+                                        </template>
+                                        <!-- <template v-if="three.type == 'classroomTest'">
+                                          随堂测试
+                                        </template>
+                                        <template v-if="three.type == 'discuss'">
+                                          讨论
+                                        </template> -->
+                                      </div>
+                                    </div>
+                                  </a-card>
+                                </div>
+                              </template>
+                            </draggable>
+                          </a-collapse-panel>
+                        </a-collapse>
+                      </a-card>
+                    </div>
+                  </template>
+                </draggable>
+              </a-collapse-panel>
+            </a-collapse>
+          </a-card>
+        </div>
+      </template>
+      <!-- <template #footer> -->
+        <!-- <a-button @click="sureChange" type="primary" style="margin-top: 100px">确定</a-button> -->
+      <!-- </template> -->
+    </draggable>
+    <a-modal :title="threePageTitle" :width="800" :visible="threePageOpen" :maskClosable="false" @ok="threePageHandleOk" :okButtonProps="{ class: { 'jee-hidden': threePageDisableSubmit } }" @cancel="threePageHandleCancel" cancelText="关闭">
+      <a-card v-if="threePageData?.three">
+        <div>
+          标题：
+          <a-input v-if="!threePageDisableSubmit" :value="threePageData.three.title" @change="changeInput($event, threePageData.three, 'title')" @click="stop" class="ainput"/>
+          <div v-else>{{ threePageData.three.title }}</div>
+        </div>
+        <div>
+          <template v-if="threePageData.three.type == 'video'">
+            <j-upload v-if="!threePageDisableSubmit" v-model:value="threePageData.three.filePath" :maxCount="1" text="上传视频" accept=".mp4,.webm,.ogv" :forceAcceptVerify="true"/>
+            <downloadAssembly v-else :filePath="threePageData.three.filePath"/>
+          </template>
+          <template v-if="threePageData.three.type == 'document'">
+            <j-upload v-if="!threePageDisableSubmit" v-model:value="threePageData.three.filePath" :maxCount="1"/>
+            <downloadAssembly v-else :filePath="threePageData.three.filePath"/>
+          </template>
+          <template v-if="threePageData.three.type == 'richText' && threePageOpen">
+            <j-editor v-if="!threePageDisableSubmit" v-model:value="threePageData.three.richText"/>
+            <div v-else class="richText" v-html="threePageData.three.richText"></div>
+          </template>
+        </div>
+      </a-card>
+    </a-modal>
+  </div>
+</div>
+
+
+</template>
+
+<script lang="ts" name="jiaoXueDanYuanNeiRongIndex" setup>
+  import { ref, reactive, onMounted, unref, nextTick } 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';
+  import stuIndex from './stuIndex.vue';
+
+  //当前路由信息
+  const { currentRoute } = useRouter();
+  const { query } = unref(currentRoute);
+  const { rwbh, xqxn, type } = query;//获取传递参数
+
+  const { createConfirm, createMessage } = useMessage();
+  const queryParam = ref<any>({});
+  const dataSource = ref<any>([]);
+
+  const isNotMove = ref<boolean>(true);
+  const saveLoading = ref<boolean>(false);
+  const isPreview = ref<boolean>(false);
+
+  const threePageTitle = ref<String>('详细');
+  const threePageOpen = ref<boolean>(false);
+  const threePageDisableSubmit = ref<boolean>(false);
+  const threePageData = ref<Object>(null);
+
+  const stuIndexRef = ref<any>();
+
+  //公共的拖动排序组件绑定数据
+  const draggableBind = ref<Object>({
+    //唯一键
+    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();
+  }
+
+  function reloadStn() {
+    stuIndexRef.value.reload();
+  }
+
+  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();
+    // })
+    editThreePage(two, data, null);
+
+  }
+
+  function editThreePage(two, three, threeIndex) {
+    threePageOpen.value = true;
+    threePageDisableSubmit.value = false;
+    threePageData.value = { two, three, threeIndex, };
+  }
+
+  function viewThreePage(three) {
+    threePageOpen.value = true;
+    threePageDisableSubmit.value = true;
+    threePageData.value = { three };
+  }
+
+  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 threePageHandleOk(){
+    let { two, three, threeIndex, } = threePageData.value;
+    //校验
+    if(!three.title){
+      createMessage.warn('请填写标题!');
+      return;
+    } else if(three.type == 'video'){
+      if(!three.filePath){
+        createMessage.warn('请上传视频!');
+        return;
+      }
+    } else if(three.type == 'document'){
+      if(!three.filePath){
+        createMessage.warn('请上传视频!');
+        return;
+      }
+    } else if(three.type == 'richText'){
+      if(!three.richText){
+        createMessage.warn('请填写富文本!');
+        return;
+      }
+    }
+
+    if(!threeIndex){
+      //新增
+      if(two.childrenList){
+        two.childrenList.push(three);
+      }else{
+        two.childrenList = [ three ];
+      }
+      createMessage.success('新增成功！');
+    }else{
+      //修改
+      two.childrenList[threeIndex] = three;
+      createMessage.success('修改成功！');
+    }
+
+    nextTick(() => {
+      refreshDataSort();
+    })
+
+    threePageOpen.value = false;
+
+  }
+
+  function threePageHandleCancel(){
+    threePageOpen.value = false;
+    threePageData.value = {};
+  }
+
+  //按下鼠标按键后触发
+  // 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>
+.hand {
+  cursor:pointer;
+}
+.max {
+  height: calc(100vh - 225px);
+  //height: calc(-132px + 100vh);
+  // min-height: calc(-132px + 100vh);
+  // max-height: calc(-132px + 100vh);
+  overflow: auto;
+  //overflow: hidden;
+  .maxDiv {
+    height: calc(100% - 94px);
+    overflow-y: auto;
+  }
+}
+
+.box {
+  margin: .5rem 0 0 0;
+  .itemTop {
+    width: 100%;
+  }
+}
+
+.topButton {
+  padding: 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>

src/views/zy/jiaoXueDanYuanNeiRong/stuIndex.vue

@@ -75,7 +75,10 @@
                             <span class="hand" @click="viewThreePage(three)">{{ three.title }}</span>
                             <span v-show="three.showBtn">
                               <a-space>
-                                <a-button type="primary" size="small" @click="viewThreePage(three)" class="addBtn"><Icon icon="ant-design:fund-view-outlined"/></a-button>
+                                <a-button type="primary" size="small" title="下载" v-if="three.type == 'video' || three.type == 'document'" @click="downloadFile(three)" class="addBtn"><Icon icon="ant-design:vertical-align-bottom-outlined"/></a-button>
+                                <a-button type="primary" size="small" title="查看" @click="viewThreePage(three)" class="addBtn"><Icon icon="ant-design:fund-view-outlined"/></a-button>
+
+
                               </a-space>
                             </span>
 
@@ -176,7 +179,7 @@
   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 { randomString, simpleDebounce, getFileAccessHttpUrl } from '/@/utils/common/compUtils'
 
   import draggable from 'vuedraggable';
   import JUpload from '/@/components/Form/src/jeecg/components/JUpload/JUpload.vue';
@@ -451,6 +454,12 @@
     threePageOpen.value = false;
   }
 
+  function downloadFile(three) {
+    let url = getFileAccessHttpUrl(three.filePath);
+    window.open(url,"_blank");
+  }
+
+
 
   //移动结束时触发，如果未移动则不触发，刷新排序,
   function endDraggable(){