增加功能页面

angular.json

@@ -136,7 +136,8 @@
   "cli": {
     "schematicCollections": [
       "@ionic/angular-toolkit"
-    ]
+    ],
+    "analytics": false
   },
   "schematics": {
     "@ionic/angular-toolkit:component": {

package.json

@@ -27,6 +27,7 @@
     "@capacitor/keyboard": "6.0.3",
     "@capacitor/status-bar": "6.0.2",
     "@ionic/angular": "^8.0.0",
+    "fmode-ng": "^0.0.63",
     "ionicons": "^7.0.0",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",

src/app/api.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { ApiService } from './api.service';
+
+describe('ApiService', () => {
+  let service: ApiService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(ApiService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

src/app/api.service.ts

@@ -0,0 +1,18 @@
+import { Injectable } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { Observable } from 'rxjs';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ApiService {
+  private apiUrl = 'http://localhost:5000/api'; // 后端API地址
+
+  constructor(private http: HttpClient) {}
+
+  getSchedules(): Observable<any> {
+    return this.http.get(`${this.apiUrl}/schedules`);
+  }
+
+  // 其他API请求方法...
+}

src/app/app-routing.module.ts

@@ -1,22 +1,43 @@
 import { NgModule } from '@angular/core';
 import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
 
+// 定义应用的路由配置
 const routes: Routes = [
   {
-    path: 'home',
-    loadChildren: () => import('./home/home.module').then( m => m.HomePageModule)
+    path: 'home', // 路由路径为 '/home'
+    loadChildren: () => import('./home/home.module').then(m => m.HomePageModule) // 懒加载 HomeModule
   },
   {
-    path: '',
-    redirectTo: 'home',
-    pathMatch: 'full'
+    path: '', // 默认路径
+    redirectTo: 'home', // 重定向到 'home'
+    pathMatch: 'full' // 完全匹配
   },
+  {
+    path: 'schedule', // 路由路径为 '/schedule'
+    loadChildren: () => import('./schedule/schedule.module').then(m => m.SchedulePageModule) // 懒加载 ScheduleModule
+  },
+  {
+    path: 'task', // 路由路径为 '/task'
+    loadChildren: () => import('./task/task.module').then(m => m.TaskPageModule) // 懒加载 TaskModule
+  },
+  {
+    path: 'reminders', // 路由路径为 '/reminders'
+    loadChildren: () => import('./reminders/reminders.module').then(m => m.RemindersPageModule) // 懒加载 RemindersModule
+  },
+  {
+    path: 'settings', // 路由路径为 '/settings'
+    loadChildren: () => import('./settings/settings.module').then(m => m.SettingsPageModule) // 懒加载 SettingsModule
+  },
+  {
+    path: '**', // 处理未匹配的路径
+    redirectTo: 'home' // 重定向到 'home'
+  }
 ];
 
 @NgModule({
   imports: [
-    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
+    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules }) // 配置路由
   ],
-  exports: [RouterModule]
+  exports: [RouterModule] // 导出 RouterModule
 })
-export class AppRoutingModule { }
+export class AppRoutingModule { }

src/app/reminders/reminders-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { RemindersPage } from './reminders.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: RemindersPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class RemindersPageRoutingModule {}

src/app/reminders/reminders.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { RemindersPageRoutingModule } from './reminders-routing.module';
+
+import { RemindersPage } from './reminders.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    RemindersPageRoutingModule
+  ],
+  declarations: [RemindersPage]
+})
+export class RemindersPageModule {}

src/app/reminders/reminders.page.html

@@ -0,0 +1,13 @@
+<ion-header [translucent]="true">
+  <ion-toolbar>
+    <ion-title>reminders</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+  <ion-header collapse="condense">
+    <ion-toolbar>
+      <ion-title size="large">reminders</ion-title>
+    </ion-toolbar>
+  </ion-header>
+</ion-content>

src/app/reminders/reminders.page.spec.ts

@@ -0,0 +1,17 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { RemindersPage } from './reminders.page';
+
+describe('RemindersPage', () => {
+  let component: RemindersPage;
+  let fixture: ComponentFixture<RemindersPage>;
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(RemindersPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/reminders/reminders.page.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-reminders',
+  templateUrl: './reminders.page.html',
+  styleUrls: ['./reminders.page.scss'],
+})
+export class RemindersPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/app/schedule/schedule-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { SchedulePage } from './schedule.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: SchedulePage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class SchedulePageRoutingModule {}

src/app/schedule/schedule.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { SchedulePageRoutingModule } from './schedule-routing.module';
+
+import { SchedulePage } from './schedule.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    SchedulePageRoutingModule
+  ],
+  declarations: [SchedulePage]
+})
+export class SchedulePageModule {}

src/app/schedule/schedule.page.html

@@ -0,0 +1,13 @@
+<ion-header [translucent]="true">
+  <ion-toolbar>
+    <ion-title>schedule</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+  <ion-header collapse="condense">
+    <ion-toolbar>
+      <ion-title size="large">schedule</ion-title>
+    </ion-toolbar>
+  </ion-header>
+</ion-content>

src/app/schedule/schedule.page.spec.ts

@@ -0,0 +1,17 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { SchedulePage } from './schedule.page';
+
+describe('SchedulePage', () => {
+  let component: SchedulePage;
+  let fixture: ComponentFixture<SchedulePage>;
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SchedulePage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/schedule/schedule.page.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-schedule',
+  templateUrl: './schedule.page.html',
+  styleUrls: ['./schedule.page.scss'],
+})
+export class SchedulePage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/app/settings/settings-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { SettingsPage } from './settings.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: SettingsPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class SettingsPageRoutingModule {}

src/app/settings/settings.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { SettingsPageRoutingModule } from './settings-routing.module';
+
+import { SettingsPage } from './settings.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    SettingsPageRoutingModule
+  ],
+  declarations: [SettingsPage]
+})
+export class SettingsPageModule {}

src/app/settings/settings.page.html

@@ -0,0 +1,13 @@
+<ion-header [translucent]="true">
+  <ion-toolbar>
+    <ion-title>settings</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+  <ion-header collapse="condense">
+    <ion-toolbar>
+      <ion-title size="large">settings</ion-title>
+    </ion-toolbar>
+  </ion-header>
+</ion-content>

src/app/settings/settings.page.spec.ts

@@ -0,0 +1,17 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { SettingsPage } from './settings.page';
+
+describe('SettingsPage', () => {
+  let component: SettingsPage;
+  let fixture: ComponentFixture<SettingsPage>;
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SettingsPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/settings/settings.page.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-settings',
+  templateUrl: './settings.page.html',
+  styleUrls: ['./settings.page.scss'],
+})
+export class SettingsPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/app/task/task-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { TaskPage } from './task.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: TaskPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class TaskPageRoutingModule {}

src/app/task/task.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { TaskPageRoutingModule } from './task-routing.module';
+
+import { TaskPage } from './task.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    TaskPageRoutingModule
+  ],
+  declarations: [TaskPage]
+})
+export class TaskPageModule {}

src/app/task/task.page.html

@@ -0,0 +1,13 @@
+<ion-header [translucent]="true">
+  <ion-toolbar>
+    <ion-title>task</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+  <ion-header collapse="condense">
+    <ion-toolbar>
+      <ion-title size="large">task</ion-title>
+    </ion-toolbar>
+  </ion-header>
+</ion-content>

src/app/task/task.page.spec.ts

@@ -0,0 +1,17 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { TaskPage } from './task.page';
+
+describe('TaskPage', () => {
+  let component: TaskPage;
+  let fixture: ComponentFixture<TaskPage>;
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TaskPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/task/task.page.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-task',
+  templateUrl: './task.page.html',
+  styleUrls: ['./task.page.scss'],
+})
+export class TaskPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}