修改自定义组内容的处理逻辑显示

v1.2.0
于肖磊 2025-01-13 14:40:51 +08:00
parent 5853970519
commit 82317d6b3e
17 changed files with 130 additions and 41 deletions

View File

@ -3,7 +3,7 @@
<el-form-item label="是否显示"> <el-form-item label="是否显示">
<div class="flex-row gap-10"> <div class="flex-row gap-10">
<el-switch v-model="form.is_show" active-value="1" inactive-value="0" @change="operation_end"/> <el-switch v-model="form.is_show" active-value="1" inactive-value="0" @change="operation_end"/>
<el-tooltip effect="dark" :show-after="200" :hide-after="200" content="当数据只有一的时候不展示指示器" raw-content placement="top"> <el-tooltip effect="dark" :show-after="200" :hide-after="200" content="当数据只有一的时候不展示指示器" raw-content placement="top">
<icon name="miaosha-hdgz" size="12" color="#999"></icon> <icon name="miaosha-hdgz" size="12" color="#999"></icon>
</el-tooltip> </el-tooltip>
</div> </div>

View File

@ -2,7 +2,7 @@
<div class="w h re custom-other"> <div class="w h re custom-other">
<div v-for="(item, index) in list" :key="item.id" class="main-content flex-row" :style="{'left': percentage_count(item.location.x) , 'top': percentage_count(item.location.y), 'width': percentage_count(item.com_data.com_width), 'height': percentage_count(item.com_data.com_height), 'z-index': (customList.length - 1) - index}"> <div v-for="(item, index) in list" :key="item.id" class="main-content flex-row" :style="{'left': percentage_count(item.location.x) , 'top': percentage_count(item.location.y), 'width': percentage_count(item.com_data.com_width), 'height': percentage_count(item.com_data.com_height), 'z-index': (customList.length - 1) - index}">
<template v-if="item.key == 'text'"> <template v-if="item.key == 'text'">
<model-text :key="item.id" :value="item.com_data" :scale="scale" :source-list="sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId" :is-custom-group="isCustomGroup" :title-params="showData?.data_name || 'name'" :is-display-panel="true"></model-text> <model-text :key="item.id" :value="item.com_data" :scale="scale" :source-list="sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId" :is-custom-group="isCustomGroup" :title-params="showData?.data_name || 'name'" :is-display-panel="true"></model-text>
</template> </template>
<template v-else-if="item.key == 'img'"> <template v-else-if="item.key == 'img'">
<model-image :key="item.id" :value="item.com_data" :scale="scale" :source-list="sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId" :is-custom-group="isCustomGroup" :img-params="showData?.data_logo || ''" :is-display-panel="true"></model-image> <model-image :key="item.id" :value="item.com_data" :scale="scale" :source-list="sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId" :is-custom-group="isCustomGroup" :img-params="showData?.data_logo || ''" :is-display-panel="true"></model-image>
@ -17,7 +17,7 @@
<model-panel :key="item.id" :value="item.com_data" :scale="scale" :source-list="sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId" :is-custom-group="isCustomGroup" :is-display-panel="true"></model-panel> <model-panel :key="item.id" :value="item.com_data" :scale="scale" :source-list="sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId" :is-custom-group="isCustomGroup" :is-display-panel="true"></model-panel>
</template> </template>
<template v-else-if="item.key == 'custom-group'"> <template v-else-if="item.key == 'custom-group'">
<model-custom-group :key="item.id" :value="item.com_data" :scale="scale" :source-list="sourceList" :data-height="item.com_data.custom_height" :data-width="item.com_data.com_width" :is-custom="isCustom" :is-display-panel="true"></model-custom-group> <model-custom-group :key="item.id" :value="item.com_data" :scale="scale" :source-list="sourceList" :group-source-list="groupSourceList" :show-data="showData" :data-height="item.com_data.custom_height" :data-width="item.com_data.com_width" :is-custom="isCustom" :is-display-panel="true"></model-custom-group>
</template> </template>
</div> </div>
</div> </div>
@ -66,6 +66,12 @@ const props = defineProps({
type: Boolean, type: Boolean,
default: false default: false
}, },
groupSourceList: {
type: Array,
default: () => {
return [];
}
},
customGroupFieldId: { customGroupFieldId: {
type: String, type: String,
default: '' default: ''

View File

@ -8,7 +8,7 @@
<div v-for="(item1, index1) in data_source_content_list" :key="index1" :style="`width: ${ gap_width }`"> <div v-for="(item1, index1) in data_source_content_list" :key="index1" :style="`width: ${ gap_width }`">
<div :style="style_chunk_container"> <div :style="style_chunk_container">
<div class="w h oh" :style="style_chunk_img_container"> <div class="w h oh" :style="style_chunk_img_container">
<data-rendering :custom-list="form.custom_list" :source-list="item1" :data-height="dataHeight" :scale="custom_scale" :custom-group-field-id="form?.data_source_field?.id || ''"></data-rendering> <data-rendering :custom-list="form.custom_list" :source-list="item1" :data-height="dataHeight" :scale="custom_scale" :custom-group-field-id="form?.data_source_field?.id || ''" :is-custom-group="true" :is-custom="isCustom" :show-data="showData"></data-rendering>
</div> </div>
</div> </div>
</div> </div>
@ -19,7 +19,7 @@
<swiper-slide v-for="(item1, index1) in data_source_content_list" :key="index1"> <swiper-slide v-for="(item1, index1) in data_source_content_list" :key="index1">
<div :style="style_chunk_container"> <div :style="style_chunk_container">
<div class="w h oh" :style="style_chunk_img_container"> <div class="w h oh" :style="style_chunk_img_container">
<data-rendering :custom-list="form.custom_list" :source-list="item1" :data-height="dataHeight" :scale="custom_scale" :custom-group-field-id="form?.data_source_field?.id || ''"></data-rendering> <data-rendering :custom-list="form.custom_list" :source-list="item1" :data-height="dataHeight" :scale="custom_scale" :custom-group-field-id="form?.data_source_field?.id || ''" :is-custom-group="true" :is-custom="isCustom" :show-data="showData"></data-rendering>
</div> </div>
</div> </div>
</swiper-slide> </swiper-slide>
@ -38,7 +38,7 @@
<template v-else> <template v-else>
<div :style="style_chunk_container"> <div :style="style_chunk_container">
<div class="w h oh" :style="style_chunk_img_container"> <div class="w h oh" :style="style_chunk_img_container">
<data-rendering :custom-list="form.custom_list" :data-height="form.height" :scale="custom_scale"></data-rendering> <data-rendering :custom-list="form.custom_list" :data-height="form.height" :scale="custom_scale" :is-custom-group="true" :is-custom="isCustom"></data-rendering>
</div> </div>
</div> </div>
</template> </template>
@ -87,6 +87,23 @@ const props = defineProps({
isCustom: { isCustom: {
type: Boolean, type: Boolean,
default: false default: false
},
groupSourceList: {
type: Array,
default: () => {
return [];
}
},
showData: {
type: Object as PropType<{
data_key: string;
data_name: string;
data_logo?: string;
}>,
default: () => ({
data_key: 'id',
data_name: 'name',
})
} }
}); });
// //
@ -102,19 +119,24 @@ const is_show = computed(() => {
//#region //#region
const data_source_content_list = computed(() => { const data_source_content_list = computed(() => {
if (!isEmpty(props.sourceList)) { const data_source_id = form.value?.data_source_field?.id || '';
const data_source_id = form.value.data_source_field.id; //
let list = get_nested_property(props.sourceList, data_source_id); const is_data_source_id = field_list.value.filter((item: any) => item.field == data_source_id);
// if (is_data_source_id.length > 0) {
if (props.sourceList.data) { if (!isEmpty(props.sourceList)) {
list = get_nested_property(props.sourceList.data, data_source_id); let list = get_nested_property(props.sourceList, data_source_id);
//
if (props.sourceList.data) {
list = get_nested_property(props.sourceList.data, data_source_id);
}
return list == '' ? [] : list;
} else {
return [];
} }
return list == '' ? [] : list;
} else { } else {
return []; return props.groupSourceList;
} }
}); });
const get_nested_property = (obj: any, path: string) => { const get_nested_property = (obj: any, path: string) => {
// //
if (typeof path !== 'string' || !path) return []; if (typeof path !== 'string' || !path) return [];

View File

@ -37,6 +37,10 @@ const props = defineProps({
type: Boolean, type: Boolean,
default: false default: false
}, },
isCustomGroup: {
type: Boolean,
default: false
},
customGroupFieldId: { customGroupFieldId: {
type: String, type: String,
default: '' default: ''

View File

@ -32,6 +32,10 @@ const props = defineProps({
type: Boolean, type: Boolean,
default: false default: false
}, },
isCustomGroup: {
type: Boolean,
default: false
},
customGroupFieldId: { customGroupFieldId: {
type: String, type: String,
default: '' default: ''

View File

@ -26,6 +26,10 @@ const props = defineProps({
type: Boolean, type: Boolean,
default: false default: false
}, },
isCustomGroup: {
type: Boolean,
default: false
},
customGroupFieldId: { customGroupFieldId: {
type: String, type: String,
default: '' default: ''

View File

@ -28,6 +28,10 @@ const props = defineProps({
type: Boolean, type: Boolean,
default: false default: false
}, },
isCustomGroup: {
type: Boolean,
default: false
},
customGroupFieldId: { customGroupFieldId: {
type: String, type: String,
default: '' default: ''

View File

@ -39,6 +39,10 @@ const props = defineProps({
type: Boolean, type: Boolean,
default: false default: false
}, },
isCustomGroup: {
type: Boolean,
default: false
},
customGroupFieldId: { customGroupFieldId: {
type: String, type: String,
default: '' default: ''
@ -87,7 +91,7 @@ const text_title = computed(() => {
let new_title = cloneDeep(formValue.text_title); let new_title = cloneDeep(formValue.text_title);
let new_field_list = field_list.value; let new_field_list = field_list.value;
// //
if (!props.isCustom && !isEmpty(props.customGroupFieldId)) { if (props.isCustomGroup && !isEmpty(props.customGroupFieldId)) {
// //
const group_option_list = new_field_list.find((item: any) => item.field === props.customGroupFieldId); const group_option_list = new_field_list.find((item: any) => item.field === props.customGroupFieldId);
// //

View File

@ -1,8 +1,10 @@
<template> <template>
<div class="auxiliary-line common-content-height"> <div class="auxiliary-line common-content-height">
<el-form :model="form" label-width="60"> <el-form :model="form" label-width="60">
<common-content-top :value="form.content_top"></common-content-top> <template v-if="isCommon">
<div class="divider-line"></div> <common-content-top :value="form.content_top"></common-content-top>
<div class="divider-line"></div>
</template>
<card-container> <card-container>
<div class="mb-12">展示设置</div> <div class="mb-12">展示设置</div>
<el-form-item label="样式设置"> <el-form-item label="样式设置">
@ -82,6 +84,10 @@ const props = defineProps({
type: Object, type: Object,
default: () => {}, default: () => {},
}, },
isCommon: {
type: Boolean,
default: true,
},
}); });
const state = reactive({ const state = reactive({

View File

@ -2,7 +2,7 @@
<Dialog v-model:visible="dialogVisible" :title="configType == 'custom' ? '编辑自定义' : '编辑自定义组'" @accomplish="accomplish" @close_event="close_event"> <Dialog v-model:visible="dialogVisible" :title="configType == 'custom' ? '编辑自定义' : '编辑自定义组'" @accomplish="accomplish" @close_event="close_event">
<div class="flex-row h w"> <div class="flex-row h w">
<!-- 左侧和中间区域 --> <!-- 左侧和中间区域 -->
<DragIndex ref="draglist" :key="dragkey" v-model:height="center_height" v-model:width="center_width" :config-type="configType" :source-list="sourceList" :custom-group-field-id="customGroupFieldId" :is-custom="configType == 'custom'? isCustom : false" :show-data="showData" :list="new_list" @right-update="right_update" @operation_end="operation_end"></DragIndex> <DragIndex ref="draglist" :key="dragkey" v-model:height="center_height" v-model:width="center_width" :config-type="configType" :source-list="sourceList" :group-source-list="groupSourceList" :custom-group-field-id="customGroupFieldId" :is-custom-group="isCustomGroup" :is-custom="isCustom" :show-data="showData" :list="new_list" @right-update="right_update" @operation_end="operation_end"></DragIndex>
<!-- 右侧配置区域 --> <!-- 右侧配置区域 -->
<div class="settings"> <div class="settings">
<template v-if="diy_data.key === 'img'"> <template v-if="diy_data.key === 'img'">
@ -41,6 +41,7 @@ import { cloneDeep, isEqual } from "lodash";
const data_source_store = DataSourceStore(); const data_source_store = DataSourceStore();
const props = defineProps({ const props = defineProps({
// customcustom-group
configType: { configType: {
type: String, type: String,
default: 'custom', default: 'custom',
@ -49,30 +50,49 @@ const props = defineProps({
type: String, type: String,
default: '', default: '',
}, },
//
options: { options: {
type: Array<any>, type: Array<any>,
default: () => [], default: () => [],
}, },
//
sourceList: { sourceList: {
type: Object, type: Object,
default: () => {}, default: () => {},
}, },
// 使使
groupSourceList: {
type: Array,
default: () => {
return [];
}
},
//
isCustom: { isCustom: {
type: Boolean, type: Boolean,
default: false, default: false,
}, },
//
isCustomGroup: {
type: Boolean,
default: false,
},
//
showData: { showData: {
type: Object, type: Object,
default: () => ({ data_key: 'id', data_name: 'name' }), default: () => ({ data_key: 'id', data_name: 'name' }),
}, },
// id
customId: { customId: {
type: String, type: String,
default: '', default: '',
}, },
// id
customGroupFieldId: { customGroupFieldId: {
type: String, type: String,
default: '', default: '',
}, },
//
customList: { customList: {
type: Array<any>, type: Array<any>,
default: () => [], default: () => [],
@ -188,9 +208,6 @@ const operation_end = (is_compare: boolean = true) => {
} }
// //
const new_compare_data = cloneDeep(draglist.value.diy_data); const new_compare_data = cloneDeep(draglist.value.diy_data);
console.log(old_compare_data);
console.log(new_compare_data);
console.log(!isEqual(old_compare_data, new_compare_data));
if (!is_compare || !isEqual(old_compare_data, new_compare_data)) { if (!is_compare || !isEqual(old_compare_data, new_compare_data)) {
// //
if (props.configType == 'custom') { if (props.configType == 'custom') {

View File

@ -71,22 +71,22 @@
<Vue3DraggableResizable v-for="(item, index) in diy_data" :key="item.id" v-model:w="item.com_data.com_width" v-model:h="item.com_data.com_height" :min-w="0" :min-h="0" :class="{'plug-in-show-component-line': is_show_component_line, 'plug-in-show-tabs': item.show_tabs == '1', 'vdr-handle-z-index': item.com_data.bottom_up == '1' }" :style="{ 'z-index': (diy_data.length - 1) - index }" :init-w="item.com_data.com_width" :init-h="item.com_data.com_height" :x="item.location.x" :y="item.location.y" :parent="true" :draggable="is_draggable" @mousedown.stop="on_choose(index, item.show_tabs)" @click.stop="on_choose(index, item.show_tabs)" @drag-end="dragEndHandle($event, index)" @resizing="resizingHandle($event, item.key, index, 'resizing')" @resize-end="resizingHandle($event, item.key, index, 'resizeEnd')"> <Vue3DraggableResizable v-for="(item, index) in diy_data" :key="item.id" v-model:w="item.com_data.com_width" v-model:h="item.com_data.com_height" :min-w="0" :min-h="0" :class="{'plug-in-show-component-line': is_show_component_line, 'plug-in-show-tabs': item.show_tabs == '1', 'vdr-handle-z-index': item.com_data.bottom_up == '1' }" :style="{ 'z-index': (diy_data.length - 1) - index }" :init-w="item.com_data.com_width" :init-h="item.com_data.com_height" :x="item.location.x" :y="item.location.y" :parent="true" :draggable="is_draggable" @mousedown.stop="on_choose(index, item.show_tabs)" @click.stop="on_choose(index, item.show_tabs)" @drag-end="dragEndHandle($event, index)" @resizing="resizingHandle($event, item.key, index, 'resizing')" @resize-end="resizingHandle($event, item.key, index, 'resizeEnd')">
<div :class="['main-content flex-row', { 'plug-in-border': item.show_tabs == '1' }]"> <div :class="['main-content flex-row', { 'plug-in-border': item.show_tabs == '1' }]">
<template v-if="item.key == 'text'"> <template v-if="item.key == 'text'">
<model-text :key="item.id" :value="item.com_data" :source-list="props.sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId" :title-params="showData?.data_name || 'name'"></model-text> <model-text :key="item.id" :value="item.com_data" :source-list="props.sourceList" :is-custom="isCustom" :is-custom-group="isCustomGroup" :custom-group-field-id="customGroupFieldId" :title-params="showData?.data_name || 'name'"></model-text>
</template> </template>
<template v-else-if="item.key == 'img'"> <template v-else-if="item.key == 'img'">
<model-image :key="item.id" :value="item.com_data" :source-list="props.sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId" :img-params="showData?.data_logo || ''"></model-image> <model-image :key="item.id" :value="item.com_data" :source-list="props.sourceList" :is-custom="isCustom" :is-custom-group="isCustomGroup" :custom-group-field-id="customGroupFieldId" :img-params="showData?.data_logo || ''"></model-image>
</template> </template>
<template v-else-if="item.key == 'auxiliary-line'"> <template v-else-if="item.key == 'auxiliary-line'">
<model-lines :key="item.id" :value="item.com_data" :source-list="props.sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId"></model-lines> <model-lines :key="item.id" :value="item.com_data" :source-list="props.sourceList" :is-custom="isCustom" :is-custom-group="isCustomGroup" :custom-group-field-id="customGroupFieldId"></model-lines>
</template> </template>
<template v-else-if="item.key == 'icon'"> <template v-else-if="item.key == 'icon'">
<model-icon :key="item.id" :value="item.com_data" :source-list="props.sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId"></model-icon> <model-icon :key="item.id" :value="item.com_data" :source-list="props.sourceList" :is-custom="isCustom" :is-custom-group="isCustomGroup" :custom-group-field-id="customGroupFieldId"></model-icon>
</template> </template>
<template v-else-if="item.key == 'panel'"> <template v-else-if="item.key == 'panel'">
<model-panel :key="item.id" :value="item.com_data" :source-list="props.sourceList" :is-custom="isCustom" :custom-group-field-id="customGroupFieldId"></model-panel> <model-panel :key="item.id" :value="item.com_data" :source-list="props.sourceList" :is-custom="isCustom" :is-custom-group="isCustomGroup" :custom-group-field-id="customGroupFieldId"></model-panel>
</template> </template>
<template v-else-if="item.key == 'custom-group'"> <template v-else-if="item.key == 'custom-group'">
<model-custom-group :key="item.id" :value="item.com_data" :source-list="props.sourceList" :data-height="item.com_data.custom_height" :data-width="item.com_data.com_width" :is-custom="isCustom"></model-custom-group> <model-custom-group :key="item.id" :value="item.com_data" :source-list="props.sourceList" :group-source-list="groupSourceList" :data-height="item.com_data.custom_height" :data-width="item.com_data.com_width" :is-custom="isCustom" :show-data="showData"></model-custom-group>
</template> </template>
</div> </div>
</Vue3DraggableResizable> </Vue3DraggableResizable>
@ -128,6 +128,8 @@ interface Props {
isCustom: boolean; isCustom: boolean;
showData: any; showData: any;
customGroupFieldId: string; customGroupFieldId: string;
isCustomGroup: boolean;
groupSourceList: Array<any>;
} }
const props = defineProps<Props>(); const props = defineProps<Props>();
//#endregion //#endregion

View File

@ -8,7 +8,7 @@
<div v-for="(item1, index1) in data_source_content_list" :key="index1" :style="`width: ${ gap_width }`"> <div v-for="(item1, index1) in data_source_content_list" :key="index1" :style="`width: ${ gap_width }`">
<div :style="style_chunk_container"> <div :style="style_chunk_container">
<div class="w h oh" :style="style_chunk_img_container"> <div class="w h oh" :style="style_chunk_img_container">
<data-rendering :custom-list="form.custom_list" :source-list="item1" :data-height="form.height" :scale="scale" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }"></data-rendering> <data-rendering :custom-list="form.custom_list" :source-list="item1" :group-source-list="data_source_content_list" :data-height="form.height" :scale="scale" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }"></data-rendering>
</div> </div>
</div> </div>
</div> </div>
@ -19,7 +19,7 @@
<swiper-slide v-for="(item1, index1) in data_source_content_list" :key="index1"> <swiper-slide v-for="(item1, index1) in data_source_content_list" :key="index1">
<div :style="style_chunk_container"> <div :style="style_chunk_container">
<div class="w h oh" :style="style_chunk_img_container"> <div class="w h oh" :style="style_chunk_img_container">
<data-rendering :custom-list="form.custom_list" :source-list="item1" :data-height="form.height" :scale="scale" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }"></data-rendering> <data-rendering :custom-list="form.custom_list" :source-list="item1" :group-source-list="data_source_content_list" :data-height="form.height" :scale="scale" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }"></data-rendering>
</div> </div>
</div> </div>
</swiper-slide> </swiper-slide>

View File

@ -59,9 +59,9 @@
<el-button class="w custom-button size-14" size="large" @click="custom_edit('custom')"><icon name="edit" size="14"></icon>自定义编辑</el-button> <el-button class="w custom-button size-14" size="large" @click="custom_edit('custom')"><icon name="edit" size="14"></icon>自定义编辑</el-button>
</el-form> </el-form>
<!-- 自定义内容处理 --> <!-- 自定义内容处理 -->
<custom-config :key="dragkey + 'custom'" v-model:visible="dialogVisible" v-model:width="custom_width" v-model:height="center_height" :dragkey="dragkey + 'custom'" :options="model_data_source" :source-list="!isEmpty(data_source_content_list) ? data_source_content_list[0] : {}" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }" :custom-list="custom_list" @accomplish="accomplish" @custom_edit="custom_edit"></custom-config> <custom-config :key="dragkey + 'custom'" v-model:visible="dialogVisible" v-model:width="custom_width" v-model:height="center_height" :dragkey="dragkey + 'custom'" :options="model_data_source" :source-list="!isEmpty(data_source_content_list) ? data_source_content_list[0] : {}" :group-source-list="data_source_content_list" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }" :custom-list="custom_list" @accomplish="accomplish" @custom_edit="custom_edit"></custom-config>
<!-- 自定义内部数据内容处理 --> <!-- 自定义内部数据内容处理 -->
<custom-config :key="drag_group_key + 'custom-group'" v-model:visible="dialogVisible_group" v-model:width="center_group_width" v-model:height="center_group_height" v-model:father-list="custom_group_father_list" config-type="custom-group" :dragkey="drag_group_key + 'custom-group'" :options="custom_group_option_list" :source-list="!isEmpty(new_group_source_list) ? new_group_source_list : {}" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }" :custom-id="center_group_id" :custom-list="custom_group_list" :custom-group-field-id="custom_group_field_id" @accomplish="accomplish"></custom-config> <custom-config :key="drag_group_key + 'custom-group'" v-model:visible="dialogVisible_group" v-model:width="center_group_width" v-model:height="center_group_height" v-model:father-list="custom_group_father_list" config-type="custom-group" :dragkey="drag_group_key + 'custom-group'" :options="custom_group_option_list" :source-list="!isEmpty(new_group_source_list) ? new_group_source_list : {}" :group-source-list="data_source_content_list" :is-custom="form.is_custom_data == '1'" :is-custom-group="true" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }" :custom-id="center_group_id" :custom-list="custom_group_list" :custom-group-field-id="custom_group_field_id" @accomplish="accomplish"></custom-config>
<!-- 手动筛选数据弹出框 --> <!-- 手动筛选数据弹出框 -->
<custom-dialog v-model:dialog-visible="url_value_dialog_visible" :data-list-key="form.show_data?.data_key || 'id'" :config="default_type_data.appoint_config" :extra-search-data="form.data_source_content" :multiple="url_value_multiple_bool" @confirm_event="url_value_dialog_call_back"></custom-dialog> <custom-dialog v-model:dialog-visible="url_value_dialog_visible" :data-list-key="form.show_data?.data_key || 'id'" :config="default_type_data.appoint_config" :extra-search-data="form.data_source_content" :multiple="url_value_multiple_bool" @confirm_event="url_value_dialog_call_back"></custom-dialog>
</div> </div>
@ -153,8 +153,15 @@ const custom_edit = (type: string, id?: string, father_list?: any, list?: any, w
center_group_height.value = height || 0; center_group_height.value = height || 0;
// //
custom_group_field_id.value = data_source_field?.id || ''; custom_group_field_id.value = data_source_field?.id || '';
new_group_source_list.value = new_group_source_list_handle(data_source_field?.id || ''); // ,
custom_group_option_list.value = data_source_field?.option || []; const is_data_source_id = model_data_source.value.filter((item: any) => item.field == data_source_field?.id);
if (is_data_source_id.length > 0) {
custom_group_option_list.value = data_source_field?.option || [];
new_group_source_list.value = new_group_source_list_handle(data_source_field?.id || '');
} else {
custom_group_option_list.value = model_data_source.value;
new_group_source_list.value = !isEmpty(data_source_content_list) ? data_source_content_list.value[0] : {};
}
// //
data_source_store.set_is_children_custom(true); data_source_store.set_is_children_custom(true);
} }

View File

@ -6,7 +6,7 @@
<div v-for="(item1, index1) in data_source_content_list" :key="index1" :style="`width: ${ gap_width }`"> <div v-for="(item1, index1) in data_source_content_list" :key="index1" :style="`width: ${ gap_width }`">
<div :style="style_container"> <div :style="style_container">
<div class="w h oh" :style="style_img_container"> <div class="w h oh" :style="style_img_container">
<data-rendering :custom-list="form.custom_list" :source-list="item1" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }" :data-height="form.height" :scale="scale"></data-rendering> <data-rendering :custom-list="form.custom_list" :source-list="item1" :group-source-list="data_source_content_list" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }" :data-height="form.height" :scale="scale"></data-rendering>
</div> </div>
</div> </div>
</div> </div>
@ -17,7 +17,7 @@
<swiper-slide v-for="(item1, index1) in data_source_content_list" :key="index1"> <swiper-slide v-for="(item1, index1) in data_source_content_list" :key="index1">
<div :style="style_container"> <div :style="style_container">
<div class="w h oh" :style="style_img_container"> <div class="w h oh" :style="style_img_container">
<data-rendering :custom-list="form.custom_list" :source-list="item1" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }" :data-height="form.height" :scale="scale"></data-rendering> <data-rendering :custom-list="form.custom_list" :source-list="item1" :group-source-list="data_source_content_list" :is-custom="form.is_custom_data == '1'" :show-data="form?.show_data || { data_key: 'id', data_name: 'name' }" :data-height="form.height" :scale="scale"></data-rendering>
</div> </div>
</div> </div>
</swiper-slide> </swiper-slide>

View File

@ -2,10 +2,13 @@
<div class="common-content-height"> <div class="common-content-height">
<el-tabs v-model="tabs_name" class="content-tabs" @tab-change="change_tab_event"> <el-tabs v-model="tabs_name" class="content-tabs" @tab-change="change_tab_event">
<el-tab-pane label="选项卡" name="tabs"> <el-tab-pane label="选项卡" name="tabs">
<model-tabs-content :value="form" :tab-style="styles"></model-tabs-content> <model-tabs-content :value="form" :tab-style="styles" :is-common="false"></model-tabs-content>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="轮播" name="carousel"> <el-tab-pane label="轮播" name="carousel">
<model-carousel-content :value="form"></model-carousel-content> <model-carousel-content :value="form" :is-common="false"></model-carousel-content>
</el-tab-pane>
<el-tab-pane label="公共" name="common">
<common-content-top :value="form.content_top"></common-content-top>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>

View File

@ -1,8 +1,10 @@
<template> <template>
<div class="common-content-height"> <div class="common-content-height">
<el-form :model="form" label-width="60"> <el-form :model="form" label-width="60">
<common-content-top :value="form.content_top"></common-content-top> <template v-if="isCommon">
<div class="divider-line"></div> <common-content-top :value="form.content_top"></common-content-top>
<div class="divider-line"></div>
</template>
<card-container> <card-container>
<div class="mb-12">展示设置</div> <div class="mb-12">展示设置</div>
<el-form-item label="选择风格"> <el-form-item label="选择风格">
@ -95,6 +97,10 @@ const props = defineProps({
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
isCommon: {
type: Boolean,
default: true,
},
}); });
const state = reactive({ const state = reactive({

View File

@ -317,7 +317,7 @@ export const get_is_eligible = (field_list: any[], condition: condition_data, pr
let option: any = {}; let option: any = {};
if (field_list) { if (field_list) {
// 判断是否是自定义组并且 自定义组选则了对应的数据源 // 判断是否是自定义组并且 自定义组选则了对应的数据源
if (!props.isCustom && !isEmpty(props.customGroupFieldId)) { if (props.isCustomGroup && !isEmpty(props.customGroupFieldId)) {
// 取出对应自定义组的内容 // 取出对应自定义组的内容
const group_option_list = field_list.find((item: any) => item.field === props.customGroupFieldId); const group_option_list = field_list.find((item: any) => item.field === props.customGroupFieldId);
// 取出自定义组内部数据源参数的详细数据 // 取出自定义组内部数据源参数的详细数据