test/crm
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: added delete option in list view bulk actions for all list view

Browse Source
This commit is contained in:
Shariq Ansari 2024-03-17 12:30:11 +05:30
parent 980defb368
commit d6f8106cfb
10 changed files with 314 additions and 142 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

73
frontend/src/components/ListViews/ContactsListView.vue
View File

@ -70,15 +70,13 @@
</ListRows>
<ListSelectBanner>
<template #actions="{ selections, unselectAll }">
<Button
variant="subtle"
label="Edit"
@click="editValues(selections, unselectAll)"
>
<template #prefix>
<EditIcon class="h-3 w-3" />
</template>
</Button>
<Dropdown :options="bulkActions(selections, unselectAll)">
<Button variant="ghost">
<template #icon>
<FeatherIcon name="more-horizontal" class="h-4 w-4" />
</template>
</Button>
</Dropdown>
</template>
</ListSelectBanner>
</ListView>
@ -97,13 +95,14 @@
v-model:unselectAll="unselectAllAction"
doctype="Contact"
:selectedValues="selectedValues"
@reload="emit('reload')"
@reload="list.reload()"
/>
</template>
<script setup>
import PhoneIcon from '@/components/Icons/PhoneIcon.vue'
import EditIcon from '@/components/Icons/EditIcon.vue'
import EditValueModal from '@/components/Modals/EditValueModal.vue'
import { globalStore } from '@/stores/global'
import { createToast } from '@/utils'
import {
Avatar,
ListView,
@ -114,6 +113,8 @@ import {
ListRowItem,
ListFooter,
Tooltip,
Dropdown,
call,
} from 'frappe-ui'
import { ref, watch } from 'vue'
@ -141,12 +142,14 @@ const props = defineProps({
const emit = defineEmits([
'loadMore',
'updatePageCount',
'reload',
'columnWidthUpdated',
'applyFilter',
])
const pageLengthCount = defineModel()
const list = defineModel('list')
const { $dialog } = globalStore()
watch(pageLengthCount, (val, old_value) => {
if (val === old_value) return
@ -162,4 +165,50 @@ function editValues(selections, unselectAll) {
showEditModal.value = true
unselectAllAction.value = unselectAll
}
function deleteValues(selections, unselectAll) {
$dialog({
title: 'Delete',
message: `Are you sure you want to delete ${selections.size} item${
selections.size > 1 ? 's' : ''
}?`,
variant: 'danger',
actions: [
{
label: 'Delete',
variant: 'solid',
theme: 'red',
onClick: (close) => {
call('frappe.desk.reportview.delete_items', {
items: JSON.stringify(Array.from(selections)),
doctype: 'Contact',
}).then(() => {
createToast({
title: 'Deleted successfully',
icon: 'check',
iconClasses: 'text-green-600',
})
unselectAll()
list.value.reload()
close()
})
},
},
],
})
}
function bulkActions(selections, unselectAll) {
let actions = [
{
label: 'Edit',
onClick: () => editValues(selections, unselectAll),
},
{
label: 'Delete',
onClick: () => deleteValues(selections, unselectAll),
},
]
return actions
}
</script>

41
frontend/src/components/ListViews/DealsListView.vue
View File

@ -98,10 +98,7 @@
</ListRows>
<ListSelectBanner>
<template #actions="{ selections, unselectAll }">
<Dropdown
v-if="bulkActions.length"
:options="bulkActions(selections, unselectAll)"
>
<Dropdown :options="bulkActions(selections, unselectAll)">
<Button variant="ghost">
<template #icon>
<FeatherIcon name="more-horizontal" class="h-4 w-4" />
@ -203,6 +200,38 @@ function editValues(selections, unselectAll) {
unselectAllAction.value = unselectAll
}
function deleteValues(selections, unselectAll) {
$dialog({
title: 'Delete',
message: `Are you sure you want to delete ${selections.size} item${
selections.size > 1 ? 's' : ''
}?`,
variant: 'danger',
actions: [
{
label: 'Delete',
variant: 'solid',
theme: 'red',
onClick: (close) => {
call('frappe.desk.reportview.delete_items', {
items: JSON.stringify(Array.from(selections)),
doctype: 'CRM Deal',
}).then(() => {
createToast({
title: 'Deleted successfully',
icon: 'check',
iconClasses: 'text-green-600',
})
unselectAll()
list.value.reload()
close()
})
},
},
],
})
}
const customBulkActions = ref([])
function bulkActions(selections, unselectAll) {
@ -211,6 +240,10 @@ function bulkActions(selections, unselectAll) {
label: 'Edit',
onClick: () => editValues(selections, unselectAll),
},
{
label: 'Delete',
onClick: () => deleteValues(selections, unselectAll),
},
]
customBulkActions.value.forEach((action) => {
actions.push({

110
frontend/src/components/ListViews/EmailTemplatesListView.vue
View File

@ -54,23 +54,13 @@
</ListRows>
<ListSelectBanner>
<template #actions="{ selections, unselectAll }">
<div class="flex gap-2">
<Button
theme="red"
variant="subtle"
label="Delete"
@click="deleteEmailTemplate(selections, unselectAll)"
/>
<Button
variant="subtle"
label="Edit"
@click="editValues(selections, unselectAll)"
>
<template #prefix>
<EditIcon class="h-3 w-3" />
<Dropdown :options="bulkActions(selections, unselectAll)">
<Button variant="ghost">
<template #icon>
<FeatherIcon name="more-horizontal" class="h-4 w-4" />
</template>
</Button>
</div>
</Dropdown>
</template>
</ListSelectBanner>
</ListView>
@ -88,13 +78,13 @@
v-model:unselectAll="unselectAllAction"
doctype="Email Template"
:selectedValues="selectedValues"
@reload="emit('reload')"
@reload="list.reload()"
/>
</template>
<script setup>
import EditIcon from '@/components/Icons/EditIcon.vue'
import EditValueModal from '@/components/Modals/EditValueModal.vue'
import { globalStore } from '@/stores/global'
import { createToast } from '@/utils'
import {
ListView,
ListHeader,
@ -103,6 +93,7 @@ import {
ListSelectBanner,
ListRowItem,
ListFooter,
Dropdown,
call,
Tooltip,
} from 'frappe-ui'
@ -133,53 +124,20 @@ const emit = defineEmits([
'loadMore',
'updatePageCount',
'showEmailTemplate',
'reload',
'columnWidthUpdated',
'applyFilter',
])
const pageLengthCount = defineModel()
const list = defineModel('list')
const { $dialog } = globalStore()
watch(pageLengthCount, (val, old_value) => {
if (val === old_value) return
emit('updatePageCount', val)
})
const { $dialog } = globalStore()
function deleteEmailTemplate(selections, unselectAll) {
let title = 'Delete email template'
let message = 'Are you sure you want to delete this email template?'
if (selections.size > 1) {
title = 'Delete email templates'
message = 'Are you sure you want to delete these email templates?'
}
$dialog({
title: title,
message: message,
actions: [
{
label: 'Delete',
theme: 'red',
variant: 'solid',
async onClick(close) {
for (const selection of selections) {
await call('frappe.client.delete', {
doctype: 'Email Template',
name: selection,
})
}
close()
unselectAll()
emit('reload')
},
},
],
})
}
const showEditModal = ref(false)
const selectedValues = ref([])
const unselectAllAction = ref(() => {})
@ -189,4 +147,50 @@ function editValues(selections, unselectAll) {
showEditModal.value = true
unselectAllAction.value = unselectAll
}
function deleteValues(selections, unselectAll) {
$dialog({
title: 'Delete',
message: `Are you sure you want to delete ${selections.size} item${
selections.size > 1 ? 's' : ''
}?`,
variant: 'danger',
actions: [
{
label: 'Delete',
variant: 'solid',
theme: 'red',
onClick: (close) => {
call('frappe.desk.reportview.delete_items', {
items: JSON.stringify(Array.from(selections)),
doctype: 'Email Template',
}).then(() => {
createToast({
title: 'Deleted successfully',
icon: 'check',
iconClasses: 'text-green-600',
})
unselectAll()
list.value.reload()
close()
})
},
},
],
})
}
function bulkActions(selections, unselectAll) {
let actions = [
{
label: 'Edit',
onClick: () => editValues(selections, unselectAll),
},
{
label: 'Delete',
onClick: () => deleteValues(selections, unselectAll),
},
]
return actions
}
</script>

41
frontend/src/components/ListViews/LeadsListView.vue
View File

@ -107,10 +107,7 @@
</ListRows>
<ListSelectBanner>
<template #actions="{ selections, unselectAll }">
<Dropdown
v-if="bulkActions.length"
:options="bulkActions(selections, unselectAll)"
>
<Dropdown :options="bulkActions(selections, unselectAll)">
<Button variant="ghost">
<template #icon>
<FeatherIcon name="more-horizontal" class="h-4 w-4" />
@ -212,6 +209,38 @@ function editValues(selections, unselectAll) {
unselectAllAction.value = unselectAll
}
function deleteValues(selections, unselectAll) {
$dialog({
title: 'Delete',
message: `Are you sure you want to delete ${selections.size} item${
selections.size > 1 ? 's' : ''
}?`,
variant: 'danger',
actions: [
{
label: 'Delete',
variant: 'solid',
theme: 'red',
onClick: (close) => {
call('frappe.desk.reportview.delete_items', {
items: JSON.stringify(Array.from(selections)),
doctype: 'CRM Lead',
}).then(() => {
createToast({
title: 'Deleted successfully',
icon: 'check',
iconClasses: 'text-green-600',
})
unselectAll()
list.value.reload()
close()
})
},
},
],
})
}
const customBulkActions = ref([])
function bulkActions(selections, unselectAll) {
@ -220,6 +249,10 @@ function bulkActions(selections, unselectAll) {
label: 'Edit',
onClick: () => editValues(selections, unselectAll),
},
{
label: 'Delete',
onClick: () => deleteValues(selections, unselectAll),
},
]
customBulkActions.value.forEach((action) => {
actions.push({

73
frontend/src/components/ListViews/OrganizationsListView.vue
View File

@ -57,15 +57,13 @@
</ListRows>
<ListSelectBanner>
<template #actions="{ selections, unselectAll }">
<Button
variant="subtle"
label="Edit"
@click="editValues(selections, unselectAll)"
>
<template #prefix>
<EditIcon class="h-3 w-3" />
</template>
</Button>
<Dropdown :options="bulkActions(selections, unselectAll)">
<Button variant="ghost">
<template #icon>
<FeatherIcon name="more-horizontal" class="h-4 w-4" />
</template>
</Button>
</Dropdown>
</template>
</ListSelectBanner>
</ListView>
@ -83,12 +81,13 @@
v-model:unselectAll="unselectAllAction"
doctype="CRM Organization"
:selectedValues="selectedValues"
@reload="emit('reload')"
@reload="list.reload()"
/>
</template>
<script setup>
import EditIcon from '@/components/Icons/EditIcon.vue'
import EditValueModal from '@/components/Modals/EditValueModal.vue'
import { globalStore } from '@/stores/global'
import { createToast } from '@/utils'
import {
Avatar,
ListView,
@ -99,6 +98,8 @@ import {
ListRowItem,
ListFooter,
Tooltip,
Dropdown,
call,
} from 'frappe-ui'
import { ref, watch } from 'vue'
@ -126,12 +127,14 @@ const props = defineProps({
const emit = defineEmits([
'loadMore',
'updatePageCount',
'reload',
'columnWidthUpdated',
'applyFilter',
])
const pageLengthCount = defineModel()
const list = defineModel('list')
const { $dialog } = globalStore()
watch(pageLengthCount, (val, old_value) => {
if (val === old_value) return
@ -147,4 +150,50 @@ function editValues(selections, unselectAll) {
showEditModal.value = true
unselectAllAction.value = unselectAll
}
function deleteValues(selections, unselectAll) {
$dialog({
title: 'Delete',
message: `Are you sure you want to delete ${selections.size} item${
selections.size > 1 ? 's' : ''
}?`,
variant: 'danger',
actions: [
{
label: 'Delete',
variant: 'solid',
theme: 'red',
onClick: (close) => {
call('frappe.desk.reportview.delete_items', {
items: JSON.stringify(Array.from(selections)),
doctype: 'CRM Organization',
}).then(() => {
createToast({
title: 'Deleted successfully',
icon: 'check',
iconClasses: 'text-green-600',
})
unselectAll()
list.value.reload()
close()
})
},
},
],
})
}
function bulkActions(selections, unselectAll) {
let actions = [
{
label: 'Edit',
onClick: () => editValues(selections, unselectAll),
},
{
label: 'Delete',
onClick: () => deleteValues(selections, unselectAll),
},
]
return actions
}
</script>

110
frontend/src/components/ListViews/TasksListView.vue
View File

@ -73,23 +73,13 @@
</ListRows>
<ListSelectBanner>
<template #actions="{ selections, unselectAll }">
<div class="flex gap-2">
<Button
theme="red"
variant="subtle"
label="Delete"
@click="deleteTask(selections, unselectAll)"
/>
<Button
variant="subtle"
label="Edit"
@click="editValues(selections, unselectAll)"
>
<template #prefix>
<EditIcon class="h-3 w-3" />
<Dropdown :options="bulkActions(selections, unselectAll)">
<Button variant="ghost">
<template #icon>
<FeatherIcon name="more-horizontal" class="h-4 w-4" />
</template>
</Button>
</div>
</Dropdown>
</template>
</ListSelectBanner>
</ListView>
@ -107,17 +97,17 @@
v-model:unselectAll="unselectAllAction"
doctype="CRM Task"
:selectedValues="selectedValues"
@reload="emit('reload')"
@reload="list.reload()"
/>
</template>
<script setup>
import TaskStatusIcon from '@/components/Icons/TaskStatusIcon.vue'
import TaskPriorityIcon from '@/components/Icons/TaskPriorityIcon.vue'
import CalendarIcon from '@/components/Icons/CalendarIcon.vue'
import EditIcon from '@/components/Icons/EditIcon.vue'
import EditValueModal from '@/components/Modals/EditValueModal.vue'
import { dateFormat } from '@/utils'
import { globalStore } from '@/stores/global'
import { createToast } from '@/utils'
import {
Avatar,
ListView,
@ -127,6 +117,7 @@ import {
ListSelectBanner,
ListRowItem,
ListFooter,
Dropdown,
call,
Tooltip,
} from 'frappe-ui'
@ -157,53 +148,20 @@ const emit = defineEmits([
'loadMore',
'updatePageCount',
'showTask',
'reload',
'columnWidthUpdated',
'applyFilter',
])
const pageLengthCount = defineModel()
const list = defineModel('list')
const { $dialog } = globalStore()
watch(pageLengthCount, (val, old_value) => {
if (val === old_value) return
emit('updatePageCount', val)
})
const { $dialog } = globalStore()
function deleteTask(selections, unselectAll) {
let title = 'Delete task'
let message = 'Are you sure you want to delete this task?'
if (selections.size > 1) {
title = 'Delete tasks'
message = 'Are you sure you want to delete these tasks?'
}
$dialog({
title: title,
message: message,
actions: [
{
label: 'Delete',
theme: 'red',
variant: 'solid',
async onClick(close) {
for (const selection of selections) {
await call('frappe.client.delete', {
doctype: 'CRM Task',
name: selection,
})
}
close()
unselectAll()
emit('reload')
},
},
],
})
}
const showEditModal = ref(false)
const selectedValues = ref([])
const unselectAllAction = ref(() => {})
@ -213,4 +171,50 @@ function editValues(selections, unselectAll) {
showEditModal.value = true
unselectAllAction.value = unselectAll
}
function deleteValues(selections, unselectAll) {
$dialog({
title: 'Delete',
message: `Are you sure you want to delete ${selections.size} item${
selections.size > 1 ? 's' : ''
}?`,
variant: 'danger',
actions: [
{
label: 'Delete',
variant: 'solid',
theme: 'red',
onClick: (close) => {
call('frappe.desk.reportview.delete_items', {
items: JSON.stringify(Array.from(selections)),
doctype: 'CRM Task',
}).then(() => {
createToast({
title: 'Deleted successfully',
icon: 'check',
iconClasses: 'text-green-600',
})
unselectAll()
list.value.reload()
close()
})
},
},
],
})
}
function bulkActions(selections, unselectAll) {
let actions = [
{
label: 'Edit',
onClick: () => editValues(selections, unselectAll),
},
{
label: 'Delete',
onClick: () => deleteValues(selections, unselectAll),
},
]
return actions
}
</script>

2
frontend/src/pages/Contacts.vue
View File

@ -20,6 +20,7 @@
<ContactsListView
v-if="contacts.data && rows.length"
v-model="contacts.data.page_length_count"
v-model:list="contacts"
:rows="rows"
:columns="contacts.data.columns"
:options="{
@ -31,7 +32,6 @@
@loadMore="() => loadMore++"
@columnWidthUpdated="() => triggerResize++"
@updatePageCount="(count) => (updatedPageCount = count)"
@reload="contacts.reload()"
@applyFilter="(data) => viewControls.applyFilter(data)"
/>
<div

2
frontend/src/pages/EmailTemplates.vue
View File

@ -20,6 +20,7 @@
<EmailTemplatesListView
v-if="emailTemplates.data && rows.length"
v-model="emailTemplates.data.page_length_count"
v-model:list="emailTemplates"
:rows="rows"
:columns="emailTemplates.data.columns"
:options="{
@ -32,7 +33,6 @@
@columnWidthUpdated="() => triggerResize++"
@updatePageCount="(count) => (updatedPageCount = count)"
@showEmailTemplate="showEmailTemplate"
@reload="emailTemplates.reload()"
@applyFilter="(data) => viewControls.applyFilter(data)"
/>
<div

2
frontend/src/pages/Organizations.vue
View File

@ -24,6 +24,7 @@
<OrganizationsListView
v-if="organizations.data && rows.length"
v-model="organizations.data.page_length_count"
v-model:list="organizations"
:rows="rows"
:columns="organizations.data.columns"
:options="{
@ -35,7 +36,6 @@
@loadMore="() => loadMore++"
@columnWidthUpdated="() => triggerResize++"
@updatePageCount="(count) => (updatedPageCount = count)"
@reload="organizations.reload()"
@applyFilter="(data) => viewControls.applyFilter(data)"
/>
<div

2
frontend/src/pages/Tasks.vue
View File

@ -20,6 +20,7 @@
<TasksListView
v-if="tasks.data && rows.length"
v-model="tasks.data.page_length_count"
v-model:list="tasks"
:rows="rows"
:columns="tasks.data.columns"
:options="{
@ -32,7 +33,6 @@
@columnWidthUpdated="() => triggerResize++"
@updatePageCount="(count) => (updatedPageCount = count)"
@showTask="showTask"
@reload="tasks.reload()"
@applyFilter="(data) => viewControls.applyFilter(data)"
/>
<div v-else-if="tasks.data" class="flex h-full items-center justify-center">