docs: 重写 README(原为 Notice 前端副本)+ 修正 context-path 注释
build / build (push) Successful in 4m51s

- README.md 整篇是通知公告前端的副本(标题「通知公告前端」、/notice/* 路由表、
  src/assets/mock/noticeapi.ts、NoticeUpload.vue、VITE_SERVICE_HOST=.../notice 等
  本仓不存在的文件),仓库唯一人类可读文档描述的是另一个应用 → 按本仓实际代码重写:
  启动/脚本/运行期配置优先级、路由与 modId 契约、目录要点、表单 schema 契约纪律
  (行不可变→已发布版本保存不传 id)、CI 构建发布链路、验收口径(vue-tsc 不可用)
- host.config.ts:注释里残留「base/prod /notice」,本应用 context-path 是 /svc-hall
This commit is contained in:
chenxing
2026-09-16 22:24:04 +08:00
parent 1810c6a560
commit 6d972fe0cc
2 changed files with 63 additions and 38 deletions
+62 -37
View File
@@ -1,56 +1,81 @@
# 通知公告前端(Vue3 + Vite + view-ui-plus)
# 办事大厅前端(svc-hall-front)
云海平台子应用:办事大厅(事项库 + 自定义表单 + 办件记录)。Vue 3 + Vite + view-ui-plus + alova。
> 说明:本文件此前误为本仓 Notice(通知公告)前端的副本(描述 `/notice/*` 路由、
> `src/assets/mock/noticeapi.ts`、`NoticeUpload.vue` 等本仓不存在的文件),2026-09-16
> 依据本仓实际代码重写。
## 本地启动
```bash
npm install
npm run dev # http://localhost:8087
```
### 1)纯前端调试(推荐,后端不可用时)
`dev` 模式下 `serviceHost` 留空,接口走同源相对路径 `/api/...`,由 vite proxy 转发到本地后端
`http://localhost:8086`(后端 CAS 过滤器对 `/api/*` 不回 CORS 头,浏览器直连会被拦,必须同源代理)。
本地连不上 `sso.yunhaixingtong.com` / `base.yunhaixingtong.com` 时,后端 CAS 过滤器会拦截
`/api/*` 请求导致所有接口失败。此时使用内置 mock 调试前端页面:
本地完整链路还需:UserBase(base/sso 鉴权)、流程中心 `http://localhost:8085`(撤回、查看进度)。
另有 `npm run dev:mock`(`.env.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` 为空串)。
| 命令 | 说明 |
|---|---|
| `npm run dev` | 本地联调(读 `.env.dev`) |
| `npm run dev:mock` | 纯前端模式(读 `.env.mock`;mock 中间件仅在 `--mode mock` 启用) |
| `npm run build` / `build:base` / `build:ld` / `build:prod` | 构建产物恒为 `dist` 根(CI 打包要求 zip 根直接有 `index.html`,见 `vite.config.ts` 头注) |
| `npm run api:gen` | alova 接口代码生成 |
### 2)连接后端调试
## 运行期配置
```bash
npm run dev
```
优先级见 `src/assets/config/host.config.ts`:① 线上 `window.__APP_CONFIG__`(`index.html` 引导脚本同步拉
`/<contextPath>/api/env-config?target=front`,projman 配置管理维护)→ ② 本地 `import.meta.env.VITE_*`
(build 产物不读任何 `.env.*`)→ ③ 同域推导兜底。
- `.env.dev`:`VITE_SERVICE_HOST=http://localhost:8070/notice`(Java 后端,见 `../service`)。
- 后端需要能访问 CAS(`yh.sso.server-url-prefix`)与用户中心(`yh.open.*`),否则接口 302/失败。
## 页面与路由(`src/router/routes.ts`)
## 主要页面
| 路径 | 页面 | modId |
|---|---|---|
| `/svc/item` | 办事事项(管理面) | 23 |
| `/svc/item/edit` | 编辑事项 | 28(parentId 23) |
| `/svc/dict` | 服务字典 | 24 |
| `/svc/form` | 表单管理 | 25 |
| `/svc/form/designer` | 表单设计器(拖拽三栏,`?id=` 回填) | 25(parentId 25) |
| `/svc/apply` | 办件记录(管理面) | 26 |
| `/my` | 我的办件(用户面) | 27 |
| `/apply` | 在线办理(用户面,query 传 `siteCode`/`itemCode`) | 不挂菜单 |
| `/apply-detail` | 办件详情(用户面,query 传 `id`) | 不挂菜单 |
| 路由 | 页面 |
| --- | --- |
| `/notice/newnotice` | 通知发送(新建/编辑 `?serid=`/转发 `?fid=`,wangeditor 富文本) |
| `/notice/notice_list` | 已发通知 |
| `/notice/notice_accept` | 已收通知(左列表 + 右详情,打印/转发/附件) |
| `/notice/manage` | 通知列表(管理端) |
| `/notice/setting` | 应用设置(发文部门卡片 + 自定义组) |
| `/notice/notice_details` | 通知详情(`type=0` 管理视角含阅读进度/编辑/打印,`type=1` 查看) |
`modId` 是菜单 ↔ 路由的稳定契约(UserBase `app_module` 按本应用 appKey 配置);`/` 与未匹配路径都回落
`/my`(详情页走 query 传参,拼成路径参数会 no-match)。
## 关键组件
## 目录要点
- `components/UserCheckModal.vue`:选择用户弹窗(组织树勾选 + 已选列表,移植自旧前端
`oldfront/src/components/userCheck.vue`)。
- `components/UserCheckInput.vue`:通知对象选择(全部用户/指定用户,移植自旧
`user_check_input.vue`)。
- `components/NoticeUpload.vue`:通知附件上传(选择文件 + 200MB 限制,移植自旧
`uploadFile.vue`)。
- 发文部门卡片:见 `views/notice/NoticeSetting.vue`,样式与交互对齐 UserBase「应用类型」
(`UserBase/front/src/views/app/AppCategory.vue`),额外支持停用/启用。
- `src/api/module/svc.ts`:接口封装(alova;`siteApi`/`svcItemApi`/`svcDictApi`/`svcFormApi`/`svcFlowApi`/`applyApi`/`fileApi`)
- `src/utils/site.ts`:当前站点上下文(`localStorage.svchall.site` 持久化,管理页共用)
- `src/components/DynamicForm.vue`:表单 schema 渲染器(`{groups:[{title,fields:[…]}]}`,一期 11 类控件;
多选类值为 `string[]`,附件/图片为上传返回体数组 `[{id,fileName,fileUrl,fileSize,mimeType}]`)
- `src/views/svc/FormDesigner.vue` + `src/components/designer/*`:拖拽设计器(左组件库/中多分组画布/右属性面板,保存前可预览)
- `src/types/designer.ts`、`src/utils/designer/schema.ts`:设计器类型、控件字典与 schema 序列化
## 统计说明
## 契约纪律(改表单相关代码前必读)
统计相关前端已按需求移除(`Notice_statis` 接口封装、菜单、图标等),后期统计不在本应用内做。
- schema 由后端 `FormValidator` 强校验:属性白名单 16 项(无 `precision`)、`key` 限
`^[A-Za-z0-9_]{1,64}$` 且表单内唯一、`select/radio/checkbox/multiselect` 必须有非空 `options`、
`maxSize` 单位 **MB**、`maxFiles` 缺省或 0=不限。设计器序列化只输出白名单键(剔除内部 `_uid` 与空串)。
- 表单行不可变:已发布版本改结构 = 后端按 `code` 克隆出新草稿版本。设计器装载到已发布版本时**保存不传 `id`**
(传了会被后端直接拒「该版本已发布不可修改」),装载到草稿才带 `id` 就地更新。
## 构建与发布
push 到 `main` → gitea CI(`.gitea/workflows/build.yml`):`npm run build` → 打包
`svc-hall-front-<sha8>.zip` → 推 Nexus raw → 通知 projman 建档(`status=pending`)。
线上部署由运维/管理员在 projman「前端发布」手动触发,push 不会自动上线。
## 验收口径
`npm run build` 退出 0 且 `dist/static/js/<页面>-<hash>.js` 正常产出。
注意:仓库自带 `vue-tsc@1.8.27` 与 `typescript@5.9.3` 不兼容,`npx vue-tsc --noEmit` 会直接抛
`Search string not found: "/supportedTSExtensions…"`(工具链问题,非代码错误),当前**无类型门禁**。
+1 -1
View File
@@ -14,7 +14,7 @@ import { BaseConf } from "@/types/Basics";
const env = import.meta.env;
// ③ 同域推导兜底:context 段取当前路径首段(/{contextPath}/front/ → contextPath,即后端上下文),
// 与服务端 context-path 对齐(本地无、base/prod /notice);本地 dev/mock 在根路径运行(无段),
// 与服务端 context-path 对齐(本地无、base/prod 为 /svc-hall);本地 dev/mock 在根路径运行(无段),
// serviceHost 留空走 vite 同源代理(规避 CAS 过滤器不回 CORS 头)
const seg = window.location.pathname.split("/").filter(Boolean);
const origin = window.location.origin;