Files
uniapp-im-shop/TUIKit/components/TUIChat/message-input-toolbar/call-view/index.vue
2026-02-06 23:56:01 +08:00

136 lines
3.5 KiB
Vue

<script setup lang="ts">
import ToolbarItemContainer from '../toolbar-item-container/index.vue'
import custom from '../../../../assets/icon/telephone-icon.svg'
import videoIcon from '../../../../assets/icon/video-icon.svg'
import { isUniFrameWork } from '../../../../utils/env'
import { computed, ref } from 'vue'
import { type IConversationModel } from '@tencentcloud/chat-uikit-engine-lite'
import { navigateTo } from '../../../../../utils/router'
import TUIChatEngine, {
TUIConversationService,
TUIFriendService,
TUIChatService
} from '@tencentcloud/chat-uikit-engine-lite'
const props = withDefaults(
defineProps<{
/** 通话状态: 0 语音 1 视频 */
type ?: '0' | '1'
/** 信息数据 */
currentConversation ?: IConversationModel
}>(),
{
type: '0',
currentConversation: () => ({} as IConversationModel)
}
)
/** 语音通话状态 */
const isType = computed(() => props.type === '0')
const evaluateIcon = isType.value ? custom : videoIcon
const emits = defineEmits(['onDialogPopupShowOrHide'])
const container = ref()
const closeDialog = () => {
container?.value?.toggleDialogDisplay(false)
}
const onDialogShow = () => {
console.log('弹出窗口', props.currentConversation)
const data = props.currentConversation.userProfile
emits('onDialogPopupShowOrHide', true)
if (isType.value) {
let params = {
to: props.currentConversation.conversationID,
conversationType: TUIChatEngine.TYPES.CONV_C2C,
payload: {
text: "拨打语音"
}
}
console.log('params: ', params);
// TUIChatService.sendTextMessage(params)
navigateTo('/pages/room/incom', {
type: 'call',
userID: data.userID,
mediaType: 'audio',
callType: 'out',
})
} else {
let params = {
to: props.currentConversation.conversationID,
conversationType: TUIChatEngine.TYPES.CONV_C2C,
payload: {
text: "拨打视频"
}
}
// TUIChatService.sendTextMessage(params)
uni.setStorageSync('room-parameters', {
callType: 'out',
mediaType: 'video',
targetId: data.userID,
callSelect: 'single',
});
navigateTo('/pages/room/room')
}
}
const onDialogClose = () => {
console.log('关闭窗口')
emits('onDialogPopupShowOrHide', false)
}
const onDial = () => {
const data = props.currentConversation.userProfile
// data.userID
// CallLib.enableMicrophone(true)
// CallLib.startSingleCall(data.userID, 0, '邀请您进行语音通话')
}
</script>
<template>
<!-- needBottomPopup -->
<ToolbarItemContainer ref="container" :iconFile="evaluateIcon" :iconWidth="isUniFrameWork ? '34px' : '20px'"
:iconHeight="isUniFrameWork ? '34px' : '20px'" :title="isType ? '语音通话' : '视频通话'" @onDialogShow="onDialogShow"
@onDialogClose="onDialogClose">
<!-- <view class="box-index">
<view class="top-icon">
<uni-icons
type="back"
color="#ffffff"
size="42rpx"
@click.stop="closeDialog"
></uni-icons>
</view>
<button @click.stop="onDial">拨打</button>
<button
@click.stop="
() => {
CallLib.enableMicrophone(true)
CallLib.accept()
}
"
>
接听
</button>
<button
@click.stop="
() => {
CallLib.enableMicrophone(true)
CallLib.hangup()
}
"
>
挂点
</button>
</view> -->
</ToolbarItemContainer>
</template>
<style scoped lang="scss" src="./style/index.scss"></style>