app-gift/app-angular/src/modules/lesson/page-chat/page-chat.component.ts

import { Component } from '@angular/core';
import { TestChatCompletion, TestChatMessage } from '../class-chat-completion';
// 引入Parse第三方库
import * as Parse from "parse"

@Component({
  selector: 'app-page-chat', // 组件的选择器，用于在模板中引用组件
  templateUrl: './page-chat.component.html', // 组件的模板文件路径
  styleUrls: ['./page-chat.component.scss'] // 组件的样式文件路径
})
export class PageChatComponent {
  currentUser = Parse.User.current() // 当前用户对象
  currentTab: string = 'all'; // 当前选项卡的标识符
  changeTab(tab: string) {
    this.currentTab = tab;
  }

  messageList: Array<TestChatMessage> = [] // 消息列表数组
  userInput: string = "" // 用户输入的内容

  completion: TestChatCompletion | undefined // 完成对象
  constructor() {
    this.ref() // 调用ref方法加载AI定制对话的20条消息
  }

  // 加载AI定制对话的20条消息
  async ref() {
    let query = new Parse.Query('AIPet') // 创建Parse查询对象
    query.equalTo('user', Parse.User.current()?.id) // 设置查询条件，筛选出当前用户的消息
    query.descending('createdAt') // 按照创建时间降序排序
    query.limit(20) // 设置查询结果的数量上限为20条
    let request = await query.find() // 执行查询

    request.forEach(item => {
      this.messageList.push({
        role: "user",
        content: item.get('userMessage')
      }) // 将用户消息添加到消息列表中
      this.messageList.push({
        role: "assistant",
        content: item.get('aiMessage')
      }) // 将AI助手的消息添加到消息列表中
    })
  }

  send() {
    this.messageList.push({
      role: "user",
      content: this.userInput
    }) // 将用户输入的消息添加到消息列表中

    let obj = Parse.Object.extend('AIPet') // 创建Parse对象
    let AIPet = new obj() // 创建AIRecipe对象
    AIPet.set('user', {
      __type: 'Pointer',
      className: '_User',
      objectId: Parse.User.current()?.id
    }) // 设置AIRecipe对象的user字段为当前用户的指针
    AIPet.set('userMessage', this.userInput) // 设置AIPet对象的userMessage字段为用户输入的消息

    this.completion = new TestChatCompletion(this.messageList) // 创建TestChatCompletion对象，并传入消息列表
    this.completion?.createCompletionByStream(async (isComplete: Boolean) => {
      if (isComplete) {
        let currentBackMsg = this.messageList[this.messageList.length - 1]
        console.log(currentBackMsg);
        AIPet.set('aiMessage', currentBackMsg?.content) // 设置AIPet对象的aiMessage字段为AI助手的回复消息
        await AIPet.save() // 保存AIPet对象到Parse数据库
        console.log('已保存');
      }
    }) // 通过流式API创建完成对象，并传入回调函数

    this.userInput = "" // 清空用户输入
    console.log(this.messageList);
  }

  // AI计划
  planOptions: any = {
    gender: "未知",
    targets: []
  } // 计划选项对象，包含性别和目标属性
  setOption(key: string, event: any) {
    this.planOptions[key] = event.detail.value; // 更新计划选项对象的属性值
  }
  sendPlan() {
    let content = `宠物的性别:${this.planOptions.gender}，品种，年龄：，体重，
    信息：${this.planOptions.targets?.join(";")}
    补充：
    请扮演符合上述信息既可爱又体贴的宠物陪伴我聊天
    ` // 构建计划的内容字符串
    console.log(content)
    return
    this.messageList.push({
      role: "user",
      content: content
    }) // 将计划的内容添加到消息列表中
    this.completion = new TestChatCompletion(this.messageList) // 创建TestChatCompletion对象，并传入消息列表
    this.completion?.createCompletionByStream() // 通过流式API创建完成对象
    this.userInput = "" // 清空用户输入
  }
}