修复报错

src/views/sample_handle_v3/index.vue

@@ -14,6 +14,7 @@ import {
   Star,
 } from '@element-plus/icons-vue'
 import aitoolsService from '@/api/service/aitoolsService'
+import type { ElTree } from 'element-plus'
 
 
 const title = ref('元芒数字')
@@ -118,10 +119,17 @@ const onCheckClipVideoBtnClick = (dir_name: string) => {
 import axios from 'axios'
 
 const folderInput = ref<HTMLInputElement | null>(null)
-const treeRef = ref(null)
-const treeData = ref([])
-const expandedKeys = ref([])
-const selectedFile = ref(null) // 当前选中的文件节点
+const treeRef = ref<InstanceType<typeof ElTree> | null>(null)
+interface TreeNode {
+  id: number
+  label: string
+  relativePath: string
+  isLeaf: boolean
+  children: TreeNode[]
+}
+const treeData = ref<TreeNode[]>([])
+const expandedKeys = ref<number[]>([])
+const selectedFile = ref<TreeNode | null>(null) // 当前选中的文件节点
 const fileMap = new Map() // 相对路径 -> File 对象
 const defaultProps = { children: 'children', label: 'label', disabled: 'disabled', }
 // 定义 handledFiles 中每个对象的结构
@@ -136,7 +144,6 @@ interface HandledFile {
   box_range: string;
   classes_select: string;
   target_fps: string;
-  sample_path: string;
 }
 // 使用定义的接口类型
 const handledFiles = ref<HandledFile[]>([]);
@@ -165,17 +172,17 @@ function handleFolderSelect(event: any) {
 
 /** 构建树结构 */
 function buildTreeFromFiles(files: any[]) {
-  const root = {}
+  const root: Record<string, any> = {}
   let nodeId = 1
 
   files.forEach(file => {
     const relPath = file.webkitRelativePath
     const pathParts = relPath.split('/')
     // 过滤点开头的
-    if (pathParts.some(p => p.startsWith('.'))) return
+    if (pathParts.some((p: any) => p.startsWith('.'))) return
 
     let current = root
-    pathParts.forEach((part, index) => {
+    pathParts.forEach((part: string, index: number) => {
       if (!current[part]) {
         current[part] = {
           __isFile: index === pathParts.length - 1,
@@ -187,14 +194,27 @@ function buildTreeFromFiles(files: any[]) {
     })
   })
 
-  const traverse = obj =>
+  interface TreeNodeRaw {
+    __isFile: boolean
+    __children: Record<string, TreeNodeRaw>
+    __path: string
+  }
+
+  interface TreeNode {
+    id: number
+    label: string
+    relativePath: string
+    isLeaf: boolean
+    children: TreeNode[]
+  }
+
+  const traverse = (obj: Record<string, TreeNodeRaw>): TreeNode[] =>
     Object.entries(obj).map(([name, node]) => ({
       id: nodeId++,
       label: name,
       relativePath: node.__path,
       isLeaf: node.__isFile,
       children: node.__isFile ? [] : traverse(node.__children),
-      handled: '未处理',
     }))
 
   return traverse(root)
@@ -214,7 +234,7 @@ function collectAllIds(nodes: any[]) {
 }
 
 /** 勾选状态变化 */
-function handleCheckChange(node, checked) {
+function handleCheckChange(node: TreeNode, checked: boolean) {
   if (!node.isLeaf) {
     treeRef.value?.setChecked(node, false, false)
     return
@@ -224,7 +244,7 @@ function handleCheckChange(node, checked) {
     // 单选逻辑：取消其他勾选
     const checkedKeys = treeRef.value?.getCheckedKeys() || []
     checkedKeys.forEach(key => {
-      if (key !== node.id) treeRef.value.setChecked(key, false, false)
+      if (key !== node.id) treeRef.value?.setChecked(key, false, false)
     })
     selectedFile.value = node
     // console.log(selectedFile.value)
@@ -235,7 +255,7 @@ function handleCheckChange(node, checked) {
   }
 
   // 如果整棵树都没有被选择节点
-  const anyChecked = treeRef.value?.getCheckedKeys().length > 0
+  const anyChecked = treeRef.value && treeRef.value.getCheckedKeys()?.length > 0
   if (!anyChecked) {
     // console.log('❌ 整棵树都没有被选择节点')
     selectedFile.value = null
@@ -290,6 +310,7 @@ async function uploadSelectedFile() {
   }
 }
 const continue_to_negative = () => {
+  if (!selectedFile.value) return; // 添加非空校验
   // 保存已处理的信息
   handledFiles.value.push({
     id: selectedFile.value.id,
@@ -306,9 +327,9 @@ const continue_to_negative = () => {
   console.log('handledFiles =', handledFiles.value)
   // 将已处理文件置灰
   treeData.value = treeData.value.map(node => {
-    const disableNode = (n) => {
-      if (n.relativePath === selectedFile.value.relativePath) {
-        return { ...n, disabled: true, handled: '已处理' }
+    const disableNode = (n: any) => {
+      if (n.relativePath === selectedFile.value?.relativePath) {
+        return { ...n, disabled: true }
       }
       if (n.children?.length) {
         return { ...n, children: n.children.map(disableNode) }
@@ -396,19 +417,18 @@ const downloadAllSamples = async () => {
       <div class="folder-viewer" v-if="steps_active === -1" v-loading="file_loading">
         <div class="toolbar">
           <el-button type="primary" @click="chooseFolder">选择文件夹</el-button>
-          
         </div>
         <div class="toolbar">
           <el-tree
-          v-if="treeData.length"
-          ref="treeRef"
-          :data="treeData"
-          :props="defaultProps"
-          default-expand-all
-          :expand-on-click-node="false"
-          node-key="id"
-          show-checkbox
-          @check-change="handleCheckChange"
+            v-if="treeData.length"
+            ref="treeRef"
+            :data="treeData"
+            :props="defaultProps"
+            default-expand-all
+            :expand-on-click-node="false"
+            node-key="id"
+            show-checkbox
+            @check-change="handleCheckChange"
           >
             <template #default="{ node, data }">
               <div class="custom-tree-node">
@@ -602,9 +622,9 @@ const downloadAllSamples = async () => {
   </main>
 
 
-<el-dialog v-model="dialogVisible" title="视频片段（如果挡住后面的图，按这里可以移动）" draggable width="30%">
-  <video id="clip-video" controls style="width: 100%;" autoplay></video>
-</el-dialog>
+  <el-dialog v-model="dialogVisible" title="视频片段（如果挡住后面的图，按这里可以移动）" draggable width="30%">
+    <video id="clip-video" controls style="width: 100%;" autoplay></video>
+  </el-dialog>
 
 </template>