voiceMate-web/src/store/modules/voice.js

import { ref } from 'vue';
import { Timer } from '@/utils/timer';
import { ElMessage } from 'element-plus'
import usePermissionStore from './permission';

const useVoiceStore = defineStore('voice', () => {

  const usePermission = usePermissionStore();

  let HS_CTI = null;

  // 当前系统状态 - 闲 or 忙
  const systemState = ref(false);

  const telephoneNumber = ref(null);

  // 是否是拨打电话   true: 外呼    false: 来电
  const isMakingCall = ref(false);

  // 刚来电
  const callAnswered = ref(false);
  // 接听中
  const callDialing = ref(false);

  // 横条来电显示
  const noiceBarVisibleState = ref(false);
  // 盒子来电显示
  const noiceBoxVisibleState = ref(false);
  
  // 通话时长
  const callTime = ref('00:00:00');
  const timer = new Timer(callTime);
  
  // 开始时间
  const startTime = '';
  const endTime = '';

  const sessionId = ref(null);

  // 是否有拨打电话权限
  const isAuthPane = computed(() => usePermission.routes.findIndex(({ name }) => name === 'Console') !== -1);

  // 拨打电话
  const onMakingCall = async (phoneNum) => {
    if ( callAnswered.value ) {
      return ElMessage({
        message: '当前状态不允许操作，无法呼出',
        type: 'warning',
      })
    };

    if ( !systemState.value ) {
      return ElMessage({
        message: '作息状态置忙，无法呼出',
        type: 'warning',
      })
    }

    callAnswered.value = true;

    const { data } = await makeCall(phoneNum);

    sessionId.value = data;

    telephoneNumber.value = phoneNum;

    isMakingCall.value = true;

    noiceBarVisibleState.value = true;
  }

  // 接听电话
  const onCallAnswered =  async () => {
    callDialing.value = true;
    callAnswered.value = true;
    await answer();
    timer.start();
    // TODO 这里需要补充其他逻辑
  }

  // 挂断电话
  const onCallDisconnected = async () => {
    noiceBarVisibleState.value = false;
    noiceBoxVisibleState.value = false;
    callAnswered.value = false;
    timer.resetTimer();
    // const currentTimer = timer.updateDisplay();
    
    // 挂断
    await bye();

    ElMessage({
      message: '通话已经结束，挂断成功',
      type: 'success',
      plain: true,
    })

    // TODO 这里需要补充其他逻辑
  }

  // 置忙
  const setBusy = () => {
    systemState.value = false;
    HS_CTI.setBusy().then(res => { console.log(res) });
  };

  // 置闲
  const setIdle = () => {
    systemState.value = true;
    HS_CTI.setIdle().then(res => { console.log(res) });
  }

  // 获取坐席状态
  const getAgentStatus = () => {
    HS_CTI.getAgentStatus().then(res => { console.log(res) })
  }

  // 主动外呼
  const makeCall = called => HS_CTI.makeCall({ called })

  // 接听电话
  const answer = () => {
    HS_CTI.answer().then(res => { console.log(res) })
  }

  // 挂断电话
  const bye = async () => {
    return await HS_CTI.serverBye().then(res => { console.log(res) })
  }

  // 卸载实例
  const unInit = async () => {
    return await HS_CTI.unInit()
  }

  // 下面开始事件监听
  const listenScoketEvent = (CTIEvent) => {
    HS_CTI.on(CTIEvent.OnAgentWorkReport, ({ workStatus, description, callId, phone }) => {

      console.log( "workStatus", workStatus );

      // 销毁实例调用签出接口成功后 - 坐席签出
      if ( workStatus === -1 ) {
        ElMessage({
          message: '坐席签出成功',
          type: 'success',
          plain: true,
        })
      }

      // 登录CTI 成功
      if ( workStatus === 0 ) {
        // ElMessage({
        //   message: '坐席登入成功',
        //   type: 'success',
        //   plain: true,
        // })
      }

      // 登录CTI 成功
      if ( workStatus === 2 ) {
        // ElMessage({
        //   message: '登入成功',
        //   type: 'success',
        //   plain: true,
        // })
      }

      // 调用置闲接口成功后
      if ( workStatus === 2 ) {
        // ElMessage({
        //   message: '坐席状态变更为：置闲',
        //   type: 'success',
        //   plain: true,
        // })
      }

      // 调用置忙接口成功后
      if ( workStatus === 3 ) {
        // ElMessage({
        //   message: '当前坐席状态：置忙',
        //   type: 'warning',
        //   plain: true,
        // })
      }

      // 座席振铃
      if ( workStatus === 5 ) {

        sessionId.value = callId;

        telephoneNumber.value = phone;

        isMakingCall.value = false;

        noiceBarVisibleState.value = true;

        ElMessage({
          message: '来电话了',
          type: 'warning',
          plain: true,
        })
      }

      // 挂断 任意一方挂断
      if ( workStatus === 7 ) {
        
        // ElMessage({
        //   message: '当前坐席状态：置忙',
        //   type: 'warning',
        //   plain: true,
        // })
      }
    })
  }

  // 初始化 通话实例
  const HS_CTI_INSTANCE = (agent_id) => {
    const { Scene, getInstance, LoggerLevels , CTIEvent} = window.HS_CTI;
    HS_CTI = getInstance({
      // 业务返回的坐席outId
      agent_id,
      // 根据城市可能不一样，
      saas_id:'mdj',
      // 业务场景详见 Scene 枚举，
      scene: Scene.Manual,
      // SDK 日志等级
      loggerLevel: LoggerLevels.debug,
      // 环境变量
      env: 'development'
    })

    HS_CTI.init();

    listenScoketEvent(CTIEvent);
  }

  return {
    sessionId,
    isAuthPane,

    callTime,
    isMakingCall,
    
    onMakingCall,
    onCallDisconnected,
    onCallAnswered,
    
    callAnswered,
    callDialing,
    noiceBarVisibleState,
    noiceBoxVisibleState,

    // 电话号码
    telephoneNumber,

    // 系统状态
    systemState,

    // 通话相关
    HS_CTI_INSTANCE,
    setBusy,
    setIdle,
    unInit
  }
})

export default useVoiceStore;