Merge pull request #53 from shariquerik/convert_to_deal

fix: Convert to Deal Modal
This commit is contained in:
Shariq Ansari 2024-01-06 18:26:22 +05:30 committed by GitHub
commit 8ee5ba423e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
40 changed files with 189 additions and 123 deletions

View File

@ -257,7 +257,8 @@
{
"fieldname": "log_tab",
"fieldtype": "Tab Break",
"label": "Log"
"label": "Log",
"read_only": 1
},
{
"fieldname": "status_change_log",
@ -268,7 +269,7 @@
],
"index_web_pages_for_search": 1,
"links": [],
"modified": "2024-01-06 14:05:52.669699",
"modified": "2024-01-06 17:19:49.009903",
"modified_by": "Administrator",
"module": "FCRM",
"name": "CRM Deal",

View File

@ -713,7 +713,6 @@ import { usersStore } from '@/stores/users'
import { contactsStore } from '@/stores/contacts'
import {
Button,
FeatherIcon,
Tooltip,
Dropdown,
TextEditor,

View File

@ -37,7 +37,6 @@
<script setup>
import { ref } from 'vue'
import { Button, Dialog } from 'frappe-ui'
import mime from 'mime'
import FileTypeIcon from '@/components/Icons/FileTypeIcon.vue'
import FileImageIcon from '@/components/Icons/FileImageIcon.vue'

View File

@ -142,7 +142,6 @@ import NestedPopover from '@/components/NestedPopover.vue'
import Autocomplete from '@/components/frappe-ui/Autocomplete.vue'
import Draggable from 'vuedraggable'
import { computed, defineModel, ref } from 'vue'
import { FeatherIcon, FormControl } from 'frappe-ui'
import { watchOnce } from '@vueuse/core'
const props = defineProps({

View File

@ -49,7 +49,7 @@
<script setup>
import Autocomplete from '@/components/frappe-ui/Autocomplete.vue'
import { watchDebounced } from '@vueuse/core'
import { createResource, FeatherIcon } from 'frappe-ui'
import { createResource } from 'frappe-ui'
import { useAttrs, computed, ref } from 'vue'
const props = defineProps({

View File

@ -30,7 +30,6 @@
</template>
<script setup>
import { Button, ErrorMessage, FeatherIcon, TextInput } from 'frappe-ui'
import { ref, defineModel } from 'vue'
const props = defineProps({

View File

@ -19,7 +19,7 @@
<script setup>
import { computed } from 'vue'
import { Dropdown, FeatherIcon } from 'frappe-ui'
import { Dropdown } from 'frappe-ui'
const props = defineProps({
actions: {

View File

@ -18,8 +18,6 @@
</button>
</template>
<script setup>
import { FeatherIcon } from 'frappe-ui'
const props = defineProps({
value: {
type: String,

View File

@ -114,12 +114,7 @@
import AttachmentIcon from '@/components/Icons/AttachmentIcon.vue'
import AttachmentItem from '@/components/AttachmentItem.vue'
import MultiselectInput from '@/components/Controls/MultiselectInput.vue'
import {
TextEditorFixedMenu,
TextEditor,
FileUploader,
FeatherIcon,
} from 'frappe-ui'
import { TextEditorFixedMenu, TextEditor, FileUploader } from 'frappe-ui'
import { validateEmail } from '@/utils'
import { EditorContent } from '@tiptap/vue-3'
import { ref, computed, defineModel } from 'vue'

View File

@ -106,12 +106,7 @@
import NestedPopover from '@/components/NestedPopover.vue'
import FilterIcon from '@/components/Icons/FilterIcon.vue'
import Link from '@/components/Controls/Link.vue'
import {
FeatherIcon,
Autocomplete,
FormControl,
createResource,
} from 'frappe-ui'
import { FormControl, Autocomplete, createResource } from 'frappe-ui'
import { h, defineModel, computed } from 'vue'
const typeCheck = ['Check']

View File

@ -72,9 +72,6 @@ import {
ListRow,
ListSelectBanner,
ListRowItem,
FormControl,
FeatherIcon,
Badge,
} from 'frappe-ui'
const props = defineProps({

View File

@ -100,8 +100,6 @@ import {
ListRow,
ListRowItem,
ListSelectBanner,
FormControl,
Badge,
} from 'frappe-ui'
const props = defineProps({

View File

@ -109,8 +109,6 @@ import {
ListRow,
ListSelectBanner,
ListRowItem,
FormControl,
Badge,
} from 'frappe-ui'
const props = defineProps({

View File

@ -32,7 +32,10 @@
/>
</div>
</template>
<div v-if="['modified', 'creation'].includes(column.key)" class="truncate text-base">
<div
v-if="['modified', 'creation'].includes(column.key)"
class="truncate text-base"
>
{{ item.timeAgo }}
</div>
<div v-else-if="column.type === 'Check'">
@ -58,7 +61,6 @@ import {
ListRow,
ListSelectBanner,
ListRowItem,
FormControl,
} from 'frappe-ui'
const props = defineProps({

View File

@ -71,7 +71,7 @@
import UserAvatar from '@/components/UserAvatar.vue'
import Link from '@/components/Controls/Link.vue'
import { usersStore } from '@/stores/users'
import { Dialog, Tooltip, FeatherIcon, call, ErrorMessage } from 'frappe-ui'
import { Tooltip, call } from 'frappe-ui'
import { defineModel, ref, computed } from 'vue'
import { watchOnce } from '@vueuse/core'

View File

@ -158,7 +158,7 @@ import EditIcon from '@/components/Icons/EditIcon.vue'
import Link from '@/components/Controls/Link.vue'
import Dropdown from '@/components/frappe-ui/Dropdown.vue'
import { contactsStore } from '@/stores/contacts'
import { FormControl, Dialog, call, FeatherIcon } from 'frappe-ui'
import { call } from 'frappe-ui'
import { ref, defineModel, nextTick, watch, computed, h } from 'vue'
import { createToast } from '@/utils'
import { useRouter } from 'vue-router'

View File

@ -42,7 +42,7 @@
</template>
<script setup>
import { TextInput, TextEditor, Dialog, call } from 'frappe-ui'
import { TextEditor, call } from 'frappe-ui'
import { ref, defineModel, nextTick, watch } from 'vue'
const props = defineProps({

View File

@ -131,7 +131,7 @@ import OrganizationsIcon from '@/components/Icons/OrganizationsIcon.vue'
import TerritoryIcon from '@/components/Icons/TerritoryIcon.vue'
import Link from '@/components/Controls/Link.vue'
import { organizationsStore } from '@/stores/organizations'
import { FormControl, Dialog, call, FeatherIcon } from 'frappe-ui'
import { call, FeatherIcon } from 'frappe-ui'
import { ref, defineModel, nextTick, watch, computed, h } from 'vue'
import { useRouter } from 'vue-router'

View File

@ -90,15 +90,7 @@ import UserAvatar from '@/components/UserAvatar.vue'
import Link from '@/components/Controls/Link.vue'
import { taskStatusOptions, taskPriorityOptions } from '@/utils'
import { usersStore } from '@/stores/users'
import {
TextInput,
TextEditor,
Dialog,
Dropdown,
Tooltip,
DatePicker,
call,
} from 'frappe-ui'
import { TextEditor, Dropdown, Tooltip, DatePicker, call } from 'frappe-ui'
import { ref, defineModel, watch, nextTick } from 'vue'
const props = defineProps({

View File

@ -34,7 +34,7 @@
</template>
<script setup>
import { Dialog, FormControl, call } from 'frappe-ui'
import { call } from 'frappe-ui'
import { ref, watch, defineModel, nextTick } from 'vue'
const props = defineProps({

View File

@ -70,7 +70,7 @@ import Link from '@/components/Controls/Link.vue'
import OrganizationModal from '@/components/Modals/OrganizationModal.vue'
import { usersStore } from '@/stores/users'
import { statusesStore } from '@/stores/statuses'
import { FormControl, Tooltip } from 'frappe-ui'
import { Tooltip } from 'frappe-ui'
import { computed, onMounted, ref } from 'vue'
const { getUser } = usersStore()

View File

@ -70,7 +70,7 @@ import OrganizationModal from '@/components/Modals/OrganizationModal.vue'
import Link from '@/components/Controls/Link.vue'
import { usersStore } from '@/stores/users'
import { statusesStore } from '@/stores/statuses'
import { FormControl, Tooltip } from 'frappe-ui'
import { Tooltip } from 'frappe-ui'
import { computed, onMounted, ref } from 'vue'
const { getUser } = usersStore()

View File

@ -42,7 +42,7 @@
</div>
</template>
<script setup>
import { Dropdown, Badge, Tooltip, FeatherIcon } from 'frappe-ui'
import { Dropdown, Tooltip } from 'frappe-ui'
import { timeAgo, dateFormat, formatTime, dateTooltipFormat } from '@/utils'
import { statusesStore } from '@/stores/statuses'
import { computed, defineModel } from 'vue'

View File

@ -29,7 +29,6 @@
</transition>
</template>
<script setup>
import { FeatherIcon } from 'frappe-ui'
import { ref } from 'vue'
const props = defineProps({
label: {

View File

@ -103,7 +103,7 @@ import ArrowUpRightIcon from '@/components/Icons/ArrowUpRightIcon.vue'
import Link from '@/components/Controls/Link.vue'
import UserAvatar from '@/components/UserAvatar.vue'
import { usersStore } from '@/stores/users'
import { FormControl, Tooltip } from 'frappe-ui'
import { Tooltip } from 'frappe-ui'
import { defineModel } from 'vue'
const props = defineProps({

View File

@ -99,13 +99,7 @@ import NestedPopover from '@/components/NestedPopover.vue'
import SortIcon from '@/components/Icons/SortIcon.vue'
import DragIcon from '@/components/Icons/DragIcon.vue'
import { useSortable } from '@vueuse/integrations/useSortable'
import {
FeatherIcon,
Button,
Autocomplete,
FormControl,
createResource,
} from 'frappe-ui'
import { Autocomplete, createResource } from 'frappe-ui'
import { computed, ref, nextTick } from 'vue'
const props = defineProps({

View File

@ -46,7 +46,7 @@
import CRMLogo from '@/components/Icons/CRMLogo.vue'
import { sessionStore } from '@/stores/session'
import { usersStore } from '@/stores/users'
import { Dropdown, FeatherIcon } from 'frappe-ui'
import { Dropdown } from 'frappe-ui'
import { computed } from 'vue'
const props = defineProps({

View File

@ -77,7 +77,7 @@ import ColumnSettings from '@/components/ColumnSettings.vue'
import { globalStore } from '@/stores/global'
import { viewsStore } from '@/stores/views'
import { useDebounceFn } from '@vueuse/core'
import { createResource, FeatherIcon, Dropdown, call } from 'frappe-ui'
import { createResource, Dropdown, call } from 'frappe-ui'
import { computed, ref, defineModel, onMounted, watch, h } from 'vue'
import { useRouter, useRoute } from 'vue-router'

View File

@ -17,6 +17,7 @@ import {
Badge,
setConfig,
frappeRequest,
FeatherIcon,
} from 'frappe-ui'
import { createDialog } from './utils/dialogs'
import socket from './socket'
@ -32,6 +33,7 @@ let globalComponents = {
Dialog,
Alert,
Badge,
FeatherIcon,
}
// create a pinia instance

View File

@ -143,14 +143,17 @@
import LayoutHeader from '@/components/LayoutHeader.vue'
import DurationIcon from '@/components/Icons/DurationIcon.vue'
import NoteModal from '@/components/Modals/NoteModal.vue'
import { dateFormat, timeAgo, dateTooltipFormat, secondsToDuration } from '@/utils'
import {
dateFormat,
timeAgo,
dateTooltipFormat,
secondsToDuration,
} from '@/utils'
import {
TextEditor,
Avatar,
FeatherIcon,
call,
Tooltip,
Badge,
createResource,
Breadcrumbs,
} from 'frappe-ui'

View File

@ -198,16 +198,13 @@
<script setup>
import {
FeatherIcon,
Breadcrumbs,
Avatar,
FileUploader,
ErrorMessage,
Tooltip,
Tabs,
call,
createResource,
createListResource,
} from 'frappe-ui'
import Dropdown from '@/components/frappe-ui/Dropdown.vue'
import LayoutHeader from '@/components/LayoutHeader.vue'

View File

@ -38,7 +38,7 @@ import LayoutHeader from '@/components/LayoutHeader.vue'
import ContactModal from '@/components/Modals/ContactModal.vue'
import ContactsListView from '@/components/ListViews/ContactsListView.vue'
import ViewControls from '@/components/ViewControls.vue'
import { FeatherIcon, Breadcrumbs } from 'frappe-ui'
import { Breadcrumbs } from 'frappe-ui'
import { organizationsStore } from '@/stores/organizations.js'
import { dateFormat, dateTooltipFormat, timeAgo } from '@/utils'
import { ref, computed } from 'vue'

View File

@ -300,14 +300,12 @@ import { organizationsStore } from '@/stores/organizations'
import { statusesStore } from '@/stores/statuses'
import {
createResource,
FeatherIcon,
Dropdown,
Tooltip,
Avatar,
Tabs,
Breadcrumbs,
call,
Badge,
} from 'frappe-ui'
import { ref, computed, h } from 'vue'
import { useRouter } from 'vue-router'

View File

@ -61,13 +61,7 @@ import {
formatNumberIntoCurrency,
formatTime,
} from '@/utils'
import {
FeatherIcon,
Dialog,
Button,
createResource,
Breadcrumbs,
} from 'frappe-ui'
import { createResource, Breadcrumbs } from 'frappe-ui'
import { useRouter } from 'vue-router'
import { ref, computed, reactive } from 'vue'

View File

@ -32,7 +32,11 @@
</Button>
</template>
</Dropdown>
<Button label="Convert to Deal" variant="solid" @click="convertToDeal" />
<Button
label="Convert to Deal"
variant="solid"
@click="showConvertToDealModal = true"
/>
</template>
</LayoutHeader>
<div v-if="lead?.data" class="flex h-full overflow-hidden">
@ -158,23 +162,74 @@
</div>
</div>
</div>
<OrganizationModal
v-model="showOrganizationModal"
:organization="_organization"
:options="{
redirect: false,
afterInsert: (doc) =>
updateField('organization', doc.name, () => {
organizations.reload()
}),
}"
/>
<AssignmentModal
v-if="lead.data"
:doc="lead.data"
v-model="showAssignmentModal"
v-model:assignees="lead.data._assignedTo"
/>
<Dialog
v-model="showConvertToDealModal"
:options="{
title: 'Convert to Deal',
size: 'xl',
actions: [
{
label: 'Convert',
variant: 'solid',
onClick: convertToDeal,
},
],
}"
>
<template #body-content>
<div class="mb-4 flex items-center gap-2 text-gray-600">
<OrganizationsIcon class="h-4 w-4" />
<label class="block text-base"> Organization </label>
</div>
<div class="ml-6">
<div class="flex items-center justify-between text-base">
<div>Choose Existing</div>
<Switch v-model="existingOrganizationChecked" />
</div>
<Link
v-if="existingOrganizationChecked"
class="form-control mt-2.5"
variant="outline"
size="md"
:value="existingOrganization"
doctype="CRM Organization"
@change="(data) => (existingOrganization = data)"
/>
<div v-else class="mt-2.5 text-base">
New organization will be created based on the data in details section
</div>
</div>
<div class="mb-4 mt-6 flex items-center gap-2 text-gray-600">
<ContactsIcon class="h-4 w-4" />
<label class="block text-base"> Contact </label>
</div>
<div class="ml-6">
<div class="flex items-center justify-between text-base">
<div>Choose Existing</div>
<Switch v-model="existingContactChecked" />
</div>
<Link
v-if="existingContactChecked"
class="form-control mt-2.5"
variant="outline"
size="md"
:value="existingContact"
doctype="Contact"
@change="(data) => (existingContact = data)"
/>
<div v-else class="mt-2.5 text-base">
New contact will be created based on the person's details
</div>
</div>
</template>
</Dialog>
</template>
<script setup>
import ActivityIcon from '@/components/Icons/ActivityIcon.vue'
@ -185,11 +240,13 @@ import NoteIcon from '@/components/Icons/NoteIcon.vue'
import IndicatorIcon from '@/components/Icons/IndicatorIcon.vue'
import CameraIcon from '@/components/Icons/CameraIcon.vue'
import LinkIcon from '@/components/Icons/LinkIcon.vue'
import OrganizationsIcon from '@/components/Icons/OrganizationsIcon.vue'
import ContactsIcon from '@/components/Icons/ContactsIcon.vue'
import LayoutHeader from '@/components/LayoutHeader.vue'
import Activities from '@/components/Activities.vue'
import OrganizationModal from '@/components/Modals/OrganizationModal.vue'
import AssignmentModal from '@/components/Modals/AssignmentModal.vue'
import MultipleAvatar from '@/components/MultipleAvatar.vue'
import Link from '@/components/Controls/Link.vue'
import Section from '@/components/Section.vue'
import SectionFields from '@/components/SectionFields.vue'
import SLASection from '@/components/SLASection.vue'
@ -207,12 +264,11 @@ import { statusesStore } from '@/stores/statuses'
import {
createResource,
FileUploader,
ErrorMessage,
FeatherIcon,
Dropdown,
Tooltip,
Avatar,
Tabs,
Switch,
Breadcrumbs,
call,
} from 'frappe-ui'
@ -220,8 +276,8 @@ import { ref, computed } from 'vue'
import { useRouter } from 'vue-router'
const { $dialog } = globalStore()
const { contacts } = contactsStore()
const { organizations, getOrganization } = organizationsStore()
const { getContactByName, contacts } = contactsStore()
const { organizations } = organizationsStore()
const { statusOptions, getLeadStatus } = statusesStore()
const router = useRouter()
@ -251,18 +307,12 @@ const lead = createResource({
})
const reload = ref(false)
const showOrganizationModal = ref(false)
const showAssignmentModal = ref(false)
const _organization = ref({})
const organization = computed(() => {
return lead.data?.organization && getOrganization(lead.data.organization)
})
function updateLead(fieldname, value, callback) {
value = Array.isArray(fieldname) ? '' : value
if (validateRequired(fieldname, value)) return
if (!Array.isArray(fieldname) && validateRequired(fieldname, value)) return
createResource({
url: 'frappe.client.set_value',
@ -354,16 +404,6 @@ const detailSections = computed(() => {
return data.doctype_fields
})
async function convertToDeal() {
let deal = await call('crm.fcrm.doctype.crm_lead.crm_lead.convert_to_deal', {
lead: lead.data.name,
})
if (deal) {
await contacts.reload()
router.push({ name: 'Deal', params: { dealId: deal } })
}
}
function updateField(name, value, callback) {
updateLead(name, value, () => {
lead.data[name] = value
@ -378,4 +418,82 @@ async function deleteLead(name) {
})
router.push({ name: 'Leads' })
}
// Convert to Deal
const showConvertToDealModal = ref(false)
const existingContactChecked = ref(false)
const existingOrganizationChecked = ref(false)
const existingContact = ref('')
const existingOrganization = ref('')
async function convertToDeal(updated) {
let valueUpdated = false
if (existingContactChecked.value && !existingContact.value) {
createToast({
title: 'Error',
text: 'Please select an existing contact',
icon: 'x',
iconClasses: 'text-red-600',
})
return
}
if (existingOrganizationChecked.value && !existingOrganization.value) {
createToast({
title: 'Error',
text: 'Please select an existing organization',
icon: 'x',
iconClasses: 'text-red-600',
})
return
}
if (existingContactChecked.value && existingContact.value) {
lead.data.salutation = getContactByName(existingContact.value).salutation
lead.data.first_name = getContactByName(existingContact.value).first_name
lead.data.last_name = getContactByName(existingContact.value).last_name
lead.data.email_id = getContactByName(existingContact.value).email_id
lead.data.mobile_no = getContactByName(existingContact.value).mobile_no
existingContactChecked.value = false
valueUpdated = true
}
if (existingOrganizationChecked.value && existingOrganization.value) {
lead.data.organization = existingOrganization.value
existingOrganizationChecked.value = false
valueUpdated = true
}
if (valueUpdated) {
updateLead(
{
salutation: lead.data.salutation,
first_name: lead.data.first_name,
last_name: lead.data.last_name,
email_id: lead.data.email_id,
mobile_no: lead.data.mobile_no,
organization: lead.data.organization,
},
'',
() => convertToDeal(true)
)
showConvertToDealModal.value = false
} else {
let deal = await call(
'crm.fcrm.doctype.crm_lead.crm_lead.convert_to_deal',
{
lead: lead.data.name,
}
)
if (deal) {
if (updated) {
await organizations.reload()
await contacts.reload()
}
router.push({ name: 'Deal', params: { dealId: deal } })
}
}
}
</script>

View File

@ -59,13 +59,7 @@ import { usersStore } from '@/stores/users'
import { organizationsStore } from '@/stores/organizations'
import { statusesStore } from '@/stores/statuses'
import { dateFormat, dateTooltipFormat, timeAgo, formatTime } from '@/utils'
import {
FeatherIcon,
Dialog,
Button,
createResource,
Breadcrumbs,
} from 'frappe-ui'
import { createResource, Breadcrumbs } from 'frappe-ui'
import { useRouter } from 'vue-router'
import { ref, computed, reactive } from 'vue'

View File

@ -78,7 +78,7 @@
<script setup>
import CRMLogo from '@/components/Icons/CRMLogo.vue';
import { sessionStore } from '@/stores/session'
import { FormControl, ErrorMessage, createResource } from 'frappe-ui'
import { createResource } from 'frappe-ui'
import { ref } from 'vue'
const session = sessionStore()

View File

@ -86,8 +86,6 @@ import NoteIcon from '@/components/Icons/NoteIcon.vue'
import NoteModal from '@/components/Modals/NoteModal.vue'
import { timeAgo, dateFormat, dateTooltipFormat } from '@/utils'
import {
FeatherIcon,
Button,
createListResource,
TextEditor,
call,

View File

@ -234,13 +234,10 @@
<script setup>
import {
Breadcrumbs,
FeatherIcon,
Avatar,
FileUploader,
ErrorMessage,
Dropdown,
Tabs,
Badge,
call,
createListResource,
} from 'frappe-ui'

View File

@ -41,7 +41,7 @@ import LayoutHeader from '@/components/LayoutHeader.vue'
import OrganizationModal from '@/components/Modals/OrganizationModal.vue'
import OrganizationsListView from '@/components/ListViews/OrganizationsListView.vue'
import ViewControls from '@/components/ViewControls.vue'
import { FeatherIcon, Breadcrumbs } from 'frappe-ui'
import { Breadcrumbs } from 'frappe-ui'
import {
dateFormat,
dateTooltipFormat,