From 922f31b718f7926e15bb31c213d002b00af2e5d4 Mon Sep 17 00:00:00 2001
From: nullptr-0 <959220793@qq.com>
Date: Wed, 30 Aug 2023 01:23:12 +0800
Subject: [PATCH] bugfix for #34

---
 src/component/EditDialog.vue   |  5 +++--
 src/component/PreviewTable.vue |  6 ++---
 src/view/Home.vue              | 41 +++++++++++++++++++++++++---------
 3 files changed, 36 insertions(+), 16 deletions(-)

diff --git a/src/component/EditDialog.vue b/src/component/EditDialog.vue
index 06ff53e..1fe3e68 100644
--- a/src/component/EditDialog.vue
+++ b/src/component/EditDialog.vue
@@ -92,6 +92,7 @@ form >>> input {
 </template>
 
 <script>
+import { split_regex } from '@/decrypt/utils';
 import Ruby from './Ruby';
 
 export default {
@@ -167,10 +168,10 @@ export default {
       this.$emit('ok', {
         picture: this.imgFile.blob,
         title: this.title,
-        artist: this.artist,
+        artist: this.artist.split(split_regex),
         album: this.album,
         albumartist: this.albumartist,
-        genre: this.genre,
+        genre: this.genre.split(split_regex),
       });
     },
   },
diff --git a/src/component/PreviewTable.vue b/src/component/PreviewTable.vue
index a7d8f3c..b215270 100644
--- a/src/component/PreviewTable.vue
+++ b/src/component/PreviewTable.vue
@@ -27,7 +27,7 @@
         <el-button circle icon="el-icon-video-play" type="success" @click="handlePlay(scope.$index, scope.row)">
         </el-button>
         <el-button circle icon="el-icon-download" @click="handleDownload(scope.row)"></el-button>
-        <el-button circle icon="el-icon-edit" @click="handleEdit(scope.row)"></el-button>
+        <el-button circle icon="el-icon-edit" @click="handleEdit(scope.$index, scope.row)"></el-button>
         <el-button circle icon="el-icon-delete" type="danger" @click="handleDelete(scope.$index, scope.row)">
         </el-button>
       </template>
@@ -56,8 +56,8 @@ export default {
     handleDownload(row) {
       this.$emit('download', row);
     },
-    handleEdit(row) {
-      this.$emit('edit', row);
+    handleEdit(index, row) {
+      this.$emit('edit', index, row);
     },
   },
 };
diff --git a/src/view/Home.vue b/src/view/Home.vue
index eb4c6ea..55eb319 100644
--- a/src/view/Home.vue
+++ b/src/view/Home.vue
@@ -14,10 +14,10 @@
           :show="showEditDialog"
           :picture="editing_data.picture"
           :title="editing_data.title"
-          :artist="editing_data.artist"
+          :artist="joinedArtist"
           :album="editing_data.album"
           :albumartist="editing_data.albumartist"
-          :genre="editing_data.genre"
+          :genre="joinedGenre"
           @cancel="showEditDialog = false"
           @ok="handleEdit"
         ></edit-dialog>
@@ -78,7 +78,19 @@ export default {
     return {
       showConfigDialog: false,
       showEditDialog: false,
-      editing_data: { picture: '', title: '', artist: '', album: '', albumartist: '', genre: '' },
+      editing_data: {
+        picture: '',
+        title: '',
+        artist: [''],
+        album: '',
+        albumartist: '',
+        genre: [''],
+        ext: '',
+        blob: Blob,
+        index: 0
+      },
+      joinedArtist: "",
+      joinedGenre: "",
       tableData: [],
       playing_url: '',
       playing_auto: false,
@@ -160,7 +172,11 @@ export default {
       }
       this.editing_data.title = data.title;
       this.editing_data.artist = data.artist;
+      this.joinedArtist = data.artist.join();
       this.editing_data.album = data.album;
+      this.editing_data.albumartist = data.albumartist;
+      this.editing_data.genre = data.genre;
+      this.joinedGenre = data.genre.join();
       let writeSuccess = true;
       let notifyMsg = '成功修改 ' + this.editing_data.title;
       try {
@@ -175,10 +191,10 @@ export default {
         const newMeta = {
           picture: imageInfo?.buffer,
           title: data.title,
-          artists: data.artist.split(split_regex),
+          artists: data.artist,
           album: data.album,
           albumartist: data.albumartist,
-          genre: data.genre.split(split_regex),
+          genre: data.genre,
         };
         const buffer = Buffer.from(await this.editing_data.blob.arrayBuffer());
         const mime = AudioMimeType[this.editing_data.ext] || AudioMimeType.mp3;
@@ -195,6 +211,9 @@ export default {
         notifyMsg = '修改' + this.editing_data.title + '未能完成。在写入新的元数据时发生错误：' + e;
       }
       this.editing_data.file = URL.createObjectURL(this.editing_data.blob);
+      let dataIndex = this.editing_data.index;
+      delete this.editing_data.index;
+      this.tableData.splice(dataIndex, 1, this.editing_data)
       if (writeSuccess === true) {
         this.$notify.success({
           title: '修改成功',
@@ -216,14 +235,14 @@ export default {
       }
     },
 
-    async editFile(data) {
-      this.editing_data.picture = data.picture;
-      this.editing_data.title = data.title
-      this.editing_data.artist = data.artist.join()
-      this.editing_data.album = data.album
+    async editFile(index, data) {
+      this.editing_data = data;
       const musicMeta = await metaParseBlob(data.blob);
       this.editing_data.albumartist = musicMeta.common.albumartist || '';
-      this.editing_data.genre = musicMeta.common.genre?.join() || '';
+      this.editing_data.genre = musicMeta.common.genre || [''];
+      this.joinedArtist = this.editing_data.artist.join();
+      this.joinedGenre = this.editing_data.genre.join();
+      this.editing_data.index = index;
       this.showEditDialog = true;
     },
     async saveFile(data) {