s202226701032/mcbridge-app/src/app/inquiry/inquiry.component.ts

import { CommonModule } from '@angular/common';
import { Component, OnInit } from '@angular/core';
import { IonCard, IonCardHeader, IonCardTitle, IonCardContent } from '@ionic/angular/standalone';
import { IonHeader, IonToolbar, IonTitle, IonContent } from '@ionic/angular/standalone';
import { IonTextarea, IonButton,IonInput } from "@ionic/angular/standalone";
import { DalleOptions, ImagineWork, FmodeChatCompletion } from 'fmode-ng';

@Component({
  selector: 'app-inquiry',
  templateUrl: './inquiry.component.html',
  styleUrls: ['./inquiry.component.scss'],
  standalone: true,
  imports: [
    IonHeader, IonToolbar, IonTitle, IonContent, 
    IonButton,
    IonInput,
    IonTextarea,
    IonCard,
    IonCardHeader,
    IonCardTitle,
    IonCardContent,
    CommonModule
  ],
})
export class InquiryComponent  implements OnInit {
  userPrompt:string = ""
  promptInput(ev:any){
    this.userPrompt = ev.detail.value;
  }
  imagineWork:ImagineWork|undefined
  images:Array<string> = []
  constructor(
  ){
    // 示例任务，自己生成图片后请存储新的ID
    this.imagineWork = new ImagineWork("4mPR0IW1i5");
    this.imagineWork.fetchTask().then(work=>{
      this.images = this.imagineWork?.images || [];
    })
  }

  PictureDescResult:string = `` // 画面描述结果
  async createImage(){
    this.imagineWork = new ImagineWork();
    // 文本生成
    let PromptTemplate = `您是一名专业的美术画家，请您根据症状描述，将其描述的症状等用最简短的语言概括，直接画出出该症状的相应图
    症状如下：
    ${this.userPrompt}
    `
    let completion = new FmodeChatCompletion([
      {role:"system",content:""},
      {role:"user",content:PromptTemplate}
    ])
    completion.sendCompletion().subscribe((message:any)=>{
      // 打印消息体
      console.log(message.content)
      // 赋值消息内容给组件内属性
      this.PictureDescResult = message.content
      if(message?.complete){ // 判断message为完成状态，则设置isComplete为完成
        // 图片生成
        let PicturePrompt = `${this.PictureDescResult}\n`
        let options:DalleOptions = {prompt:PicturePrompt}
        this.imagineWork?.draw(options).subscribe(work=>{
            console.log("imagineWork",work?.toJSON())
            console.log("images",work?.get("images"))
            if(work?.get("images")?.length){
              this.images = work?.get("images");
            }
        })
      }
    })

    
  }
  trackImage(index: number, imageUrl: string) {
    return imageUrl; // 返回图像URL作为跟踪标识
  }
  ngOnInit() {}

}