Merge pull request #6951 from dataease/pr@dev-v2@style_UI-UPDATE

style: UI调整
This commit is contained in:
王嘉豪 2023-11-30 23:16:16 +08:00 committed by GitHub
commit 93a7b23180
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 98 additions and 61 deletions

View File

@ -29,14 +29,8 @@ import java.util.stream.Collectors;
*/
@Service
public class TemplateCenterManage {
private final static String POSTS_API = "/api/content/posts?page=0&size=2000";
private final static String POSTS_API_V2 = "/apis/api.store.halo.run/v1alpha1/applications?keyword=&priceMode=&sort=latestReleaseTimestamp%2Cdesc&type=THEME&deVersion=V2&templateType=&label=&page=1&size=2000";
private final static String CATEGORIES_API = "/api/content/categories";
private final static String TEMPLATE_META_DATA_URL = "/upload/meta_data.json";
@Resource
private SysParameterManage sysParameterManage;
@ -127,14 +121,35 @@ public class TemplateCenterManage {
public MarketPreviewBaseResponse searchTemplatePreview() {
try {
Map<String, String> templateParams = sysParameterManage.groupVal("template.");
return basePreviewResponseV2Trans(templateQuery(templateParams), searchTemplateFromManage(), templateParams.get("template.url"));
MarketBaseResponse baseContentRsp = searchTemplate();
List<MarketMetaDataVO> categories = baseContentRsp.getCategories().stream().filter(category -> !"最近使用".equals(category.getLabel())).collect(Collectors.toList());
List<TemplateMarketDTO> contents = baseContentRsp.getContents();
List<TemplateMarketPreviewInfoDTO> previewContents = new ArrayList<>();
categories.forEach(category -> {
if ("推荐".equals(category.getLabel())) {
previewContents.add(new TemplateMarketPreviewInfoDTO(category, contents.stream().filter(template -> "Y".equals(template.getSuggest())).collect(Collectors.toList())));
} else {
previewContents.add(new TemplateMarketPreviewInfoDTO(category, contents.stream().filter(template -> checkCategoryMatch(template, category.getLabel())).collect(Collectors.toList())));
}
});
return new MarketPreviewBaseResponse(baseContentRsp.getBaseUrl(), categories.stream().map(MarketMetaDataVO::getLabel)
.collect(Collectors.toList()), previewContents);
} catch (Exception e) {
LogUtil.error(e);
}
return null;
}
private Boolean checkCategoryMatch(TemplateMarketDTO template, String categoryNameMatch) {
try {
return template.getCategories().stream()
.anyMatch(category -> categoryNameMatch.equals(category.getName()));
} catch (Exception e) {
e.printStackTrace();
return false;
}
}
private MarketBaseResponse baseResponseV2TransRecommend(MarketTemplateV2BaseResponse v2BaseResponse, String url) {
Map<String, Long> useTime = coreOptRecentManage.findTemplateRecentUseTime();
List<MarketMetaDataVO> categoryVO = getCategoriesV2().stream().filter(node -> !"全部".equalsIgnoreCase(node.getLabel())).collect(Collectors.toList());
@ -151,7 +166,7 @@ public class TemplateCenterManage {
}
// 最近使用排序
Collections.sort(contents);
return new MarketBaseResponse(url,categoryVO, contents);
return new MarketBaseResponse(url, categoryVO, contents);
}
private MarketBaseResponse baseResponseV2Trans(MarketTemplateV2BaseResponse v2BaseResponse, List<TemplateMarketDTO> contents, String url) {
@ -159,7 +174,7 @@ public class TemplateCenterManage {
List<MarketMetaDataVO> categoryVO = getCategoriesObject().stream().filter(node -> !"全部".equalsIgnoreCase(node.getLabel())).collect(Collectors.toList());
Map<String, String> categoriesMap = categoryVO.stream()
.collect(Collectors.toMap(MarketMetaDataVO::getValue, MarketMetaDataVO::getLabel));
List<String> activeCategoriesName = new ArrayList<>(Arrays.asList("最近使用","推荐"));
List<String> activeCategoriesName = new ArrayList<>(Arrays.asList("最近使用", "推荐"));
contents.stream().forEach(templateMarketDTO -> {
Long recentUseTime = useTime.get(templateMarketDTO.getId());
templateMarketDTO.setRecentUseTime(recentUseTime == null ? 0 : recentUseTime);
@ -169,46 +184,14 @@ public class TemplateCenterManage {
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){
if (categoriesMap.get(spec.getLabel()) != null) {
activeCategoriesName.add(categoriesMap.get(spec.getLabel()));
}
});
}
// 最近使用排序
Collections.sort(contents);
return new MarketBaseResponse(url,categoryVO.stream().filter(node->activeCategoriesName.contains(node.getLabel())).collect(Collectors.toList()), contents);
}
private MarketPreviewBaseResponse basePreviewResponseV2Trans(MarketTemplateV2BaseResponse v2BaseResponse, List<TemplateMarketDTO> manageContents, String url) {
Map<String, Long> useTime = coreOptRecentManage.findTemplateRecentUseTime();
List<MarketMetaDataVO> categoryVO = getCategoriesV2();
Map<String, String> categoriesMap = categoryVO.stream()
.collect(Collectors.toMap(MarketMetaDataVO::getSlug, MarketMetaDataVO::getLabel));
List<String> categories = categoryVO.stream().filter(node -> !"全部".equalsIgnoreCase(node.getLabel())).map(MarketMetaDataVO::getLabel)
.collect(Collectors.toList());
List<TemplateMarketPreviewInfoDTO> result = new ArrayList<>();
categoriesMap.forEach((key, value) -> {
if (!"全部".equalsIgnoreCase(value)) {
List<TemplateMarketDTO> contents = new ArrayList<>();
if (v2BaseResponse != null) {
v2BaseResponse.getItems().stream().forEach(marketTemplateV2ItemResult -> {
MarketApplicationSpecVO spec = marketTemplateV2ItemResult.getApplication().getSpec();
if (key.equalsIgnoreCase(spec.getLabel())) {
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()));
}
});
}
manageContents.stream().forEach(templateMarketDTO -> {
if (value.equalsIgnoreCase(templateMarketDTO.getMainCategory())) {
contents.add(templateMarketDTO);
}
});
Collections.sort(contents);
result.add(new TemplateMarketPreviewInfoDTO(value, contents));
}
});
// 最近使用排序
return new MarketPreviewBaseResponse(url, categories, result);
return new MarketBaseResponse(url, categoryVO.stream().filter(node -> activeCategoriesName.contains(node.getLabel())).collect(Collectors.toList()), contents);
}
@ -240,12 +223,12 @@ 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", "推荐",CommonConstants.TEMPLATE_SOURCE.PUBLIC));
allCategories.add(0, new MarketMetaDataVO("suggest", "推荐", CommonConstants.TEMPLATE_SOURCE.PUBLIC));
} catch (Exception e) {
LogUtil.error("模板市场分类获取错误", e);
}
return mergeAndDistinctByLabel(allCategories,manageCategoriesTrans);
return mergeAndDistinctByLabel(allCategories, manageCategoriesTrans);
}

View File

@ -23,7 +23,6 @@
<el-row class="margin-top16 search-area">
<el-input
v-model="state.searchText"
size="small"
prefix-icon="Search"
class="title-name-search"
:placeholder="t('visualization.enter_template_name_tips')"
@ -36,15 +35,24 @@
><Filter
/></el-icon>
</el-row>
<el-row v-show="state.extFilterActive">
<el-select v-model="state.templateType" style="margin-top: 8px" placeholder="请选择">
<el-option
v-for="item in state.templateTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-row>
<el-row v-show="state.extFilterActive">
<el-select
v-model="state.templateType"
class="margin-top16"
size="small"
v-model="state.templateSourceType"
style="margin-top: 8px"
placeholder="请选择"
>
<el-option
v-for="item in state.templateTypeOptions"
v-for="item in state.templateSourceOptions"
:key="item.value"
:label="item.label"
:value="item.value"
@ -63,9 +71,10 @@
<el-collapse-item
themes="light"
v-for="(categoryTemplate, index) in state.marketTemplatePreviewShowList"
:name="categoryTemplate['categoryType']"
v-show="categoryTemplate['showFlag']"
:name="categoryTemplate['category'].label"
:key="index"
:title="categoryTemplate['categoryType']"
:title="categoryTemplate['category'].label"
>
<template-market-preview-item
v-for="templateItem in categoryTemplate['contents']"
@ -125,6 +134,10 @@ const props = defineProps({
previewId: {
type: String,
default: null
},
templateShowList: {
type: Array,
default: () => []
}
})
@ -148,6 +161,21 @@ const state = reactive({
categories: [],
networkStatus: true,
curTemplate: null,
templateSourceType: 'all',
templateSourceOptions: [
{
value: 'all',
label: '全部来源'
},
{
value: 'market',
label: '模板市场'
},
{
value: 'manage',
label: '模板管理'
}
],
templateType: 'all',
templateTypeOptions: [
{
@ -192,6 +220,13 @@ watch(
}
)
watch(
() => state.templateSourceType,
value => {
initTemplateShow()
}
)
const initMarketTemplate = () => {
searchMarketPreview()
.then(rsp => {
@ -241,6 +276,7 @@ const handleClick = item => {
const initTemplateShow = () => {
state.hasResult = false
state.marketTemplatePreviewShowList.forEach(categoryTemplates => {
categoryTemplates.showFlag = categoryShow(categoryTemplates.category.source)
categoryTemplates.contents.forEach(template => {
template.showFlag = templateShow(template)
if (template.showFlag) {
@ -251,16 +287,28 @@ const initTemplateShow = () => {
activeCategories.value = deepCopy(state.categories)
}
const categoryShow = sourceMatch => {
return (
state.templateSourceType === 'all' ||
sourceMatch === state.templateSourceType ||
sourceMatch === 'public'
)
}
const templateShow = templateItem => {
let templateTypeMarch = false
let searchMarch = false
let templateSourceTypeMarch = false
if (state.templateType === 'all' || templateItem.templateType === state.templateType) {
templateTypeMarch = true
}
if (!state.searchText || templateItem.title.indexOf(state.searchText) > -1) {
searchMarch = true
}
return templateTypeMarch && searchMarch
if (state.templateSourceType === 'all' || templateItem.source === state.templateSourceType) {
templateSourceTypeMarch = true
}
return templateTypeMarch && searchMarch && templateSourceTypeMarch
}
const previewTemplate = template => {

View File

@ -526,7 +526,10 @@ const templatePreview = previewId => {
state.templatePreviewId = previewId
previewModel.value = 'marketPreview'
} else {
state.curTemplateShowFilter = state.currentMarketTemplateShowList.filter(ele => ele.showFlag)
state.curTemplateShowFilter =
state.marketActiveTab === '推荐'
? state.currentMarketTemplateShowList
: state.currentMarketTemplateShowList.filter(ele => ele.showFlag)
state.curTemplateIndex = state.curTemplateShowFilter.findIndex(temp => temp.id === previewId)
state.curTemplate = state.curTemplateShowFilter[state.curTemplateIndex]
previewModel.value = 'createPreview'

View File

@ -1,5 +1,6 @@
package io.dataease.api.template.dto;
import io.dataease.api.template.vo.MarketMetaDataVO;
import lombok.Data;
import lombok.NoArgsConstructor;
@ -13,12 +14,14 @@ import java.util.List;
@NoArgsConstructor
public class TemplateMarketPreviewInfoDTO {
private String categoryType;
private MarketMetaDataVO category;
private Boolean showFlag = true;
List<TemplateMarketDTO> contents;
public TemplateMarketPreviewInfoDTO(String categoryType, List<TemplateMarketDTO> contents) {
this.categoryType = categoryType;
public TemplateMarketPreviewInfoDTO(MarketMetaDataVO category, List<TemplateMarketDTO> contents) {
this.category = category;
this.contents = contents;
}
}

View File

@ -2,7 +2,9 @@ package io.dataease.api.template.response;
import io.dataease.api.template.dto.TemplateMarketDTO;
import io.dataease.api.template.dto.TemplateMarketPreviewInfoDTO;
import io.dataease.api.template.vo.MarketMetaDataVO;
import lombok.Data;
import lombok.NoArgsConstructor;
import java.util.List;
@ -11,6 +13,7 @@ import java.util.List;
* @date : 2023/11/6 17:43
*/
@Data
@NoArgsConstructor
public class MarketPreviewBaseResponse {
private String baseUrl;
@ -18,9 +21,6 @@ public class MarketPreviewBaseResponse {
private List<TemplateMarketPreviewInfoDTO> contents;
public MarketPreviewBaseResponse() {
}
public MarketPreviewBaseResponse(String baseUrl, List<String> categories, List<TemplateMarketPreviewInfoDTO> contents) {
this.baseUrl = baseUrl;
this.categories = categories;