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

Merge pull request #495 from frappe/develop

Browse Source
This commit is contained in:
Shariq Ansari 2024-12-30 00:11:27 +05:30 committed by GitHub
commit ff7b52a20e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
10 changed files with 149 additions and 205 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
frontend/src/components/Controls/Grid.vue
View File

@ -50,7 +50,7 @@
</div>
</div>
<!-- Rows -->
<template v-if="rows.length">
<template v-if="rows?.length">
<Draggable class="w-full" v-model="rows" group="rows" item-key="name">
<template #item="{ element: row, index }">
<div
@ -186,18 +186,18 @@
/>
<Button :label="__('Add Row')" @click="addRow" />
</div>
<GridRowFieldsModal
v-if="showGridRowFieldsModal"
v-model="showGridRowFieldsModal"
:doctype="doctype"
/>
<GridFieldsEditorModal
v-if="showGridFieldsEditorModal"
v-model="showGridFieldsEditorModal"
:doctype="doctype"
:parentDoctype="parentDoctype"
/>
</div>
<GridRowFieldsModal
v-if="showGridRowFieldsModal"
v-model="showGridRowFieldsModal"
:doctype="doctype"
/>
<GridFieldsEditorModal
v-if="showGridFieldsEditorModal"
v-model="showGridFieldsEditorModal"
:doctype="doctype"
:parentDoctype="parentDoctype"
/>
</template>
<script setup>
@ -236,7 +236,7 @@ const props = defineProps({
const { getGridSettings, getFields } = getMeta(props.doctype)
const rows = defineModel()
const showRowList = ref(new Array(rows.value.length).fill(false))
const showRowList = ref(new Array(rows.value?.length || []).fill(false))
const selectedRows = reactive(new Set())
const showGridFieldsEditorModal = ref(false)
@ -251,7 +251,9 @@ const fields = computed(() => {
)
return d
}
return gridFields?.map((f) => getFieldObj(f)) || []
return (
gridFields?.filter((f) => f.in_list_view).map((f) => getFieldObj(f)) || []
)
})
function getFieldObj(field) {
@ -275,7 +277,7 @@ const gridTemplateColumns = computed(() => {
})
const allRowsSelected = computed(() => {
if (!rows.value.length) return false
if (!rows.value?.length) return false
return rows.value.length === selectedRows.size
})
@ -283,7 +285,7 @@ const showDeleteBtn = computed(() => selectedRows.size > 0)
const toggleSelectAllRows = (iSelected) => {
if (iSelected) {
rows.value.forEach((row) => selectedRows.add(row.name))
rows.value?.forEach((row) => selectedRows.add(row.name))
} else {
selectedRows.clear()
}

10
frontend/src/components/Controls/GridFieldsEditorModal.vue
View File

@ -21,7 +21,6 @@
<Draggable
v-if="oldFields?.length"
:list="fields"
@end="reorder"
group="fields"
item-key="fieldname"
class="flex flex-col gap-1"
@ -176,7 +175,14 @@ function update() {
saveUserSettings(props.parentDoctype, 'GridView', updateFields, () => {
loading.value = false
show.value = false
userSettings[props.parentDoctype]['GridView'][props.doctype] = updateFields
if (userSettings[props.parentDoctype]?.['GridView']) {
userSettings[props.parentDoctype]['GridView'][props.doctype] =
updateFields
} else {
userSettings[props.parentDoctype] = {
GridView: { [props.doctype]: updateFields },
}
}
})
}

82
frontend/src/components/Modals/ContactModal.vue
View File

@ -1,11 +1,11 @@
<template>
<Dialog v-model="show" :options="dialogOptions">
<Dialog v-model="show" :options="{ size: 'xl' }">
<template #body>
<div class="bg-surface-modal px-4 pb-6 pt-5 sm:px-6">
<div class="mb-5 flex items-center justify-between">
<div>
<h3 class="text-2xl font-semibold leading-6 text-ink-gray-9">
{{ __(dialogOptions.title) || __('Untitled') }}
{{ __('New Contact') }}
</h3>
</div>
<div class="flex items-center gap-1">
@ -34,25 +34,19 @@
<div class="space-y-2">
<Button
class="w-full"
v-for="action in dialogOptions.actions"
:key="action.label"
v-bind="action"
:label="__(action.label)"
variant="solid"
:label="__('Create')"
:loading="loading"
@click="createContact"
/>
</div>
</div>
</template>
</Dialog>
<AddressModal v-model="showAddressModal" v-model:address="_address" />
<QuickEntryModal
v-if="showQuickEntryModal"
v-model="showQuickEntryModal"
doctype="Contact"
/>
</template>
<script setup>
import QuickEntryModal from '@/components/Modals/QuickEntryModal.vue'
import FieldLayout from '@/components/FieldLayout.vue'
import AddressModal from '@/components/Modals/AddressModal.vue'
import EditIcon from '@/components/Icons/EditIcon.vue'
@ -81,35 +75,14 @@ const { isManager } = usersStore()
const router = useRouter()
const show = defineModel()
const editMode = ref(false)
const loading = ref(false)
let _contact = ref({})
let _address = ref({})
const showAddressModal = ref(false)
async function updateContact() {
if (!dirty.value) {
show.value = false
return
}
const values = { ..._contact.value }
let name = await callSetValue(values)
handleContactUpdate({ name })
}
async function callSetValue(values) {
const d = await call('frappe.client.set_value', {
doctype: 'Contact',
name: props.contact.data.name,
fieldname: values,
})
return d.name
}
async function callInsertDoc() {
async function createContact() {
if (_contact.value.email_id) {
_contact.value.email_ids = [{ email_id: _contact.value.email_id }]
delete _contact.value.email_id
@ -144,27 +117,22 @@ function handleContactUpdate(doc) {
props.options.afterInsert && props.options.afterInsert(doc)
}
const dialogOptions = computed(() => {
let title = !editMode.value ? 'New Contact' : _contact.value.full_name
let size = 'xl'
let actions = [
{
label: editMode.value ? 'Save' : 'Create',
variant: 'solid',
disabled: !dirty.value,
onClick: () => (editMode.value ? updateContact() : callInsertDoc()),
},
]
return { title, size, actions }
})
const tabs = createResource({
url: 'crm.fcrm.doctype.crm_fields_layout.crm_fields_layout.get_fields_layout',
cache: ['QuickEntry', 'Contact'],
params: { doctype: 'Contact', type: 'Quick Entry' },
auto: true,
transform: (_tabs) => {
return _tabs.forEach((tab) => {
tab.sections.forEach((section) => {
section.fields.forEach((field) => {
if (field.type === 'Table') {
_contact.value[field.name] = []
}
})
})
})
},
})
const filteredSections = computed(() => {
@ -194,25 +162,17 @@ const filteredSections = computed(() => {
return [{ no_tabs: true, sections: allSections }]
})
const dirty = computed(() => {
return JSON.stringify(props.contact.data) !== JSON.stringify(_contact.value)
})
watch(
() => show.value,
(value) => {
if (!value) return
editMode.value = false
nextTick(() => {
_contact.value = { ...props.contact.data }
if (_contact.value.name) {
editMode.value = true
}
})
},
)
const showQuickEntryModal = ref(false)
const showQuickEntryModal = defineModel('showQuickEntryModal')
function openQuickEntryModal() {
showQuickEntryModal.value = true

4
frontend/src/components/Modals/DealModal.vue
View File

@ -117,6 +117,10 @@ const tabs = createResource({
} else if (field.name == 'deal_owner') {
field.type = 'User'
}
if (field.type === 'Table') {
deal[field.name] = []
}
})
})
})

4
frontend/src/components/Modals/LeadModal.vue
View File

@ -79,6 +79,10 @@ const tabs = createResource({
} else if (field.name == 'lead_owner') {
field.type = 'User'
}
if (field.type === 'Table') {
lead[field.name] = []
}
})
})
})

108
frontend/src/components/Modals/OrganizationModal.vue
View File

@ -1,11 +1,11 @@
<template>
<Dialog v-model="show" :options="dialogOptions">
<Dialog v-model="show" :options="{ size: 'xl' }">
<template #body>
<div class="bg-surface-modal px-4 pb-6 pt-5 sm:px-6">
<div class="mb-5 flex items-center justify-between">
<div>
<h3 class="text-2xl font-semibold leading-6 text-ink-gray-9">
{{ __(dialogOptions.title) || __('Untitled') }}
{{ __('New Organization') }}
</h3>
</div>
<div class="flex items-center gap-1">
@ -34,26 +34,19 @@
<div class="space-y-2">
<Button
class="w-full"
v-for="action in dialogOptions.actions"
:key="action.label"
v-bind="action"
:label="__(action.label)"
variant="solid"
:label="__('Create')"
:loading="loading"
@click="createOrganization"
/>
</div>
</div>
</template>
</Dialog>
<AddressModal v-model="showAddressModal" v-model:address="_address" />
<QuickEntryModal
v-if="showQuickEntryModal"
v-model="showQuickEntryModal"
doctype="CRM Organization"
/>
</template>
<script setup>
import QuickEntryModal from '@/components/Modals/QuickEntryModal.vue'
import FieldLayout from '@/components/FieldLayout.vue'
import AddressModal from '@/components/Modals/AddressModal.vue'
import EditIcon from '@/components/Icons/EditIcon.vue'
@ -81,8 +74,9 @@ const organization = defineModel('organization')
const loading = ref(false)
const title = ref(null)
const editMode = ref(false)
let _address = ref({})
let _organization = ref({
organization_name: '',
website: '',
@ -95,54 +89,7 @@ const showAddressModal = ref(false)
let doc = ref({})
async function updateOrganization() {
const old = { ...doc.value }
const newOrg = { ..._organization.value }
const nameChanged = old.organization_name !== newOrg.organization_name
delete old.organization_name
delete newOrg.organization_name
const otherFieldChanged = JSON.stringify(old) !== JSON.stringify(newOrg)
const values = newOrg
if (!nameChanged && !otherFieldChanged) {
show.value = false
return
}
let name
loading.value = true
if (nameChanged) {
name = await callRenameDoc()
}
if (otherFieldChanged) {
name = await callSetValue(values)
}
handleOrganizationUpdate({ name }, nameChanged)
}
async function callRenameDoc() {
const d = await call('frappe.client.rename_doc', {
doctype: 'CRM Organization',
old_name: doc.value?.organization_name,
new_name: _organization.value.organization_name,
})
loading.value = false
return d
}
async function callSetValue(values) {
const d = await call('frappe.client.set_value', {
doctype: 'CRM Organization',
name: _organization.value.name,
fieldname: values,
})
loading.value = false
return d.name
}
async function callInsertDoc() {
async function createOrganization() {
const doc = await call('frappe.client.insert', {
doc: {
doctype: 'CRM Organization',
@ -156,40 +103,35 @@ async function callInsertDoc() {
}
}
function handleOrganizationUpdate(doc, renamed = false) {
if (doc.name && (props.options.redirect || renamed)) {
function handleOrganizationUpdate(doc) {
if (doc.name && props.options.redirect) {
router.push({
name: 'Organization',
params: { organizationId: doc.name },
})
} else {
organization.value.reload?.()
organization.value?.reload?.()
}
show.value = false
props.options.afterInsert && props.options.afterInsert(doc)
}
const dialogOptions = computed(() => {
let title = !editMode.value
? __('New Organization')
: __(_organization.value.organization_name)
let size = 'xl'
let actions = [
{
label: editMode.value ? __('Save') : __('Create'),
variant: 'solid',
onClick: () => (editMode.value ? updateOrganization() : callInsertDoc()),
},
]
return { title, size, actions }
})
const tabs = createResource({
url: 'crm.fcrm.doctype.crm_fields_layout.crm_fields_layout.get_fields_layout',
cache: ['QuickEntry', 'CRM Organization'],
params: { doctype: 'CRM Organization', type: 'Quick Entry' },
auto: true,
transform: (_tabs) => {
return _tabs.forEach((tab) => {
tab.sections.forEach((section) => {
section.fields.forEach((field) => {
if (field.type === 'Table') {
_organization.value[field.name] = []
}
})
})
})
},
})
const filteredSections = computed(() => {
@ -223,20 +165,16 @@ watch(
() => show.value,
(value) => {
if (!value) return
editMode.value = false
nextTick(() => {
// TODO: Issue with FormControl
// title.value.el.focus()
doc.value = organization.value?.doc || organization.value || {}
_organization.value = { ...doc.value }
if (_organization.value.name) {
editMode.value = true
}
})
},
)
const showQuickEntryModal = ref(false)
const showQuickEntryModal = defineModel('showQuickEntryModal')
function openQuickEntryModal() {
showQuickEntryModal.value = true

76
frontend/src/components/Section.vue
View File

@ -1,42 +1,44 @@
<template>
<slot name="header" v-bind="{ opened, hide, open, close, toggle }">
<div v-if="!hide" class="flex items-center justify-between">
<div
class="flex text-ink-gray-9 max-w-fit cursor-pointer items-center gap-2 text-base"
v-bind="$attrs"
@click="collapsible && toggle()"
>
<FeatherIcon
v-if="collapsible && collapseIconPosition === 'left'"
name="chevron-right"
class="h-4 transition-all duration-300 ease-in-out"
:class="{ 'rotate-90': opened }"
/>
<span>
{{ __(label) || __('Untitled') }}
</span>
<FeatherIcon
v-if="collapsible && collapseIconPosition === 'right'"
name="chevron-right"
class="h-4 transition-all duration-300 ease-in-out"
:class="{ 'rotate-90': opened }"
/>
<div>
<slot name="header" v-bind="{ opened, hide, open, close, toggle }">
<div v-if="!hide" class="flex items-center justify-between">
<div
class="flex text-ink-gray-9 max-w-fit cursor-pointer items-center gap-2 text-base"
v-bind="$attrs"
@click="collapsible && toggle()"
>
<FeatherIcon
v-if="collapsible && collapseIconPosition === 'left'"
name="chevron-right"
class="h-4 transition-all duration-300 ease-in-out"
:class="{ 'rotate-90': opened }"
/>
<span>
{{ __(label) || __('Untitled') }}
</span>
<FeatherIcon
v-if="collapsible && collapseIconPosition === 'right'"
name="chevron-right"
class="h-4 transition-all duration-300 ease-in-out"
:class="{ 'rotate-90': opened }"
/>
</div>
<slot name="actions"></slot>
</div>
<slot name="actions"></slot>
</div>
</slot>
<transition
enter-active-class="duration-300 ease-in"
leave-active-class="duration-300 ease-[cubic-bezier(0, 1, 0.5, 1)]"
enter-to-class="max-h-[200px] overflow-hidden"
leave-from-class="max-h-[200px] overflow-hidden"
enter-from-class="max-h-0 overflow-hidden"
leave-to-class="max-h-0 overflow-hidden"
>
<div v-show="opened">
<slot v-bind="{ opened, open, close, toggle }" />
</div>
</transition>
</slot>
<transition
enter-active-class="duration-300 ease-in"
leave-active-class="duration-300 ease-[cubic-bezier(0, 1, 0.5, 1)]"
enter-to-class="max-h-[200px] overflow-hidden"
leave-from-class="max-h-[200px] overflow-hidden"
enter-from-class="max-h-0 overflow-hidden"
leave-to-class="max-h-0 overflow-hidden"
>
<div v-show="opened">
<slot v-bind="{ opened, open, close, toggle }" />
</div>
</transition>
</div>
</template>
<script setup>
import { ref } from 'vue'

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

@ -59,7 +59,17 @@
</Button>
</div>
</div>
<ContactModal v-model="showContactModal" :contact="{}" />
<ContactModal
v-if="showContactModal"
v-model="showContactModal"
v-model:showQuickEntryModal="showQuickEntryModal"
:contact="{}"
/>
<QuickEntryModal
v-if="showQuickEntryModal"
v-model="showQuickEntryModal"
doctype="Contact"
/>
</template>
<script setup>
@ -68,6 +78,7 @@ 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 ContactsListView from '@/components/ListViews/ContactsListView.vue'
import ViewControls from '@/components/ViewControls.vue'
import { getMeta } from '@/stores/meta'
@ -75,10 +86,12 @@ import { organizationsStore } from '@/stores/organizations.js'
import { formatDate, timeAgo } from '@/utils'
import { ref, computed } from 'vue'
const { getFormattedPercent, getFormattedFloat, getFormattedCurrency } = getMeta('Contact')
const { getFormattedPercent, getFormattedFloat, getFormattedCurrency } =
getMeta('Contact')
const { getOrganization } = organizationsStore()
const showContactModal = ref(false)
const showQuickEntryModal = ref(false)
const contactsListView = ref(null)

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

@ -59,7 +59,16 @@
</Button>
</div>
</div>
<OrganizationModal v-model="showOrganizationModal" />
<OrganizationModal
v-if="showOrganizationModal"
v-model="showOrganizationModal"
v-model:showQuickEntryModal="showQuickEntryModal"
/>
<QuickEntryModal
v-if="showQuickEntryModal"
v-model="showQuickEntryModal"
doctype="CRM Organization"
/>
</template>
<script setup>
import ViewBreadcrumbs from '@/components/ViewBreadcrumbs.vue'
@ -67,6 +76,7 @@ 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 OrganizationsListView from '@/components/ListViews/OrganizationsListView.vue'
import ViewControls from '@/components/ViewControls.vue'
import { getMeta } from '@/stores/meta'
@ -78,6 +88,7 @@ const { getFormattedPercent, getFormattedFloat, getFormattedCurrency } =
const organizationsListView = ref(null)
const showOrganizationModal = ref(false)
const showQuickEntryModal = ref(false)
// organizations data is loaded in the ViewControls component
const organizations = ref({})

6
frontend/src/stores/meta.js
View File

@ -80,7 +80,11 @@ export function getMeta(doctype) {
let oldUserSettings = userSettings[parentDoctype]
let newUserSettings = JSON.parse(JSON.stringify(oldUserSettings))
newUserSettings[key][doctype] = value
if (newUserSettings[key] === undefined) {
newUserSettings[key] = { [doctype]: value }
} else {
newUserSettings[key][doctype] = value
}
if (JSON.stringify(oldUserSettings) !== JSON.stringify(newUserSettings)) {
return createResource({