fix: handle new document for lead/deal/contact/organization

This commit is contained in:
Shariq Ansari 2025-06-04 19:00:57 +05:30
parent e220767179
commit c4feed116d
6 changed files with 145 additions and 149 deletions

View File

@ -25,7 +25,7 @@
<FieldLayout <FieldLayout
v-if="tabs.data?.length" v-if="tabs.data?.length"
:tabs="tabs.data" :tabs="tabs.data"
:data="_contact" :data="_contact.doc"
doctype="Contact" doctype="Contact"
/> />
</div> </div>
@ -49,9 +49,10 @@ import FieldLayout from '@/components/FieldLayout/FieldLayout.vue'
import EditIcon from '@/components/Icons/EditIcon.vue' import EditIcon from '@/components/Icons/EditIcon.vue'
import { usersStore } from '@/stores/users' import { usersStore } from '@/stores/users'
import { isMobileView } from '@/composables/settings' import { isMobileView } from '@/composables/settings'
import { useDocument } from '@/data/document'
import { capture } from '@/telemetry' import { capture } from '@/telemetry'
import { call, createResource } from 'frappe-ui' import { call, createResource } from 'frappe-ui'
import { ref, nextTick, watch } from 'vue' import { ref, nextTick, onMounted } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
const props = defineProps({ const props = defineProps({
@ -77,23 +78,27 @@ const show = defineModel()
const loading = ref(false) const loading = ref(false)
let _contact = ref({}) const { document: _contact } = useDocument('Contact')
if (Object.keys(_contact.doc).length != 0) {
_contact.doc = {}
}
async function createContact() { async function createContact() {
if (_contact.value.email_id) { if (_contact.doc.email_id) {
_contact.value.email_ids = [{ email_id: _contact.value.email_id }] _contact.doc.email_ids = [{ email_id: _contact.doc.email_id }]
delete _contact.value.email_id delete _contact.doc.email_id
} }
if (_contact.value.mobile_no) { if (_contact.doc.mobile_no) {
_contact.value.phone_nos = [{ phone: _contact.value.mobile_no }] _contact.doc.phone_nos = [{ phone: _contact.doc.mobile_no }]
delete _contact.value.mobile_no delete _contact.doc.mobile_no
} }
const doc = await call('frappe.client.insert', { const doc = await call('frappe.client.insert', {
doc: { doc: {
doctype: 'Contact', doctype: 'Contact',
..._contact.value, ..._contact.doc,
}, },
}) })
if (doc.name) { if (doc.name) {
@ -130,7 +135,7 @@ const tabs = createResource({
field.read_only = false field.read_only = false
} else if (field.fieldname == 'address') { } else if (field.fieldname == 'address') {
field.create = (value, close) => { field.create = (value, close) => {
_contact.value.address = value _contact.doc.address = value
emit('openAddressModal') emit('openAddressModal')
show.value = false show.value = false
close() close()
@ -140,7 +145,7 @@ const tabs = createResource({
show.value = false show.value = false
} }
} else if (field.fieldtype === 'Table') { } else if (field.fieldtype === 'Table') {
_contact.value[field.fieldname] = [] _contact.doc[field.fieldname] = []
} }
}) })
}) })
@ -149,16 +154,9 @@ const tabs = createResource({
}, },
}) })
watch( onMounted(() => {
() => show.value, Object.assign(_contact.doc, props.contact.data || props.contact || {})
(value) => { })
if (!value) return
nextTick(() => {
_contact.value = { ...props.contact.data }
})
},
)
const showQuickEntryModal = defineModel('showQuickEntryModal') const showQuickEntryModal = defineModel('showQuickEntryModal')
function openQuickEntryModal() { function openQuickEntryModal() {

View File

@ -50,7 +50,7 @@
ref="fieldLayoutRef" ref="fieldLayoutRef"
v-if="tabs.data?.length" v-if="tabs.data?.length"
:tabs="tabs.data" :tabs="tabs.data"
:data="deal" :data="deal.doc"
doctype="CRM Deal" doctype="CRM Deal"
/> />
<ErrorMessage class="mt-4" v-if="error" :message="__(error)" /> <ErrorMessage class="mt-4" v-if="error" :message="__(error)" />
@ -76,9 +76,10 @@ import FieldLayout from '@/components/FieldLayout/FieldLayout.vue'
import { usersStore } from '@/stores/users' import { usersStore } from '@/stores/users'
import { statusesStore } from '@/stores/statuses' import { statusesStore } from '@/stores/statuses'
import { isMobileView } from '@/composables/settings' import { isMobileView } from '@/composables/settings'
import { useDocument } from '@/data/document'
import { capture } from '@/telemetry' import { capture } from '@/telemetry'
import { Switch, createResource } from 'frappe-ui' import { Switch, createResource } from 'frappe-ui'
import { computed, ref, reactive, onMounted, nextTick, watch } from 'vue' import { computed, ref, onMounted, nextTick, watch } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
const props = defineProps({ const props = defineProps({
@ -92,24 +93,11 @@ const show = defineModel()
const router = useRouter() const router = useRouter()
const error = ref(null) const error = ref(null)
const deal = reactive({ const { document: deal } = useDocument('CRM Deal')
organization: '',
organization_name: '', if (Object.keys(deal.doc).length != 0) {
website: '', deal.doc = {}
no_of_employees: '', }
territory: '',
annual_revenue: '',
industry: '',
contact: '',
salutation: '',
first_name: '',
last_name: '',
email: '',
mobile_no: '',
gender: '',
status: '',
deal_owner: '',
})
const hasOrganizationSections = ref(true) const hasOrganizationSections = ref(true)
const hasContactSections = ref(true) const hasContactSections = ref(true)
@ -165,11 +153,11 @@ const tabs = createResource({
if (field.fieldname == 'status') { if (field.fieldname == 'status') {
field.fieldtype = 'Select' field.fieldtype = 'Select'
field.options = dealStatuses.value field.options = dealStatuses.value
field.prefix = getDealStatus(deal.status).color field.prefix = getDealStatus(deal.doc.status).color
} }
if (field.fieldtype === 'Table') { if (field.fieldtype === 'Table') {
deal[field.fieldname] = [] deal.doc[field.fieldname] = []
} }
}) })
}) })
@ -180,46 +168,49 @@ const tabs = createResource({
const dealStatuses = computed(() => { const dealStatuses = computed(() => {
let statuses = statusOptions('deal') let statuses = statusOptions('deal')
if (!deal.status) { if (!deal.doc.status) {
deal.status = statuses[0].value deal.doc.status = statuses[0].value
} }
return statuses return statuses
}) })
function createDeal() { function createDeal() {
if (deal.website && !deal.website.startsWith('http')) { if (deal.doc.website && !deal.doc.website.startsWith('http')) {
deal.website = 'https://' + deal.website deal.doc.website = 'https://' + deal.doc.website
} }
if (chooseExistingContact.value) { if (chooseExistingContact.value) {
deal['first_name'] = null deal.doc['first_name'] = null
deal['last_name'] = null deal.doc['last_name'] = null
deal['email'] = null deal.doc['email'] = null
deal['mobile_no'] = null deal.doc['mobile_no'] = null
} else deal['contact'] = null } else deal.doc['contact'] = null
createResource({ createResource({
url: 'crm.fcrm.doctype.crm_deal.crm_deal.create_deal', url: 'crm.fcrm.doctype.crm_deal.crm_deal.create_deal',
params: { args: deal }, params: { args: deal.doc },
auto: true, auto: true,
validate() { validate() {
error.value = null error.value = null
if (deal.annual_revenue) { if (deal.doc.annual_revenue) {
if (typeof deal.annual_revenue === 'string') { if (typeof deal.doc.annual_revenue === 'string') {
deal.annual_revenue = deal.annual_revenue.replace(/,/g, '') deal.doc.annual_revenue = deal.doc.annual_revenue.replace(/,/g, '')
} else if (isNaN(deal.annual_revenue)) { } else if (isNaN(deal.doc.annual_revenue)) {
error.value = __('Annual Revenue should be a number') error.value = __('Annual Revenue should be a number')
return error.value return error.value
} }
} }
if (deal.mobile_no && isNaN(deal.mobile_no.replace(/[-+() ]/g, ''))) { if (
deal.doc.mobile_no &&
isNaN(deal.doc.mobile_no.replace(/[-+() ]/g, ''))
) {
error.value = __('Mobile No should be a number') error.value = __('Mobile No should be a number')
return error.value return error.value
} }
if (deal.email && !deal.email.includes('@')) { if (deal.doc.email && !deal.doc.email.includes('@')) {
error.value = __('Invalid Email') error.value = __('Invalid Email')
return error.value return error.value
} }
if (!deal.status) { if (!deal.doc.status) {
error.value = __('Status is required') error.value = __('Status is required')
return error.value return error.value
} }
@ -252,12 +243,12 @@ function openQuickEntryModal() {
} }
onMounted(() => { onMounted(() => {
Object.assign(deal, props.defaults) Object.assign(deal.doc, props.defaults)
if (!deal.deal_owner) { if (!deal.doc.deal_owner) {
deal.deal_owner = getUser().name deal.doc.deal_owner = getUser().name
} }
if (!deal.status && dealStatuses.value[0].value) { if (!deal.doc.status && dealStatuses.value[0].value) {
deal.status = dealStatuses.value[0].value deal.doc.status = dealStatuses.value[0].value
} }
}) })
</script> </script>

View File

@ -23,7 +23,7 @@
</div> </div>
</div> </div>
<div> <div>
<FieldLayout v-if="tabs.data" :tabs="tabs.data" :data="lead" /> <FieldLayout v-if="tabs.data" :tabs="tabs.data" :data="lead.doc" />
<ErrorMessage class="mt-4" v-if="error" :message="__(error)" /> <ErrorMessage class="mt-4" v-if="error" :message="__(error)" />
</div> </div>
</div> </div>
@ -51,7 +51,8 @@ import { isMobileView } from '@/composables/settings'
import { capture } from '@/telemetry' import { capture } from '@/telemetry'
import { createResource } from 'frappe-ui' import { createResource } from 'frappe-ui'
import { useOnboarding } from 'frappe-ui/frappe' import { useOnboarding } from 'frappe-ui/frappe'
import { computed, onMounted, ref, reactive, nextTick } from 'vue' import { useDocument } from '@/data/document'
import { computed, onMounted, ref, nextTick } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
const props = defineProps({ const props = defineProps({
@ -68,6 +69,20 @@ const router = useRouter()
const error = ref(null) const error = ref(null)
const isLeadCreating = ref(false) const isLeadCreating = ref(false)
const { document: lead } = useDocument('CRM Lead')
if (Object.keys(lead.doc).length != 0) {
lead.doc = {}
}
const leadStatuses = computed(() => {
let statuses = statusOptions('lead')
if (!lead.doc.status) {
lead.doc.status = statuses?.[0]?.value
}
return statuses
})
const tabs = createResource({ const tabs = createResource({
url: 'crm.fcrm.doctype.crm_fields_layout.crm_fields_layout.get_fields_layout', url: 'crm.fcrm.doctype.crm_fields_layout.crm_fields_layout.get_fields_layout',
cache: ['QuickEntry', 'CRM Lead'], cache: ['QuickEntry', 'CRM Lead'],
@ -81,11 +96,11 @@ const tabs = createResource({
if (field.fieldname == 'status') { if (field.fieldname == 'status') {
field.fieldtype = 'Select' field.fieldtype = 'Select'
field.options = leadStatuses.value field.options = leadStatuses.value
field.prefix = getLeadStatus(lead.status).color field.prefix = getLeadStatus(lead.doc.status).color
} }
if (field.fieldtype === 'Table') { if (field.fieldtype === 'Table') {
lead[field.fieldname] = [] lead.doc[field.fieldname] = []
} }
}) })
}) })
@ -94,23 +109,6 @@ const tabs = createResource({
}, },
}) })
const lead = reactive({
salutation: '',
first_name: '',
last_name: '',
email: '',
mobile_no: '',
gender: '',
organization: '',
website: '',
no_of_employees: '',
territory: '',
annual_revenue: '',
industry: '',
status: '',
lead_owner: '',
})
const createLead = createResource({ const createLead = createResource({
url: 'frappe.client.insert', url: 'frappe.client.insert',
makeParams(values) { makeParams(values) {
@ -123,43 +121,38 @@ const createLead = createResource({
}, },
}) })
const leadStatuses = computed(() => {
let statuses = statusOptions('lead')
if (!lead.status) {
lead.status = statuses?.[0]?.value
}
return statuses
})
function createNewLead() { function createNewLead() {
if (lead.website && !lead.website.startsWith('http')) { if (lead.doc.website && !lead.doc.website.startsWith('http')) {
lead.website = 'https://' + lead.website lead.doc.website = 'https://' + lead.doc.website
} }
createLead.submit(lead, { createLead.submit(lead.doc, {
validate() { validate() {
error.value = null error.value = null
if (!lead.first_name) { if (!lead.doc.first_name) {
error.value = __('First Name is mandatory') error.value = __('First Name is mandatory')
return error.value return error.value
} }
if (lead.annual_revenue) { if (lead.doc.annual_revenue) {
if (typeof lead.annual_revenue === 'string') { if (typeof lead.doc.annual_revenue === 'string') {
lead.annual_revenue = lead.annual_revenue.replace(/,/g, '') lead.doc.annual_revenue = lead.doc.annual_revenue.replace(/,/g, '')
} else if (isNaN(lead.annual_revenue)) { } else if (isNaN(lead.doc.annual_revenue)) {
error.value = __('Annual Revenue should be a number') error.value = __('Annual Revenue should be a number')
return error.value return error.value
} }
} }
if (lead.mobile_no && isNaN(lead.mobile_no.replace(/[-+() ]/g, ''))) { if (
lead.doc.mobile_no &&
isNaN(lead.doc.mobile_no.replace(/[-+() ]/g, ''))
) {
error.value = __('Mobile No should be a number') error.value = __('Mobile No should be a number')
return error.value return error.value
} }
if (lead.email && !lead.email.includes('@')) { if (lead.doc.email && !lead.doc.email.includes('@')) {
error.value = __('Invalid Email') error.value = __('Invalid Email')
return error.value return error.value
} }
if (!lead.status) { if (!lead.doc.status) {
error.value = __('Status is required') error.value = __('Status is required')
return error.value return error.value
} }
@ -195,12 +188,12 @@ function openQuickEntryModal() {
} }
onMounted(() => { onMounted(() => {
Object.assign(lead, props.defaults) Object.assign(lead.doc, props.defaults)
if (!lead.lead_owner) { if (!lead.doc?.lead_owner) {
lead.lead_owner = getUser().name lead.doc.lead_owner = getUser().name
} }
if (!lead.status && leadStatuses.value[0]?.value) { if (!lead.doc?.status && leadStatuses.value[0]?.value) {
lead.status = leadStatuses.value[0].value lead.doc.status = leadStatuses.value[0].value
} }
}) })
</script> </script>

View File

@ -9,7 +9,12 @@
</h3> </h3>
</div> </div>
<div class="flex items-center gap-1"> <div class="flex items-center gap-1">
<Button v-if="isManager() && !isMobileView" variant="ghost" class="w-7" @click="openQuickEntryModal"> <Button
v-if="isManager() && !isMobileView"
variant="ghost"
class="w-7"
@click="openQuickEntryModal"
>
<EditIcon class="w-4 h-4" /> <EditIcon class="w-4 h-4" />
</Button> </Button>
<Button variant="ghost" class="w-7" @click="show = false"> <Button variant="ghost" class="w-7" @click="show = false">
@ -17,12 +22,23 @@
</Button> </Button>
</div> </div>
</div> </div>
<FieldLayout v-if="tabs.data?.length" :tabs="tabs.data" :data="_organization" doctype="CRM Organization" /> <FieldLayout
v-if="tabs.data?.length"
:tabs="tabs.data"
:data="_organization.doc"
doctype="CRM Organization"
/>
<ErrorMessage class="mt-8" v-if="error" :message="__(error)" /> <ErrorMessage class="mt-8" v-if="error" :message="__(error)" />
</div> </div>
<div class="px-4 pt-4 pb-7 sm:px-6"> <div class="px-4 pt-4 pb-7 sm:px-6">
<div class="space-y-2"> <div class="space-y-2">
<Button class="w-full" variant="solid" :label="__('Create')" :loading="loading" @click="createOrganization" /> <Button
class="w-full"
variant="solid"
:label="__('Create')"
:loading="loading"
@click="createOrganization"
/>
</div> </div>
</div> </div>
</template> </template>
@ -34,9 +50,10 @@ import FieldLayout from '@/components/FieldLayout/FieldLayout.vue'
import EditIcon from '@/components/Icons/EditIcon.vue' import EditIcon from '@/components/Icons/EditIcon.vue'
import { usersStore } from '@/stores/users' import { usersStore } from '@/stores/users'
import { isMobileView } from '@/composables/settings' import { isMobileView } from '@/composables/settings'
import { useDocument } from '@/data/document'
import { capture } from '@/telemetry' import { capture } from '@/telemetry'
import { call, FeatherIcon, createResource } from 'frappe-ui' import { call, FeatherIcon, createResource } from 'frappe-ui'
import { ref, nextTick, watch } from 'vue' import { ref, nextTick, onMounted } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
const props = defineProps({ const props = defineProps({
@ -44,7 +61,7 @@ const props = defineProps({
type: Object, type: Object,
default: { default: {
redirect: true, redirect: true,
afterInsert: () => { }, afterInsert: () => {},
}, },
}, },
}) })
@ -60,30 +77,32 @@ const organization = defineModel('organization')
const loading = ref(false) const loading = ref(false)
const title = ref(null) const title = ref(null)
let _organization = ref({ const { document: _organization } = useDocument('CRM Organization')
organization_name: '',
website: '', if (Object.keys(_organization.doc).length != 0) {
annual_revenue: '', _organization.doc = { no_of_employees: '1-10' }
no_of_employees: '1-10', }
industry: '',
})
let doc = ref({}) let doc = ref({})
const error = ref(null) const error = ref(null)
async function createOrganization() { async function createOrganization() {
const doc = await call('frappe.client.insert', { const doc = await call(
doc: { 'frappe.client.insert',
doctype: 'CRM Organization', {
..._organization.value, doc: {
doctype: 'CRM Organization',
..._organization.doc,
},
}, },
}, { {
onError: (err) => { onError: (err) => {
if (err.error.exc_type == 'ValidationError') { if (err.error.exc_type == 'ValidationError') {
error.value = err.error?.messages?.[0] error.value = err.error?.messages?.[0]
} }
} },
}) },
)
loading.value = false loading.value = false
if (doc.name) { if (doc.name) {
capture('organization_created') capture('organization_created')
@ -116,7 +135,7 @@ const tabs = createResource({
column.fields.forEach((field) => { column.fields.forEach((field) => {
if (field.fieldname == 'address') { if (field.fieldname == 'address') {
field.create = (value, close) => { field.create = (value, close) => {
_organization.value.address = value _organization.doc.address = value
emit('openAddressModal') emit('openAddressModal')
show.value = false show.value = false
close() close()
@ -126,7 +145,7 @@ const tabs = createResource({
show.value = false show.value = false
} }
} else if (field.fieldtype === 'Table') { } else if (field.fieldtype === 'Table') {
_organization.value[field.fieldname] = [] _organization.doc[field.fieldname] = []
} }
}) })
}) })
@ -135,19 +154,12 @@ const tabs = createResource({
}, },
}) })
watch( onMounted(() => {
() => show.value, Object.assign(
(value) => { _organization.doc,
if (!value) return organization.value?.doc || organization.value || {},
nextTick(() => { )
// TODO: Issue with FormControl })
// title.value.el.focus()
doc.value = organization.value?.doc || organization.value || {}
_organization.value = { ...doc.value }
})
},
)
const showQuickEntryModal = defineModel('showQuickEntryModal') const showQuickEntryModal = defineModel('showQuickEntryModal')
function openQuickEntryModal() { function openQuickEntryModal() {

View File

@ -280,6 +280,7 @@
}" }"
/> />
<ContactModal <ContactModal
v-if="showContactModal"
v-model="showContactModal" v-model="showContactModal"
:contact="_contact" :contact="_contact"
:options="{ :options="{

View File

@ -222,6 +222,7 @@
}" }"
/> />
<ContactModal <ContactModal
v-if="showContactModal"
v-model="showContactModal" v-model="showContactModal"
:contact="_contact" :contact="_contact"
:options="{ :options="{