- 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:
@@ -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…"`(工具链问题,非代码错误),当前**无类型门禁**。
|
||||
|
||||
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user