sincos.cc-website/website/static/tool-unitouch.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>UniTouch Interface 工控交互平台 | Easy Data Collection</title>
<meta name="description" content="UniTouch —— 运行于嵌入式工控机的 PLC / 工控机设备控制软件：多协议统一抽象、有线直连与 MQTT 网关双模式，覆盖 Windows / Linux / Android。">
<meta name="keywords" content="UniTouch, 工控机, PLC, HMI, Modbus, OPC UA, MQTT, Flutter">
<link rel="stylesheet" href="/static/css/style.css">
<link rel="icon" href="/static/img/logo.svg" type="image/svg+xml">
<script src="/static/js/nav.js"></script>
</head>
<body>

<header class="site-header">
  <div class="container header-inner">
    <a class="brand" href="/">
      <img src="/static/img/logo.svg" alt="Easy Data Collection">
      <span class="brand-name">Easy Data Collection</span>
    </a>
    <nav class="main-nav" id="mainNav">
      <div class="nav-item has-dropdown">
        <a class="nav-link" href="/research/">前沿技术研究</a>
        <button class="nav-caret" type="button" aria-label="展开前沿技术研究">▾</button>
        <div class="dropdown">
          <a href="http://124.220.63.9:25000">Research Digest</a>
          <a href="/research/neural/">Neural Research</a>
          <a href="/research/reslib/">ResLib</a>
        </div>
      </div>
      <div class="nav-item has-dropdown">
        <a class="nav-link active" href="/tools/">工具开发</a>
        <button class="nav-caret" type="button" aria-label="展开工具开发">▾</button>
        <div class="dropdown">
          <a href="/tools/sequence-diagram/">Sequence-Diagram</a>
          <a href="/tools/uni-viewer/">Uni-Viewer</a>
          <a href="/tools/engineer-craft/">Engineer Craft</a>
          <a href="/tools/five-phases-observer/">The Five Phases Observer</a>
          <a class="active" href="/tools/unitouch/">UniTouch Interface</a>
          <a href="/tools/edc-lite-erp/">EDC Lite ERP</a>
        </div>
      </div>
      <a class="nav-link" href="/resources/">资源中心</a>
      <div class="nav-item has-dropdown">
        <a class="nav-link" href="/license/">License</a>
        <button class="nav-caret" type="button" aria-label="展开 License">▾</button>
        <div class="dropdown">
          <a href="/license/apply">申请 License</a>
          <a href="/license/status">查询 / 下载</a>
          <a href="/license/package">资源包获取</a>
        </div>
      </div>
      <a class="nav-link" href="/blog/">博客</a>
    </nav>
    <button class="nav-toggle" id="navToggle" aria-label="菜单">☰</button>
  </div>
</header>

<main>
  <section class="page-hero">
    <div class="container">
      <p class="hero-eyebrow">工具开发 · 工业控制</p>
      <h1>UniTouch Interface</h1>
      <p class="page-hero-sub">运行于嵌入式工控机的 PLC / 工控机设备控制软件，目标替代传统 HMI，并逐步做成一款「大一统」工业控制平台。</p>
      <div class="hero-actions">
        <a href="http://124.220.63.9:30000/admin/UniTouch-interface" class="btn btn-light">项目主页（Gitea）</a>
        <a href="/tools/" class="btn btn-outline-light">返回工具开发</a>
      </div>
      <div class="hero-stats">
        <div class="hero-stat"><b>3</b><span>工控机平台</span></div>
        <div class="hero-stat"><b>4+</b><span>工业协议抽象</span></div>
        <div class="hero-stat"><b>2</b><span>运行模式</span></div>
      </div>
    </div>
  </section>

  <section class="section">
    <div class="container">
      <div class="section-head">
        <h2 class="section-title">设计特性</h2>
        <p class="section-desc">以设备控制为核心，把协议、界面与数据统一到一个平台上。</p>
      </div>
      <div class="grid">
        <div class="card"><div class="icon">⌘</div><h3>设备控制为核心</h3><p>写值、批量控制、逻辑联动、互锁与回读校验，控制闭环完整。</p></div>
        <div class="card"><div class="icon">⇄</div><h3>双级别运行模式</h3><p>有线直连（替代 HMI）与无线 MQTT 转发（工控机兼任网关）自由切换。</p></div>
        <div class="card"><div class="icon">◈</div><h3>多协议统一抽象</h3><p>Modbus / 西门子 S7 / 三菱 MC / OPC UA 等协议统一抽象，业务逻辑与协议解耦。</p></div>
        <div class="card"><div class="icon">▦</div><h3>跨三种工控机系统</h3><p>Windows / Linux (Ubuntu) / Android 均为 P0 优先级平台；HarmonyOS 与 iOS 后续可选扩展。</p></div>
        <div class="card"><div class="icon">✎</div><h3>组态化界面</h3><p>面向现场的组态化界面与实时监控，替代传统 HMI 的固定画面。</p></div>
        <div class="card"><div class="icon">◉</div><h3>报警与历史</h3><p>实时报警、历史数据存储与查询，过程可追溯。</p></div>
        <div class="card"><div class="icon">⛨</div><h3>权限与审计</h3><p>操作权限分级与审计留痕，满足现场管理要求。</p></div>
        <div class="card"><div class="icon">⚙</div><h3>技术栈</h3><p>Flutter（Dart） + FFI（协议性能敏感部分） + SQLite + MQTT，兼顾界面表现与协议性能。</p></div>
      </div>
    </div>
  </section>

  <section class="section">
    <div class="container">
      <h2 class="section-title">界面实录</h2>
      <p class="section-desc">深色与浅色两套主题，同一控制台。</p>
      <div class="gallery">
        <figure class="shot wide">
          <img src="/static/img/unitouch/hmi-dark.png" alt="UniTouch 设备控制台 - 深色主题">
          <figcaption>设备控制台（深色）—— 药品发酵生产线 · A 区：关键参数仪表、实时趋势、报警事件与数据审计</figcaption>
        </figure>
        <figure class="shot wide">
          <img src="/static/img/unitouch/hmi-light.png" alt="UniTouch 设备控制台 - 浅色主题">
          <figcaption>设备控制台（浅色）—— 同一套组态界面，适配不同现场光照环境</figcaption>
        </figure>
      </div>
    </div>
  </section>

  <section class="section section-alt">
    <div class="container narrow">
      <h2 class="section-title">状态与规划</h2>
      <p class="section-desc">目前处于需求探索阶段，设计文档草案已完成，详见项目仓库 docs/DESIGN.md 文末「待确认问题」。</p>
      <div class="pill-row">
        <span class="pill">Flutter</span>
        <span class="pill">FFI</span>
        <span class="pill">SQLite</span>
        <span class="pill">MQTT</span>
        <span class="pill">Modbus</span>
        <span class="pill">OPC UA</span>
      </div>
    </div>
  </section>
</main>

<footer class="site-footer">
  <div class="container footer-inner">
    <div class="footer-brand">
      <img src="/static/img/logo.svg" alt="">
      <span>Easy Data Collection</span>
    </div>
    <span>Copyright &copy; 2026 Easy Data Collection. All rights reserved.</span>
    <span class="footer-links">
      <a href="/resources/">资源中心</a><span class="sep">·</span>
      <a href="/license/">License</a><span class="sep">·</span>
      <a href="/admin">管理页面</a><span class="sep">·</span>
      <a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener">苏ICP备2026056863号</a>
    </span>
  </div>
</footer>

</body>
</html>