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

This commit is contained in:
Shariq Ansari 2025-06-04 19:14:15 +05:30
parent c4feed116d
commit 8dcb77634b
15 changed files with 38 additions and 101 deletions

View File

@ -46,29 +46,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({
@ -123,9 +112,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
@ -184,12 +173,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>

View File

@ -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>

View File

@ -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>

View File

@ -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(() => {

View File

@ -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>

View File

@ -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(() => {

View File

@ -50,6 +50,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'
@ -160,10 +161,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>

View File

@ -1,3 +1,6 @@
import { ref } from 'vue';
export const showQuickEntryModal = ref(false);
export const quickEntryProps = ref({});
export const showAboutModal = ref(false);

View File

@ -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)

View File

@ -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({})

View File

@ -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>

View File

@ -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({})

View File

@ -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()

View File

@ -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

View File

@ -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>