扫描拖动合并

src/components/MoveTo/MoveTo.vue

@@ -11,6 +11,12 @@
         <el-form-item label="文件名称">
           <el-input v-model="form.fileName" />
         </el-form-item>
+        <el-form-item label="是否合并">
+          <el-radio-group v-model="form.merge">
+            <el-radio :label="true">是</el-radio>
+            <el-radio :label="false">否</el-radio>
+          </el-radio-group>
+        </el-form-item>
         <el-form-item label="目标目录">
           <el-input v-model="thisNode.label" disabled />
         </el-form-item>
@@ -78,7 +84,7 @@ const props = defineProps({
     type: Array,
     default: () => [],
   },
-   spaceType: {
+  spaceType: {
     type: Number,
     default: 0,
   },
@@ -88,6 +94,7 @@ const dirIds = ref();
 const thisNode = ref({}); //当前选中的接点
 const form = ref({
   fileName: "扫描文件" + Date.now(),
+  merge: false,
 });
 const defaultProps = ref({
   label: "label",
@@ -104,7 +111,7 @@ function handleNodeClick(data) {
 const onSubmit = async () => {
   const query = {
     dirId: thisNode.value.value,
-    merge: false,
+    merge: form.value.merge,
     name: form.value.fileName,
     q: toRaw(props.scanFileArr),
     spaceId: props.thisFolder.spaceId,
@@ -116,7 +123,7 @@ const onSubmit = async () => {
       type: "success",
       message: "移动成功",
     });
-    closeOpen()
+    closeOpen();
   }
   console.log(res);
 };
@@ -137,9 +144,9 @@ function getFileTree() {
     console.log("treedata", res);
   });
 }
-const setImg = (type)=>{
-    return setIcon(type)
-}
+const setImg = (type) => {
+  return setIcon(type);
+};
 onMounted(() => {
   getFileTree();
   // console.log("thisFolder", props.thisFolder);

src/components/ScanFile/ScanFile.vue

@@ -21,12 +21,12 @@
         </div>
         <!-- 盒子区域 -->
         <div class="bigBox" id="bigBox">
-          <div v-for="(item,index) in props.scannerFiles" :key="item" class="one_box">
+          <div v-for="(item, index) in copyList" :key="item" class="one_box">
             <img :src="wangzhi + item.path" alt="" />
             <div class="top_check">
               <el-checkbox
                 :checked="fileArr.some((par) => par == item.q)"
-                @change="checkChange(item,index)"
+                @change="checkChange(item, index)"
               ></el-checkbox>
             </div>
           </div>
@@ -61,6 +61,7 @@ const props = defineProps({
 });
 
 const checkedAll = ref(false); //是否全选
+const copyList = ref(props.scannerFiles);
 const total = ref(333); //总计数量
 const wangzhi = import.meta.env.VITE_APP_BASE_API;
 const fileArr = ref([]);
@@ -68,28 +69,44 @@ const emit = defineEmits(["closeOpen", "saveScanFile"]);
 const closeOpen = () => {
   emit("closeOpen");
 };
-const checkChange = (item,index) => {
-  console.log('item',item);
-  console.log('index',index);
-  let arr = fileArr.value;
-  if (arr.some((par) => par == item.q)) {
-    arr = arr.filter((par) => par != item.q);
-  } else {
-    arr.push(item.q);
-  }
-  // if (arr.some((par) => par == item.q)) {
-  //   arr = arr.filter((par) => par != item.q);
-  // } else {
-  //   arr.push({q:item.q,index:index});
-  // }
-  // 判断全选
-  if (arr.length == props.scannerFiles.length) {
-    checkedAll.value = true;
-  } else {
-    checkedAll.value = false;
-  }
-  fileArr.value = JSON.parse(JSON.stringify(arr));
-  console.log("fileArr", toRaw(fileArr.value));
+// const checkChange = (item,index) => {
+//   console.log('item',item);
+//   console.log('index',index);
+//   let arr = fileArr.value;
+//   if (arr.some((par) => par == item.q)) {
+//     arr = arr.filter((par) => par != item.q);
+//   } else {
+//     arr.push(item.q);
+//   }
+//   // if (arr.some((par) => par == item.q)) {
+//   //   arr = arr.filter((par) => par != item.q);
+//   // } else {
+//   //   arr.push({q:item.q,index:index});
+//   // }
+//   // 判断全选
+//   if (arr.length == props.scannerFiles.length) {
+//     checkedAll.value = true;
+//   } else {
+//     checkedAll.value = false;
+//   }
+//   fileArr.value = JSON.parse(JSON.stringify(arr));
+//   console.log("fileArr", toRaw(fileArr.value));
+// };
+const checkChange = (item, index) => {
+  // console.log("item", item);
+  // console.log("index", index);
+  let arr = copyList.value;
+  copyList.value = arr.map((par) => {
+    if (item.q == par.q) {
+      if (par.checked) {
+        par.checked = false;
+      } else {
+        par.checked = true;
+      }
+    }
+    return par;
+  });
+  // console.log('chengeC',copyList.value);
 };
 const checkAllChange = () => {
   console.log("checkedAll.value", checkedAll.value);
@@ -103,21 +120,39 @@ const checkAllChange = () => {
   console.log("fileArr", fileArr.value);
 };
 const toSave = () => {
-  emit("saveScanFile", toRaw(fileArr.value));
+  const arr = []
+  copyList.value.forEach(item=>{
+    if(item.checked){
+      arr.push(item.q)
+    }
+  })
+  // console.log('arr',arr);
+  // console.log('chengeC',copyList.value);
+  emit("saveScanFile", arr);
 };
 const rowDrop = () => {
   const el = document.getElementById("bigBox"); //找到想要拖拽的那一列
   Sortable.create(el, {
     //结束拖拽事件
-    async onEnd(evt) {
-      console.log("evt", evt);
+    async onEnd({ newIndex, oldIndex }) {
+      const newItem = copyList.value[newIndex];
+      const oldItem = copyList.value[oldIndex];
+      copyList.value[newIndex] = oldItem;
+      copyList.value[oldIndex] = newItem;
+      // console.log("2copyList.value", copyList.value);/
     },
   });
 };
 onMounted(async () => {
-  setTimeout(()=>{
+  setTimeout(() => {
     rowDrop();
-  },500)
+    const arr = copyList.value;
+    copyList.value = arr.map((item) => {
+      item.checked = false;
+      return toRaw(item);
+    });
+    console.log("copyList.value", copyList.value);
+  }, 500);
 });
 </script>