@phonghq/go-chat 1.0.42 → 1.0.44

package/dist/test/chat/page/customer-check-in/CustomerCheckIn.vue.js

@@ -47,9 +47,11 @@ for (const [year, i] of __VLS_getVForSourceType((__VLS_ctx.checkin))) {
         key: (i),
     }, ...__VLS_functionalComponentArgsRest(__VLS_0));
     const { default: __VLS_3 } = __VLS_2.slots;
+    __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
+        ...{ class: "flex flex-col gap-y-3" },
+    });
     for (const [item] of __VLS_getVForSourceType((year.items))) {
         __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
-            ...{ class: "flex flex-col gap-y-3" },
             key: (item.id),
         });
         /** @type {[typeof CardCustomerDetail, typeof CardCustomerDetail, ]} */ ;

package/dist/test/chat/page/customer-detail/CustomerDetail.vue.js

@@ -104,12 +104,12 @@ __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
 __VLS_asFunctionalElement(__VLS_elements.h2, __VLS_elements.h2)({
     ...{ class: "text-lg font-semibold text-gray-800" },
 });
-(__VLS_ctx.user?.username ?? 'n/a');
+(__VLS_ctx.user?.username ?? __VLS_ctx.phoneNumberFormat(__VLS_ctx.user?.phone ?? ''));
 // @ts-ignore
-[user,];
+[user, user, phoneNumberFormat,];
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
     ...{ class: " mt-5 text-center mx-auto" },
-    ...{ class: ({ 'flex justify-between w-max': __VLS_ctx.responsive == 'tablet', 'grid grid-cols-3 w-full': __VLS_ctx.responsive == 'mobile' }) },
+    ...{ class: ({ 'flex justify-between w-max': __VLS_ctx.responsive != 'mobile', 'grid grid-cols-3 w-full': __VLS_ctx.responsive == 'mobile' }) },
 });
 // @ts-ignore
 [responsive, responsive,];
@@ -118,7 +118,7 @@ for (const [item, i] of __VLS_getVForSourceType((__VLS_ctx.customerTotalDetail))
     [customerTotalDetail,];
     __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
         ...{ class: "border-l border-chat-haze-100 first:border-none" },
-        ...{ class: ({ 'w-full': __VLS_ctx.responsive == 'mobile', 'w-[130px]': __VLS_ctx.responsive == 'tablet' }) },
+        ...{ class: ({ 'w-full': __VLS_ctx.responsive == 'mobile', 'w-[130px]': __VLS_ctx.responsive != 'mobile' }) },
         key: (i),
     });
     // @ts-ignore

package/dist/test/chat/page/home/ChatList.vue.js

@@ -1,6 +1,8 @@
 import InputSearch from '../../../components/chat/common/input/InputSearch.vue';
+import IconPlus from '../../../assets/icons/IconPlus.vue';
 import { computed, ref } from 'vue';
 import Avatar from '../../../components/chat/customer/Avatar.vue';
+import { getConversationView } from '../../../utils/chat/conversation';
 import ScrollEvent from '../../../components/chat/ScrollEvent/ScrollEvent.vue';
 import { useDebounce } from '../../../utils/debounce';
 import { dataProfile } from '../../../utils/chat/auth';
@@ -12,7 +14,7 @@ import timezone from 'dayjs/plugin/timezone';
 import { useDigibot } from '../../../composable/useDigibot';
 import { TIME_ZONE_UTC } from '../../../constant/datetime';
 import IconAiCheck from '../../../assets/icons/IconAiCheck.vue';
-import TabBase from '../../../components/chat/common/tab/TabBase.vue';
+import TabBase2 from '../../../components/chat/common/tabs/TabBase.vue';
 import { useListConversations } from '../../../composable/useListConversations';
 import { phoneNumberFormat } from '../../../utils/string-helper';
 dayjs.extend(updateLocale);
@@ -44,17 +46,24 @@ const TAB_VALUE = {
 };
 const tabs = computed(() => [
     { label: 'All', value: TAB_VALUE.ALL },
-    { label: 'Message Requests', value: TAB_VALUE.UNKNOWN, badge: (listConversationsUnknown.value?.length || '').toString() }
+    {
+        label: 'Message Requests',
+        value: TAB_VALUE.UNKNOWN,
+        badge: (listConversationsUnknownUnread.value || '').toString()
+    }
 ]);
 const { digibotData, digibotId } = useDigibot();
-const { listConversations: listConversationsAll, getData: getDataAll, params: paramsAll, pageCount: pageCountAll, handleReadMessage: handleReadMessageAll } = useListConversations(TAB_VALUE.ALL);
-const { listConversations: listConversationsUnknown, getData: getDataUnknown, params: paramsUnknown, pageCount: pageCountUnknown, handleReadMessage: handleReadMessageUnknown } = useListConversations(TAB_VALUE.UNKNOWN);
+const { listConversations: listConversationsAll, getData: getDataAll, params: paramsAll, pageCount: pageCountAll, handleReadMessage: handleReadMessageAll, getDataCache: getDataCacheAll } = useListConversations(TAB_VALUE.ALL, dataProfile.value?.user_type === 'tenant');
+const { listConversations: listConversationsUnknown, getData: getDataUnknown, params: paramsUnknown, pageCount: pageCountUnknown, handleReadMessage: handleReadMessageUnknown, getDataCache: getDataCacheUnknown } = useListConversations(TAB_VALUE.UNKNOWN, dataProfile.value?.user_type === 'tenant');
 const receiver_id = defineModel('receiverId');
 const listConversations = computed(() => {
     if (activeTabs.value == TAB_VALUE.ALL)
         return listConversationsAll.value;
     return listConversationsUnknown.value;
 });
+const listConversationsUnknownUnread = computed(() => {
+    return (listConversationsUnknown.value.reduce((total, cur) => total + (cur?.unread_count ?? 0), 0) ?? 0);
+});
 const keyword = ref('');
 const activeTabs = ref(TAB_VALUE.ALL);
 const scrollEventRef = ref(null);
@@ -64,13 +73,26 @@ const getData = async (data, option) => {
         const tab_value = option?.tab ?? activeTabs.value;
         if (!option?.hideLoading)
             isLoadingSearch.value = true;
+        if (option?.reset) {
+            let cache = false;
+            if (tab_value == TAB_VALUE.ALL) {
+                cache = getDataCacheAll();
+            }
+            else if (tab_value == TAB_VALUE.UNKNOWN) {
+                cache = getDataCacheUnknown();
+            }
+            if (cache)
+                isLoadingSearch.value = false;
+        }
         if (tab_value == TAB_VALUE.ALL) {
             await getDataAll(data, option);
         }
         else if (tab_value == TAB_VALUE.UNKNOWN) {
             await getDataUnknown(data, option);
         }
-        checkHasReceiveId();
+        if (!option?.hideCheckHasReceiveId) {
+            checkHasReceiveId();
+        }
         if (option?.reset) {
             getAllList();
         }
@@ -98,7 +120,7 @@ const getAllList = async () => {
 };
 const checkHasReceiveId = () => {
     const hasReceiveId = listConversations.value?.some((e) => e.receiver_id === receiver_id.value && receiver_id.value);
-    if (props.responsive == 'tablet') {
+    if (props.responsive != 'mobile') {
         if (!hasReceiveId) {
             if (listConversations.value?.length) {
                 emit('selectReceiver', listConversations.value[0]);
@@ -147,21 +169,43 @@ const getTimeFromNow = (data) => {
     }
     return data ?? '';
 };
-const handleTabChange = async (tab) => {
+const handleTabChange = async (tab, option) => {
     if (tab == TAB_VALUE.ALL && !listConversationsAll.value?.length) {
-        await getData({}, { reset: true, tab });
+        await getData({}, { reset: true, tab, ...(option ?? {}) });
     }
     else if (tab == TAB_VALUE.UNKNOWN && !listConversationsUnknown.value?.length) {
-        await getData({}, { reset: true, tab });
+        await getData({}, { reset: true, tab, ...(option ?? {}) });
     }
-    checkHasReceiveId();
+    // checkHasReceiveId()
 };
 const getCurrentConversation = () => {
-    return listConversations.value?.find(user => user.receiver_id == receiver_id.value);
+    return listConversations.value?.find((user) => user.receiver_id == receiver_id.value);
+};
+const initData = async (option) => {
+    if (option?.is_unknown || option?.is_unknown == '0') {
+        activeTabs.value = Number(option?.is_unknown);
+    }
+    let hideCheckHasReceiveId = false;
+    if (option?.conversation_id) {
+        const conversation = await getConversationView(option?.conversation_id);
+        if (conversation.receiver_id) {
+            hideCheckHasReceiveId = true;
+            selectUser(conversation);
+        }
+    }
+    handleTabChange(TAB_VALUE.ALL, { hideCheckHasReceiveId: activeTabs.value != TAB_VALUE.UNKNOWN });
+    handleTabChange(TAB_VALUE.UNKNOWN, {
+        hideCheckHasReceiveId,
+        hideLoading: activeTabs.value != TAB_VALUE.UNKNOWN
+    });
+};
+const __VLS_exposed = {
+    handleReadMessage,
+    listConversationsAll,
+    listConversationsUnknown,
+    getCurrentConversation,
+    initData
 };
-handleTabChange(TAB_VALUE.ALL);
-handleTabChange(TAB_VALUE.UNKNOWN);
-const __VLS_exposed = { handleReadMessage, listConversationsAll, listConversationsUnknown, getCurrentConversation };
 defineExpose(__VLS_exposed);
 debugger; /* PartiallyEnd: #3632/scriptSetup.vue */
 const __VLS_modelEmit = defineEmits();
@@ -177,7 +221,7 @@ let __VLS_elements;
 let __VLS_components;
 let __VLS_directives;
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
-    ...{ class: "h-full flex flex-col chat-box-white pt-6" },
+    ...{ class: "h-full flex flex-col bg-white pt-6" },
 });
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
     ...{ class: "shrink-0 w-full px-6 flex gap-2 mb-4" },
@@ -203,55 +247,71 @@ const __VLS_5 = ({ search: {} },
 // @ts-ignore
 [responsive, keyword, handleSearch,];
 var __VLS_2;
+__VLS_asFunctionalElement(__VLS_elements.button, __VLS_elements.button)({
+    ...{ onClick: (...[$event]) => {
+            __VLS_ctx.emit('openPhoneNumpad');
+            // @ts-ignore
+            [emit,];
+        } },
+    ...{ class: "shrink-0 h-11 w-11 rounded-full flex-center bg-[#C7DEFF] block xl:hidden" },
+});
+/** @type {[typeof IconPlus, ]} */ ;
+// @ts-ignore
+const __VLS_7 = __VLS_asFunctionalComponent(IconPlus, new IconPlus({
+    ...{ class: "text-[#004AB3]" },
+}));
+const __VLS_8 = __VLS_7({
+    ...{ class: "text-[#004AB3]" },
+}, ...__VLS_functionalComponentArgsRest(__VLS_7));
 if (__VLS_ctx.dataProfile?.user_type == 'tenant') {
     // @ts-ignore
     [dataProfile,];
-    /** @type {[typeof TabBase, ]} */ ;
+    /** @type {[typeof TabBase2, ]} */ ;
     // @ts-ignore
-    const __VLS_7 = __VLS_asFunctionalComponent(TabBase, new TabBase({
+    const __VLS_11 = __VLS_asFunctionalComponent(TabBase2, new TabBase2({
         ...{ 'onChange': {} },
-        ...{ class: "shrink-0 px-6" },
+        ...{ class: "shrink-0 px-6 mb-4" },
         tabs: (__VLS_ctx.tabs),
         active: (__VLS_ctx.activeTabs),
     }));
-    const __VLS_8 = __VLS_7({
+    const __VLS_12 = __VLS_11({
         ...{ 'onChange': {} },
-        ...{ class: "shrink-0 px-6" },
+        ...{ class: "shrink-0 px-6 mb-4" },
         tabs: (__VLS_ctx.tabs),
         active: (__VLS_ctx.activeTabs),
-    }, ...__VLS_functionalComponentArgsRest(__VLS_7));
-    let __VLS_10;
-    let __VLS_11;
-    const __VLS_12 = ({ change: {} },
+    }, ...__VLS_functionalComponentArgsRest(__VLS_11));
+    let __VLS_14;
+    let __VLS_15;
+    const __VLS_16 = ({ change: {} },
         { onChange: (__VLS_ctx.handleTabChange) });
     // @ts-ignore
     [tabs, activeTabs, handleTabChange,];
-    var __VLS_9;
+    var __VLS_13;
 }
 __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
     ...{ class: "grow relative overflow-hidden" },
 });
 /** @type {[typeof ScrollEvent, typeof ScrollEvent, ]} */ ;
 // @ts-ignore
-const __VLS_14 = __VLS_asFunctionalComponent(ScrollEvent, new ScrollEvent({
+const __VLS_18 = __VLS_asFunctionalComponent(ScrollEvent, new ScrollEvent({
     ...{ 'onGetDataBottom': {} },
     ref: "scrollEventRef",
     ...{ class: "h-full overflow-auto" },
     bottom: true,
 }));
-const __VLS_15 = __VLS_14({
+const __VLS_19 = __VLS_18({
     ...{ 'onGetDataBottom': {} },
     ref: "scrollEventRef",
     ...{ class: "h-full overflow-auto" },
     bottom: true,
-}, ...__VLS_functionalComponentArgsRest(__VLS_14));
-let __VLS_17;
-let __VLS_18;
-const __VLS_19 = ({ getDataBottom: {} },
+}, ...__VLS_functionalComponentArgsRest(__VLS_18));
+let __VLS_21;
+let __VLS_22;
+const __VLS_23 = ({ getDataBottom: {} },
     { onGetDataBottom: (__VLS_ctx.handleScroll) });
 /** @type {typeof __VLS_ctx.scrollEventRef} */ ;
-var __VLS_20 = {};
-const { default: __VLS_22 } = __VLS_16.slots;
+var __VLS_24 = {};
+const { default: __VLS_26 } = __VLS_20.slots;
 // @ts-ignore
 [handleScroll, scrollEventRef,];
 for (const [user] of __VLS_getVForSourceType((__VLS_ctx.listConversations))) {
@@ -268,26 +328,26 @@ for (const [user] of __VLS_getVForSourceType((__VLS_ctx.listConversations))) {
     });
     __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
         ...{ class: "w-full overflow-hidden flex items-center hover:bg-[#EDF5FF] cursor-pointer px-6 py-2" },
-        ...{ class: ({ 'bg-[#EDF5FF]': __VLS_ctx.receiver_id == user.receiver_id && __VLS_ctx.responsive == 'tablet' }) },
+        ...{ class: ({ 'bg-[#EDF5FF]': __VLS_ctx.receiver_id == user.receiver_id && __VLS_ctx.responsive != 'mobile' }) },
     });
     // @ts-ignore
     [responsive, receiver_id,];
     /** @type {[typeof Avatar, ]} */ ;
     // @ts-ignore
-    const __VLS_23 = __VLS_asFunctionalComponent(Avatar, new Avatar({
+    const __VLS_27 = __VLS_asFunctionalComponent(Avatar, new Avatar({
         id: (user.id),
         ...{ class: "shrink-0" },
         src: (user.avatar ?? ''),
         color: (user.color),
         name: (user.username ?? ''),
     }));
-    const __VLS_24 = __VLS_23({
+    const __VLS_28 = __VLS_27({
         id: (user.id),
         ...{ class: "shrink-0" },
         src: (user.avatar ?? ''),
         color: (user.color),
         name: (user.username ?? ''),
-    }, ...__VLS_functionalComponentArgsRest(__VLS_23));
+    }, ...__VLS_functionalComponentArgsRest(__VLS_27));
     __VLS_asFunctionalElement(__VLS_elements.div, __VLS_elements.div)({
         ...{ class: "grow ml-3 overflow-hidden" },
     });
@@ -311,12 +371,12 @@ for (const [user] of __VLS_getVForSourceType((__VLS_ctx.listConversations))) {
         [digibotId,];
         /** @type {[typeof IconAiCheck, ]} */ ;
         // @ts-ignore
-        const __VLS_27 = __VLS_asFunctionalComponent(IconAiCheck, new IconAiCheck({
+        const __VLS_31 = __VLS_asFunctionalComponent(IconAiCheck, new IconAiCheck({
             ...{ class: "ml-2" },
         }));
-        const __VLS_28 = __VLS_27({
+        const __VLS_32 = __VLS_31({
             ...{ class: "ml-2" },
-        }, ...__VLS_functionalComponentArgsRest(__VLS_27));
+        }, ...__VLS_functionalComponentArgsRest(__VLS_31));
     }
     if (user.unread_count) {
         __VLS_asFunctionalElement(__VLS_elements.span, __VLS_elements.span)({
@@ -339,12 +399,12 @@ for (const [user] of __VLS_getVForSourceType((__VLS_ctx.listConversations))) {
     // @ts-ignore
     [getTimeFromNow,];
 }
-var __VLS_16;
+var __VLS_20;
 /** @type {__VLS_StyleScopedClasses['']} */ ;
 /** @type {__VLS_StyleScopedClasses['h-full']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex']} */ ;
 /** @type {__VLS_StyleScopedClasses['flex-col']} */ ;
-/** @type {__VLS_StyleScopedClasses['chat-box-white']} */ ;
+/** @type {__VLS_StyleScopedClasses['bg-white']} */ ;
 /** @type {__VLS_StyleScopedClasses['pt-6']} */ ;
 /** @type {__VLS_StyleScopedClasses['shrink-0']} */ ;
 /** @type {__VLS_StyleScopedClasses['w-full']} */ ;
@@ -355,7 +415,17 @@ var __VLS_16;
 /** @type {__VLS_StyleScopedClasses['h-11']} */ ;
 /** @type {__VLS_StyleScopedClasses['grow']} */ ;
 /** @type {__VLS_StyleScopedClasses['shrink-0']} */ ;
+/** @type {__VLS_StyleScopedClasses['h-11']} */ ;
+/** @type {__VLS_StyleScopedClasses['w-11']} */ ;
+/** @type {__VLS_StyleScopedClasses['rounded-full']} */ ;
+/** @type {__VLS_StyleScopedClasses['flex-center']} */ ;
+/** @type {__VLS_StyleScopedClasses['bg-[#C7DEFF]']} */ ;
+/** @type {__VLS_StyleScopedClasses['block']} */ ;
+/** @type {__VLS_StyleScopedClasses['xl:hidden']} */ ;
+/** @type {__VLS_StyleScopedClasses['text-[#004AB3]']} */ ;
+/** @type {__VLS_StyleScopedClasses['shrink-0']} */ ;
 /** @type {__VLS_StyleScopedClasses['px-6']} */ ;
+/** @type {__VLS_StyleScopedClasses['mb-4']} */ ;
 /** @type {__VLS_StyleScopedClasses['grow']} */ ;
 /** @type {__VLS_StyleScopedClasses['relative']} */ ;
 /** @type {__VLS_StyleScopedClasses['overflow-hidden']} */ ;
@@ -406,7 +476,7 @@ var __VLS_16;
 /** @type {__VLS_StyleScopedClasses['w-[80px]']} */ ;
 /** @type {__VLS_StyleScopedClasses['md:w-[130px]']} */ ;
 // @ts-ignore
-var __VLS_21 = __VLS_20;
+var __VLS_25 = __VLS_24;
 const __VLS_export = (await import('vue')).defineComponent({
     setup: () => (__VLS_exposed),
     __typeEmits: {},

package/dist/test/chat/page/home/ChatMessage.vue.js

@@ -33,6 +33,13 @@ const isChatFinished = (index) => {
     const time2 = dayjs(props.message[index + 1].created_at);
     return time2.diff(time1, 'minute') > 10;
 };
+const isChatStart = (index) => {
+    if (shouldShowAvatar(index))
+        return true;
+    const time1 = dayjs(props.message[index - 1].created_at);
+    const time2 = dayjs(props.message[index].created_at);
+    return time2.diff(time1, 'minute') > 10;
+};
 const handleScrollTop = () => {
     emit('scrollTop');
 };
@@ -122,6 +129,7 @@ for (const [item, index] of __VLS_getVForSourceType((__VLS_ctx.message))) {
         isLastMessage: (index == __VLS_ctx.message.length - 1),
         isEndMessage: (__VLS_ctx.isEndMessage(index)),
         isChatFinished: (__VLS_ctx.isChatFinished(index)),
+        isChatStart: (__VLS_ctx.isChatStart(index)),
     }));
     const __VLS_14 = __VLS_13({
         ...{ 'onCallAgain': {} },
@@ -134,6 +142,7 @@ for (const [item, index] of __VLS_getVForSourceType((__VLS_ctx.message))) {
         isLastMessage: (index == __VLS_ctx.message.length - 1),
         isEndMessage: (__VLS_ctx.isEndMessage(index)),
         isChatFinished: (__VLS_ctx.isChatFinished(index)),
+        isChatStart: (__VLS_ctx.isChatStart(index)),
     }, ...__VLS_functionalComponentArgsRest(__VLS_13));
     let __VLS_16;
     let __VLS_17;
@@ -141,7 +150,7 @@ for (const [item, index] of __VLS_getVForSourceType((__VLS_ctx.message))) {
         { onCallAgain: (...[$event]) => {
                 __VLS_ctx.emit('callBack');
                 // @ts-ignore
-                [data, message, responsive, dataProfile, shouldShowAvatar, isEndMessage, isChatFinished, emit,];
+                [data, message, responsive, dataProfile, shouldShowAvatar, isEndMessage, isChatFinished, isChatStart, emit,];
             } });
     var __VLS_15;
 }