<template>
  <div class="container_layout">
    <!-- 顶部导航条区域 -->
    <div class="layout_header">
      <Header />
    </div>
    <!-- 主体区域 -->
    <div class="layout_main">
      
      <UserMain />
    </div>
    <div>
      <el-drawer title="Ai助教" :visible.sync="showAiDrawer" :direction="direction" :withHeader="false"
        :before-close="CloseAiDrawer" size="70%">
        <div class="ai_robot_drawer">
          <div class="drawer_left">
            <div class="robot_head">
              <img src="@/assets/bg/ai_robot.gif" alt=""></img>
            </div>
            <!-- <div class="robot_go_home" @click="GoAiHome">
              去主页
            </div> -->
          </div>
          <div class="drawer_right">
            <AiChat :isShowQuickList="false" ref="aiRobot"></AiChat>
          </div>
        </div>
      </el-drawer>
    </div>
  </div>
</template>
<script>
import UserMain from "./components/UserMain"//主页面

import Header from "../layout/components/Header.vue"//头部
import AiChat from '@/components/AiRobot.vue'//ai智能对话组件
export default {
  components: {
    UserMain,
    Header,
    AiChat
  },
  provide() {
    return {
      openAiRobot: this.OpenAiRobot
    }
  },
  data() {
    return {
      showAiDrawer:false,//是否显示ai对话框
      direction: 'rtl',//对话框方向
      isAiGenerating: false, // 标记AI是否正在生成内容

    }
  },
  computed:{},
  mounted() {
    
     
  },
  methods: { 
    //关闭ai对话框
    CloseAiDrawer()
    {
      this.showAiDrawer=false;
    },

    //打开ai对话框
    OpenAiRobot(content) 
    {
      this.showAiDrawer = true;
      console.log("打印打开ai对话框",);
      if (this.$refs.aiRobot && typeof this.$refs.aiRobot.SetInputContent === 'function') {
        this.isAiGenerating = this.$refs.aiRobot.loading;
      }

      // 如果AI正在生成内容，则不发起新请求
      if (this.isAiGenerating) {
        console.log("AI正在生成内容，请稍后再试");
        this.$message.alert("AI正在生成内容，请稍后再试");
        return;
      }
      // 设置AI正在生成的标志
      this.isAiGenerating = true;
      if (content) {
        console.log("打开ai对话框", content);
        // this.$refs.aiRobot.SetInputContent(content);
        // 添加安全检查
        this.$nextTick(() => {
          if (this.$refs.aiRobot && typeof this.$refs.aiRobot.SetInputContent === 'function') {
            this.$refs.aiRobot.SetInputContent(content);
          } else {
            console.warn('aiRobot 组件引用或 SetInputContent 方法不存在');
          }
        });
      }
    },

    //去主页
    GoAiHome()
    {

    },

    //停止对话
    StopMessage()
    {

    },
  }
}
</script>
<style lang="scss" scoped>
@import "@/styles/target.scss";
</style>
