From d0d957b69598fe1d5396a7f5bdad9cb348a743bb Mon Sep 17 00:00:00 2001 From: wangjiahao <1522128093@qq.com> Date: Sun, 3 Dec 2023 23:18:04 +0800 Subject: [PATCH] refactor: UI --- .../component/CategoryTemplateV2.vue | 18 ++++++-- .../src/views/template-market/index.vue | 43 ++++--------------- .../api/template/dto/TemplateMarketDTO.java | 14 +++++- 3 files changed, 35 insertions(+), 40 deletions(-) diff --git a/core/core-frontend/src/views/template-market/component/CategoryTemplateV2.vue b/core/core-frontend/src/views/template-market/component/CategoryTemplateV2.vue index fbdbf3d1a2..30797a68eb 100644 --- a/core/core-frontend/src/views/template-market/component/CategoryTemplateV2.vue +++ b/core/core-frontend/src/views/template-market/component/CategoryTemplateV2.vue @@ -3,13 +3,11 @@
{{ label }} {{ label }} - 的搜索结果是{{ fullTemplateShowList.length }}个 + 的搜索结果是{{ searchResult }}个 import TemplateMarketV2Item from '@/views/template-market/component/TemplateMarketV2Item.vue' +import { computed } from 'vue' const emits = defineEmits(['templateApply', 'templatePreview']) const templateApply = params => { @@ -38,6 +37,17 @@ const templatePreview = params => { emits('templatePreview', params) } +const searchResult = computed( + () => props.fullTemplateShowList.filter(item => showFlagCheck(item)).length +) + +const showFlagCheck = template => { + if (!template.categoryNames) { + console.log('===templateTest' + JSON.stringify(template)) + } + return template.showFlag && template.categoryNames?.includes(props.label) +} + const props = defineProps({ searchText: { type: String diff --git a/core/core-frontend/src/views/template-market/index.vue b/core/core-frontend/src/views/template-market/index.vue index e880b3dc47..87f9e14cfb 100644 --- a/core/core-frontend/src/views/template-market/index.vue +++ b/core/core-frontend/src/views/template-market/index.vue @@ -102,7 +102,7 @@ id="template-show-area" class="template-right" > - + - + { const handleClick = item => { // do handleClick } -const initTemplateShow = (activeTab = state.marketActiveTab) => { +const initTemplateShow = () => { let tempHasResult = false state.currentMarketTemplateShowList.forEach(template => { - template.showFlag = templateShow(template, activeTab) + template.showFlag = templateShow(template) if (template.showFlag) { tempHasResult = true } @@ -435,36 +436,10 @@ const initTemplateShow = (activeTab = state.marketActiveTab) => { } } -const fullTemplateShowList = curTab => { - state.currentMarketTemplateShowList.forEach(template => { - template.showFlag = templateShow(template, curTab) - }) - const result = deepCopy(state.currentMarketTemplateShowList.filter(ele => ele.showFlag)) - console.log('curTab=' + curTab + '&fullTemplateShowList=' + JSON.stringify(result)) - return result -} - -const templateShow = (templateItem, activeTab) => { - let categoryMarch = false +const templateShow = templateItem => { let searchMarch = false let templateTypeMarch = false let templateSourceTypeMarch = false - if (activeTab === '最近使用') { - if (templateItem.recentUseTime) { - categoryMarch = true - } - } else if (activeTab === '推荐') { - if (templateItem.suggest === 'Y') { - categoryMarch = true - } - } else { - templateItem.categories.forEach(category => { - if (category.name === activeTab) { - categoryMarch = true - } - }) - } - if (!state.searchText || templateItem.title.indexOf(state.searchText) > -1) { searchMarch = true } @@ -476,7 +451,7 @@ const templateShow = (templateItem, activeTab) => { if (state.templateSourceType === 'all' || templateItem.source === state.templateSourceType) { templateSourceTypeMarch = true } - return categoryMarch && searchMarch && templateTypeMarch && templateSourceTypeMarch + return searchMarch && templateTypeMarch && templateSourceTypeMarch } const templatePreview = previewId => { diff --git a/sdk/api/api-base/src/main/java/io/dataease/api/template/dto/TemplateMarketDTO.java b/sdk/api/api-base/src/main/java/io/dataease/api/template/dto/TemplateMarketDTO.java index 297b7c8395..5848887f27 100644 --- a/sdk/api/api-base/src/main/java/io/dataease/api/template/dto/TemplateMarketDTO.java +++ b/sdk/api/api-base/src/main/java/io/dataease/api/template/dto/TemplateMarketDTO.java @@ -4,6 +4,8 @@ import io.dataease.api.template.vo.MarketCategoryVO; import io.dataease.api.template.vo.MarketMetasVO; import lombok.Data; import lombok.NoArgsConstructor; + +import java.util.ArrayList; import java.util.Arrays; import java.util.List; @@ -30,6 +32,8 @@ public class TemplateMarketDTO implements Comparable { private String source = "market"; private List categories; + private List categoryNames; + private String mainCategory; private MarketMetasVO metas; @@ -38,7 +42,8 @@ public class TemplateMarketDTO implements Comparable { this.id = manageDTO.getId(); this.title = manageDTO.getName(); this.mainCategory = manageDTO.getCategoryName(); - this.categories = Arrays.asList(new MarketCategoryVO(manageDTO.getCategoryName()), new MarketCategoryVO("全部")); + this.categories = Arrays.asList(new MarketCategoryVO(manageDTO.getCategoryName())); + this.categoryNames = Arrays.asList(manageDTO.getCategoryName()); this.metas = new MarketMetasVO(manageDTO.getSnapshot()); this.templateType = "dataV".equalsIgnoreCase("manageDTO.getTemplateType()") ? "SCREEN" : "PANEL"; this.thumbnail = manageDTO.getSnapshot(); @@ -51,15 +56,20 @@ public class TemplateMarketDTO implements Comparable { public TemplateMarketDTO(String id, String title, String themeRepo, String templateUrl, String categoryName, String templateType, Long recentUseTime, String suggest) { this.id = id; this.title = title; - this.categories = Arrays.asList(new MarketCategoryVO(categoryName), new MarketCategoryVO("全部")); this.metas = new MarketMetasVO(templateUrl); this.thumbnail = themeRepo; this.templateType = templateType; + this.categories = new ArrayList<>(Arrays.asList(new MarketCategoryVO(categoryName))) ; + this.categoryNames = new ArrayList<>(Arrays.asList(categoryName)) ; if (recentUseTime != null) { this.recentUseTime = recentUseTime; + this.categories.add(new MarketCategoryVO("最近使用")); + this.categoryNames.add("最近使用"); } if ("Y".equalsIgnoreCase(suggest)) { this.suggest = "Y"; + this.categories.add(new MarketCategoryVO("推荐")); + this.categoryNames.add("推荐"); } }