From 63df3e345c2cd838e9ed65a646765fe28b050baf Mon Sep 17 00:00:00 2001
From: fanxb <fleyx20@outlook.com>
Date: Mon, 28 Jun 2021 21:56:06 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E7=BB=86=E8=8A=82=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 openRenamerFront/src/views/home/Home.vue | 31 ++++++++++++++++++++----
 1 file changed, 26 insertions(+), 5 deletions(-)

diff --git a/openRenamerFront/src/views/home/Home.vue b/openRenamerFront/src/views/home/Home.vue
index d9915ed..10d04d2 100644
--- a/openRenamerFront/src/views/home/Home.vue
+++ b/openRenamerFront/src/views/home/Home.vue
@@ -39,11 +39,24 @@
     </div>
     <!-- 文件预览列表 -->
     <div class="fileList">
-      <div>文件列表</div>
+      <div>
+        文件列表
+
+        <el-button type="primary" size="mini" @click="selectAllFiles"
+          >反选</el-button
+        >
+        <el-button type="danger" size="mini" @click="deleteCheckedFiles"
+          >删除</el-button
+        >
+      </div>
       <div class="fileBlock">
-        <div v-for="(item, index) in fileList" :key="index">
-          {{ item.name }}
-        </div>
+        <el-checkbox
+          style="display: block"
+          v-for="(item, index) in fileList"
+          :key="index"
+          v-model="item.checked"
+          >{{ item.name }}</el-checkbox
+        >
       </div>
       <div class="fileBlock">
         <div v-for="(item, index) in changedFileList" :key="index">
@@ -99,7 +112,7 @@ export default {
   methods: {
     //新增文件
     async addData(data) {
-      console.log(data);
+      data.forEach((item) => (item.checked = false));
       this.fileList.push(...data);
       this.dialogVisible = false;
       this.needPreview = true;
@@ -178,6 +191,14 @@ export default {
       this.loading = false;
       this.$message({ message: "重命名成功", type: "success" });
     },
+    //删除选中的文件名
+    deleteCheckedFiles() {
+      this.fileList = this.fileList.filter((item) => !item.checked);
+    },
+    //全选
+    selectAllFiles() {
+      this.fileList.forEach((item) => (item.checked = !item.checked));
+    },
   },
 };
 </script>