fix: check label instead of no_tabs flag
This commit is contained in:
parent
7d81f531d3
commit
45c759cc4e
@ -29,7 +29,7 @@ def get_fields_layout(doctype: str, type: str):
|
|||||||
has_tabs = tabs[0].get("sections") if tabs and tabs[0] else False
|
has_tabs = tabs[0].get("sections") if tabs and tabs[0] else False
|
||||||
|
|
||||||
if not has_tabs:
|
if not has_tabs:
|
||||||
tabs = [{"no_tabs": True, "sections": tabs}]
|
tabs = [{"sections": tabs}]
|
||||||
|
|
||||||
allowed_fields = []
|
allowed_fields = []
|
||||||
for tab in tabs:
|
for tab in tabs:
|
||||||
@ -92,7 +92,7 @@ def get_default_layout(doctype: str):
|
|||||||
if field.fieldtype not in ["Tab Break", "Section Break", "Column Break"]
|
if field.fieldtype not in ["Tab Break", "Section Break", "Column Break"]
|
||||||
]
|
]
|
||||||
|
|
||||||
return [{"no_tabs": True, "sections": [{"hideLabel": True, "fields": fields}]}]
|
return [{"sections": [{"fields": fields}]}]
|
||||||
|
|
||||||
|
|
||||||
def getOptions(field):
|
def getOptions(field):
|
||||||
|
|||||||
@ -30,6 +30,8 @@ def get_new_layout(old_layout, type):
|
|||||||
|
|
||||||
for tab in old_layout:
|
for tab in old_layout:
|
||||||
new_tab = tab.copy()
|
new_tab = tab.copy()
|
||||||
|
if "no_tabs" in new_tab:
|
||||||
|
new_tab.pop("no_tabs")
|
||||||
new_tab["sections"] = []
|
new_tab["sections"] = []
|
||||||
for section in tab.get("sections"):
|
for section in tab.get("sections"):
|
||||||
if "contacts" in section:
|
if "contacts" in section:
|
||||||
@ -55,7 +57,7 @@ def get_new_layout(old_layout, type):
|
|||||||
continue
|
continue
|
||||||
|
|
||||||
if len(fields) == 1 and column_count > 1:
|
if len(fields) == 1 and column_count > 1:
|
||||||
new_section["columns"].append({"fields": fields[0]})
|
new_section["columns"].append({"fields": [fields[0]]})
|
||||||
new_section["columns"].append({"fields": []})
|
new_section["columns"].append({"fields": []})
|
||||||
new_tab["sections"].append(new_section)
|
new_tab["sections"].append(new_section)
|
||||||
continue
|
continue
|
||||||
@ -73,5 +75,9 @@ def get_new_layout(old_layout, type):
|
|||||||
new_layout = new_layout[0].get("sections")
|
new_layout = new_layout[0].get("sections")
|
||||||
|
|
||||||
if already_converted:
|
if already_converted:
|
||||||
return json.dumps(old_layout)
|
new_layout = old_layout
|
||||||
|
|
||||||
|
if type == "Side Panel" and "sections" in old_layout[0]:
|
||||||
|
new_layout = new_layout[0].get("sections")
|
||||||
|
|
||||||
return json.dumps(new_layout)
|
return json.dumps(new_layout)
|
||||||
|
|||||||
@ -284,7 +284,11 @@ const { getFormattedPercent, getFormattedFloat, getFormattedCurrency } =
|
|||||||
getMeta(props.doctype)
|
getMeta(props.doctype)
|
||||||
const { getUser } = usersStore()
|
const { getUser } = usersStore()
|
||||||
|
|
||||||
const hasTabs = computed(() => !props.tabs[0].no_tabs)
|
const hasTabs = computed(() => {
|
||||||
|
return (
|
||||||
|
props.tabs.length > 1 || (props.tabs.length == 1 && props.tabs[0].label)
|
||||||
|
)
|
||||||
|
})
|
||||||
|
|
||||||
const _tabs = computed(() => {
|
const _tabs = computed(() => {
|
||||||
return props.tabs.map((tab) => {
|
return props.tabs.map((tab) => {
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
class="flex items-center gap-2 text-base bg-surface-gray-2 rounded py-2 px-2.5"
|
class="flex items-center gap-2 text-base bg-surface-gray-2 rounded py-2 px-2.5"
|
||||||
>
|
>
|
||||||
<Draggable
|
<Draggable
|
||||||
v-if="tabs.length && !tabs[tabIndex].no_tabs"
|
v-if="tabs.length && tabs[tabIndex].label"
|
||||||
:list="tabs"
|
:list="tabs"
|
||||||
item-key="label"
|
item-key="label"
|
||||||
class="flex items-center gap-2"
|
class="flex items-center gap-2"
|
||||||
@ -41,7 +41,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Dropdown
|
<Dropdown
|
||||||
v-if="!tab.no_tabs && tabIndex == i"
|
v-if="tab.label && tabIndex == i"
|
||||||
:options="getTabOptions(tab)"
|
:options="getTabOptions(tab)"
|
||||||
class="!h-4"
|
class="!h-4"
|
||||||
@click.stop
|
@click.stop
|
||||||
@ -114,62 +114,69 @@
|
|||||||
</template>
|
</template>
|
||||||
</Dropdown>
|
</Dropdown>
|
||||||
</div>
|
</div>
|
||||||
<Draggable
|
<div class="flex gap-1.5">
|
||||||
:list="section.fields"
|
<div
|
||||||
group="fields"
|
class="w-full p-2 border border-dashed border-outline-gray-2 rounded bg-surface-white"
|
||||||
item-key="label"
|
v-for="(column, index) in section.columns"
|
||||||
class="grid gap-1.5"
|
:key="index"
|
||||||
:class="gridClass(section.columns)"
|
>
|
||||||
handle=".cursor-grab"
|
<Draggable
|
||||||
>
|
:list="column.fields"
|
||||||
<template #item="{ element: field }">
|
group="fields"
|
||||||
<div
|
item-key="label"
|
||||||
class="px-2.5 py-2 border border-outline-gray-2 rounded text-base bg-surface-modal text-ink-gray-8 flex items-center leading-4 justify-between gap-2"
|
class="flex flex-col gap-1.5"
|
||||||
|
handle=".cursor-grab"
|
||||||
>
|
>
|
||||||
<div class="flex items-center gap-2 truncate">
|
<template #item="{ element: field }">
|
||||||
<DragVerticalIcon class="h-3.5 cursor-grab" />
|
<div
|
||||||
<div class="truncate">{{ field.label }}</div>
|
class="px-2.5 py-2 border border-outline-gray-2 rounded text-base bg-surface-modal text-ink-gray-8 flex items-center leading-4 justify-between gap-2"
|
||||||
</div>
|
>
|
||||||
<Button
|
<div class="flex items-center gap-2 truncate">
|
||||||
variant="ghost"
|
<DragVerticalIcon class="h-3.5 cursor-grab" />
|
||||||
class="!size-4 rounded-sm"
|
<div class="truncate">{{ field.label }}</div>
|
||||||
icon="x"
|
</div>
|
||||||
@click="
|
<Button
|
||||||
section.fields.splice(section.fields.indexOf(field), 1)
|
variant="ghost"
|
||||||
"
|
class="!size-4 rounded-sm"
|
||||||
/>
|
icon="x"
|
||||||
</div>
|
@click="
|
||||||
</template>
|
column.fields.splice(column.fields.indexOf(field), 1)
|
||||||
</Draggable>
|
"
|
||||||
<Autocomplete
|
/>
|
||||||
v-if="fields.data"
|
</div>
|
||||||
value=""
|
</template>
|
||||||
:options="fields.data"
|
</Draggable>
|
||||||
@change="(e) => addField(section, e)"
|
<Autocomplete
|
||||||
>
|
v-if="fields.data"
|
||||||
<template #target="{ togglePopover }">
|
value=""
|
||||||
<div class="gap-2 w-full">
|
:options="fields.data"
|
||||||
<Button
|
@change="(e) => addField(column, e)"
|
||||||
class="w-full !h-8 !bg-surface-modal"
|
>
|
||||||
variant="outline"
|
<template #target="{ togglePopover }">
|
||||||
@click="togglePopover()"
|
<div class="gap-2 w-full">
|
||||||
:label="__('Add Field')"
|
<Button
|
||||||
>
|
class="w-full !h-8 !bg-surface-modal"
|
||||||
<template #prefix>
|
variant="outline"
|
||||||
<FeatherIcon name="plus" class="h-4" />
|
@click="togglePopover()"
|
||||||
</template>
|
:label="__('Add Field')"
|
||||||
</Button>
|
>
|
||||||
</div>
|
<template #prefix>
|
||||||
</template>
|
<FeatherIcon name="plus" class="h-4" />
|
||||||
<template #item-label="{ option }">
|
</template>
|
||||||
<div class="flex flex-col gap-1 text-ink-gray-9">
|
</Button>
|
||||||
<div>{{ option.label }}</div>
|
</div>
|
||||||
<div class="text-ink-gray-4 text-sm">
|
</template>
|
||||||
{{ `${option.fieldname} - ${option.fieldtype}` }}
|
<template #item-label="{ option }">
|
||||||
</div>
|
<div class="flex flex-col gap-1 text-ink-gray-9">
|
||||||
</div>
|
<div>{{ option.label }}</div>
|
||||||
</template>
|
<div class="text-ink-gray-4 text-sm">
|
||||||
</Autocomplete>
|
{{ `${option.fieldname} - ${option.fieldtype}` }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</Autocomplete>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</Draggable>
|
</Draggable>
|
||||||
@ -208,7 +215,7 @@ const props = defineProps({
|
|||||||
|
|
||||||
const tabIndex = ref(0)
|
const tabIndex = ref(0)
|
||||||
const slotName = computed(() => {
|
const slotName = computed(() => {
|
||||||
if (props.tabs.length == 1 && props.tabs[0].no_tabs) {
|
if (props.tabs.length == 1 && !props.tabs[0].label) {
|
||||||
return 'prefix'
|
return 'prefix'
|
||||||
}
|
}
|
||||||
return 'default'
|
return 'default'
|
||||||
@ -252,7 +259,9 @@ const fields = createResource({
|
|||||||
|
|
||||||
for (let tab of props.tabs) {
|
for (let tab of props.tabs) {
|
||||||
for (let section of tab.sections) {
|
for (let section of tab.sections) {
|
||||||
existingFields = existingFields.concat(section.fields)
|
for (let column of section.columns) {
|
||||||
|
existingFields = existingFields.concat(column.fields)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -266,22 +275,23 @@ const fields = createResource({
|
|||||||
})
|
})
|
||||||
|
|
||||||
function addTab() {
|
function addTab() {
|
||||||
if (props.tabs.length == 1 && props.tabs[0].no_tabs) {
|
if (props.tabs.length == 1 && !props.tabs[0].label) {
|
||||||
delete props.tabs[0].no_tabs
|
props.tabs[0].label = __('New Tab')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
props.tabs.push({ label: __('New Tab'), sections: [] })
|
props.tabs.push({ label: __('New Tab'), sections: [] })
|
||||||
tabIndex.value = props.tabs.length ? props.tabs.length - 1 : 0
|
tabIndex.value = props.tabs.length ? props.tabs.length - 1 : 0
|
||||||
}
|
}
|
||||||
|
|
||||||
function addField(section, field) {
|
function addField(column, field) {
|
||||||
if (!field) return
|
if (!field) return
|
||||||
let newFieldObj = {
|
let newFieldObj = {
|
||||||
...field,
|
...field,
|
||||||
name: field.fieldname,
|
name: field.fieldname,
|
||||||
type: field.fieldtype,
|
type: field.fieldtype,
|
||||||
}
|
}
|
||||||
section.fields.push(newFieldObj)
|
column.fields.push(newFieldObj)
|
||||||
}
|
}
|
||||||
|
|
||||||
function getTabOptions(tab) {
|
function getTabOptions(tab) {
|
||||||
@ -296,7 +306,7 @@ function getTabOptions(tab) {
|
|||||||
icon: 'trash-2',
|
icon: 'trash-2',
|
||||||
onClick: () => {
|
onClick: () => {
|
||||||
if (props.tabs.length == 1) {
|
if (props.tabs.length == 1) {
|
||||||
props.tabs[0].no_tabs = true
|
props.tabs[0].label = ''
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
props.tabs.splice(tabIndex.value, 1)
|
props.tabs.splice(tabIndex.value, 1)
|
||||||
|
|||||||
@ -161,7 +161,7 @@ const filteredSections = computed(() => {
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
return [{ no_tabs: true, sections: allSections }]
|
return [{ sections: allSections }]
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
|
|||||||
@ -168,7 +168,7 @@ const filteredSections = computed(() => {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
return [{ no_tabs: true, sections: _filteredSections }]
|
return [{ sections: _filteredSections }]
|
||||||
})
|
})
|
||||||
|
|
||||||
const dealStatuses = computed(() => {
|
const dealStatuses = computed(() => {
|
||||||
|
|||||||
@ -160,7 +160,7 @@ const filteredSections = computed(() => {
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
return [{ no_tabs: true, sections: allSections }]
|
return [{ sections: allSections }]
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
|
|||||||
@ -106,12 +106,9 @@ const tabs = computed(() => {
|
|||||||
if (fieldsData[0].type != 'Tab Break') {
|
if (fieldsData[0].type != 'Tab Break') {
|
||||||
let _sections = []
|
let _sections = []
|
||||||
if (fieldsData[0].type != 'Section Break') {
|
if (fieldsData[0].type != 'Section Break') {
|
||||||
_sections.push({ no_tabs: true, columns: [{ fields: [] }] })
|
_sections.push({ columns: [{ fields: [] }] })
|
||||||
}
|
}
|
||||||
_tabs.push({
|
_tabs.push({ sections: _sections })
|
||||||
no_tabs: true,
|
|
||||||
sections: _sections,
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
fieldsData.forEach((field) => {
|
fieldsData.forEach((field) => {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user