diff --git a/src/components/model-goods-list/index.vue b/src/components/model-goods-list/index.vue index a47277e9..b66169bf 100644 --- a/src/components/model-goods-list/index.vue +++ b/src/components/model-goods-list/index.vue @@ -223,20 +223,34 @@ const default_list = { }, ], }; +//#region 列表数据 const list = ref([]); +// 初始化的时候执行 +onBeforeMount(() => { + // 指定商品并且指定商品数组不为空 + if (!isEmpty(form.value.data_list) && form.value.data_type == '0') { + list.value = form.value.data_list; + } else if (!isEmpty(form.value.data_auto_list) && form.value.data_type == '1') { + // 筛选商品并且筛选商品数组不为空 + list.value = form.value.data_auto_list; + } else { // 为空的时候走默认数据 + list.value = Array(4).fill(default_list); + } +}); const get_products = () => { - const { category, data_ids, number, sort, sort_rules } = form.value; + const { category, brand, number, sort, sort_rules } = form.value; const params = { goods_keywords: '', goods_category_ids: category, - goods_brand_ids: data_ids, + goods_brand_ids: brand, goods_order_by_type: sort, goods_order_by_rule: sort_rules, goods_number: number, }; // 获取商品列表 ShopAPI.getShopLists(params).then((res: any) => { + form.value.data_auto_list = res.data; if (!isEmpty(res.data)) { list.value = res.data; } else { @@ -244,11 +258,16 @@ const get_products = () => { } }); }; - -watchEffect(() => { - if (form.value.data_type == '0') { - if (!isEmpty(form.value.data_list)) { - list.value = cloneDeep(form.value.data_list).map((item: any) => ({ +// 取出监听的数据 +const watch_data = computed(() => { + const { category, brand, number, sort, sort_rules, data_type, data_list } = form.value; + return { category: category, brand: brand, number: number, sort: sort, sort_rules: sort_rules, data_type: data_type, data_list: data_list }; +}) +// 初始化的时候不执行, 监听数据变化 +watch(() => watch_data.value, (val) => { + if (val.data_type == '0') { + if (!isEmpty(val.data_list)) { + list.value = cloneDeep(val.data_list).map((item: any) => ({ ...item.data, title: !isEmpty(item.new_title) ? item.new_title : item.data.title, new_cover: item.new_cover, @@ -259,7 +278,8 @@ watchEffect(() => { } else { get_products(); } -}); +}, { deep: true }); +//#endregion // 圆角设置 const content_radius = computed(() => radius_computer(new_style.value.shop_radius)); diff --git a/src/components/model-goods-list/model-goods-list-content.vue b/src/components/model-goods-list/model-goods-list-content.vue index 36f73bf1..541e146b 100644 --- a/src/components/model-goods-list/model-goods-list-content.vue +++ b/src/components/model-goods-list/model-goods-list-content.vue @@ -38,7 +38,7 @@ - + diff --git a/src/components/model-goods-tabs/index.vue b/src/components/model-goods-tabs/index.vue index be5b256d..1adfcadb 100644 --- a/src/components/model-goods-tabs/index.vue +++ b/src/components/model-goods-tabs/index.vue @@ -27,7 +27,7 @@ watch(tabs_list.value, (val) => { // 产品的值 new_data.content.data_type = new_data.content.tabs_list[0].data_type; new_data.content.category = new_data.content.tabs_list[0].category; - new_data.content.data_ids = new_data.content.tabs_list[0].data_ids; + new_data.content.brand = new_data.content.tabs_list[0].brand; new_data.content.number = new_data.content.tabs_list[0].number; new_data.content.sort = new_data.content.tabs_list[0].sort; new_data.content.sort_rules = new_data.content.tabs_list[0].sort_rules; diff --git a/src/components/model-goods-tabs/model-goods-tabs-content.vue b/src/components/model-goods-tabs/model-goods-tabs-content.vue index c898caa8..bfcc24cb 100644 --- a/src/components/model-goods-tabs/model-goods-tabs-content.vue +++ b/src/components/model-goods-tabs/model-goods-tabs-content.vue @@ -60,7 +60,7 @@ - + diff --git a/src/views/layout/components/main/default/goods-list.ts b/src/views/layout/components/main/default/goods-list.ts index be23e2fc..0fe65ca3 100644 --- a/src/views/layout/components/main/default/goods-list.ts +++ b/src/views/layout/components/main/default/goods-list.ts @@ -5,9 +5,11 @@ interface DefaultProductList { data_type: string; carousel_col: number; category: string[]; + brand: string[]; data_ids: string[]; product_show_list: string[]; data_list: string[]; + data_auto_list: string[]; is_price_solo: string; number: number; sort: string; @@ -57,7 +59,9 @@ const defaultProductList: DefaultProductList = { carousel_col: 3, product_show_list: [], data_list: [], + data_auto_list: [], category: [], + brand: [], data_ids: [], is_price_solo: '1', number: 4, diff --git a/src/views/layout/components/main/default/goods-tabs.ts b/src/views/layout/components/main/default/goods-tabs.ts index 04bdc999..474e5834 100644 --- a/src/views/layout/components/main/default/goods-tabs.ts +++ b/src/views/layout/components/main/default/goods-tabs.ts @@ -6,6 +6,7 @@ interface articleTabsList { desc: string; data_type: string; category: string[]; + brand: string[]; data_ids: string[]; number: number; sort: string; @@ -74,10 +75,10 @@ const defaultProductList: DefaultProductList = { theme: '0', carousel_col: 3, tabs_list: [ - { id: '1', title: '热门推荐', img: [], desc: '简介', data_type: '0', category: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] }, - { id: '2', title: '测试一', img: [], desc: '简介', data_type: '0', category: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] }, - { id: '3', title: '测试二', img: [], desc: '简介', data_type: '0', category: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] }, - { id: '4', title: '测试三', img: [], desc: '简介', data_type: '0', category: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] }, + { id: '1', title: '热门推荐', img: [], desc: '简介', data_type: '0', category: [], brand: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] }, + { id: '2', title: '测试一', img: [], desc: '简介', data_type: '0', category: [], brand: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] }, + { id: '3', title: '测试二', img: [], desc: '简介', data_type: '0', category: [], brand: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] }, + { id: '4', title: '测试三', img: [], desc: '简介', data_type: '0', category: [], brand: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] }, ], is_show: ['title', 'plugins_view_icon', 'price', 'sales_count', 'original_price'], is_shop_show: '1',