# 校园公告前端(Vue3 + Vite + view-ui-plus) ## 本地启动 ```bash npm install ``` ### 1)纯前端调试(推荐,后端不可用时) 本地连不上 `sso.yunhaixingtong.com` / `base.yunhaixingtong.com` 时,后端 CAS 过滤器会拦截 `/api/*` 请求导致所有接口失败。此时使用内置 mock 调试前端页面: ```bash npm run dev:mock ``` - 启用 `src/assets/mock/noticeapi.ts` 中的内存 mock(vite-plugin-mock),覆盖全部页面接口: 用户/菜单、发文部门字典、通知增删改查、阅读情况、联系组、选择用户树、附件上传等。 - mock 数据为内存态,刷新页面即还原;修改 mock 文件后需重启 dev server 才生效。 - mock 模式下请求走 vite 同源(`host.config.ts` 中 `serviceHost` 为空串)。 ### 2)连接后端调试 ```bash npm run dev ``` - `.env.dev`:`VITE_SERVICE_HOST=http://localhost:8070/notice`(Java 后端,见 `../service`)。 - 后端需要能访问 CAS(`yh.sso.server-url-prefix`)与用户中心(`yh.open.*`),否则接口 302/失败。 ## 信息架构(对齐后端测试台 api-test.html 六视图) | 路由 | 页面 | | --- | --- | | `/` | 我的通知(左列表 + 右详情;未读/已读/类型筛选,三 tab 带条数 `notice/ReadTabCount`;详情 `上一篇/下一篇`(`notice/GetNextPrev?type=1`)+ 打印;附件/回执提示) | | `/list` | 已发管理(状态/类型筛选、审批进度、撤回/置顶/催读/转发、阅读回执、驳回重提) | | `/list/new` | 写通知(新建/编辑 `?serid=`/草稿续编/转发 `?fid=`;推送范围+预估、回执勾选、直接发布/存草稿/提交审批三态) | | `/drafts` | 草稿箱(继续编辑/提交审批/删除) | | `/noticelist` | 全部通知(管理端) | | `/approval` | 审批中心(待我审批/已通过/已驳回/全部,多步流程进度) | | `/approval-setting` | 审核设置(审批人池) | | `/stats` | 通知统计(开发中) | | `/setting` | 应用设置(发文部门卡片 + 自定义组) | | `/list/detail` `/noticelist/detail` | 通知详情(`type=0` 管理视角含阅读进度/审批轨迹/编辑/打印,`type=1` 查看) | > 旧版路径(`/notice/*`、`/accept`、`/manage` 等)已保留重定向兼容。 ## 关键组件 - `components/PushScopePanel.vue`:推送范围面板(全校/学段/年级/班级树 + chips + ScopePreview 接收人数预估,`notice/ScopeTree`)。 - `components/ApprovalFlowEditor.vue`:多步审批流编辑器(或签/会签、步骤排序)。 - `components/UserCheckModal.vue`:选择用户弹窗(组织树勾选 + 已选列表,移植自旧前端 `oldfront/src/components/userCheck.vue`)。 - `components/NoticeUpload.vue`:通知附件上传(选择文件 + 200MB 限制,移植自旧 `uploadFile.vue`)。 - `utils/noticePrint.ts`:公告打印公共工具(v17)。「已收到」与「通知详情」共用,打印件含 标题/来源·发布人·发布时间/接收范围/正文/附件文件名清单/打印时间;`buildPrintHtml` 为纯函数, 可被 `.scratch` 脚本直接断言(弹窗被浏览器拦截时 `printNotice` 返回 false 由页面提示)。 - 发文部门卡片:见 `views/notice/NoticeSetting.vue`,样式与交互对齐 UserBase「应用类型」 (`UserBase/front/src/views/app/AppCategory.vue`),额外支持停用/启用。 ## 菜单说明 左侧菜单数据源为平台用户中心 `base/GetUserMod`(库表配置)。**栏目名称直接显示接口返回的 `name`,前端不做改名**(v10 起已移除原 `MENU_NAME_MAP` 展示层映射):在平台管理后台把模块名 改成「我的通知 / 已发管理 / …」,前端刷新即生效;平台仍配旧叫法则显示旧叫法。 应用内保留三层处理(`components/layout.vue` + `utils/menuRoute.ts`): 1. 平台配置的 `page` 格式不可控,统一解析为内部路由(path 精确 → 原始模块名别名 → 外链整页 跳转 → `modId` 契约兜底);解析使用接口原始 `name`,与显示名互不影响,配错时显式提示而非静默跳默认页; 2. 「草稿箱」菜单项注入(平台无对应模块,挂「已发管理」之后),无需改动平台模块表; 3. 栏目顺序按接口 `orderNumber` 升序(`utils/menuRoute.ts` `sortByOrderNumber`,v11):后端 `GetUserMod` 保持用户中心返回行序不重排,排序在前端完成,平台改模块「排序号」即换序; `orderNumber` 缺失/非数值的项沉底,同值保持接口原序。 `assets/config/menu.ts` 为早期本地菜单兜底数据,现已无引用,仅作历史参考。 ## 统计说明 统计相关前端已按需求移除(`Notice_statis` 接口封装、菜单、图标等),后期统计不在本应用内做。