Merge branch 'main' of https://github.com/Encaik/wanjie

src/app/app.component.ts

@@ -9,6 +9,7 @@ import { InitModalComponent } from './components/init-modal/init-modal.component
 import { CharacterComponent } from './layouts/character/character.component';
 import { HeaderComponent } from './layouts/header/header.component';
 import { SiderComponent } from './layouts/sider/sider.component';
+import { TASKS } from './models';
 import { HomeComponent } from './pages/home/home.component';
 import { UniverseComponent } from './pages/universe/universe.component';
 import { RuntimeService } from './services/runtime.service';
@@ -34,7 +35,7 @@ export class AppComponent implements OnInit {
   ngOnInit() {
     this.rtSrv.load().then(data => {
       if (data) {
-        this.rtSrv.init(data.runtimeData, data.characterData, data.envData, data.backpackData);
+        this.rtSrv.init(data);
       } else {
         this.init();
       }
@@ -60,7 +61,13 @@ export class AppComponent implements OnInit {
         nzWidth: '1000px'
       })
       .afterClose.subscribe(({ character, env }) => {
-        this.rtSrv.init({ tick: Math.round(Math.random() * 100) }, character, env);
+        this.rtSrv.init({
+          runtimeData: { tick: Math.round(Math.random() * 100) },
+          characterData: character,
+          envData: env,
+          backpackData: [],
+          taskData: '1'
+        });
       });
   }
 

src/app/app.routes.ts

@@ -2,9 +2,9 @@ import { Routes } from '@angular/router';
 
 import { startPageGuard } from './guards/start-page.guard';
 import { HomeComponent } from './pages/home/home.component';
-import { UniverseComponent } from './pages/universe/universe.component';
 import { MethodComponent } from './pages/method/method.component';
 import { ShopComponent } from './pages/shop/shop.component';
+import { UniverseComponent } from './pages/universe/universe.component';
 
 export const routes: Routes = [
   { path: '', redirectTo: '/home', pathMatch: 'full' },

src/app/components/bag-item-view/bag-item-view.component.ts

@@ -2,11 +2,11 @@ import { CommonModule } from '@angular/common';
 import { Component, inject, Input } from '@angular/core';
 import { NzButtonModule } from 'ng-zorro-antd/button';
 import { NzCardModule } from 'ng-zorro-antd/card';
-import { BagItem, getItemLevelClass, ItemLevelMap, ItemMap } from '../../models/item.model';
 import { NzMessageModule, NzMessageService } from 'ng-zorro-antd/message';
 import { NzPopoverModule } from 'ng-zorro-antd/popover';
 
 import { LogType, LogLevel } from '../../models';
+import { BagItem, getItemLevelClass, ItemLevelMap, ItemMap } from '../../models/item.model';
 import { BackpackService } from '../../services/backpack.service';
 import { LogService } from '../../services/log.service';
 

src/app/components/reward-item-view/reward-item-view.component.spec.ts

@@ -1,23 +1,22 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { RewardItemViewComponent } from './reward-item-view.component';
-
-describe('RewardItemViewComponent', () => {
-  let component: RewardItemViewComponent;
-  let fixture: ComponentFixture<RewardItemViewComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [RewardItemViewComponent]
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(RewardItemViewComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { RewardItemViewComponent } from './reward-item-view.component';
+
+describe('RewardItemViewComponent', () => {
+  let component: RewardItemViewComponent;
+  let fixture: ComponentFixture<RewardItemViewComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [RewardItemViewComponent]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(RewardItemViewComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/components/reward-item-view/reward-item-view.component.ts

@@ -1,7 +1,8 @@
-import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
-import { getItemLevelClass, Item, ItemLevelMap, ItemMap, RewardPool } from '../../models';
-import { NzCardModule } from 'ng-zorro-antd/card';
 import { CommonModule } from '@angular/common';
+import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
+import { NzCardModule } from 'ng-zorro-antd/card';
+
+import { getItemLevelClass, Item, ItemLevelMap, ItemMap, RewardPool } from '../../models';
 
 @Component({
   selector: 'app-reward-item-view',
@@ -11,7 +12,7 @@ import { CommonModule } from '@angular/common';
   styleUrl: './reward-item-view.component.less',
   changeDetection: ChangeDetectionStrategy.OnPush
 })
-export class RewardItemViewComponent {
+export class RewardItemViewComponent implements OnInit {
   @Input() reward: RewardPool = [];
 
   rewardItems: Item[] = [];

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

@@ -1,2 +1,27 @@
 <h5 nz-typography class="underline decoration-sky-500">任务面板</h5>
-<div class="flex-1 p-4 border-gray-300 border rounded overflow-auto"> </div>
+<div class="flex-1 p-4 border-gray-300 border rounded overflow-auto">
+  @if (currentTask) {
+    <div class="h-full flex flex-col justify-between items-center">
+      <div class="gap-2 w-full">
+        <h5 nz-typography>{{ currentTask.title }}</h5>
+        <p>任务描述：{{ currentTask.description }}</p>
+        <p>
+          任务奖励：
+          @for (reward of currentTask.rewards; track $index) {
+            <span class="mr-2">{{ ItemMap[reward.id].name }} * {{ reward.count }}</span>
+          }
+        </p>
+        <p>完成情况：{{ currentTask.isCompleted ? '已完成' : '未完成' }}</p>
+      </div>
+      <div>
+        @if (currentTask.isCompleted) {
+          <button nz-button (click)="onGetRewardClick()">获得奖励</button>
+        }
+      </div>
+    </div>
+  } @else {
+    <div class="w-full h-full flex justify-center items-center">
+      <nz-empty nzNotFoundContent="当前无任务"></nz-empty>
+    </div>
+  }
+</div>

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

@@ -1,10 +1,54 @@
-import { Component } from '@angular/core';
+import { Component, inject, OnInit } from '@angular/core';
+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 { BackpackService } from '../../../../services/backpack.service';
+import { LogService } from '../../../../services/log.service';
+import { StatisticsService } from '../../../../services/statistics.service';
+import { TaskService } from '../../../../services/task.service';
+
 @Component({
   selector: 'app-task',
   standalone: true,
-  imports: [NzTypographyModule],
+  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)
+      );
+    });
+  }
+
+  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/layouts/sider/sider.component.html

@@ -1,4 +1,4 @@
-<div class="h-full flex flex-col overflow-auto p-2 bg-white rounded shadow-md shadow-gray-200">
+<div class="h-full flex flex-col overflow-auto gap-2 p-2 bg-white rounded shadow-md shadow-gray-200">
   <app-log class="flex-1 flex flex-col overflow-auto" />
   <app-task class="min-h-96 flex flex-col" />
 </div>

src/app/models/index.ts

@@ -1,8 +1,11 @@
-export * from './character.model';
-export * from './env.model';
-export * from './log.model';
-export * from './buff.model';
-export * from './battle.model';
-export * from './challenge.model';
-export * from './reward.model';
-export * from './item.model';
+export * from './battle.model'; // 战斗
+export * from './buff.model'; // buff
+export * from './challenge.model'; // 副本
+export * from './character.model'; // 角色
+export * from './env.model'; // 环境
+export * from './item.model'; // 物品
+export * from './log.model'; // 日志
+export * from './reward.model'; // 奖励池
+export * from './runtime.model'; // 运行时
+export * from './statistics.model'; // 统计
+export * from './task.model'; // 任务

src/app/models/runtime.model.ts

@@ -0,0 +1,12 @@
+import { Character } from './character.model';
+import { Env } from './env.model';
+import { BagItem } from './item.model';
+import { Task } from './task.model';
+
+export interface StorageData {
+  runtimeData: { tick: number }; // 时间刻
+  characterData: Character; // 角色信息
+  envData: Env; // 环境信息
+  backpackData: BagItem[]; // 背包信息
+  taskData: string; // 任务信息
+}

src/app/models/statistics.model.ts

@@ -0,0 +1,13 @@
+export interface CharacterStatistics {
+  cultivationCount: number;
+}
+
+export interface StatisticsEvent {
+  type: StatisticsEventType;
+  field: string;
+  count: number;
+}
+
+export enum StatisticsEventType {
+  Character
+}

src/app/models/task.model.ts

@@ -0,0 +1,51 @@
+import { inject } from '@angular/core';
+
+import { StatisticsService } from '../services/statistics.service';
+import { StatisticsEvent, StatisticsEventType } from './statistics.model';
+
+export interface Task {
+  id: number;
+  nextId: number;
+  title: string;
+  description: string;
+  rewards: TaskReward[];
+  isCompleted: boolean;
+  conditions: StatisticsEvent[];
+}
+
+export interface TaskReward {
+  id: string;
+  count: number;
+}
+
+export const TASKS: Record<string, Task> = {
+  1: {
+    id: 1,
+    nextId: 2,
+    title: '开始修炼',
+    description: '点击开始修炼按钮，完成第一次修炼',
+    rewards: [
+      {
+        id: '1',
+        count: 100
+      }
+    ],
+    isCompleted: false,
+    conditions: [
+      {
+        type: StatisticsEventType.Character,
+        field: 'cultivationCount',
+        count: 1
+      }
+    ]
+  },
+  2: {
+    id: 2,
+    nextId: 3,
+    title: 'Task 2',
+    description: 'This is the second task',
+    rewards: [],
+    isCompleted: false,
+    conditions: []
+  }
+};

src/app/pages/challenge/challenge.component.ts

@@ -1,11 +1,12 @@
 import { Component, inject } from '@angular/core';
-import { Challenge, RewardPoolMap } from '../../models';
+import { Router } from '@angular/router';
+import { NzButtonModule } from 'ng-zorro-antd/button';
 import { NzCardModule } from 'ng-zorro-antd/card';
+import { NzTagModule } from 'ng-zorro-antd/tag';
+
 import { RewardItemViewComponent } from '../../components/reward-item-view/reward-item-view.component';
+import { Challenge, RewardPoolMap } from '../../models';
 import { EnvService } from '../../services/env.service';
-import { NzTagModule } from 'ng-zorro-antd/tag';
-import { NzButtonModule } from 'ng-zorro-antd/button';
-import { Router } from '@angular/router';
 
 @Component({
   selector: 'app-challenge',

src/app/pages/challenge/pages/explore/explore.component.spec.ts

@@ -1,23 +1,22 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { ExploreComponent } from './explore.component';
-
-describe('ExploreComponent', () => {
-  let component: ExploreComponent;
-  let fixture: ComponentFixture<ExploreComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [ExploreComponent]
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(ExploreComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ExploreComponent } from './explore.component';
+
+describe('ExploreComponent', () => {
+  let component: ExploreComponent;
+  let fixture: ComponentFixture<ExploreComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ExploreComponent]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(ExploreComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/pages/challenge/pages/quick-explore/quick-explore.component.less

@@ -0,0 +1,5 @@
+:host {
+  flex: 1;
+  height: 0;
+  overflow: auto;
+}