diff --git a/common/js/common/common.js b/common/js/common/common.js index 568c6730..d59e391b 100644 --- a/common/js/common/common.js +++ b/common/js/common/common.js @@ -13,6 +13,72 @@ export function is_obj_empty(obj) { return Object.keys(obj).length === 0; } +/** + * 获取嵌套对象的属性值 + * + * 该函数旨在通过指定的属性路径获取嵌套对象中的属性值它接受一个对象和一个属性路径字符串作为参数, + * 并返回对应路径的属性值如果输入的路径无效或对象中不存在该路径,则返回空字符串 + * + * @param {Object} obj - 要从中获取属性的嵌套对象 + * @param {string} path - 属性路径,使用点号分隔的字符串表示 + * @returns {string} - 返回指定路径的属性值,如果路径无效则返回空字符串 + */ +export function get_nested_property(obj, path) { + // 检查路径参数是否为字符串且非空,若不满足条件则返回空字符串 + if (typeof path !== 'string' || !path) return ''; + + // 将属性路径字符串拆分为属性键数组 + const keys = path.split('.'); + + // 使用reduce方法遍历属性键数组,逐层访问对象属性 + // 如果当前对象存在且拥有下一个属性键,则继续访问;否则返回空字符串 + return keys.reduce((o, key) => (o && o[key] ? o[key] : ''), obj) || ''; +} + +/** + * 根据数据源链接ID和属性源列表生成自定义链接 + * + * @param {string} data_source_link_id - 数据源链接ID,可以是单个ID或多个ID以分号分隔 + * @param {object} propSourceList - 包含数据源的属性列表 + * @param {object} source_link_option - 链接生成的可选配置,包括首尾添加的字符串和连接符 + * @returns {string} 生成的自定义链接URL + */ +export function get_custom_link(data_source_link_id, propSourceList, source_link_option) { + let url = ''; + if (!data_source_link_id) { + return ''; + } + // 判断数据源链接ID是否包含分号,包含则表示有多个ID + if (data_source_link_id.includes(';')) { + // 分割数据源链接ID,处理多个ID + const ids = data_source_link_id.split(';'); + let source_url = ''; + // 遍历每个ID,获取对应的属性值并拼接成URL + ids.forEach((item, index) => { + // 判断数据源列表是否为空 + if (!isEmpty(propSourceList.data)) { + // 从数据源列表的data属性中获取嵌套属性值,并使用指定的连接符连接 + source_url += get_nested_property(propSourceList.data, item) + (index != ids.length -1 ? (source_link_option?.join || '') : ''); + } else { + // 直接从数据源列表中获取嵌套属性值,并使用指定的连接符连接 + source_url += get_nested_property(propSourceList, item) + (index != ids.length -1 ? (source_link_option?.join || '') : ''); + } + }); + url = source_url; + } else { + // 处理单个ID的情况 + if (!isEmpty(propSourceList.data)) { + // 从数据源列表的data属性中获取嵌套属性值作为URL + url = get_nested_property(propSourceList.data, data_source_link_id); + } else { + // 直接从数据源列表中获取嵌套属性值作为URL + url = get_nested_property(propSourceList, data_source_link_id); + } + } + // 返回最终的URL,添加首尾的可选字符串 + return (source_link_option?.first || '') + url + (source_link_option?.last || ''); +} + /** * 指示器的样式 * diff --git a/components/diy/custom.vue b/components/diy/custom.vue index 0804062e..cb97fe99 100644 --- a/components/diy/custom.vue +++ b/components/diy/custom.vue @@ -5,7 +5,7 @@ - + @@ -16,7 +16,7 @@
- +
@@ -37,7 +37,7 @@ @@ -88,70 +88,12 @@ div_height: 0, custom_list_length: 0, source_list: { - goods: { - // 存放手动输入的id - data_ids: [], - // 手动输入 - data_list: [], - // 自动 - data_auto_list: [], - // 商品类型 - data_type: '0', - // 商品分类 - category_ids: [], - // 品牌 - brand_ids: [], - // 显示数量 - number: 4, - // 排序类型 - order_by_type: '0', - // 排序规则 - order_by_rule: '0', - }, - article: { - // 存放手动输入的id - data_ids: [], - // 手动输入 - data_list: [], - // 自动 - data_auto_list: [], - data_type: '0', - number: 4, - order_by_type: '0', - order_by_rule: '0', - // 文章封面 - is_cover: '0', - // 分类id - category_ids: [], - }, - brand: { - // 存放手动输入的id - data_ids: [], - // 手动输入 - data_list: [], - // 自动 - data_auto_list: [], - // 商品类型 - data_type: '0', - // 商品分类 - category_ids: [], - // 品牌 - brand_ids: [], - // 显示数量 - number: 4, - // 排序类型 - order_by_type: '0', - // 排序规则 - order_by_rule: '0', - }, - common: { - // 存放手动输入的id - data_ids: [], - // 手动输入 - data_list: [], - // 自动 - data_auto_list: [], - } + // 存放手动输入的id + data_ids: [], + // 手动输入 + data_list: [], + // 自动 + data_auto_list: [], }, data_source_content_list: [], data_source: '', @@ -167,6 +109,7 @@ indicator_location_style: '', indicator_style: '', slides_per_view: 1, + show_data: { data_key: 'id', data_name: 'name' }, old_data_style: { color_list: [{ color: 'rgb(244, 252, 255)', color_percentage: undefined }], direction: '180deg', @@ -208,12 +151,7 @@ if (!Object.keys(new_form.data_source_content).includes('data_auto_list') && !Object.keys(new_form.data_source_content).includes('data_list')) { //深拷贝一下,保留历史数据 const data = JSON.parse(JSON.stringify(new_form.data_source_content)); - // 判断是否有符合条件的数据源,如何没有的话取公共数据源 - if (!isEmpty(this.source_list[new_form.data_source])) { - new_form.data_source_content = this.source_list[new_form.data_source]; - } else { - new_form.data_source_content = this.source_list['common']; - } + new_form.data_source_content = this.source_list; // 如果老数组中有数据,将数据放到新数组中 if (!isEmpty(data)) { new_form.data_source_content.data_list = [ data ]; @@ -272,6 +210,7 @@ swiper_height: swiper_height, swiper_width: swiper_width, slides_per_view: new_style.rolling_fashion == 'translation' ? (new_form.data_source_direction != 'horizontal' ? col : new_form.data_source_carousel_col ) : 1, + show_data: new_form?.show_data || { data_key: 'id', data_name: 'name' } }); }, get_list(list, form, new_style) { diff --git a/components/diy/data-magic.vue b/components/diy/data-magic.vue index 53f9d3f1..0ebf1f19 100644 --- a/components/diy/data-magic.vue +++ b/components/diy/data-magic.vue @@ -21,20 +21,20 @@ {{ item.data_content.subtitle || '' }} - +