From 1b0813f853735b65d16c11ba73e22c7054cd723d Mon Sep 17 00:00:00 2001 From: wangjiahao <1522128093@qq.com> Date: Thu, 30 Nov 2023 19:40:42 +0800 Subject: [PATCH] =?UTF-8?q?style:=20UI=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../template/manage/TemplateCenterManage.java | 46 ++++-- .../src/views/template-market/index.vue | 134 ++++++++++++------ .../template/response/MarketBaseResponse.java | 9 +- 3 files changed, 134 insertions(+), 55 deletions(-) diff --git a/core/core-backend/src/main/java/io/dataease/template/manage/TemplateCenterManage.java b/core/core-backend/src/main/java/io/dataease/template/manage/TemplateCenterManage.java index 31b9bc83b9..50b041a3ec 100644 --- a/core/core-backend/src/main/java/io/dataease/template/manage/TemplateCenterManage.java +++ b/core/core-backend/src/main/java/io/dataease/template/manage/TemplateCenterManage.java @@ -1,6 +1,5 @@ package io.dataease.template.manage; -import com.mysql.cj.log.Log; import io.dataease.api.template.dto.TemplateManageDTO; import io.dataease.api.template.dto.TemplateManageFileDTO; import io.dataease.api.template.dto.TemplateMarketDTO; @@ -8,7 +7,6 @@ import io.dataease.api.template.dto.TemplateMarketPreviewInfoDTO; import io.dataease.api.template.response.*; import io.dataease.api.template.vo.MarketApplicationSpecVO; import io.dataease.api.template.vo.MarketMetaDataVO; -import io.dataease.api.template.vo.TemplateCategoryVO; import io.dataease.constant.CommonConstants; import io.dataease.exception.DEException; import io.dataease.operation.manage.CoreOptRecentManage; @@ -19,11 +17,11 @@ import io.dataease.utils.HttpClientUtil; import io.dataease.utils.JsonUtil; import io.dataease.utils.LogUtil; import jakarta.annotation.Resource; -import org.apache.commons.collections4.CollectionUtils; import org.apache.commons.lang3.StringUtils; import org.springframework.stereotype.Service; import java.util.*; +import java.util.function.Function; import java.util.stream.Collectors; /** @@ -89,6 +87,7 @@ public class TemplateCenterManage { return baseResponseV2Trans(templateQuery(templateParams), searchTemplateFromManage(), templateParams.get("template.url")); } catch (Exception e) { LogUtil.error(e); + e.printStackTrace(); } return null; } @@ -138,7 +137,9 @@ public class TemplateCenterManage { private MarketBaseResponse baseResponseV2TransRecommend(MarketTemplateV2BaseResponse v2BaseResponse, String url) { Map useTime = coreOptRecentManage.findTemplateRecentUseTime(); - Map categoriesMap = getCategoriesBaseV2(); + List categoryVO = getCategoriesV2().stream().filter(node -> !"全部".equalsIgnoreCase(node.getLabel())).collect(Collectors.toList()); + Map categoriesMap = categoryVO.stream() + .collect(Collectors.toMap(MarketMetaDataVO::getSlug, MarketMetaDataVO::getLabel)); List contents = new ArrayList<>(); if (v2BaseResponse != null) { v2BaseResponse.getItems().stream().forEach(marketTemplateV2ItemResult -> { @@ -150,25 +151,32 @@ public class TemplateCenterManage { } // 最近使用排序 Collections.sort(contents); - return new MarketBaseResponse(url, contents); + return new MarketBaseResponse(url,categoryVO, contents); } private MarketBaseResponse baseResponseV2Trans(MarketTemplateV2BaseResponse v2BaseResponse, List contents, String url) { Map useTime = coreOptRecentManage.findTemplateRecentUseTime(); - Map categoriesMap = getCategoriesBaseV2(); + List categoryVO = getCategoriesObject().stream().filter(node -> !"全部".equalsIgnoreCase(node.getLabel())).collect(Collectors.toList()); + Map categoriesMap = categoryVO.stream() + .collect(Collectors.toMap(MarketMetaDataVO::getValue, MarketMetaDataVO::getLabel)); + List activeCategoriesName = new ArrayList<>(Arrays.asList("最近使用","推荐")); contents.stream().forEach(templateMarketDTO -> { Long recentUseTime = useTime.get(templateMarketDTO.getId()); templateMarketDTO.setRecentUseTime(recentUseTime == null ? 0 : recentUseTime); + activeCategoriesName.add(templateMarketDTO.getMainCategory()); }); if (v2BaseResponse != null) { v2BaseResponse.getItems().stream().forEach(marketTemplateV2ItemResult -> { MarketApplicationSpecVO spec = marketTemplateV2ItemResult.getApplication().getSpec(); contents.add(new TemplateMarketDTO(spec.getReadmeName(), spec.getDisplayName(), spec.getScreenshots().get(0).getUrl(), spec.getLinks().get(0).getUrl(), categoriesMap.get(spec.getLabel()), spec.getTemplateType(), useTime.get(spec.getReadmeName()), spec.getSuggest())); + if(categoriesMap.get(spec.getLabel())!=null){ + activeCategoriesName.add(categoriesMap.get(spec.getLabel())); + } }); } // 最近使用排序 Collections.sort(contents); - return new MarketBaseResponse(url, contents); + return new MarketBaseResponse(url,categoryVO.stream().filter(node->activeCategoriesName.contains(node.getLabel())).collect(Collectors.toList()), contents); } private MarketPreviewBaseResponse basePreviewResponseV2Trans(MarketTemplateV2BaseResponse v2BaseResponse, List manageContents, String url) { @@ -211,7 +219,7 @@ public class TemplateCenterManage { public List getCategoriesObject() { List result = getCategoriesV2(); - result.add(0, new MarketMetaDataVO("recent", "最近使用", "public")); + result.add(0, new MarketMetaDataVO("recent", "最近使用", CommonConstants.TEMPLATE_SOURCE.PUBLIC)); return result; } @@ -232,12 +240,28 @@ public class TemplateCenterManage { String resultStr = marketGet(templateParams.get("template.url") + TEMPLATE_META_DATA_URL, null); MarketMetaDataBaseResponse metaData = JsonUtil.parseObject(resultStr, MarketMetaDataBaseResponse.class); allCategories.addAll(metaData.getLabels()); - allCategories.add(0, new MarketMetaDataVO("suggest", "推荐")); + allCategories.add(0, new MarketMetaDataVO("suggest", "推荐",CommonConstants.TEMPLATE_SOURCE.PUBLIC)); } catch (Exception e) { LogUtil.error("模板市场分类获取错误", e); } - allCategories.addAll(manageCategoriesTrans); - return allCategories; + + return mergeAndDistinctByLabel(allCategories,manageCategoriesTrans); } + + private List mergeAndDistinctByLabel(List list1, List list2) { + List mergedList = new ArrayList<>(list1); + mergedList.addAll(list2); + Map marketMetaDataMap = mergedList.stream() + .collect(Collectors.toMap( + MarketMetaDataVO::getLabel, + Function.identity(), + (existing, replacement) -> { + existing.setSource(CommonConstants.TEMPLATE_SOURCE.PUBLIC); + return existing; + }, + LinkedHashMap::new + )); + return new ArrayList<>(marketMetaDataMap.values()); + } } diff --git a/core/core-frontend/src/views/template-market/index.vue b/core/core-frontend/src/views/template-market/index.vue index b106702baa..5eaf6787f6 100644 --- a/core/core-frontend/src/views/template-market/index.vue +++ b/core/core-frontend/src/views/template-market/index.vue @@ -84,8 +84,10 @@
- -
- {{ - state.marketActiveTab - }} - {{ state.marketActiveTab }} - 的搜索结果是{{ searchResultCount }}个 + +
+ {{ + state.marketActiveTab + }} + {{ + state.marketActiveTab + }} + 的搜索结果是{{ searchResultCount }}个 + + - - - - + + + + +
@@ -216,6 +262,7 @@ const state = reactive({ }, templateType: 'all', templateSourceType: 'all', + treeShow: true, templateSourceOptions: [ { value: 'all', @@ -310,7 +357,12 @@ watch( watch( () => state.templateSourceType, value => { + state.treeShow = false initTemplateShow() + nextTick(() => { + state.treeShow = true + initStyle() + }) } ) @@ -331,13 +383,7 @@ const initMarketTemplate = async () => { .then(rsp => { state.baseUrl = rsp.data.baseUrl state.currentMarketTemplateShowList = rsp.data.contents - }) - .catch(() => { - state.networkStatus = false - }) - getCategoriesObject() - .then(rsp => { - state.marketTabs = rsp.data + state.marketTabs = rsp.data.categories state.marketActiveTab = state.marketTabs[0].label initStyle() initTemplateShow() @@ -419,10 +465,10 @@ const apply = () => { const handleClick = item => { // do handleClick } -const initTemplateShow = () => { +const initTemplateShow = (activeTab = state.marketActiveTab) => { let tempHasResult = false state.currentMarketTemplateShowList.forEach(template => { - template.showFlag = templateShow(template) + template.showFlag = templateShow(template, activeTab) if (template.showFlag) { tempHasResult = true } @@ -432,22 +478,29 @@ const initTemplateShow = () => { } } -const templateShow = templateItem => { +const fullTemplateShowList = curTab => { + state.currentMarketTemplateShowList.forEach(template => { + template.showFlag = templateShow(template, curTab) + }) + return state.currentMarketTemplateShowList.filter(ele => ele.showFlag) +} + +const templateShow = (templateItem, activeTab) => { let categoryMarch = false let searchMarch = false let templateTypeMarch = false let templateSourceTypeMarch = false - if (state.marketActiveTab === '最近使用') { + if (activeTab === '最近使用') { if (templateItem.recentUseTime) { categoryMarch = true } - } else if (state.marketActiveTab === '推荐') { + } else if (activeTab === '推荐') { if (templateItem.suggest === 'Y') { categoryMarch = true } } else { templateItem.categories.forEach(category => { - if (category.name === state.marketActiveTab) { + if (category.name === activeTab) { categoryMarch = true } }) @@ -560,7 +613,7 @@ defineExpose({ height: 100%; background: rgba(239, 240, 241, 1); overflow-y: auto; - padding: 16px 12px; + padding: 0 12px 16px 12px; } .template-empty { @@ -580,6 +633,7 @@ defineExpose({ width: 100%; float: left; height: 24px; + margin-top: 16px; display: inline; .custom-split-line { margin: 4px 8px 0 12px; diff --git a/sdk/api/api-base/src/main/java/io/dataease/api/template/response/MarketBaseResponse.java b/sdk/api/api-base/src/main/java/io/dataease/api/template/response/MarketBaseResponse.java index bbd5381917..b52b85b473 100644 --- a/sdk/api/api-base/src/main/java/io/dataease/api/template/response/MarketBaseResponse.java +++ b/sdk/api/api-base/src/main/java/io/dataease/api/template/response/MarketBaseResponse.java @@ -1,6 +1,7 @@ package io.dataease.api.template.response; import io.dataease.api.template.dto.TemplateMarketDTO; +import io.dataease.api.template.vo.MarketMetaDataVO; import lombok.Data; import java.util.List; @@ -13,16 +14,16 @@ import java.util.List; public class MarketBaseResponse { private String baseUrl; + List categories; + private List contents; public MarketBaseResponse() { } - public MarketBaseResponse(String baseUrl, List contents) { + public MarketBaseResponse(String baseUrl, List categories, List contents) { this.baseUrl = baseUrl; + this.categories = categories; this.contents = contents; } - - - }