cpy 5 月之前
父節點
當前提交
32824ccdbc
共有 2 個文件被更改,包括 112 次插入145 次删除
  1. 58 51
      sport-app/src/app/tab2/tab2.page.html
  2. 54 94
      sport-app/src/app/tab2/tab2.page.ts

+ 58 - 51
sport-app/src/app/tab2/tab2.page.html

@@ -1,51 +1,58 @@
-<ion-header [translucent]="true">
-  <ion-toolbar>
-    <ion-title>
-      生成个性化运动计划
-    </ion-title>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content>
-  <!-- 用户输入身高 -->
-  <ion-item>
-    <ion-label position="floating">身高 (cm)</ion-label>
-    <ion-input [(ngModel)]="userHeight" type="number" placeholder="请输入身高" required></ion-input>
-  </ion-item>
-
-  <!-- 用户输入体重 -->
-  <ion-item>
-    <ion-label position="floating">体重 (kg)</ion-label>
-    <ion-input [(ngModel)]="userWeight" type="number" placeholder="请输入体重" required></ion-input>
-  </ion-item>
-
-  <!-- 用户选择健身目标 -->
-  <ion-item>
-    <ion-label position="floating">健身目标</ion-label>
-    <ion-select [(ngModel)]="userGoal" placeholder="请选择健身目标" required>
-      <ion-select-option value="增肌">增肌</ion-select-option>
-      <ion-select-option value="减脂">减脂</ion-select-option>
-      <ion-select-option value="保持体形">保持体形</ion-select-option>
-    </ion-select>
-  </ion-item>
-
-  <!-- 用户输入兴趣爱好 -->
-  <ion-item>
-    <ion-label position="floating">兴趣爱好</ion-label>
-    <ion-textarea [(ngModel)]="userInterest" placeholder="请输入你的兴趣爱好" rows="3" autoGrow="true" required></ion-textarea>
-  </ion-item>
-
-  <!-- 执行生成运动计划的按钮 -->
-  <ion-button (click)="generateWorkoutPlan()" expand="block">生成运动计划</ion-button>
-  
-  <!-- 展示生成的运动计划 -->
-  <div *ngIf="workoutPlan">
-    <h2>个性化运动计划</h2>
-    <p>{{ workoutPlan }}</p>
-  </div>
-
-  <!-- 错误消息展示 -->
-  <div *ngIf="errorMessage" style="color: red;">
-    <p>{{ errorMessage }}</p>
-  </div>
-</ion-content>
+<ion-header>
+      <ion-toolbar>
+        <ion-title>运动计划生成</ion-title>
+      </ion-toolbar>
+    </ion-header>
+    
+    <ion-content>
+      <!-- 输入字段 -->
+      <ion-item>
+        <ion-label position="floating">体重</ion-label>
+        <ion-input [(ngModel)]="userWeight" type="number" placeholder="请输入您的体重"></ion-input>
+      </ion-item>
+      
+      <ion-item>
+        <ion-label position="floating">身高</ion-label>
+        <ion-input [(ngModel)]="userHeight" type="number" placeholder="请输入您的身高"></ion-input>
+      </ion-item>
+    
+      <ion-item>
+        <ion-label position="floating">运动偏好</ion-label>
+        <ion-select [(ngModel)]="userPreference" placeholder="选择您的运动偏好">
+          <ion-select-option value="跑步">跑步</ion-select-option>
+          <ion-select-option value="游泳">游泳</ion-select-option>
+          <ion-select-option value="健身">健身</ion-select-option>
+        </ion-select>
+      </ion-item>
+    
+      <ion-item>
+        <ion-label position="floating">运动目标</ion-label>
+        <ion-select [(ngModel)]="userGoal" placeholder="选择您的目标">
+          <ion-select-option value="减脂">减脂</ion-select-option>
+          <ion-select-option value="增肌">增肌</ion-select-option>
+          <ion-select-option value="维持">维持</ion-select-option>
+        </ion-select>
+      </ion-item>
+    
+      <!-- 生成计划按钮 -->
+      <ion-button expand="full" (click)="generatePlan()">生成运动计划</ion-button>
+    
+      <!-- 显示生成的运动计划 -->
+      <div *ngIf="responsePlan">
+        <ion-card>
+          <ion-card-header>
+            <ion-card-title>生成的运动计划</ion-card-title>
+          </ion-card-header>
+          <ion-card-content>
+              @if(!isComplete){
+                  <p>{{ responsePlan }}</p >
+              }
+            
+          </ion-card-content>
+        </ion-card>
+      </div>
+      @if(isComplete){
+      <fm-markdown-preview class="content-style" [content]="responsePlan"></fm-markdown-preview>
+      }
+  </ion-content>
+    

+ 54 - 94
sport-app/src/app/tab2/tab2.page.ts

@@ -1,106 +1,66 @@
 import { Component } from '@angular/core';
 import { IonicModule } from '@ionic/angular';
-import { FormsModule } from '@angular/forms';
+import { FormsModule } from '@angular/forms'; // 导入 FormsModule
+import { CommonModule } from '@angular/common'; // 导入 CommonModule
+import { FmodeChatCompletion,MarkdownPreviewModule } from 'fmode-ng'; // 你的外部 API 相关导入
 
 @Component({
-  selector: 'app-tab2',
-  templateUrl: 'tab2.page.html',
-  styleUrls: ['tab2.page.scss'],
-  standalone: true,
-  imports: [
-    IonicModule,
-    FormsModule  // 导入 FormsModule 来支持 ngModel 双向绑定
-  ]
+  selector: 'app-tab2',
+  templateUrl: 'tab2.page.html',
+  styleUrls: ['tab2.page.scss'],
+  standalone: true,
+  imports: [
+    IonicModule,
+    FormsModule,
+    CommonModule,
+    MarkdownPreviewModule  
+  ]
 })
 export class Tab2Page {
-  // 用户输入数据
-  userHeight: number = 170;   // 默认身高
-  userWeight: number = 65;    // 默认体重
-  userGoal: string = '';      // 健身目标
-  userInterest: string = '';  // 兴趣爱好
+  // 用户输入的变量
+  userWeight: number = 70;   // 默认体重
+  userHeight: number = 175;  // 默认身高
+  userPreference: string = "跑步"; // 默认运动偏好
+  userGoal: string = "减脂"; // 默认目标
 
-  // 生成的运动计划
-  workoutPlan: string = '';
-  errorMessage: string = '';  // 错误消息
+  // 用于显示生成的运动计划
+  responsePlan: string = "";
+isComplete:boolean = false;
+  constructor() {}
 
-  constructor() {}
+  ngOnInit() {}
 
-  // 处理用户输入并生成运动计划
-  generateWorkoutPlan() {
-    // 清空之前的错误消息和运动计划
-    this.workoutPlan = '';
-    this.errorMessage = '';
+  // 当用户输入信息后,点击按钮生成运动计划
+  generatePlan() {
+    // 打印输入的信息,便于调试
+    console.log("用户体重:", this.userWeight);
+    console.log("用户身高:", this.userHeight);
+    console.log("用户运动偏好:", this.userPreference);
+    console.log("用户目标:", this.userGoal);
 
-    // 检查用户输入是否完整
-    if (!this.userHeight || !this.userWeight || !this.userGoal || !this.userInterest) {
-      this.errorMessage = '请确保所有字段都已填写。';
-      return;
-    }
+    // 创建一个包含用户输入的消息数组
+    let promptMessage = `根据以下信息,生成一个适合的运动计划:
+      体重: ${this.userWeight}kg
+      身高: ${this.userHeight}cm
+      运动偏好: ${this.userPreference}
+      目标: ${this.userGoal}`;
 
-    // 基于目标、身高、体重和兴趣生成运动计划
-    this.workoutPlan = this.createPersonalizedWorkoutPlan(
-      this.userGoal, 
-      this.userHeight, 
-      this.userWeight, 
-      this.userInterest
-    );
-
-    // 如果没有生成运动计划,显示错误消息
-    if (!this.workoutPlan) {
-      this.errorMessage = '无法生成运动计划,请稍后再试。';
-    }
-  }
-
-  // 生成个性化运动计划的函数
-  createPersonalizedWorkoutPlan(goal: string, height: number, weight: number, interest: string): string {
-    // 基于目标生成基础计划
-    let basePlan = this.getGoalBasedPlan(goal);
-
-    // 根据兴趣爱好调整运动计划
-    let adjustedPlan = this.adjustPlanBasedOnInterests(basePlan, interest);
-
-    // 结合身高和体重调整计划(例如,体重较重可能需要更多有氧训练等)
-    let finalPlan = this.adjustPlanBasedOnBodyMetrics(adjustedPlan, height, weight);
-
-    return finalPlan;
-  }
-
-  // 基于健身目标生成运动计划
-  getGoalBasedPlan(goal: string): string {
-    switch (goal) {
-      case '增肌':
-        return '每周3次重量训练,重点训练大肌群,包括卧推、深蹲和硬拉。配合低强度有氧运动,如快走或慢跑。';
-      case '减脂':
-        return '每周4次有氧运动,如跑步、游泳或骑行,每次持续30-45分钟。配合2-3次力量训练,增强新陈代谢。';
-      case '保持体形':
-        return '每周3次中等强度的力量训练,结合2-3次低强度有氧运动,如快走或瑜伽。';
-      default:
-        return '';
-    }
-  }
-
-  // 根据兴趣爱好调整运动计划
-  adjustPlanBasedOnInterests(plan: string, interests: string): string {
-    if (interests.includes('跑步')) {
-      plan += ' 如果你喜欢跑步,可以增加每周的跑步频率至3次,每次20-30分钟。';
-    }
-    if (interests.includes('游泳')) {
-      plan += ' 如果你喜欢游泳,可以用游泳替代有氧训练,保持每周至少2次,每次30分钟。';
-    }
-    if (interests.includes('瑜伽')) {
-      plan += ' 如果你喜欢瑜伽,可以增加每周1-2次瑜伽训练,有助于柔韧性和恢复。';
-    }
-    return plan;
-  }
-
-  // 根据身高和体重调整运动计划
-  adjustPlanBasedOnBodyMetrics(plan: string, height: number, weight: number): string {
-    if (weight > 80) {
-      plan += ' 由于体重大于80kg,建议增加每周有氧训练的频率,如慢跑或游泳,帮助减脂。';
-    }
-    if (height < 160) {
-      plan += ' 如果你的身高较矮,可能需要更多的核心训练来增强力量和稳定性。';
-    }
-    return plan;
-  }
+    // 调用 AI 接口生成运动计划
+    let completion = new FmodeChatCompletion([
+      { role: "system", content: "你是一个运动专家,能够根据用户的体重、身高、运动偏好和目标,生成个性化的运动计划。" },
+      { role: "user", content: promptMessage }
+    ]);
+    
+    // 发送请求并订阅生成的计划
+    completion.sendCompletion().subscribe((message: any) => {
+      // 打印生成的计划内容,便于调试
+      console.log("生成的运动计划:", message.content);
+      
+      // 将生成的计划赋值给组件变量,用于展示
+      this.responsePlan = message.content;
+      if(message?.complete){
+        this.isComplete = true
+      }
+    });
+  }
 }