bug fixes

src/components/UploadVideo.vue

@@ -23,16 +23,33 @@ interface UploadInfo {
   videoInfo: any
   progress: number
 }
+interface Props {
+  beforeUpload?: (file: any) => void
+}
+
+const props = defineProps<Props>()
 
 const emit = defineEmits(['success'])
 
 const uploader = createUploader()
 let fileList = $ref<UploadInfo[]>([])
 
-const fileChange = (event: Event) => {
+onUnmounted(() => {
+  uploader && uploader.stopUpload()
+})
+const fileChange = async (event: Event) => {
   const element = event.currentTarget as HTMLInputElement
   const files: FileList | null = element.files
   if (!files) return
+  if (props.beforeUpload) {
+    try {
+      await props.beforeUpload(files)
+      uploader.cleanList()
+    } catch (error) {
+      console.log(error)
+      return false
+    }
+  }
   for (const file of files) {
     // 是否重复上传
     const hasRepeat = !!fileList.find(

src/components/base/AppUpload.vue

@@ -10,6 +10,7 @@ interface Props {
   prefix?: string
   size?: number
   limit?: number
+  beforeUpload?: (file: any) => void
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -32,7 +33,7 @@ const showFileList = computed(() => {
 
 // 上传之前
 const handleBeforeUpload = async (file: any) => {
-  if (props.limit && fileList.value.length >= props.limit) {
+  if (props.limit && fileList.value.length >= props.limit && props.limit > 1) {
     ElMessage.error(`只能上传${props.limit}个文件`)
     return false
   }
@@ -52,6 +53,9 @@ const handleBeforeUpload = async (file: any) => {
     url: `${response.host}/${key}`
   }
   file.url = `${response.host}/${key}`
+  if (props.beforeUpload) {
+    return props.beforeUpload(file)
+  }
 }
 
 // 上传成功
@@ -60,7 +64,8 @@ const handleSuccess = (response: any, file: any, files: any) => {
   if (showFileList.value) {
     emit(
       'update:modelValue',
-      files.map((item: any) => {
+      files
+        .map((item: any) => {
           return {
             name: item.name,
             url: item.url || item.raw?.url,
@@ -68,11 +73,11 @@ const handleSuccess = (response: any, file: any, files: any) => {
             type: item.type || item.raw?.type
           }
         })
-      // .reverse()
-      // .filter((item: any, index: number) => {
-      //   return props.limit ? index < props.limit : true
-      // })
-      // .reverse()
+        .reverse()
+        .filter((item: any, index: number) => {
+          return props.limit ? index < props.limit : true
+        })
+        .reverse()
     )
   } else {
     emit('update:modelValue', file.raw.url)

src/modules/admin/lab/book/components/FormDialog.vue

 <script setup lang="ts">
 import type { FormInstance, FormRules } from 'element-plus'
 import type { BookItem, BookCreateItem } from '../types'
-import { ElMessage } from 'element-plus'
+import { ElMessageBox, ElMessage } from 'element-plus'
 
 import AppUpload from '@/components/base/AppUpload.vue'
 import { createBook, updateBook } from '../api'
@@ -73,6 +73,14 @@ const experimentList = $computed(() => {
     ? [{ id: props.data.experiment_id, name: props.data.experiment_id_name }, ...experiments.value]
     : experiments.value
 })
+
+function handleBeforeUpload() {
+  if (form.files.length) {
+    return ElMessageBox.confirm('系统仅支持1个实验指导书，此操作将覆盖原有实验指导书文件，确认上传新文件吗？', '提示')
+  }
+  return true
+}
+
 function handleUploadSuccess(file: any) {
   form.name = file.name.split('.').shift()
   form.size = (file.size / 1024 / 1024).toString()
@@ -110,6 +118,7 @@ function handleUpdate(params: BookCreateItem) {
         <AppUpload
           v-model="form.files"
           :limit="1"
+          :beforeUpload="handleBeforeUpload"
           accept=".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,.pdf,application/pdf,.ppt,.pptx,application/vnd.ms-powerpoint,.csv,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
           @success="handleUploadSuccess"
         >

src/modules/admin/lab/video/components/FormDialog.vue

 <script setup lang="ts">
 import type { FormInstance, FormRules } from 'element-plus'
 import type { VideoItem, VideoCreateItem } from '../types'
-import { ElMessage } from 'element-plus'
+import { ElMessageBox, ElMessage } from 'element-plus'
 
 import UploadVideo from '@/components/UploadVideo.vue'
 import { createVideo, updateVideo } from '../api'
@@ -63,6 +63,16 @@ const title = $computed(() => {
   return isUpdate ? '编辑实验操作视频' : '新增实验操作视频'
 })
 
+function handleBeforeUpload() {
+  if (form.source_id) {
+    return ElMessageBox.confirm(
+      '系统仅支持1个实验操作视频，此操作将覆盖原有实验操作视频文件，确认上传新文件吗？',
+      '提示'
+    )
+  }
+  return true
+}
+
 function handleUploadSuccess(uploadInfo: any) {
   form.name = uploadInfo.file.name.split('.').shift()
   form.source_id = uploadInfo.videoId
@@ -95,7 +105,7 @@ function handleUpdate(params: VideoCreateItem) {
   <el-dialog :title="title" :close-on-click-modal="false" width="600px" @update:modelValue="$emit('update:modelValue')">
     <el-form ref="formRef" :model="form" :rules="rules" label-width="140px">
       <el-form-item label="实验操作视频文件" prop="source_id">
-        <UploadVideo @success="handleUploadSuccess">
+        <UploadVideo :beforeUpload="handleBeforeUpload" @success="handleUploadSuccess">
           <template #tip>实验操作视频文件支持格式包含：doc docx xls xlsx pdf ppt pptx，大小不超过50M</template>
         </UploadVideo>
       </el-form-item>

src/modules/student/lab/components/Result.vue

 <script setup lang="ts">
-import type { ExperimentRecord, ExperimentRecordFile } from '../types'
+import type { ExperimentRecord } from '../types'
 import { ElMessageBox } from 'element-plus'
 import ImageViewer from '@/components/ImageViewer.vue'
 import { uploadExperimentPicture } from '../api'

src/modules/student/lab/views/Index.vue

@@ -39,6 +39,18 @@ watchEffect(() => {
     form.experiment_id = first.id
   }
 })
+// 课程改变
+function handleCourseChange(value: string) {
+  ElMessageBox.confirm('切换实验，将会导致当前操作内容变化，请确认当前操作无误并确认切换实验。', '提示').then(() => {
+    form.course_id = value
+  })
+}
+// 实验改变
+function handleExperimentChange(value: string) {
+  ElMessageBox.confirm('切换实验，将会导致当前操作内容变化，请确认当前操作无误并确认切换实验。', '提示').then(() => {
+    form.experiment_id = value
+  })
+}
 
 let detail = $ref<ExperimentRecord>()
 provide('detail', $$(detail))
@@ -136,12 +148,12 @@ function handleSubmit() {
       <div class="lab-left__inner">
         <el-form :model="form" label-suffix=":" hide-required-asterisk>
           <el-form-item label="请选择课程">
-            <el-select v-model="form.course_id" style="width: 100%">
+            <el-select :model-value="form.course_id" @change="handleCourseChange" style="width: 100%">
               <el-option v-for="item in courses" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="请选择实验" prop="experiment_id">
-            <el-select v-model="form.experiment_id" style="width: 100%">
+            <el-select :model-value="form.experiment_id" @change="handleExperimentChange" style="width: 100%">
               <el-option v-for="item in experimentList" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
           </el-form-item>