deji_demo/main.js

import { onchangeSize,initDate,setScrollPosition,addBackItemText,addItemImg,addAvdi,addredHot,addBackItemAction } from "./util.js";
import { btnStatus,recorder,getWebSocketUrl,connectWebSocket } from "./recorder.js"


import { createAlova } from 'alova';
import adapterFetch from 'alova/fetch';

const alovaInstance = createAlova({
  requestAdapter: adapterFetch(),
  responded: response => response.json()
});

window.cli = null
window.woNode = null
window.woVoice = null

window.onload = () => {
    onchangeSize();
    window.addEventListener("resize",onchangeSize);
    initDate();  //初始化时间
    setScrollPosition();  //自动滚动到底部
}


let addMy = () => {
    window. woNode = document.createElement("li");
    window.woNode.className = "right"
    window.woNode.innerHTML="<span>我</span>";
    document.getElementById("cont").appendChild(window.woNode);

    window.woVoice = document.createElement("li");
    window.woVoice.className = "right"
    document.getElementById("cont").appendChild(window.woVoice);
    window.cli = document.createElement("div");
    window.woVoice.appendChild(window.cli);
}




window.audioStart = () => {
    //开始识别
    if (btnStatus === "UNDEFINED" || btnStatus === "CLOSED") {
        connectWebSocket();
        document.getElementById("stopBnt").style.display = "block";
        document.getElementById("startBnt").style.display = "none";
        addMy();  //添加我气泡
        setScrollPosition();
    }
}

function delMy(){
    if(window.cli && !window.cli.innerText){
        window.woVoice.remove();
        window.woNode.remove();
        window.woNode = null;
        window.cli = null;
        window.woVoice = null;
    }
}

//接收模型回复处理内容
function callBack(str){
    document.getElementById("ing").remove();
    // let obj = JSON.parse(str);
    let obj = str;
    addredHot();
    if(obj.code == 200){
        switch(obj.data.type){
            case "shopList" :
                obj.data.value.forEach((item, index)=>{
                    addBackItemAction(item);
                });
                break;
            case "activity" :
                obj.data.value.forEach((item, index)=>{
                    addBackItemAction(item);
                });
                break;
            case "shop" :
                try{
                    if(typeof obj.data.value.length == "number"){
                        addBackItemText(`${obj.data.value[0].name}位于商场 ${obj.data.value[0].house_number},\n下方为您推荐导航线路`);
                        addItemImg("./assets/map.png");
                    }else{
                        addBackItemText(`${obj.data.value.name}位于商场 ${obj.data.value.house_number},\n下方为您推荐导航线路`);
                        addItemImg("./assets/map.png");
                    }
                }catch(e){

                }
                break;
            case "facility" :
                if(typeof obj.data.value.length == "number"){
                    addBackItemText(`下方为您推荐导航到${obj.data.value}的线路`);
                    addItemImg("./assets/map1.png");
                }else{
                    addBackItemText(`下方为您推荐导航到${obj.data.value}的线路`);
                    addItemImg("./assets/map1.png");
                }
                break;
            case "weather" :
                addBackItemText(`${obj.data.value.city}今天天气${obj.data.value.dayweather}，最高温度${obj.data.value.daytemp_float}`);
                break;
            default :
                addBackItemText(obj.data.value);
                break;
        }
        
    }
    addAvdi();
}


let getAiData = async (msg) => {
    const response = await alovaInstance.Post('http://dify.123.1000my.com:59222/v1/workflows/run', {
        inputs: {
            "question": msg
        },
        response_mode: 'blocking',
        user: 'djdemo'
      },{
        headers: {
          'Authorization': 'Bearer app-DjzwAeiecJhqdavo6Xev0fUr'
        }
      });
    console.log(response)
    let res = {
        code:200,
        data: {
            "type": response.data?.outputs?.type,
            "value": response.data?.outputs?.value
        }
    }
    callBack(res)
}

function callAiModel(msg){
    console.log(msg)
    // 调用模型
    addBackItemText("思考中...","ing")
    setScrollPosition();
    // 调用容器方法获得返回
    // 模拟回复
    // callBack('{"code":200,"data":{"type":"shopList","value":[{"name":"夏日精选活动","intro":"夏日精选活动夏日精选活动夏日精选活动夏日精选活动夏日精选活动","logo":"./assets/act.png"},{"name":"夏日精选活动","intro":"夏日精选活动夏日精选活动夏日精选活动夏日精选活动夏日精选活动","shopNum":"L101","logo":"./assets/act.png"}]}}');
    // 调用api
    getAiData(msg)

}

//停止识别后动作
window.audioStop = () => {
    console.log("audioStop")
    console.log(btnStatus)
    //停止识别
    if (btnStatus === "CONNECTING" || btnStatus === "OPEN") {
        // 结束录音
        recorder.stop();
    }else if (btnStatus === "CLOSED"){
        document.getElementById("stopBnt").style.display = "none";
        document.getElementById("startBnt").style.display = "block";
        delMy();  //没有收到语音，删除空气泡
        // 调用模型
        callAiModel(window.cli.innerText)
    }
        
    
}