@phonghq/go-chat 1.0.62 → 1.0.64
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chat/page/home/ChatList.vue.js +63 -2
- package/dist/chat/page/home/ChatMessage.vue.js +3 -1
- package/dist/chat/page/home/ChatMessageItem.vue.js +2 -2
- package/dist/chat/page/home/Home.vue.js +4 -2
- package/dist/chat/page/home/NewCustomer.vue.d.ts +1 -0
- package/dist/chat/page/home/NewCustomer.vue.js +14 -6
- package/dist/components/chat/call/Calling.vue.js +8 -13
- package/dist/components/chat/common/tabs/TabBase.vue.js +2 -1
- package/dist/composable/useListConversations.js +19 -17
- package/dist/composable/usePlivo.d.ts +1 -0
- package/dist/composable/usePlivo.js +6 -8
- package/dist/constant/mqtt.d.ts +1 -0
- package/dist/constant/mqtt.js +1 -0
- package/dist/go-chat.es.js +10034 -9973
- package/dist/go-chat.umd.js +21 -21
- package/dist/plugins/mqtt.js +19 -3
- package/dist/style.css +1 -1
- package/dist/utils/chat/store/message.js +0 -1
- package/package.json +1 -1
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
import InputSearch from '../../../components/chat/common/input/InputSearch.vue';
|
|
2
2
|
import IconPlus from '../../../assets/icons/global/IconPlus.vue';
|
|
3
|
-
import { computed, ref } from 'vue';
|
|
3
|
+
import { computed, onMounted, onUnmounted, ref } from 'vue';
|
|
4
4
|
import Avatar from '../../../components/chat/customer/Avatar.vue';
|
|
5
5
|
import { getConversationView } from '../../../utils/chat/store/conversation';
|
|
6
6
|
import ScrollEvent from '../../../components/chat/ScrollEvent/ScrollEvent.vue';
|
|
7
7
|
import { useDebounce } from '../../../utils/debounce';
|
|
8
|
+
import { addHandleMqttMessage, connectMqtt, removeHandleMqttMessage, subscribeToTopic, unsubscribeFromTopic } from '../../../plugins/mqtt';
|
|
9
|
+
import { TOPIC_CUSTOMER_RELOAD } from '../../../constant/mqtt';
|
|
8
10
|
import { dataProfile } from '../../../utils/chat/store/auth';
|
|
11
|
+
import { getDetailReceiver } from '../../../utils/chat/store/message';
|
|
9
12
|
import dayjs from 'dayjs';
|
|
10
13
|
import relativeTime from 'dayjs/plugin/relativeTime';
|
|
11
14
|
import updateLocale from 'dayjs/plugin/updateLocale';
|
|
@@ -45,16 +48,34 @@ const TAB_VALUE = {
|
|
|
45
48
|
UNKNOWN: 1
|
|
46
49
|
};
|
|
47
50
|
const tabs = computed(() => [
|
|
48
|
-
{ label: 'All', value: TAB_VALUE.ALL },
|
|
51
|
+
{ label: 'All', value: TAB_VALUE.ALL, badge: (listConversationsAllUnread.value || '').toString() },
|
|
49
52
|
{
|
|
50
53
|
label: 'Message Requests',
|
|
51
54
|
value: TAB_VALUE.UNKNOWN,
|
|
52
55
|
badge: (listConversationsUnknownUnread.value || '').toString()
|
|
53
56
|
}
|
|
54
57
|
]);
|
|
58
|
+
let topic_customer_update = '';
|
|
55
59
|
const { digibotData, digibotId } = useDigibot();
|
|
56
60
|
const { listConversations: listConversationsAll, getData: getDataAll, params: paramsAll, pageCount: pageCountAll, handleReadMessage: handleReadMessageAll, getDataCache: getDataCacheAll } = useListConversations(TAB_VALUE.ALL, dataProfile.value?.user_type === 'tenant');
|
|
57
61
|
const { listConversations: listConversationsUnknown, getData: getDataUnknown, params: paramsUnknown, pageCount: pageCountUnknown, handleReadMessage: handleReadMessageUnknown, getDataCache: getDataCacheUnknown } = useListConversations(TAB_VALUE.UNKNOWN, dataProfile.value?.user_type === 'tenant');
|
|
62
|
+
onMounted(async () => {
|
|
63
|
+
try {
|
|
64
|
+
if (dataProfile.value) {
|
|
65
|
+
await connectMqtt();
|
|
66
|
+
topic_customer_update = `tenant/${dataProfile.value?.tenant_id}/customer/+/update`;
|
|
67
|
+
subscribeToTopic(topic_customer_update);
|
|
68
|
+
addHandleMqttMessage('chat-list', topic_customer_update, mqttMessageHandler);
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
catch (error) {
|
|
72
|
+
console.error(error);
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
onUnmounted(() => {
|
|
76
|
+
unsubscribeFromTopic(topic_customer_update);
|
|
77
|
+
removeHandleMqttMessage('chat-list');
|
|
78
|
+
});
|
|
58
79
|
const receiver_id = defineModel('receiverId');
|
|
59
80
|
const listConversations = computed(() => {
|
|
60
81
|
if (activeTabs.value == TAB_VALUE.ALL)
|
|
@@ -64,6 +85,9 @@ const listConversations = computed(() => {
|
|
|
64
85
|
const listConversationsUnknownUnread = computed(() => {
|
|
65
86
|
return (listConversationsUnknown.value.reduce((total, cur) => total + (cur?.unread_count ?? 0), 0) ?? 0);
|
|
66
87
|
});
|
|
88
|
+
const listConversationsAllUnread = computed(() => {
|
|
89
|
+
return (listConversationsAll.value.reduce((total, cur) => total + (cur?.unread_count ?? 0), 0) ?? 0);
|
|
90
|
+
});
|
|
67
91
|
const keyword = ref('');
|
|
68
92
|
const activeTabs = ref(TAB_VALUE.ALL);
|
|
69
93
|
const scrollEventRef = ref(null);
|
|
@@ -104,6 +128,43 @@ const getData = async (data, option) => {
|
|
|
104
128
|
isLoadingSearch.value = false;
|
|
105
129
|
}
|
|
106
130
|
};
|
|
131
|
+
const mqttMessageHandler = async (topic, data) => {
|
|
132
|
+
const subParts = TOPIC_CUSTOMER_RELOAD.split('/');
|
|
133
|
+
const topicParts = topic.split('/');
|
|
134
|
+
const idIndex = subParts.findIndex((p) => p === '+');
|
|
135
|
+
const id = topicParts[idIndex];
|
|
136
|
+
const customer = await getDetailReceiver(id);
|
|
137
|
+
const isAllTab = !!customer.username;
|
|
138
|
+
const correctList = isAllTab ? listConversationsAll.value : listConversationsUnknown.value;
|
|
139
|
+
const wrongList = isAllTab ? listConversationsUnknown.value : listConversationsAll.value;
|
|
140
|
+
const updatePayload = {
|
|
141
|
+
username: customer.username,
|
|
142
|
+
phone: customer.phone,
|
|
143
|
+
avatar: customer.avatar,
|
|
144
|
+
color: customer.color,
|
|
145
|
+
local_id: customer.conversation_id
|
|
146
|
+
};
|
|
147
|
+
const correctIndex = correctList.findIndex((conversation) => conversation.id === customer.conversation_id);
|
|
148
|
+
if (correctIndex > -1) {
|
|
149
|
+
Object.assign(correctList[correctIndex], updatePayload);
|
|
150
|
+
}
|
|
151
|
+
const wrongIndex = wrongList.findIndex((c) => c.id === customer.conversation_id);
|
|
152
|
+
if (wrongIndex > -1) {
|
|
153
|
+
const conversation = wrongList[wrongIndex];
|
|
154
|
+
wrongList.splice(wrongIndex, 1);
|
|
155
|
+
const hasChatBox = listConversations.value.findIndex((item) => item.id === digibotId);
|
|
156
|
+
const data_format = {
|
|
157
|
+
...conversation,
|
|
158
|
+
...updatePayload
|
|
159
|
+
};
|
|
160
|
+
if (hasChatBox > -1) {
|
|
161
|
+
correctList.splice(1, 0, data_format);
|
|
162
|
+
}
|
|
163
|
+
else {
|
|
164
|
+
correctList.unshift(data_format);
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
};
|
|
107
168
|
const getAllList = async (tab_value) => {
|
|
108
169
|
if (tab_value == TAB_VALUE.ALL) {
|
|
109
170
|
while (paramsAll.value.page < pageCountAll.value && !scrollEventRef.value?.canScroll()) {
|
|
@@ -102,13 +102,15 @@ if (__VLS_ctx.showNewCustomer) {
|
|
|
102
102
|
const __VLS_9 = __VLS_asFunctionalComponent(NewCustomer, new NewCustomer({
|
|
103
103
|
...{ class: "h-full" },
|
|
104
104
|
data: (__VLS_ctx.data),
|
|
105
|
+
isNew: (!__VLS_ctx.message.length),
|
|
105
106
|
}));
|
|
106
107
|
const __VLS_10 = __VLS_9({
|
|
107
108
|
...{ class: "h-full" },
|
|
108
109
|
data: (__VLS_ctx.data),
|
|
110
|
+
isNew: (!__VLS_ctx.message.length),
|
|
109
111
|
}, ...__VLS_functionalComponentArgsRest(__VLS_9));
|
|
110
112
|
// @ts-ignore
|
|
111
|
-
[data,];
|
|
113
|
+
[data, message,];
|
|
112
114
|
}
|
|
113
115
|
__VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
|
|
114
116
|
...{ class: "chat-padding-page" },
|
|
@@ -156,7 +156,7 @@ if (__VLS_ctx.message.state != __VLS_ctx.MessageState.Sending || __VLS_ctx.isMyM
|
|
|
156
156
|
'rounded-bl-[6px]': !__VLS_ctx.isChatFinished && !__VLS_ctx.isMyMessage,
|
|
157
157
|
'rounded-tr-[6px]': !__VLS_ctx.isChatStart && __VLS_ctx.isMyMessage,
|
|
158
158
|
'rounded-br-[6px]': !__VLS_ctx.isChatFinished && __VLS_ctx.isMyMessage,
|
|
159
|
-
'!text-white !bg-chat-success': (__VLS_ctx.message.message_uuid && !__VLS_ctx.message.is_call) || __VLS_ctx.message.is_sms,
|
|
159
|
+
'!text-white !bg-chat-success': ((__VLS_ctx.message.message_uuid && !__VLS_ctx.message.is_call) || __VLS_ctx.message.is_sms) && __VLS_ctx.isMyMessage,
|
|
160
160
|
'bg-chat-primary text-white': __VLS_ctx.isMyMessage && !__VLS_ctx.message.is_call,
|
|
161
161
|
'bg-[#E4E4E4D4] text-chat-haze-600': !__VLS_ctx.isMyMessage || __VLS_ctx.message.is_call,
|
|
162
162
|
'ml-auto': __VLS_ctx.isMyMessage,
|
|
@@ -166,7 +166,7 @@ if (__VLS_ctx.message.state != __VLS_ctx.MessageState.Sending || __VLS_ctx.isMyM
|
|
|
166
166
|
}) },
|
|
167
167
|
});
|
|
168
168
|
// @ts-ignore
|
|
169
|
-
[isMyMessage, isMyMessage, isMyMessage, isMyMessage, isMyMessage, isMyMessage, isMyMessage, isMyMessage, message, message, message, message, message, responsive, responsive, isChatStart, isChatStart, isChatFinished, isChatFinished,];
|
|
169
|
+
[isMyMessage, isMyMessage, isMyMessage, isMyMessage, isMyMessage, isMyMessage, isMyMessage, isMyMessage, isMyMessage, message, message, message, message, message, responsive, responsive, isChatStart, isChatStart, isChatFinished, isChatFinished,];
|
|
170
170
|
if (__VLS_ctx.message.is_call == 1) {
|
|
171
171
|
// @ts-ignore
|
|
172
172
|
[message,];
|
|
@@ -105,7 +105,7 @@ const handleGetMessage = async (option) => {
|
|
|
105
105
|
if (page <= 1) {
|
|
106
106
|
listMessage.value = data;
|
|
107
107
|
chatMessageRef.value?.scrollBottom();
|
|
108
|
-
setCache(MESSAGE_STORAGE_KEY + id,
|
|
108
|
+
setCache(MESSAGE_STORAGE_KEY + id, data);
|
|
109
109
|
removeOldestCache(8, MESSAGE_STORAGE_KEY);
|
|
110
110
|
}
|
|
111
111
|
else {
|
|
@@ -351,13 +351,15 @@ else if (!__VLS_ctx.isLoading) {
|
|
|
351
351
|
const __VLS_18 = __VLS_asFunctionalComponent(NewCustomer, new NewCustomer({
|
|
352
352
|
data: (__VLS_ctx.infoUser),
|
|
353
353
|
...{ class: "grow" },
|
|
354
|
+
isNew: (!__VLS_ctx.listMessage.length),
|
|
354
355
|
}));
|
|
355
356
|
const __VLS_19 = __VLS_18({
|
|
356
357
|
data: (__VLS_ctx.infoUser),
|
|
357
358
|
...{ class: "grow" },
|
|
359
|
+
isNew: (!__VLS_ctx.listMessage.length),
|
|
358
360
|
}, ...__VLS_functionalComponentArgsRest(__VLS_18));
|
|
359
361
|
// @ts-ignore
|
|
360
|
-
[infoUser,];
|
|
362
|
+
[infoUser, listMessage,];
|
|
361
363
|
}
|
|
362
364
|
else {
|
|
363
365
|
__VLS_asFunctionalElement(__VLS_elements.span, __VLS_elements.span)({
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { IResUser } from '../../../types/message';
|
|
2
2
|
type Props = {
|
|
3
3
|
data: IResUser | null;
|
|
4
|
+
isNew: boolean;
|
|
4
5
|
};
|
|
5
6
|
declare const _default: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
6
7
|
export default _default;
|
|
@@ -45,12 +45,20 @@ __VLS_asFunctionalElement(__VLS_elements.h2, __VLS_elements.h2)({
|
|
|
45
45
|
(__VLS_ctx.data?.username || __VLS_ctx.phoneNumberFormat(__VLS_ctx.data?.phone ?? '') || 'n/a');
|
|
46
46
|
// @ts-ignore
|
|
47
47
|
[data, data, phoneNumberFormat,];
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
__VLS_asFunctionalElement(__VLS_elements.
|
|
52
|
-
|
|
53
|
-
});
|
|
48
|
+
if (__VLS_ctx.isNew) {
|
|
49
|
+
// @ts-ignore
|
|
50
|
+
[isNew,];
|
|
51
|
+
__VLS_asFunctionalElement(__VLS_elements.img)({
|
|
52
|
+
src: "../../../assets/images/icons/new-customer.png",
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
if (__VLS_ctx.isNew) {
|
|
56
|
+
// @ts-ignore
|
|
57
|
+
[isNew,];
|
|
58
|
+
__VLS_asFunctionalElement(__VLS_elements.p, __VLS_elements.p)({
|
|
59
|
+
...{ class: "text-chat-haze-400 text-sm mt-3 max-w-md" },
|
|
60
|
+
});
|
|
61
|
+
}
|
|
54
62
|
/** @type {__VLS_StyleScopedClasses['flex']} */ ;
|
|
55
63
|
/** @type {__VLS_StyleScopedClasses['flex-col']} */ ;
|
|
56
64
|
/** @type {__VLS_StyleScopedClasses['items-center']} */ ;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="C:/phonghq/go-chat-v2/node_modules/.vue-global-types/vue_3.5_0.d.ts" />
|
|
2
|
-
import { computed, onMounted, onUnmounted, ref } from 'vue';
|
|
2
|
+
import { computed, onBeforeUnmount, onMounted, onUnmounted, ref } from 'vue';
|
|
3
3
|
import IconPhone from '../../../assets/icons/call/IconPhone.vue';
|
|
4
4
|
import { dataProfile } from '../../../utils/chat/store/auth';
|
|
5
5
|
import IconPhoneCancel from '../../../assets/icons/call/IconPhoneCancel.vue';
|
|
@@ -31,13 +31,11 @@ const handlePlivoCallBack = (status, data) => {
|
|
|
31
31
|
getUserOffer(data?.phone ?? '');
|
|
32
32
|
}
|
|
33
33
|
else if (status == PLIVO_CALL_STATUS.CONNECT_FAILED || status == PLIVO_CALL_STATUS.NO_ANSWER) {
|
|
34
|
-
console.log('5555555555555555555555555555555555555555555');
|
|
35
34
|
endCall();
|
|
36
35
|
}
|
|
37
36
|
else if (status == PLIVO_CALL_STATUS.CALL_END) {
|
|
38
37
|
errorMessage.value = data?.message ?? '';
|
|
39
38
|
const closeModal = data?.reason == 'ORIGINATOR_CANCEL';
|
|
40
|
-
console.log('6666666666666666666666666666666666666666666666666');
|
|
41
39
|
endCall({ closeModal });
|
|
42
40
|
}
|
|
43
41
|
else if (status == PLIVO_CALL_STATUS.CALL_START) {
|
|
@@ -48,7 +46,7 @@ const handlePlivoCallBack = (status, data) => {
|
|
|
48
46
|
handleMedialPermissionError();
|
|
49
47
|
}
|
|
50
48
|
};
|
|
51
|
-
const { plivoLogin, plivoCallAnswer, plivoCall, plivoEndCall, plivoCallSwishMute, plivoCallSwishSpeaker, checkTimeLimit } = usePlivo(handlePlivoCallBack);
|
|
49
|
+
const { plivoLogin, plivoCallAnswer, plivoCall, plivoEndCall, plivoCallSwishMute, plivoCallSwishSpeaker, plivoRemoveCallBack, checkTimeLimit } = usePlivo(handlePlivoCallBack);
|
|
52
50
|
const STATUS_LABEL = computed(() => {
|
|
53
51
|
return {
|
|
54
52
|
[PLIVO_CALL_STATUS.CONNECTING]: 'Connecting...',
|
|
@@ -95,13 +93,18 @@ onMounted(async () => {
|
|
|
95
93
|
showPageError('We’re having trouble connecting the call. Please try again in a moment');
|
|
96
94
|
}
|
|
97
95
|
});
|
|
96
|
+
onBeforeUnmount(() => {
|
|
97
|
+
console.log('ssssssssssssssssssssssss');
|
|
98
|
+
plivoRemoveCallBack();
|
|
99
|
+
});
|
|
98
100
|
onUnmounted(() => {
|
|
101
|
+
console.log('ssssssssssssssssssssssss');
|
|
99
102
|
if (timer)
|
|
100
103
|
clearInterval(timer);
|
|
101
104
|
if (timeOut)
|
|
102
105
|
clearTimeout(timeOut);
|
|
103
|
-
console.log('7777777777777777777777777777777777777777777777777');
|
|
104
106
|
endCall();
|
|
107
|
+
plivoRemoveCallBack();
|
|
105
108
|
errorMessage.value = '';
|
|
106
109
|
});
|
|
107
110
|
let dataWebSK = null;
|
|
@@ -113,15 +116,12 @@ function startTimer() {
|
|
|
113
116
|
const m = String(Math.floor(sec / 60)).padStart(2, '0');
|
|
114
117
|
const s = String(sec % 60).padStart(2, '0');
|
|
115
118
|
duration.value = `${m}:${s}`;
|
|
116
|
-
console.log(limitTime.value);
|
|
117
|
-
console.log(!limitTime.value || limitTime.value <= 0);
|
|
118
119
|
if (!limitTime.value || limitTime.value <= 0) {
|
|
119
120
|
handleTimeLimitError();
|
|
120
121
|
}
|
|
121
122
|
}, 1000);
|
|
122
123
|
}
|
|
123
124
|
function endCall(option) {
|
|
124
|
-
console.log('aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa');
|
|
125
125
|
if (option?.closeModal) {
|
|
126
126
|
closeModal();
|
|
127
127
|
}
|
|
@@ -171,7 +171,6 @@ const refreshToken = async () => {
|
|
|
171
171
|
};
|
|
172
172
|
const handleInComingCall = (data) => {
|
|
173
173
|
limitTime.value = data?.limit_time ?? 0;
|
|
174
|
-
console.log('saaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa', data);
|
|
175
174
|
if (limitTime.value <= 0) {
|
|
176
175
|
handleTimeLimitError();
|
|
177
176
|
return;
|
|
@@ -204,13 +203,11 @@ const startCall = async (data) => {
|
|
|
204
203
|
handleTimeLimitError();
|
|
205
204
|
return;
|
|
206
205
|
}
|
|
207
|
-
console.log('limitTime.value', limitTime.value);
|
|
208
206
|
callType = 'call';
|
|
209
207
|
await plivoCall(data.phone);
|
|
210
208
|
callStatus.value = PLIVO_CALL_STATUS.CALLING;
|
|
211
209
|
}
|
|
212
210
|
catch (e) {
|
|
213
|
-
console.log('111111111111111111111111');
|
|
214
211
|
endCall();
|
|
215
212
|
console.log(e);
|
|
216
213
|
errorMessage.value = e?.message || JSON.stringify(e);
|
|
@@ -222,7 +219,6 @@ const answer = async () => {
|
|
|
222
219
|
await plivoCallAnswer();
|
|
223
220
|
}
|
|
224
221
|
catch (e) {
|
|
225
|
-
console.log('222222222222222222222222222222');
|
|
226
222
|
endCall();
|
|
227
223
|
callStatus.value = PLIVO_CALL_STATUS.CONNECT_FAILED;
|
|
228
224
|
errorMessage.value = e?.message || JSON.stringify(e);
|
|
@@ -252,7 +248,6 @@ const getUserOffer = async (phone) => {
|
|
|
252
248
|
};
|
|
253
249
|
const handleTimeLimitError = () => {
|
|
254
250
|
errorMessage.value = 'Call time limit reached. This call has ended.';
|
|
255
|
-
console.log('3333333333333333333333333333333333333333333333');
|
|
256
251
|
endCall();
|
|
257
252
|
};
|
|
258
253
|
const exportRecordFile = async () => {
|
|
@@ -59,7 +59,7 @@ for (const [item] of __VLS_getVForSourceType((__VLS_ctx.tabs))) {
|
|
|
59
59
|
}, ...__VLS_functionalComponentArgsRest(__VLS_11));
|
|
60
60
|
const { default: __VLS_14 } = __VLS_13.slots;
|
|
61
61
|
__VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
|
|
62
|
-
...{ class: "w-5 h-5 bg-chat-error rounded-full absolute -top-[8px] -right-2 text-white" },
|
|
62
|
+
...{ class: "w-5 h-5 bg-chat-error rounded-full absolute -top-[8px] -right-2 text-white z-[10]" },
|
|
63
63
|
});
|
|
64
64
|
__VLS_asFunctionalDirective(__VLS_directives.vShow)(null, { ...__VLS_directiveBindingRestFields, value: (item.badge) }, null, null);
|
|
65
65
|
(item.badge);
|
|
@@ -84,6 +84,7 @@ var __VLS_3;
|
|
|
84
84
|
/** @type {__VLS_StyleScopedClasses['-top-[8px]']} */ ;
|
|
85
85
|
/** @type {__VLS_StyleScopedClasses['-right-2']} */ ;
|
|
86
86
|
/** @type {__VLS_StyleScopedClasses['text-white']} */ ;
|
|
87
|
+
/** @type {__VLS_StyleScopedClasses['z-[10]']} */ ;
|
|
87
88
|
const __VLS_export = (await import('vue')).defineComponent({
|
|
88
89
|
__typeEmits: {},
|
|
89
90
|
__typeProps: {},
|
|
@@ -3,7 +3,7 @@ import { TOPIC_HOME } from '../constant/mqtt';
|
|
|
3
3
|
import { addHandleMqttMessage, connectMqtt, publishMessage, removeHandleMqttMessage, subscribeToTopic, unsubscribeFromTopic } from '../plugins/mqtt';
|
|
4
4
|
import { dataProfile } from '../utils/chat/store/auth';
|
|
5
5
|
import { useDebounce } from '../utils/debounce';
|
|
6
|
-
import { getConversation } from '../utils/chat/store/conversation';
|
|
6
|
+
import { getConversation, getConversationView } from '../utils/chat/store/conversation';
|
|
7
7
|
import { readMessages } from '../utils/chat/store/message';
|
|
8
8
|
import dayjs from 'dayjs';
|
|
9
9
|
import { useDigibot } from '../composable/useDigibot';
|
|
@@ -51,23 +51,17 @@ export const useListConversations = (is_unknown, is_tenant) => {
|
|
|
51
51
|
}
|
|
52
52
|
addHandleMqttMessage('chat-list-' + item + '-' + is_unknown, item + dataProfile.value?.id, mqttMessageHandler);
|
|
53
53
|
});
|
|
54
|
-
// subscribeToTopic(TOPIC_STATUS_USER + dataProfile.value?.id)
|
|
55
|
-
// addHandleMqttMessage(
|
|
56
|
-
// 'chat-list-' + TOPIC_STATUS_USER + '-' + is_unknown,
|
|
57
|
-
// TOPIC_STATUS_USER + dataProfile.value?.id,
|
|
58
|
-
// mqttMessageHandler
|
|
59
|
-
// )
|
|
60
54
|
}
|
|
61
55
|
}
|
|
62
56
|
catch (error) {
|
|
63
57
|
console.error(error);
|
|
64
58
|
}
|
|
65
59
|
};
|
|
66
|
-
const mqttMessageHandler = (topic, data) => {
|
|
67
|
-
if
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
}
|
|
60
|
+
const mqttMessageHandler = async (topic, data) => {
|
|
61
|
+
// if(topic == TOPIC_HOME[3] + dataProfile.value?.id ) {
|
|
62
|
+
// getData({}, {reset: true})
|
|
63
|
+
// return
|
|
64
|
+
// }
|
|
71
65
|
if ((data.is_unknown ?? 0) == is_unknown || (!is_tenant && is_unknown == 0)) {
|
|
72
66
|
getDataMqttDebounce();
|
|
73
67
|
if (topic ===
|
|
@@ -76,17 +70,25 @@ export const useListConversations = (is_unknown, is_tenant) => {
|
|
|
76
70
|
const index = listConversations.value.findIndex((item) => item.id === data.id);
|
|
77
71
|
const hasChatBox = listConversations.value.findIndex((item) => item.id === digibotId);
|
|
78
72
|
if (index != -1) {
|
|
79
|
-
|
|
80
|
-
data.
|
|
81
|
-
data.
|
|
82
|
-
data.receiver_id =
|
|
73
|
+
let conversation = listConversations.value[index];
|
|
74
|
+
data.username = conversation.username;
|
|
75
|
+
data.color = conversation.color;
|
|
76
|
+
data.receiver_id = conversation.receiver_id;
|
|
77
|
+
data.phone = conversation.phone;
|
|
83
78
|
listConversations.value.splice(index, 1);
|
|
84
79
|
}
|
|
80
|
+
else {
|
|
81
|
+
const conversation = await getConversationView(data.id);
|
|
82
|
+
data.username = conversation.username;
|
|
83
|
+
data.color = conversation.color;
|
|
84
|
+
data.receiver_id = conversation.receiver_id;
|
|
85
|
+
data.phone = conversation.phone;
|
|
86
|
+
}
|
|
87
|
+
// data.receiver_id = data.receiver_id != dataProfile.value?.id ? data.receiver_id : data.sender_id
|
|
85
88
|
if (hasChatBox > -1) {
|
|
86
89
|
listConversations.value.splice(1, 0, data);
|
|
87
90
|
}
|
|
88
91
|
else {
|
|
89
|
-
data.receiver_id = data.receiver_id != dataProfile.value?.id ? data.receiver_id : data.sender_id;
|
|
90
92
|
listConversations.value.unshift(data);
|
|
91
93
|
}
|
|
92
94
|
}
|
|
@@ -10,5 +10,6 @@ export declare function usePlivo(callback: (status: PlivoCallStatusType, data?:
|
|
|
10
10
|
plivoEndCall: (status: PlivoCallStatusType) => void;
|
|
11
11
|
plivoCallSwishMute: (isMute: boolean) => void;
|
|
12
12
|
plivoCallSwishSpeaker: (id: any) => void;
|
|
13
|
+
plivoRemoveCallBack: () => void;
|
|
13
14
|
checkTimeLimit: () => Promise<number>;
|
|
14
15
|
};
|
|
@@ -19,9 +19,7 @@ export function usePlivo(callback) {
|
|
|
19
19
|
try {
|
|
20
20
|
if (!plivoBrowserSdk) {
|
|
21
21
|
plivoBrowserSdk = new window.Plivo(options);
|
|
22
|
-
plivoBrowserSdk?.client?.on?.('onCallAnswered',
|
|
23
|
-
handleCallAnswered(callInfo);
|
|
24
|
-
});
|
|
22
|
+
plivoBrowserSdk?.client?.on?.('onCallAnswered', handleCallAnswered);
|
|
25
23
|
plivoBrowserSdk?.client?.on?.('onCallTerminated', (hangupInfo, callInfo) => handleCallTerminated(hangupInfo, callInfo));
|
|
26
24
|
plivoBrowserSdk.client.on('onCallFailed', (data, callInfo) => {
|
|
27
25
|
handleCallFailed(data, callInfo);
|
|
@@ -71,7 +69,6 @@ export function usePlivo(callback) {
|
|
|
71
69
|
CallUuid = call?.callUUID;
|
|
72
70
|
}
|
|
73
71
|
catch (error) {
|
|
74
|
-
console.log('e11111111111111', error);
|
|
75
72
|
callback(PLIVO_CALL_STATUS.CALL_END);
|
|
76
73
|
}
|
|
77
74
|
};
|
|
@@ -88,7 +85,6 @@ export function usePlivo(callback) {
|
|
|
88
85
|
};
|
|
89
86
|
const handleCallTerminated = (data, callInfo) => {
|
|
90
87
|
if (CallUuid === callInfo.callUUID) {
|
|
91
|
-
console.log('e22222222222222', data);
|
|
92
88
|
callback(PLIVO_CALL_STATUS.CALL_END, { message: data?.reason });
|
|
93
89
|
CallUuid = '';
|
|
94
90
|
}
|
|
@@ -152,14 +148,12 @@ export function usePlivo(callback) {
|
|
|
152
148
|
console.log('handleCallFailed', data);
|
|
153
149
|
if (custom_reject)
|
|
154
150
|
custom_reject?.(data);
|
|
155
|
-
console.log('e,3333333333333333333333333333', data);
|
|
156
151
|
callback(PLIVO_CALL_STATUS.CALL_END, { message: data });
|
|
157
152
|
if (data == 'User Denied Media Access') {
|
|
158
153
|
alert('Microphone access is blocked. Please enable the microphone permission to make a call.');
|
|
159
154
|
}
|
|
160
155
|
};
|
|
161
156
|
const handleIncomingCallCanceled = (callInfo) => {
|
|
162
|
-
console.log('e444444444444444', callInfo);
|
|
163
157
|
callback(PLIVO_CALL_STATUS.CALL_END, { reason: callInfo.reason ?? '' });
|
|
164
158
|
};
|
|
165
159
|
const handleMediaPermission = (e) => {
|
|
@@ -178,9 +172,12 @@ export function usePlivo(callback) {
|
|
|
178
172
|
tenant_id: dataProfile.value?.tenant_id ?? '',
|
|
179
173
|
phone: dataProfile.value?.phone ?? ''
|
|
180
174
|
});
|
|
181
|
-
console.log('res', res);
|
|
182
175
|
return res;
|
|
183
176
|
};
|
|
177
|
+
const plivoRemoveCallBack = () => {
|
|
178
|
+
plivoBrowserSdk?.client?.off?.('onCallAnswered', handleCallAnswered);
|
|
179
|
+
plivoBrowserSdk = null;
|
|
180
|
+
};
|
|
184
181
|
const sleep = () => {
|
|
185
182
|
return new Promise(resolve => setTimeout(resolve, 2000));
|
|
186
183
|
};
|
|
@@ -192,6 +189,7 @@ export function usePlivo(callback) {
|
|
|
192
189
|
plivoEndCall,
|
|
193
190
|
plivoCallSwishMute,
|
|
194
191
|
plivoCallSwishSpeaker,
|
|
192
|
+
plivoRemoveCallBack,
|
|
195
193
|
checkTimeLimit
|
|
196
194
|
};
|
|
197
195
|
}
|
package/dist/constant/mqtt.d.ts
CHANGED
|
@@ -3,4 +3,5 @@ export declare const TOPIC_DETAIL_CALL = "call/message/";
|
|
|
3
3
|
export declare const TOPIC_PLIVO_CALL = "message-call/";
|
|
4
4
|
export declare const TOPIC_PLIVO_SMS = "sms-inbound/";
|
|
5
5
|
export declare const TOPIC_STATUS_USER: string;
|
|
6
|
+
export declare const TOPIC_CUSTOMER_RELOAD: string;
|
|
6
7
|
export declare const TOPIC_HOME: string[];
|
package/dist/constant/mqtt.js
CHANGED
|
@@ -3,6 +3,7 @@ export const TOPIC_DETAIL_CALL = 'call/message/';
|
|
|
3
3
|
export const TOPIC_PLIVO_CALL = 'message-call/';
|
|
4
4
|
export const TOPIC_PLIVO_SMS = 'sms-inbound/';
|
|
5
5
|
export const TOPIC_STATUS_USER = 'user/status/';
|
|
6
|
+
export const TOPIC_CUSTOMER_RELOAD = 'chat/customer/reload/+';
|
|
6
7
|
export const TOPIC_HOME = [
|
|
7
8
|
// 'chat/conversation/update/',
|
|
8
9
|
// 'chat/conversation/read_message/',
|