Selaa lähdekoodia

fix:修复页面无法正确回跳问题

xukang 6 kuukautta sitten
vanhempi
commit
9065a1c148

+ 16 - 14
TFPower-app/src/app/tab2/edit-plan-modal/edit-plan-modal.component.html

@@ -1,9 +1,8 @@
 <ion-header>
   <ion-toolbar>
-    <ion-title>编辑计划</ion-title>
-    <ion-buttons slot="end">
-      <ion-button (click)="dismiss()">关闭</ion-button>
-    </ion-buttons>
+    <ion-title>
+      <ion-icon name="createOutline" style="margin-right: 5px;"></ion-icon>编辑计划
+    </ion-title>
   </ion-toolbar>
 </ion-header>
 
@@ -27,19 +26,19 @@
       <ion-label>训练计划</ion-label>
 
       <ion-row *ngFor="let task of plan.get('trainingItems'); let i = index" class="plan-row">
-        <ion-col size="12" size-md="4" class="plan-column">
+        <ion-col size="12" size-md="4" class="custom-col">
           <ion-item lines="none">
             <ion-input label="项目{{i + 1}}:" [value]="task.item || ''" (ionBlur)="onTaskChange(i, 'item', $event)"
               placeholder="请输入项目名称"></ion-input>
           </ion-item>
         </ion-col>
-        <ion-col size="6" size-md="3">
+        <ion-col size="6" size-md="3" class="custom-col">
           <ion-item lines="none">
             <ion-input label="组数:" [value]="task.sets" (ionBlur)="onTaskChange(i, 'sets', $event)" placeholder="请输入组数">
             </ion-input>
           </ion-item>
         </ion-col>
-        <ion-col size="6" size-md="3">
+        <ion-col size="6" size-md="3" class="custom-col">
           <ion-item lines="none">
             <ion-input label="次数:" [value]="task.reps" (ionBlur)="onTaskChange(i, 'reps', $event)" placeholder="请输入次数">
             </ion-input>
@@ -50,19 +49,22 @@
       <ion-grid>
         <ion-row>
           <!-- 左侧按钮 -->
+
           <ion-col size="6">
-            <ion-button expand="full" (click)="saveChanges()" shape="round" class="confirm-btn">
-              <ion-icon name="checkmark-circle-outline"></ion-icon>
-              保存修改
+            <ion-button expand="full" color="light" shape="round" (click)="dismiss()" class="discard-btn">
+              <ion-icon name="close-circle-outline"></ion-icon>
+              取消保存
             </ion-button>
           </ion-col>
-
           <!-- 右侧按钮 -->
+
           <ion-col size="6">
-            <ion-button expand="full" color="light" shape="round" (click)="deletePlan(plan)" class="discard-btn">
-              <ion-icon name="close-circle-outline"></ion-icon>
-              删除计划
+            <ion-button expand="full" (click)="saveChanges()" style="--background: #32548f;" shape="round"
+              class="confirm-btn">
+              <ion-icon name="checkmark-circle-outline"></ion-icon>
+              保存修改
             </ion-button>
+
           </ion-col>
         </ion-row>
       </ion-grid>

+ 5 - 5
TFPower-app/src/app/tab2/edit-plan-modal/edit-plan-modal.component.scss

@@ -1,15 +1,11 @@
-.plan-row {
-  margin-bottom: 5px;
-}
 
 .plan-column {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
 }
-
 ion-item {
-  margin-bottom: 5px;
+  margin-bottom: -5px;  /* 调整间距的值,根据需要改变 */
 }
 .horizontal-item {
   display: flex;
@@ -24,4 +20,8 @@ ion-item {
 .horizontal-item ion-input {
   flex: 1 1 auto; /* 输入框扩展占满剩余空间 */
 }
+.custom-col
+{
+--ion-grid-column-padding: 0;
+}
 

+ 2 - 2
TFPower-app/src/app/tab2/edit-plan-modal/edit-plan-modal.component.ts

@@ -4,7 +4,7 @@ import { IonRow, IonCol, IonHeader, IonToolbar, IonTitle, IonButtons, IonButton,
 import { FormsModule } from '@angular/forms';
 import { CommonModule } from '@angular/common';
 import { addIcons } from 'ionicons';
-import { closeCircleOutline, checkmarkCircleOutline } from 'ionicons/icons';
+import { closeCircleOutline, createOutline, checkmarkCircleOutline } from 'ionicons/icons';
 @Component({
   selector: 'app-edit-plan-modal',
   templateUrl: './edit-plan-modal.component.html',
@@ -36,7 +36,7 @@ import { closeCircleOutline, checkmarkCircleOutline } from 'ionicons/icons';
 export class EditPlanModalComponent {
   @Input() plan: any;  // 接收传入的计划数据
   constructor(private modalCtrl: ModalController, private alertController: AlertController) {
-    addIcons({ closeCircleOutline, checkmarkCircleOutline, });
+    addIcons({ closeCircleOutline, checkmarkCircleOutline, createOutline });
   }
   // 更新数据字段
   onChange(field: string, event: any) {

+ 31 - 19
TFPower-app/src/app/tab2/tab2.page.html

@@ -41,11 +41,11 @@
                   <ion-card-content>
                     <p><strong>身高:</strong>{{ user.get('height') }} cm</p>
                     <p><strong>体重:</strong>{{ user.get('weight') }} kg</p>
-                    <p><strong>BMI:</strong>{{ user.get('bmi') }}</p>
+                    <p><strong>BMI:</strong>{{ calculateBMI(user.get('height'), user.get('weight')) }}</p>
                     <p><strong>运动目标:</strong>{{ user.get('fitnessGoals') }}</p>
                   </ion-card-content>
                 </ion-card>
-                <ion-label>{{ getEncouragement(user.get('bmi')) }}</ion-label>
+                <ion-label>{{ getEncouragement(calculateBMI(user.get('height'), user.get('weight'))) }}</ion-label>
               </div>
             </div>
           </div>
@@ -110,36 +110,48 @@
         <div class="plan-table">
           <ion-grid class="table">
             <ion-row>
-              <ion-col size="1" class="grid-header">日期</ion-col>
-              <ion-col size="1" class="grid-header">部位</ion-col>
-              <ion-col size="2.5" class="grid-header">项目1</ion-col>
+              <ion-col size="1.5" class="grid-header">日期</ion-col>
+              <ion-col size="1.5" class="grid-header">部位</ion-col>
+              <ion-col size="1.5" class="grid-header">项目1</ion-col>
               <ion-col size="2.5" class="grid-header">项目2</ion-col>
               <ion-col size="2.5" class="grid-header">项目3</ion-col>
               <ion-col size="2.5" class="grid-header">项目4</ion-col>
             </ion-row>
 
             <!-- 绑定计划数据 -->
-            <ion-row *ngFor="let day of planList" (click)="editPlan(day)">
-              <ion-col size="1" class="plan-column">{{ day.get('date') }}</ion-col>
-              <ion-col size="1" class="plan-column">{{ day.get('trainingPart') }}</ion-col>
-
-              <!-- 显示每个训练项目,确保即使为空也占位 -->
-              <ion-col size="2.5" *ngFor="let task of day.get('trainingItems'); let i = index" class="plan-column">
-                <!-- 使用 div 或 span 来分隔 item 和 sets, reps -->
-                <div class="task-container">
-                  <span class="task-item">{{ task.item || '' }}</span>
-                  <span class="sets-reps">{{ task.sets }} x {{ task.reps }}</span>
-                </div>
-              </ion-col>
+            <ion-row *ngFor="let day of planList">
+              <ion-item-sliding>
+                <ion-item>
+                  <!-- 显示计划内容 -->
+                  <ion-col size="1" class="plan-column">{{ day.get('date') }}</ion-col>
+                  <ion-col size="1" class="plan-column">{{ day.get('trainingPart') }}</ion-col>
+
+                  <!-- 显示每个训练项目,确保即使为空也占位 -->
+                  <ion-col size="2.5" *ngFor="let task of day.get('trainingItems'); let i = index" class="plan-column">
+                    <div class="task-container">
+                      <span class="task-item">{{ task.item || '' }}</span>
+                      <span class="sets-reps">{{ task.sets }} x {{ task.reps }}</span>
+                    </div>
+                  </ion-col>
+                </ion-item>
+
+                <!-- 滑动时显示的按钮,设置 side="end" 来将按钮显示在右边 -->
+                <ion-item-options side="end">
+                  <ion-item-option class="edit-btn" color="primary" shape="round" (click)="editPlan(day)">编辑
+                  </ion-item-option>
+                  <ion-item-option class="delete-btn" color="danger" (click)="deletePlan(day)">删除</ion-item-option>
+                </ion-item-options>
+
+              </ion-item-sliding>
             </ion-row>
           </ion-grid>
         </div>
 
       </ion-card>
       <ion-card-subtitle>
-        <ion-icon name="alert-circle-outline" style="margin-right: 5px;"></ion-icon>点击行内数据可对计划进行修改哦!
+        <ion-icon name="alert-circle-outline" style="margin-right: 5px;"></ion-icon>左滑行内数据可对计划进行修改哦!
       </ion-card-subtitle>
-      <ion-button expand="full" shape="round" class="reverse" (click)="goToPage('test-page')">
+      <ion-button expand="full" shape="round" class="reverse" (click)="regeneratePlan()">
         <ion-icon name="infinite-outline" style="margin-right:5px ;"></ion-icon>重新生成计划
       </ion-button>
     </ion-card-content>

+ 32 - 35
TFPower-app/src/app/tab2/tab2.page.scss

@@ -43,21 +43,40 @@ ion-content {
 }
 // plan部分css
 /* 给表格增加阴影和圆角 */
-.plan-table ion-grid {
-  
-  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-  width: 100%; 
+//表头
+.grid-header {
+  font-weight: bold;
+  background-color: rgb(50, 84, 143);
+  text-align: center;
+   display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.plan-table .table {
+  --ion-grid-column-padding: 0px;  /* 去除额外的内边距,避免错位 */
+}
 
+.ion-item {
+  --padding-start: 0px;
+  --padding-end: 0px;
+}
+
+.ion-col {
+  padding-left: 0px;
+  padding-right: 0px;
 }
 /* 计划表格的列间距和背景 */
 .plan-table ion-row {
-  margin-bottom: 1px;
+    margin-bottom: 1px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
 }
 
 /* 表格行的底部间距 */
 .plan-table ion-col {
   margin-bottom: 1px;
-  border-bottom: 1px solid #ddd;
+ 
     display: flex;
     justify-content: center;
     align-items: center;
@@ -68,18 +87,14 @@ ion-content {
 .plan-column {
   background-color: #ffffff;
   padding: 12px;
-  border-bottom: 1px solid #ddd;
   text-align: center;
+   display: flex;
+    justify-content: center;
+    align-items: center;
 }
 
 /* 表格的标题 */
-.grid-header {
-  font-weight: bold;
-  background-color: #f0f0f0;
-  text-align: center;
-  padding: 12px;
-  border-bottom: 1px solid #ddd;
-}
+
 
 .section-title {
   font-size: 20px;
@@ -87,17 +102,13 @@ ion-content {
   color: #333;
   margin-bottom: 20px;
 }
-@media (max-width: 768px) {
+@media (max-width: 1000px) {
   /* 更小的屏幕尺寸(如手机) */
   .plan-table ion-col {
     padding: 6px;
     font-size: 14px;
   }
 
-  .plan-table ion-select {
-    width: 100%;
-    font-size: 12px;
-  }
 
   .plan-table ion-button {
     min-width: 70px;
@@ -192,11 +203,7 @@ ion-content {
 .plan-column {
   transition: background-color 0.3s ease, box-shadow 0.3s ease;  /* 平滑过渡效果 */
 }
-/* 鼠标悬停时的样式 */
-.plan-column:hover {
-  background-color: #f4f4f4;  /* 设置背景色变化 */
-  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);  /* 添加阴影效果 */
-}
+
 .task-container {
   display: flex; /* 设置为 flexbox */
   flex-direction: column; /* 让子元素垂直排列 */
@@ -251,23 +258,13 @@ ion-content {
   margin-bottom: 20px;
 }
 
-.weather-icon-container {
-  margin-bottom: 10px; /* 图标与日期选择器之间的间距 */
-}
-
-.weather-icon-container ion-icon {
-  color: #ffcc00; /* 太阳图标的颜色 */
-}
 ion-card {
     border-radius: 15px; /* 圆角边框 */
     background-color: #f9f9f9; /* 卡片内部背景颜色 */
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
     border: 1px solid #e0e0e0; /* 边框颜色 */
   }
-ion-card:hover {
-    transform: scale(1.02); /* 悬停时放大效果 */
-    transition: transform 0.2s; /* 动画过渡效果 */
-  }
+
 
 
 

+ 70 - 43
TFPower-app/src/app/tab2/tab2.page.ts

@@ -4,7 +4,7 @@ import { addIcons } from 'ionicons';
 import { checkmarkCircle, sunny, infiniteOutline, alertCircleOutline, bicycleOutline, logoGitlab, trash, calendar, helpCircle, create } from 'ionicons/icons';
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
-import { IonDatetime, IonSelect, IonThumbnail, IonCardSubtitle, IonImg, IonCard, IonButtons, IonItem, IonList, IonHeader, IonIcon, IonToolbar, IonContent, IonSegment, IonSegmentButton, IonGrid, IonRow, IonCol, IonButton, IonLabel, IonBadge, IonInput, ModalController, IonCardTitle, IonCardContent, IonCardHeader, IonSelectOption } from '@ionic/angular/standalone';
+import { IonDatetime, IonSelect, IonItemOptions, IonThumbnail, IonCardSubtitle, IonImg, IonCard, IonButtons, IonItem, IonList, IonHeader, IonIcon, IonToolbar, IonContent, IonSegment, IonSegmentButton, IonGrid, IonRow, IonCol, IonButton, IonLabel, IonBadge, IonInput, ModalController, IonCardTitle, IonCardContent, IonCardHeader, IonSelectOption, IonItemSliding, IonItemOption } from '@ionic/angular/standalone';
 import { FmodeChatCompletion, ImagineWork, DalleOptions, ChatPanelOptions, FmodeChat, FmodeChatMessage, MarkdownPreviewModule, openChatPanelModal } from "fmode-ng";
 import { AgentTaskStep } from './agent/agent.task';
 import { TaskPoemPictureDesc } from './agent/tasks/poem/poem-desc';
@@ -18,6 +18,7 @@ import { EditPlanModalComponent } from './edit-plan-modal/edit-plan-modal.compon
 import { AlertController } from '@ionic/angular';
 import { openUserEditModal } from 'src/lib/user/modal-user-edit/modal-user-edit.component';
 import { openUserLoginModal } from 'src/lib/user/modal-user-login/modal-user-login.component';
+import { TestPageComponent } from './test-page/test-page.component';
 @Component({
   selector: 'app-tab2',
   templateUrl: 'tab2.page.html',
@@ -52,7 +53,10 @@ import { openUserLoginModal } from 'src/lib/user/modal-user-login/modal-user-log
     IonLabel,
     IonBadge,
     IonInput,
-    IonDatetime
+    IonDatetime,
+    IonItemOption,
+    IonItemSliding,
+    IonItemOptions,
   ]
 })
 export class Tab2Page implements OnInit {
@@ -96,6 +100,13 @@ export class Tab2Page implements OnInit {
     let query = new CloudQuery("Coach");
     this.coachList = await query.find();
   }
+  calculateBMI(height: number, weight: number): number {
+    // 身高转换为米
+    const heightInMeters = height / 100;
+    // 计算 BMI
+    const bmi = weight / (heightInMeters * heightInMeters);
+    return parseFloat(bmi.toFixed(2));
+  }
   getEncouragement(bmi: number): string {
     if (bmi < 18.5) {
       return '您的BMI偏低,注意保持健康的饮食哦!(๑•́ ₃ •̀๑)';
@@ -169,9 +180,8 @@ export class Tab2Page implements OnInit {
     const formattedDate = this.formatDate(currentDate);
     if (!this.checkInHistory.has(formattedDate)) {
       this.checkInHistory.add(formattedDate);
-      this.days = this.checkInHistory.size; // 更新总打卡天数
-      this.calculateConsecutiveDays(); // 更新连续打卡天数
-      // 获取当前用户数据并更新 checkeddays 字段
+      this.days = this.checkInHistory.size;
+      this.calculateConsecutiveDays();
       let currentUser = new CloudUser();
       const cloudQuery = new CloudQuery("fitUser");
       cloudQuery.equalTo("user", currentUser.toPointer());
@@ -179,19 +189,15 @@ export class Tab2Page implements OnInit {
       if (userData.length > 0) {
         const user = userData[0];
         let checkedDays = user.get("checkeddays") || [];
-        checkedDays.push(formattedDate); // 添加新的打卡日期
-
-        // 更新数据库中的 checkeddays 字段
+        checkedDays.push(formattedDate);
         user.set({ "checkeddays": checkedDays });
-        user.set({ "days": this.days }); // 更新已打卡天数
-        user.set({ "sucdays": this.consecutiveDays }); // 更新连续打卡天数
+        user.set({ "days": this.days });
+        user.set({ "sucdays": this.consecutiveDays });
         await user.save();
         this.loadPlanUser()
       }
     }
   }
-
-  // 处理日期变更
   onDateChange(event: any) {
     this.realDate = new Date(this.correctDate(event.detail.value));
   }
@@ -238,37 +244,58 @@ export class Tab2Page implements OnInit {
       });
     });
   }
-  // async deletePlan(day: any) {
-  //   const alert = await this.alertController.create({
-  //     header: '确认删除',
-  //     message: '确定要删除此计划吗?',
-  //     buttons: [
-  //       {
-  //         text: '取消',
-  //         role: 'cancel',
-  //         cssClass: 'secondary',
-  //         handler: () => {
-  //           console.log('删除操作被取消');
-  //         }
-  //       },
-  //       {
-  //         text: '确认',
-  //         handler: () => {
-  //           day.destroy()
-  //             .then(() => {
-  //               console.log('计划已删除');
-  //               this.loadPlanList();
-  //             })
-  //             .catch((error: any) => {
-  //               console.error('删除失败:', error);
-  //             });
-  //         }
-  //       }
-  //     ]
-  //   });
+  regeneratePlan() {
+    console.log('重新生成计划:');
 
-  //   await alert.present();
-  // }
+    // 创建一个弹出框
+    this.modalCtrl.create({
+      component: TestPageComponent,
+      componentProps: {}
+    }).then(modal => {
+      modal.present();
+      modal.onDidDismiss().then((result) => {
+        if (result.data) {
+          const updatedPlan = result.data;
+          const index = this.planList.findIndex(item => item.id === updatedPlan.id);
+          if (index !== -1) {
+            this.planList[index] = updatedPlan;
+          }
+        }
+        this.loadPlanList()
+      });
+    });
+  }
+  async deletePlan(day: any) {
+    const alert = await this.alertController.create({
+      header: '确认删除',
+      message: '确定要删除此计划吗?',
+      buttons: [
+        {
+          text: '取消',
+          role: 'cancel',
+          cssClass: 'secondary',
+          handler: () => {
+            console.log('删除操作被取消');
+          }
+        },
+        {
+          text: '确认',
+          handler: () => {
+            day.destroy()
+              .then(() => {
+                console.log('计划已删除');
+                this.loadPlanList();
+              })
+              .catch((error: any) => {
+                console.error('删除失败:', error);
+              });
+          }
+        }
+      ]
+    });
+
+    await alert.present();
+  }
   //任务链
   taskList: AgentTaskStep[] = []
   //一个等待一秒的函数  每经过一秒
@@ -282,6 +309,7 @@ export class Tab2Page implements OnInit {
   shareData: any = {}
   // 任务:完成故事意境描述及图像绘制
   doPoemTask() {
+
     let task1 = TaskPoemPictureDesc({ shareData: this.shareData, modalCtrl: this.modalCtrl });
     let task2 = TaskPoemPictureCreate({ shareData: this.shareData, modalCtrl: this.modalCtrl });
     let PoemTaskList = [task1, task2]
@@ -337,7 +365,6 @@ export class Tab2Page implements OnInit {
     if (currentUser?.id) {
       ACL[currentUser?.id] = { read: true, write: true }
     }
-    localStorage.setItem("company", "E4KpGvTEto")
     consult.set({
       title: `交流记录${dateStr}-${coach?.get("name")}`,
       coach: coach.toPointer(),

+ 6 - 4
TFPower-app/src/app/tab2/test-page/test-page.component.html

@@ -1,7 +1,9 @@
 <ion-header translucent="true">
   <ion-toolbar>
-    <ion-title>制定个人健身计划</ion-title>
-    <ion-back-button></ion-back-button>
+
+    <ion-title>
+      <ion-icon name="chevron-back-outline" style="margin-right: 20px;" (click)="backPage()"></ion-icon>制定个人健身计划
+    </ion-title>
   </ion-toolbar>
 </ion-header>
 
@@ -25,7 +27,7 @@
         <ion-row>
           <ion-col size="6">
             <ion-item>
-              <ion-label>锻炼方式(多选)</ion-label>
+              <ion-label>运动种类</ion-label>
               <ion-select multiple="true" (ionChange)="onExercisePreferenceChange($event)" cancelText="取消" okText="确认">
                 <ion-select-option value="cardio">有氧</ion-select-option>
                 <ion-select-option value="strength">力量</ion-select-option>
@@ -35,7 +37,7 @@
           </ion-col>
           <ion-col size="6">
             <ion-item>
-              <ion-label>每周锻炼频率</ion-label>
+              <ion-label>每周频率</ion-label>
               <ion-select (ionChange)="onWorkoutFrequencyChange($event)" cancelText="取消" okText="确认">
                 <ion-select-option value="1">1次</ion-select-option>
                 <ion-select-option value="2">2次</ion-select-option>

+ 4 - 8
TFPower-app/src/app/tab2/test-page/test-page.component.scss

@@ -37,12 +37,8 @@ ion-button {
   --background: #32548f;
 }
 ion-card {
-    border-radius: 15px; /* 圆角边框 */
-    background-color: #f9f9f9; /* 卡片内部背景颜色 */
-    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
-    border: 1px solid #e0e0e0; /* 边框颜色 */
-  }
-ion-card:hover {
-    transform: scale(1.02); /* 悬停时放大效果 */
-    transition: transform 0.2s; /* 动画过渡效果 */
+    border-radius: 15px;
+    background-color: #f9f9f9;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    border: 1px solid #e0e0e0;
   }

+ 14 - 14
TFPower-app/src/app/tab2/test-page/test-page.component.ts

@@ -4,10 +4,10 @@ import { FormsModule } from '@angular/forms';
 import { CommonModule } from '@angular/common';
 import { TagInputComponent } from '../tag-input/tag-input.component';
 import { addIcons } from 'ionicons';
-import { barbellOutline, closeCircleOutline, checkmarkCircleOutline, fitness, personOutline, square, alarmOutline, arrowBack } from 'ionicons/icons';
+import { barbellOutline, chevronBackOutline, closeCircleOutline, checkmarkCircleOutline, fitness, personOutline, square, alarmOutline, arrowBack } from 'ionicons/icons';
 import { DalleOptions, FmodeChatCompletion, MarkdownPreviewModule } from 'fmode-ng';
 import { LoadingController } from '@ionic/angular';
-import { AlertController, IonThumbnail, IonBadge, IonButton, IonButtons, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCol, IonContent, IonGrid, IonHeader, IonIcon, IonImg, IonInput, IonItem, IonLabel, IonList, IonRow, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonToolbar, IonTitle, IonSpinner, IonTextarea, IonProgressBar } from '@ionic/angular/standalone';
+import { AlertController, IonThumbnail, IonBadge, IonButton, IonButtons, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCol, IonContent, IonGrid, IonHeader, IonIcon, IonImg, IonInput, IonItem, IonLabel, IonList, IonRow, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonToolbar, IonTitle, IonSpinner, IonTextarea, IonProgressBar, ModalController } from '@ionic/angular/standalone';
 import { NavController } from '@ionic/angular';
 import { Router } from '@angular/router';
 import { CloudObject, CloudQuery, CloudUser } from 'src/lib/ncloud';
@@ -69,13 +69,11 @@ export class TestPageComponent implements OnInit {
   messageList: any[] = [];  // 存储消息列表
   planReady: boolean = false;  // 是否可以显示确认按钮
   constructor(private toastController: ToastController,
-    private loadingController: LoadingController,
-    private alertController: AlertController,
-    private navController: NavController,
+    private modalCtrl: ModalController,
     private router: Router,
     private navCtrl: NavController
   ) {
-    addIcons({ fitness, personOutline, closeCircleOutline, barbellOutline, alarmOutline, square, arrowBack, checkmarkCircleOutline, });
+    addIcons({ chevronBackOutline, fitness, personOutline, closeCircleOutline, barbellOutline, alarmOutline, square, arrowBack, checkmarkCircleOutline, });
   }
   ngOnInit() { }
 
@@ -245,10 +243,13 @@ export class TestPageComponent implements OnInit {
     this.savePlanToDatabase(this.generatedPlan);
   }
   discardPlan() {
-    this.generatedPlan = " "
+    this.generatedPlan = ""
+    this.dismiss()
+  }
+  backPage() {
+    this.dismiss()
   }
   async savePlanToDatabase(plan: string) {
-
     let currentUser = new CloudUser().toPointer();
     console.log(currentUser)
     console.log('计划保存到数据库', plan);
@@ -280,7 +281,7 @@ export class TestPageComponent implements OnInit {
         newObject.save()
           .then(() => {
             console.log("计划保存成功");
-            this.goToPage("tab2")
+            this.dismiss()
           })
           .catch((error: any) => {
             console.error("保存计划时发生错误", error);
@@ -291,12 +292,11 @@ export class TestPageComponent implements OnInit {
       console.error("查询或删除计划时发生错误", error);
     }
   }
-
+  dismiss() {
+    this.modalCtrl.dismiss();
+  }
   goBack() {
     this.navCtrl.back();
   }
-  goToPage(page: string) {
-    // 更新选中的tab
-    this.router.navigate([`/tabs/${page}`]);  // 然后再进行路由跳转
-  }
+
 }