Compare commits

..
38 Commits
Author SHA1 Message Date
fuenmao f183bfe508 查询方式优化 2026-11-09 17:08:34 +08:00
fuenmao b79034311b 新增公司盖章与骑缝章配置 2026-10-15 17:42:13 +08:00
fuenmao a2a163425c 取消电话必填限制 2026-10-14 16:26:37 +08:00
fuenmao 54ac8369b5 调整默认登录信息 2026-09-20 14:12:49 +08:00
fuenmao 30ac8b51b5 优化审核提示 2026-09-18 21:14:21 +08:00
fuenmao 6be0d4f54a 优化操作 2026-09-18 16:19:29 +08:00
fuenmao ea2c823b75 相关bug调整 2026-09-18 16:08:27 +08:00
fuenmao c812071d8a 修改相关问题 2026-09-18 10:53:56 +08:00
fuenmao 2f0d04b982 修复相关bug 2026-09-17 16:03:40 +08:00
fuenmao 7cffe57e4d 新增必填项验证 2026-09-17 14:33:55 +08:00
fuenmao 04c621961c 修改相关bug 2026-09-17 11:37:32 +08:00
fuenmao a0a181af57 入职样式优化 2026-09-15 15:38:19 +08:00
fuenmao d407f1c80b Merge branch 'master' of https://gitea.cnzhyx.cn/yuanlin/OnboardXFront 2026-09-15 13:43:41 +08:00
fuenmao 70bf1907b5 前端双部署 2026-09-15 13:43:22 +08:00
tiananlin 56e6d5a4d7 Merge pull request 'Tiananlin patch 1' (#1) from tiananlin-patch-1 into master
Reviewed-on: #1
2026-09-15 11:43:12 +08:00
tiananlin cbedb66bff 更新 Dockerfiles/Dockerfile-public/default.conf 2026-09-15 11:31:44 +08:00
tiananlin d6d4fb2885 删除 Dockerfiles/Dockerfile 2026-09-15 11:20:34 +08:00
tiananlin 763c27d5c6 删除 Dockerfiles/default.conf 2026-09-15 11:20:28 +08:00
tiananlin 52c8ddc09e 更新 Dockerfiles/Dockerfile-public/Dockerfile 2026-09-15 11:19:54 +08:00
tiananlin fd5b85e20f 添加 Dockerfiles/Dockerfile-admin/Dockerfile 2026-09-15 11:19:23 +08:00
tiananlin 8d4bee03e8 添加 Dockerfiles/Dockerfile-admin/default.conf 2026-09-15 11:18:30 +08:00
tiananlin c4daaae117 添加 Dockerfiles/Dockerfile-public/Dockerfile 2026-09-15 11:18:04 +08:00
tiananlin aa4961cd6e 添加 Dockerfiles/Dockerfile-public/default.conf 2026-09-15 11:15:44 +08:00
tiananlin 0e8fe2cbfe 更新 Dockerfiles/Dockerfile 2026-09-15 11:10:19 +08:00
fuenmao 7de33e5f13 优化文档下载 2026-09-14 17:55:19 +08:00
fuenmao 40010b5668 员工入职填写优化 2026-09-14 16:45:50 +08:00
fuenmao 0624710136 修复相关bug 2026-09-14 15:59:18 +08:00
fuenmao 5d1ec4b137 员工入职页面配色调整与title调整 2026-09-11 14:35:24 +08:00
fuenmao cdf2b0776a 新增员工确认信息实名认证相关信息板块 2026-09-11 11:31:16 +08:00
fuenmao 446e83eed1 新增员工统计板块 2026-09-11 10:39:17 +08:00
fuenmao 4371eca6c4 权限相关调整 2026-09-10 16:43:23 +08:00
fuenmao 0db1848b10 Merge branch 'master' of https://gitea.cnzhyx.cn/yuanlin/OnboardXFront 2026-09-09 16:36:41 +08:00
fuenmao fadc3328e7 11 2026-09-09 16:36:23 +08:00
fuenmao 68704a091b 111 2026-09-09 14:57:46 +08:00
fuenmao 709e02a04f 完善第三方签署 2026-09-08 17:48:42 +08:00
fuenmao 802d9cde89 电子签基础功能 2026-09-07 16:18:01 +08:00
fuenmao 7e74fb3b4b 提示优化 2026-09-02 15:55:12 +08:00
fuenmao 058727982b 入职任务预览,入职任务cope,验证填入的信息 2026-08-29 17:26:38 +08:00
55 changed files with 9461 additions and 1157 deletions
+15
View File
@@ -0,0 +1,15 @@
.git
.gitignore
.idea
.vscode
node_modules
dist
dist-*
coverage
logs
*.log
npm-debug.log*
pnpm-debug.log*
yarn-debug.log*
yarn-error.log*
stats.html
+8 -1
View File
@@ -1,5 +1,12 @@
# title
VITE_GLOB_APP_TITLE = 员工文件管理系统
VITE_GLOB_APP_TITLE = 员工管理系统
# 前端构建类型与入口。默认保持完整后台版本。
VITE_APP_VARIANT = admin
VITE_APP_ENTRY = /src/main.ts
VITE_APP_FAVICON = /api/sys/ico
# 员工公开入职前端地址;各模式可在对应 .env 文件中覆盖。
VITE_PUBLIC_ONBOARDING_URL = http://localhost:8849
# 本地运行端口号
VITE_PORT = 8848
+3
View File
@@ -1,6 +1,9 @@
# 本地环境
VITE_USER_NODE_ENV = development
# 本地后台生成的员工链接固定指向独立公开前端开发端口
VITE_PUBLIC_ONBOARDING_URL = http://localhost:8849
# 公共基础路径
VITE_PUBLIC_PATH = /
+3
View File
@@ -1,6 +1,9 @@
# 线上环境
VITE_USER_NODE_ENV = production
# 后台生成员工入职链接时使用的固定公开域名
VITE_PUBLIC_ONBOARDING_URL = https://onboardx.cnzhyx.cn
# 公共基础路径
VITE_PUBLIC_PATH = /
+28
View File
@@ -0,0 +1,28 @@
# 员工公开入职前端
VITE_USER_NODE_ENV = production
VITE_APP_VARIANT = public
VITE_APP_ENTRY = /src/public-main.ts
VITE_APP_FAVICON = /logo.png
VITE_GLOB_APP_TITLE = 入职服务
VITE_PORT = 8849
VITE_OPEN = true
VITE_DEVTOOLS = false
VITE_REPORT = false
VITE_CODEINSPECTOR = false
VITE_PUBLIC_PATH = /
VITE_ROUTER_MODE = hash
VITE_BUILD_COMPRESS = none
VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE = false
VITE_DROP_CONSOLE = true
# 生成自销毁 Service Worker,用来清除该域名历史遗留的后台 PWA 缓存。
VITE_PWA = true
VITE_HTTP_PROXY = true
VITE_API_URL = http://127.0.0.1:5566
VITE_PROXY = [["/api","http://127.0.0.1:5566"]]
VITE_MQTT = false
VITE_PUBLIC_ONBOARDING_URL = http://localhost:8849
+1
View File
@@ -9,6 +9,7 @@ lerna-debug.log*
node_modules
dist
dist-*
dist-ssr
stats.html
*.local
@@ -26,16 +26,16 @@ RUN pnpm install --frozen-lockfile --fetch-timeout 300000
COPY . .
# 构建项目
RUN npm run build:pro
RUN npm run build:admin
# 部署阶段
FROM registry-vpc.cn-chengdu.aliyuncs.com/zhixueli-prod/nginx:alpine
# 复制构建产物到 Nginx 目录
COPY --from=builder --chown=nginx:nginx /app/dist /usr/share/nginx/html
COPY --from=builder --chown=nginx:nginx /app/dist-admin /usr/share/nginx/html
# 复制 Nginx 配置
COPY Dockerfiles/default.conf /etc/nginx/conf.d/default.conf
COPY Dockerfiles/Dockerfile-admin/default.conf /etc/nginx/conf.d/default.conf
# 暴露端口
EXPOSE 80
+44
View File
@@ -0,0 +1,44 @@
# 构建阶段
FROM registry-vpc.cn-chengdu.aliyuncs.com/zhixueli-prod/node:18.20.3 AS builder
# 设置工作目录
WORKDIR /app
# 设置 npm 镜像源
RUN npm config set registry https://registry.npmmirror.com/
RUN npm config set fetch-retries 3
RUN npm config set fetch-retry-mintimeout 5000
RUN npm config set fetch-retry-maxtimeout 60000
# 安装pnpm
RUN npm install -g pnpm@10.16.1
# 复制 package.json
COPY package.json pnpm-lock.yaml ./
# 设置 pnpm 下载源
RUN pnpm config set registry https://registry.npmmirror.com/
# 安装依赖
RUN pnpm install --frozen-lockfile --fetch-timeout 300000
# 复制源代码
COPY . .
# 构建项目
RUN npm run build:public
# 部署阶段
FROM registry-vpc.cn-chengdu.aliyuncs.com/zhixueli-prod/nginx:alpine
# 复制构建产物到 Nginx 目录
COPY --from=builder --chown=nginx:nginx /app/dist-public /usr/share/nginx/html
# 复制 Nginx 配置
COPY Dockerfiles/Dockerfile-public/default.conf /etc/nginx/conf.d/default.conf
# 暴露端口
EXPOSE 80
# 启动 Nginx
CMD ["nginx", "-g", "daemon off;"]
@@ -0,0 +1,45 @@
server {
listen 80;
server_name _;
client_max_body_size 100m;
root /usr/share/nginx/html;
index index.html;
add_header X-Robots-Tag "noindex, nofollow" always;
# 公开构建中的 sw.js 只负责注销该域名历史遗留的后台 PWA。
location = /sw.js {
add_header Cache-Control "no-store, no-cache, must-revalidate";
try_files $uri =404;
}
location = /index.html {
add_header Cache-Control "no-store, no-cache, must-revalidate";
try_files $uri =404;
}
# 员工域名只允许入职公开接口。内部后端路由不包含外层 /api。
location ^~ /api/open/onboarding/ {
proxy_pass http://onboardx-api-svc:5566/open/onboarding/;
proxy_http_version 1.1;
proxy_request_buffering off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_connect_timeout 60s;
proxy_read_timeout 300s;
proxy_send_timeout 300s;
}
# 公开域名拒绝系统、后台业务及其他 API。
location ^~ /api/ {
return 404;
}
# Hash 路由的有效链接在服务器看来也是根路径,必须返回公开版 index.html。
location / {
try_files $uri $uri/ /index.html;
}
}
+23
View File
@@ -0,0 +1,23 @@
# 完整后台前端
FROM registry-vpc.cn-chengdu.aliyuncs.com/zhixueli-prod/node:18.20.3 AS builder
WORKDIR /app
RUN npm config set registry https://registry.npmmirror.com/
RUN npm config set fetch-retries 3
RUN npm config set fetch-retry-mintimeout 5000
RUN npm config set fetch-retry-maxtimeout 60000
RUN npm install -g pnpm@10.16.1
COPY package.json pnpm-lock.yaml ./
RUN pnpm config set registry https://registry.npmmirror.com/
RUN pnpm install --frozen-lockfile --fetch-timeout 300000
COPY . .
RUN npm run build:admin
FROM registry-vpc.cn-chengdu.aliyuncs.com/zhixueli-prod/nginx:alpine
COPY --from=builder --chown=nginx:nginx /app/dist-admin /usr/share/nginx/html
COPY Dockerfiles/admin.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
+23
View File
@@ -0,0 +1,23 @@
# 纯员工入职前端
FROM registry-vpc.cn-chengdu.aliyuncs.com/zhixueli-prod/node:18.20.3 AS builder
WORKDIR /app
RUN npm config set registry https://registry.npmmirror.com/
RUN npm config set fetch-retries 3
RUN npm config set fetch-retry-mintimeout 5000
RUN npm config set fetch-retry-maxtimeout 60000
RUN npm install -g pnpm@10.16.1
COPY package.json pnpm-lock.yaml ./
RUN pnpm config set registry https://registry.npmmirror.com/
RUN pnpm install --frozen-lockfile --fetch-timeout 300000
COPY . .
RUN npm run build:public
FROM registry-vpc.cn-chengdu.aliyuncs.com/zhixueli-prod/nginx:alpine
COPY --from=builder --chown=nginx:nginx /app/dist-public /usr/share/nginx/html
COPY Dockerfiles/public.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
+34
View File
@@ -0,0 +1,34 @@
server {
listen 80;
server_name _;
client_max_body_size 100m;
root /usr/share/nginx/html;
index index.html;
location = /index.html {
add_header Cache-Control "no-store, no-cache, must-revalidate";
try_files $uri =404;
}
location = /sw.js {
add_header Cache-Control "no-store, no-cache, must-revalidate";
try_files $uri =404;
}
location / {
try_files $uri $uri/ /index.html;
}
location /api/ {
proxy_pass http://onboardx-api-svc:5566/;
proxy_http_version 1.1;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_connect_timeout 60s;
proxy_read_timeout 300s;
proxy_send_timeout 300s;
}
}
@@ -0,0 +1,22 @@
# onboardx-api.cnzhyx.cn 的外层 Nginx 示例。
# 只暴露契约锁回调;后台和员工接口分别通过两个前端域名反向代理。
server {
listen 80;
server_name onboardx-api.cnzhyx.cn;
location = /api/open/onboarding/qiyuesuo/callback {
proxy_pass http://onboardx-api-svc:5566/open/onboarding/qiyuesuo/callback;
proxy_http_version 1.1;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_connect_timeout 60s;
proxy_read_timeout 300s;
proxy_send_timeout 300s;
}
location / {
return 404;
}
}
+82
View File
@@ -0,0 +1,82 @@
# 服务器最外层 Nginx 示例。
# 使用前请确认三个本机端口及证书路径与实际环境一致。
upstream onboardx_admin_web {
server 127.0.0.1:18081;
keepalive 16;
}
upstream onboardx_public_web {
server 127.0.0.1:18082;
keepalive 16;
}
upstream onboardx_backend {
server 127.0.0.1:15566;
keepalive 16;
}
server {
listen 80;
server_name onboardx.cnzhyx.cn onboardx-admin.cnzhyx.cn onboardx-api.cnzhyx.cn;
return 301 https://$host$request_uri;
}
server {
listen 443 ssl http2;
server_name onboardx-admin.cnzhyx.cn;
ssl_certificate /etc/nginx/certs/cnzhyx.cn/fullchain.pem;
ssl_certificate_key /etc/nginx/certs/cnzhyx.cn/privkey.pem;
location / {
proxy_pass http://onboardx_admin_web;
proxy_http_version 1.1;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
}
server {
listen 443 ssl http2;
server_name onboardx.cnzhyx.cn;
ssl_certificate /etc/nginx/certs/cnzhyx.cn/fullchain.pem;
ssl_certificate_key /etc/nginx/certs/cnzhyx.cn/privkey.pem;
location / {
proxy_pass http://onboardx_public_web;
proxy_http_version 1.1;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
}
server {
listen 443 ssl http2;
server_name onboardx-api.cnzhyx.cn;
ssl_certificate /etc/nginx/certs/cnzhyx.cn/fullchain.pem;
ssl_certificate_key /etc/nginx/certs/cnzhyx.cn/privkey.pem;
client_max_body_size 10m;
location = /api/open/onboarding/qiyuesuo/callback {
proxy_pass http://onboardx_backend/open/onboarding/qiyuesuo/callback;
proxy_http_version 1.1;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_connect_timeout 60s;
proxy_read_timeout 300s;
proxy_send_timeout 300s;
}
location / {
return 404;
}
}
+45
View File
@@ -0,0 +1,45 @@
server {
listen 80;
server_name _;
client_max_body_size 100m;
root /usr/share/nginx/html;
index index.html;
add_header X-Robots-Tag "noindex, nofollow" always;
# 公开构建中的 sw.js 只负责注销该域名历史遗留的后台 PWA。
location = /sw.js {
add_header Cache-Control "no-store, no-cache, must-revalidate";
try_files $uri =404;
}
location = /index.html {
add_header Cache-Control "no-store, no-cache, must-revalidate";
try_files $uri =404;
}
# 员工域名只允许入职公开接口。内部后端路由不包含外层 /api。
location ^~ /api/open/onboarding/ {
proxy_pass http://onboardx-api-svc:5566/open/onboarding/;
proxy_http_version 1.1;
proxy_request_buffering off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_connect_timeout 60s;
proxy_read_timeout 300s;
proxy_send_timeout 300s;
}
# 公开域名拒绝系统、后台业务及其他 API。
location ^~ /api/ {
return 404;
}
# Hash 路由的有效链接在服务器看来也是根路径,必须返回公开版 index.html。
location / {
try_files $uri $uri/ /index.html;
}
}
+117
View File
@@ -0,0 +1,117 @@
# OnboardX 双前端域名部署说明
## 1. 最终访问结构
- 员工入职:https://onboardx.cnzhyx.cn
- 后台管理:https://onboardx-admin.cnzhyx.cn
- 契约锁回调:https://onboardx-api.cnzhyx.cn/api/open/onboarding/qiyuesuo/callback
- 后端仍然只有一套,不需要复制数据库或部署第二套 API。
两个前端是同一份源码的不同构建结果:
- build:admin 生成完整后台,输出到 dist-admin。
- build:public 只生成员工填报、链接失效和 404 页面,输出到 dist-public。
员工域名的容器只转发 /api/open/onboarding/。任何 /api/sys/、/api/biz/ 或其他 API 都会直接返回 404。
## 2. 本次涉及的配置文件
- Dockerfile.admin:构建、运行完整后台前端。
- Dockerfile.public:构建、运行纯员工入职前端。
- admin.conf:后台前端容器内部 Nginx。
- public.conf:员工前端容器内部 Nginx,并限制公开 API。
- edge-domains.conf.example:服务器最外层三个 HTTPS 域名的参考配置。
- api-public-callback.conf.example:只单独配置 API 回调域名时的精简参考。
## 3. 上线前准备
### 3.1 DNS
在域名服务商处确保以下记录都指向同一台服务器公网 IP:
onboardx.cnzhyx.cn
onboardx-admin.cnzhyx.cn
onboardx-api.cnzhyx.cn
### 3.2 HTTPS 证书
证书必须覆盖新域名 onboardx-admin.cnzhyx.cn。如果已有 *.cnzhyx.cn 通配符证书,可以继续使用。
### 3.3 后端容器服务名
两个前端容器内部配置默认访问:
http://onboardx-api-svc:5566
因此两个前端容器必须与后端处于同一个 Docker 网络,并且后端在该网络中的名称或别名为 onboardx-api-svc。如果线上服务名不同,只修改 admin.conf 和 public.conf 中的 upstream 地址,不要改公开接口范围。
## 4. 构建两个前端镜像
在前端项目根目录执行:
docker build -f Dockerfiles/Dockerfile.admin -t onboardx-admin-web:20260915 .
docker build -f Dockerfiles/Dockerfile.public -t onboardx-public-web:20260915 .
VITE_PUBLIC_ONBOARDING_URL 是构建期配置,生产环境已经设置为:
https://onboardx.cnzhyx.cn
以后如果更换员工域名,修改 .env.production 后必须重新构建后台镜像,不能只改 Nginx。
## 5. 启动两个前端容器
下面仅作为普通 Docker 示例;如果使用宝塔、Portainer、Kubernetes 或云平台,就在对应界面填写相同的镜像、端口和网络关系。
docker run -d --name onboardx-admin-web --restart always --network onboardx-net -p 127.0.0.1:18081:80 onboardx-admin-web:20260915
docker run -d --name onboardx-public-web --restart always --network onboardx-net -p 127.0.0.1:18082:80 onboardx-public-web:20260915
如果现有后端不在 onboardx-net,应让三个容器加入同一个已有网络。不要为了省事把后端所有端口直接暴露到公网。
## 6. 配置服务器最外层 Nginx
1. 复制 edge-domains.conf.example 到服务器 Nginx 的站点配置目录。
2. 把证书路径改为服务器上的真实路径。
3. 确认端口:
- 18081 是后台前端。
- 18082 是员工前端。
- 15566 是后端映射到服务器本机的端口;如果后端没有映射该端口,应改为实际地址。
4. 执行 nginx -t 检查配置。
5. 检查通过后执行 nginx -s reload 平滑重载。
服务器最外层 Nginx 只负责域名、HTTPS 和转发。真正的公开 API 白名单在员工前端容器的 public.conf 内再次限制,形成两层保护。
## 7. 推荐发布顺序
1. 先完成 onboardx-admin.cnzhyx.cn 的 DNS 和证书。
2. 启动后台前端容器,确认新后台域名登录及业务功能正常。
3. 启动员工前端容器,但先不要发送新链接。
4. 将原来的 onboardx.cnzhyx.cn 切换到员工前端容器。
5. 打开一次员工域名,确认显示“入职链接无效”。
6. 从后台复制一条有效链接,用电脑和安卓手机各走一遍。
7. 最后确认契约锁回调仍然成功。
员工域名以前部署过后台 PWA。本次公开构建会发布一个自销毁 Service Worker,自动注销旧 PWA 并清理旧缓存。老手机第一次打开时可能自动刷新一次;若仍看到旧页面,关闭该页面后重新打开即可。
## 8. 安卓下载处理
- 普通桌面和 iOS 浏览器通过不携带后台凭证的文件流下载。
- 安卓及安卓 WebView 直接访问同域公开文件接口,避免 blob: 下载被系统 WebView 拦截。
- 安卓微信如果不支持文件接管,页面会提示用户点击右上角“在浏览器打开”后重新下载。
- 后台 PWA 的 Service Worker 不再拦截 /api/,所以文件接口不会错误回退成 index.html。
## 9. 上线验收清单
- 访问 https://onboardx.cnzhyx.cn/,只显示“入职链接无效”。
- 访问 /#/onboarding/fill 但不带 Token,自动进入链接无效页。
- 修改 Token 任意一个字符,提示链接不存在或无效。
- 公开域名访问 /api/sys/ 返回 404。
- 公开域名访问 /api/biz/ 返回 404。
- 公开域名不能出现后台登录页、菜单、员工档案或系统管理页面。
- 后台生成的员工链接始终以 https://onboardx.cnzhyx.cn 开头。
- onboardx-admin.cnzhyx.cn 的登录、上传、下载和业务操作正常。
- 安卓 Chrome、安卓微信、桌面浏览器均测试合同下载。
- 契约锁回调地址保持不变且能正常更新签署状态。
## 10. 回滚原则
后台前端和员工前端可以分别回滚到各自上一个镜像版本。不要把员工域名重新指向完整后台作为临时回滚方案,否则会重新暴露后台入口。若员工端出现故障,应只回滚 onboardx-public-web 镜像。
+15 -2
View File
@@ -129,12 +129,25 @@ const createCompression = (viteEnv: ViteEnv): PluginOption | PluginOption[] => {
* @param viteEnv
*/
const createVitePwa = (viteEnv: ViteEnv): PluginOption | PluginOption[] => {
const { VITE_GLOB_APP_TITLE } = viteEnv;
const { VITE_GLOB_APP_TITLE, VITE_APP_VARIANT } = viteEnv;
// 员工公开域名曾部署过完整后台 PWA。发布自销毁 SW 可主动注销旧注册并清理旧缓存,
// 后续公开页面不再由 Service Worker 接管。
if (VITE_APP_VARIANT === "public") {
return VitePWA({
registerType: "autoUpdate",
manifest: false,
selfDestroying: true
});
}
return VitePWA({
registerType: "autoUpdate",
workbox: {
// 添加此项配置,增加需要缓存的最大文件大小
maximumFileSizeToCacheInBytes: 4 * 1024 * 1024
maximumFileSizeToCacheInBytes: 4 * 1024 * 1024,
// API、下载和回调均不能回退到 SPA 的 index.html。
navigateFallbackDenylist: [/^\/api\//]
},
manifest: {
name: VITE_GLOB_APP_TITLE,
+2
View File
@@ -29,6 +29,8 @@ declare module 'vue' {
ElCascader: typeof import('element-plus/es')['ElCascader']
ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
ElCol: typeof import('element-plus/es')['ElCol']
ElCollapse: typeof import('element-plus/es')['ElCollapse']
ElCollapseItem: typeof import('element-plus/es')['ElCollapseItem']
ElColorPicker: typeof import('element-plus/es')['ElColorPicker']
ElContainer: typeof import('element-plus/es')['ElContainer']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
+3 -2
View File
@@ -2,7 +2,8 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="/api/sys/ico" />
<link rel="icon" href="%VITE_APP_FAVICON%" />
<meta name="referrer" content="no-referrer" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><%- title %></title>
</head>
@@ -100,6 +101,6 @@
if (globalState.isDark) html.style.background = "#141414";
}
</script>
<script type="module" src="/src/main.ts"></script>
<script type="module" src="%VITE_APP_ENTRY%"></script>
</body>
</html>
+3
View File
@@ -20,10 +20,13 @@
},
"scripts": {
"dev": "vite",
"dev:public": "vite --mode public",
"serve": "vite",
"build:dev": "vue-tsc && vite build --mode development",
"build:test": "vue-tsc && vite build --mode test",
"build:pro": "vite build --mode production",
"build:admin": "vite build --mode production --outDir dist-admin",
"build:public": "vite build --mode public --outDir dist-public",
"type:check": "vue-tsc --noEmit --skipLibCheck",
"preview": "pnpm run build:dev && vite preview",
"lint:eslint": "eslint --fix --ext .js,.ts,.vue ./src",
+17
View File
@@ -0,0 +1,17 @@
<template>
<el-config-provider :locale="zhCn" :button="buttonConfig">
<router-view />
</el-config-provider>
</template>
<script setup lang="ts">
import { reactive, onMounted } from "vue";
import { ElConfigProvider } from "element-plus";
import zhCn from "element-plus/es/locale/lang/zh-cn";
const buttonConfig = reactive({ autoInsertSpace: false });
onMounted(() => {
document.documentElement.classList.add("is-public-app");
});
</script>
+334 -41
View File
@@ -3,10 +3,63 @@ import type { ReqId, ResPage } from "@/api/interface";
const taskHttp = moduleRequest("/biz/onboarding/task/");
const auditHttp = moduleRequest("/biz/onboarding/audit/");
const contractDocumentHttp = moduleRequest("/biz/onboarding/contract-document/");
const electronicSignHttp = moduleRequest("/biz/onboarding/electronic-sign/");
const fileHttp = moduleRequest("/sys/dev/file/");
/**
* 下载创建任务前的合同预览,并将统一响应中的 JSON 错误转换成可读异常。
*/
async function requestContractPreview(
action: string,
params: Record<string, unknown>,
fallbackMessage: string
) {
let response: any;
try {
response = await contractDocumentHttp.post<any>(
action,
params,
{ responseType: "blob", loading: false, cancel: false }
);
} catch (error: any) {
const errorBlob = error?.response?.data;
if (errorBlob instanceof Blob) {
try {
const result = JSON.parse(await errorBlob.text());
throw new Error(result?.msg || fallbackMessage);
} catch (parseError) {
if (!(parseError instanceof SyntaxError)) throw parseError;
}
}
throw error;
}
const blob = response?.data;
const contentType = String(
response?.headers?.["content-type"] || blob?.type || ""
);
if (
blob instanceof Blob &&
contentType.toLowerCase().includes("application/json")
) {
try {
const result = JSON.parse(await blob.text());
throw new Error(result?.msg || fallbackMessage);
} catch (error) {
if (error instanceof SyntaxError) {
throw new Error(fallbackMessage);
}
throw error;
}
}
return response;
}
export interface OnboardingTask {
id: number;
createUserId?: number | string;
taskNo: string;
companyId: number;
companyName?: string;
@@ -14,6 +67,7 @@ export interface OnboardingTask {
departmentName?: string;
positionId: number;
positionName?: string;
employmentType?: "full_time" | "part_time";
onboardingTemplateId?: number;
onboardingTemplateName?: string;
taskStatus: string;
@@ -21,14 +75,99 @@ export interface OnboardingTask {
linkExpireAt?: string;
submitCount: number;
createTime: string;
remark?: string;
}
/** 员工端完成合同准备后返回的当前文件版本。 */
export interface OnboardingPreparedContract {
/** 当前生成合同对应的系统文件 Id,同时作为下载缓存版本。 */
fileId: number;
/** 当前合同文件生成时间。 */
generatedAt?: string;
/** 当前查询条件下、不受状态筛选影响的任务统计。 */
export interface OnboardingTaskStatistics {
pendingFill: number;
reviewing: number;
rejected: number;
approved: number;
}
/** 带状态统计的入职任务分页结果。 */
export interface OnboardingTaskPage extends ResPage<OnboardingTask> {
statistics: OnboardingTaskStatistics;
}
/** 批量复制任务返回的单条新任务链接。 */
export interface OnboardingTaskCreatedResult {
taskId: number;
taskNo: string;
linkToken: string;
expiresAt: string;
}
/** 批量复制任务结果。 */
export interface OnboardingTaskCopyResult {
tasks: OnboardingTaskCreatedResult[];
}
/** 一次电子签流程中的单份合同文件。 */
export interface OnboardingElectronicSignDocument {
id: number;
taskContractId: number;
providerDocumentId?: string;
documentName: string;
documentSort: number;
originalDocxFileId?: number;
signedPdfFileId?: number;
employeeSignedPreviewed: boolean;
companySealEnabled: boolean;
acrossPageSealEnabled: boolean;
}
/** 员工已签、企业未盖章文件的契约锁只读预览。 */
export interface OnboardingElectronicSignPreview {
signDocumentId: number;
previewUrl: string;
}
/** 管理端查看的入职电子签流程详情。 */
export interface OnboardingElectronicSignDetail {
taskId: number;
taskNo: string;
canInitiate: boolean;
cannotInitiateReason?: string;
canReinitiate: boolean;
cannotReinitiateReason?: string;
hasProcess: boolean;
processId?: number;
providerContractId?: string;
bizId?: string;
subject?: string;
signStatus?: string;
providerStatus?: string;
employeeName?: string;
employeeMobile?: string;
signUrl?: string;
signUrlExpireAt?: string;
signUrlValid: boolean;
startedAt?: string;
sentAt?: string;
completedAt?: string;
archivedAt?: string;
archiveFileId?: number;
lastError?: string;
documents: OnboardingElectronicSignDocument[];
historyProcesses: OnboardingElectronicSignHistory[];
}
/** 已被新流程替代的电子签历史记录。 */
export interface OnboardingElectronicSignHistory {
processId: number;
bizId: string;
providerContractId?: string;
signStatus?: string;
providerStatus?: string;
employeeName?: string;
employeeMobile?: string;
startedAt?: string;
reissuedAt?: string;
reissueReason?: string;
lastError?: string;
}
export interface OnboardingCompanyOption {
@@ -47,17 +186,21 @@ export interface OnboardingPositionOption {
}
export interface OnboardingCompany extends OnboardingCompanyOption {
createUserId?: number | string;
companyCode: string;
legalName: string;
unifiedSocialCreditCode?: string;
legalRepresentative?: string;
registeredAddress?: string;
contactPhone?: string;
qiyuesuoCategoryId?: string;
qiyuesuoSealId?: string;
remark?: string;
status: string;
}
export interface OnboardingDepartment extends OnboardingDepartmentOption {
createUserId?: number | string;
companyId: number;
companyName?: string;
departmentCode: string;
@@ -68,6 +211,7 @@ export interface OnboardingDepartment extends OnboardingDepartmentOption {
}
export interface OnboardingPosition extends OnboardingPositionOption {
createUserId?: number | string;
companyId: number;
companyName?: string;
departmentId?: number;
@@ -81,6 +225,7 @@ export interface OnboardingPosition extends OnboardingPositionOption {
export interface OnboardingContractTemplate {
id: number;
createUserId?: number | string;
companyId?: number;
companyName?: string;
departmentId?: number;
@@ -102,6 +247,8 @@ export interface OnboardingContractVersion {
effectiveDate?: string;
expiryDate?: string;
versionStatus: string;
companySealEnabled?: boolean | null;
acrossPageSealEnabled?: boolean | null;
remark?: string;
}
@@ -142,6 +289,7 @@ export interface OnboardingTaskContractVariableGroup {
export interface OnboardingEmployee {
id: number;
createUserId?: number | string;
employeeNo?: string;
employeeName: string;
companyId: number;
@@ -150,14 +298,36 @@ export interface OnboardingEmployee {
departmentName?: string;
positionId: number;
positionName?: string;
employmentType?: "full_time" | "part_time";
regularizationStatus?: "probation" | "regular" | "not_applicable";
socialInsuranceStatus?: "unknown" | "not_purchased" | "purchased" | "stopped" | "not_applicable";
regularizationDate?: string;
socialInsuranceCompany?: string;
contractNature?: string;
phone: string;
idCardNumber: string;
entryDate?: string;
createTime?: string;
}
/** 不受快捷维度筛选影响的正式员工统计。 */
export interface OnboardingEmployeeStatistics {
total: number;
fullTime: number;
partTime: number;
probation: number;
socialPurchased: number;
expiringContract: number;
}
/** 附带统计的正式员工档案分页结果。 */
export interface OnboardingEmployeePage extends ResPage<OnboardingEmployee> {
statistics: OnboardingEmployeeStatistics;
}
export interface OnboardingFormField {
id: number;
createUserId?: number | string;
fieldCode: string;
fieldName: string;
dataType: string;
@@ -169,6 +339,7 @@ export interface OnboardingFormField {
export interface OnboardingMaterialType {
id: number;
createUserId?: number | string;
materialCode: string;
materialName: string;
allowedExtensions?: string;
@@ -199,6 +370,7 @@ export interface OnboardingTemplateMaterialConfig {
export interface OnboardingTemplate {
id: number;
createUserId?: number | string;
templateCode: string;
templateName: string;
companyId: number;
@@ -218,7 +390,7 @@ export interface OnboardingTemplate {
}
export const onboardingTaskApi = {
page(params: Record<string, unknown>) {
return taskHttp.get<ResPage<OnboardingTask>>("page", params);
return taskHttp.get<OnboardingTaskPage>("page", params);
},
detail(params: ReqId) {
@@ -254,10 +426,36 @@ export const onboardingTaskApi = {
return response;
},
/** 创建任务前生成并下载指定的一份临时 DOCX 合同预览。 */
async previewContractBeforeCreate(params: Record<string, unknown>) {
return requestContractPreview(
"preview-before-create",
params,
"合同预览生成失败"
);
},
/** 创建任务前生成全部临时 DOCX 合同预览,并以 ZIP 下载。 */
async previewAllContractsBeforeCreate(params: Record<string, unknown>) {
return requestContractPreview(
"preview-all-before-create",
params,
"合同预览打包生成失败"
);
},
create(params: Record<string, unknown>) {
return taskHttp.post("create", params);
},
copy(params: {
sourceTaskId: number;
count: number;
items: Array<{ remark: string }>;
}) {
return taskHttp.post<OnboardingTaskCopyResult>("copy", params);
},
approve(params: {
taskId: number;
auditOpinion?: string;
@@ -279,6 +477,67 @@ export const onboardingTaskApi = {
);
},
/** 查询任务当前电子签流程和全部合同文件。 */
electronicSignDetail(taskId: number) {
return electronicSignHttp.get<OnboardingElectronicSignDetail>("detail", {
id: taskId
});
},
/** 手动发起;失败流程会从已保存的本地断点继续。 */
initiateElectronicSign(taskId: number) {
return electronicSignHttp.post<OnboardingElectronicSignDetail>("initiate", {
taskId
});
},
/** 保留旧流程记录,并以新的业务编号重新发起一次签约。 */
reinitiateElectronicSign(taskId: number, reason: string) {
return electronicSignHttp.post<OnboardingElectronicSignDetail>("reinitiate", {
taskId,
reason
});
},
/** 主动同步签署状态,完成时后端自动执行归档。 */
syncElectronicSign(taskId: number) {
return electronicSignHttp.post<OnboardingElectronicSignDetail>("sync", {
taskId
});
},
/** 获取有效的员工签署链接,旧链接失效时由后端重新生成。 */
getElectronicSignLink(taskId: number) {
return electronicSignHttp.post<OnboardingElectronicSignDetail>("get-link", {
taskId
});
},
/** 获取一份员工已签合同的契约锁只读浏览页面。 */
previewEmployeeSignedDocument(taskId: number, signDocumentId: number) {
return electronicSignHttp.post<OnboardingElectronicSignPreview>(
"preview-employee-signed",
{ taskId, signDocumentId }
);
},
/** 全部合同核对完成后,由后台管理员确认企业盖章。 */
companySealElectronicSign(taskId: number) {
return electronicSignHttp.post<OnboardingElectronicSignDetail>("company-seal", {
taskId
});
},
/** 催办当前待签员工。 */
noticeElectronicSign(taskId: number) {
return electronicSignHttp.post("notice", { taskId });
},
/** 作废尚未完成的电子签流程。 */
invalidElectronicSign(taskId: number, reason: string) {
return electronicSignHttp.post("invalid", { taskId, reason });
},
archive(params: {
taskId: number;
auditOpinion?: string;
@@ -501,6 +760,7 @@ export const onboardingTaskApi = {
versionPage(params: {
templateId: number;
versionStatus?: string;
pageNum: number;
pageSize: number;
}) {
@@ -526,6 +786,18 @@ export const onboardingTaskApi = {
);
},
setVersionSeals(params: {
id: number;
companySealEnabled?: boolean;
acrossPageSealEnabled?: boolean;
}) {
return moduleRequest("/biz/onboarding/contract-template/").post(
"version/set-seals",
params,
{ loading: false }
);
},
deleteVersion(id: number) {
return moduleRequest("/biz/onboarding/contract-template/").post(
"version/delete",
@@ -577,9 +849,18 @@ export const onboardingTaskApi = {
},
employeePage(params: Record<string, unknown>) {
return moduleRequest("/biz/onboarding/employee/").get<
ResPage<OnboardingEmployee>
>("page", params);
return moduleRequest("/biz/onboarding/employee/").get<OnboardingEmployeePage>(
"page",
params
);
},
employeeExport(params: Record<string, unknown>) {
return moduleRequest("/biz/onboarding/employee/").download(
"export",
params,
{ cancel: false }
);
},
employeeDetail(params: ReqId) {
@@ -589,6 +870,49 @@ export const onboardingTaskApi = {
);
},
updateEmployeeHrInfo(params: {
id: number;
employmentType: "full_time" | "part_time";
contractNature?: string;
socialInsuranceStatus: "unknown" | "not_purchased" | "purchased" | "stopped" | "not_applicable";
socialInsuranceCompany?: string;
}) {
return moduleRequest("/biz/onboarding/employee/").post(
"hr-info/update",
params
);
},
uploadEmployeeAttachment(params: FormData) {
return moduleRequest("/biz/onboarding/employee/").post<number>(
"attachment/upload",
params,
{ cancel: false, loading: false }
);
},
regularizeEmployee(params: {
id: number;
regularizationDate: string;
remark?: string;
fileIds: number[];
}) {
return moduleRequest("/biz/onboarding/employee/").post(
"regularization/confirm",
params
);
},
revokeEmployeeRegularization(params: {
id: number;
remark: string;
}) {
return moduleRequest("/biz/onboarding/employee/").post(
"regularization/revoke",
params
);
},
listFormFields() {
return moduleRequest("/biz/onboarding/entry-config/").get<
OnboardingFormField[]
@@ -650,34 +974,3 @@ export const onboardingTaskApi = {
return moduleRequest("/biz/onboarding/variable-definition/").post("delete", { ids });
}
};
const publicHttp = moduleRequest("/open/onboarding/");
export const onboardingPublicApi = {
detail(params: { token: string }) {
return publicHttp.post<any>("detail", params);
},
saveEmployeeInfo(params: Record<string, unknown>) {
return publicHttp.post("save-employee-info", params);
},
confirmContract(params: { token: string; taskContractId: number }) {
return publicHttp.post("confirm-contract", params);
},
submit(params: { token: string }) {
return publicHttp.post("submit", params);
},
prepareContract(params: { token: string; taskContractId: number }) {
return publicHttp.post<OnboardingPreparedContract>("prepare-contract", params);
},
contractSourceUrl(params: { token: string; taskContractId: number; fileVersion?: number }) {
const version = params.fileVersion ? `&version=${params.fileVersion}` : `&_t=${Date.now()}`;
return `/api/open/onboarding/contract-source?token=${encodeURIComponent(params.token)}&taskContractId=${params.taskContractId}${version}`;
},
materialSourceUrl(params: { token: string; taskMaterialId: number; fileId?: number }) {
const version = params.fileId ? `&v=${params.fileId}` : "";
return `/api/open/onboarding/material-source?token=${encodeURIComponent(params.token)}&taskMaterialId=${params.taskMaterialId}${version}`;
},
deleteMaterial(params: { token: string; taskMaterialId: number }) {
return publicHttp.post("delete-material", params);
}
};
+92
View File
@@ -0,0 +1,92 @@
import {
publicDownload,
publicPost,
publicUpload,
type PublicFileResult
} from "@/api/request/publicRequest";
export interface OnboardingPublicTask {
id: number;
taskNo: string;
taskStatus: string;
rejectReason?: string;
linkExpireAt?: string;
}
export interface OnboardingPreparedContract {
fileId: number;
generatedAt?: string;
}
export const onboardingPublicApi = {
detail(params: { token: string }) {
return publicPost<any>("detail", params);
},
saveEmployeeInfo(params: Record<string, unknown>) {
// “下一步”需要将业务校验结果作为阻断弹窗展示,由页面统一提示一次。
return publicPost<never>("save-employee-info", params, { notifyError: false });
},
confirmContract(params: { token: string; taskContractId: number }) {
return publicPost<never>("confirm-contract", params);
},
submit(params: {
token: string;
identityInformationConfirmed: boolean;
confirmedEmployeeName: string;
confirmedIdCardNumber: string;
confirmedPhone: string;
}) {
return publicPost<never>("submit", params);
},
prepareContract(params: { token: string; taskContractId: number }) {
return publicPost<OnboardingPreparedContract>("prepare-contract", params);
},
downloadContract(params: {
token: string;
taskContractId: number;
fileVersion?: number;
}): Promise<PublicFileResult> {
return publicDownload("contract-source", {
token: params.token,
taskContractId: params.taskContractId,
version: params.fileVersion,
_t: params.fileVersion ? undefined : Date.now()
});
},
downloadMaterial(params: {
token: string;
taskMaterialId: number;
fileId?: number;
}, notifyError = true): Promise<PublicFileResult> {
return publicDownload("material-source", {
token: params.token,
taskMaterialId: params.taskMaterialId,
v: params.fileId
}, { notifyError });
},
uploadMaterial(params: {
token: string;
materialTypeId: number;
file: File;
taskMaterialId?: number;
}) {
const data = new FormData();
data.append("file", params.file);
return publicUpload<number>("upload-material", data, {
token: params.token,
materialTypeId: params.materialTypeId,
taskMaterialId: params.taskMaterialId
});
},
deleteMaterial(params: { token: string; taskMaterialId: number }) {
return publicPost<never>("delete-material", params);
}
};
+219
View File
@@ -0,0 +1,219 @@
import { ElMessage } from "element-plus";
const PUBLIC_ONBOARDING_PREFIX = "/api/open/onboarding/";
const DEFAULT_TIMEOUT = 90_000;
export interface PublicApiResult<T> {
code: number;
msg?: string;
data: T;
extras?: unknown;
time?: string;
}
export interface PublicFileResult {
blob: Blob;
fileName?: string;
}
interface PublicRequestOptions {
timeout?: number;
notifyError?: boolean;
}
export class PublicApiError extends Error {
code?: number;
status?: number;
msg: string;
reported: boolean;
constructor(message: string, options: {
code?: number;
status?: number;
reported?: boolean;
} = {}) {
super(message);
this.name = "PublicApiError";
this.msg = message;
this.code = options.code;
this.status = options.status ?? 0;
this.reported = Boolean(options.reported);
}
}
function assertPublicAction(action: string) {
if (!/^[a-z0-9-]+$/i.test(action)) {
throw new PublicApiError("公开接口地址不合法");
}
}
function buildPublicUrl(
action: string,
query?: Record<string, string | number | undefined>
) {
assertPublicAction(action);
const url = new URL(`${PUBLIC_ONBOARDING_PREFIX}${action}`, window.location.origin);
Object.entries(query || {}).forEach(([key, value]) => {
if (value !== undefined && value !== "") {
url.searchParams.set(key, String(value));
}
});
return `${url.pathname}${url.search}`;
}
function reportError(error: PublicApiError, notifyError: boolean) {
if (notifyError && !error.reported) {
ElMessage.error(error.message);
error.reported = true;
}
return error;
}
async function readErrorMessage(response: Response) {
if (response.status === 413) {
return "单个文件不能超过20MB,请压缩后重新上传";
}
try {
const payload = await response.clone().json();
return payload?.msg || payload?.message || `请求失败(${response.status})`;
} catch {
return `请求失败(${response.status})`;
}
}
async function requestRaw(
action: string,
init: RequestInit,
query?: Record<string, string | number | undefined>,
options: PublicRequestOptions = {}
) {
const notifyError = options.notifyError !== false;
const controller = new AbortController();
const timeoutId = window.setTimeout(
() => controller.abort(),
options.timeout ?? DEFAULT_TIMEOUT
);
try {
const response = await fetch(buildPublicUrl(action, query), {
...init,
credentials: "omit",
cache: "no-store",
redirect: "error",
signal: controller.signal
});
if (!response.ok) {
throw new PublicApiError(await readErrorMessage(response), {
status: response.status
});
}
return response;
} catch (error: any) {
const normalized = error instanceof PublicApiError
? error
: new PublicApiError(
error?.name === "AbortError"
? "请求超时,请检查网络后重试"
: "网络请求失败,请检查网络后重试"
);
throw reportError(normalized, notifyError);
} finally {
window.clearTimeout(timeoutId);
}
}
async function readApiResult<T>(
response: Response,
notifyError: boolean
): Promise<PublicApiResult<T>> {
let result: PublicApiResult<T>;
try {
result = await response.json();
} catch {
throw reportError(new PublicApiError("服务器返回了无法识别的数据"), notifyError);
}
if (result.code !== 0 && result.code !== 200) {
throw reportError(
new PublicApiError(result.msg || "请求失败", { code: result.code }),
notifyError
);
}
return result;
}
export async function publicPost<T>(
action: string,
body: unknown,
options: PublicRequestOptions = {}
) {
const response = await requestRaw(action, {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json"
},
body: JSON.stringify(body)
}, undefined, options);
return readApiResult<T>(response, options.notifyError !== false);
}
export async function publicUpload<T>(
action: string,
formData: FormData,
query?: Record<string, string | number | undefined>,
options: PublicRequestOptions = {}
) {
const response = await requestRaw(action, {
method: "POST",
headers: { Accept: "application/json" },
body: formData
}, query, {
timeout: options.timeout ?? 300_000,
notifyError: options.notifyError
});
return readApiResult<T>(response, options.notifyError !== false);
}
export async function publicDownload(
action: string,
query: Record<string, string | number | undefined>,
options: PublicRequestOptions = {}
): Promise<PublicFileResult> {
const response = await requestRaw(action, {
method: "GET",
headers: { Accept: "application/octet-stream" }
}, query, {
timeout: options.timeout ?? 300_000,
notifyError: options.notifyError
});
const contentType = response.headers.get("content-type")?.toLowerCase() || "";
if (contentType.includes("application/json")) {
const result = await readApiResult<never>(
response,
options.notifyError !== false
);
throw reportError(
new PublicApiError(result.msg || "文件下载失败", { code: result.code }),
options.notifyError !== false
);
}
const disposition = response.headers.get("content-disposition") || "";
const encodedName = disposition.match(/filename\*=UTF-8''([^;]+)/i)?.[1]
|| disposition.match(/filename="?([^";]+)"?/i)?.[1];
let fileName: string | undefined;
if (encodedName) {
try {
fileName = decodeURIComponent(encodedName.replace(/\+/g, " "));
} catch {
fileName = encodedName;
}
}
return {
blob: await response.blob(),
fileName
};
}
+144 -63
View File
@@ -4,56 +4,62 @@
* @Date: 2023-12-15 15:40:39
!-->
<template>
<form-container v-model="visible" title="角色选择" form-size="90%" v-bind="$attrs">
<div class="-mt-15px min-h-350px">
<el-row :gutter="12" justify="space-between">
<el-col :span="4">
<el-scrollbar max-height="650px">
<TreeFilter
label="name"
class="filterWidth"
title="组织列表"
top-name="全局"
:default-expand-all="false"
:request-api="orgTreeApi"
@change="changeOrgTreeFilter"
/></el-scrollbar>
</el-col>
<el-col :span="10">
<ProTable ref="userTable" :columns="columns" :tool-button="false" :init-param="initParam" :request-api="roleSelectorApi">
<form-container v-model="visible" title="角色选择" :form-size="formSize" v-bind="$attrs" @close="onClose">
<div class="role-selector-content">
<!-- 组织树 -->
<div class="selector-tree-col">
<TreeFilter label="name" class="filterWidth" title="组织列表" top-name="全局" :default-expand-all="false"
:request-api="orgTreeApi" @change="changeOrgTreeFilter" />
</div>
<!-- 待选角色 -->
<div class="selector-table-col">
<ProTable ref="userTable" :columns="columns" :tool-button="false" :init-param="initParam"
:request-api="roleSelectorApi" :search-col="{ xs: 1, sm: 2, md: 2, lg: 2, xl: 2 }" max-height="300px">
<!-- 表格 header 按钮 -->
<template #tableHeader="scope">
<el-button type="primary" @click="addRecords(userTable!.tableData)">添加当前</el-button>
<el-button type="primary" plain :disabled="!scope.isSelected" @click="addRecords(scope.selectedList)">添加选中</el-button>
<el-button type="primary" plain :disabled="!scope.isSelected"
@click="addRecords(scope.selectedList)">添加选中</el-button>
</template>
<!-- 操作 -->
<template #operation="scope">
<el-button type="primary" link :icon="Plus" plain @click="addRecords([scope.row])">添加</el-button>
</template>
</ProTable>
</el-col>
<el-col :span="10">
<ProTable ref="chooseTable" :columns="columns" :tool-button="true" :data="chooseDataTmp" @search="searchRecords" @reset="resetRecords">
</div>
<!-- 已选角色 -->
<div class="selector-table-col">
<div class="card choose-header-bar">
<div class="choose-header-left">
<span class="choose-title">已选角色清单</span>
<span v-if="maxCount" class="max-count-tip">(最多选择 {{ maxCount }} 个)</span>
</div>
<el-tag type="primary" size="small" effect="plain">已选择 {{ chooseData.length }} 个角色</el-tag>
</div>
<ProTable ref="chooseTable" :columns="chooseColumns" :tool-button="false" :pagination="false"
:data="chooseDataTmp" max-height="300px">
<!-- 表格 header 按钮 -->
<template #tableHeader="scope">
<el-button type="danger" @click="delRecords(chooseTable!.tableData)">删除当前</el-button>
<el-button type="danger" plain :disabled="!scope.isSelected" @click="delRecords(scope.selectedList)">删除选中</el-button>
</template>
<template #toolButton>
<span>已选择:{{ chooseData.length }}人</span>
<span v-if="maxCount">,最多选择:{{ maxCount }}人</span>
<el-button type="danger" plain :disabled="!scope.isSelected"
@click="delRecords(scope.selectedList)">删除选中</el-button>
</template>
<!-- 操作 -->
<template #operation="scope">
<el-button type="danger" link :icon="Delete" plain @click="delRecords([scope.row])">删除</el-button>
</template>
</ProTable>
</el-col>
</el-row>
</div>
</div>
<!-- 底部按钮区域 -->
<template #footer>
<div class="role-selector-footer">
<el-button @click="onClose"> 取消 </el-button>
<el-button type="primary" @click="handleOk"> 确定 </el-button>
</div>
</template>
</form-container>
</template>
@@ -72,27 +78,36 @@ const visible = ref(false); //是否显示
// 定义组件 props
const props = withDefaults(defineProps<RoleSelectProps>(), {
permission: false,
multiple: false
multiple: false,
formSize: "1300px"
});
// 如果表格需要初始化请求参数,直接定义传给 ProTable(之后每次请求都会自动带上该参数,此参数更改之后也会一直带上,改变此参数会自动刷新表格数据)
// 如果表格需要初始化请求参数,直接定义传给 ProTable
const initParam = reactive<RoleSelectTableInitParams>({});
// 获取 userTable 元素,调用其获取刷新数据方法(还能获取到当前查询参数,方便导出携带参数)
// 获取 userTable 元素
const userTable = ref<ProTableInstance>();
// 获取 chooseTable 元素,调用其获取刷新数据方法(还能获取到当前查询参数,方便导出携带参数)
// 获取 chooseTable 元素
const chooseTable = ref<ProTableInstance>();
// 表格配置项
// 待选角色表格配置项(包含搜索项)
const columns: ColumnProps<SysRole.SysRoleInfo>[] = [
{ type: "selection", fixed: "left", width: 50 },
{ prop: "operation", label: "操作", width: 80, fixed: "left" },
{ prop: "name", label: "角色名", search: { el: "input", span: 2 } }
{ prop: "name", label: "角色名", search: { el: "input" } }
];
// 已选角色表格配置项(不包含搜索,更轻量)
const chooseColumns: ColumnProps<SysRole.SysRoleInfo>[] = [
{ type: "selection", fixed: "left", width: 50 },
{ prop: "operation", label: "操作", width: 80, fixed: "left" },
{ prop: "name", label: "角色名" }
];
/** 显示选择器 */
function showSelector(data: SysRole.SysRoleInfo[] = []) {
visible.value = true;
chooseDataTmp.value = data;
chooseData.value = data;
chooseDataTmp.value = data ? [...data] : [];
chooseData.value = data ? [...data] : [];
}
/** 关闭选择器 */
@@ -110,9 +125,10 @@ function handleOk() {
/** 部门切换 */
function changeOrgTreeFilter(val: number | string) {
userTable.value!.pageable.pageNum = 1;
if (val != "") {
// 如果传入的val不为空
if (userTable.value?.pageable) {
userTable.value.pageable.pageNum = 1;
}
if (val !== "") {
initParam.orgId = val;
} else {
initParam.orgId = null;
@@ -124,19 +140,19 @@ const chooseDataTmp = ref<SysRole.SysRoleInfo[]>([]); //临时选择的数据
/** 添加记录 */
function addRecords(records: any[]) {
//如果不是多选,判断是否已经添加了
// 如果不是多选,判断是否已经添加了
if (!props.multiple) {
if (chooseData.value.length > 0 || records.length > 1) {
ElMessage.warning("只可选择一条");
ElMessage.warning("只可选择一个角色");
return;
}
chooseData.value = records;
chooseDataTmp.value = chooseData.value;
} else {
//如果是多选,先判断已添加列表是否有重复的id,有则过滤掉,没有则直接添加
records = records.filter(item => !chooseData.value.find(it => it.id == item.id));
// 如果是多选,先判断已添加列表是否有重复的id,有则过滤掉,没有则直接添加
records = records.filter(item => !chooseData.value.find(it => it.id === item.id));
if (props.maxCount && props.maxCount < records.length + chooseData.value.length) {
ElMessage.warning("最多选择" + props.maxCount + "条");
ElMessage.warning(`最多选择 ${props.maxCount} 个角色`);
return;
}
chooseData.value = chooseData.value.concat(records); // 添加到已选中列表
@@ -152,32 +168,97 @@ function delRecords(records: any[]) {
chooseTable.value?.refresh(); // 刷新表格
}
/** 搜索记录 */
function searchRecords() {
if (chooseTable.value?.searchParam?.name) {
//搜索name符合的记录
chooseDataTmp.value = chooseDataTmp.value.filter(item => item.name.includes(chooseTable.value?.searchParam.name)); //过滤掉已选中的
chooseTable.value?.refresh(); //刷新表格
}
}
/** 重置记录 */
function resetRecords() {
chooseDataTmp.value = chooseData.value;
chooseTable.value?.refresh(); //刷新表格
}
// 暴露方法
defineExpose({ showSelector });
</script>
<style lang="scss" scoped>
.filterWidth {
width: 100%;
.role-selector-content {
display: flex;
gap: 12px;
align-items: stretch;
min-height: 460px;
}
:deep(.el-tabs--border-card > .el-tabs__content) {
padding: 5px;
.selector-tree-col {
width: 220px;
flex-shrink: 0;
height: 460px;
}
.selector-table-col {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
}
.choose-header-bar {
display: flex;
align-items: center;
justify-content: space-between;
height: 64px;
padding: 0 16px;
margin-bottom: 10px;
box-sizing: border-box;
.choose-header-left {
display: flex;
align-items: center;
}
.choose-title {
font-size: 14px;
font-weight: 600;
color: var(--el-text-color-primary);
}
.max-count-tip {
margin-left: 6px;
font-size: 12px;
color: var(--el-text-color-secondary);
}
}
.role-selector-footer {
display: flex;
justify-content: flex-end;
gap: 12px;
padding-top: 14px;
border-top: 1px solid var(--el-border-color-lighter);
}
:deep(.filter) {
width: 100% !important;
height: 100% !important;
margin-right: 0 !important;
padding: 14px !important;
}
:deep(.card) {
padding: 14px;
}
:deep(.table-search) {
padding: 14px 14px 0 !important;
margin-bottom: 10px !important;
}
:deep(.table-main) {
height: 90%;
flex: 1;
display: flex;
flex-direction: column;
}
:deep(.el-pagination) {
margin-top: 12px;
}
:deep(.table-header) {
.header-button-lf,
.header-button-ri {
margin-bottom: 10px;
}
}
</style>
@@ -27,6 +27,8 @@ export interface RoleSelectProps {
multiple?: boolean;
/** 最大角色数 */
maxCount?: number;
/** 弹窗宽度尺寸 */
formSize?: string;
}
/** 角色选择器表格初始化参数 */
+1 -1
View File
@@ -26,7 +26,7 @@ export const USER_CENTER_URL: string = "/userCenter";
export const DEFAULT_PRIMARY: string = "#409EFF";
// 路由白名单地址(本地存在的路由 staticRouter.ts 中)
export const ROUTER_WHITE_LIST: string[] = ["/500", "/onboarding/fill"];
export const ROUTER_WHITE_LIST: string[] = ["/500"];
// 高德地图 key
export const AMAP_MAP_KEY: string = "";
+3
View File
@@ -13,6 +13,7 @@
* @see https://gitee.com/dotnetmoyu/SimpleAdmin
*/
import { useAuthStore } from "@/stores/modules/auth";
import { useUserStore } from "@/stores/modules/user";
import type { Directive, DirectiveBinding } from "vue";
/**
@@ -32,6 +33,8 @@ const auth: Directive = {
const { value, arg } = binding;
// 获取authStore
const authStore = useAuthStore();
const userStore = useUserStore();
if ((userStore.userInfoGet?.roleCodeList || []).includes("superAdmin")) return;
// 获取用户权限按钮列表
const currentPageRoles = authStore.authButtonListGet ?? [];
// 如果传入的值是数组,并且数组的长度大于0
+59
View File
@@ -0,0 +1,59 @@
import { ref } from "vue";
import {
onboardingTaskApi,
type OnboardingDepartmentOption,
type OnboardingPositionOption
} from "@/api/modules/biz/onboarding";
type ScopeSelection = { companyId?: number; departmentId?: number; positionId?: number };
/** 公司、部门、岗位只按当前选择加载;过期响应不能覆盖新选择。 */
export function useOnboardingScopeOptions(
getSelection: () => ScopeSelection | undefined,
syncOptions?: () => void
) {
const departments = ref<OnboardingDepartmentOption[]>([]);
const positions = ref<OnboardingPositionOption[]>([]);
let companyRequest = 0;
let departmentRequest = 0;
function reset() {
companyRequest++;
departmentRequest++;
departments.value = [];
positions.value = [];
const selection = getSelection();
if (selection) {
selection.departmentId = undefined;
selection.positionId = undefined;
}
syncOptions?.();
}
async function onCompanyChange(companyId?: number) {
reset();
if (!companyId) return;
const request = companyRequest;
const { data } = await onboardingTaskApi.listDepartments(companyId).catch(() => ({ data: [] }));
if (request !== companyRequest || getSelection()?.companyId !== companyId) return;
departments.value = data || [];
syncOptions?.();
}
async function onDepartmentChange(departmentId?: number) {
const request = ++departmentRequest;
positions.value = [];
const selection = getSelection();
if (selection) selection.positionId = undefined;
syncOptions?.();
const companyId = selection?.companyId;
if (!companyId || !departmentId) return;
const { data } = await onboardingTaskApi.listPositionsByDepartment(departmentId).catch(() => ({ data: [] }));
const current = getSelection();
if (request !== departmentRequest || current?.companyId !== companyId || current?.departmentId !== departmentId) return;
positions.value = data || [];
syncOptions?.();
}
return { departments, positions, onCompanyChange, onDepartmentChange, reset };
}
+2
View File
@@ -18,6 +18,8 @@ import "element-plus/theme-chalk/dark/css-vars.css";
import "@/styles/element-dark.scss";
// custom element css
import "@/styles/element.scss";
// custom mobile feedback (Message / MessageBox / Dialog on mobile screens)
import "@/styles/mobile-feedback.scss";
// svg icons
import "virtual:svg-icons-register";
// element plus
+65
View File
@@ -0,0 +1,65 @@
import { createApp } from "vue";
import ElementPlus from "element-plus";
import {
Briefcase,
Calendar,
Check,
Delete,
Document,
Download,
FirstAidKit,
FolderChecked,
HomeFilled,
OfficeBuilding,
Phone,
Plus,
Reading,
Refresh,
School,
Tickets,
Upload,
User
} from "@element-plus/icons-vue";
import PublicApp from "./PublicApp.vue";
import publicRouter from "@/routers/public";
import errorHandler from "@/utils/errorHandler";
import "@/styles/reset.scss";
import "@/styles/common.scss";
import "element-plus/dist/index.css";
import "@/styles/mobile-feedback.scss";
import "virtual:uno.css";
import "default-passive-events";
if (typeof document !== "undefined") {
document.documentElement.classList.add("is-public-app");
}
const app = createApp(PublicApp);
const publicIcons = {
Briefcase,
Calendar,
Check,
Delete,
Document,
Download,
FirstAidKit,
FolderChecked,
HomeFilled,
OfficeBuilding,
Phone,
Plus,
Reading,
Refresh,
School,
Tickets,
Upload,
User
};
app.config.errorHandler = errorHandler;
Object.entries(publicIcons).forEach(([name, component]) => {
app.component(name, component);
});
app.use(ElementPlus).use(publicRouter).mount("#app");
+6 -1
View File
@@ -36,6 +36,7 @@ const routerMode = {
* @param meta ==> 路由菜单元信息
* @param meta.icon ==> 菜单和面包屑对应的图标
* @param meta.title ==> 路由标题 (用作 document.title || 菜单的名称)
* @param meta.standaloneTitle ==> 是否仅显示路由标题,不拼接系统名称
* @param meta.activeMenu ==> 当前路由为详情页时,需要高亮的菜单
* @param meta.isLink ==> 路由外链时填写的访问地址
* @param meta.isHide ==> 是否在菜单中隐藏 (通常列表详情页需要隐藏)
@@ -62,7 +63,11 @@ router.beforeEach(async (to, from, next) => {
// 2.动态设置标题
const title = import.meta.env.VITE_GLOB_APP_TITLE;
document.title = to.meta.title ? `${to.meta.title} - ${title}` : title;
document.title = to.meta.standaloneTitle && to.meta.title
? String(to.meta.title)
: to.meta.title
? `${to.meta.title} - ${title}`
: title;
// 3.判断是访问登陆页,有 Token 就在当前页面,没有 Token 重置路由到登陆页
if (to.path.toLocaleLowerCase() === LOGIN_URL) {
+4 -1
View File
@@ -19,7 +19,10 @@ import { useUserStore, useAuthStore, useDictStore, useConfigStore } from "@/stor
import router from "@/routers";
// 引入 views 文件夹下所有 vue 文件
const modules = import.meta.glob("@/views/**/*.vue");
const modules = import.meta.glob([
"@/views/**/*.vue",
"!@/views/onboarding/**/*.vue"
]);
/**
* @description 初始化动态路由
-6
View File
@@ -31,12 +31,6 @@ export const staticRouter: RouteRecordRaw[] = [
title: "登录"
}
},
{
path: "/onboarding/fill",
name: "onboardingFill",
component: () => import("@/views/onboarding/fill/index.vue"),
meta: { title: "入职资料填写" }
},
{
path: "/layout",
name: "layout",
+55
View File
@@ -0,0 +1,55 @@
import { createRouter, createWebHashHistory, type RouteRecordRaw } from "vue-router";
const routes: RouteRecordRaw[] = [
{
path: "/",
name: "invalidOnboardingLink",
component: () => import("@/views/onboarding/public-status/index.vue"),
props: {
title: "入职链接无效",
description: "请联系招聘人员重新获取入职链接。"
},
meta: { title: "入职链接无效" }
},
{
path: "/onboarding/fill",
name: "onboardingFill",
component: () => import("@/views/onboarding/fill/index.vue"),
meta: { title: "入职服务" }
},
{
path: "/invalid-link",
redirect: "/"
},
{
path: "/404",
name: "publicNotFound",
component: () => import("@/views/onboarding/public-status/index.vue"),
props: {
title: "页面不存在",
description: "请检查入职链接是否完整,或联系招聘人员重新获取。"
},
meta: { title: "页面不存在" }
},
{
path: "/:pathMatch(.*)*",
redirect: "/404"
}
];
const router = createRouter({
history: createWebHashHistory(),
routes,
scrollBehavior: () => ({ left: 0, top: 0 })
});
router.beforeEach(to => {
if (to.path === "/onboarding/fill" && !String(to.query.token || "").trim()) {
return { name: "invalidOnboardingLink", replace: true };
}
document.title = String(to.meta.title || "入职服务");
return true;
});
export default router;
+403
View File
@@ -0,0 +1,403 @@
/**
* 移动端专属提示与弹窗交互体系
* 1. 在屏幕宽度 <= 768px 时对全局生效(手机端体验极致优化)
* 2. 在员工公开入职端 (html.is-public-app) 全面生效(无论手机真机或 PC 浏览器预览入职均享有一致的精致体验)
* 3. 严格隔离 PC 端后台管理系统,保证 PC 管理端在桌面大屏下 100% 保持标准桌面交互规范。
*/
@mixin mobile-feedback-rules {
/* ==========================================================================
1. ElMessage 移动端悬浮胶囊 Toast
========================================================================== */
.el-message {
min-width: unset !important;
width: max-content !important;
max-width: calc(100vw - 32px) !important;
padding: 10px 18px !important;
border-radius: 9999px !important;
box-shadow: 0 10px 25px -4px rgba(0, 0, 0, 0.12), 0 4px 10px -2px rgba(0, 0, 0, 0.05) !important;
backdrop-filter: blur(14px) !important;
-webkit-backdrop-filter: blur(14px) !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
box-sizing: border-box !important;
left: 50% !important;
transform: translateX(-50%) !important;
/* 适配刘海屏及微信导航栏安全区 */
margin-top: env(safe-area-inset-top, 14px) !important;
transition: top 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease, transform 0.25s ease !important;
pointer-events: auto !important;
.el-message__icon {
margin-right: 8px !important;
font-size: 18px !important;
flex-shrink: 0 !important;
}
.el-message__content {
font-size: 14px !important;
line-height: 1.45 !important;
font-weight: 500 !important;
word-break: break-word !important;
text-align: center !important;
padding: 0 !important;
}
.el-message__closeBtn {
margin-left: 10px !important;
font-size: 14px !important;
flex-shrink: 0 !important;
}
/* 品牌成功绿 (Emerald) */
&.el-message--success {
background: rgba(240, 253, 244, 0.96) !important;
border: 1px solid #86efac !important;
.el-message__icon {
color: #059669 !important;
}
.el-message__content {
color: #064e3b !important;
font-weight: 600 !important;
}
.el-message__closeBtn {
color: #059669 !important;
}
}
/* 品牌暖琥珀黄 (Amber) */
&.el-message--warning {
background: rgba(254, 252, 232, 0.96) !important;
border: 1px solid #fde047 !important;
.el-message__icon {
color: #d97706 !important;
}
.el-message__content {
color: #78350f !important;
font-weight: 600 !important;
}
.el-message__closeBtn {
color: #d97706 !important;
}
}
/* 柔和玫瑰红 (Rose) */
&.el-message--error {
background: rgba(255, 241, 242, 0.96) !important;
border: 1px solid #fca5a5 !important;
.el-message__icon {
color: #e11d48 !important;
}
.el-message__content {
color: #881337 !important;
font-weight: 600 !important;
}
.el-message__closeBtn {
color: #e11d48 !important;
}
}
/* 晨雾优雅蓝灰 (Slate) */
&.el-message--info {
background: rgba(248, 250, 252, 0.96) !important;
border: 1px solid #cbd5e1 !important;
.el-message__icon {
color: #059669 !important;
}
.el-message__content {
color: #1e293b !important;
font-weight: 600 !important;
}
.el-message__closeBtn {
color: #64748b !important;
}
}
}
/* ==========================================================================
2. ElMessageBox 移动端原生卡片弹框 (Confirm / Alert)
========================================================================== */
.el-overlay.is-message-box {
background-color: rgba(15, 23, 42, 0.52) !important;
backdrop-filter: blur(5px) !important;
-webkit-backdrop-filter: blur(5px) !important;
.el-overlay-message-box {
display: flex !important;
align-items: center !important;
justify-content: center !important;
padding: 16px !important;
box-sizing: border-box !important;
/* 清除 PC 端 inline-block + vertical-align 伪类居中 */
&::after {
display: none !important;
}
}
}
.el-message-box {
display: flex !important;
flex-direction: column !important;
width: min(calc(100vw - 36px), 336px) !important;
max-width: 336px !important;
padding: 24px 20px 20px !important;
border-radius: 20px !important;
border: 1px solid rgba(255, 255, 255, 0.9) !important;
background: #ffffff !important;
box-shadow: 0 20px 45px -10px rgba(6, 78, 59, 0.18), 0 10px 20px -5px rgba(0, 0, 0, 0.08) !important;
text-align: center !important;
overflow: hidden !important;
box-sizing: border-box !important;
animation: mobileBoxPop 0.26s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
/* 弹框头部 */
.el-message-box__header {
padding: 0 0 10px !important;
position: relative !important;
border-bottom: none !important;
.el-message-box__title {
justify-content: center !important;
text-align: center !important;
span {
font-size: 18px !important;
font-weight: 700 !important;
color: #064e3b !important;
letter-spacing: 0.3px !important;
}
}
/* 隐藏 PC 端右上角极小叉号,避免手机端误触 */
.el-message-box__headerbtn {
display: none !important;
}
}
/* 弹框内容区 */
.el-message-box__content {
padding: 6px 4px 20px !important;
text-align: center !important;
}
.el-message-box__container {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
gap: 12px !important;
}
/* 拟物状态大徽标 */
.el-message-box__status {
position: static !important;
transform: none !important;
margin: 0 auto 4px !important;
font-size: 30px !important;
width: 52px !important;
height: 52px !important;
border-radius: 50% !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
&.el-message-box-icon--success {
color: #059669 !important;
background: #ecfdf5 !important;
border: 2px solid #a7f3d0 !important;
}
&.el-message-box-icon--warning {
color: #d97706 !important;
background: #fffbeb !important;
border: 2px solid #fde68a !important;
}
&.el-message-box-icon--error {
color: #e11d48 !important;
background: #fff1f2 !important;
border: 2px solid #fecdd3 !important;
}
&.el-message-box-icon--info {
color: #059669 !important;
background: #f0fdf7 !important;
border: 2px solid #d1fae5 !important;
}
}
.el-message-box__message {
padding: 0 !important;
text-align: center !important;
p {
margin: 0 !important;
font-size: 14px !important;
line-height: 1.65 !important;
color: #475569 !important;
word-break: break-word !important;
}
}
/* 按钮操作区 (44pt 移动端人机工效大按钮) */
.el-message-box__btns {
display: flex !important;
flex-direction: row !important;
gap: 10px !important;
padding: 0 !important;
justify-content: center !important;
.el-button {
flex: 1 1 0 !important;
min-width: 0 !important;
margin: 0 !important;
height: 44px !important;
min-height: 44px !important;
border-radius: 12px !important;
font-size: 15px !important;
font-weight: 600 !important;
box-sizing: border-box !important;
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
cursor: pointer !important;
/* 点击微触觉缩放反馈 */
&:active {
transform: scale(0.97) !important;
}
}
/* 次要/取消按钮 ("再检查一下"、"取消") */
.el-button:not(.el-button--primary) {
background: #f1f5f9 !important;
border: 1px solid #e2e8f0 !important;
color: #475569 !important;
&:active {
background: #e2e8f0 !important;
color: #1e293b !important;
}
}
/* 主要/确认按钮 ("确认提交"、"我知道了") */
.el-button--primary {
background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
border: none !important;
color: #ffffff !important;
box-shadow: 0 4px 12px rgba(5, 150, 105, 0.3) !important;
&:active {
background: linear-gradient(135deg, #047857 0%, #065f46 100%) !important;
box-shadow: 0 2px 6px rgba(5, 150, 105, 0.2) !important;
}
}
}
}
/* ==========================================================================
3. ElAlert 移动端微卡片优化
========================================================================== */
.el-alert {
border-radius: 12px !important;
padding: 10px 14px !important;
box-sizing: border-box !important;
.el-alert__title {
font-size: 13px !important;
line-height: 1.5 !important;
}
.el-alert__description {
font-size: 12px !important;
line-height: 1.55 !important;
margin-top: 4px !important;
}
&.el-alert--info {
background-color: #f0fdf4 !important;
border: 1px solid #bbf7d0 !important;
color: #166534 !important;
.el-alert__icon {
color: #059669 !important;
}
}
&.el-alert--success {
background-color: #ecfdf5 !important;
border: 1px solid #a7f3d0 !important;
color: #065f46 !important;
.el-alert__icon {
color: #059669 !important;
}
}
&.el-alert--warning {
background-color: #fffbeb !important;
border: 1px solid #fde68a !important;
color: #92400e !important;
.el-alert__icon {
color: #d97706 !important;
}
}
&.el-alert--error {
background-color: #fff1f2 !important;
border: 1px solid #fecdd3 !important;
color: #9f1239 !important;
.el-alert__icon {
color: #e11d48 !important;
}
}
}
/* ==========================================================================
4. ElDialog 移动端通用轻量圆角抽屉/卡片
========================================================================== */
.el-dialog {
width: min(calc(100vw - 32px), 520px) !important;
max-width: calc(100vw - 32px) !important;
margin: 20px auto !important;
border-radius: 18px !important;
overflow: hidden !important;
box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.15) !important;
}
}
/* 屏幕宽度 <= 768px(手机、垂直平板)生效 */
@media screen and (max-width: 768px) {
@include mobile-feedback-rules;
}
/* 员工入职前端(无论手机真机或 PC 浏览器预览均享有该高级样式) */
html.is-public-app {
@include mobile-feedback-rules;
}
/* 移动端弹窗弹出平滑缩放进入动画 */
@keyframes mobileBoxPop {
0% {
opacity: 0;
transform: scale(0.92);
}
100% {
opacity: 1;
transform: scale(1);
}
}
+4
View File
@@ -57,6 +57,9 @@ declare type Recordable<T = any> = Record<string, T>;
declare interface ViteEnv {
VITE_USER_NODE_ENV: "development" | "production" | "test";
VITE_APP_VARIANT: "admin" | "public";
VITE_APP_ENTRY: string;
VITE_APP_FAVICON: string;
VITE_GLOB_APP_TITLE: string;
VITE_PORT: number;
VITE_OPEN: boolean;
@@ -69,6 +72,7 @@ declare interface ViteEnv {
VITE_DEVTOOLS: boolean;
VITE_PUBLIC_PATH: string;
VITE_API_URL: string;
VITE_PUBLIC_ONBOARDING_URL: string;
VITE_PROXY: [string, string][];
VITE_CODEINSPECTOR: boolean;
}
+41
View File
@@ -323,3 +323,44 @@ export function findItemNested(enumData: any, callValue: any, value: string, chi
if (current[children]) return findItemNested(current[children], callValue, value, children);
}, null);
}
/**
* @description 复制文本到剪贴板(兼容安全上下文 HTTPS 与非安全上下文 HTTP/IP 环境)
* @param {String} text 要复制的文本
* @returns {Promise<boolean>} 是否成功复制
*/
export async function copyToClipboard(text: string): Promise<boolean> {
if (!text) return false;
// 1. 现代 Clipboard API (仅在 Secure Context 如 HTTPS 或 localhost 下可用)
if (navigator?.clipboard?.writeText) {
try {
await navigator.clipboard.writeText(text);
return true;
} catch (err) {
console.warn("navigator.clipboard.writeText failed, falling back to execCommand: ", err);
}
}
// 2. 降级方案:创建隐藏 textarea 并调用 document.execCommand('copy')
try {
const textArea = document.createElement("textarea");
textArea.value = text;
textArea.style.position = "fixed";
textArea.style.top = "0";
textArea.style.left = "-9999px";
textArea.style.opacity = "0";
textArea.setAttribute("readonly", "");
document.body.appendChild(textArea);
textArea.focus();
textArea.select();
textArea.setSelectionRange(0, text.length);
const successful = document.execCommand("copy");
document.body.removeChild(textArea);
return successful;
} catch (fallbackErr) {
console.error("document.execCommand('copy') failed: ", fallbackErr);
return false;
}
}
+33
View File
@@ -0,0 +1,33 @@
/** 判断 Element Plus 弹窗是否由用户主动取消或关闭。 */
function isUserCancelled(action: unknown) {
return action === "cancel" || action === "close";
}
/**
* 执行确认弹窗。用户取消时返回 false,真正的异常继续抛出。
*/
export async function isMessageBoxConfirmed(confirmPromise: Promise<unknown>) {
try {
await confirmPromise;
return true;
} catch (action) {
if (isUserCancelled(action)) {
return false;
}
throw action;
}
}
/**
* 执行输入弹窗。用户取消时返回 null,真正的异常继续抛出。
*/
export async function getMessageBoxPromptResult<T>(promptPromise: Promise<T>) {
try {
return await promptPromise;
} catch (action) {
if (isUserCancelled(action)) {
return null;
}
throw action;
}
}
+45
View File
@@ -0,0 +1,45 @@
import { computed } from "vue";
import { useAuthStore } from "@/stores/modules/auth";
import { useUserStore } from "@/stores/modules/user";
export interface OnboardingOwnedRecord {
createUserId?: number | string | null;
}
/**
* 入职业务页面统一权限判断:按钮权限控制功能入口,创建人/管理全部权限控制数据操作范围。
*/
export function useOnboardingPermission(manageAllCode: string) {
const authStore = useAuthStore();
const userStore = useUserStore();
const isSuperAdmin = computed(() =>
(userStore.userInfoGet?.roleCodeList || []).includes("superAdmin")
);
const canManageAll = computed(
() =>
isSuperAdmin.value ||
authStore.authButtonListGet.includes(manageAllCode)
);
const hasAction = (code: string) =>
isSuperAdmin.value || authStore.authButtonListGet.includes(code);
const canManage = (record?: OnboardingOwnedRecord | null) => {
if (canManageAll.value) return true;
if (record?.createUserId == null || userStore.userInfoGet?.id == null)
return false;
return String(record.createUserId) === String(userStore.userInfoGet.id);
};
const disabledReason = (record?: OnboardingOwnedRecord | null) =>
canManage(record) ? "" : "只能操作本人创建的数据";
return {
isSuperAdmin,
canManageAll,
hasAction,
canManage,
disabledReason
};
}
+117
View File
@@ -0,0 +1,117 @@
/**
* 入职登记表固定字段校验工具。
*
* 前端校验用于即时提示,后端仍会执行同样的核心校验,避免绕过页面直接提交非法数据。
*/
const mobilePhonePattern = /^1[3-9]\d{9}$/;
const landlinePhonePattern = /^0\d{2,3}-?\d{7,8}$/;
const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
const bankCardPattern = /^\d{12,19}$/;
const idCardWeights = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
const idCardCheckCodes = ["1", "0", "X", "9", "8", "7", "6", "5", "4", "3", "2"];
export function normalizeIdCardNumber(value: unknown) {
return String(value ?? "").trim().toUpperCase();
}
export function normalizeBankCardNumber(value: unknown) {
return String(value ?? "").replace(/[\s-]/g, "");
}
export function isMobilePhone(value: unknown) {
return mobilePhonePattern.test(String(value ?? "").trim());
}
export function isContactPhone(value: unknown) {
const phone = String(value ?? "").trim();
return mobilePhonePattern.test(phone) || landlinePhonePattern.test(phone);
}
export function isEmail(value: unknown) {
return emailPattern.test(String(value ?? "").trim());
}
export function isBankCardNumber(value: unknown) {
return bankCardPattern.test(normalizeBankCardNumber(value));
}
/**
* 校验中国大陆 18 位居民身份证,包括出生日期和校验位。
* 返回空字符串表示校验通过,否则返回适合直接展示给用户的错误信息。
*/
export function getIdCardValidationMessage(value: unknown) {
const idCardNumber = normalizeIdCardNumber(value);
if (!/^\d{17}[0-9X]$/.test(idCardNumber)) {
return "请输入正确的18位身份证号码";
}
const birthday = getIdCardBirthday(idCardNumber);
if (!birthday || !isValidDateText(birthday) || birthday > getTodayText()) {
return "身份证号码中的出生日期不正确";
}
const total = idCardWeights.reduce(
(sum, weight, index) => sum + Number(idCardNumber[index]) * weight,
0
);
if (idCardCheckCodes[total % 11] !== idCardNumber[17]) {
return "身份证号码校验位不正确";
}
return "";
}
export function getIdCardBirthday(value: unknown) {
const idCardNumber = normalizeIdCardNumber(value);
if (!/^\d{17}[0-9X]$/.test(idCardNumber)) {
return "";
}
const text = idCardNumber.slice(6, 14);
return `${text.slice(0, 4)}-${text.slice(4, 6)}-${text.slice(6, 8)}`;
}
export function getIdCardGender(value: unknown) {
const idCardNumber = normalizeIdCardNumber(value);
if (!/^\d{17}[0-9X]$/.test(idCardNumber)) {
return "";
}
const genderCode = Number(idCardNumber.charAt(16));
return genderCode % 2 === 1 ? "男" : "女";
}
export function isNumberInRange(value: unknown, min: number, max: number) {
const text = String(value ?? "").trim();
if (!/^\d+(\.\d+)?$/.test(text)) {
return false;
}
const number = Number(text);
return Number.isFinite(number) && number >= min && number <= max;
}
function isValidDateText(value: string) {
const match = /^(\d{4})-(\d{2})-(\d{2})$/.exec(value);
if (!match) {
return false;
}
const year = Number(match[1]);
const month = Number(match[2]);
const day = Number(match[3]);
const date = new Date(year, month - 1, day);
return date.getFullYear() === year
&& date.getMonth() === month - 1
&& date.getDate() === day;
}
function getTodayText() {
const now = new Date();
const year = now.getFullYear();
const month = String(now.getMonth() + 1).padStart(2, "0");
const day = String(now.getDate()).padStart(2, "0");
return `${year}-${month}-${day}`;
}
+229 -50
View File
@@ -5,9 +5,10 @@
title="签署材料模板列表"
:columns="templateColumns"
:request-api="onboardingTaskApi.templatePage"
@reset="resetSearchScope"
>
<template #tableHeader>
<el-button type="primary" icon="Plus" @click="openTemplateCreate">
<el-button v-auth="'onboardingContractAdd'" type="primary" icon="Plus" @click="openTemplateCreate">
新增签署材料模板
</el-button>
</template>
@@ -50,11 +51,27 @@
版本与配置
</el-button>
<el-button link type="primary" icon="Edit" @click="openTemplateEdit(scope.row)">
<el-button
v-auth="'onboardingContractEdit'"
link
type="primary"
icon="Edit"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="openTemplateEdit(scope.row)"
>
编辑
</el-button>
<el-button link type="danger" icon="Delete" @click="removeTemplate(scope.row)">
<el-button
v-auth="'onboardingContractDelete'"
link
type="danger"
icon="Delete"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="removeTemplate(scope.row)"
>
删除
</el-button>
</template>
@@ -158,7 +175,7 @@
<el-drawer
v-model="drawerVisible"
:title="`签署材料模板管理 · ${selectedTemplate?.templateName || ''}`"
size="1150px"
size="min(1500px, 96vw)"
destroy-on-close
>
<div v-if="selectedTemplate" class="drawer-content-box">
@@ -184,11 +201,18 @@
<el-tab-pane label="版本与DOCX模板" name="versions">
<div class="tab-pane-content">
<div class="pane-action-bar">
<el-button type="primary" icon="Upload" @click="openVersionCreate">
<el-button
v-auth="'onboardingContractVersionAdd'"
type="primary"
icon="Upload"
:disabled="!canManage(selectedTemplate)"
:title="disabledReason(selectedTemplate)"
@click="openVersionCreate"
>
上传新版本 DOCX
</el-button>
<span class="pane-tip-text">
支持多版本迭代。启用某个版本后,该版本的 DOCX 将用于生成新入职员工的签署材料。
支持多版本迭代。启用版本后用于生成新入职员工的签署材料;盖章开关的修改仅影响后续新建任务。
</span>
</div>
@@ -207,8 +231,37 @@
</template>
</el-table-column>
<el-table-column prop="effectiveDate" label="生效日期" width="130" align="center" />
<el-table-column prop="expiryDate" label="失效日期" width="130" align="center" />
<el-table-column label="公司盖章" width="100" align="center">
<template #default="scope">
<el-switch
:model-value="scope.row.companySealEnabled === true"
:loading="sealUpdating[scope.row.id] === 'companySealEnabled'"
:disabled="!canEditVersionSeals || !!sealUpdating[scope.row.id]"
:title="versionSealDisabledReason"
aria-label="公司盖章"
@change="value => changeVersionSeal(scope.row, 'companySealEnabled', value)"
/>
</template>
</el-table-column>
<el-table-column label="骑缝章" width="100" align="center">
<template #default="scope">
<el-switch
:model-value="scope.row.acrossPageSealEnabled === true"
:loading="sealUpdating[scope.row.id] === 'acrossPageSealEnabled'"
:disabled="!canEditVersionSeals || !!sealUpdating[scope.row.id]"
:title="versionSealDisabledReason"
aria-label="骑缝章"
@change="value => changeVersionSeal(scope.row, 'acrossPageSealEnabled', value)"
/>
</template>
</el-table-column>
<el-table-column label="生效时间" width="175" align="center">
<template #default="scope">{{ formatVersionTime(scope.row.effectiveDate) }}</template>
</el-table-column>
<el-table-column label="失效时间" width="175" align="center">
<template #default="scope">{{ formatVersionTime(scope.row.expiryDate) }}</template>
</el-table-column>
<el-table-column prop="remark" label="版本说明" min-width="150" />
<el-table-column label="操作" width="340" fixed="right" align="center">
@@ -233,29 +286,38 @@
</el-button>
<el-button
v-auth="'onboardingContractVersionStatus'"
v-if="scope.row.versionStatus !== 'enabled'"
link
type="success"
icon="Check"
:disabled="!canManage(selectedTemplate)"
:title="disabledReason(selectedTemplate)"
@click="changeVersionStatus(scope.row, 'enabled')"
>
启用
</el-button>
<el-button
v-auth="'onboardingContractVersionStatus'"
v-else
link
type="warning"
icon="Close"
:disabled="!canManage(selectedTemplate)"
:title="disabledReason(selectedTemplate)"
@click="changeVersionStatus(scope.row, 'disabled')"
>
停用
</el-button>
<el-button
v-auth="'onboardingContractVersionDelete'"
link
type="danger"
icon="Delete"
:disabled="!canManage(selectedTemplate)"
:title="disabledReason(selectedTemplate)"
@click="removeVersion(scope.row)"
>
删除
@@ -279,6 +341,7 @@
v-model="versionVisible"
title="上传新版本 DOCX"
width="600px"
top="5vh"
destroy-on-close
append-to-body
>
@@ -312,14 +375,41 @@
</div>
</el-form-item>
<el-form-item label="生效日期">
<el-date-picker v-model="versionForm.effectiveDate" value-format="YYYY-MM-DD" class="w-full" />
<el-form-item label="生效时间">
<el-date-picker
v-model="versionForm.effectiveDate"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择生效时间"
class="w-full"
/>
</el-form-item>
<el-form-item label="失效日期">
<el-date-picker v-model="versionForm.expiryDate" value-format="YYYY-MM-DD" class="w-full" />
<el-form-item label="失效时间">
<el-date-picker
v-model="versionForm.expiryDate"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择失效时间"
class="w-full"
/>
</el-form-item>
<el-form-item label="公司盖章">
<el-switch v-model="versionForm.companySealEnabled" aria-label="公司盖章" />
</el-form-item>
<el-form-item label="骑缝章">
<el-switch v-model="versionForm.acrossPageSealEnabled" aria-label="骑缝章" />
</el-form-item>
<el-alert
title="所有材料均需员工签字。公司盖章和骑缝章可在版本列表调整,修改仅影响后续新建任务,已有任务和签约保持原配置。"
type="info"
:closable="false"
style="margin-bottom: 16px"
/>
<el-form-item label="版本备注">
<el-input v-model="versionForm.remark" type="textarea" :rows="2" placeholder="本次版本修订说明" />
</el-form-item>
@@ -405,7 +495,15 @@
<el-table-column label="操作" width="120" align="center" fixed="right">
<template #default="scope">
<el-button link type="primary" icon="Edit" @click="openVariableEdit(scope.row)">
<el-button
v-auth="'onboardingContractVariableEdit'"
link
type="primary"
icon="Edit"
:disabled="!canManage(selectedTemplate)"
:title="disabledReason(selectedTemplate)"
@click="openVariableEdit(scope.row)"
>
检查调整
</el-button>
</template>
@@ -436,7 +534,7 @@
</el-form-item>
<el-form-item label="变量类型" required>
<el-select v-model="variableForm.variableType" class="w-full">
<el-select v-model="variableForm.variableType" disabled class="w-full">
<el-option label="员工填写(从新员工基本信息/动态字段读取)" value="employee" />
<el-option label="公司信息(从公司档案自动读取)" value="company" />
<el-option label="人事预设填写(人事发起时录入)" value="contract" />
@@ -445,7 +543,7 @@
</el-form-item>
<el-form-item label="数据类型" required>
<el-select v-model="variableForm.dataType" class="w-full">
<el-select v-model="variableForm.dataType" disabled class="w-full">
<el-option label="文本" value="string" />
<el-option label="日期" value="date" />
<el-option label="数字" value="number" />
@@ -454,7 +552,7 @@
</el-form-item>
<el-form-item v-if="['employee', 'company'].includes(variableForm.variableType || '')" label="取值字段">
<el-input v-model="variableForm.employeeField" placeholder="如:EmployeeName、IdCardNumber、Phone" />
<el-input v-model="variableForm.employeeField" disabled placeholder="如:EmployeeName、IdCardNumber、Phone" />
</el-form-item>
<el-form-item label="默认值">
@@ -487,8 +585,10 @@
</template>
<script setup lang="ts" name="onboardingContract">
import { useOnboardingScopeOptions } from "@/hooks/useOnboardingScopeOptions";
import { computed, onMounted, reactive, ref } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import dayjs from "dayjs";
import { Check } from "@element-plus/icons-vue";
import {
onboardingTaskApi,
@@ -500,6 +600,11 @@ import {
type OnboardingTemplateVariable
} from "@/api/modules/biz/onboarding";
import type { ColumnProps, ProTableInstance } from "@/components/ProTable/interface";
import { isMessageBoxConfirmed } from "@/utils/messageBox";
import { useOnboardingPermission } from "@/utils/onboardingPermission";
import { copyToClipboard } from "@/utils";
const { canManage, disabledReason, hasAction } = useOnboardingPermission("onboardingContractManageAll");
const templateTable = ref<ProTableInstance>();
const selectedTemplate = ref<OnboardingContractTemplate>();
@@ -512,8 +617,19 @@ const companies = ref<OnboardingCompanyOption[]>([]);
const departments = ref<OnboardingDepartmentOption[]>([]);
const positions = ref<OnboardingPositionOption[]>([]);
const searchCompanies = ref<OnboardingCompanyOption[]>([]);
const searchDepartments = ref<OnboardingDepartmentOption[]>([]);
const searchPositions = ref<OnboardingPositionOption[]>([]);
const {
departments: searchDepartments,
positions: searchPositions,
onCompanyChange: onSearchCompanyChange,
onDepartmentChange: onSearchDepartmentChange,
reset: resetSearchScope
} = useOnboardingScopeOptions(
() => templateTable.value?.searchParam,
() => {
templateTable.value?.enumMap.set("departmentId", departmentSearchOptions.value);
templateTable.value?.enumMap.set("positionId", positionSearchOptions.value);
}
);
const companySearchOptions = computed(() =>
searchCompanies.value.map(c => ({
@@ -537,6 +653,16 @@ const positionSearchOptions = computed(() =>
);
const versions = ref<OnboardingContractVersion[]>([]);
type VersionSealField = "companySealEnabled" | "acrossPageSealEnabled";
const sealUpdating = reactive<Record<number, VersionSealField | undefined>>({});
const canEditVersionSeals = computed(() =>
canManage(selectedTemplate.value) && hasAction("onboardingContractEdit")
);
const versionSealDisabledReason = computed(() =>
!hasAction("onboardingContractEdit")
? "没有编辑签署材料模板的权限"
: disabledReason(selectedTemplate.value)
);
const versionVisible = ref(false);
const variablesVisible = ref(false);
const variables = ref<OnboardingTemplateVariable[]>([]);
@@ -572,11 +698,18 @@ const emptyTemplate = (): Partial<OnboardingContractTemplate> => ({
description: ""
});
const emptyVersion = (): Partial<OnboardingContractVersion> => ({
type OnboardingVersionForm = Partial<OnboardingContractVersion> & {
companySealEnabled: boolean;
acrossPageSealEnabled: boolean;
};
const emptyVersion = (): OnboardingVersionForm => ({
versionNo: "",
sourceDocxFileId: undefined,
effectiveDate: undefined,
expiryDate: undefined,
companySealEnabled: true,
acrossPageSealEnabled: true,
remark: ""
});
@@ -594,7 +727,7 @@ const emptyVariable = (): Partial<OnboardingTemplateVariable> => ({
});
const templateForm = reactive<Partial<OnboardingContractTemplate>>(emptyTemplate());
const versionForm = reactive<Partial<OnboardingContractVersion>>(emptyVersion());
const versionForm = reactive<OnboardingVersionForm>(emptyVersion());
const variableForm = reactive<Partial<OnboardingTemplateVariable>>(emptyVariable());
const templateColumns: ColumnProps<OnboardingContractTemplate>[] = [
@@ -605,7 +738,12 @@ const templateColumns: ColumnProps<OnboardingContractTemplate>[] = [
enum: companySearchOptions,
search: {
el: "select",
props: { filterable: true, clearable: true, placeholder: "请选择所属公司" }
props: {
filterable: true,
clearable: true,
placeholder: "请选择所属公司",
onChange: (val?: number) => onSearchCompanyChange(val)
}
}
},
{
@@ -615,7 +753,17 @@ const templateColumns: ColumnProps<OnboardingContractTemplate>[] = [
enum: departmentSearchOptions,
search: {
el: "select",
props: { filterable: true, clearable: true, placeholder: "请选择所属部门" }
props: {
filterable: true,
clearable: true,
get placeholder() {
return templateTable.value?.searchParam?.companyId ? "请选择所属部门" : "请先选择所属公司";
},
get disabled() {
return !templateTable.value?.searchParam?.companyId;
},
onChange: (val?: number) => onSearchDepartmentChange(val)
}
}
},
{
@@ -625,7 +773,16 @@ const templateColumns: ColumnProps<OnboardingContractTemplate>[] = [
enum: positionSearchOptions,
search: {
el: "select",
props: { filterable: true, clearable: true, placeholder: "请选择适用岗位" }
props: {
filterable: true,
clearable: true,
get placeholder() {
return templateTable.value?.searchParam?.departmentId ? "请选择适用岗位" : "请先选择所属部门";
},
get disabled() {
return !templateTable.value?.searchParam?.departmentId;
}
}
}
},
{ prop: "templateCode", label: "模板编码", minWidth: 160, search: { el: "input" } },
@@ -747,7 +904,11 @@ async function saveTemplate() {
}
async function removeTemplate(row: OnboardingContractTemplate) {
await ElMessageBox.confirm(`确认删除签署材料模板“${row.templateName}”?`, "删除确认", { type: "warning" });
const confirmed = await isMessageBoxConfirmed(
ElMessageBox.confirm(`确认删除签署材料模板“${row.templateName}”?`, "删除确认", { type: "warning" })
);
if (!confirmed) return;
await onboardingTaskApi.deleteTemplate([row.id]);
templateTable.value?.refresh();
ElMessage.success("删除成功");
@@ -779,10 +940,21 @@ async function uploadDocx(options: any) {
}
}
function formatVersionTime(value?: string) {
return value ? dayjs(value).format("YYYY-MM-DD HH:mm:ss") : "--";
}
async function saveVersion() {
if (!selectedTemplate.value || !versionForm.versionNo || !versionForm.sourceDocxFileId) {
return ElMessage.warning("请填写版本号并上传 DOCX 文件");
}
if (
versionForm.effectiveDate
&& versionForm.expiryDate
&& !dayjs(versionForm.expiryDate).isAfter(dayjs(versionForm.effectiveDate))
) {
return ElMessage.warning("失效时间必须晚于生效时间");
}
await onboardingTaskApi.addVersion({ ...versionForm, templateId: selectedTemplate.value.id });
versionVisible.value = false;
await loadVersions();
@@ -795,8 +967,33 @@ async function changeVersionStatus(row: OnboardingContractVersion, status: strin
ElMessage.success(`版本状态已更新为:${versionText(status)}`);
}
async function changeVersionSeal(
row: OnboardingContractVersion,
field: VersionSealField,
enabled: string | number | boolean
) {
if (typeof enabled !== "boolean" || !canEditVersionSeals.value || sealUpdating[row.id]) return;
sealUpdating[row.id] = field;
try {
// 只提交当前开关;另一个开关和历史任务快照均保持不变。
await onboardingTaskApi.setVersionSeals({ id: row.id, [field]: enabled });
const currentRow = versions.value.find(item => item.id === row.id);
if (currentRow) currentRow[field] = enabled;
ElMessage.success(`${field === "companySealEnabled" ? "公司盖章" : "骑缝章"}已${enabled ? "开启" : "关闭"},仅对后续新建任务生效`);
} catch {
// 请求层统一显示错误;保存失败时保留原开关状态。
} finally {
delete sealUpdating[row.id];
}
}
async function removeVersion(row: OnboardingContractVersion) {
await ElMessageBox.confirm(`确认删除签署材料版本“${row.versionNo}”?此操作不可撤销。`, "删除确认", { type: "warning" });
const confirmed = await isMessageBoxConfirmed(
ElMessageBox.confirm(`确认删除签署材料版本“${row.versionNo}”?此操作不可撤销。`, "删除确认", { type: "warning" })
);
if (!confirmed) return;
await onboardingTaskApi.deleteVersion(row.id);
await loadVersions();
ElMessage.success("版本删除成功");
@@ -881,9 +1078,13 @@ function formatPlaceholder(code: string) {
return `{{${code}}}`;
}
function copyPlaceholder(code: string) {
navigator.clipboard.writeText(`{{${code}}}`);
async function copyPlaceholder(code: string) {
const ok = await copyToClipboard(`{{${code}}}`);
if (ok) {
ElMessage.success(`占位符 {{${code}}} 已复制到剪贴板`);
} else {
ElMessage.warning(`自动复制失败,请手动复制 {{${code}}}`);
}
}
async function openVariables(row: OnboardingContractVersion) {
@@ -912,29 +1113,7 @@ async function saveVariable() {
async function loadSearchOptions() {
await loadCompanies();
searchCompanies.value = companies.value;
const deptList: OnboardingDepartmentOption[] = [];
const posList: OnboardingPositionOption[] = [];
if (companies.value && companies.value.length > 0) {
const promises = companies.value.map(async comp => {
const [depRes, posRes] = await Promise.all([
onboardingTaskApi.listDepartments(comp.id),
onboardingTaskApi.listPositions(comp.id)
]);
if (depRes.data) deptList.push(...depRes.data);
if (posRes.data) posList.push(...posRes.data);
});
await Promise.all(promises);
}
const uniqueDeptMap = new Map<number, OnboardingDepartmentOption>();
deptList.forEach(d => uniqueDeptMap.set(d.id, d));
searchDepartments.value = Array.from(uniqueDeptMap.values());
const uniquePosMap = new Map<number, OnboardingPositionOption>();
posList.forEach(p => uniquePosMap.set(p.id, p));
searchPositions.value = Array.from(uniquePosMap.values());
templateTable.value?.enumMap.set("companyId", companySearchOptions.value);
}
onMounted(loadSearchOptions);
File diff suppressed because it is too large Load Diff
@@ -16,7 +16,6 @@
placeholder="全部公司"
class="company-filter"
@change="onQueryCompanyChange"
@clear="onQueryCompanyChange"
>
<el-option v-for="item in companies" :key="item.id" :label="item.companyName" :value="item.id" />
</el-select>
@@ -24,10 +23,10 @@
v-model="query.departmentId"
clearable
filterable
placeholder="全部部门"
:placeholder="query.companyId ? '全部部门' : '请先选择所属公司'"
:disabled="!query.companyId"
class="department-filter"
@change="onQueryDepartmentChange"
@clear="onQueryDepartmentChange"
>
<el-option v-for="item in queryDepartments" :key="item.id" :label="item.departmentName" :value="item.id" />
</el-select>
@@ -35,10 +34,10 @@
v-model="query.positionId"
clearable
filterable
placeholder="全部岗位"
:placeholder="query.departmentId ? '全部岗位' : '请先选择所属部门'"
:disabled="!query.departmentId"
class="position-filter"
@change="loadTemplates"
@clear="loadTemplates"
>
<el-option v-for="item in queryPositions" :key="item.id" :label="item.positionName" :value="item.id" />
</el-select>
@@ -48,7 +47,6 @@
placeholder="模板状态"
class="status-filter"
@change="loadTemplates"
@clear="loadTemplates"
>
<el-option label="全部状态" value="" />
<el-option label="启用" value="enable" />
@@ -57,7 +55,7 @@
<el-button type="primary" icon="Search" @click="loadTemplates">查询</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
<div class="toolbar-spacer" />
<el-button type="primary" icon="Plus" @click="openCreate">新增入职模板</el-button>
<el-button v-auth="'onboardingEntryConfigAdd'" type="primary" icon="Plus" @click="openCreate">新增入职模板</el-button>
</div>
<el-alert title="入职模板统一管理公司、岗位、签署材料文件与员工上传材料;员工入职档案自动采用标准《入职登记表》。" type="info" :closable="false" show-icon
@@ -90,8 +88,22 @@
</el-table-column>
<el-table-column label="操作" width="150" fixed="right">
<template #default="scope">
<el-button link type="primary" @click="openEdit(scope.row)">编辑</el-button>
<el-button link type="danger" @click="removeTemplate(scope.row)">删除</el-button>
<el-button
v-auth="'onboardingEntryConfigEdit'"
link
type="primary"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="openEdit(scope.row)"
>编辑</el-button>
<el-button
v-auth="'onboardingEntryConfigDelete'"
link
type="danger"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="removeTemplate(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
@@ -118,7 +130,12 @@
<el-row :gutter="20">
<el-col :xs="24" :sm="8">
<el-form-item label="模板编码" required>
<el-input v-model="form.templateCode" placeholder="如:FULLTIME_DEV" />
<el-input
v-model="form.templateCode"
maxlength="100"
show-word-limit
placeholder="如:FULLTIME_DEV(纯字母也可以)"
/>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="8">
@@ -237,8 +254,18 @@
<span class="block-subtitle">勾选入职时要求候选人必须或可选上传的证件材料(如身份证、毕业证、体检表等)</span>
</div>
<el-table :data="materialTypes" border stripe height="240px" class="mt-2">
<el-table-column label="选择要求" width="85" align="center">
<el-table :data="enabledMaterialTypes" border stripe height="240px" class="mt-2">
<el-table-column label="选择要求" width="95" align="center">
<template #header>
<el-checkbox
:model-value="isAllMaterialsSelected"
:indeterminate="isMaterialsIndeterminate"
:disabled="!enabledMaterialTypes.length"
@change="handleSelectAllMaterials"
>
全选
</el-checkbox>
</template>
<template #default="scope">
<el-checkbox :model-value="hasMaterial(scope.row.id)"
@change="value => toggleMaterial(scope.row.id, Boolean(value))" />
@@ -274,19 +301,24 @@
</template>
<script setup lang="ts">
import { onMounted, reactive, ref } from "vue";
import { computed, onMounted, reactive, ref } from "vue";
import { useOnboardingScopeOptions } from "@/hooks/useOnboardingScopeOptions";
import { ElMessage, ElMessageBox } from "element-plus";
import dayjs from "dayjs";
import {
OnboardingCompany,
OnboardingCompanyOption,
OnboardingContractTemplate,
OnboardingContractVersion,
OnboardingDepartmentOption,
OnboardingMaterialType,
OnboardingPosition,
OnboardingPositionOption,
OnboardingTemplate,
onboardingTaskApi
} from "@/api/modules/biz/onboarding";
import { isMessageBoxConfirmed } from "@/utils/messageBox";
import { useOnboardingPermission } from "@/utils/onboardingPermission";
const { canManage, disabledReason } = useOnboardingPermission("onboardingEntryConfigManageAll");
const loading = ref(false);
const saving = ref(false);
@@ -294,13 +326,15 @@ const visible = ref(false);
const rows = ref<OnboardingTemplate[]>([]);
const total = ref(0);
const companies = ref<OnboardingCompany[]>([]);
const queryDepartments = ref<OnboardingDepartmentOption[]>([]);
const queryPositions = ref<OnboardingPositionOption[]>([]);
const props = defineProps<{ loadMaterials: () => Promise<OnboardingMaterialType[]> }>();
const companies = ref<OnboardingCompanyOption[]>([]);
const departments = ref<OnboardingDepartmentOption[]>([]);
const positions = ref<OnboardingPosition[]>([]);
const contractTemplates = ref<OnboardingContractTemplate[]>([]);
const materialTypes = ref<OnboardingMaterialType[]>([]);
const enabledMaterialTypes = computed(() =>
materialTypes.value.filter(item => item.status === "enable")
);
const versionOptions = reactive<Record<number, OnboardingContractVersion[]>>({});
const query = reactive({
@@ -327,96 +361,54 @@ const form = reactive<OnboardingTemplate>({
materials: []
});
async function loadAllQueryOptions() {
if (!companies.value || companies.value.length === 0) return;
const deptList: OnboardingDepartmentOption[] = [];
const posList: OnboardingPositionOption[] = [];
const {
departments: queryDepartments,
positions: queryPositions,
onCompanyChange: changeQueryCompany,
onDepartmentChange: changeQueryDepartment,
reset: resetQueryScope
} = useOnboardingScopeOptions(() => query);
const promises = companies.value.map(async comp => {
const [depRes, posRes] = await Promise.all([
onboardingTaskApi.listDepartments(comp.id).catch(() => ({ data: [] })),
onboardingTaskApi.listPositions(comp.id).catch(() => ({ data: [] }))
]);
if (depRes.data) deptList.push(...depRes.data);
if (posRes.data) posList.push(...posRes.data);
});
await Promise.all(promises);
const uniqueDeptMap = new Map<number, OnboardingDepartmentOption>();
deptList.forEach(d => uniqueDeptMap.set(d.id, d));
queryDepartments.value = Array.from(uniqueDeptMap.values());
const uniquePosMap = new Map<number, OnboardingPositionOption>();
posList.forEach(p => uniquePosMap.set(p.id, p));
queryPositions.value = Array.from(uniquePosMap.values());
let companiesLoaded = false;
let companyRequest: Promise<void> | undefined;
async function loadCompanies() {
if (companiesLoaded) return;
if (!companyRequest) {
companyRequest = onboardingTaskApi.listCompanies().then(({ data }) => {
companies.value = data || [];
companiesLoaded = true;
}).finally(() => { companyRequest = undefined; });
}
await companyRequest;
}
async function loadBaseData() {
const [companyRes, materialRes] = await Promise.all([
onboardingTaskApi.companyPage({ pageNum: 1, pageSize: 100, status: "enable" }).catch(() => ({ data: { list: [] } })),
onboardingTaskApi.listMaterialTypes().catch(() => ({ data: [] }))
]);
companies.value = companyRes.data?.list || [];
materialTypes.value = materialRes.data || [];
await loadAllQueryOptions();
const [, materials] = await Promise.all([loadCompanies(), props.loadMaterials()]);
materialTypes.value = materials;
}
let templateRequest = 0;
async function loadTemplates() {
const request = ++templateRequest;
loading.value = true;
try {
const res = await onboardingTaskApi.onboardingTemplatePage(query);
const res = await onboardingTaskApi.onboardingTemplatePage({ ...query });
if (request !== templateRequest) return;
rows.value = res.data?.list || [];
total.value = res.data?.total || 0;
} finally {
loading.value = false;
if (request === templateRequest) loading.value = false;
}
}
async function onQueryCompanyChange(companyId?: number) {
query.departmentId = undefined;
query.positionId = undefined;
if (!companyId) {
await loadAllQueryOptions();
} else {
const [depRes, posRes] = await Promise.all([
onboardingTaskApi.listDepartments(companyId).catch(() => ({ data: [] })),
onboardingTaskApi.listPositions(companyId).catch(() => ({ data: [] }))
]);
queryDepartments.value = depRes.data || [];
queryPositions.value = (posRes.data || []).map(p => ({
id: p.id,
positionName: p.positionName,
companyId: companyId,
departmentId: p.departmentId
} as any));
}
loadTemplates();
query.pageNum = 1;
await Promise.all([changeQueryCompany(companyId), loadTemplates()]);
}
async function onQueryDepartmentChange(departmentId?: number) {
query.positionId = undefined;
if (!departmentId) {
if (query.companyId) {
const posRes = await onboardingTaskApi.listPositions(query.companyId).catch(() => ({ data: [] }));
queryPositions.value = (posRes.data || []).map(p => ({
id: p.id,
positionName: p.positionName,
companyId: query.companyId!,
departmentId: p.departmentId
} as any));
} else {
await loadAllQueryOptions();
}
} else {
const posRes = await onboardingTaskApi.listPositionsByDepartment(departmentId).catch(() => ({ data: [] }));
queryPositions.value = (posRes.data || []).map(p => ({
id: p.id,
positionName: p.positionName,
companyId: p.companyId,
departmentId: departmentId
} as any));
}
loadTemplates();
query.pageNum = 1;
await Promise.all([changeQueryDepartment(departmentId), loadTemplates()]);
}
function resetQuery() {
@@ -426,7 +418,7 @@ function resetQuery() {
query.positionId = undefined;
query.status = "enable";
query.pageNum = 1;
loadAllQueryOptions();
resetQueryScope();
loadTemplates();
}
@@ -482,10 +474,23 @@ async function onContractTemplateChange(row: any) {
await loadContractVersions(row.contractTemplateId);
}
function isVersionCurrentlyAvailable(version: OnboardingContractVersion) {
const now = dayjs();
const effectiveAt = version.effectiveDate ? dayjs(version.effectiveDate) : undefined;
const expiresAt = version.expiryDate ? dayjs(version.expiryDate) : undefined;
return version.versionStatus === "enabled"
&& (!effectiveAt || (effectiveAt.isValid() && !effectiveAt.isAfter(now)))
&& (!expiresAt || (expiresAt.isValid() && expiresAt.isAfter(now)));
}
async function loadContractVersions(templateId: number) {
if (versionOptions[templateId]) return;
const res = await onboardingTaskApi.versionPage({ templateId, pageNum: 1, pageSize: 100 });
versionOptions[templateId] = (res.data?.list || []).filter((it: any) => it.versionStatus === "enabled");
const res = await onboardingTaskApi.versionPage({
templateId,
versionStatus: "enabled",
pageNum: 1,
pageSize: 100
});
versionOptions[templateId] = (res.data?.list || []).filter(isVersionCurrentlyAvailable);
}
function addContract() {
@@ -525,6 +530,35 @@ function toggleMaterial(materialTypeId: number, checked: boolean) {
}
}
const isAllMaterialsSelected = computed(() => {
if (!enabledMaterialTypes.value.length) return false;
return enabledMaterialTypes.value.every(item => hasMaterial(item.id));
});
const isMaterialsIndeterminate = computed(() => {
if (!enabledMaterialTypes.value.length) return false;
const selectedCount = enabledMaterialTypes.value.filter(item => hasMaterial(item.id)).length;
return selectedCount > 0 && selectedCount < enabledMaterialTypes.value.length;
});
function handleSelectAllMaterials(checked: boolean | string | number) {
const isChecked = Boolean(checked);
if (isChecked) {
enabledMaterialTypes.value.forEach(item => {
if (!hasMaterial(item.id)) {
form.materials.push({
materialTypeId: item.id,
required: true,
sortCode: (form.materials.length + 1) * 10
});
}
});
} else {
const enabledIds = new Set(enabledMaterialTypes.value.map(item => item.id));
form.materials = form.materials.filter(item => !enabledIds.has(item.materialTypeId));
}
}
async function openCreate() {
await loadBaseData();
Object.assign(form, {
@@ -574,6 +608,17 @@ async function openEdit(row: OnboardingTemplate) {
}))
});
const enabledMaterialIds = new Set(enabledMaterialTypes.value.map(item => item.id));
const disabledMaterials = materialTypes.value.filter(item =>
item.status !== "enable" && form.materials.some(config => config.materialTypeId === item.id)
);
form.materials = form.materials.filter(item => enabledMaterialIds.has(item.materialTypeId));
if (disabledMaterials.length > 0) {
ElMessage.warning(
`该模板原来关联的停用资料“${disabledMaterials.map(item => item.materialName).join("、")}”已从本次配置中移除,保存后生效`
);
}
if (form.companyId) {
const departmentRes = await onboardingTaskApi.listDepartments(form.companyId);
departments.value = departmentRes.data || [];
@@ -582,16 +627,30 @@ async function openEdit(row: OnboardingTemplate) {
const positionRes = await onboardingTaskApi.listPositionsByDepartment(form.departmentId);
positions.value = positionRes.data || [];
}
const configuredContractCount = form.contracts.length;
await loadAvailableContractTemplates();
const removedTemplateCount = configuredContractCount - form.contracts.length;
let clearedVersionCount = 0;
for (const contract of form.contracts) {
if (contract.contractTemplateId) {
await loadContractVersions(contract.contractTemplateId);
const availableVersions = versionOptions[contract.contractTemplateId] || [];
if (!availableVersions.some(item => item.id === contract.contractTemplateVersionId)) {
contract.contractTemplateVersionId = undefined as any;
clearedVersionCount++;
}
}
}
if (removedTemplateCount > 0 || clearedVersionCount > 0) {
ElMessage.warning(
"该入职模板原来关联了已停用、未生效或已失效的签署材料,已从当前选择中移除或清空,请重新选择后保存"
);
}
visible.value = true;
}
async function save() {
form.templateCode = form.templateCode.trim();
if (
!form.templateCode
|| !form.templateName
@@ -601,9 +660,20 @@ async function save() {
) {
return ElMessage.warning("请完整填写模板编码、名称、公司、部门及适用岗位");
}
if (!/^[A-Za-z][A-Za-z0-9._-]{0,99}$/.test(form.templateCode)) {
return ElMessage.warning("模板编码须以字母开头,最长 100 位,仅支持字母、数字、点、下划线和短横线");
}
if (!form.contracts.length || form.contracts.some(item => !item.contractTemplateId || !item.contractTemplateVersionId)) {
return ElMessage.warning("请完整选择至少一份签署材料模板及版本");
}
const containsUnavailableVersion = form.contracts.some(contract => {
const versions = versionOptions[contract.contractTemplateId] || [];
const selected = versions.find(item => item.id === contract.contractTemplateVersionId);
return !selected || !isVersionCurrentlyAvailable(selected);
});
if (containsUnavailableVersion) {
return ElMessage.warning("所选签署材料版本已停用、尚未生效或已经失效,请重新选择");
}
saving.value = true;
try {
@@ -617,7 +687,11 @@ async function save() {
}
async function removeTemplate(row: OnboardingTemplate) {
await ElMessageBox.confirm(`确认删除入职模板“${row.templateName}”吗?`, "删除确认", { type: "warning" });
const confirmed = await isMessageBoxConfirmed(
ElMessageBox.confirm(`确认删除入职模板“${row.templateName}”吗?`, "删除确认", { type: "warning" })
);
if (!confirmed) return;
await onboardingTaskApi.deleteOnboardingTemplate([row.id!]);
ElMessage.success("删除成功");
query.pageNum = 1;
@@ -625,7 +699,7 @@ async function removeTemplate(row: OnboardingTemplate) {
}
onMounted(async () => {
await Promise.all([loadBaseData(), loadTemplates()]);
await Promise.all([loadCompanies(), loadTemplates()]);
});
</script>
@@ -25,7 +25,7 @@
<el-button type="primary" icon="Search" @click="loadData">查询</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
<div class="spacer"></div>
<el-button type="primary" icon="Plus" @click="openCreate">新增自定义变量</el-button>
<el-button v-auth="'onboardingEntryConfigAdd'" type="primary" icon="Plus" @click="openCreate">新增自定义变量</el-button>
</div>
<el-alert
@@ -75,20 +75,33 @@
</template>
</el-table-column>
<el-table-column prop="remark" label="说明备注" min-width="200" show-overflow-tooltip />
<el-table-column prop="remark" label="说明备注" min-width="140" show-overflow-tooltip />
<el-table-column label="操作" width="140" align="center" fixed="right">
<el-table-column label="操作" width="160" align="center" fixed="right">
<template #default="{ row }">
<el-button link type="primary" icon="Edit" @click="openEdit(row)">编辑</el-button>
<div style="display: flex; align-items: center; justify-content: center; gap: 8px; white-space: nowrap;">
<el-button
v-auth="'onboardingEntryConfigEdit'"
link
type="primary"
icon="Edit"
:disabled="!canManage(row)"
:title="disabledReason(row)"
@click="openEdit(row)"
>编辑</el-button>
<el-button
v-auth="'onboardingEntryConfigDelete'"
v-if="!row.isBuiltIn"
link
type="danger"
icon="Delete"
:disabled="!canManage(row)"
:title="disabledReason(row)"
@click="remove(row)"
>
删除
</el-button>
</div>
</template>
</el-table-column>
</el-table>
@@ -168,6 +181,10 @@
import { ref, reactive, onMounted } from "vue";
import { ElMessage, ElMessageBox, FormInstance, FormRules } from "element-plus";
import { onboardingTaskApi } from "@/api/modules/biz/onboarding";
import { isMessageBoxConfirmed } from "@/utils/messageBox";
import { useOnboardingPermission } from "@/utils/onboardingPermission";
const { canManage, disabledReason } = useOnboardingPermission("onboardingEntryConfigManageAll");
const loading = ref(false);
const saving = ref(false);
@@ -293,7 +310,11 @@ async function save() {
}
async function remove(row: any) {
await ElMessageBox.confirm(`确认删除自定义变量“${row.variableCode}”?`, "删除确认", { type: "warning" });
const confirmed = await isMessageBoxConfirmed(
ElMessageBox.confirm(`确认删除自定义变量“${row.variableCode}”?`, "删除确认", { type: "warning" })
);
if (!confirmed) return;
await onboardingTaskApi.deleteVariableDefinitions([row.id]);
ElMessage.success("删除成功");
loadData();
+58 -16
View File
@@ -1,16 +1,16 @@
<template>
<div class="main-box config-container">
<el-tabs v-model="activeTab" class="config-tabs">
<el-tab-pane label="合同变量字典" name="variables">
<el-tab-pane lazy label="合同变量字典" name="variables">
<div class="tab-card-wrapper">
<VariableDefinitionPanel />
</div>
</el-tab-pane>
<el-tab-pane label="上传资料类型" name="materials">
<el-tab-pane lazy label="上传资料类型" name="materials">
<div class="tab-card-wrapper material-tab-wrapper">
<div class="toolbar">
<el-button type="primary" icon="Plus" @click="openMaterialCreate">
<el-button v-auth="'onboardingEntryConfigAdd'" type="primary" icon="Plus" @click="openMaterialCreate">
新增资料类型
</el-button>
</div>
@@ -35,11 +35,27 @@
<el-table-column label="操作" width="150" fixed="right" align="center">
<template #default="scope">
<el-button link type="primary" icon="Edit" @click="openMaterialEdit(scope.row)">
<el-button
v-auth="'onboardingEntryConfigEdit'"
link
type="primary"
icon="Edit"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="openMaterialEdit(scope.row)"
>
编辑
</el-button>
<el-button link type="danger" icon="Delete" @click="removeMaterial(scope.row)">
<el-button
v-auth="'onboardingEntryConfigDelete'"
link
type="danger"
icon="Delete"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="removeMaterial(scope.row)"
>
删除
</el-button>
</template>
@@ -48,16 +64,16 @@
</div>
</el-tab-pane>
<el-tab-pane label="入职模板" name="templates">
<el-tab-pane lazy label="入职模板" name="templates">
<div class="tab-card-wrapper">
<OnboardingTemplatePanel />
<OnboardingTemplatePanel :load-materials="loadMaterials" />
</div>
</el-tab-pane>
</el-tabs>
<!-- 资料类型弹窗 -->
<el-dialog v-model="materialVisible" :title="materialForm.id ? '编辑资料类型' : '新增资料类型'" width="560px" destroy-on-close>
<el-form :model="materialForm" label-width="110px">
<el-form :model="materialForm" label-width="120px" class="material-form">
<el-form-item label="资料编码" required>
<el-input v-model="materialForm.materialCode" />
</el-form-item>
@@ -72,10 +88,12 @@
<el-form-item label="最大文件数">
<el-input-number v-model="materialForm.maxFileCount" :min="1" :max="10" />
<span class="unit-suffix">个</span>
</el-form-item>
<el-form-item label="单文件大小(MB)">
<el-input-number v-model="materialForm.maxFileSizeMb" :min="1" :max="100" />
<el-form-item label="单文件大小">
<el-input-number v-model="materialForm.maxFileSizeMb" :min="1" :max="20" />
<span class="unit-suffix">MB</span>
</el-form-item>
<el-form-item label="状态">
@@ -95,14 +113,18 @@
</template>
<script setup lang="ts" name="onboardingEntryConfig">
import { onMounted, reactive, ref } from "vue";
import { reactive, ref, watch } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import {
OnboardingMaterialType,
onboardingTaskApi
} from "@/api/modules/biz/onboarding";
import { isMessageBoxConfirmed } from "@/utils/messageBox";
import OnboardingTemplatePanel from "./components/OnboardingTemplatePanel.vue";
import VariableDefinitionPanel from "./components/VariableDefinitionPanel.vue";
import { useOnboardingPermission } from "@/utils/onboardingPermission";
const { canManage, disabledReason } = useOnboardingPermission("onboardingEntryConfigManageAll");
const activeTab = ref("variables");
const materialTypes = ref<OnboardingMaterialType[]>([]);
@@ -118,9 +140,15 @@ const materialForm = reactive<Partial<OnboardingMaterialType>>({
status: "enable"
});
let materialRequest: Promise<OnboardingMaterialType[]> | undefined;
async function loadMaterials() {
const res = await onboardingTaskApi.listMaterialTypes();
materialTypes.value = res.data || [];
if (!materialRequest) {
materialRequest = onboardingTaskApi.listMaterialTypes().then(({ data }) => {
materialTypes.value = data || [];
return materialTypes.value;
}).finally(() => { materialRequest = undefined; });
}
return materialRequest;
}
function openMaterialCreate() {
@@ -152,14 +180,18 @@ async function saveMaterial() {
}
async function removeMaterial(row: OnboardingMaterialType) {
await ElMessageBox.confirm(`确认删除资料类型“${row.materialName}”吗?`, "删除确认", { type: "warning" });
const confirmed = await isMessageBoxConfirmed(
ElMessageBox.confirm(`确认删除资料类型“${row.materialName}”吗?`, "删除确认", { type: "warning" })
);
if (!confirmed) return;
await onboardingTaskApi.deleteMaterialTypes([row.id!]);
ElMessage.success("删除成功");
await loadMaterials();
}
onMounted(() => {
loadMaterials();
watch(activeTab, tab => {
if (tab === "materials") void loadMaterials();
});
</script>
@@ -220,4 +252,14 @@ onMounted(() => {
.toolbar {
margin-bottom: 12px;
}
.material-form :deep(.el-form-item__label) {
white-space: nowrap;
}
.unit-suffix {
margin-left: 10px;
color: var(--el-text-color-secondary);
font-size: 13px;
}
</style>
+370 -93
View File
@@ -1,8 +1,8 @@
<template>
<template>
<div class="main-box setup-container">
<el-tabs v-model="activeTab" class="setup-tabs">
<!-- 1. 入职公司管理 -->
<el-tab-pane label="入职公司" name="company">
<el-tab-pane lazy label="入职公司" name="company">
<div class="table-wrapper">
<ProTable
ref="companyTable"
@@ -12,7 +12,7 @@
:search-col="5"
>
<template #tableHeader>
<el-button type="primary" icon="Plus" @click="openCompanyCreate">
<el-button v-auth="'onboardingSetupAdd'" type="primary" icon="Plus" @click="openCompanyCreate">
新增入职公司
</el-button>
</template>
@@ -23,12 +23,37 @@
</el-tag>
</template>
<template #qiyuesuoConfig="scope">
<el-tag
size="small"
:type="scope.row.qiyuesuoCategoryId && scope.row.qiyuesuoSealId ? 'success' : 'warning'"
>
{{ scope.row.qiyuesuoCategoryId && scope.row.qiyuesuoSealId ? "已配置" : "未配置" }}
</el-tag>
</template>
<template #operation="scope">
<el-button link type="primary" icon="Edit" @click="openCompanyEdit(scope.row)">
<el-button
v-auth="'onboardingSetupEdit'"
link
type="primary"
icon="Edit"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="openCompanyEdit(scope.row)"
>
编辑
</el-button>
<el-button link type="danger" icon="Delete" @click="removeCompany(scope.row)">
<el-button
v-auth="'onboardingSetupDelete'"
link
type="danger"
icon="Delete"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="removeCompany(scope.row)"
>
删除
</el-button>
</template>
@@ -37,7 +62,7 @@
</el-tab-pane>
<!-- 2. 入职部门管理 -->
<el-tab-pane label="入职部门" name="department">
<el-tab-pane lazy label="入职部门" name="department">
<div class="table-wrapper">
<ProTable
ref="departmentTable"
@@ -47,62 +72,22 @@
:search-col="5"
>
<template #tableHeader>
<el-button type="primary" icon="Plus" @click="openDepartmentCreate">
<el-button v-auth="'onboardingSetupAdd'" type="primary" icon="Plus" @click="openDepartmentCreate">
新增入职部门
</el-button>
</template>
<template #companyId="scope">
<el-tag effect="plain" type="primary">
{{ scope.row.companyName || getCompanyName(scope.row.companyId) }}
</el-tag>
</template>
<template #status="scope">
<el-tag size="small" :type="scope.row.status === 'enable' ? 'success' : 'info'">
{{ scope.row.status === "enable" ? "启用" : "停用" }}
</el-tag>
</template>
<template #operation="scope">
<el-button link type="primary" icon="Edit" @click="openDepartmentEdit(scope.row)">
编辑
</el-button>
<el-button link type="danger" icon="Delete" @click="removeDepartment(scope.row)">
删除
</el-button>
</template>
</ProTable>
</div>
</el-tab-pane>
<!-- 3. 入职岗位管理 -->
<el-tab-pane label="入职岗位" name="position">
<div class="table-wrapper">
<ProTable
ref="positionTable"
title="入职岗位列表"
:columns="positionColumns"
:request-api="onboardingTaskApi.positionPage"
:search-col="5"
<el-tooltip
v-if="scope.row.companyName || getCompanyName(scope.row.companyId)"
:content="scope.row.companyName || getCompanyName(scope.row.companyId)"
placement="top"
:show-after="300"
>
<template #tableHeader>
<el-button type="primary" icon="Plus" @click="openPositionCreate">
新增入职岗位
</el-button>
</template>
<template #companyId="scope">
<el-tag effect="plain" type="primary">
<el-tag effect="plain" type="primary" class="truncate-tag">
{{ scope.row.companyName || getCompanyName(scope.row.companyId) }}
</el-tag>
</template>
<template #departmentName="scope">
<el-tag v-if="scope.row.departmentName" effect="light" type="warning">
{{ scope.row.departmentName }}
</el-tag>
</el-tooltip>
<span v-else class="text-gray-400">-</span>
</template>
@@ -113,11 +98,106 @@
</template>
<template #operation="scope">
<el-button link type="primary" icon="Edit" @click="openPositionEdit(scope.row)">
<el-button
v-auth="'onboardingSetupEdit'"
link
type="primary"
icon="Edit"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="openDepartmentEdit(scope.row)"
>
编辑
</el-button>
<el-button link type="danger" icon="Delete" @click="removePosition(scope.row)">
<el-button
v-auth="'onboardingSetupDelete'"
link
type="danger"
icon="Delete"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="removeDepartment(scope.row)"
>
删除
</el-button>
</template>
</ProTable>
</div>
</el-tab-pane>
<!-- 3. 入职岗位管理 -->
<el-tab-pane lazy label="入职岗位" name="position">
<div class="table-wrapper">
<ProTable
ref="positionTable"
title="入职岗位列表"
:columns="positionColumns"
:request-api="onboardingTaskApi.positionPage"
:search-col="5"
>
<template #tableHeader>
<el-button v-auth="'onboardingSetupAdd'" type="primary" icon="Plus" @click="openPositionCreate">
新增入职岗位
</el-button>
</template>
<template #companyId="scope">
<el-tooltip
v-if="scope.row.companyName || getCompanyName(scope.row.companyId)"
:content="scope.row.companyName || getCompanyName(scope.row.companyId)"
placement="top"
:show-after="300"
>
<el-tag effect="plain" type="primary" class="truncate-tag">
{{ scope.row.companyName || getCompanyName(scope.row.companyId) }}
</el-tag>
</el-tooltip>
<span v-else class="text-gray-400">-</span>
</template>
<template #departmentName="scope">
<el-tooltip
v-if="scope.row.departmentName"
:content="scope.row.departmentName"
placement="top"
:show-after="300"
>
<el-tag effect="light" type="warning" class="truncate-tag">
{{ scope.row.departmentName }}
</el-tag>
</el-tooltip>
<span v-else class="text-gray-400">-</span>
</template>
<template #status="scope">
<el-tag size="small" :type="scope.row.status === 'enable' ? 'success' : 'info'">
{{ scope.row.status === "enable" ? "启用" : "停用" }}
</el-tag>
</template>
<template #operation="scope">
<el-button
v-auth="'onboardingSetupEdit'"
link
type="primary"
icon="Edit"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="openPositionEdit(scope.row)"
>
编辑
</el-button>
<el-button
v-auth="'onboardingSetupDelete'"
link
type="danger"
icon="Delete"
:disabled="!canManage(scope.row)"
:title="disabledReason(scope.row)"
@click="removePosition(scope.row)"
>
删除
</el-button>
</template>
@@ -130,50 +210,65 @@
<el-dialog
v-model="dialogVisible"
:title="dialogTitle"
width="680px"
width="820px"
top="6vh"
destroy-on-close
append-to-body
>
<!-- 1. 公司表单 -->
<el-form v-if="dialogKind === 'company'" :model="companyForm" label-width="140px">
<el-form
v-if="dialogKind === 'company'"
ref="companyFormRef"
:model="companyForm"
:rules="companyRules"
label-width="140px"
class="setup-form"
>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="公司编码" required>
<el-input v-model="companyForm.companyCode" placeholder="如:TECH_CORP" />
<el-form-item label="公司编码" prop="companyCode">
<el-input v-model.trim="companyForm.companyCode" placeholder="如:TECH_CORP" maxlength="50" show-word-limit clearable />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="公司简称/名称" required>
<el-input v-model="companyForm.companyName" placeholder="如:总公司 / 科技分部" />
<el-form-item label="公司简称/名称" prop="companyName">
<el-input v-model.trim="companyForm.companyName" placeholder="如:总公司 / 科技分部" maxlength="50" show-word-limit clearable />
</el-form-item>
</el-col>
</el-row>
<el-form-item label="签署材料甲方全称" required>
<el-input v-model="companyForm.legalName" placeholder="用于签署材料填写的法定主体全称" />
<el-form-item label="签署材料甲方全称" prop="legalName">
<el-input v-model.trim="companyForm.legalName" placeholder="必须与契约锁中的企业名称完全一致" maxlength="100" show-word-limit clearable />
</el-form-item>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="统一社会信用代码">
<el-input v-model="companyForm.unifiedSocialCreditCode" placeholder="18位统一信用代码" />
<el-form-item label="统一社会信用代码" prop="unifiedSocialCreditCode">
<el-input
v-model.trim="companyForm.unifiedSocialCreditCode"
placeholder="18位统一社会信用代码"
maxlength="18"
show-word-limit
clearable
@input="val => companyForm.unifiedSocialCreditCode = (val || '').replace(/[^0-9A-Za-z]/g, '').toUpperCase()"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="法定代表人">
<el-input v-model="companyForm.legalRepresentative" placeholder="法定代表人姓名" />
<el-form-item label="法定代表人" prop="legalRepresentative">
<el-input v-model.trim="companyForm.legalRepresentative" placeholder="法定代表人姓名" maxlength="20" show-word-limit clearable />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="联系电话">
<el-input v-model="companyForm.contactPhone" placeholder="企业联系电话" />
<el-form-item label="联系电话" prop="contactPhone">
<el-input v-model.trim="companyForm.contactPhone" placeholder="企业联系电话(选填,手机或固话)" maxlength="20" show-word-limit clearable />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="状态" required>
<el-form-item label="状态" prop="status">
<el-select v-model="companyForm.status" class="w-full">
<el-option label="启用" value="enable" />
<el-option label="停用" value="disable" />
@@ -182,13 +277,48 @@
</el-col>
</el-row>
<el-form-item label="注册地址">
<el-input v-model="companyForm.registeredAddress" placeholder="企业法定注册地址" />
<el-form-item label="注册地址" prop="registeredAddress">
<el-input v-model.trim="companyForm.registeredAddress" placeholder="企业法定注册地址" maxlength="150" show-word-limit clearable />
</el-form-item>
<el-form-item label="备注">
<el-input v-model="companyForm.remark" type="textarea" :rows="2" placeholder="备注信息" />
<el-form-item label="备注" prop="remark">
<el-input v-model="companyForm.remark" type="textarea" :rows="3" placeholder="备注信息(选填)" maxlength="300" show-word-limit />
</el-form-item>
<el-divider content-position="left">契约锁电子签配置(由技术人员添加)</el-divider>
<el-alert
title="说明:默认业务分类 Id 与企业印章 Id 由技术人员添加配置,非技术人员请勿随意修改。"
type="info"
:closable="false"
show-icon
style="margin-bottom: 18px"
/>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="默认业务分类 Id" prop="qiyuesuoCategoryId">
<el-input
v-model.trim="companyForm.qiyuesuoCategoryId"
placeholder="契约锁当前公司的分类 Id"
maxlength="19"
show-word-limit
clearable
@input="val => companyForm.qiyuesuoCategoryId = (val || '').replace(/\D/g, '')"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="企业印章 Id" prop="qiyuesuoSealId">
<el-input
v-model.trim="companyForm.qiyuesuoSealId"
placeholder="契约锁当前公司的印章 Id"
maxlength="19"
show-word-limit
clearable
@input="val => companyForm.qiyuesuoSealId = (val || '').replace(/\D/g, '')"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<!-- 2. 部门表单 -->
@@ -207,12 +337,12 @@
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="部门编码" required>
<el-input v-model="departmentForm.departmentCode" placeholder="如:DEPT_TECH" />
<el-input v-model.trim="departmentForm.departmentCode" placeholder="如:DEPT_TECH" maxlength="50" show-word-limit clearable />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="部门名称" required>
<el-input v-model="departmentForm.departmentName" placeholder="如:技术研发部" />
<el-input v-model.trim="departmentForm.departmentName" placeholder="如:技术研发部" maxlength="50" show-word-limit clearable />
</el-form-item>
</el-col>
</el-row>
@@ -234,7 +364,7 @@
</el-row>
<el-form-item label="备注">
<el-input v-model="departmentForm.remark" type="textarea" :rows="2" placeholder="备注信息" />
<el-input v-model="departmentForm.remark" type="textarea" :rows="2" placeholder="备注信息" maxlength="200" show-word-limit />
</el-form-item>
</el-form>
@@ -278,12 +408,12 @@
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="岗位编码" required>
<el-input v-model="positionForm.positionCode" placeholder="如:DEV_FRONTEND" />
<el-input v-model.trim="positionForm.positionCode" placeholder="如:DEV_FRONTEND" maxlength="50" show-word-limit clearable />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="岗位名称" required>
<el-input v-model="positionForm.positionName" placeholder="如:高级前端开发工程师" />
<el-input v-model.trim="positionForm.positionName" placeholder="如:高级前端开发工程师" maxlength="50" show-word-limit clearable />
</el-form-item>
</el-col>
</el-row>
@@ -309,7 +439,7 @@
</el-form-item>
<el-form-item label="备注">
<el-input v-model="positionForm.remark" type="textarea" :rows="2" placeholder="备注信息" />
<el-input v-model="positionForm.remark" type="textarea" :rows="2" placeholder="备注信息" maxlength="200" show-word-limit />
</el-form-item>
</el-form>
@@ -322,8 +452,8 @@
</template>
<script setup lang="ts" name="onboardingSetup">
import { ref, reactive, computed, onMounted } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { ref, reactive, computed, watch, nextTick } from "vue";
import { ElMessage, ElMessageBox, type FormInstance, type FormRules } from "element-plus";
import { Plus, Edit, Delete } from "@element-plus/icons-vue";
import {
onboardingTaskApi,
@@ -334,6 +464,10 @@ import {
type OnboardingPosition
} from "@/api/modules/biz/onboarding";
import type { ColumnProps, ProTableInstance, EnumProps } from "@/components/ProTable/interface";
import { isMessageBoxConfirmed } from "@/utils/messageBox";
import { useOnboardingPermission } from "@/utils/onboardingPermission";
const { canManage, disabledReason } = useOnboardingPermission("onboardingSetupManageAll");
const activeTab = ref("company");
@@ -369,6 +503,8 @@ const emptyCompany = (): Partial<OnboardingCompany> => ({
legalRepresentative: "",
registeredAddress: "",
contactPhone: "",
qiyuesuoCategoryId: "",
qiyuesuoSealId: "",
status: "enable",
remark: ""
});
@@ -393,7 +529,76 @@ const emptyPosition = (): Partial<OnboardingPosition> => ({
remark: ""
});
const companyFormRef = ref<FormInstance>();
const companyForm = reactive<Partial<OnboardingCompany>>(emptyCompany());
const companyRules = reactive<FormRules>({
companyCode: [
{ required: true, message: "请输入公司编码", trigger: "blur" },
{
pattern: /^[a-zA-Z0-9_-]{2,50}$/,
message: "支持2-50位字母、数字、下划线或短横线",
trigger: "blur"
}
],
companyName: [
{ required: true, message: "请输入公司简称/名称", trigger: "blur" },
{ min: 2, max: 50, message: "公司名称长度需在 2 到 50 个字符之间", trigger: "blur" }
],
legalName: [
{ required: true, message: "请输入签署材料甲方全称", trigger: "blur" },
{ min: 2, max: 100, message: "甲方全称长度需在 2 到 100 个字符之间", trigger: "blur" }
],
unifiedSocialCreditCode: [
{ required: true, message: "请输入统一社会信用代码", trigger: "blur" },
{
pattern: /^[0-9A-Za-z]{18}$/,
message: "请输入18位统一社会信用代码",
trigger: "blur"
}
],
legalRepresentative: [
{ required: true, message: "请输入法定代表人姓名", trigger: "blur" },
{
pattern: /^[\u4e00-\u9fa5a-zA-Z·.\s]{2,20}$/,
message: "请输入2-20位中英文姓名",
trigger: "blur"
}
],
contactPhone: [
{
pattern: /^(1[3-9]\d{9}|(0\d{2,3}-?)?\d{7,8}|400(-?\d{3,4}){2})$/,
message: "请输入有效的手机号或固话号码",
trigger: "blur"
}
],
status: [
{ required: true, message: "请选择公司启用状态", trigger: "change" }
],
registeredAddress: [
{ required: true, message: "请输入企业法定注册地址", trigger: "blur" },
{ min: 4, max: 150, message: "注册地址需在 4 到 150 个字符之间", trigger: "blur" }
],
remark: [
{ max: 300, message: "备注不能超过 300 个字符", trigger: "blur" }
],
qiyuesuoCategoryId: [
{
pattern: /^\d*$/,
message: "业务分类 Id 必须为纯数字",
trigger: "blur"
},
{ max: 19, message: "业务分类 Id 不能超过 19 位数字", trigger: "blur" }
],
qiyuesuoSealId: [
{
pattern: /^\d*$/,
message: "企业印章 Id 必须为纯数字",
trigger: "blur"
},
{ max: 19, message: "企业印章 Id 不能超过 19 位数字", trigger: "blur" }
]
});
const departmentForm = reactive<Partial<OnboardingDepartment>>(emptyDepartment());
const positionForm = reactive<Partial<OnboardingPosition>>(emptyPosition());
@@ -437,6 +642,12 @@ const companyColumns: ColumnProps<OnboardingCompany>[] = [
label: "联系电话",
width: 140
},
{
prop: "qiyuesuoConfig",
label: "契约锁配置",
width: 120,
align: "center"
},
{
prop: "status",
label: "状态",
@@ -477,7 +688,8 @@ const departmentColumns: ColumnProps<OnboardingDepartment>[] = [
prop: "departmentName",
label: "部门名称",
minWidth: 180,
search: { el: "input" }
search: { el: "input" },
showOverflowTooltip: true
},
{
prop: "sortCode",
@@ -524,13 +736,15 @@ const positionColumns: ColumnProps<OnboardingPosition>[] = [
prop: "positionCode",
label: "岗位编码",
width: 150,
search: { el: "input" }
search: { el: "input" },
showOverflowTooltip: true
},
{
prop: "positionName",
label: "岗位名称",
minWidth: 180,
search: { el: "input" }
search: { el: "input" },
showOverflowTooltip: true
},
{
prop: "defaultContractYears",
@@ -565,9 +779,14 @@ const positionColumns: ColumnProps<OnboardingPosition>[] = [
}
];
let companyRequest: Promise<void> | undefined;
async function loadCompanies() {
const { data } = await onboardingTaskApi.listCompanies();
if (!companyRequest) {
companyRequest = onboardingTaskApi.listCompanies().then(({ data }) => {
companies.value = data || [];
}).finally(() => { companyRequest = undefined; });
}
await companyRequest;
}
async function loadDepartmentsForCompany(companyId?: number) {
@@ -601,6 +820,9 @@ function openCompanyCreate() {
editing.value = false;
resetCompany();
dialogVisible.value = true;
nextTick(() => {
companyFormRef.value?.clearValidate();
});
}
function openDepartmentCreate() {
@@ -624,6 +846,9 @@ async function openCompanyEdit(row: OnboardingCompany) {
editing.value = true;
Object.assign(companyForm, data);
dialogVisible.value = true;
nextTick(() => {
companyFormRef.value?.clearValidate();
});
}
async function openDepartmentEdit(row: OnboardingDepartment) {
@@ -647,8 +872,24 @@ async function openPositionEdit(row: OnboardingPosition) {
async function save() {
if (dialogKind.value === "company") {
if (!companyForm.companyCode || !companyForm.companyName || !companyForm.legalName) {
return ElMessage.warning("请填写公司编码、公司名称和签署材料甲方全称");
const valid = await companyFormRef.value?.validate().catch(() => false);
if (!valid) return;
const categoryId = companyForm.qiyuesuoCategoryId?.trim() || "";
const sealId = companyForm.qiyuesuoSealId?.trim() || "";
if (Boolean(categoryId) !== Boolean(sealId)) {
return ElMessage.warning("契约锁默认业务分类 Id 和企业印章 Id 必须同时填写(或均不填)");
}
if (categoryId && (!/^\d+$/.test(categoryId) || !/^\d+$/.test(sealId))) {
return ElMessage.warning("契约锁默认业务分类 Id 和企业印章 Id 只能填写纯数字");
}
if (categoryId && (categoryId.length > 19 || sealId.length > 19)) {
return ElMessage.warning("契约锁默认业务分类 Id 和企业印章 Id 不能超过 19 位数字");
}
companyForm.qiyuesuoCategoryId = categoryId;
companyForm.qiyuesuoSealId = sealId;
if (companyForm.unifiedSocialCreditCode) {
companyForm.unifiedSocialCreditCode = companyForm.unifiedSocialCreditCode.trim().toUpperCase();
}
await onboardingTaskApi.saveCompany(companyForm, editing.value);
companyTable.value?.refresh();
@@ -672,25 +913,39 @@ async function save() {
}
async function removeCompany(row: OnboardingCompany) {
await ElMessageBox.confirm(`确认删除公司“${row.companyName}”?`, "删除确认", { type: "warning" });
const confirmed = await isMessageBoxConfirmed(
ElMessageBox.confirm(`确认删除公司“${row.companyName}”?`, "删除确认", { type: "warning" })
);
if (!confirmed) return;
await onboardingTaskApi.deleteCompany([row.id]);
companyTable.value?.refresh();
await loadCompanies();
}
async function removeDepartment(row: OnboardingDepartment) {
await ElMessageBox.confirm(`确认删除部门“${row.departmentName}”?`, "删除确认", { type: "warning" });
const confirmed = await isMessageBoxConfirmed(
ElMessageBox.confirm(`确认删除部门“${row.departmentName}”?`, "删除确认", { type: "warning" })
);
if (!confirmed) return;
await onboardingTaskApi.deleteDepartment([row.id]);
departmentTable.value?.refresh();
}
async function removePosition(row: OnboardingPosition) {
await ElMessageBox.confirm(`确认删除岗位“${row.positionName}”?`, "删除确认", { type: "warning" });
const confirmed = await isMessageBoxConfirmed(
ElMessageBox.confirm(`确认删除岗位“${row.positionName}”?`, "删除确认", { type: "warning" })
);
if (!confirmed) return;
await onboardingTaskApi.deletePosition([row.id]);
positionTable.value?.refresh();
}
onMounted(loadCompanies);
watch(activeTab, tab => {
if (tab !== "company" && !companies.value.length) void loadCompanies();
});
</script>
<style scoped>
@@ -762,4 +1017,26 @@ onMounted(loadCompanies);
.w-full {
width: 100%;
}
.setup-form :deep(.el-form-item) {
margin-bottom: 22px;
}
.setup-form :deep(.el-form-item__error) {
padding-top: 3px;
line-height: 1.25;
}
.truncate-tag {
max-width: 140px;
display: inline-flex;
align-items: center;
vertical-align: middle;
}
.truncate-tag :deep(.el-tag__content) {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>
File diff suppressed because it is too large Load Diff
@@ -2,7 +2,8 @@
<template>
<el-form ref="loginFormRef" :model="loginForm" :rules="loginRules" size="large">
<s-form-item v-if="tenantOption == TenantEnum.CHOSE" prop="orgId" class="-ml-12px">
<s-select v-model="loginForm.tenantId" :options="tenantOptions" label="name" value="id" placeholder="请选择租户"></s-select>
<s-select v-model="loginForm.tenantId" :options="tenantOptions" label="name" value="id"
placeholder="请选择租户"></s-select>
</s-form-item>
<el-form-item prop="account">
<el-input v-model="loginForm.account" placeholder="请输入用户名">
@@ -14,7 +15,8 @@
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input v-model="loginForm.password" type="password" placeholder="请输入密码" show-password autocomplete="new-password">
<el-input v-model="loginForm.password" type="password" placeholder="请输入密码" show-password
autocomplete="new-password">
<template #prefix>
<el-icon class="el-input__icon">
<lock />
@@ -38,7 +40,8 @@
</el-form>
<div class="login-btn">
<el-button :icon="CircleClose" round size="large" @click="resetForm(loginFormRef)"> 重置 </el-button>
<el-button :icon="UserFilled" round size="large" type="primary" :loading="auth.loginLoading" @click="handleSubmit(loginFormRef)">
<el-button :icon="UserFilled" round size="large" type="primary" :loading="auth.loginLoading"
@click="handleSubmit(loginFormRef)">
登录
</el-button>
</div>
@@ -90,8 +93,8 @@ watch(
const loginFormRef = ref<FormInstance>(); // 表单实例
// 表单数据
const loginForm = reactive<Login.LoginForm>({
account: "superAdmin", //用户名
password: "123456", // 密码
account: "", //用户名
password: "", // 密码
validCode: "", // 验证码
validCodeReqNo: "", // 验证码请求号
tenantId: config.tenantIdGet
+1 -1
View File
@@ -62,7 +62,7 @@ interface LoginProps {
//默认值
const props = reactive<LoginProps>({
sysName: "员工文件管理系统",
sysName: "员工管理系统",
sysVersion: "",
sysLogo: "",
sysTenantOption: TenantEnum.CLOSE,
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,68 @@
<template>
<main class="public-status-page">
<section class="status-card">
<div class="status-mark">!</div>
<h1>{{ title }}</h1>
<p>{{ description }}</p>
</section>
</main>
</template>
<script setup lang="ts">
withDefaults(defineProps<{
title?: string;
description?: string;
}>(), {
title: "入职链接无效",
description: "请联系招聘人员重新获取入职链接。"
});
</script>
<style scoped>
.public-status-page {
display: flex;
min-height: 100vh;
padding: 24px;
align-items: center;
justify-content: center;
box-sizing: border-box;
background: #f0fdf7;
}
.status-card {
width: min(100%, 420px);
padding: 42px 28px;
text-align: center;
background: #ffffff;
border: 1px solid #d1fae5;
border-radius: 16px;
box-shadow: 0 12px 36px rgb(5 150 105 / 10%);
}
.status-mark {
display: flex;
width: 56px;
height: 56px;
margin: 0 auto 20px;
align-items: center;
justify-content: center;
color: #ffffff;
font-size: 30px;
font-weight: 700;
background: #059669;
border-radius: 50%;
}
h1 {
margin: 0;
color: #064e3b;
font-size: 24px;
}
p {
margin: 14px 0 0;
color: #64748b;
font-size: 15px;
line-height: 1.8;
}
</style>
@@ -68,6 +68,11 @@ function onOpen(props: FormProps.Base<Button.ButtonInfo>) {
if (props.record.id) {
//如果传了id,就去请求api获取record
buttonApi.detail({ id: props.record.id }).then(res => {
if (!res.data) {
ElMessage.error("按钮详情不存在或按钮ID无效,请刷新列表后重试");
onClose();
return;
}
buttonProps.record = res.data;
});
}
+278
View File
@@ -0,0 +1,278 @@
// Offline checks: execute the real composable and page setup code with stubbed APIs.
import assert from "node:assert/strict";
import { readFileSync } from "node:fs";
import { createRequire } from "node:module";
import vm from "node:vm";
import test from "node:test";
import { compileScript, parse } from "@vue/compiler-sfc";
import ts from "typescript";
import * as vue from "vue";
const require = createRequire(import.meta.url);
const root = new URL("../", import.meta.url);
const read = path => readFileSync(new URL(path, root), "utf8");
const deferred = () => {
let resolve, reject;
const promise = new Promise((yes, no) => { resolve = yes; reject = no; });
return { promise, resolve, reject };
};
function harness(overrides = {}) {
const calls = [];
const api = new Proxy(overrides, {
get(target, method) {
return (...args) => {
calls.push({ method, args });
if (method in target) return target[method](...args);
if (method === "listCompanies") return Promise.resolve({ data: [{ id: 1, companyName: "A" }, { id: 2, companyName: "B" }] });
if (method === "listDepartments") return Promise.resolve({ data: [{ id: args[0] * 10, departmentName: "部门" }] });
if (method === "listPositionsByDepartment") return Promise.resolve({ data: [{ id: args[0] * 10, positionName: "岗位" }] });
if (method === "listMaterialTypes") return Promise.resolve({ data: [{ id: 1, status: "enable" }] });
if (method === "onboardingTemplatePage") return Promise.resolve({ data: { list: [], total: 0 } });
throw new Error("Unexpected API: " + method);
};
}
});
function evaluate(source, imports = {}) {
const output = ts.transpileModule(source.replaceAll("import.meta.env", "({})"), {
compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2022, esModuleInterop: true }
}).outputText;
const module = { exports: {} };
vm.runInNewContext(output, {
module, exports: module.exports, console,
require(name) {
if (name in imports) return imports[name];
if (name === "vue") return vue;
if (name === "@/api/modules/biz/onboarding") return { onboardingTaskApi: api };
if (name === "@/hooks/useOnboardingScopeOptions") return scopeModule;
if (name === "@/utils/onboardingPermission") return {
useOnboardingPermission: () => ({ canManage: () => true, disabledReason: () => "", hasAction: () => true })
};
if (name === "@/utils/messageBox" || name === "@/utils") return {};
if (name === "element-plus") return { ElMessage: { success() {}, warning() {}, error() {} }, ElMessageBox: {} };
if (name === "@element-plus/icons-vue" || name.endsWith(".vue")) return {};
return require(name);
}
});
return module.exports;
}
const scopeModule = evaluate(read("src/hooks/useOnboardingScopeOptions.ts"));
function page(path, props = {}) {
const mounted = [];
const descriptor = parse(read(path), { filename: path }).descriptor;
const code = compileScript(descriptor, { id: path }).content;
const component = evaluate(code, { vue: { ...vue, onMounted: callback => mounted.push(callback), onBeforeUnmount() {} } }).default;
const effects = vue.effectScope();
const state = effects.run(() => component.setup(props, { expose() {} }));
return { state, mount: () => Promise.all(mounted.map(callback => callback())), stop: () => effects.stop() };
}
return { api, calls, scopeModule, page };
}
test("dependent options load only after selecting their parent, and reset makes no request", async () => {
const h = harness();
const selection = vue.reactive({});
const options = h.scopeModule.useOnboardingScopeOptions(() => selection);
assert.equal(h.calls.length, 0);
await options.onDepartmentChange(10);
assert.equal(h.calls.length, 0);
selection.companyId = 1;
await options.onCompanyChange(1);
assert.equal(h.calls.length, 1);
assert.equal(h.calls[0].method, "listDepartments");
assert.equal(options.positions.value.length, 0);
selection.departmentId = 10;
await options.onDepartmentChange(10);
assert.equal(h.calls[1].method, "listPositionsByDepartment");
selection.positionId = 100;
selection.companyId = undefined;
options.reset();
assert.equal(selection.departmentId, undefined);
assert.equal(selection.positionId, undefined);
assert.equal(options.departments.value.length, 0);
assert.equal(options.positions.value.length, 0);
assert.equal(h.calls.length, 2);
});
test("slow department responses cannot restore a previous company or survive reset", async () => {
const a = deferred(), b = deferred(), c = deferred();
const h = harness({ listDepartments: id => ({ 1: a, 2: b, 3: c })[id].promise });
const selection = { companyId: 1 };
const options = h.scopeModule.useOnboardingScopeOptions(() => selection);
const first = options.onCompanyChange(1);
selection.companyId = 2;
const second = options.onCompanyChange(2);
b.resolve({ data: [{ id: 20 }] });
await second;
a.resolve({ data: [{ id: 10 }] });
await first;
assert.equal(options.departments.value[0].id, 20);
selection.companyId = 3;
const third = options.onCompanyChange(3);
options.reset();
c.resolve({ data: [{ id: 30 }] });
await third;
assert.equal(options.departments.value.length, 0);
});
test("slow position responses cannot overwrite a new department; failure leaves options empty", async () => {
const a = deferred(), b = deferred();
const h = harness({ listPositionsByDepartment: id => (id === 10 ? a : b).promise });
const selection = { companyId: 1, departmentId: 10 };
const options = h.scopeModule.useOnboardingScopeOptions(() => selection);
const first = options.onDepartmentChange(10);
selection.departmentId = 20;
const second = options.onDepartmentChange(20);
b.resolve({ data: [{ id: 200 }] });
await second;
a.resolve({ data: [{ id: 100 }] });
await first;
assert.equal(options.positions.value[0].id, 200);
const failed = harness({ listDepartments: () => Promise.reject(new Error("offline")) });
const empty = failed.scopeModule.useOnboardingScopeOptions(() => ({ companyId: 1 }));
await empty.onCompanyChange(1);
assert.equal(empty.departments.value.length, 0);
});
for (const [name, tableName, columnName] of [
["contract", "templateTable", "templateColumns"],
["task", "proTable", "columns"],
["employee", "proTable", "columns"]
]) {
test(name + ": initialization, filter cascade and reset use only necessary requests", async () => {
const h = harness();
const page = h.page("src/views/biz/onboarding/" + name + "/index.vue");
const state = page.state;
state[tableName].value = { searchParam: {}, enumMap: new Map() };
await page.mount();
assert.equal(h.calls.length, 1);
assert.equal(h.calls[0].method, "listCompanies");
const department = state[columnName].find(item => item.prop === "departmentId");
const position = state[columnName].find(item => item.prop === "positionId");
assert.equal(department.search.props.disabled, true);
assert.equal(position.search.props.disabled, true);
state[tableName].value.searchParam.companyId = 1;
await state.onSearchCompanyChange(1);
assert.equal(department.search.props.disabled, false);
assert.equal(position.search.props.disabled, true);
assert.equal(state[tableName].value.enumMap.get("departmentId")[0].value, 10);
state[tableName].value.searchParam.departmentId = 10;
await state.onSearchDepartmentChange(10);
assert.equal(position.search.props.disabled, false);
assert.equal(state[tableName].value.enumMap.get("positionId")[0].value, 100);
state[tableName].value.searchParam = {};
state.resetSearchScope();
assert.equal(h.calls.length, 3);
assert.equal(state[tableName].value.enumMap.get("departmentId").length, 0);
assert.equal(state[tableName].value.enumMap.get("positionId").length, 0);
page.stop();
});
}
test("entry config loads no hidden data; material loads share one in-flight request", async () => {
const pending = deferred();
const h = harness({ listMaterialTypes: () => pending.promise });
const page = h.page("src/views/biz/onboarding/entry-config/index.vue");
await page.mount();
assert.equal(h.calls.length, 0);
page.state.activeTab.value = "materials";
await vue.nextTick();
const shared = page.state.loadMaterials();
assert.equal(h.calls.length, 1);
pending.resolve({ data: [{ id: 5 }] });
await shared;
assert.equal(page.state.materialTypes.value[0].id, 5);
page.stop();
});
test("task form fetches only the selected template's materials and preserves names and HR fields", async () => {
const h = harness({
onboardingTemplateDetail: () => Promise.resolve({ data: {
contracts: [{ contractTemplateId: 11, contractTemplateVersionId: 12, required: true }]
} }),
templateDetail: () => Promise.resolve({ data: {
id: 11, companyId: 1, departmentId: 10, status: "enable", templateName: "劳动合同"
} }),
variablePage: () => Promise.resolve({ data: { list: [{
variableCode: "hr.Salary", variableName: "薪资", variableType: "contract",
hrEditable: true, defaultValue: "5000", dataType: "number", required: true
}] } })
});
const page = h.page("src/views/biz/onboarding/task/index.vue");
await page.mount();
page.state.form.companyId = 1;
page.state.form.departmentId = 10;
await page.state.onOnboardingTemplateChange(7);
assert.equal(h.calls.length, 4);
assert.equal(h.calls[1].method, "onboardingTemplateDetail");
assert.equal(h.calls[2].method, "templateDetail");
assert.equal(h.calls[2].args[0].id, 11);
assert.equal(h.calls[3].method, "variablePage");
assert.equal(page.state.contractPreviews.value[0].contractName, "劳动合同");
assert.equal(page.state.form.contractVariables[0].variableValue, "5000");
assert.equal(page.state.form.contractVariables[0].contractName, "劳动合同");
assert.equal(page.state.contractConfigurationError.value, "");
page.stop();
});
test("entry template list loads just companies and its page; form data is deferred", async () => {
const h = harness();
let materials = 0;
const page = h.page("src/views/biz/onboarding/entry-config/components/OnboardingTemplatePanel.vue", {
loadMaterials: async () => { materials++; return [{ id: 7, status: "enable" }]; }
});
await page.mount();
assert.equal(h.calls.length, 2);
assert.equal(materials, 0);
page.state.query.companyId = 1;
await page.state.onQueryCompanyChange(1);
assert.equal(h.calls.length, 4);
assert.equal(h.calls[2].method, "listDepartments");
assert.equal(h.calls[3].method, "onboardingTemplatePage");
page.state.resetQuery();
await vue.nextTick();
assert.equal(h.calls.length, 5);
assert.equal(page.state.queryDepartments.value.length, 0);
await page.state.openCreate();
assert.equal(materials, 1);
assert.equal(page.state.materialTypes.value[0].id, 7);
assert.equal(h.calls.length, 5);
page.stop();
});
test("entry template list ignores older search responses", async () => {
const a = deferred(), b = deferred();
let count = 0;
const h = harness({ onboardingTemplatePage: () => (++count === 1 ? a : b).promise });
const page = h.page("src/views/biz/onboarding/entry-config/components/OnboardingTemplatePanel.vue", { loadMaterials: async () => [] });
const first = page.state.loadTemplates();
page.state.query.keyword = "new";
const second = page.state.loadTemplates();
b.resolve({ data: { list: [{ id: 2 }], total: 1 } });
await second;
a.resolve({ data: { list: [{ id: 1 }], total: 1 } });
await first;
assert.equal(page.state.rows.value[0].id, 2);
assert.equal(page.state.loading.value, false);
page.stop();
});
test("company setup defers options until needed and shares loading across fast tab changes", async () => {
const pending = deferred();
const h = harness({ listCompanies: () => pending.promise });
const page = h.page("src/views/biz/onboarding/setup/index.vue");
await page.mount();
assert.equal(h.calls.length, 0);
page.state.activeTab.value = "department";
await vue.nextTick();
page.state.activeTab.value = "position";
await vue.nextTick();
assert.equal(h.calls.length, 1);
pending.resolve({ data: [{ id: 1, companyName: "A" }] });
await page.state.loadCompanies();
page.state.activeTab.value = "department";
await vue.nextTick();
assert.equal(h.calls.length, 1);
page.stop();
});