feat(W2): 栏目树修订-虚拟根(学校名/子站名)+工具栏收敛4按钮+高度链修复,T-W2-01..10 绿 44/44
This commit is contained in:
@@ -10,13 +10,11 @@ import { categoryApi } from "@/api/module/cms";
|
||||
import { useCmsStore } from "@/store";
|
||||
import config from "@/assets/config/host.config";
|
||||
import { CategoryTreeNode } from "@/types/cms";
|
||||
import { rootLabelOf, wrapTreeWithRoot } from "@/utils/categoryTree";
|
||||
|
||||
/* UserBase group/index 同款交互:图标工具栏(新增/编辑/子组排序/删除/搜索)+ ztree */
|
||||
/* UserBase group/index 同款交互:图标工具栏(新增/编辑/子组排序/删除)+ ztree(W2:搜索/收起展开按钮移除) */
|
||||
const store = useCmsStore();
|
||||
|
||||
/** 树折叠(窄屏/专注内容时收起左树,右侧面板占满;不触碰 ztree 内部交互) */
|
||||
const treeCollapsed = ref(false);
|
||||
|
||||
const refTreePanel = useTemplateRef("refTreePanel");
|
||||
const refFormData = useTemplateRef("refFormData");
|
||||
const refNodeNameInput = useTemplateRef("refNodeNameInput");
|
||||
@@ -58,9 +56,13 @@ const rules = {
|
||||
type: [{ required: true, type: "number", message: "请选择类型", trigger: "change" }],
|
||||
};
|
||||
|
||||
/** 树数据源(CategoryTreePanel 拉取用;站点切换即时重载) */
|
||||
function loadTreeApi(): Promise<CategoryTreeNode[]> {
|
||||
return categoryApi.tree(store.siteId!).send() as Promise<CategoryTreeNode[]>;
|
||||
/** 根节点 label(W2 虚拟根,D5):主站=学校名(缺省回退 mainSiteName),子站=子站名;随站点上下文响应 */
|
||||
const rootLabel = computed(() => rootLabelOf({ currentSchool: store.currentSchool, currentSite: store.currentSite }));
|
||||
|
||||
/** 树数据源(CategoryTreePanel 拉取用;站点切换即时重载;W2:包装虚拟根后返回) */
|
||||
async function loadTreeApi(): Promise<CategoryTreeNode[]> {
|
||||
const tree = await categoryApi.tree(store.siteId!).send();
|
||||
return [wrapTreeWithRoot(tree as any[], rootLabel.value)];
|
||||
}
|
||||
|
||||
// 站点上下文切换即时重载(docs/09 §3.3,修复切换不刷新缺陷)
|
||||
@@ -231,7 +233,7 @@ function openLink(url: string) {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="tree-wrapper category-page" :class="{ 'tree-collapsed': treeCollapsed }">
|
||||
<div class="tree-wrapper category-page">
|
||||
<!-- 左侧栏目树(userbase rule-tree 风格) -->
|
||||
<div class="tree-container category-tree-box">
|
||||
<ul class="opera-ul">
|
||||
@@ -255,16 +257,6 @@ function openLink(url: string) {
|
||||
<SvgIcon name="tree-icon-5" />
|
||||
</li>
|
||||
</Tooltip>
|
||||
<Tooltip content="搜索栏目" placement="top" transfer>
|
||||
<li class="search-node-li" @click="refTreePanel?.openSearch()">
|
||||
<Icon type="md-search" />
|
||||
</li>
|
||||
</Tooltip>
|
||||
<Tooltip content="收起/展开栏目树" placement="top" transfer>
|
||||
<li @click="treeCollapsed = !treeCollapsed">
|
||||
<Icon :type="treeCollapsed ? 'ios-arrow-forward' : 'ios-arrow-back'" />
|
||||
</li>
|
||||
</Tooltip>
|
||||
</ul>
|
||||
|
||||
<CategoryTreePanel
|
||||
@@ -433,8 +425,7 @@ function openLink(url: string) {
|
||||
}
|
||||
}
|
||||
|
||||
.add-node-li,
|
||||
.search-node-li {
|
||||
.add-node-li {
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
@@ -450,17 +441,6 @@ function openLink(url: string) {
|
||||
}
|
||||
}
|
||||
|
||||
/* 树折叠态:隐藏左树,右侧面板占满(覆盖全局 .tree-wrapper .main-container 的 264px 边距) */
|
||||
.category-page.tree-collapsed {
|
||||
.tree-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.main-container {
|
||||
margin-left: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.info-panel {
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
|
||||
Reference in New Issue
Block a user