iT邦幫忙

2026 iThome 鐵人賽

DAY 19
0
AI 自動化

RPA流程自動化應用系列 第 19 篇

【Day 19】升級 HTML 儀表板提升新案與歷史庫存的查詢

  • 分享至 

  • xImage
  •  

商業決策需要的是「資訊連續性」。今天我們要全面升級 HTML 儀表板:實現新案與歷史庫存的動態穿透,並加入一個極速的原生 JavaScript 即時搜尋框!

  • 一、 核心優化亮點
    資訊動態穿透(Data Drill-down):
    今日有新案件時:自動標記為 📋 今日新公開專利詳細清單,載入今日最新萃取之專利。
    今日無新案件(歷史態勢)時:智慧切換為 📋 累計專利情報歷史總覽清單,自動讀取本機累積的 JSON 資料庫(High_Priority.json、Review_Needed.json、General.json),將在庫專利完整呈現在表格中!
    直覺的彩色狀態標籤(Badges):
    將文字分流轉換為清晰的視覺標籤:
    🔴 High_Priority(高風險競品警戒)
    🟠 Review_Needed(優先權待覆核)
    🔵 General(常規專利)
    免伺服器的純前端即時搜尋(Client-side Live Search):
    無需任何後端 API 或龐大框架,透過純原生 JavaScript 監聽鍵盤輸入,在使用者打字的瞬間(毫秒級)即時篩選案號、申請人或摘要關鍵字。
  • 二、 前端即時搜尋核心語法
    在生成的 HTML 中,我們嵌入了一段純 JavaScript 篩選器:
function filterTable() {
  var input = document.getElementById('filterInput').value.toLowerCase();
  var rows = document.querySelectorAll('#patentTable tbody tr');
  rows.forEach(function(row) {
    row.style.display = row.innerText.toLowerCase().indexOf(input) > -1 ? '' : 'none';
  });
}

今日成果展示
重新執行流程後,點開產出的 HTML 儀表板:
1.最上方清晰呈現 4 個 KPI 統計卡片,以及風險佔比圓餅圖與案件長條圖。
2.下方清楚展開 「累計專利情報歷史總覽清單」,10 筆專利案號、申請日、申請人與摘要一覽無遺。
3.在搜尋框輸入「美商」或特定案號,表格內容即時動態過濾,點擊即可直接檢閱!
https://ithelp.ithome.com.tw/upload/images/20261003/20178363Eof0ElBRtq.jpg


上一篇
【Day 18】建立 Log Message 進行日後排查追蹤
下一篇
【Day 20】拒絕一刀切!導入「多維度加權風險評分(Tier 1~3)」升級專利雷達規則
系列文
RPA流程自動化應用 共 20 篇
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言