feat(ui): 在项目详情页面添加配置类型标签显示
- 在项目名称旁添加配置类型标签 - 默认配置显示蓝色"默认配置"标签 - 自定义配置显示橙色"自定义配置"标签 - 添加 getConfigTypeLabel 和 getConfigTypeStyle 方法 - 为标签添加左边距以改善视觉效果 - 纯前端实现,无需后端修改 Ref: docs/plans/2026-03-09-param-config-type-display-design.md
This commit is contained in:
@@ -17,6 +17,14 @@
|
|||||||
>
|
>
|
||||||
{{ getStatusLabel(projectInfo.projectStatus) }}
|
{{ getStatusLabel(projectInfo.projectStatus) }}
|
||||||
</el-tag>
|
</el-tag>
|
||||||
|
<!-- 配置类型标签 -->
|
||||||
|
<el-tag
|
||||||
|
:type="getConfigTypeStyle(projectInfo.configType)"
|
||||||
|
size="small"
|
||||||
|
style="margin-left: 8px"
|
||||||
|
>
|
||||||
|
{{ getConfigTypeLabel(projectInfo.configType) }}
|
||||||
|
</el-tag>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="update-time">
|
<p class="update-time">
|
||||||
@@ -219,6 +227,22 @@ export default {
|
|||||||
};
|
};
|
||||||
return statusMap[status] || "未知";
|
return statusMap[status] || "未知";
|
||||||
},
|
},
|
||||||
|
/** 获取配置类型标签文字 */
|
||||||
|
getConfigTypeLabel(configType) {
|
||||||
|
const configTypeMap = {
|
||||||
|
"default": "默认配置",
|
||||||
|
"custom": "自定义配置"
|
||||||
|
}
|
||||||
|
return configTypeMap[configType] || "默认配置"
|
||||||
|
},
|
||||||
|
/** 获取配置类型标签样式 */
|
||||||
|
getConfigTypeStyle(configType) {
|
||||||
|
const styleMap = {
|
||||||
|
"default": "info", // 蓝色
|
||||||
|
"custom": "warning" // 橙色
|
||||||
|
}
|
||||||
|
return styleMap[configType] || "info"
|
||||||
|
},
|
||||||
/** 标签页切换 */
|
/** 标签页切换 */
|
||||||
handleTabChange(tab) {
|
handleTabChange(tab) {
|
||||||
console.log("切换到标签页:", tab.name);
|
console.log("切换到标签页:", tab.name);
|
||||||
|
|||||||
Reference in New Issue
Block a user