Cross-Platform PC Operational System for Warehouse Fulfillment: Design, Implementation, and Efficiency Metrics

Background

The PC operational system is responsible for verifying inbound goods, packaging, printing logistics labels, and handing over to 3PL. As warehouse scale grows, device heterogeneity and cost‑efficiency trade‑offs require a cross‑platform solution.

Operational Mode

Three input modes are supported (touch PC, scanner, keyboard/mouse). The recommended mode for cloud warehouses is a hybrid scanner‑plus‑screen QR code workflow.

Quick‑Code Design and Usage

Quick‑codes are short QR‑codes that trigger commands without switching devices. Three layout schemes are discussed (surround, left‑right, secondary‑menu). The final design limits visible quick‑codes to 1‑3 with ample spacing to reduce mis‑scans.

Accurate Recognition

Quick‑codes start with "@" and end with an Enter keystroke. Recognition must handle character‑input conflicts and focus conflicts. Example handler:

(e: KeyboardEvent) => {
  const enterKey = e.key === "Enter";
  // @ 开头，开启一个新的快捷指令
  if (e.key === "@") {
    e.preventDefault();
    scaning.current = true;
  }
  // ...
  // 处理按钮输入锁定等兼容逻辑
  if (scaning.current && !enterKey) {
    activeCode.current += String(e.key);
    e.preventDefault();
  } else if (activeCode.current && enterKey) {
    scaning.current = false;
    // 快捷指令执行函数和标记高亮等
  }
  // ...
  // 输入解锁等能力
};

High‑Light Feedback

Visual blocks and optional sounds indicate success or failure, useful when audio equipment is absent.

Printing and Sticker Recommendations

Quick‑codes are divided into forward and reverse flows and can be printed directly from the system. Printing is implemented by rendering an HTML fragment and invoking the browser print API:

export function printHTMLOutWithCSS(config: { content?: string; cssText?: string }) {
  if (!config?.content) return;
  const cssText = config?.cssText;
  const iframeEle = document.createElement("iframe");
  iframeEle.style.display = "none";
  document.body.append(iframeEle);
  const iframeDoc = iframeEle?.contentDocument || iframeEle?.contentWindow?.document;
  if (iframeDoc?.body) {
    iframeDoc.body.innerHTML = `<style>${cssText || ""}</style>${config?.content}`;
    iframeEle?.contentWindow?.print();
  }
  document.body.removeChild(iframeEle);
}

printHTMLOutWithCSS({
  content: `
${dom.outerHTML}
<div class="qrcode-button-name">${config?.name || "-"}</div>`,
  cssText: STYLE_PRINT_STR,
});

Environment Detection and Automatic Repair

The system checks input method, printer, and software version on heartbeat and when the window gains focus. Input‑method detection ensures an English layout to avoid accidental Chinese character entry. Language adaptation scripts for Windows are provided:

// # constant
const PLAT_WIN = os.platform() === 'win32'
const LANG_CONFIG = {
  'en-US': { name: 'en-US', code: '0409:00000409', delay: 1.5 },
  'zh-CN': { name: 'zh-CN', code: '0804:{81D4E9C9-1D3B-41BC-9E6C-4B40BF79E35E}{FA550B04-5AD7-411F-A5AC-CA038EC515D7}', delay: 1.5 },
}

function getShellLangScripts({ delay, name, code }: { delay: number; name: string; code: string }) {
  const tplName = name || 'en-US'
  const tplCode = code || '0409:00000409'
  const tplDelay = delay || 1.5
  return {
    RESET: [
      `Set-WinSystemLocale ${tplName};`,
      `Set-WinUserLanguageList ${tplName} -Force;`,
      `Set-WinDefaultInputMethodOverride -InputTip "${tplCode}";`,
    ],
    COMPATIBLE: [
      `$restoreLanguageList = Get-WinUserLanguageList;`,
      `$restoreLanguageList.Remove("${tplName}");`,
      `$restoreLanguageList.Insert(0, "${tplName}");`,
      `Set-WinUserLanguageList ${tplName} -Force;`,
      `Start-Sleep -Seconds ${tplDelay};`,
      `Set-WinUserLanguageList -LanguageList $restoreLanguageList -Force;`,
      `Set-WinDefaultInputMethodOverride -InputTip "${tplCode}";`,
      `Set-WinSystemLocale zh-CN;`,
      `Set-WinUILanguageOverride -Language zh-CN;`,
    ],
  }
}

export type ActionTypeLangAdapt = 'COMPATIBLE' | 'RESET' | 'CAT'
export type NameTypeLangAdapt = 'zh-CN' | 'en-US'
let lockExecLang = false
export function adaptOrCatLang(actionType?: ActionTypeLangAdapt, nameType?: NameTypeLangAdapt, delay?: string, fn?: (status: 'success' | 'failed', msg: string) => void) {
  if (lockExecLang) return
  lockExecLang = true
  const fnAffair = (status: 'success' | 'failed', msg: string) => { fn?.(status, msg); lockExecLang = false }
  if (!PLAT_WIN) { fnAffair('failed', '仅支持windows系统'); return }
  const langTplConfig = LANG_CONFIG[nameType]
  langTplConfig.delay = Number(delay) || langTplConfig.delay
  if (!langTplConfig) { fnAffair('failed', '语言类型错误'); return }
  const shellLangScripts = getShellLangScripts(langTplConfig)
  switch (actionType) {
    case 'CAT':
      const out = childProcess.execSync('powershell.exe (Get-WinUserLanguageList)[0].LanguageTag;')
      fnAffair('success', out?.toString('utf8')?.trim() || '')
      break
    default:
      const langScript = shellLangScripts?.[actionType]?.join('')
      if (langScript) {
        const out = childProcess.spawn(langScript, { shell: 'powershell.exe' })
        out.on('exit', function () { fnAffair('success', `语言切换成功(${nameType})`) })
      } else {
        fnAffair('failed', '指令类型错误')
      }
      break
  }
}

Unified Printing Component

A Chromium‑based printing component decouples the system from specific printer models, ensuring consistent output and reducing hardware costs.

Software Update

The system checks for newer versions of the printing component and triggers an update via URL schemes.

Feedback and Exception SOP

Operation status is shown at the top of the UI with visual and optional audio cues. When unexpected situations occur (e.g., order cancellation), predefined SOPs guide the operator to resolve the issue without manual training.

Efficiency Metrics

Key performance indicators (KPIs) measure the smoothness of the fulfillment flow, the ratio of automated steps, and the frequency of reverse‑flow interventions. A dashboard visualises these metrics for continuous improvement.

Future Plans

Validate and extend environment‑detection capabilities.

Integrate AI‑assisted image verification and keyword extraction.

Enhance micro‑frontend compatibility for seamless cloud‑warehouse integration.