fix: moved quick entry modal related logic to modals.js & GlobalModals for all pages

(cherry picked from commit 8dcb77634bf85ae98c428272ac7de8fb221ea19a)
2025-06-04 19:14:15 +05:30 · 2025-06-04 19:14:15 +05:30 · d30a3efa60
commit d30a3efa60
parent 5358b5fdba
15 changed files with 38 additions and 101 deletions
--- a/frontend/src/components/Modals/CallLogModal.vue
+++ b/frontend/src/components/Modals/CallLogModal.vue
@ -63,29 +63,18 @@
      </div>
    </template>
  </Dialog>
-  <QuickEntryModal
-    v-if="showQuickEntryModal"
-    v-model="showQuickEntryModal"
-    doctype="CRM Call Log"
-  />
 </template>

 <script setup>
-import QuickEntryModal from '@/components/Modals/QuickEntryModal.vue'
 import FieldLayout from '@/components/FieldLayout/FieldLayout.vue'
 import EditIcon from '@/components/Icons/EditIcon.vue'
 import { usersStore } from '@/stores/users'
 import { isMobileView } from '@/composables/settings'
+import { showQuickEntryModal, quickEntryProps } from '@/composables/modals'
 import { getRandom } from '@/utils'
 import { capture } from '@/telemetry'
 import { useDocument } from '@/data/document'
-import {
-  FeatherIcon,
-  createResource,
-  ErrorMessage,
-  Badge,
-  call,
-} from 'frappe-ui'
+import { FeatherIcon, createResource, ErrorMessage, Badge } from 'frappe-ui'
 import { ref, nextTick, watch, computed } from 'vue'

 const props = defineProps({
@ -140,9 +129,9 @@ const callBacks = {
    loading.value = false
    if (err.exc_type == 'MandatoryError') {
      const errorMessage = err.messages
-        .map((msg) => msg.split('Log:')[1].trim())
+        .map((msg) => msg.split(': ')[2].trim())
        .join(', ')
-      error.value = `These fields are required: ${errorMessage}`
+      error.value = __('These fields are required: {0}', [errorMessage])
      return
    }
    error.value = err
@ -206,12 +195,9 @@ watch(
  },
 )

-const showQuickEntryModal = ref(false)
-
 function openQuickEntryModal() {
  showQuickEntryModal.value = true
-  nextTick(() => {
-    show.value = false
-  })
+  quickEntryProps.value = { doctype: 'CRM Call Log' }
+  nextTick(() => (show.value = false))
 }
 </script>
--- a/frontend/src/components/Modals/ContactModal.vue
+++ b/frontend/src/components/Modals/ContactModal.vue
@ -49,6 +49,7 @@ import FieldLayout from '@/components/FieldLayout/FieldLayout.vue'
 import EditIcon from '@/components/Icons/EditIcon.vue'
 import { usersStore } from '@/stores/users'
 import { isMobileView } from '@/composables/settings'
+import { showQuickEntryModal, quickEntryProps } from '@/composables/modals'
 import { useDocument } from '@/data/document'
 import { capture } from '@/telemetry'
 import { call, createResource } from 'frappe-ui'
@ -157,10 +158,10 @@ const tabs = createResource({
 onMounted(() => {
  Object.assign(_contact.doc, props.contact.data || props.contact || {})
 })
-const showQuickEntryModal = defineModel('showQuickEntryModal')

 function openQuickEntryModal() {
  showQuickEntryModal.value = true
+  quickEntryProps.value = { doctype: 'Contact' }
  nextTick(() => (show.value = false))
 }
 </script>
--- a/frontend/src/components/Modals/CreateDocumentModal.vue
+++ b/frontend/src/components/Modals/CreateDocumentModal.vue
@ -48,6 +48,7 @@ import FieldLayout from '@/components/FieldLayout/FieldLayout.vue'
 import EditIcon from '@/components/Icons/EditIcon.vue'
 import { usersStore } from '@/stores/users'
 import { isMobileView } from '@/composables/settings'
+import { showQuickEntryModal, quickEntryProps } from '@/composables/modals'
 import { FeatherIcon, createResource, ErrorMessage, call } from 'frappe-ui'
 import { ref, nextTick, watch, computed } from 'vue'

@ -62,7 +63,7 @@ const props = defineProps({
  },
 })

-const emit = defineEmits(['showQuickEntryModal', 'callback'])
+const emit = defineEmits(['callback'])

 const { isManager } = usersStore()

@ -139,9 +140,8 @@ watch(
 )

 function openQuickEntryModal() {
-  emit('showQuickEntryModal', props.doctype)
-  nextTick(() => {
-    show.value = false
-  })
+  showQuickEntryModal.value = true
+  quickEntryProps.value = { doctype: props.doctype }
+  nextTick(() => (show.value = false))
 }
 </script>
--- a/frontend/src/components/Modals/DealModal.vue
+++ b/frontend/src/components/Modals/DealModal.vue
@ -76,6 +76,7 @@ import FieldLayout from '@/components/FieldLayout/FieldLayout.vue'
 import { usersStore } from '@/stores/users'
 import { statusesStore } from '@/stores/statuses'
 import { isMobileView } from '@/composables/settings'
+import { showQuickEntryModal, quickEntryProps } from '@/composables/modals'
 import { useDocument } from '@/data/document'
 import { capture } from '@/telemetry'
 import { Switch, createResource } from 'frappe-ui'
@ -233,13 +234,10 @@ function createDeal() {
  })
 }

-const showQuickEntryModal = defineModel('quickEntry')
-
 function openQuickEntryModal() {
  showQuickEntryModal.value = true
-  nextTick(() => {
-    show.value = false
-  })
+  quickEntryProps.value = { doctype: 'CRM Deal' }
+  nextTick(() => (show.value = false))
 }

 onMounted(() => {
--- a/frontend/src/components/Modals/GlobalModals.vue
+++ b/frontend/src/components/Modals/GlobalModals.vue
@ -4,13 +4,12 @@
    v-model="showCreateDocumentModal"
    :doctype="createDocumentDoctype"
    :data="createDocumentData"
-    @showQuickEntryModal="(dt) => openQuickEntryModal(dt)"
    @callback="(data) => createDocumentCallback(data)"
  />
  <QuickEntryModal
    v-if="showQuickEntryModal"
    v-model="showQuickEntryModal"
-    :doctype="quickEntryDoctype"
+    v-bind="quickEntryProps"
  />
  <AboutModal v-model="showAboutModal" />
 </template>
@ -24,14 +23,9 @@ import {
  createDocumentData,
  createDocumentCallback,
 } from '@/composables/document'
-import { showAboutModal } from '@/composables/modals'
-import { ref } from 'vue'
-
-const showQuickEntryModal = ref(false)
-const quickEntryDoctype = ref('')
-
-function openQuickEntryModal(dt) {
-  showQuickEntryModal.value = true
-  quickEntryDoctype.value = dt
-}
+import {
+  showQuickEntryModal,
+  quickEntryProps,
+  showAboutModal,
+} from '@/composables/modals'
 </script>
--- a/frontend/src/components/Modals/LeadModal.vue
+++ b/frontend/src/components/Modals/LeadModal.vue
@ -48,6 +48,7 @@ import { usersStore } from '@/stores/users'
 import { statusesStore } from '@/stores/statuses'
 import { sessionStore } from '@/stores/session'
 import { isMobileView } from '@/composables/settings'
+import { showQuickEntryModal, quickEntryProps } from '@/composables/modals'
 import { capture } from '@/telemetry'
 import { createResource } from 'frappe-ui'
 import { useOnboarding } from 'frappe-ui/frappe'
@ -178,13 +179,10 @@ function createNewLead() {
  })
 }

-const showQuickEntryModal = defineModel('quickEntry')
-
 function openQuickEntryModal() {
  showQuickEntryModal.value = true
-  nextTick(() => {
-    show.value = false
-  })
+  quickEntryProps.value = { doctype: 'CRM Lead' }
+  nextTick(() => (show.value = false))
 }

 onMounted(() => {
--- a/frontend/src/components/Modals/OrganizationModal.vue
+++ b/frontend/src/components/Modals/OrganizationModal.vue
@ -60,6 +60,7 @@ import FieldLayout from '@/components/FieldLayout/FieldLayout.vue'
 import EditIcon from '@/components/Icons/EditIcon.vue'
 import { usersStore } from '@/stores/users'
 import { isMobileView } from '@/composables/settings'
+import { showQuickEntryModal, quickEntryProps } from '@/composables/modals'
 import { useDocument } from '@/data/document'
 import { capture } from '@/telemetry'
 import { call, FeatherIcon, createResource } from 'frappe-ui'
@ -173,10 +174,10 @@ onMounted(() => {
    organization.value?.doc || organization.value || {},
  )
 })
-const showQuickEntryModal = defineModel('showQuickEntryModal')

 function openQuickEntryModal() {
  showQuickEntryModal.value = true
+  quickEntryProps.value = { doctype: 'CRM Organization' }
  nextTick(() => (show.value = false))
 }
 </script>
--- a/frontend/src/composables/modals.js
+++ b/frontend/src/composables/modals.js
@ -1,3 +1,6 @@
 import { ref } from 'vue';

+export const showQuickEntryModal = ref(false);
+export const quickEntryProps = ref({});
+
 export const showAboutModal = ref(false);
--- a/frontend/src/pages/Contacts.vue
+++ b/frontend/src/pages/Contacts.vue
@ -63,16 +63,11 @@
    </div>
  </div>
  <ContactModal
+    v-if="showContactModal"
    v-model="showContactModal"
-    v-model:showQuickEntryModal="showQuickEntryModal"
    :contact="{}"
    @openAddressModal="(_address) => openAddressModal(_address)"
  />
-  <QuickEntryModal
-    v-if="showQuickEntryModal"
-    v-model="showQuickEntryModal"
-    doctype="Contact"
-  />
  <AddressModal v-model="showAddressModal" v-model:address="address" />
 </template>

@ -82,7 +77,6 @@ import CustomActions from '@/components/CustomActions.vue'
 import ContactsIcon from '@/components/Icons/ContactsIcon.vue'
 import LayoutHeader from '@/components/LayoutHeader.vue'
 import ContactModal from '@/components/Modals/ContactModal.vue'
-import QuickEntryModal from '@/components/Modals/QuickEntryModal.vue'
 import AddressModal from '@/components/Modals/AddressModal.vue'
 import ContactsListView from '@/components/ListViews/ContactsListView.vue'
 import ViewControls from '@/components/ViewControls.vue'
@ -97,7 +91,6 @@ const { getFormattedPercent, getFormattedFloat, getFormattedCurrency } =
 const { getOrganization } = organizationsStore()

 const showContactModal = ref(false)
-const showQuickEntryModal = ref(false)
 const showAddressModal = ref(false)

 const contactsListView = ref(null)
--- a/frontend/src/pages/Deals.vue
+++ b/frontend/src/pages/Deals.vue
@ -241,7 +241,6 @@
  <DealModal
    v-if="showDealModal"
    v-model="showDealModal"
-    v-model:quickEntry="showQuickEntryModal"
    :defaults="defaults"
  />
  <NoteModal
@ -258,11 +257,6 @@
    doctype="CRM Deal"
    :doc="docname"
  />
-  <QuickEntryModal
-    v-if="showQuickEntryModal"
-    v-model="showQuickEntryModal"
-    doctype="CRM Deal"
-  />
 </template>

 <script setup>
@ -282,7 +276,6 @@ import KanbanView from '@/components/Kanban/KanbanView.vue'
 import DealModal from '@/components/Modals/DealModal.vue'
 import NoteModal from '@/components/Modals/NoteModal.vue'
 import TaskModal from '@/components/Modals/TaskModal.vue'
-import QuickEntryModal from '@/components/Modals/QuickEntryModal.vue'
 import ViewControls from '@/components/ViewControls.vue'
 import { getMeta } from '@/stores/meta'
 import { globalStore } from '@/stores/global'
@ -306,7 +299,6 @@ const route = useRoute()

 const dealsListView = ref(null)
 const showDealModal = ref(false)
-const showQuickEntryModal = ref(false)

 const defaults = reactive({})

--- a/frontend/src/pages/Lead.vue
+++ b/frontend/src/pages/Lead.vue
@ -293,12 +293,6 @@
      />
    </template>
  </Dialog>
-  <QuickEntryModal
-    v-if="showQuickEntryModal"
-    v-model="showQuickEntryModal"
-    doctype="CRM Deal"
-    :onlyRequired="true"
-  />
  <FilesUploader
    v-if="lead.data?.name"
    v-model="showFilesUploader"
@ -339,7 +333,6 @@ import FilesUploader from '@/components/FilesUploader/FilesUploader.vue'
 import Link from '@/components/Controls/Link.vue'
 import SidePanelLayout from '@/components/SidePanelLayout.vue'
 import FieldLayout from '@/components/FieldLayout/FieldLayout.vue'
-import QuickEntryModal from '@/components/Modals/QuickEntryModal.vue'
 import SLASection from '@/components/SLASection.vue'
 import CustomActions from '@/components/CustomActions.vue'
 import {
@ -348,6 +341,7 @@ import {
  setupCustomizations,
  copyToClipboard,
 } from '@/utils'
+import { showQuickEntryModal, quickEntryProps } from '@/composables/modals'
 import { getView } from '@/utils/view'
 import { getSettings } from '@/stores/settings'
 import { sessionStore } from '@/stores/session'
@ -709,10 +703,12 @@ const dealTabs = createResource({
  },
 })

-const showQuickEntryModal = ref(false)
-
 function openQuickEntryModal() {
  showQuickEntryModal.value = true
+  quickEntryProps.value = {
+    doctype: 'CRM Deal',
+    onlyRequired: true,
+  }
  showConvertToDealModal.value = false
 }
 </script>
--- a/frontend/src/pages/Leads.vue
+++ b/frontend/src/pages/Leads.vue
@ -267,7 +267,6 @@
  <LeadModal
    v-if="showLeadModal"
    v-model="showLeadModal"
-    v-model:quickEntry="showQuickEntryModal"
    :defaults="defaults"
  />
  <NoteModal
@ -284,7 +283,6 @@
    doctype="CRM Lead"
    :doc="docname"
  />
-  <QuickEntryModal v-if="showQuickEntryModal" v-model="showQuickEntryModal" />
 </template>

 <script setup>
@ -304,7 +302,6 @@ import KanbanView from '@/components/Kanban/KanbanView.vue'
 import LeadModal from '@/components/Modals/LeadModal.vue'
 import NoteModal from '@/components/Modals/NoteModal.vue'
 import TaskModal from '@/components/Modals/TaskModal.vue'
-import QuickEntryModal from '@/components/Modals/QuickEntryModal.vue'
 import ViewControls from '@/components/ViewControls.vue'
 import { getMeta } from '@/stores/meta'
 import { globalStore } from '@/stores/global'
@ -326,7 +323,6 @@ const route = useRoute()

 const leadsListView = ref(null)
 const showLeadModal = ref(false)
-const showQuickEntryModal = ref(false)

 const defaults = reactive({})

--- a/frontend/src/pages/Organization.vue
+++ b/frontend/src/pages/Organization.vue
@ -164,11 +164,6 @@
    :errorTitle="errorTitle"
    :errorMessage="errorMessage"
  />
-  <QuickEntryModal
-    v-if="showQuickEntryModal"
-    v-model="showQuickEntryModal"
-    doctype="CRM Organization"
-  />
  <AddressModal v-model="showAddressModal" v-model:address="_address" />
 </template>

@ -178,7 +173,6 @@ import Resizer from '@/components/Resizer.vue'
 import SidePanelLayout from '@/components/SidePanelLayout.vue'
 import Icon from '@/components/Icon.vue'
 import LayoutHeader from '@/components/LayoutHeader.vue'
-import QuickEntryModal from '@/components/Modals/QuickEntryModal.vue'
 import AddressModal from '@/components/Modals/AddressModal.vue'
 import DealsListView from '@/components/ListViews/DealsListView.vue'
 import ContactsListView from '@/components/ListViews/ContactsListView.vue'
@ -222,7 +216,6 @@ const { getUser } = usersStore()
 const { $dialog } = globalStore()
 const { getDealStatus } = statusesStore()
 const { doctypeMeta } = getMeta('CRM Organization')
-const showQuickEntryModal = ref(false)

 const route = useRoute()
 const router = useRouter()
--- a/frontend/src/pages/Organizations.vue
+++ b/frontend/src/pages/Organizations.vue
@ -63,15 +63,10 @@
    </div>
  </div>
  <OrganizationModal
+    v-if="showOrganizationModal"
    v-model="showOrganizationModal"
-    v-model:showQuickEntryModal="showQuickEntryModal"
    @openAddressModal="(_address) => openAddressModal(_address)"
  />
-  <QuickEntryModal
-    v-if="showQuickEntryModal"
-    v-model="showQuickEntryModal"
-    doctype="CRM Organization"
-  />
  <AddressModal v-model="showAddressModal" v-model:address="address" />
 </template>
 <script setup>
@ -80,7 +75,6 @@ import CustomActions from '@/components/CustomActions.vue'
 import OrganizationsIcon from '@/components/Icons/OrganizationsIcon.vue'
 import LayoutHeader from '@/components/LayoutHeader.vue'
 import OrganizationModal from '@/components/Modals/OrganizationModal.vue'
-import QuickEntryModal from '@/components/Modals/QuickEntryModal.vue'
 import AddressModal from '@/components/Modals/AddressModal.vue'
 import OrganizationsListView from '@/components/ListViews/OrganizationsListView.vue'
 import ViewControls from '@/components/ViewControls.vue'
@ -94,7 +88,6 @@ const { getFormattedPercent, getFormattedFloat, getFormattedCurrency } =

 const organizationsListView = ref(null)
 const showOrganizationModal = ref(false)
-const showQuickEntryModal = ref(false)
 const showAddressModal = ref(false)

 // organizations data is loaded in the ViewControls component
--- a/frontend/src/pages/Welcome.vue
+++ b/frontend/src/pages/Welcome.vue
@ -41,21 +41,14 @@
      @click="showLeadModal = true"
    />
  </div>
-  <LeadModal
-    v-if="showLeadModal"
-    v-model="showLeadModal"
-    v-model:quickEntry="showQuickEntryModal"
-  />
-  <QuickEntryModal v-if="showQuickEntryModal" v-model="showQuickEntryModal" />
+  <LeadModal v-if="showLeadModal" v-model="showLeadModal" />
 </template>
 <script setup>
 import AvatarIcon from '@/components/Icons/AvatarIcon.vue'
 import GoogleIcon from '@/components/Icons/GoogleIcon.vue'
 import LeadModal from '@/components/Modals/LeadModal.vue'
-import QuickEntryModal from '@/components/Modals/QuickEntryModal.vue'
 import { ref } from 'vue'

 const name = ref('John Doe')
 const showLeadModal = ref(false)
-const showQuickEntryModal = ref(false)
 </script>