import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { CloudSeUser } from 'src/lib/cloudSeuser'; // 引入 CloudSeUser 类
import { FmodeChatCompletion } from 'fmode-ng'; // 引入 FmodeChatCompletion
import { addIcons } from 'ionicons';
import { albumsOutline, checkmarkCircleOutline, documentOutline, leafOutline, scanOutline, storefrontOutline, search } from 'ionicons/icons';
import { IonButton, IonCard, IonCardContent, IonCardHeader, IonCol, IonContent, IonHeader, IonIcon, IonInput, IonRow, IonTextarea, IonTitle, IonToolbar, IonGrid, IonCardTitle, IonSearchbar, IonProgressBar, IonButtons, IonLabel,  } from '@ionic/angular/standalone'; // 导入 Ionic 组件
import { CommonModule } from '@angular/common'; // 导入 CommonModule
import { ImagePopupComponent } from '../image-popup/image-popup.component'; // 导入弹窗组件
import { ModalController, NavController } from '@ionic/angular/standalone';
import { Image1PopupComponent } from '../image-popup/image1-popup/image1-popup.component';
import { Image2PopupComponent } from '../image-popup/image2-popup/image2-popup.component';
import { Image3PopupComponent } from '../image-popup/image3-popup/image3-popup.component';
import { Image4PopupComponent } from '../image-popup/image4-popup/image4-popup.component';
import { openUserLoginModal } from '../modal-user-login/modal-user-login.component';
import { CloudQuery, CloudUser } from 'src/lib/ncloud';
import { CloudSeMealPlan } from 'src/lib/cloudplans';
import { MealService } from '../meal/meal.service';
import { MealSearchComponent } from '../meal-search/meal-search/meal-search.component';

@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss'],
  standalone: true,  // 使用 standalone 组件
  imports: [
    CommonModule, IonContent, IonHeader, IonTitle, IonToolbar, 
    IonButton, IonTextarea, IonInput, IonCard, IonCardContent, IonGrid, IonRow, IonCol, IonIcon,
    IonCardHeader, IonCardTitle, IonSearchbar, IonProgressBar,IonButtons,IonLabel
  ],
})
export class Tab1Page implements OnInit {
  private cloudSeUser: CloudSeUser; // 引入 CloudSeUser 实例
  private cloudSeMealPlan: CloudSeMealPlan; // 引入 CloudSeMealPlan 实例
  searchQuery: string = '';

  userInfo: any = null; // 用户信息
  responseMsg: string = ""; // 用于存储 AI 生成的饮食建议
  recipeMsg: string = ""; // 用于存储 AI 生成的推荐食谱
  isLoading: boolean = false; 
  dishName:string="";//用于存储菜品名
  dishPhoto:string="";
  breakfast: string = "";  // 用于存储早餐
  lunch: string = "";  // 用于存储午餐
  dinner: string = "";  // 用于存储晚餐
  notes: string = "";  //用于存储饮食建议
  today:string = "";//判定日期
  currentDate = new Date();
  plan: boolean = false;  // 用户是否有饮食计划
  result: boolean = true;  // 是否成功匹配到饮食计划
  mark0:boolean=false;
  isComplete:boolean = false;


  // 当前显示的幻灯片索引
  currentSlide: number = 0;
  currentUser:CloudUser|undefined

  currentDay: number = 0;  // 当前饮食计划是第几天
  planDays: number = 0;  // 总饮食计划天数
  progress: number = 0;  // 饮食计划进度
  // currentUser: CloudUser | undefined;

  // 存储图片的数组
  images = [
    'https://app.fmode.cn/dev/jxnu/202226701038/ssbt2022.jpg',
    'https://app.fmode.cn/dev/jxnu/202226701038/danbaizhi.jpg',
    'https://app.fmode.cn/dev/jxnu/202226701038/sanfutian.jpg',
    'https://app.fmode.cn/dev/jxnu/202226701038/bushui.jpg'
  ];

// 每张图片的描述
  descriptions = [
      '<p><strong>中国居民平衡膳食宝塔（2022）</strong></p>',
      '<p><strong>[辟谣]蛋白质吃得越多，肌肉就会长得越多？</strong></p>',
      '<p><strong>三伏天“烤”验 孩子饮食如何搭配</strong></p>',
      '<p><strong>[辟谣]锻炼补水，喝运动饮料比喝白开水更好？</strong></p>'
  ];
  

  constructor(private router: Router, private modalCtrl: ModalController, private mealService: MealService,) {
    addIcons({search,leafOutline,checkmarkCircleOutline,storefrontOutline,albumsOutline,scanOutline,documentOutline});
    this.cloudSeUser = new CloudSeUser();
    this.cloudSeMealPlan = new CloudSeMealPlan();
    this.currentUser=new CloudUser()
  }


  async ngOnInit(): Promise<void> {
    await this.loadUserData(); // 页面初始化时加载用户数据
    if (this.currentUser?.id) {
      this.goHealthTips();  // 用户已登录，立即调用生成健康建议的方法
      console.log(this.responseMsg)
      this.getTodayDietPlan(); // 获取今日饮食计划
    }
  }

  // 从 seUser 表加载当前用户数据
  async loadUserData() {
    try {
        const userData = await this.cloudSeUser.getCurrentUserInfo();
        if (userData) {
            // 使用 get 方法逐个提取字段
            this.userInfo = {
                name: userData.get('name') || '',
                email: userData.get('email') || '',
                phone: userData.get('phone') || '',
                age: userData.get('age') || null,
                gender: userData.get('gender') || '',
                height: userData.get('height') || null,
                weight: userData.get('weight') || null,
                activityLevel: userData.get('activityLevel') || '',
                dietPreference: userData.get('dietPreference') || '',
                dietGroup: userData.get('dietGroup') || '',
                avatar: userData.get('avatar') || null,
                allergies: userData.get('allergies') || '',
                planDays: userData.get('planDays') || null, // 获取 planDays 字段
            };
            
            // 检查用户是否有饮食计划
            this.plan = this.userInfo.planDays != null && this.userInfo.planDays > 0;
            this.planDays = this.userInfo.planDays || 0;  // 设置 planDays
        }
    } catch (error) {
        console.error('加载用户数据失败', error);
    }
  }

 //搜索框功能实现
  // 当输入发生变化时触发
  setSearchQuery(query: string) {
    this.searchQuery = query;
  }

  // 点击搜索按钮时触发的搜索方法
  async search() {
    if (this.searchQuery.trim()) {
      await this.openMealSearchModal();
    }
  }

  // 打开弹窗并展示搜索结果
  async openMealSearchModal() {
    const modal = await this.modalCtrl.create({
      component: MealSearchComponent,
      componentProps: {
        searchQuery: this.searchQuery,
      },
    });

    await modal.present();
  }
//搜索框功能实现

  // 获取健康建议
  async goHealthTips() {
    this.isComplete = false;
    if (!this.userInfo) return;

    const { height, weight, activityLevel, dietGroup ,gender} = this.userInfo;
    const newPrompt = `
      你是一名专业的养生健康有关的专家，，专门为用户提供每日健康建议。
      现在有一个身高${height} cm、体重${weight} kg的${gender}性用户向你咨询今日的健康建议。
      重点是该用户是${dietGroup}饮食群体，活动水平${activityLevel}。
      并且该用户今日的饮食规划为早餐：${this.breakfast}、午餐${this.lunch}、晚餐${this.dinner},参考饮食规划中的建议：${this.notes}。
      请根据以上内容为该用户提供今日的健康建议。不需要再复述用户的信息，并且不需要提供饮食有关的建议，提供有关日常活动的，字数大概在100字以内。
    `;

    const completion = new FmodeChatCompletion([
      { role: "system", content: "" },
      { role: "user", content: newPrompt }
    ]);

    completion.sendCompletion().subscribe((message: any) => {
      console.log(message.content);
      this.responseMsg = message.content; // 更新健康建议
      if (message?.complete){
        this.isComplete = true;
      }
    });
  }

  async getTodayDietPlan() {
    if (!this.userInfo || !this.currentUser?.id || !this.plan) {
      this.result = false;
      console.log("用户没有饮食计划");
      return null;
    }
  
    const currentDateStr = new Date().toISOString().split('T')[0]; // 获取今日日期（例如：2024-12-24）
  
    const cloudSeMealPlan = new CloudSeMealPlan();
  
    try {
      // 获取当前用户的饮食计划（通过 user 外键和 day 日期进行匹配）
      const query = new CloudQuery("seMealPlans");
      query.equalTo("user", { "__type": "Pointer", "className": "_User", "objectId": this.currentUser.id });
      query.equalTo("day", currentDateStr);  // 使用 today 变量匹配日期
  
      // 执行查询并获取第一个匹配的结果
      const mealPlan = await query.first(); // 如果有多个匹配的计划，可以使用 `query.find()` 获取所有
  
      // 检查是否找到了匹配的饮食计划
      if (mealPlan) {
        this.breakfast = mealPlan.get("breakfast") || '暂无早餐信息';
        this.lunch = mealPlan.get("lunch") || '暂无午餐信息';
        this.dinner = mealPlan.get("dinner") || '暂无晚餐信息';
        this.notes = mealPlan.get("notes") || '暂无饮食建议信息';
        this.mark0 = mealPlan.get("mark") || false;  // 获取当前的打卡状态
        this.currentDay = mealPlan.get("No") || 0;  // 获取当前是第几天
        this.result = true;  // 标记成功

        // 计算进度
        this.progress = this.planDays ? this.currentDay / this.planDays : 0;

        console.log("今日饮食计划: ", this.breakfast, this.lunch, this.dinner);
        console.log("mealPlan objectId:", mealPlan.id);  // 调试：确保返回了 objectId
        return mealPlan;  // 返回 mealPlan，以便后续更新
      } else {
        // 如果没有找到今日饮食计划
        this.result = false;
        console.log('未找到今日饮食计划');
        return null;
      }
    } catch (error) {
      console.error("获取今日饮食计划失败", error);
      this.result = false;
      return null;
    }
  }

  // 打开弹窗
  async openImagePopup(imageUrl: string, description: string) {
    let modal;
    // 动态加载弹窗组件
    if (imageUrl === this.images[0]) {
      modal = await this.modalCtrl.create({
        component: Image1PopupComponent,
        componentProps: { imageUrl, description }
      });
    } else if (imageUrl === this.images[1]) {
      modal = await this.modalCtrl.create({
        component: Image2PopupComponent,
        componentProps: { imageUrl, description }
      });
    } else if (imageUrl === this.images[2]) {
      modal = await this.modalCtrl.create({
        component: Image3PopupComponent,
        componentProps: { imageUrl, description }
      });
    } else if (imageUrl === this.images[3]) {
      modal = await this.modalCtrl.create({
        component: Image4PopupComponent,
        componentProps: { imageUrl, description }
      });
    }

    if (modal) {
      await modal.present();
    }
  }

  // 点击轮播图
  async onImageClick(index: number) {
    const description = this.descriptions[index]; // 获取对应的描述
    await this.openImagePopup(this.images[index], description);
  }

  // 前一个幻灯片
  prevSlide() {
    if (this.currentSlide > 0) {
      this.currentSlide--;
    } else {
      this.currentSlide = this.images.length - 1;
    }
  }

  // 后一个幻灯片
  nextSlide() {
    if (this.currentSlide < this.images.length - 1) {
      this.currentSlide++;
    } else {
      this.currentSlide = 0;
    }
  }

  // 跳转到指定的幻灯片
  goToSlide(index: number) {
    this.currentSlide = index;
  }

    // 跳转到饮食建议页面
    goHealthTipsPage() {
      this.router.navigate([`/tabs/tips`]);
    }

    goToasy() {
      this.router.navigate([`/tabs/asy`]);
    }

    goToasf(){
      this.router.navigate([`/tabs/asf`]);
    }

    goToasx(){
      this.router.navigate([`/tabs/asx`]);
    }

    async login(){
      // 弹出登录窗口
      let user = await openUserLoginModal(this.modalCtrl);
      if(user?.id){
        this.currentUser = user
        await this.loadUserData();// 登录后加载用户信息
      }
    }


    async check() {
    
      // 获取当前日期
      const currentDateStr = new Date().toISOString().split('T')[0]; // 获取今日日期（例如：2024-12-24）
    
      // 获取今日饮食计划
      const mealPlan = await this.getTodayDietPlan(); // 获取当前饮食计划
      console.log('当前 mealPlan:', mealPlan);  // 调试：检查 mealPlan 是否存在
      if (mealPlan && mealPlan.id) {
        // 使用 get 方法获取 objectId
        const mealPlanId = mealPlan.id;
        console.log('准备更新 mealPlan objectId:', mealPlanId);  // 打印 objectId
    
        // 更新数据库中的 mark 字段
        try {
          // 调用后端接口更新饮食计划
          await this.cloudSeMealPlan.updateMealPlan({ mark: true }, mealPlanId); 
          this.mark0 = true;
          console.log('打卡状态已更新：', );
        } catch (error) {
          console.error('更新打卡状态失败', error);
        }
      } else {
        console.log('未找到今日饮食规划，无法打卡');
      }
    }

    openInNewWindow() {
      window.open('https://i.meituan.com/mttouch/page/home', '_blank');
    }
}