fix: removed detailMode code from Organization modal
This commit is contained in:
Shariq Ansari
parent
35a299b4d8
commit
b6006ce22f
@ -34,7 +34,7 @@
|
||||
variant="ghost"
|
||||
class="w-full !justify-start"
|
||||
:label="__('Create New')"
|
||||
@click="attrs.onCreate(value, close)"
|
||||
@click="() => attrs.onCreate(value, close)"
|
||||
>
|
||||
<template #prefix>
|
||||
<FeatherIcon name="plus" class="h-4" />
|
||||
|
||||
@ -10,10 +10,10 @@
|
||||
</div>
|
||||
<div class="flex items-center gap-1">
|
||||
<Button
|
||||
v-if="isManager() || detailMode"
|
||||
v-if="isManager()"
|
||||
variant="ghost"
|
||||
class="w-7"
|
||||
@click="detailMode ? (detailMode = false) : openQuickEntryModal()"
|
||||
@click="openQuickEntryModal"
|
||||
>
|
||||
<EditIcon class="h-4 w-4" />
|
||||
</Button>
|
||||
@ -23,55 +23,42 @@
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div v-if="detailMode" class="flex flex-col gap-3.5">
|
||||
<div
|
||||
class="flex h-7 items-center gap-2 text-base text-ink-gray-8"
|
||||
v-for="field in fields"
|
||||
:key="field.name"
|
||||
>
|
||||
<div class="grid w-7 place-content-center">
|
||||
<component :is="field.icon" />
|
||||
</div>
|
||||
<div>{{ field.value }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<FieldLayout
|
||||
v-else-if="filteredSections.length"
|
||||
v-if="filteredSections.length"
|
||||
:tabs="filteredSections"
|
||||
:data="_organization"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!detailMode" class="px-4 pb-7 pt-4 sm:px-6">
|
||||
<div class="space-y-2">
|
||||
<Button
|
||||
class="w-full"
|
||||
v-for="action in dialogOptions.actions"
|
||||
:key="action.label"
|
||||
v-bind="action"
|
||||
:label="__(action.label)"
|
||||
:loading="loading"
|
||||
/>
|
||||
</div>
|
||||
<div class="px-4 pb-7 pt-4 sm:px-6">
|
||||
<Button
|
||||
class="w-full"
|
||||
v-for="action in dialogOptions.actions"
|
||||
:key="action.label"
|
||||
v-bind="action"
|
||||
:label="__(action.label)"
|
||||
:loading="loading"
|
||||
/>
|
||||
</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'
|
||||
import MoneyIcon from '@/components/Icons/MoneyIcon.vue'
|
||||
import WebsiteIcon from '@/components/Icons/WebsiteIcon.vue'
|
||||
import OrganizationsIcon from '@/components/Icons/OrganizationsIcon.vue'
|
||||
import TerritoryIcon from '@/components/Icons/TerritoryIcon.vue'
|
||||
import { usersStore } from '@/stores/users'
|
||||
import { formatNumberIntoCurrency } from '@/utils'
|
||||
import { capture } from '@/telemetry'
|
||||
import { call, FeatherIcon, createResource } from 'frappe-ui'
|
||||
import { ref, nextTick, watch, computed, h } from 'vue'
|
||||
import { ref, nextTick, watch, computed } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
|
||||
const props = defineProps({
|
||||
@ -79,7 +66,6 @@ const props = defineProps({
|
||||
type: Object,
|
||||
default: {
|
||||
redirect: true,
|
||||
detailMode: false,
|
||||
afterInsert: () => {},
|
||||
},
|
||||
},
|
||||
@ -93,7 +79,6 @@ const organization = defineModel('organization')
|
||||
|
||||
const loading = ref(false)
|
||||
const title = ref(null)
|
||||
const detailMode = ref(false)
|
||||
const editMode = ref(false)
|
||||
let _address = ref({})
|
||||
let _organization = ref({
|
||||
@ -186,59 +171,16 @@ const dialogOptions = computed(() => {
|
||||
let title = !editMode.value
|
||||
? __('New Organization')
|
||||
: __(_organization.value.organization_name)
|
||||
let size = detailMode.value ? '' : 'xl'
|
||||
let actions = detailMode.value
|
||||
? []
|
||||
: [
|
||||
{
|
||||
label: editMode.value ? __('Save') : __('Create'),
|
||||
variant: 'solid',
|
||||
onClick: () =>
|
||||
editMode.value ? updateOrganization() : callInsertDoc(),
|
||||
},
|
||||
]
|
||||
|
||||
return { title, size, actions }
|
||||
})
|
||||
|
||||
const fields = computed(() => {
|
||||
let details = [
|
||||
let size = 'xl'
|
||||
let actions = [
|
||||
{
|
||||
icon: OrganizationsIcon,
|
||||
name: 'organization_name',
|
||||
value: _organization.value.organization_name,
|
||||
},
|
||||
{
|
||||
icon: WebsiteIcon,
|
||||
name: 'website',
|
||||
value: _organization.value.website,
|
||||
},
|
||||
{
|
||||
icon: TerritoryIcon,
|
||||
name: 'territory',
|
||||
value: _organization.value.territory,
|
||||
},
|
||||
{
|
||||
icon: MoneyIcon,
|
||||
name: 'annual_revenue',
|
||||
value: formatNumberIntoCurrency(
|
||||
_organization.value.annual_revenue,
|
||||
_organization.value.currency,
|
||||
),
|
||||
},
|
||||
{
|
||||
icon: h(FeatherIcon, { name: 'hash', class: 'h-4 w-4' }),
|
||||
name: 'no_of_employees',
|
||||
value: _organization.value.no_of_employees,
|
||||
},
|
||||
{
|
||||
icon: h(FeatherIcon, { name: 'briefcase', class: 'h-4 w-4' }),
|
||||
name: 'industry',
|
||||
value: _organization.value.industry,
|
||||
label: editMode.value ? __('Save') : __('Create'),
|
||||
variant: 'solid',
|
||||
onClick: () => (editMode.value ? updateOrganization() : callInsertDoc()),
|
||||
},
|
||||
]
|
||||
|
||||
return details.filter((field) => field.value)
|
||||
return { title, size, actions }
|
||||
})
|
||||
|
||||
const tabs = createResource({
|
||||
@ -280,7 +222,6 @@ watch(
|
||||
(value) => {
|
||||
if (!value) return
|
||||
editMode.value = false
|
||||
detailMode.value = props.options.detailMode
|
||||
nextTick(() => {
|
||||
// TODO: Issue with FormControl
|
||||
// title.value.el.focus()
|
||||
@ -293,12 +234,10 @@ watch(
|
||||
},
|
||||
)
|
||||
|
||||
const showQuickEntryModal = defineModel('quickEntry')
|
||||
const showQuickEntryModal = ref(false)
|
||||
|
||||
function openQuickEntryModal() {
|
||||
showQuickEntryModal.value = true
|
||||
nextTick(() => {
|
||||
show.value = false
|
||||
})
|
||||
nextTick(() => (show.value = false))
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -59,15 +59,7 @@
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<OrganizationModal
|
||||
v-model="showOrganizationModal"
|
||||
v-model:quickEntry="showQuickEntryModal"
|
||||
/>
|
||||
<QuickEntryModal
|
||||
v-if="showQuickEntryModal"
|
||||
v-model="showQuickEntryModal"
|
||||
doctype="CRM Organization"
|
||||
/>
|
||||
<OrganizationModal v-model="showOrganizationModal" />
|
||||
</template>
|
||||
<script setup>
|
||||
import ViewBreadcrumbs from '@/components/ViewBreadcrumbs.vue'
|
||||
@ -75,7 +67,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 OrganizationsListView from '@/components/ListViews/OrganizationsListView.vue'
|
||||
import ViewControls from '@/components/ViewControls.vue'
|
||||
import { formatDate, timeAgo, website, formatNumberIntoCurrency } from '@/utils'
|
||||
@ -83,7 +74,6 @@ import { ref, computed } from 'vue'
|
||||
|
||||
const organizationsListView = ref(null)
|
||||
const showOrganizationModal = ref(false)
|
||||
const showQuickEntryModal = ref(false)
|
||||
|
||||
// organizations data is loaded in the ViewControls component
|
||||
const organizations = ref({})
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user