s202226701034/paint-app/src/app/page-idea/page-idea.component.ts

import { Component, OnInit } from '@angular/core';
import { IonHeader, IonToolbar, IonTitle, IonContent, IonButton, IonTextarea, IonInput, IonButtons, IonIcon } from '@ionic/angular/standalone';
/** 引用：从fmode-ng库引用FmodeChatCompletion类 */
import { FmodeChatCompletion,MarkdownPreviewModule } from 'fmode-ng';
import { ChangeDetectorRef } from '@angular/core'
import { Router } from '@angular/router';
import {chevronBack} from 'ionicons/icons';
addIcons({chevronBack})
import { addIcons } from 'ionicons';
import { CloudObject, CloudUser } from 'src/lib/ncloud';

@Component({
  selector: 'page-idea',
  templateUrl: './page-idea.component.html',
  styleUrls: ['./page-idea.component.scss'],
  standalone: true,
  imports: [IonHeader, IonToolbar, IonTitle, IonContent, IonButton,IonTextarea,IonInput,
    // 引入fm-markdown-preview组件模块
    MarkdownPreviewModule,
    IonButtons,IonIcon
  ],
})
export class PageIdeaComponent  implements OnInit {
constructor(private cdr: ChangeDetectorRef,
  private router: Router,
) {
  this.currentadivse = new CloudObject('padvise');
} // 注入 ChangeDetectorRef
ngOnInit() {}

// 用户输入提示词，初始值为"素描"
artStyle: string = "素描"; // 用户选择的绘画风格

// 处理用户输入的绘画风格信息
artStyleInput(ev: any) {
  this.artStyle = ev.detail.value; // 将用户输入的值赋给artStyle属性
}

// 用户输入提示词，初始值为"请描述您的绘画需求"
userPrompt: string = "请描述您的绘画需求"; // 用户描述绘画需求的提示信息

// 处理用户输入的绘画需求描述
promptInput(ev: any) {
  this.userPrompt = ev.detail.value; // 将用户输入的值赋给userPrompt属性
}

// 属性：组件内用于展示绘画建议内容的变量
responseMsg: any = "";

// 方法：实例化completion对象，传入消息数组，并订阅生成的可观察对象。
isComplete: boolean = false; // 定义完成状态属性，用来标记是否补全完成

// 发送消息并生成绘画建议
sendMessage() {
  console.log("create"); // 打印创建消息的日志

  this.responseMsg = ""; // 在生成新的文本之前清空之前的文本
  // 创建提示模板，包含用户输入的绘画风格和需求描述
  let PromptTemplate = `
    您作为一名专业的绘画老师，请您根据用户描述的绘画需求，给出一些绘画建议。
    以下是用户的描述：${this.userPrompt}
    用户选择的绘画风格是：${this.artStyle}
  `;

  // 实例化FmodeChatCompletion对象，传入系统和用户的消息
  let completion = new FmodeChatCompletion([
    { role: "system", content: "" }, // 系统角色消息，内容为空
    { role: "user", content: PromptTemplate } // 用户角色消息，内容为PromptTemplate
  ]);

  // 发送消息并订阅响应
  completion.sendCompletion().subscribe((message: any) => {
    // 打印返回的消息内容
    console.log(message.content);
    // 将返回的消息内容赋值给组件内的responseMsg属性
    this.responseMsg = message.content;

    this.cdr.detectChanges();
    // 判断消息是否完成，如果完成则设置isComplete为true
    if (message?.complete) {
      this.isComplete = true;
      this.addadvise(PromptTemplate);
    }
  });
}
overrideText() {
  this.responseMsg = "这是覆盖后的新文本"; // 设置为新的文本
}

gopage(){
  this.router.navigate(['/tabs/tab1'])
}


 currentadivse: CloudObject | undefined; // 
  advisedata: any = {};
  async addadvise(userresult:string) {
    let currentUser = new CloudUser();
    if (currentUser?.id) {
      this.currentadivse?.addPointer('user', '_User', currentUser.id);
  }
    if(this.isComplete){
      this.advisedata['content']=this.responseMsg;
      this.advisedata['type']='text';
      this.advisedata['idea']="主题："+this.userPrompt+"风格："+this.artStyle;
    }
    this.currentadivse?.set(this.advisedata);
    await this.currentadivse?.save();
  }

}