修改选项卡显示

v1.1.0
于肖磊 2024-12-16 18:10:38 +08:00
parent 95946d11c1
commit a65a063bc0
3 changed files with 25 additions and 28 deletions

View File

@ -31,7 +31,7 @@
<card-container> <card-container>
<div class="mb-12">选项卡设置</div> <div class="mb-12">选项卡设置</div>
<div class="nav-list"> <div class="nav-list">
<drag :data="tabs_list" type="card" icon-position="top" :space-col="20" @click="tabs_list_click" @remove="tabs_list_remove" @on-sort="tabs_list_sort"> <drag :data="form.tabs_list" type="card" icon-position="top" :space-col="20" @click="tabs_list_click" @remove="tabs_list_remove" @on-sort="tabs_list_sort">
<template #default="{ row, index }"> <template #default="{ row, index }">
<div class="flex-col w"> <div class="flex-col w">
<el-form-item label="数据类型" class="w mb-10"> <el-form-item label="数据类型" class="w mb-10">
@ -157,15 +157,13 @@ onMounted(() => {
emits('theme_change', list[0].width, list[0].height); emits('theme_change', list[0].width, list[0].height);
} }
} }
}); if (form.tabs_list.length > 1) {
form.tabs_list.forEach((item: any) => {
const tabs_list = computed(() => { item.tabs_img = !isEmpty(item.tabs_img) ? item.tabs_img : [];
return form.tabs_list.map((item: any) => ({ item.tabs_icon = !isEmpty(item.tabs_icon) ? item.tabs_icon : '';
...item, item.tabs_type = !isEmpty(item.tabs_type) ? item.tabs_type : '0';
tabs_img: isEmpty(item.tabs_img) ? [] : item.tabs_img, });
tabs_icon: isEmpty(item.tabs_icon) ? '' : item.tabs_icon, }
tabs_type: isEmpty(item.data_type) ? '0' : item.data_type,
}));
}); });
// tabs_theme_list // tabs_theme_list

View File

@ -34,7 +34,7 @@
<card-container> <card-container>
<div class="mb-12">选项卡设置</div> <div class="mb-12">选项卡设置</div>
<div class="nav-list"> <div class="nav-list">
<drag :data="tabs_list" type="card" icon-position="top" :space-col="20" @click="tabs_list_click" @remove="tabs_list_remove" @on-sort="tabs_list_sort"> <drag :data="form.tabs_list" type="card" icon-position="top" :space-col="20" @click="tabs_list_click" @remove="tabs_list_remove" @on-sort="tabs_list_sort">
<template #default="{ row, index }"> <template #default="{ row, index }">
<div class="flex-col w"> <div class="flex-col w">
<el-form-item label="数据类型" class="w mb-10"> <el-form-item label="数据类型" class="w mb-10">
@ -144,15 +144,13 @@ onBeforeMount(() => {
emits('theme_change', list[0].width, list[0].height); emits('theme_change', list[0].width, list[0].height);
} }
} }
}); if (form.value.tabs_list.length > 1) {
form.value.tabs_list.forEach((item: any) => {
const tabs_list = computed(() => { item.tabs_img = !isEmpty(item.tabs_img) ? item.tabs_img : [];
return form.value.tabs_list.map((item: any) => ({ item.tabs_icon = !isEmpty(item.tabs_icon) ? item.tabs_icon : '';
...item, item.tabs_type = !isEmpty(item.tabs_type) ? item.tabs_type : '0';
tabs_img: isEmpty(item.tabs_img) ? [] : item.tabs_img, });
tabs_icon: isEmpty(item.tabs_icon) ? '' : item.tabs_icon, }
tabs_type: isEmpty(item.data_type) ? '0' : item.data_type,
}));
}); });
const tabs_list_click = (item: any, index: number) => { const tabs_list_click = (item: any, index: number) => {

View File

@ -38,7 +38,7 @@
</div> </div>
</el-form-item> </el-form-item>
</div> </div>
<drag :data="tabs_list" type="card" :space-col="25" @remove="remove" @on-sort="on_sort"> <drag :data="form.tabs_list" type="card" :space-col="25" @remove="remove" @on-sort="on_sort">
<template #default="scoped"> <template #default="scoped">
<div class="flex-col align-c jc-s gap-20 flex-1 w"> <div class="flex-col align-c jc-s gap-20 flex-1 w">
<el-form-item label="数据类型" class="w mb-0"> <el-form-item label="数据类型" class="w mb-0">
@ -101,13 +101,14 @@ const state = reactive({
}); });
const { form, styles } = toRefs(state); const { form, styles } = toRefs(state);
const tabs_list = computed(() => { onBeforeMount(() => {
return form.value.tabs_list.map((item: any) => ({ if (form.value.tabs_list.length > 1) {
...item, form.value.tabs_list.forEach((item: any) => {
tabs_img: isEmpty(item.tabs_img) ? [] : item.tabs_img, item.tabs_img = !isEmpty(item.tabs_img) ? item.tabs_img : [];
tabs_icon: isEmpty(item.tabs_icon) ? '' : item.tabs_icon, item.tabs_icon = !isEmpty(item.tabs_icon) ? item.tabs_icon : '';
tabs_type: isEmpty(item.data_type) ? '0' : item.data_type, item.tabs_type = !isEmpty(item.tabs_type) ? item.tabs_type : '0';
})); });
}
}); });
const add = () => { const add = () => {