企业官网建设流程全解析

源于工程机械现场——设备管理、工资绩效是核心，考勤是底座。覆盖工地、环卫、物业等多行业，托管/私有化可选，附在线 Demo。

写在前面

做 B 端行业软件的朋友大概都遇到过这种尴尬：

• 客户 A 要数据放自己机房，客户 B 想省心托管，结果维护了两套代码；

• 移动端、管理后台、运维后台三套系统，登录方式、权限、续费逻辑各写各的，联调排到下辈子；

• 功能堆了不少，现场工人还是不愿意用。

我们团队服务的对象是工地、环卫、物业、仓储、安装维修、市政等「人员分散、现场作业、考勤难核实、多项目并行」的行业。在单企业版本跑通业务后，我们把整套系统升级成了「晋辉机联云」——现场劳务与外勤智慧管理平台，一套代码，支持两种交付方式：

• 托管部署：系统部署在晋辉服务器，企业开通即用，免运维；

• 私有化部署：系统部署在客户自有服务器，数据完全自主可控。

这篇文章从技术选型、数据隔离实现、三端协同、工程化交付几个维度把架构讲清楚，也给正在做垂直行业管理系统的开发者一些可复用的思路。

在线体验（可直接访问）：

• 企业管理后台：https://jinhuitech.top/seahouseAdminMore/#/login

• API 文档入口：https://jinhuitech.top/seaHouseApiMore/

一、我们解决的不是「做个 App」，而是外勤现场的系统性问题

一线员工、班组长分散在工地、环卫片区、物业项目、仓库现场，过去常见做法是：

• Excel 记工时，月底对不上；

• 微信群发定位，无法留痕审计；

• 总部想看报表，各现场数据孤岛；

• 激励靠口头表扬，外勤人员参与度低。

晋辉机联云：现场劳务与外勤智慧管理平台——从工程机械场景演进，客户最看重的不是「能不能打卡」，而是设备管得住、工资绩效算得明；考勤是绩效核算的数据底座。

四大能力（按价值排序）：

行业覆盖：工地/工程机械、环卫、物业、仓储、安装维修、市政等。
交付：托管 / 私有化可选。

一句话：设备与绩效是核心，考勤是底座。

二、两种交付方式，一套代码

客户选购时只有两种模式，没有第三种：

同一套代码库，通过部署配置切换运行模式，不需要维护两个项目——这对交付团队和客户的长期成本都是利好。

三、技术架构一览：为什么是这套栈？

我们刻意选择了成熟、可私有化交付、团队好招人的技术组合，而不是追新。

3.1 总体分层

用户层 ├── 移动端 App（uni-app） → 一线外勤 / 班组长现场使用 ├── 企业管理后台（Vue3） → HR / 管理员 └── 运维管理后台（Vue3） → 托管服务的开通与运维（私有化客户无需使用） 接入层 └── Nginx 反向代理 /seaHouseApiMore/ 服务层 └── Spring Boot 2.6 + MyBatis + JWT 数据层 └── MySQL 8 + 阿里云 OSS（图片/附件，私有化可替换为本地存储）

3.2 技术栈明细

关键词标签（便于技术读者检索）：
Spring Boot·外勤管理·Vue3 管理后台·uni-app·现场劳务·私有化部署·智慧管理平台

四、数据隔离怎么做的？—— 这篇最值得收藏的部分

托管部署时，多家企业的数据运行在同一套基础设施上，必须在数据库层做好隔离，不能靠「菜单权限」糊弄。

4.1 两种运行模式（部署配置切换）

这意味着：托管客户享受免运维便利，私有化客户享受数据自主——同一套代码，两种交付，不需要 fork 两个仓库。

4.2 登录与租户识别

用户侧流程设计得很「工地友好」——记住一个企业码（租户码）即可：

1. 输入企业码（如test2）

2. 调用GET /Tenants/resolve?code=xxx获取企业 ID、品牌信息

3. 登录携带企业上下文，后续业务请求自动隔离

4. 不同企业的数据互不可见

角色权限边界清晰：

• 一线员工 / 班组长（系统内机手/队长）：roleId1 / 2，App 端操作

• 企业管理员：roleId99，企业管理后台

• 运维管理员：roleId100，仅用于托管服务的开通与续期管理

4.3 开发新功能时如何保持隔离？

业务表注册进TenantTableRegistry，拦截器统一改写 SQL。
新同事接入时的口诀：「新表登记、带 tenant_id、别手写绕过拦截器」。

托管模式下新增一家企业，只需开通账号、分配企业码，无需重新部署一套系统——这是托管交付能规模化、成本可控的技术基础。

五、三端产品设计：技术为业务服务

5.1 企业管理后台（Vue3）

面向 HR 和管理员，核心模块：

• 考勤全链路：打卡记录、OT/中直、汇总、工资条、异常申诉、年假规则（按企业可配置入职工龄—天数）

• 设备与保养：模板、台账、计划、审核

• 任务体系：特殊任务、技能提升、提交与审核

• 积分运营：规则配置、记录查询、抽奖活动（奖品池、概率校验、中奖记录）

• 品牌定制：登录后顶栏系统名、Logo、主题色可配（登录页保持平台统一形象，进入系统后展示企业品牌）

工程化细节：
utils/apiBase.js统一 API 与 Excel 导出地址；登录态兼容多种结构，减少联调踩坑。

5.2 移动端（uni-app）

现场场景优先——大按钮、GPS 打卡、拍照留痕、户外可读性。

首页九宫格覆盖：开工考勤、设备/巡检保养、特殊任务（未读角标）、技能提升、反馈建议、我的积分、薪资单、考勤记录等。

国际化：内置简繁英，大湾区及多片区项目同一 App 覆盖多语言环境，降低跨区域推广成本。

体验策略：登录前固定展示平台 Logo 与名称；登录后才展示企业品牌——界面更友好，也避免未授权信息外露。

5.3 托管服务的运维能力

选择托管部署的客户，由晋辉侧负责：

• 企业开通、管理员账号分配

• 服务续期（支持按月或按年）

• 开通记录全程审计

• 到期前 30 天移动端弹窗 + 后台黄条双提醒；到期后引导续费

私有化客户自行运维，不受上述续期策略约束，数据与进程完全自主。

六、六个真实落地场景（跨行业）

场景 1：工程机械 / 租赁 —— 设备 + 工资绩效

设备台账 + 保养计划 → 机手打卡绑定设备 → 考勤汇总 → 工资条。设备与绩效是核心，考勤是底座。

场景 2：环卫 / 市政 —— 片区巡检

GPS 打卡 + 设备/车辆台账 + 巡检计划 + 任务审核。多片区一张报表。

场景 3：物业 / 保洁 —— 多小区巡更

现场打卡 + 任务留痕 + 异常申诉。分散人员到岗可审计。

场景 4：安装维修 —— 工单验收

任务作工单、上门打卡、拍照审核。任务可追踪，投诉有据。

场景 5：仓储劳务 —— 班次工时

移动端打卡 + 汇总 + 工资条。绩效可量化，月底对账更快。

场景 6：私有化 —— 国企内网 + 统一 App

客户机房部署 API；晋辉超管登记独立部署地址；工人仍用统一 App。托管省心，私有化安心。

七、给开发者的部署速查（私有化客户可直接抄作业）

环境要求

JDK 1.8+ · MySQL 5.7/8.0 · Node 16+ · Maven 3.6+ · Nginx 1.18+

后端

mysql -u root -p sea_house_more < sea_house_more.sql cd move-apiMorePub mvn spring-boot:run # 本地 11070 mvn clean package -DskipTests java -jar target/xlhMoreApi.jar --spring.profiles.active=prod

管理后台

cd move-adminMorePub npm install && npm run build # dist/ 部署至 Nginx，.env.production 配置 VUE_APP_BASE_URL

Nginx 关键片段

location /seaHouseApiMore/ { rewrite ^/seaHouseApiMore/(.*) /$1 break; proxy_pass http://127.0.0.1:11070; proxy_set_header X-Forwarded-Prefix /seaHouseApiMore; }

项目结构：

xlhMoreApp/ ├── move-apiMorePub/ # Spring Boot API ├── move-adminMorePub/ # Vue3 管理后台 ├── moveAppMorePub/ # uni-app 移动端 ├── sea_house_more.sql └── nginx.conf

八、我们总结的几条交付经验

1. 数据隔离要从数据库层做起，而不是从菜单层做起
拦截器 + 表注册机制，比每个 Service 手写where tenant_id = ?可靠一个数量级。

2. 一套代码、两种交付方式
托管与私有化通过配置切换，比维护两个 Git 仓库省下的成本，半年就能体现出来。

3. 客户为「设备 + 绩效」付费，不是为打卡付费
台账、保养、工资条、积分——考勤提供可信工时，才是工程机械与外勤客户愿意买单的原因。

4. 工程化细节决定交付周期
统一 API 根地址、登录态结构兼容、图片 URL 多格式归一化——这些「小事」决定了你能不能days 级交付而不是 weeks。

5. 品牌策略要克制
登录前统一平台形象，登录后展示企业品牌——体验友好，也便于托管场景下的统一运维。

九、适合谁？欢迎对接

晋辉机联云面向：

我们已经打通从数据隔离 → API 鉴权 → 三端 UI → Nginx 部署 → 服务续期的完整链路。

结语

外勤与机械现场不缺打卡 App，缺的是：设备、绩效、考勤、培养能串成一条链的系统。

我们用Spring Boot + Vue3 + uni-app做成了可演示、可交付的真系统——设备管得住、绩效算得明，考勤作底座。

托管省心，私有化安心。

• 你们公司更倾向托管部署还是私有化？评论区聊聊。

• 需要演示账号、部署文档或商务合作，请私信回复「机联云」。

• 觉得有用，点赞 + 在看 + 转发给正在做 B 端行业系统的同事。