Files
lucent-laravel/front/js/svelte/records/ContentTabs.svelte
T
2023-10-02 23:10:49 +03:00

55 lines
1.2 KiB
Svelte

<script>
export let recordGraph;
export let record;
export let schema;
export let isCreateMode;
export let active = "_default";
let tabs = schema.fields.filter((f) => f.ui === "tab");
let mainTab = {
label: "Main",
name: "_default",
};
let graphTab = {
label: "Graph",
name: "_graph",
};
if (isCreateMode) {
tabs = [mainTab, ...tabs];
} else {
tabs = [mainTab, ...tabs, graphTab];
}
function showGraph(e) {
e.preventDefault();
active = "_graph";
}
function changeTab(e, tabName) {
e.preventDefault();
if (tabName == "_graph") {
showGraph(e);
} else {
active = tabName;
}
}
</script>
{#if tabs.length > 1}
<ul class="nav nav-pills mb-4 justify-content-center">
{#each tabs as tab}
<li class="nav-item">
<button
on:click={(e) => changeTab(e, tab.name)}
class="nav-link"
class:active={active === tab.name}
aria-current="page"
>
{tab.label}
</button>
</li>
{/each}
</ul>
{/if}