sc

src/api/uav/record.js

@@ -0,0 +1,8 @@
+import request from '@/config/axios'
+
+export const searchStudyRecords = async (data) => {
+  return await request.post({
+    url: 'wrj-api/wrjQuestionPractice/query',
+    data
+  })
+}

src/components/Editor/src/Editor.vue

@@ -42,7 +42,11 @@ const props = defineProps({
         'undo', // 撤销
         'redo', // 重做
         'fullScreen'
-      ]
+      ],
+      insertKeys: {
+        index: 20, // 自定义插入的位置
+        keys: ['uploadAttachment'] // “上传附件”菜单
+      }
     })
   }
 })
@@ -104,6 +108,12 @@ const editorConfig = computed((): IEditorConfig => {
       },
       autoFocus: false,
       scroll: true,
+      // 在编辑器中，点击选中“附件”节点时，要弹出的菜单
+      hoverbarKeys: {
+        attachment: {
+          menuKeys: ['downloadAttachment'] // “下载附件”菜单
+        }
+      },
       MENU_CONF: {
         ['uploadImage']: {
           server: import.meta.env.VITE_UPLOAD_URL,
@@ -218,6 +228,52 @@ const editorConfig = computed((): IEditorConfig => {
           customInsert(res: any, insertFn: InsertFnType) {
             insertFn(res.data, 'video', res.data)
           }
+        },
+        uploadAttachment: {
+          server: import.meta.env.VITE_UPLOAD_URL,
+          timeout: 20 * 1000, // 2s
+
+          fieldName: 'file',
+          // meta: { token: 'xxx', a: 100 }, // 请求时附加的数据
+          // metaWithUrl: true, // meta 拼接到 url 上
+          // headers: { Accept: 'text/x-json' },
+          // 自定义增加 http  header
+          headers: {
+            Accept: '*',
+            Authorization: 'Bearer ' + getAccessToken(),
+            'tenant-id': getTenantId(),
+            'instance-id': getAppId()
+          },
+
+          maxFileSize: 20 * 1024 * 1024, // 20M
+
+          onBeforeUpload(file: File) {
+            console.log('onBeforeUpload', file)
+            return file // 上传 file 文件
+            // return false // 会阻止上传
+          },
+          onProgress(progress: number) {
+            console.log('onProgress', progress)
+          },
+          onSuccess(file: File, res: any) {
+            console.log('onSuccess', file, res)
+          },
+          onFailed(file: File, res: any) {
+            alert(res.message)
+            console.log('onFailed', file, res)
+          },
+          onError(file: File, err: Error, res: any) {
+            alert(err.message)
+            console.error('onError', file, err, res)
+          },
+          // 上传成功后，用户自定义插入文件
+          customInsert(res: any, file: File, insertFn: Function) {
+            console.log('customInsert', res)
+
+            // 插入附件到编辑器
+            insertFn(file.name, res.data)
+            // insertFn(res.data, `customInsert-${file.name}`, res.data)
+          }
         }
       },
       uploadImgShowBase64: true

src/main.js

@@ -42,8 +42,14 @@ import '@/plugins/tongji' // 百度统计
 import Logger from '@/utils/Logger'
 import VueDOMPurifyHTML from 'vue-dompurify-html'
 
+import { Boot } from '@wangeditor/editor'
+import attachmentModule from '@wangeditor/plugin-upload-attachment'
+
 // 创建实例
 const setupAll = async () => {
+  // 注册。要在创建编辑器之前注册，且只能注册一次，不可重复注册。
+  Boot.registerModule(attachmentModule)
+
   const app = createApp(App)
 
   await setupI18n(app)

src/views/UAVClue/StudyRecord/components/Practice.vue

@@ -3,7 +3,7 @@
     <el-form :model="searchForm" inline @submit.prevent>
       <el-form-item>
         <el-input
-          v-model="searchForm.nameOrPhone"
+          v-model="searchForm.userNameOrPhone"
           placeholder="输入学员姓名/手机号"
           @keyup.enter="handleQuery"
         />
@@ -13,18 +13,18 @@
       </el-form-item>
       <el-form-item>
         <el-select
-          v-model="searchForm.status"
+          v-model="searchForm.answerResult"
           placeholder="选择答题结果"
           @change="handleQuery"
           style="width: 150px"
           clearable
         >
           <el-option label="答对" :value="1" />
-          <el-option label="答错" :value="0" />
+          <el-option label="答错" :value="2" />
         </el-select>
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" @click="handleQuery"> 搜索 </el-button>
+        <el-button type="primary" @click="handleQuery">搜 索</el-button>
       </el-form-item>
     </el-form>
     <el-table
@@ -42,9 +42,9 @@
       <el-table-column label="姓名" prop="name" />
       <el-table-column label="手机号" prop="phone" />
       <el-table-column label="答题选择" prop="yourAnswer" />
-      <el-table-column label="答题结果" prop="status">
+      <el-table-column label="答题结果" prop="answerResult">
         <template #default="{ row }">
-          <el-tag v-if="row.status == 0" type="danger">答错</el-tag>
+          <el-tag v-if="row.answerResult == 2" type="danger">答错</el-tag>
           <el-tag v-else type="success">答对</el-tag>
         </template>
       </el-table-column>
@@ -62,11 +62,15 @@
 </template>
 
 <script setup>
+import { searchStudyRecords } from '@/api/uav/record'
+
 const searchForm = ref({
+  userNameOrPhone: '',
+  practiceType: 1,
   question: '',
-  status: '',
+  answerResult: undefined,
   pageNo: 1,
-  pageSize: 100
+  pageSize: 50
 })
 
 const loading = ref(false)
@@ -76,20 +80,26 @@ const tableList = ref([])
 onMounted(() => {
   handleQuery()
 })
-function getList() {
+async function getList() {
   loading.value = true
-  tableList.value = [
-    {
-      id: 1,
-      question: '1+1=？',
-      answer: 'B',
-      yourAnswer: 'B',
-      status: '1',
-      createTime: ''
-    }
-  ]
-  total.value = 1
-  loading.value = false
+  try {
+    const resp = await searchStudyRecords(searchForm.value)
+    console.log(resp)
+
+    tableList.value = [
+      {
+        id: 1,
+        question: '1+1=？',
+        answer: 'B',
+        yourAnswer: 'B',
+        answerResult: 1,
+        createTime: ''
+      }
+    ]
+    total.value = 1
+  } finally {
+    loading.value = false
+  }
 }
 
 function handleQuery() {