簡(jiǎn)介辦公設(shè)備管理系統(tǒng)OAMS是一套面向企事業(yè)單位設(shè)備管理員與信息化開發(fā)者的全生命周期管理解決方案圍繞采購(gòu)、入庫(kù)、領(lǐng)用、維修、報(bào)廢等環(huán)節(jié)解決設(shè)備臺(tái)賬混亂、審批低效、資源閑置等痛點(diǎn)。資源包共451個(gè)文件以gif界面截圖、jsp頁(yè)面、java源碼與class編譯文件為主輔以xml配置、jar依賴、tld標(biāo)簽庫(kù)及少量數(shù)據(jù)庫(kù)與文檔文件壓縮包約6.71MB結(jié)構(gòu)完整便于二次開發(fā)與部署調(diào)試。已有272人學(xué)習(xí)下載。讀者可從中獲取設(shè)備信息錄入與唯一標(biāo)識(shí)、按部門類型分類統(tǒng)計(jì)、使用率與維修費(fèi)用報(bào)表生成、電子化領(lǐng)用歸還審批、故障報(bào)修跟蹤、報(bào)廢評(píng)估及庫(kù)存與供應(yīng)商管理等模塊的實(shí)現(xiàn)思路適合作為課程設(shè)計(jì)、畢業(yè)設(shè)計(jì)或企業(yè)設(shè)備管理系統(tǒng)的參考原型幫助快速理解業(yè)務(wù)邏輯與代碼組織方式。1. 辦公設(shè)備管理系統(tǒng)OAMS從臺(tái)賬混亂到掃碼即查的落地路徑行政部月底盤點(diǎn)的場(chǎng)景很多同行都經(jīng)歷過三張 Excel 表對(duì)不上打印機(jī)在誰(shuí)工位上沒人說得清筆記本借出三個(gè)月后歸還日期還是空的。辦公設(shè)備管理系統(tǒng) OAMS 要解決的就是這類問題——把設(shè)備從采購(gòu)入庫(kù)、領(lǐng)用借用、維修保養(yǎng)到報(bào)廢處置的全生命周期收斂到一個(gè)可查詢、可追溯、可預(yù)警的數(shù)據(jù)臺(tái)賬里。它適合中小企業(yè)行政、IT 資產(chǎn)管理員也適合需要做固定資產(chǎn)臺(tái)賬的團(tuán)隊(duì)。這套源碼包不是演示級(jí) Demo而是帶完整權(quán)限、審批流和報(bào)表導(dǎo)出的可運(yùn)行系統(tǒng)下面按「先跑起來、再改配置、最后避坑」的順序拆一遍。2. 技術(shù)棧選型與本地環(huán)境搭建為什么用這套組合2.1 后端與前端的技術(shù)選型理由拿到一個(gè)管理系統(tǒng)源碼第一件事不是急著npm install而是先看它用什么寫的、為什么這么寫。OAMS 這類辦公設(shè)備管理場(chǎng)景核心訴求是「表單多、權(quán)限細(xì)、報(bào)表要導(dǎo)出」對(duì)高并發(fā)沒有硬性要求所以選型邏輯和互聯(lián)網(wǎng) C 端產(chǎn)品完全不同。常見做法是后端用 Spring Boot 或 Django 這類自帶 ORM 和權(quán)限體系的框架前端用 Vue 或 React 配合 Element Plus / Ant Design 這類中后臺(tái)組件庫(kù)。原因很直接設(shè)備管理系統(tǒng)的頁(yè)面 80% 是表格、表單、彈窗中后臺(tái)組件庫(kù)已經(jīng)把分頁(yè)表格、樹形部門選擇、日期范圍篩選這些輪子造好了自己從零寫只會(huì)拖慢進(jìn)度。數(shù)據(jù)庫(kù)一般選 MySQL因?yàn)樵O(shè)備臺(tái)賬的數(shù)據(jù)量在幾萬(wàn)條量級(jí)MySQL 完全夠用而且運(yùn)維成本低行政 IT 也能接手。如果源碼包用的是前后端分離架構(gòu)后端會(huì)暴露 RESTful 接口前端通過 axios 調(diào)用。這種結(jié)構(gòu)的好處是后續(xù)要做移動(dòng)端掃碼查詢時(shí)接口可以直接復(fù)用不用重寫業(yè)務(wù)邏輯。選型上沒有絕對(duì)優(yōu)劣關(guān)鍵是看它有沒有把「設(shè)備狀態(tài)機(jī)」和「權(quán)限模型」設(shè)計(jì)清楚——這兩塊才是 OAMS 的骨架框架只是外殼。2.2 本地跑通的最小步驟假設(shè)源碼包是 Spring Boot Vue 的典型結(jié)構(gòu)本地跑通需要三步起數(shù)據(jù)庫(kù)、起后端、起前端。下面按順序給命令每一步都說明在做什么。# 1. 創(chuàng)建數(shù)據(jù)庫(kù)字符集用 utf8mb4避免設(shè)備名稱里的特殊符號(hào)亂碼 mysql -u root -p -e CREATE DATABASE oams DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci; # 2. 導(dǎo)入初始化腳本通常在 sql/ 目錄下包含表結(jié)構(gòu)和基礎(chǔ)字典數(shù)據(jù) mysql -u root -p oams sql/oams_init.sql # 3. 修改后端配置文件里的數(shù)據(jù)庫(kù)連接改成你自己的賬號(hào)密碼 # 文件位置一般是 src/main/resources/application-dev.yml數(shù)據(jù)庫(kù)建好之后后端配置文件里要改的不只是賬號(hào)密碼。連接池參數(shù)、文件上傳路徑、日志級(jí)別這三項(xiàng)也建議一起看。文件上傳路徑如果默認(rèn)是 Linux 的/data/upload在 Windows 上跑就會(huì)報(bào)錯(cuò)改成相對(duì)路徑或你本地的絕對(duì)路徑即可。# 4. 啟動(dòng)后端首次啟動(dòng)會(huì)自動(dòng)建表或校驗(yàn)表結(jié)構(gòu) cd oams-backend mvn spring-boot:run # 5. 啟動(dòng)前端安裝依賴后跑開發(fā)服務(wù)器 cd oams-frontend npm install npm run dev前端啟動(dòng)后一般跑在 8080 或 5173 端口瀏覽器打開后如果登錄頁(yè)能正常渲染說明前后端聯(lián)調(diào)通了。默認(rèn)管理員賬號(hào)通常在初始化 SQL 里常見是admin / 123456登錄后第一件事就是改密碼別留著默認(rèn)口令跑在內(nèi)網(wǎng)里。提示如果后端啟動(dòng)報(bào)「Table doesnt exist」多半是初始化 SQL 沒導(dǎo)入完整或者數(shù)據(jù)庫(kù)名和配置文件里對(duì)不上先核對(duì)這兩處再排查代碼。2.3 目錄結(jié)構(gòu)與核心模塊定位跑通之后別急著改功能先花十分鐘把目錄結(jié)構(gòu)摸清楚。OAMS 這類系統(tǒng)的代碼通常按「controller / service / mapper / entity」分層前端按「views / api / components / router」組織。你要改設(shè)備字段就順著EquipmentController→EquipmentService→EquipmentMapper這條鏈找要改頁(yè)面布局就去views/equipment下面找對(duì)應(yīng)組件。核心模塊一般有四個(gè)設(shè)備臺(tái)賬、領(lǐng)用借用、維修報(bào)廢、統(tǒng)計(jì)報(bào)表。臺(tái)賬是主表其他三個(gè)都是圍繞它掛載的業(yè)務(wù)流。理解這一點(diǎn)后面改審批流或者加自定義字段時(shí)就不會(huì)迷路。我一般會(huì)先在本地把「新增一臺(tái)設(shè)備 → 領(lǐng)用 → 報(bào)修 → 報(bào)廢」這條完整鏈路走一遍走通了再動(dòng)代碼比直接讀源碼快得多。3. 設(shè)備臺(tái)賬與權(quán)限模型數(shù)據(jù)表怎么設(shè)計(jì)才不返工3.1 設(shè)備主表的關(guān)鍵字段與狀態(tài)機(jī)設(shè)備臺(tái)賬看起來就是一張表但字段設(shè)計(jì)不好后期返工成本極高。血淚經(jīng)驗(yàn)是設(shè)備編號(hào)、資產(chǎn)分類、存放位置、責(zé)任人、狀態(tài)這五個(gè)字段必須在建表時(shí)就定清楚尤其是狀態(tài)字段。狀態(tài)機(jī)是 OAMS 的核心邏輯。一臺(tái)設(shè)備從入庫(kù)到報(bào)廢狀態(tài)流轉(zhuǎn)通常是在庫(kù) → 領(lǐng)用中 → 維修中 → 已報(bào)廢。有些系統(tǒng)還會(huì)加「借用中」「閑置」等中間態(tài)。狀態(tài)不能隨便改必須通過業(yè)務(wù)操作觸發(fā)否則臺(tái)賬就亂了。比如「維修中」只能由報(bào)修單審批通過后自動(dòng)置位不能讓人在編輯頁(yè)手動(dòng)改成「在庫(kù)」不然維修記錄和實(shí)際狀態(tài)就對(duì)不上。-- 設(shè)備主表的核心字段設(shè)計(jì)簡(jiǎn)化版 CREATE TABLE equipment ( id BIGINT PRIMARY KEY AUTO_INCREMENT, asset_no VARCHAR(32) NOT NULL UNIQUE COMMENT 資產(chǎn)編號(hào)唯一建議按分類年份流水生成, name VARCHAR(128) NOT NULL COMMENT 設(shè)備名稱, category_id INT NOT NULL COMMENT 分類ID關(guān)聯(lián)字典表, location VARCHAR(128) COMMENT 存放位置, owner_id BIGINT COMMENT 當(dāng)前責(zé)任人空表示在庫(kù), status TINYINT NOT NULL DEFAULT 0 COMMENT 0在庫(kù) 1領(lǐng)用中 2維修中 3已報(bào)廢, purchase_date DATE COMMENT 采購(gòu)日期, price DECIMAL(10,2) COMMENT 采購(gòu)金額, created_at DATETIME DEFAULT CURRENT_TIMESTAMP );asset_no加唯一索引是必須的否則同一臺(tái)設(shè)備可能被重復(fù)錄入。owner_id為空表示設(shè)備在庫(kù)這個(gè)約定比單獨(dú)加一個(gè)「是否領(lǐng)用」字段更簡(jiǎn)潔查詢時(shí)WHERE owner_id IS NULL就能篩出所有在庫(kù)設(shè)備。status用數(shù)字枚舉而不是字符串是為了查詢效率但前端要維護(hù)一份映射表別讓用戶看到「0」這種值。3.2 權(quán)限模型RBAC 在設(shè)備管理里的落地設(shè)備管理系統(tǒng)的權(quán)限比想象中細(xì)。普通員工只能看自己名下的設(shè)備部門主管能看本部門的行政能看全部IT 管理員能改狀態(tài)和審批。這種「數(shù)據(jù)行級(jí)權(quán)限」用簡(jiǎn)單的角色控制是不夠的需要 RBAC 加數(shù)據(jù)范圍。常見做法是三張表用戶表、角色表、權(quán)限表再加一張用戶角色關(guān)聯(lián)表。角色決定「能操作哪些菜單」數(shù)據(jù)范圍決定「能看到哪些數(shù)據(jù)」。數(shù)據(jù)范圍一般分四檔全部、本部門、本部門及下級(jí)、僅本人。實(shí)現(xiàn)時(shí)在查詢 SQL 里動(dòng)態(tài)拼WHERE條件而不是在代碼里過濾否則數(shù)據(jù)量大時(shí)性能會(huì)崩。// 數(shù)據(jù)范圍過濾的典型寫法MyBatis 攔截器思路 // 根據(jù)當(dāng)前登錄用戶的 dataScope動(dòng)態(tài)拼接 SQL 片段 if (DataScope.DEPT.equals(user.getDataScope())) { // 只看本部門通過部門ID關(guān)聯(lián) sqlSegment AND dept_id user.getDeptId(); } else if (DataScope.SELF.equals(user.getDataScope())) { // 只看本人通過責(zé)任人ID關(guān)聯(lián) sqlSegment AND owner_id user.getUserId(); } // 全部范圍不加條件直接放行這段邏輯的關(guān)鍵是「在 SQL 層過濾不在 Java 層過濾」。如果在 Service 里查出全部再stream().filter()數(shù)據(jù)量一上來內(nèi)存和響應(yīng)時(shí)間都扛不住。另外數(shù)據(jù)范圍要和菜單權(quán)限分開判斷有「設(shè)備列表」菜單權(quán)限不代表能看到所有設(shè)備兩個(gè)維度是正交的。注意改權(quán)限模型時(shí)一定要同步改前端路由守衛(wèi)和后端接口鑒權(quán)只改一邊會(huì)出現(xiàn)「頁(yè)面進(jìn)不去但接口能調(diào)」或者「頁(yè)面能進(jìn)但接口 403」的玄學(xué)問題。3.3 臺(tái)賬導(dǎo)入與資產(chǎn)編號(hào)生成規(guī)則存量設(shè)備導(dǎo)入是繞不開的一步。行政手里通常有一份 Excel字段和系統(tǒng)表結(jié)構(gòu)對(duì)不上直接導(dǎo)入會(huì)失敗。穩(wěn)妥的做法是先做字段映射再校驗(yàn)最后入庫(kù)。資產(chǎn)編號(hào)的生成規(guī)則建議在導(dǎo)入前就定好常見格式是「分類縮寫 年份 四位流水」比如PC-2024-0001。流水號(hào)要按分類獨(dú)立遞增不能全局遞增否則打印機(jī)和筆記本混在一起編號(hào)會(huì)很亂。導(dǎo)入時(shí)如果 Excel 里已有編號(hào)要校驗(yàn)唯一性沒有編號(hào)的由系統(tǒng)按規(guī)則自動(dòng)生成。# Excel 導(dǎo)入前的字段校驗(yàn)?zāi)_本偽代碼按實(shí)際列名調(diào)整 import pandas as pd df pd.read_excel(設(shè)備臺(tái)賬.xlsx) required [設(shè)備名稱, 分類, 采購(gòu)日期] for col in required: if col not in df.columns: raise ValueError(f缺少必填列{col}) # 校驗(yàn)分類是否在字典表里不在的標(biāo)記出來人工確認(rèn) valid_categories {筆記本, 臺(tái)式機(jī), 打印機(jī), 投影儀} invalid df[~df[分類].isin(valid_categories)] if not invalid.empty: print(f有 {len(invalid)} 行分類無法識(shí)別請(qǐng)先補(bǔ)充字典)導(dǎo)入這一步最容易翻車的地方是日期格式。Excel 里的日期可能是2024/1/5、2024-01-05、2024年1月5日三種混著來直接入庫(kù)會(huì)報(bào)錯(cuò)。穩(wěn)妥做法是統(tǒng)一轉(zhuǎn)成YYYY-MM-DD再寫庫(kù)轉(zhuǎn)換失敗的單獨(dú)導(dǎo)出讓人工修。別指望用戶按模板填模板永遠(yuǎn)有人不遵守。4. 領(lǐng)用借用與維修報(bào)廢業(yè)務(wù)流怎么串起來4.1 領(lǐng)用審批流的配置與狀態(tài)聯(lián)動(dòng)領(lǐng)用是設(shè)備從「在庫(kù)」變成「領(lǐng)用中」的觸發(fā)點(diǎn)。這個(gè)動(dòng)作不能是簡(jiǎn)單的改字段必須走審批流否則出了問題沒法追責(zé)。OAMS 的審批流一般支持多級(jí)小公司一級(jí)審批行政確認(rèn)就夠大公司可能要部門主管加行政兩級(jí)。審批流配置的核心是「節(jié)點(diǎn)」和「條件」。節(jié)點(diǎn)決定誰(shuí)審條件決定什么情況下走哪個(gè)分支。比如金額超過 5000 的設(shè)備領(lǐng)用需要額外加一級(jí)審批。配置時(shí)要注意審批通過后要自動(dòng)更新設(shè)備狀態(tài)和責(zé)任人審批駁回則狀態(tài)不變。這個(gè)聯(lián)動(dòng)邏輯寫在審批回調(diào)里別寫在 Controller 里否則以后加審批類型會(huì)重復(fù)代碼。// 審批通過后的狀態(tài)聯(lián)動(dòng)簡(jiǎn)化示意 public void onApprovePass(Long applyId) { Apply apply applyMapper.selectById(applyId); Equipment eq equipmentMapper.selectById(apply.getEquipmentId()); // 只有當(dāng)前是在庫(kù)狀態(tài)才允許領(lǐng)用防止并發(fā)下重復(fù)領(lǐng)用 if (eq.getStatus() ! Status.IN_STOCK) { throw new BizException(設(shè)備當(dāng)前狀態(tài)不可領(lǐng)用); } eq.setStatus(Status.IN_USE); eq.setOwnerId(apply.getApplicantId()); equipmentMapper.updateById(eq); }這里有個(gè)并發(fā)坑兩個(gè)人同時(shí)申請(qǐng)同一臺(tái)在庫(kù)設(shè)備如果不在更新時(shí)加狀態(tài)校驗(yàn)可能都審批通過導(dǎo)致一臺(tái)設(shè)備兩個(gè)責(zé)任人。解決辦法是在UPDATE語(yǔ)句里帶WHERE status 0條件用數(shù)據(jù)庫(kù)的行鎖保證只有一條能成功。4.2 借用與領(lǐng)用的區(qū)別及歸還提醒借用和領(lǐng)用經(jīng)常被混為一談但業(yè)務(wù)上差別很大。領(lǐng)用是長(zhǎng)期歸屬責(zé)任人變更借用是臨時(shí)使用到期要?dú)w還責(zé)任人不變。系統(tǒng)里應(yīng)該用兩張表或者同一張表加「類型」字段區(qū)分別圖省事合成一個(gè)流程。借用最需要的是「到期提醒」。設(shè)備借出時(shí)填預(yù)計(jì)歸還日期到期前三天系統(tǒng)自動(dòng)發(fā)通知給借用人和管理員。提醒邏輯一般用定時(shí)任務(wù)實(shí)現(xiàn)每天凌晨掃一遍即將到期的借用單。-- 查詢?nèi)靸?nèi)到期且未歸還的借用記錄 SELECT b.id, b.equipment_id, e.name, b.borrower_id, b.expect_return_date FROM borrow_record b JOIN equipment e ON b.equipment_id e.id WHERE b.status BORROWED AND b.expect_return_date BETWEEN CURDATE() AND DATE_ADD(CURDATE(), INTERVAL 3 DAY);定時(shí)任務(wù)要注意冪等同一條借用記錄一天只能提醒一次否則用戶會(huì)被轟炸。常見做法是加一個(gè)last_notify_date字段發(fā)之前判斷是不是今天已經(jīng)發(fā)過。另外逾期未還的要有升級(jí)機(jī)制比如逾期七天自動(dòng)通知部門主管這個(gè)規(guī)則最好做成可配置的不同公司容忍度不一樣。4.3 維修報(bào)廢流程與資產(chǎn)折舊銜接維修流程相對(duì)簡(jiǎn)單報(bào)修 → 派單 → 維修中 → 完成。但狀態(tài)要同步到設(shè)備主表讓臺(tái)賬上能看到「這臺(tái)設(shè)備正在維修」。報(bào)廢則要謹(jǐn)慎因?yàn)樯婕百Y產(chǎn)核銷通常需要財(cái)務(wù)確認(rèn)。報(bào)廢流程走完后設(shè)備狀態(tài)置為「已報(bào)廢」但數(shù)據(jù)不能刪。固定資產(chǎn)臺(tái)賬要求保留歷史記錄所以報(bào)廢設(shè)備在列表里默認(rèn)隱藏但可以通過篩選查出來。如果系統(tǒng)要對(duì)接財(cái)務(wù)的折舊計(jì)算報(bào)廢日期就是停止折舊的節(jié)點(diǎn)這個(gè)字段必須準(zhǔn)確。維修和報(bào)廢的審批權(quán)限要分開。維修一般 IT 或行政就能批報(bào)廢通常要更高層級(jí)。配置權(quán)限時(shí)別把兩個(gè)流程的審批人設(shè)成同一個(gè)角色否則容易出現(xiàn)「維修單被當(dāng)成報(bào)廢批了」的誤操作。流程設(shè)計(jì)上報(bào)廢單應(yīng)該關(guān)聯(lián)設(shè)備的采購(gòu)日期和原值方便審批人判斷是否到了報(bào)廢年限。5. 避坑與排查部署和運(yùn)行中最容易翻車的五件事5.1 中文亂碼從數(shù)據(jù)庫(kù)到前端的三處字符集現(xiàn)象設(shè)備名稱里的中文在列表頁(yè)顯示成問號(hào)或方塊。原因通常是字符集不統(tǒng)一數(shù)據(jù)庫(kù)、連接串、前端三處有一處沒設(shè)成 utf8mb4。解決數(shù)據(jù)庫(kù)建庫(kù)時(shí)指定utf8mb4JDBC 連接串加characterEncodingutf8前端 HTML 的 meta 聲明charsetutf-8。三處都對(duì)了才不會(huì)亂碼只改一處往往沒用。5.2 文件上傳失敗路徑權(quán)限與大小限制現(xiàn)象上傳設(shè)備圖片或采購(gòu)憑證時(shí)報(bào) 500日志里是FileNotFoundException或SizeLimitExceededException。原因有兩個(gè)一是上傳目錄不存在或進(jìn)程沒有寫權(quán)限二是框架默認(rèn)上傳大小限制太小Spring Boot 默認(rèn)單文件 1MB。解決確認(rèn)上傳目錄存在且可寫配置文件里把max-file-size和max-request-size調(diào)大比如改成 10MB 和 50MB。5.3 審批流卡死節(jié)點(diǎn)找不到審批人現(xiàn)象提交領(lǐng)用申請(qǐng)后一直停在「待審批」沒人收到通知。原因通常是審批節(jié)點(diǎn)的審批人配置為空或者審批人離職后賬號(hào)被禁用導(dǎo)致流程找不到下一個(gè)處理人。解決配置審批節(jié)點(diǎn)時(shí)加兜底審批人流程引擎里對(duì)「審批人為空」的情況做異常處理自動(dòng)轉(zhuǎn)給管理員。上線前用測(cè)試賬號(hào)把每條審批分支都走一遍別只測(cè)主流程。5.4 報(bào)表導(dǎo)出超時(shí)一次性查全表現(xiàn)象導(dǎo)出設(shè)備臺(tái)賬 Excel 時(shí)頁(yè)面轉(zhuǎn)圈很久最后超時(shí)。原因是導(dǎo)出接口一次性把全表查出來再寫 Excel數(shù)據(jù)量上萬(wàn)條就扛不住。解決分頁(yè)查詢后分批寫入或者用流式導(dǎo)出如 EasyExcel 的SXSSFWorkbook邊查邊寫內(nèi)存占用可控。導(dǎo)出條件也要限制別允許不選任何條件就導(dǎo)出全量。5.5 定時(shí)任務(wù)重復(fù)執(zhí)行多實(shí)例部署的坑現(xiàn)象借用到期提醒發(fā)了兩遍甚至多遍。原因是系統(tǒng)部署了兩個(gè)實(shí)例每個(gè)實(shí)例的定時(shí)任務(wù)都跑了一遍。解決單實(shí)例部署時(shí)沒這個(gè)問題多實(shí)例要么用分布式鎖如 Redis 鎖保證只有一個(gè)實(shí)例執(zhí)行要么把定時(shí)任務(wù)獨(dú)立成一個(gè)服務(wù)。這個(gè)問題在測(cè)試環(huán)境單機(jī)跑永遠(yuǎn)發(fā)現(xiàn)不了一上生產(chǎn)就暴露屬于典型的「環(huán)境差異坑」。6. 進(jìn)階技巧用二維碼把設(shè)備臺(tái)賬搬到手機(jī)上臺(tái)賬做得再好如果查一臺(tái)設(shè)備還要回工位開電腦使用率就上不去。進(jìn)階玩法是給每臺(tái)設(shè)備生成二維碼標(biāo)簽貼在機(jī)身手機(jī)掃碼直接打開該設(shè)備的詳情頁(yè)領(lǐng)用、報(bào)修、盤點(diǎn)都能在手機(jī)上完成。這一步做完OAMS 才算真正落地到日常。實(shí)現(xiàn)思路分三塊生成二維碼、掃碼解析、移動(dòng)端適配。二維碼內(nèi)容不用存全部信息存一個(gè)帶設(shè)備 ID 的短鏈接即可比如https://your-domain/eq/1024掃碼后前端路由解析 ID 再調(diào)接口拿詳情。這樣設(shè)備信息變了也不用重新打印標(biāo)簽靈活得多。// 前端生成設(shè)備二維碼使用 qrcode 庫(kù) import QRCode from qrcode; async function genEquipmentQR(equipmentId) { // 二維碼內(nèi)容指向設(shè)備詳情頁(yè)用 ID 做參數(shù) const url ${window.location.origin}/eq/${equipmentId}; // 生成到 canvas再由后端或前端合成標(biāo)簽圖片 const dataUrl await QRCode.toDataURL(url, { width: 300, margin: 1, errorCorrectionLevel: M // 中等糾錯(cuò)標(biāo)簽有輕微磨損也能掃出來 }); return dataUrl; }errorCorrectionLevel選M是平衡之選L容錯(cuò)低但碼點(diǎn)少H容錯(cuò)高但碼點(diǎn)密標(biāo)簽小的時(shí)候反而難掃。設(shè)備標(biāo)簽一般貼在機(jī)身側(cè)面空間有限M級(jí)別配合 300px 寬度夠用。批量生成時(shí)建議按分類分批打印別一次生成幾千張打印機(jī)和人工貼標(biāo)都受不了。掃碼后的移動(dòng)端頁(yè)面要做減法。手機(jī)上別放完整的管理后臺(tái)只保留三個(gè)操作查看設(shè)備信息、發(fā)起報(bào)修、確認(rèn)盤點(diǎn)。盤點(diǎn)功能尤其適合掃碼管理員拿著手機(jī)繞辦公室走一圈掃一臺(tái)標(biāo)記一臺(tái)實(shí)時(shí)對(duì)比系統(tǒng)臺(tái)賬差異當(dāng)場(chǎng)就能發(fā)現(xiàn)。這比月底對(duì)著 Excel 回憶「這臺(tái)到底在不在」高效太多。從那以后我每次交付這類系統(tǒng)都會(huì)強(qiáng)制走一遍「掃碼盤點(diǎn)」的完整流程掃不出來或者跳轉(zhuǎn)錯(cuò)誤的標(biāo)簽當(dāng)場(chǎng)重打絕不拖到上線后。希望幫到你。本文還有配套的精品資源點(diǎn)擊獲取