解析上传xml文件

src/views/accompaniment/modals/form.vue

@@ -297,9 +297,32 @@
                 tips="仅支持上传 xml 格式文件"
                 accept=".xml"
                 v-model="song.xmlUrl"
+                @inputFile="inputFile"
               />
             </el-form-item>
           </el-col>
+          <el-col :span="12" v-if="partListNames.length > 1">
+            <el-form-item
+              label="所属轨道"
+              :prop="`sysMusicScoreAccompaniments.${index}.track`"
+              :rules="[{ required: true, message: '请选择所属轨道' }]"
+            >
+              <el-select
+                style="width: 100% !important"
+                v-model="song.track"
+                clearable
+                placeholder="请选择轨道"
+              >
+                <el-option
+                  v-for="item in partListNames"
+                  :value="item"
+                  :label="item"
+                  :key="item"
+                  :disabled="hasPartName(item)"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
         </el-row>
         <el-button
           class="file-remove"
@@ -330,6 +353,7 @@ export default {
   props: ["detail", "type"],
   data() {
     return {
+      partListNames: [],
       tree: [],
       memberRankList: [], // 会员列表
       form: {
@@ -357,6 +381,7 @@ export default {
             xmlUrl: "",
             isShowFingering: null,
             mome: "",
+            track: ""
           },
         ],
         delExamSongAccompanimentIds: [],
@@ -398,6 +423,33 @@ export default {
     }
   },
   methods: {
+    getPartListNames(xml) {
+      if (!xml) return []
+      const xmlParse = new DOMParser().parseFromString(xml, 'text/xml')
+      const partList = xmlParse.getElementsByTagName('part-list')?.[0]?.getElementsByTagName('score-part') || []
+      const partListNames = Array.from(partList).map(item => item.getElementsByTagName('part-name')?.[0].textContent || '')
+      return partListNames
+    },
+    inputFile(file) {
+      const xmlRead = new FileReader()
+      xmlRead.onload = res => {
+        this.partListNames = this.getPartListNames(res.target.result)
+        for (let j = 0; j < this.form.sysMusicScoreAccompaniments.length; j++) {
+          this.form.sysMusicScoreAccompaniments[j].track =  this.partListNames[j]
+          this.$set(this.form, 'sysMusicScoreAccompaniments', this.form.sysMusicScoreAccompaniments)
+        }
+        for (let index = this.form.sysMusicScoreAccompaniments.length; index < this.partListNames.length; index++) {
+          const part = this.partListNames[index]
+          this.createSys({
+            ...this.form.sysMusicScoreAccompaniments[0],
+            metronomeMp3Url: "",
+            mp3Url: "",
+            track: part,
+          })
+        }
+      }
+      xmlRead.readAsText(file.raw)
+    },
     rankChange(value) {
       if (value) {
         let tempIds = [];
@@ -466,13 +518,14 @@ export default {
         this.$set(this.form, "sysMusicScoreAccompaniments", result);
       } catch (error) {}
     },
-    createSys() {
-      this.form.sysMusicScoreAccompaniments.push({
+    createSys(initData) {
+      this.form.sysMusicScoreAccompaniments.push(Object.assign({
         subjectId: "",
         speed: "",
         mp3Url: "",
         xmlUrl: "",
-      });
+        track: "",
+      }, (initData || {})));
     },
     async removeSys(index) {
       try {
@@ -488,6 +541,13 @@ export default {
         this.form.sysMusicScoreAccompaniments.splice(index, 1);
       } catch (error) {}
     },
+    hasPartName(name) {
+      const names = [];
+      for (const item of this.form.sysMusicScoreAccompaniments) {
+        names.push(item.track);
+      }
+      return names.includes(name);
+    },
     hasSubjectId(id) {
       const ids = [];
       for (const item of this.form.sysMusicScoreAccompaniments) {