---
title: 认识 Web 管理端
description: 登录班级小助手 Web 管理端，认一认 12 个页面、新手引导与手机端布局。
---

# 认识 Web 管理端

Web 管理端不用装：服务端起来之后，浏览器打开 `http://<服务器地址>:4000/` 就是它。

## 登录

用**教师 / 管理员账号**登录（用户名 + 密码）。学生没有个人账号，学生那一端走
[班级码 + 班级密码](client.md)，见[班级、学生与教师](../app/classes.md)。

- 新装的服务端只有安装时创建的那一个管理员账号。**第一次登录后请立刻在顶栏头像菜单 → 修改密码里改掉它。**
- 登录页**不含任何演示内容**（没有"点击填充示例账号"之类的按钮），也不会提示种子口令。
- 连不上服务器时页面会直接失败，不会静默重试 —— 先确认服务端在跑、端口对、没走代理。

## 界面

布局沿用 1Panel 那一套：左边固定深色侧边栏，右边浅灰底 + 白色圆角卡片。

| 页面             | 干什么                                         | 谁能进                 |
| ---------------- | ---------------------------------------------- | ---------------------- |
| 仪表盘           | 全校 / 本班的汇总数字与最近动态                | 所有登录用户           |
| 课表管理         | 排课、导入 ClassIsland 课表、节次时间          | 管理员、本班班主任     |
| 作业发布         | 发作业、按天查看、看未交名单                   | 教师、管理员、班级账号 |
| 通知发布         | 发通知、发叫人                                 | 教师、管理员           |
| 成绩录入         | 单条 / 批量录成绩、导入表格、看统计            | 管理员、本班班主任     |
| ClassIsland 联动 | 接入教室设备、下发提醒、看实时状态、开镜像     | 管理员、教师           |
| 班级管理         | 建班级、换班主任、改班级账号                   | **仅管理员**           |
| 学生管理         | 学生名单增删、导入                             | **仅管理员**           |
| 教师管理         | 教师账号增删改、导入名单、重置密码             | **仅管理员**           |
| 数据库管理       | 备份 / 恢复、导出导入、一键切换 SQLite ⇄ MySQL | **仅管理员**           |
| 检查更新         | 顶栏头像菜单里，查 GitHub 上有没有新版本       | 所有登录用户           |

> **前端隐藏 ≠ 权限**。上面这张表只是"入口藏不藏"，每一条写入请求服务端都会再判一次
> （见[角色与权限](../dev/permissions.md)）。直接输网址绕过菜单，一样会被挡回仪表盘。

## 第一次登录的引导

首次登录进入主布局后会自动弹一次聚焦式引导，依次指出：侧边菜单 → 实时通道状态 → 账号菜单 → 完成。
走完或跳过（右上角 × 或 Esc）都记作"已看过"，之后不再自动弹。

想重看：**右上角头像菜单 →「使用引导」**。

## 手机 / 平板

| 屏幕宽度  | 布局                                                   |
| --------- | ------------------------------------------------------ |
| > 992px   | 常驻 210px 深色侧边栏 + 顶栏显示连接状态与实时事件计数 |
| 769–992px | 保留侧边栏，内容区内边距压缩                           |
| ≤ 768px   | 侧边栏收进抽屉，顶栏汉堡按钮唤出；表格在卡片内横向滚动 |

手机上（与电脑同一局域网）用 `http://<主机IP>:4000` 打开，可以「添加到主屏幕」当 App 用（PWA）。
做成 HTTPS 之后 PWA 才能完全离线化，见[生产部署指南](../management/production.md)。

下一步：[建班级、排课表](setup-class.md)。