feat(任务): 任务组件的更新包括显示任务条件和完成状态

src/app/layouts/sider/components/task/task.component.html

@@ -11,11 +11,17 @@ <h5 nz-typography>{{ currentTask.title }}</h5>
             <span class="mr-2">{{ ItemMap[reward.id].name }} * {{ reward.count }}</span>
           }
         </p>
+        <p>
+          任务目标：
+          @for (condition of currentTask.conditions; track $index) {
+            <span class="mr-2">{{ condition.title }}({{ condition.current }}/{{ condition.goal }})</span>
+          }
+        </p>
         <p>完成情况：{{ currentTask.isCompleted ? '已完成' : '未完成' }}</p>
       </div>
       <div>
         @if (currentTask.isCompleted) {
-          <!-- <button nz-button (click)="onGetRewardClick()">获得奖励</button> -->
+          <button nz-button (click)="onGetRewardClick()">获得奖励</button>
         }
       </div>
     </div>

src/app/layouts/sider/components/task/task.component.ts

@@ -3,10 +3,9 @@ import { NzButtonModule } from 'ng-zorro-antd/button';
 import { NzEmptyModule } from 'ng-zorro-antd/empty';
 import { NzTypographyModule } from 'ng-zorro-antd/typography';
 
-import { getItemLevelClass, ItemMap, LogLevel, LogType, Task } from '../../../../models';
+import { Task, ItemMap, getItemLevelClass, LogLevel, LogType } from '../../../../models';
 import { BackpackService } from '../../../../services/backpack.service';
 import { LogService } from '../../../../services/log.service';
-import { StatisticsService } from '../../../../storages/statistics.service';
 import { TaskService } from '../../../../services/task.service';
 
 @Component({
@@ -15,40 +14,30 @@ import { TaskService } from '../../../../services/task.service';
   imports: [NzTypographyModule, NzEmptyModule, NzButtonModule],
   templateUrl: './task.component.html'
 })
-export class TaskComponent {
+export class TaskComponent implements OnInit {
   private taskSrv = inject(TaskService);
-  private statisticsService = inject(StatisticsService);
   private backpackSrv = inject(BackpackService);
   private logSrv = inject(LogService);
   currentTask: Task | undefined;
   ItemMap = ItemMap;
 
-  // ngOnInit(): void {
-  //   this.taskSrv.task$.subscribe(task => (this.currentTask = task));
-  //   this.statisticsService.statistics$.subscribe(event => {
-  //     if (!this.currentTask) return;
-  //     this.currentTask.isCompleted = this.currentTask.conditions.every(
-  //       condition =>
-  //         condition.type === event.type &&
-  //         condition.field === event.field &&
-  //         condition.count <= this.statisticsService.getValue(condition.type, condition.field)
-  //     );
-  //   });
-  // }
+  ngOnInit(): void {
+    this.taskSrv.task$.subscribe(task => (this.currentTask = task));
+  }
 
-  // onGetRewardClick() {
-  //   if (!this.currentTask) return;
-  //   let msg: string = '';
-  //   this.currentTask.rewards.forEach(reward => {
-  //     const item = ItemMap[reward.id];
-  //     this.backpackSrv.addItem(item, reward.count);
-  //     msg += `<span class="${getItemLevelClass(item.level)}">${item.name}</span> * ${reward.count} `;
-  //   });
-  //   this.logSrv.log({
-  //     msg: `完成任务，获得奖励:${msg}`,
-  //     type: LogType.Item,
-  //     level: LogLevel.Info
-  //   });
-  //   this.currentTask && this.taskSrv.complatedTask(this.currentTask);
-  // }
+  onGetRewardClick() {
+    if (!this.currentTask) return;
+    let msg: string = '';
+    this.currentTask.rewards.forEach(reward => {
+      const item = ItemMap[reward.id];
+      this.backpackSrv.addItem(item, reward.count);
+      msg += `<span class="${getItemLevelClass(item.level)}">${item.name}</span> * ${reward.count} `;
+    });
+    this.logSrv.log({
+      msg: `完成任务，获得奖励:${msg}`,
+      type: LogType.Item,
+      level: LogLevel.Info
+    });
+    this.currentTask && this.taskSrv.complatedTask(this.currentTask);
+  }
 }

src/app/models/task.model.ts

@@ -1,11 +1,20 @@
+import { CharacterEventOperate, EventType, Event } from './event.model';
+
 export interface Task {
   id: number;
   nextId: number;
   title: string;
   description: string;
   rewards: TaskReward[];
   isCompleted: boolean;
-  conditions: any[];
+  conditions: TaskCondition[];
+}
+
+export interface TaskCondition {
+  title: string;
+  event: Event;
+  current: number;
+  goal: number;
 }
 
 export interface TaskReward {
@@ -26,7 +35,18 @@ export const TASKS: Record<string, Task> = {
       }
     ],
     isCompleted: false,
-    conditions: []
+    conditions: [
+      {
+        title: '完成修炼',
+        event: {
+          type: EventType.Character,
+          operate: CharacterEventOperate.Cultivation,
+          data: null
+        },
+        current: 0,
+        goal: 1
+      }
+    ]
   },
   2: {
     id: 2,

src/app/pages/home/home.component.ts

@@ -6,16 +6,16 @@ import { NzTypographyModule } from 'ng-zorro-antd/typography';
 
 import { BattleModalComponent } from '../../components/battle-modal/battle-modal.component';
 import { LogType, LogLevel, BattleCharacter } from '../../models';
+import { CharacterEventOperate, EventType } from '../../models/event.model';
 import { ItemMap } from '../../models/item.model';
 import { BackpackService } from '../../services/backpack.service';
 import { CharacterService } from '../../services/character.service';
 import { EnvService } from '../../services/env.service';
+import { EventService } from '../../services/event.service';
 import { LogService } from '../../services/log.service';
 import { RuntimeService } from '../../services/runtime.service';
 import { Generate } from '../../utils/generate';
 import { BackpackComponent } from './components/backpack/backpack.component';
-import { EventService } from '../../services/event.service';
-import { CharacterEventOperate, EventType } from '../../models/event.model';
 
 @Component({
   selector: 'app-home',
@@ -51,8 +51,6 @@ export class HomeComponent implements OnInit {
         data: null
       })
       .then(isUpgrade => {
-        console.log(isUpgrade);
-
         this.rtSrv.nextTimeTick();
         if (isUpgrade) {
           this.isUpgrade = true;

src/app/services/event.service.ts

@@ -1,7 +1,9 @@
 import { inject, Injectable } from '@angular/core';
 import { Subject } from 'rxjs';
+
 import { Event, EventType } from '../models/event.model';
 import { CharacterService } from './character.service';
+import { TaskService } from './task.service';
 
 @Injectable({
   providedIn: 'root'
@@ -10,10 +12,12 @@ export class EventService {
   event: Subject<Event> = new Subject();
   event$ = this.event.asObservable();
 
+  private taskSrv = inject(TaskService);
   private characterSrv = inject(CharacterService);
 
   sendEvent(event: Event): Promise<any> {
     this.event.next(event);
+    this.taskSrv.update(event);
     return new Promise(resolve => {
       switch (event.type) {
         case EventType.Character:

src/app/services/task.service.ts

@@ -2,6 +2,7 @@ import { Injectable } from '@angular/core';
 import { Subject } from 'rxjs';
 
 import { Task, TASKS } from '../models';
+import { Event } from '../models/event.model';
 
 @Injectable({
   providedIn: 'root'
@@ -11,6 +12,25 @@ export class TaskService {
   taskSub: Subject<Task> = new Subject();
   task$ = this.taskSub.asObservable();
 
+  update(event: Event) {
+    let isCompleted = true;
+    this.currentTask?.conditions?.forEach(condition => {
+      if (this.isEqual(condition.event, event)) {
+        condition.current++;
+      }
+      if (condition.current < condition.goal) {
+        isCompleted = false;
+      }
+    });
+    if (this.currentTask) {
+      this.currentTask.isCompleted = isCompleted;
+    }
+  }
+
+  isEqual(obj1: any, obj2: any): boolean {
+    return JSON.stringify(obj1) === JSON.stringify(obj2);
+  }
+
   complatedTask(task: Task): void {
     const nextTask = TASKS[task.nextId] || undefined;
     if (!nextTask) return;