finish

src/app/ygopro/ygopro.component.html

@@ -26,9 +26,9 @@
   </div>
   <div class="col-sm-8 input-group input-group-sm">
     <label i18n class="input-group-text" id="basic-addon1">卡组</label>
-    <select class="form-select form-select-sm" id="exampleSelect1" name="deck" [(ngModel)]="currentDeck">
+    <select class="form-select form-select-sm" id="exampleSelect1" name="deck" [(ngModel)]="currentDeckSymbol" (change)="onDeckChange()">
       <optgroup *ngFor="let group of decks_grouped" [label]="group[0] === '.' ? '未分类卡组' : group[0]">
-        <option *ngFor="let deck of group[1]" [value]="deck">{{deck.deck}}</option>
+        <option *ngFor="let deck of group[1]" [value]="deck.symbol">{{deck.deck}}</option>
       </optgroup>
     </select>
     <span class="input-group-btn">

src/app/ygopro/ygopro.component.ts

@@ -112,9 +112,24 @@ let matching: Subscription | undefined;
 let matching_arena: string | undefined;
 let match_started_at: Date;
 
-export interface DeckAndCategory {
+export class DeckAndCategory {
   category: string;
   deck: string;
+  get param() {
+    return {
+      category: this.category === '.' ? '': this.category,
+      deck: this.deck
+    }
+  }
+
+  get symbol() {
+    return `${this.category}/${this.deck}`;
+  }
+
+  set symbol(str: string) {
+    this.category = path.dirname(str);
+    this.deck = path.basename(str, '.ydk');
+  }
 }
 
 @Component({
@@ -135,6 +150,7 @@ export class YGOProComponent implements OnInit, OnDestroy {
   decks_grouped: [string, DeckAndCategory[]][];
   replays: string[] = [];
   currentDeck: DeckAndCategory;
+  currentDeckSymbol: string;
 
   system_conf?: string;
   numfont: string[];
@@ -441,11 +457,15 @@ export class YGOProComponent implements OnInit, OnDestroy {
     });
   }
 
+  onDeckChange() {
+    this.currentDeck = this.getDeckObject(this.currentDeckSymbol);
+    console.log(`Current deck changed to ${this.currentDeck.symbol}`);
+  }
 
   async refresh(init?: boolean) {
     this.decks = await this.get_decks();
     this.decks_grouped = this.deckGroup();
-    const allDecks = _.flatten(this.decks_grouped.map(g => g[1]));
+    const allDecks = this.decks;
     if (this.lastDeckFormat) {
       const systemConfString = await this.load_system_conf();
 
@@ -488,6 +508,10 @@ export class YGOProComponent implements OnInit, OnDestroy {
       this.currentDeck = allDecks[0];
     }
 
+    if(this.currentDeck) {
+      this.currentDeckSymbol = this.currentDeck.symbol;
+    }
+
     this.replays = await this.get_replays();
 
     // https://mycard.moe/ygopro/api/user?username=ozxdno
@@ -514,10 +538,9 @@ export class YGOProComponent implements OnInit, OnDestroy {
   }
 
   getDeckObject(deckPath: string) {
-    return {
-      deck: path.basename(deckPath, '.ydk'),
-      category: path.dirname(deckPath)
-    }
+    const deck = new DeckAndCategory();
+    deck.symbol = deckPath;
+    return deck;
   }
 
   deckGroup(): [string, DeckAndCategory[]][] {