build / build (push) Successful in 2m50s
回收(§2.2):删本地旧皮肤 layout.css/icons.css/icons.css.bak 及 main.ts 两处 import——消除「接了通道却被本地旧皮肤同优先级盖住」的根因;layout.vue 同批三改:删顶栏房子图标钮、面包屑改 -0.125em 基线流 + icon-category→icon-shouye、getMenuIcon 改读 item.icon 兜底 icon-list。
表格高度(§4.3/§4.4):引入 useElementHeight.ts(与 UserBase 逐字节一致);TablePageAlovaNew 换三端同构版(.table-region + 实测高);4 个列表页清 useTableHeight/ResizeObserver(document.body)/:tableHeight,根节点补 yh-fill;无分页两页不套组件,各包 .table-region + 独立实测。
工具条/tab/操作列(§4.1/§4.2/§5/§8.1):去 size="large"×5;ServiceFormManage 工具条右端说明文案改表格上方常驻 Alert(type=info/show-icon/无 closable);ServiceItemList「同步部门名」归左;ServiceDictManage 去 Tabs type="card" 改 tabs-wrapper yh-fill > main-container yh-tabs-card > Tabs.tabs-panel + 双 tab-body;引入 tableActions.ts,4 页迁 actionColumn({mode:"icon"}),发布/下架等互斥动作改 disabledWhen 置灰保位;h("Tag") 改真组件 ×5。
收尾(P2):view-ui-plus ^1.3.24(lock/node_modules 同版);删死代码 TablePage.vue/TablePageAlova.vue/TreeNode/index copy.vue;main.scss 去 bscroll import 并删文件。未动 service/**、public/libs/**(ztree 仍在用)与规范文档。
111 lines
3.8 KiB
Vue
111 lines
3.8 KiB
Vue
<script setup lang="ts">
|
||
import { ref, reactive, onMounted } from "vue";
|
||
import layout from "./components/layout.vue";
|
||
import { useRouter } from "vue-router";
|
||
import config from "@/assets/config/host.config";
|
||
import { baseApi } from "@/api/module/base";
|
||
import { resolveMenuPage } from "@/utils/menuRoute";
|
||
import { Message } from "view-ui-plus";
|
||
|
||
const router = useRouter();
|
||
const isLogin = ref(false);
|
||
const layoutData = reactive({
|
||
appName: "办事大厅",
|
||
baseHost: config.baseHost,
|
||
ssoHost: config.ssoHost,
|
||
appList: [] as any[],
|
||
userInfo: null as any,
|
||
modList: [] as any[],
|
||
isAlone: false,
|
||
});
|
||
|
||
onMounted(async () => {
|
||
try {
|
||
// 1. 获取当前用户信息
|
||
const user: any = await baseApi.getUserInfo().send();
|
||
const { id, name, profilePicture } = user || {};
|
||
|
||
// 2. 获取当前用户已授权的模块列表
|
||
const modList: any[] = await baseApi.getUserMod().send();
|
||
|
||
layoutData.userInfo = { id, name: name || "管理员", avatar: profilePicture || "" };
|
||
layoutData.modList = modList || [];
|
||
|
||
// 开发环境打印平台原始模块配置,便于排查菜单路径解析问题
|
||
if (import.meta.env.DEV) {
|
||
console.table(
|
||
(modList || []).map((m: any) => ({
|
||
name: m.name,
|
||
id: m.id,
|
||
modId: m.modId,
|
||
path: m.page,
|
||
}))
|
||
);
|
||
}
|
||
|
||
// 有子菜单时不算「单模块独占」模式
|
||
const hasChildren = (modList || []).some((m: any) => m.children && m.children.length > 0);
|
||
layoutData.isAlone = (modList || []).length <= 1 && !hasChildren;
|
||
|
||
isLogin.value = true;
|
||
|
||
// 登录后跳转第一个可用模块("/" 本身即已收到页,无需跳转)
|
||
if (router.currentRoute.value.path === "/") {
|
||
const firstModule = (modList || [])[0];
|
||
const firstRaw = firstModule?.children?.length
|
||
? firstModule.children[0]
|
||
: firstModule;
|
||
const first = resolveMenuPage(firstRaw?.page, firstRaw?.modId ?? firstRaw?.id, firstRaw?.name);
|
||
if (!first.external && first.path && first.path !== "/") {
|
||
router.replace(first.path);
|
||
}
|
||
}
|
||
} catch (error: any) {
|
||
console.error("加载用户信息失败", error);
|
||
if (error?.message !== "redirect") {
|
||
Message.error("载入用户信息失败,请检查后端服务是否正常!");
|
||
}
|
||
// 降级:使用默认值("/" 即已收到页,无需跳转)
|
||
layoutData.userInfo = { name: "管理员", avatar: "" };
|
||
layoutData.modList = [];
|
||
layoutData.isAlone = true;
|
||
isLogin.value = true;
|
||
}
|
||
});
|
||
</script>
|
||
|
||
<template>
|
||
<layout v-if="isLogin" :layoutData="layoutData" />
|
||
<div v-if="isLogin" class="base-wrap-main" :class="{ 'alone-page': layoutData.isAlone }">
|
||
<div class="main-wrapper">
|
||
<!-- key=fullPath:详情页仅 query 变化(id/serid)时强制重渲染,避免显示上一条数据 -->
|
||
<router-view :key="$route.fullPath" />
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<style lang="scss">
|
||
html,
|
||
body {
|
||
margin: 0;
|
||
padding: 0;
|
||
height: 100%;
|
||
overflow: hidden;
|
||
}
|
||
#app {
|
||
height: 100%;
|
||
}
|
||
/* 页面级滚动容器:main-wrapper 只有 min-height 时内容超一屏会被 body 的
|
||
overflow:hidden 直接裁掉(如发通知页),无任何滚动条。定高 + 纵向滚动,
|
||
列表页表格高度由 useElementHeight 实测 .table-region 得出,不依赖此处滚动 */
|
||
.base-wrap-main .main-wrapper {
|
||
height: 100%;
|
||
overflow-y: auto;
|
||
}
|
||
/* 表格操作列(operatingHandle 渲染的 Tooltip 包裹层)横排且随单元格居中 */
|
||
.ivu-table-cell > .ivu-tooltip {
|
||
display: inline-block;
|
||
vertical-align: middle;
|
||
margin: 0 2px;
|
||
}
|
||
</style> |