2.2 入门

首页

首页位于 src/app/page.tsx，主要用于初始信息加载以及信息展示。

1. 读取配置文件中的信息，缓存到对象

const readAppConfig = async () => {
  const config = await adapter.readAppData();
  if (config) {
    setAppConfig(config);
  }
};

2. 设置了定时器，在 3 秒后进入首页页面。

const timer = setTimeout(() => {
  router.push("/home");
}, 3000);

窗口布局

应用布局如上图，分为三部分：

• 头部：左侧为图标、当前页面标题；右侧为黑暗模式切换按钮，以及窗口最小化、最大化/恢复、关闭按钮
• 左侧：菜单栏，分为顶部和底部菜单；顶部菜单为业务菜单，底部菜单为配置等菜单
• 中间：业务页面展示区域

注意窗口的标题栏由页面自行绘制，相关绘制和处理逻辑位于 src/app/(business)/layout.tsx 中，同时在 tauri 配置中关闭了原生标题栏，配置如下。

src-tauri/tauri.conf.json

{
  "app": {
    "windows": [
      {
        "decorations": false
      }
    ]
  }
}