Browse Source

Save project

ljf123 2 days ago
parent
commit
408b9cdfce
3 changed files with 146 additions and 5 deletions
  1. 64 0
      src/app/tab2/tab2.page.html
  2. 7 1
      src/app/tab2/tab2.page.scss
  3. 75 4
      src/app/tab2/tab2.page.ts

+ 64 - 0
src/app/tab2/tab2.page.html

@@ -184,6 +184,70 @@
     <p>暂无训练计划</p>
     <ion-button fill="outline" (click)="createNewPlan()">创建新计划</ion-button>
   </div>
+  <!-- 创建计划模态框 -->
+<ion-modal [isOpen]="isCreateModalOpen" (didDismiss)="closeCreateModal()">
+  <ng-template>
+    <ion-header>
+      <ion-toolbar>
+        <ion-title>创建新计划</ion-title>
+        <ion-buttons slot="end">
+          <ion-button (click)="closeCreateModal()">关闭</ion-button>
+        </ion-buttons>
+      </ion-toolbar>
+    </ion-header>
+    <ion-content class="ion-padding"[scrollY]="true" [fullscreen]="true">
+      <ion-list>
+        <ion-item>
+          <ion-label position="stacked">计划名称</ion-label>
+          <ion-input [(ngModel)]="newPlan.name" name="planName"  placeholder="例如:减脂训练"></ion-input>
+        </ion-item>
+        <ion-item>
+          <ion-label position="stacked">计划描述</ion-label>
+          <ion-textarea [(ngModel)]="newPlan.description" name="planDescription" rows="2" placeholder="简要描述你的训练目标"></ion-textarea>
+        </ion-item>
+
+        <ion-item>
+          <ion-label position="stacked">持续时间(周)</ion-label>
+          <ion-select [(ngModel)]="newPlan.duration"name="planDuration" interface="action-sheet">
+            <ion-select-option value="4">4周</ion-select-option>
+            <ion-select-option value="8">8周</ion-select-option>
+            <ion-select-option value="12">12周</ion-select-option>
+          </ion-select>
+        </ion-item>
+
+        <ion-item>
+          <ion-label position="stacked">难度级别</ion-label>
+          <ion-select [(ngModel)]="newPlan.difficulty"name="planDifficulty" interface="action-sheet">
+            <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="stacked">训练目标</ion-label>
+          <ion-select [(ngModel)]="newPlan.goals" name="planGoals"multiple="true" interface="action-sheet">
+            <ion-select-option value="减脂">减脂</ion-select-option>
+            <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="stacked">每周训练天数</ion-label>
+          <ion-select [(ngModel)]="newPlan.daysPerWeek"name="planDaysPerWeek" interface="action-sheet">
+            <ion-select-option value="3">3天</ion-select-option>
+            <ion-select-option value="4">4天</ion-select-option>
+            <ion-select-option value="5">5天</ion-select-option>
+          </ion-select>
+        </ion-item>
+      </ion-list>
+
+      <ion-button expand="block" (click)="saveNewPlan()" class="save-button">保存计划</ion-button>
+    </ion-content>
+  </ng-template>
+</ion-modal>
 
   <!-- 底部添加按钮 -->
   <ion-fab vertical="bottom" horizontal="end" slot="fixed">

+ 7 - 1
src/app/tab2/tab2.page.scss

@@ -276,4 +276,10 @@ ion-list {
   --padding-start: 8px;
   --padding-end: 8px;
   --color: #6b47d6;
-}
+}
+
+
+
+
+
+

+ 75 - 4
src/app/tab2/tab2.page.ts

@@ -4,10 +4,12 @@ import { IonTextarea } from '@ionic/angular/standalone';
 import {
   ModalController,
   IonHeader,IonNote,IonChip, IonToolbar, IonTitle, IonButtons, IonButton, IonIcon,
-  IonContent, IonCard, IonCardHeader, IonCardTitle, IonCardSubtitle,
+  IonContent, IonCard, IonCardHeader, IonCardTitle, IonCardSubtitle,IonModal,
   IonCardContent, IonProgressBar, IonGrid, IonRow, IonCol, IonListHeader,
-  IonLabel, IonList, IonItem, IonAvatar, IonBadge, IonFab, IonFabButton,IonSkeletonText
+  IonLabel, IonList, IonItem, IonAvatar, IonBadge, IonFab, IonFabButton,IonSkeletonText,
+  IonInput,IonSelect, IonSelectOption
 } from '@ionic/angular/standalone';
+import { FormsModule,ReactiveFormsModule } from '@angular/forms';  // 新增这行
 import { addIcons } from 'ionicons';
 import {
   notificationsOutline, calendarNumber, checkmarkCircle, ellipseOutline,
@@ -28,15 +30,29 @@ import { CloudObject, CloudQuery, CloudUser } from 'src/lib/ncloud';
   standalone: true,
   imports: [
     CommonModule,
+    FormsModule,
+    ReactiveFormsModule,  // 新增这行
     // IonTextarea,
     IonNote,IonChip,
     IonHeader, IonToolbar, IonTitle, IonButtons, IonButton, IonIcon,
-    IonContent, IonCard, IonCardHeader, IonCardTitle, IonCardSubtitle,
+    IonContent, IonCard, IonCardHeader, IonCardTitle, IonCardSubtitle,IonModal,
     IonCardContent, IonProgressBar, IonGrid, IonRow, IonCol, IonListHeader,
-    IonLabel, IonList, IonItem, IonAvatar, IonBadge, IonFab, IonFabButton,IonSkeletonText
+    IonLabel, IonList, IonItem, IonAvatar, IonBadge, IonFab, IonFabButton,IonSkeletonText,
+    IonInput,IonSelect, IonSelectOption,IonTextarea
   ]
 })
 export class Tab2Page {
+   // 添加这些新属性
+  isCreateModalOpen = false;
+  newPlan = {
+    name: '',
+    description: '',
+    duration: '4',
+    difficulty: '初级',
+    goals: [] as string[],
+    daysPerWeek: '3'
+  };
+
 
   openConsult(chatId?:string){
     localStorage.setItem("company","E4KpGvTEto")
@@ -335,5 +351,60 @@ export class Tab2Page {
 
   createNewPlan() {
     console.log('创建新计划');
+    this.isCreateModalOpen = true;
+    // 重置表单
+    this.newPlan = {
+      name: '',
+      description: '',
+      duration: '4',
+      difficulty: '初级',
+      goals: [],
+      daysPerWeek: '3'
+    };
+  }
+    closeCreateModal() {
+    this.isCreateModalOpen = false;
+  }
+  async saveNewPlan() {
+    if (!this.newPlan.name.trim()) {
+      console.error('计划名称不能为空');
+      return;
+    }
+
+    if (!this.currentUser?.id) {
+      console.error('用户未登录');
+      return;
+    }
+
+    try {
+      const plan = new CloudObject('TrainingPlan');
+      
+      // 设置训练日安排
+      const schedule: Record<string, boolean> = {};
+      const days = ['monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday', 'sunday'];
+      for (let i = 0; i < parseInt(this.newPlan.daysPerWeek); i++) {
+        schedule[days[i]] = true;
+      }
+
+      plan.set({
+        planName: this.newPlan.name,
+        description: this.newPlan.description,
+        durationInWeeks: parseInt(this.newPlan.duration),
+        difficultyLevel: this.newPlan.difficulty,
+        fitnessGoals: this.newPlan.goals,
+        schedule: schedule,
+        user: this.currentUser.toPointer(),
+        isPublic: false
+      });
+
+      await plan.save();
+      console.log('新计划创建成功:', plan.id);
+      
+      // 刷新计划列表
+      await this.loadTrainingPlans();
+      this.isCreateModalOpen = false;
+    } catch (error) {
+      console.error('保存计划失败:', error);
+    }
   }
 }