enhancement: Custom views (#3838)

* enhancement: Custom views

* Review fixes
This commit is contained in:
Sivin Varghese 2022-01-27 08:26:12 +05:30 committed by GitHub
parent 5710b7559e
commit cd6c9a8fe9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 251 additions and 169 deletions

View file

@ -3,7 +3,7 @@
<slot></slot>
<div
class="chat-list__top"
:class="{ filter__applied: hasAppliedFiltersOrActiveCustomViews }"
:class="{ filter__applied: hasAppliedFiltersOrActiveFolders }"
>
<h1 class="page-title text-truncate" :title="pageTitle">
{{ pageTitle }}
@ -11,17 +11,17 @@
<div class="filter--actions">
<chat-filter
v-if="!hasAppliedFiltersOrActiveCustomViews"
v-if="!hasAppliedFiltersOrActiveFolders"
@statusFilterChange="updateStatusType"
/>
<div v-if="hasAppliedFilters && !hasActiveCustomViews">
<div v-if="hasAppliedFilters && !hasActiveFolders">
<woot-button
v-tooltip.top-end="$t('FILTER.CUSTOM_VIEWS.ADD.SAVE_BUTTON')"
size="tiny"
variant="smooth"
color-scheme="secondary"
icon="save"
@click="onClickOpenAddCustomViewsModal"
@click="onClickOpenAddFoldersModal"
/>
<woot-button
v-tooltip.top-end="$t('FILTER.CLEAR_BUTTON_LABEL')"
@ -32,7 +32,7 @@
@click="resetAndFetchData"
/>
</div>
<div v-if="hasActiveCustomViews">
<div v-if="hasActiveFolders">
<woot-button
v-tooltip.top-end="$t('FILTER.CUSTOM_VIEWS.DELETE.DELETE_BUTTON')"
size="tiny"
@ -40,7 +40,7 @@
color-scheme="alert"
icon="delete"
class="delete-custom-view__button"
@click="onClickOpenDeleteCustomViewsModal"
@click="onClickOpenDeleteFoldersModal"
/>
</div>
@ -59,21 +59,23 @@
</div>
<add-custom-views
v-if="showAddCustomViewsModal"
:custom-views-query="customViewsQuery"
@close="onCloseAddCustomViewsModal"
v-if="showAddFoldersModal"
:custom-views-query="foldersQuery"
:open-last-saved-item="openLastSavedItemInFolder"
@close="onCloseAddFoldersModal"
/>
<delete-custom-views
v-if="showDeleteCustomViewsModal"
:show-delete-popup.sync="showDeleteCustomViewsModal"
:active-custom-view="activeCustomView"
:custom-views-id="customViewsId"
@close="onCloseDeleteCustomViewsModal"
v-if="showDeleteFoldersModal"
:show-delete-popup.sync="showDeleteFoldersModal"
:active-custom-view="activeFolder"
:custom-views-id="foldersId"
:open-last-item-after-delete="openLastItemAfterDeleteInFolder"
@close="onCloseDeleteFoldersModal"
/>
<chat-type-tabs
v-if="!hasAppliedFiltersOrActiveCustomViews"
v-if="!hasAppliedFiltersOrActiveFolders"
:items="assigneeTabItems"
:active-tab="activeAssigneeTab"
class="tab--chat-type"
@ -90,7 +92,7 @@
:key="chat.id"
:active-label="label"
:team-id="teamId"
:custom-views-id="customViewsId"
:folders-id="foldersId"
:chat="chat"
:conversation-type="conversationType"
:show-assignee="showAssigneeInConversationCard"
@ -183,7 +185,7 @@ export default {
type: String,
default: '',
},
customViewsId: {
foldersId: {
type: [String, Number],
default: 0,
},
@ -197,9 +199,9 @@ export default {
...filter,
attributeName: this.$t(`FILTER.ATTRIBUTES.${filter.attributeI18nKey}`),
})),
customViewsQuery: {},
showAddCustomViewsModal: false,
showDeleteCustomViewsModal: false,
foldersQuery: {},
showAddFoldersModal: false,
showDeleteFoldersModal: false,
};
},
computed: {
@ -214,20 +216,20 @@ export default {
activeInbox: 'getSelectedInbox',
conversationStats: 'conversationStats/getStats',
appliedFilters: 'getAppliedConversationFilters',
customViews: 'customViews/getCustomViews',
folders: 'customViews/getCustomViews',
}),
hasAppliedFilters() {
return this.appliedFilters.length;
},
hasActiveCustomViews() {
return this.activeCustomView && this.customViewsId !== 0;
hasActiveFolders() {
return this.activeFolder && this.foldersId !== 0;
},
hasAppliedFiltersOrActiveCustomViews() {
return this.hasAppliedFilters || this.hasActiveCustomViews;
hasAppliedFiltersOrActiveFolders() {
return this.hasAppliedFilters || this.hasActiveFolders;
},
savedCustomViewsValue() {
if (this.hasActiveCustomViews) {
const payload = this.activeCustomView.query;
savedFoldersValue() {
if (this.hasActiveFolders) {
const payload = this.activeFolder.query;
this.fetchSavedFilteredConversations(payload);
}
return {};
@ -254,7 +256,7 @@ export default {
);
},
currentPageFilterKey() {
return this.hasAppliedFiltersOrActiveCustomViews
return this.hasAppliedFiltersOrActiveFolders
? 'appliedFilters'
: this.activeAssigneeTab;
},
@ -279,9 +281,7 @@ export default {
conversationType: this.conversationType
? this.conversationType
: undefined,
customViews: this.hasActiveCustomViews
? this.savedCustomViewsValue
: undefined,
folders: this.hasActiveFolders ? this.savedFoldersValue : undefined,
};
},
pageTitle() {
@ -297,14 +297,14 @@ export default {
if (this.conversationType === 'mention') {
return this.$t('CHAT_LIST.MENTION_HEADING');
}
if (this.hasActiveCustomViews) {
return this.activeCustomView.name;
if (this.hasActiveFolders) {
return this.activeFolder.name;
}
return this.$t('CHAT_LIST.TAB_HEADING');
},
conversationList() {
let conversationList = [];
if (!this.hasAppliedFiltersOrActiveCustomViews) {
if (!this.hasAppliedFiltersOrActiveFolders) {
const filters = this.conversationFilters;
if (this.activeAssigneeTab === 'me') {
conversationList = [...this.mineChatsList(filters)];
@ -319,10 +319,10 @@ export default {
return conversationList;
},
activeCustomView() {
if (this.customViewsId) {
const activeView = this.customViews.filter(
view => view.id === Number(this.customViewsId)
activeFolder() {
if (this.foldersId) {
const activeView = this.folders.filter(
view => view.id === Number(this.foldersId)
);
const [firstValue] = activeView;
return firstValue;
@ -349,8 +349,10 @@ export default {
conversationType() {
this.resetAndFetchData();
},
activeCustomView() {
this.resetAndFetchData();
activeFolder() {
if (!this.hasAppliedFilters) {
this.resetAndFetchData();
}
},
},
mounted() {
@ -366,22 +368,22 @@ export default {
if (this.$route.name !== 'home') {
this.$router.push({ name: 'home' });
}
this.customViewsQuery = { payload: payload };
this.foldersQuery = { payload: payload };
this.$store.dispatch('conversationPage/reset');
this.$store.dispatch('emptyAllConversations');
this.fetchFilteredConversations(payload);
},
onClickOpenAddCustomViewsModal() {
this.showAddCustomViewsModal = true;
onClickOpenAddFoldersModal() {
this.showAddFoldersModal = true;
},
onCloseAddCustomViewsModal() {
this.showAddCustomViewsModal = false;
onCloseAddFoldersModal() {
this.showAddFoldersModal = false;
},
onClickOpenDeleteCustomViewsModal() {
this.showDeleteCustomViewsModal = true;
onClickOpenDeleteFoldersModal() {
this.showDeleteFoldersModal = true;
},
onCloseDeleteCustomViewsModal() {
this.showDeleteCustomViewsModal = false;
onCloseDeleteFoldersModal() {
this.showDeleteFoldersModal = false;
},
onToggleAdvanceFiltersModal() {
this.showAdvancedFilters = !this.showAdvancedFilters;
@ -434,11 +436,11 @@ export default {
this.$store.dispatch('conversationPage/reset');
this.$store.dispatch('emptyAllConversations');
this.$store.dispatch('clearConversationFilters');
if (this.hasActiveCustomViews) {
const payload = this.activeCustomView.query;
if (this.hasActiveFolders) {
const payload = this.activeFolder.query;
this.fetchSavedFilteredConversations(payload);
}
if (this.customViewsId) {
if (this.foldersId) {
return;
}
this.fetchConversations();
@ -449,11 +451,11 @@ export default {
.then(() => this.$emit('conversation-load'));
},
loadMoreConversations() {
if (!this.hasAppliedFiltersOrActiveCustomViews) {
if (!this.hasAppliedFiltersOrActiveFolders) {
this.fetchConversations();
}
if (this.hasActiveCustomViews) {
const payload = this.activeCustomView.query;
if (this.hasActiveFolders) {
const payload = this.activeFolder.query;
this.fetchSavedFilteredConversations(payload);
} else {
this.fetchFilteredConversations(this.appliedFilters);
@ -493,6 +495,22 @@ export default {
this.resetAndFetchData();
}
},
openLastSavedItemInFolder() {
const lastItemOfFolder = this.folders[this.folders.length - 1];
const lastItemId = lastItemOfFolder.id;
this.$router.push({
name: 'folder_conversations',
params: { id: lastItemId },
});
},
openLastItemAfterDeleteInFolder() {
if (this.folders.length > 0) {
this.openLastSavedItemInFolder();
} else {
this.$router.push({ name: 'home' });
this.fetchConversations();
}
},
},
};
</script>

View file

@ -5,7 +5,7 @@ const contacts = accountId => ({
routes: [
'contacts_dashboard',
'contact_profile_dashboard',
'contacts_through_custom_view',
'contacts_segments_dashboard',
'contacts_labels_dashboard',
],
menuItems: [

View file

@ -14,8 +14,8 @@ const conversations = accountId => ({
'conversations_through_team',
'conversation_mentions',
'conversation_through_mentions',
'custom_view_conversations',
'conversations_through_custom_view',
'folder_conversations',
'conversations_through_folders',
],
menuItems: [
{

View file

@ -157,7 +157,7 @@ export default {
})),
};
},
customViewsSection() {
foldersSection() {
return {
icon: 'folder',
label: 'CUSTOM_VIEWS_FOLDER',
@ -175,7 +175,7 @@ export default {
})),
};
},
contactCustomViewsSection() {
contactSegmentsSection() {
return {
icon: 'folder',
label: 'CUSTOM_VIEWS_SEGMENTS',
@ -200,16 +200,10 @@ export default {
conversationMenuItems = [this.teamSection, ...conversationMenuItems];
}
if (this.customViews.length) {
conversationMenuItems = [
this.customViewsSection,
...conversationMenuItems,
];
conversationMenuItems = [this.foldersSection, ...conversationMenuItems];
}
if (this.contactCustomViews.length) {
contactMenuItems = [
this.contactCustomViewsSection,
...contactMenuItems,
];
contactMenuItems = [this.contactSegmentsSection, ...contactMenuItems];
}
return {
conversations: conversationMenuItems,

View file

@ -130,7 +130,7 @@ export default {
type: [String, Number],
default: 0,
},
customViewsId: {
foldersId: {
type: [String, Number],
default: 0,
},
@ -252,7 +252,7 @@ export default {
id: chat.id,
label: this.activeLabel,
teamId: this.teamId,
customViewsId: this.customViewsId,
foldersId: this.foldersId,
conversationType: this.conversationType,
});
router.push({ path: frontendURL(path) });

View file

@ -12,7 +12,7 @@ export const conversationUrl = ({
label,
teamId,
conversationType = '',
customViewsId,
foldersId,
}) => {
let url = `accounts/${accountId}/conversations/${id}`;
if (activeInbox) {
@ -21,8 +21,8 @@ export const conversationUrl = ({
url = `accounts/${accountId}/label/${label}/conversations/${id}`;
} else if (teamId) {
url = `accounts/${accountId}/team/${teamId}/conversations/${id}`;
} else if (customViewsId && customViewsId !== 0) {
url = `accounts/${accountId}/custom_view/${customViewsId}/conversations/${id}`;
} else if (foldersId && foldersId !== 0) {
url = `accounts/${accountId}/custom_view/${foldersId}/conversations/${id}`;
} else if (conversationType === 'mention') {
url = `accounts/${accountId}/mentions/conversations/${id}`;
}

View file

@ -41,9 +41,13 @@
"ERROR_MESSAGE": "Name is required",
"SAVE_BUTTON": "Save filter",
"CANCEL_BUTTON": "Cancel",
"API": {
"SUCCESS_MESSAGE": "Custom view created successfully",
"ERROR_MESSAGE": "Error while creating custom view"
"API_FOLDERS": {
"SUCCESS_MESSAGE": "Folder created successfully",
"ERROR_MESSAGE": "Error while creating folder"
},
"API_SEGMENTS": {
"SUCCESS_MESSAGE": "Segment created successfully",
"ERROR_MESSAGE": "Error while creating segment"
}
},
"DELETE": {
@ -56,9 +60,13 @@
"NO": "No, Keep it"
}
},
"API": {
"SUCCESS_MESSAGE": "Custom view deleted successfully",
"ERROR_MESSAGE": "Error while deleting custom view"
"API_FOLDERS": {
"SUCCESS_MESSAGE": "Folder deleted successfully",
"ERROR_MESSAGE": "Error while deleting folder"
},
"API_SEGMENTS": {
"SUCCESS_MESSAGE": "Segment deleted successfully",
"ERROR_MESSAGE": "Error while deleting segment"
}
}
}

View file

@ -3,7 +3,7 @@
<div class="left-wrap" :class="wrapClas">
<contacts-header
:search-query="searchQuery"
:custom-views-id="customViewsId"
:segments-id="segmentsId"
:on-search-submit="onSearchSubmit"
this-selected-contact-id=""
:on-input-search="onInputSearch"
@ -31,18 +31,20 @@
</div>
<add-custom-views
v-if="showAddCustomViewsModal"
:custom-views-query="customViewsQuery"
v-if="showAddSegmentsModal"
:custom-views-query="segmentsQuery"
:filter-type="filterType"
@close="onCloseAddCustomViewsModal"
:open-last-saved-item="openSavedItemInSegment"
@close="onCloseAddSegmentsModal"
/>
<delete-custom-views
v-if="showDeleteCustomViewsModal"
:show-delete-popup.sync="showDeleteCustomViewsModal"
:active-custom-view="activeCustomView"
:custom-views-id="customViewsId"
v-if="showDeleteSegmentsModal"
:show-delete-popup.sync="showDeleteSegmentsModal"
:active-custom-view="activeSegment"
:custom-views-id="segmentsId"
:active-filter-type="filterType"
@close="onCloseDeleteCustomViewsModal"
:open-last-item-after-delete="openLastItemAfterDeleteInSegment"
@close="onCloseDeleteSegmentsModal"
/>
<contact-info-panel
@ -102,7 +104,7 @@ export default {
},
props: {
label: { type: String, default: '' },
customViewsId: {
segmentsId: {
type: [String, Number],
default: 0,
},
@ -121,10 +123,10 @@ export default {
`CONTACTS_FILTER.ATTRIBUTES.${filter.attributeI18nKey}`
),
})),
customViewsQuery: {},
segmentsQuery: {},
filterType: FILTER_TYPE_CONTACT,
showAddCustomViewsModal: false,
showDeleteCustomViewsModal: false,
showAddSegmentsModal: false,
showDeleteSegmentsModal: false,
};
},
computed: {
@ -132,7 +134,7 @@ export default {
records: 'contacts/getContacts',
uiFlags: 'contacts/getUIFlags',
meta: 'contacts/getMeta',
customViews: 'customViews/getCustomViews',
segments: 'customViews/getCustomViews',
getAppliedContactFilters: 'contacts/getAppliedContactFilters',
}),
showEmptySearchResult() {
@ -142,12 +144,18 @@ export default {
hasAppliedFilters() {
return this.getAppliedContactFilters.length;
},
hasActiveCustomViews() {
return this.activeCustomView && this.customViewsId !== 0;
hasActiveSegments() {
return this.activeSegment && this.segmentsId !== 0;
},
isContactAndLabelDashboard() {
return (
this.$route.name === 'contacts_dashboard' ||
this.$route.name === 'contacts_labels_dashboard'
);
},
pageTitle() {
if (this.hasActiveCustomViews) {
return this.activeCustomView.name;
if (this.hasActiveSegments) {
return this.activeSegment.name;
}
if (this.label) {
return `#${this.label}`;
@ -176,10 +184,10 @@ export default {
? selectedPageNumber
: DEFAULT_PAGE;
},
activeCustomView() {
if (this.customViewsId) {
const [firstValue] = this.customViews.filter(
view => view.id === Number(this.customViewsId)
activeSegment() {
if (this.segmentsId) {
const [firstValue] = this.segments.filter(
view => view.id === Number(this.segmentsId)
);
return firstValue;
}
@ -189,11 +197,17 @@ export default {
watch: {
label() {
this.fetchContacts(DEFAULT_PAGE);
if (this.hasAppliedFilters) {
this.clearFilters();
}
},
activeCustomView() {
if (this.hasActiveCustomViews) {
const payload = this.activeCustomView.query;
this.fetchSavedFilteredContact(payload);
activeSegment() {
if (this.hasActiveSegments) {
const payload = this.activeSegment.query;
this.fetchSavedFilteredContact(payload, DEFAULT_PAGE);
}
if (this.hasAppliedFilters && this.$route.name === 'contacts_dashboard') {
this.fetchFilteredContacts(DEFAULT_PAGE);
} else {
this.fetchContacts(DEFAULT_PAGE);
}
@ -222,35 +236,49 @@ export default {
return sortAttr;
},
fetchContacts(page) {
this.updatePageParam(page);
let value = '';
if (this.searchQuery.charAt(0) === '+') {
value = this.searchQuery.substring(1);
} else {
value = this.searchQuery;
if (this.isContactAndLabelDashboard) {
this.updatePageParam(page);
let value = '';
if (this.searchQuery.charAt(0) === '+') {
value = this.searchQuery.substring(1);
} else {
value = this.searchQuery;
}
const requestParams = {
page,
sortAttr: this.getSortAttribute(),
label: this.label,
};
if (!value) {
this.$store.dispatch('contacts/get', requestParams);
} else {
this.$store.dispatch('contacts/search', {
search: value,
...requestParams,
});
}
}
const requestParams = {
page,
sortAttr: this.getSortAttribute(),
label: this.label,
};
if (!value) {
this.$store.dispatch('contacts/get', requestParams);
} else {
this.$store.dispatch('contacts/search', {
search: value,
...requestParams,
},
fetchSavedFilteredContact(payload, page) {
if (this.hasActiveSegments) {
this.updatePageParam(page);
this.$store.dispatch('contacts/filter', {
queryPayload: payload,
page,
});
}
},
fetchSavedFilteredContact(payload) {
fetchFilteredContacts(page) {
if (this.hasAppliedFilters) {
this.clearFilters();
const payload = this.segmentsQuery;
this.updatePageParam(page);
this.$store.dispatch('contacts/filter', {
queryPayload: payload,
page,
});
}
this.$store.dispatch('contacts/filter', {
queryPayload: payload,
});
},
onInputSearch(event) {
const newQuery = event.target.value;
const refetchAllContacts = !!this.searchQuery && newQuery === '';
@ -267,7 +295,15 @@ export default {
},
onPageChange(page) {
this.selectedContactId = '';
this.fetchContacts(page);
if (this.segmentsId !== 0) {
const payload = this.activeSegment.query;
this.fetchSavedFilteredContact(payload, page);
}
if (this.hasAppliedFilters) {
this.fetchFilteredContacts(page);
} else {
this.fetchContacts(page);
}
},
openContactInfoPanel(contactId) {
this.selectedContactId = contactId;
@ -281,16 +317,16 @@ export default {
this.showCreateModal = !this.showCreateModal;
},
onToggleSaveFilters() {
this.showAddCustomViewsModal = true;
this.showAddSegmentsModal = true;
},
onCloseAddCustomViewsModal() {
this.showAddCustomViewsModal = false;
onCloseAddSegmentsModal() {
this.showAddSegmentsModal = false;
},
onToggleDeleteFilters() {
this.showDeleteCustomViewsModal = true;
this.showDeleteSegmentsModal = true;
},
onCloseDeleteCustomViewsModal() {
this.showDeleteCustomViewsModal = false;
onCloseDeleteSegmentsModal() {
this.showDeleteSegmentsModal = false;
},
onToggleImport() {
this.showImportModal = !this.showImportModal;
@ -304,7 +340,7 @@ export default {
},
onApplyFilter(payload) {
this.closeContactInfoPanel();
this.customViewsQuery = { payload };
this.segmentsQuery = { payload };
this.$store.dispatch('contacts/filter', {
queryPayload: filterQueryGenerator(payload),
});
@ -314,6 +350,22 @@ export default {
this.$store.dispatch('contacts/clearContactFilters');
this.fetchContacts(this.pageParameter);
},
openSavedItemInSegment() {
const lastItemInSegments = this.segments[this.segments.length - 1];
const lastItemId = lastItemInSegments.id;
this.$router.push({
name: 'contacts_segments_dashboard',
params: { id: lastItemId },
});
},
openLastItemAfterDeleteInSegment() {
if (this.segments.length > 0) {
this.openSavedItemInSegment();
} else {
this.$router.push({ name: 'contacts_dashboard' });
this.fetchContacts(DEFAULT_PAGE);
}
},
},
};
</script>

View file

@ -26,18 +26,16 @@
{{ $t('CONTACTS_PAGE.SEARCH_BUTTON') }}
</woot-button>
</div>
<woot-button
v-if="hasActiveCustomViews && !hasAppliedFilters"
v-if="hasActiveSegments"
class="margin-right-small clear"
color-scheme="alert"
icon="delete"
@click="onToggleDeleteCustomViewsModal"
@click="onToggleDeleteSegmentsModal"
>
{{ $t('CONTACTS_PAGE.FILTER_CONTACTS_DELETE') }}
</woot-button>
<div v-if="!hasActiveCustomViews" class="filters__button-wrap">
<div v-if="!hasActiveSegments" class="filters__button-wrap">
<div v-if="hasAppliedFilters" class="filters__applied-indicator" />
<woot-button
class="margin-right-small clear"
@ -51,12 +49,12 @@
</div>
<woot-button
v-if="hasAppliedFilters && !hasActiveCustomViews"
v-if="hasAppliedFilters && !hasActiveSegments"
class="margin-right-small clear"
color-scheme="alert"
variant="clear"
icon="save"
@click="onToggleCustomViewsModal"
@click="onToggleSegmentsModal"
>
{{ $t('CONTACTS_PAGE.FILTER_CONTACTS_SAVE') }}
</woot-button>
@ -96,7 +94,7 @@ export default {
type: String,
default: '',
},
customViewsId: {
segmentsId: {
type: [String, Number],
default: 0,
},
@ -137,15 +135,15 @@ export default {
hasAppliedFilters() {
return this.getAppliedContactFilters.length;
},
hasActiveCustomViews() {
return this.customViewsId !== 0;
hasActiveSegments() {
return this.segmentsId !== 0;
},
},
methods: {
onToggleCustomViewsModal() {
onToggleSegmentsModal() {
this.$emit('on-toggle-save-filter');
},
onToggleDeleteCustomViewsModal() {
onToggleDeleteSegmentsModal() {
this.$emit('on-toggle-delete-filter');
},
},

View file

@ -12,11 +12,11 @@ export const routes = [
},
{
path: frontendURL('accounts/:accountId/contacts/custom_view/:id'),
name: 'contacts_through_custom_view',
name: 'contacts_segments_dashboard',
roles: ['administrator', 'agent'],
component: ContactsView,
props: route => {
return { customViewsId: route.params.id };
return { segmentsId: route.params.id };
},
},
{

View file

@ -5,7 +5,7 @@
:label="label"
:team-id="teamId"
:conversation-type="conversationType"
:custom-views-id="customViewsId"
:folders-id="foldersId"
@conversation-load="onConversationLoad"
>
<pop-over-search />
@ -55,7 +55,7 @@ export default {
type: String,
default: '',
},
customViewsId: {
foldersId: {
type: [String, Number],
default: 0,
},

View file

@ -85,21 +85,21 @@ export default {
},
{
path: frontendURL('accounts/:accountId/custom_view/:id'),
name: 'custom_view_conversations',
name: 'folder_conversations',
roles: ['administrator', 'agent'],
component: ConversationView,
props: route => ({ customViewsId: route.params.id }),
props: route => ({ foldersId: route.params.id }),
},
{
path: frontendURL(
'accounts/:accountId/custom_view/:id/conversations/:conversation_id'
),
name: 'conversations_through_custom_view',
name: 'conversations_through_folders',
roles: ['administrator', 'agent'],
component: ConversationView,
props: route => ({
conversationId: route.params.conversation_id,
customViewsId: route.params.id,
foldersId: route.params.id,
}),
},
{

View file

@ -43,6 +43,10 @@ export default {
type: Object,
default: () => {},
},
openLastSavedItem: {
type: Function,
default: () => {},
},
},
data() {
@ -80,17 +84,21 @@ export default {
filter_type: this.filterType,
query: this.customViewsQuery,
});
this.alertMessage = this.$t(
'FILTER.CUSTOM_VIEWS.ADD.API.SUCCESS_MESSAGE'
);
this.alertMessage =
this.filterType === 0
? this.$t('FILTER.CUSTOM_VIEWS.ADD.API_FOLDERS.SUCCESS_MESSAGE')
: this.$t('FILTER.CUSTOM_VIEWS.ADD.API_SEGMENTS.SUCCESS_MESSAGE');
this.onClose();
} catch (error) {
const errorMessage = error?.message;
this.alertMessage =
errorMessage || this.$t('FILTER.CUSTOM_VIEWS.ADD.API.ERROR_MESSAGE');
errorMessage || this.filterType === 0
? this.$t('FILTER.CUSTOM_VIEWS.ADD.API_FOLDERS.ERROR_MESSAGE')
: this.$t('FILTER.CUSTOM_VIEWS.ADD.API_SEGMENTS.ERROR_MESSAGE');
} finally {
this.showAlert(this.alertMessage);
}
this.openLastSavedItem();
},
},
};

View file

@ -34,6 +34,10 @@ export default {
type: Number,
default: 0,
},
openLastItemAfterDelete: {
type: Function,
default: () => {},
},
},
computed: {
@ -75,20 +79,20 @@ export default {
await this.$store.dispatch('customViews/delete', { id, filterType });
this.closeDeletePopup();
this.showAlert(
this.$t('FILTER.CUSTOM_VIEWS.DELETE.API.SUCCESS_MESSAGE')
this.activeFilterType === 0
? this.$t('FILTER.CUSTOM_VIEWS.DELETE.API_FOLDERS.SUCCESS_MESSAGE')
: this.$t('FILTER.CUSTOM_VIEWS.DELETE.API_SEGMENTS.SUCCESS_MESSAGE')
);
} catch (error) {
const errorMessage =
error?.response?.message ||
this.$t('FILTER.CUSTOM_VIEWS.DELETE.API.ERROR_MESSAGE');
error?.response?.message || this.activeFilterType === 0
? this.$t('FILTER.CUSTOM_VIEWS.DELETE.API_FOLDERS.SUCCESS_MESSAGE')
: this.$t(
'FILTER.CUSTOM_VIEWS.DELETE.API_SEGMENTS.SUCCESS_MESSAGE'
);
this.showAlert(errorMessage);
}
if (this.isFolderSection) {
this.$router.push({ name: 'home' });
}
if (this.isSegmentSection) {
this.$router.push({ name: 'contacts_dashboard' });
}
this.openLastItemAfterDelete();
},
closeDeletePopup() {
this.$emit('close');