From c120bf3fddf5f9a9cb9edfd69facd753e2c5f88f Mon Sep 17 00:00:00 2001
From: hbk01 <3243430237@qq.com>
Date: Sun, 20 Nov 2022 00:19:56 +0800
Subject: [PATCH] =?UTF-8?q?+=20=E7=82=BD=E7=81=BC=E6=AE=8B=E6=B8=A3?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E=E4=BF=9D=E5=AD=98=E5=8A=9F=E8=83=BD=20+=20?=
 =?UTF-8?q?=E6=A0=BC=E5=BC=8F=E5=8C=96=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 L014-1-impurities.html   |  57 +++++----
 L414-5KR-impurities.html |  39 ++----
 equipment.html           | 120 +++++++++----------
 index.html               |  48 ++++----
 injection-sequence.html  | 179 +++++++++++++---------------
 lod.html                 |  55 ++++-----
 modules/tools.js         |  34 ++++++
 roi.html                 | 248 +++++++++++++++++++++++++--------------
 titer.html               |  99 +++++++---------
 9 files changed, 481 insertions(+), 398 deletions(-)
 create mode 100644 modules/tools.js

diff --git a/L014-1-impurities.html b/L014-1-impurities.html
index cd5afe3..1ba09d7 100644
--- a/L014-1-impurities.html
+++ b/L014-1-impurities.html
@@ -5,18 +5,20 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
-    <title>L014-1 相关物质计算</title>
+    <title>L014-1 相关物质</title>
     <link rel="stylesheet" href="./github.css">
     <link rel="stylesheet" href="./theme.css">
     <script src="./decimal.js"></script>
     <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
     <script>
-        var decimal = Decimal.set({
+        let decimal = Decimal.set({
             rounding: Decimal.ROUND_HALF_EVEN,
             precision: 12
         })
         $(document).ready(() => {
+            const DEBUG = false
+
             // 2.2-Dimer 最大值
             const DIMER_MAX = 2.5
             // 2-乙酰噻吩 最大值
@@ -32,30 +34,40 @@
             const AT_RRF = 2.06
 
             // 计算精度
-            var PRECISION = new Decimal(12).toNumber()
+            let PRECISION = new Decimal(3).toNumber()
 
-            var clear_list = [
-                $("#one-dimer"),
-                $("#one-at"),
-                $("#one-014-1"),
-                $("#one-all"),
-                $("#two-dimer"),
-                $("#two-at"),
-                $("#two-014-1"),
-                $("#two-all"),
-                $("#msgbox")
-            ]
+            if (DEBUG) {
+                $("#one-dimer").val(247427)
+                $("#one-at").val(65863)
+                $("#one-014-1").val(11511879)
+                $("#one-all").val(11888859)
+
+                $("#two-dimer").val(249299)
+                $("#two-at").val(66682)
+                $("#two-014-1").val(11563139)
+                $("#two-all").val(11943432)
+            }
 
             $("#precision").on('input', event => {
                 let p = $("#precision").val()
                 $("#precision-text").text(p)
                 PRECISION = new Decimal(p).toNumber()
             })
+
             $("#new_page").click(() => window.open(window.location.href, '_BLANK'))
-            $("#clear").click(() => clear_list.forEach(v => {
-                v.val("")
-                v.empty()
-            }))
+
+            $("#clear").click(() => {
+                $("#one-dimer").val("")
+                $("#one-at").val("")
+                $("#one-014-1").val("")
+                $("#one-all").val("")
+                $("#two-dimer").val("")
+                $("#two-at").val("")
+                $("#two-014-1").val("")
+                $("#two-all").val("")
+                $("#msgbox").empty()
+            })
+
             $("#ok").click(() => {
                 let one_dimer = $("#one-dimer").val()
                 let one_at = $("#one-at").val()
@@ -124,13 +136,14 @@
                 return decimal.mul(y, 100).toFixed(PRECISION, Decimal.ROUND_HALF_EVEN)
             }
 
+            // TODO: 解决总杂计算不准的问题
             let func_impurities = (dimer, at, l014_1, all) => {
                 if (dimer == '' || at == '' || l014_1 == '' || all == '') return 0
                 // x = all - dimer - at - l014_1
                 // y = (x / all) * 100
                 // impurities% = y + dimer% + at%
                 let x = decimal.sub(all, dimer).sub(at).sub(l014_1)
-                let y = decimal.div(x, all).mul(100)
+                let y = decimal.div(x, all).mul(100).toFixed(PRECISION)
                 let z = decimal.add(y, func_dimer(dimer, all)).add(func_at(at, all))
                 return z.toFixed(PRECISION, Decimal.ROUND_HALF_EVEN)
             }
@@ -156,12 +169,12 @@
 </head>
 
 <body>
-    <h3>L014-1 相关物质计算</h3>
+    <h3>L014-1 相关物质</h3>
     <strong>* 此功能未经详细测试，计算结果仅供参考。</strong>
 
     <br><br>
-    <label for="precision">计算精度：</label><span id="precision-text">12</span>
-    <input type="range" id="precision" value="12" min="0" max="12">
+    <label for="precision">计算精度：</label><span id="precision-text">3</span>
+    <input type="range" id="precision" value="3" min="0" max="12">
     <div class="one">
         第一组<br>
         <input type="number" name="one-dimer" id="one-dimer" inputmode="numeric" placeholder="2.2-Dimer 峰面积">
diff --git a/L414-5KR-impurities.html b/L414-5KR-impurities.html
index 355dbd2..d38b980 100644
--- a/L414-5KR-impurities.html
+++ b/L414-5KR-impurities.html
@@ -11,27 +11,27 @@
     <script src="./decimal.js"></script>
     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
     <script>
-        var debug = false
+        let debug = false
 
         // 校正因子
-        var F_L414_3 = new Decimal(0.80)
-        var F_L414_5_IM = new Decimal(1.48)
+        let F_L414_3 = new Decimal(0.80)
+        let F_L414_5_IM = new Decimal(1.48)
         // 计算精度
-        var PRECISION = 3
+        let PRECISION = 3
         // 操规允许的最大值
-        var MAX_L414_3 = 0.3
-        var MAX_L414_5_IM = 1.0
-        var MAX_TOTAL_IMPURITIES = 2.0
-        var MIN_PURITY = 98.0
+        let MAX_L414_3 = 0.3
+        let MAX_L414_5_IM = 1.0
+        let MAX_TOTAL_IMPURITIES = 2.0
+        let MIN_PURITY = 98.0
 
 
         // 默认的消息提示
-        var tips = `计算 L414-3、L414-5-IM、杂质总量、纯度`
+        let tips = `计算 L414-3、L414-5-IM、杂质总量、纯度`
 
-        var decimal = Decimal.set({
+        let decimal = Decimal.set({
             rounding: Decimal.ROUND_HALF_EVEN,
             precision: 12
-        });
+        })
 
         $(document).ready(() => {
             let one_all = $("#one-all")
@@ -55,9 +55,9 @@
                 two_all.val(24409434)
             }
 
-            setCheckInputEvent()
             $("#msgbox").html(tips)
             $("#new_page").click(() => window.open(window.location.href, "_BLANK"))
+
             $("#clear").click(() => {
                 one_all.val("")
                 two_all.val("")
@@ -71,6 +71,7 @@
                 $("#msgbox").html(tips)
                 $("#table").hide()
             })
+
             $("#ok").click(() => {
                 let one_414_3_cf = correctionFactor(one_414_3.val(), one_all.val(), F_L414_3)
                 let one_414_5_im_cf = correctionFactor(one_414_5_im.val(), one_all.val(), F_L414_5_IM)
@@ -148,20 +149,6 @@
             $("#purity>#average").html(data.average.purity)
         }
 
-        function setCheckInputEvent() {
-            let checkInput = (event) => {
-                event.target.value = event.target.value.replace(/[\D]/g, '')
-            }
-            $("#one-all").on("input", checkInput)
-            $("#one-414-3").on("input", checkInput)
-            $("#one-414-5-im").on("input", checkInput)
-            $("#one-414-5").on("input", checkInput)
-            $("#two-all").on("input", checkInput)
-            $("#two-414-3").on("input", checkInput)
-            $("#two-414-5-im").on("input", checkInput)
-            $("#two-414-5").on("input", checkInput)
-        }
-
         /**
          * 代入校正因子进行计算
          */
diff --git a/equipment.html b/equipment.html
index 3ee44c6..8d2cc43 100644
--- a/equipment.html
+++ b/equipment.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="zh-CN">
+<html lang="zh-cmn-Hans">
 
 <head>
     <meta charset="UTF-8">
@@ -11,101 +11,101 @@
     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
     <script src="./equipment.info.js"></script>
     <script>
-        $(document).ready(function () {
-            createTable(info);
-            $("#keyword").attr("placeholder", "输入查询关键字（忽略大小写）");
+        $(document).ready(() => {
+            createTable(info)
+            $("#keyword").attr("placeholder", "输入查询关键字（忽略大小写）")
             $("#search").click(() => {
-                var keyword = $("#keyword").val();
+                let keyword = $("#keyword").val()
                 if (keyword == "") {
-                    createTable(info);
-                    return;
+                    createTable(info)
+                    return
                 }
-                var temp = [];
+                let temp = []
                 info.filter(value => {
                     if (value.id.toLowerCase().includes(keyword.toLowerCase()) ||
                         value.name.includes(keyword) ||
                         value.where.includes(keyword) ||
                         value.expir.includes(keyword)) {
-                        temp.push(value);
+                        temp.push(value)
                     }
-                });
+                })
 
-                createTable(temp);
-            });
-        });
+                createTable(temp)
+            })
+        })
 
         // 根据data创建表格
         function createTable(data) {
-            var content = document.getElementById("content");
-            content.innerHTML = "";
-            var table = document.createElement("table");
-            table.setAttribute("style", "font-size: small; width: 100%;");
-            table.setAttribute("class", "pure-table");
+            let content = document.getElementById("content")
+            content.innerHTML = ""
+            let table = document.createElement("table")
+            table.setAttribute("style", "font-size: small; width: 100%;")
+            table.setAttribute("class", "pure-table")
 
             // add header
-            var tr = document.createElement("tr");
-            var th_where = document.createElement("th");
-            var th_name = document.createElement("th");
-            var th_id = document.createElement("th");
-            var th_expir = document.createElement("th");
+            let tr = document.createElement("tr")
+            let th_where = document.createElement("th")
+            let th_name = document.createElement("th")
+            let th_id = document.createElement("th")
+            let th_expir = document.createElement("th")
 
-            th_where.innerText = "位置";
-            th_name.innerText = "名称";
-            th_id.innerText = "编号";
-            th_expir.innerText = "有效期至";
-            tr.appendChild(th_where);
-            tr.appendChild(th_name);
-            tr.appendChild(th_id);
-            tr.appendChild(th_expir);
-            table.appendChild(tr);
+            th_where.innerText = "位置"
+            th_name.innerText = "名称"
+            th_id.innerText = "编号"
+            th_expir.innerText = "有效期至"
+            tr.appendChild(th_where)
+            tr.appendChild(th_name)
+            tr.appendChild(th_id)
+            tr.appendChild(th_expir)
+            table.appendChild(tr)
 
             // add contents
-            data.forEach(function (value) {
-                var tr = document.createElement("tr");
-                var td_where = document.createElement("td");
-                var td_name = document.createElement("td");
-                var td_id = document.createElement("td");
-                var td_expir = document.createElement("td");
+            data.forEach((value) => {
+                let tr = document.createElement("tr")
+                let td_where = document.createElement("td")
+                let td_name = document.createElement("td")
+                let td_id = document.createElement("td")
+                let td_expir = document.createElement("td")
 
-                td_where.innerText = value.where;
-                td_name.innerText = value.name;
-                td_id.innerText = value.id;
-                td_expir.innerHTML = expir(value.expir);
+                td_where.innerText = value.where
+                td_name.innerText = value.name
+                td_id.innerText = value.id
+                td_expir.innerHTML = expir(value.expir)
 
-                tr.appendChild(td_where);
-                tr.appendChild(td_name);
-                tr.appendChild(td_id);
-                tr.appendChild(td_expir);
-                table.appendChild(tr);
-            });
+                tr.appendChild(td_where)
+                tr.appendChild(td_name)
+                tr.appendChild(td_id)
+                tr.appendChild(td_expir)
+                table.appendChild(tr)
+            })
 
-            content.appendChild(table);
-            let num = document.createElement("span");
-            num.innerText = "共 " + data.length + " 条记录";
-            content.appendChild(num);
+            content.appendChild(table)
+            let num = document.createElement("span")
+            num.innerText = `共 ${data.length} 条记录`
+            content.appendChild(num)
         }
 
         // 设置日期样式
         function expir(value) {
-            var date = new Date();
-            var array = value.split(".");
-            date.setFullYear(array[0], array[1] - 1, array[2]);
+            let date = new Date()
+            let array = value.split(".")
+            date.setFullYear(array[0], array[1] - 1, array[2])
 
-            var day = (date - Date.now()) / 86400000;
+            let day = (date - Date.now()) / 86400000
 
             if (day <= 0) {
-                return "<span style='color: red;'><s>" + value + "</s></span><br>" + day + "天";
+                return `<span style='color: red;'><s>${value}</s></span>`
             }
 
             if (day <= 7) {
-                return "<span style='color: red;'>" + value + "</span><br>" + day + "天";
+                return `<span style='color: red;'>${value}</span>`
             }
 
             if (day <= 30) {
-                return "<span style='color: darkorange;'>" + value + "</span><br>" + day + "天";
+                return `<span style='color: darkorange;'>${value}</span>`
             }
 
-            return value;
+            return value
         }
     </script>
 </head>
diff --git a/index.html b/index.html
index f87f51e..ceae77d 100644
--- a/index.html
+++ b/index.html
@@ -8,7 +8,8 @@
     <link rel="stylesheet" href="./theme.css">
     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
     <script>
-        let url = "https://api.github.com/repos/hbk01/hbk01.github.io/commits?per_page=10";
+        let page = 10
+        let url = `https://api.github.com/repos/hbk01/hbk01.github.io/commits?per_page=${page}`
 
         let functions = [
             {
@@ -32,22 +33,22 @@
                 "location": "./equipment.html"
             },
             {
-                "name": "L414-5KR 相关物质计算",
+                "name": "L414-5KR 相关物质",
                 "location": "./L414-5KR-impurities.html"
             },
             {
-                "name": "L014-1 相关物质计算",
+                "name": "L014-1 相关物质",
                 "location": "./L014-1-impurities.html"
             }
-        ];
+        ]
 
         $(document).ready(() => {
             // var getRandomColor = () => '#' + (Math.random() * 0xffffff << 0).toString(16)
             // 加载功能列表
             functions.forEach(value => {
-                let div = `<div class="item" onclick="window.location.href='${value.location}'">${value.name}</div>`;
-                $(".list").append(div);
-            });
+                let div = `<div class="item" onclick="window.location.href='${value.location}'">${value.name}</div>`
+                $(".list").append(div)
+            })
 
             // 加载最近的 commit 记录
             $.getJSON(url, data => {
@@ -55,34 +56,35 @@
                 let color2 = '#f3f3f3'
                 let changeColor = false
                 data.forEach(element => {
-                    let hash = element.sha.slice(0, 7)
-                    let verified = element.commit.verification.verified
-                    let html_url = element.html_url
-
                     // 处理换行和+号
-                    let message = element.commit.message.replaceAll("\n", "<br>");
+                    let message = element.commit.message.replaceAll("\n", "<br>")
                     if (message.startsWith("+")) {
-                        message = message.replace("+", "<br>&nbsp;&nbsp;<strong>&bull;</strong>");
+                        message = message.replace("+", "<br>&nbsp;&nbsp;<strong>&bull;</strong>")
                     }
                     message = message.replaceAll("+", "&nbsp;&nbsp;<strong>&bull;</strong>")
 
+                    // 处理提交的日期
                     let date = new Date(element.commit.committer.date) // "2022-10-08T10:54:36Z"
-                    date = new Date(+ new Date(date) + 28800000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '')
+                    date = new Date(+ new Date(date) + 28800000).toISOString()
+                    date = date.replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '')
+
+                    // 组装标题信息
+                    let verifiedString = "<span style='color: green;'><strong>Verified</strong></span>"
+                    let hash = `<a href='${element.html_url}'>${element.sha.slice(0, 7)}</a>`
+                    let verified = `${element.commit.verification.verified ? verifiedString : ""}`
+                    let header = `${hash} ${date} ${verified}`
 
                     changeColor = !changeColor
-                    let header = `
-                    ${date}
-                    (<a href='${html_url}'>${hash}</a>${verified ? ", <span style='color: green'><strong>Verified</strong></span>" : ""})`
-
+                    let color = `${changeColor ? color1 : color2}`
                     let msg = `
-                    <div style="background-color: ${changeColor ? color1 : color2}; padding: 5px 0px 5px 10px">
+                    <div style="background-color: ${color}; padding: 5px 0px 5px 10px">
                         ${header}
                         ${message}
                     </div>`
-                    $(".changelog").append(msg);
-                });
-            });
-        });
+                    $(".changelog").append(msg)
+                })
+            })
+        })
     </script>
     <title>QC TOOL</title>
 </head>
diff --git a/injection-sequence.html b/injection-sequence.html
index 2c46fff..eaee322 100644
--- a/injection-sequence.html
+++ b/injection-sequence.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="zh-CN">
+<html lang="zh-cmn-Hans">
 
 <head>
     <meta charset="UTF-8">
@@ -11,104 +11,95 @@
     <script src="./decimal.js"></script>
     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
     <script>
-        var decimal = Decimal.set(
-            {
-                rounding: Decimal.ROUND_HALF_EVEN,
-                precision: 12
-            }
-        );
-        $(document).ready(function () {
-            var output = document.getElementById("output");
-            //
-            var tip = "计算每一针走完的时间。<br>"
-                + "设置时间提前量可以将每针的时间提前，用于给看样及配样等操作留时间。";
-            output.innerHTML = tip;
+        let decimal = Decimal.set({
+            rounding: Decimal.ROUND_HALF_EVEN,
+            precision: 12
+        })
+        $(document).ready(() => {
+            let tip = `
+            计算每一针走完的时间。<br>
+            设置时间提前量可以将每针的时间提前，用于给看样及配样等操作留时间。`
+            $("#output").append(tip)
 
-            $("#ok").click(function () {
-                $("#output").empty();
-                var time = document.getElementById("time").value;
-                var num = document.getElementById("num").value;
-                var ptime = document.getElementById("ptime").value;
-                var stime = document.getElementById("stime").value;
-                var data = [];
+            $("#ok").click(() => {
+                let time = $("#time").val()
+                let num = $("#num").val()
+                let ptime = $("#ptime").val()
+                let stime = $("#stime").val()
+                let data = []
 
                 // 生成数据
-                for (var i = 1; i <= num; i++) {
-                    var t = InjectionSequenceToDate(time, ptime, stime, i);
+                for (let i = 1; i <= num; i++) {
+                    let t = injectionSequenceToDate(time, ptime, stime, i)
                     data.push({
                         "id": i,
                         "time": t
-                    });
+                    })
                 }
 
-                if (data.length == 0) {
-                    // 未生成数据，不进行结果展示
-                    return;
-                }
-                output.appendChild(createTable(data));
-            });
+                // 未生成数据，不进行结果展示
+                if (data.length == 0) return
+                $("#output").empty()
+                $("#output").append(createTable(data))
+            })
 
 
-            $("#clear").click(function () {
-                time.value = "";
-                num.value = "";
-                ptime.value = "";
-                stime.value = "";
-                $("#output").empty();
-            });
+            $("#clear").click(() => {
+                $("#time").val("")
+                $("#num").val("")
+                $("#ptime").val("")
+                $("#stime").val("")
+                $("#output").empty()
+                $("#output").append(tip)
+            })
 
-            $("#new_page").click(function () {
-                window.open(window.location.href, "_blank");
-            });
-        });
+            $("#new_page").click(() => {
+                window.open(window.location.href, "_blank")
+            })
+        })
 
         /**
          * 计算进样时间，返回 yyyy-MM-dd hh:mm 格式的字符串
          */
-        function InjectionSequenceToDate(time, ptime, stime, num) {
-            var t = InjectionSequence(time, ptime, stime, num);
-            var t_hour = Math.floor(Math.abs(t) / 60);
-            var t_min = t % 60;
-            var date = new Date();
-            var dateAfter = new Date(date.getFullYear(), date.getMonth(), date.getDate(),
-                date.getHours() + t_hour, date.getMinutes() + t_min).format("yyyy-MM-dd hh:mm");
-            return dateAfter;
+        function injectionSequenceToDate(time, ptime, stime, num) {
+            let t = injectionSequence(time, ptime, stime, num)
+            let t_hour = Math.floor(Math.abs(t) / 60)
+            let t_min = t % 60
+            let date = new Date()
+            let dateAfter = new Date(date.getFullYear(), date.getMonth(), date.getDate(),
+                date.getHours() + t_hour, date.getMinutes() + t_min).format("yyyy-MM-dd hh:mm")
+            return dateAfter
         }
 
         /**
          * 创建表格元素并将数据填入其中。
          */
         function createTable(data) {
-            var table = document.createElement("table");
-            table.setAttribute("style", "width: 100%;");
-            table.setAttribute("class", "pure-table");
+            let table = document.createElement("table")
+            table.setAttribute("style", "width: 100%; text-align: center;")
+            table.setAttribute("class", "pure-table")
 
-            var row = document.createElement("tr");
-            var th1 = document.createElement("th");
-            var th2 = document.createElement("th");
-            th1.innerText = "第几针";
-            th2.innerText = "进样时间";
-            row.appendChild(th1);
-            row.appendChild(th2);
-            table.appendChild(row);
+            let row = document.createElement("tr")
+            let th1 = document.createElement("th")
+            let th2 = document.createElement("th")
+            th1.innerText = "第几针"
+            th2.innerText = "进样时间"
+            row.appendChild(th1)
+            row.appendChild(th2)
+            table.appendChild(row)
             data.forEach(element => {
-                var tr = document.createElement("tr");
+                let tr = document.createElement("tr")
+                let td_id = document.createElement("td")
+                let td_time = document.createElement("td")
 
-                if (element.id % 2 == 1) {
-                    tr.className = "pure-table-odd";
-                }
+                td_id.innerText = element.id
+                td_time.innerText = element.time
 
-                var td_id = document.createElement("td");
-                var td_time = document.createElement("td");
-
-                td_id.innerText = element.id;
-                td_time.innerText = element.time;
-
-                tr.appendChild(td_id);
-                tr.appendChild(td_time);
-                table.appendChild(tr);
-            });
-            return table;
+                tr.appendChild(td_id)
+                tr.appendChild(td_time)
+                table.appendChild(tr)
+            })
+            return table
         }
 
         /**
@@ -118,37 +109,35 @@
          * @param stime 现在这针运行多少分钟
          * @param num 计算第n针后的时间
          */
-        function InjectionSequence(time, ptime, stime, num) {
+        function injectionSequence(time, ptime, stime, num) {
             // formal: InjectionSequence = time * num - ptime - stime
-            var t = new Decimal(time);
-            var p = new Decimal(ptime);
-            var s = new Decimal(stime);
-            var n = new Decimal(num);
-
-            var time = decimal.mul(t, n).sub(p).sub(s);
-            return time.toString();
+            let t = new Decimal(time)
+            let p = new Decimal(ptime)
+            let s = new Decimal(stime)
+            let n = new Decimal(num)
+            return decimal.mul(t, n).sub(p).sub(s).toString()
         }
 
         // 为 Date 创建日期格式化方法
         Date.prototype.format = function (fmt) {
-            var o = {
-                "M+": this.getMonth() + 1,                 //月份
-                "d+": this.getDate(),                    //日
-                "h+": this.getHours(),                   //小时
-                "m+": this.getMinutes(),                 //分
-                "s+": this.getSeconds(),                 //秒
+            let o = {
+                "M+": this.getMonth() + 1,                   //月份
+                "d+": this.getDate(),                        //日
+                "h+": this.getHours(),                       //小时
+                "m+": this.getMinutes(),                     //分
+                "s+": this.getSeconds(),                     //秒
                 "q+": Math.floor((this.getMonth() + 3) / 3), //季度
-                "S": this.getMilliseconds()             //毫秒
-            };
-            if (/(y+)/.test(fmt)) {
-                fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
+                "S": this.getMilliseconds()                  //毫秒
             }
-            for (var k in o) {
+            if (/(y+)/.test(fmt)) {
+                fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length))
+            }
+            for (let k in o) {
                 if (new RegExp("(" + k + ")").test(fmt)) {
-                    fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
+                    fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)))
                 }
             }
-            return fmt;
+            return fmt
         }
 
     </script>
diff --git a/lod.html b/lod.html
index db9df94..3e496b3 100644
--- a/lod.html
+++ b/lod.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="zh_CN">
+<html lang="zh-cmn-Hans">
 
 <head>
     <meta charset="UTF-8">
@@ -10,10 +10,11 @@
     <link rel="stylesheet" href="./theme.css">
     <script src="./decimal.js"></script>
     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
-    <script>
-        var debug = false
-        var localStorageSupport = storageAvailable("localStorage")
-        var tip = `
+    <script type="module">
+        import { IO } from './modules/tools.js'
+        let io = new IO('lod')
+        let debug = false
+        let tip = `
 <br>
 操作过程：
 <br>
@@ -27,26 +28,16 @@
 恢复：输入或选择样品批号，点击恢复，此时将读取对应数据并自动填入输入框。
 <br>
 删除：输入或选择样品批号，点击删除，此时将从已存储的数据中删除对应数据。
-<br>
-若保存、恢复、删除按钮均未显示，则表明您的浏览器不支持此功能。
 `
 
-        var decimal = Decimal.set({
+        let decimal = Decimal.set({
             rounding: Decimal.ROUND_HALF_EVEN,
             precision: 12
         })
 
         $(document).ready(() => {
             $(".msgbox").append(tip)
-
-            if (!localStorageSupport) {
-                $("#remove").hide()
-                $("#restore").hide()
-                $("#save").hide()
-                $("#lod-name").removeAttr("list")
-            }
-
-            if (localStorageSupport) loadSavedContentsList()
+            loadSavedContentsList()
 
             // 若有前面页面的传值，则导入传入的值
             if (window.location.search.startsWith('?data')) {
@@ -70,10 +61,15 @@
                 // TODO 可能干燥失重不应该使用 RSD 值来判断是否平行，可尝试使用 RD 或 RAD 判断
                 // let rsd = RSD(lod1, lod2)
 
+                let format = (value) => {
+                    if (value <= 0) return `<span style="color: red;">${value}</span>`
+                    return value
+                }
+
                 var msg = `
-第一组干燥失重 = ${lod1 <= 0 ? `<span style='color: red;'>${lod1}</span>` : lod1}<br>
-第二组干燥失重 = ${lod2 <= 0 ? `<span style='color: red;'>${lod2}</span>` : lod2}<br>
-两组干燥失重平均值 = ${average}<br>
+第一组干燥失重 = ${format(lod1)}<br>
+第二组干燥失重 = ${format(lod2)}<br>
+两组干燥失重平均值 = ${format(average)}<br>
 ${m0l != '' && m1l != '' ? `第一组恒重后空瓶+样 = ${decimal.add(m0l, m1l).toString()}` : ''}<br>
 ${m0r != '' && m1r != '' ? `第二组恒重后空瓶+样 = ${decimal.add(m0r, m1r).toString()}` : ''}<br>
 `
@@ -108,10 +104,8 @@ ${m0r != '' && m1r != '' ? `第二组恒重后空瓶+样 = ${decimal.add(m0r, m1
                     return
                 }
 
-                // save data to localStorage
                 let lod = exportData()
-                lod['time'] = Date.now()
-                localStorage.setItem(id, JSON.stringify(lod))
+                io.write(id, JSON.stringify(lod))
                 loadSavedContentsList()
             })
 
@@ -122,7 +116,7 @@ ${m0r != '' && m1r != '' ? `第二组恒重后空瓶+样 = ${decimal.add(m0r, m1
                     return
                 }
 
-                let lod = JSON.parse(localStorage.getItem(id))
+                let lod = JSON.parse(io.read(id))
                 $("#m0l").val(lod.m0l)
                 $("#m1l").val(lod.m1l)
                 $("#m3l").val(lod.m3l)
@@ -138,9 +132,8 @@ ${m0r != '' && m1r != '' ? `第二组恒重后空瓶+样 = ${decimal.add(m0r, m1
                     return
                 }
                 if (confirm("确认删除 " + id + " 的数据？")) {
-                    localStorage.removeItem(id)
+                    io.remove(id)
                     loadSavedContentsList()
-                    $("#lod-name").val("")
                     $("#clear").click()
                 }
             })
@@ -158,6 +151,7 @@ ${m0r != '' && m1r != '' ? `第二组恒重后空瓶+样 = ${decimal.add(m0r, m1
         // 需要传递给新页面的数据
         function exportData() {
             let data = {
+                "time": Date.now(),
                 "id": $("#lod-name").val(),
                 "m0l": $("#m0l").val(),
                 "m1l": $("#m1l").val(),
@@ -241,14 +235,9 @@ ${m0r != '' && m1r != '' ? `第二组恒重后空瓶+样 = ${decimal.add(m0r, m1
 
         function loadSavedContentsList() {
             // load data from localStorage to input.
-            let keys = []
-            $("#keys").empty()
-            for (const key in localStorage) {
-                if (Object.hasOwnProperty.call(localStorage, key)) keys.push(key)
-            }
-            keys.sort()
+            let keys = io.listKeys().sort()
             keys.forEach(key => {
-                let timestamp = JSON.parse(localStorage.getItem(key)).time
+                let timestamp = JSON.parse(io.read(key)).time
                 let time = new Date(timestamp).format("yyyy-MM-dd hh:mm")
                 let option = document.createElement("option")
                 $(option).attr("value", key)
diff --git a/modules/tools.js b/modules/tools.js
new file mode 100644
index 0000000..5838927
--- /dev/null
+++ b/modules/tools.js
@@ -0,0 +1,34 @@
+class IO {
+    constructor(scope) {
+        this.scope = scope
+    }
+
+    read(id) {
+        let key = `${this.scope}/${id}`
+        return localStorage.getItem(key)
+    }
+
+    write(id, data) {
+        let key = `${this.scope}/${id}`
+        localStorage.setItem(key, data)
+    }
+
+    remove(id) {
+        let key = `${this.scope}/${id}`
+        localStorage.removeItem(key)
+    }
+
+    listKeys() {
+        let keys = []
+        for (const key in localStorage) {
+            if (Object.hasOwnProperty.call(localStorage, key) &&
+                key.startsWith(this.scope)) {
+                    let i = key.indexOf('/') + 1
+                keys.push(key.slice(i))
+            }
+        }
+        return keys
+    }
+}
+
+export { IO }
diff --git a/roi.html b/roi.html
index d5169f6..6439c9f 100644
--- a/roi.html
+++ b/roi.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="zh_CN">
+<html lang="zh-cmn-Hans">
 
 <head>
     <meta charset="UTF-8">
@@ -10,97 +10,114 @@
     <link rel="stylesheet" href="./theme.css">
     <script src="./decimal.js"></script>
     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
-    <script>
-        var debug = false;
-        var tip = `
+    <script type="module">
+        import { IO } from './modules/tools.js'
+
+        let io = new IO('roi')
+        let decimal = Decimal.set({
+            rounding: Decimal.ROUND_HALF_EVEN,
+            precision: 12
+        })
+        let debug = false
+
+        let tip = `
 <br>
 操作过程：
-空坩埚 -> 灼烧3小时 -> 冷却称重 -> 灼烧0.5小时 -> 冷却称重(1) -> 加样(2) -> 烧至无烟 -> 灼烧1小时 -> 冷却称重 -> 灼烧0.5小时 -> 冷却称重(3)
+空坩埚 -> 灼烧3小时 -> 冷却称重 -> 灼烧0.5小时 -> 冷却称重(1)
+-> 加样(2) -> 烧至无烟 -> 灼烧1小时 -> 冷却称重 -> 灼烧0.5小时 -> 冷却称重(3)
 <br>
-<br>
-`;
-
-        var decimal = Decimal.set(
-            {
-                rounding: Decimal.ROUND_HALF_EVEN,
-                precision: 12
-            }
-        );
-
-
-        $(document).ready(function () {
-            var input_m0l = document.getElementById("m0l");
-            var input_m1l = document.getElementById("m1l");
-            var input_m3l = document.getElementById("m3l");
-            var input_m0r = document.getElementById("m0r");
-            var input_m1r = document.getElementById("m1r");
-            var input_m3r = document.getElementById("m3r");
+`
 
+        $(document).ready(() => {
             $(".msgbox").append(tip)
+            loadSavedContentsList()
 
-            $("#ok").click(function () {
-                var m0l = input_m0l.value;
-                var m1l = input_m1l.value;
-                var m3l = input_m3l.value;
+            $("#ok").click(() => {
+                let m0l = $("#m0l").val()
+                let m1l = $("#m1l").val()
+                let m3l = $("#m3l").val()
+                let m0r = $("#m0r").val()
+                let m1r = $("#m1r").val()
+                let m3r = $("#m3r").val()
 
-                var m0r = input_m0r.value;
-                var m1r = input_m1r.value;
-                var m3r = input_m3r.value;
+                let lod1 = roi(m0l, m1l, m3l)
+                let lod2 = roi(m0r, m1r, m3r)
+                let average = decimal.add(lod1, lod2).div(2).toString()
 
-                var lod1 = lod(m0l, m1l, m3l)
-                var lod2 = lod(m0r, m1r, m3r)
-                var average = decimal.add(lod1, lod2).div(2).toString();
-
-                var msg = `
-<br>
-第一组炽灼残渣 = ${lod1 <= 0 ? '<span style="color: red;">' + lod1 + '</span>' : lod1}
-<br>
-第二组炽灼残渣 = ${lod2 <= 0 ? '<span style="color: red;">' + lod2 + '</span>' : lod2}
-<br>
-两组炽灼残渣平均值 = ${average <= 0 ? '<span style="color: red;">' + average + '</span>' : average}
-<br>
-`;
-
-                if (m0l != '' && m1l != '') {
-                    msg += "第一组恒重后空坩埚+样 = " + decimal.add(m0l, m1l).toString() + "<br>";
+                let format = (value) => {
+                    if (value <= 0) return `<span style="color: red;">${value}</span>`
+                    return value
                 }
 
-                if (m0r != '' && m1r != '') {
-                    msg += "第二组恒重后空坩埚+样 = " + decimal.add(m0r, m1r).toString() + "<br>";
+                let msg = `
+                <br> 第一组炽灼残渣 = ${format(lod1)}
+                <br> 第二组炽灼残渣 = ${format(lod2)}
+                <br> 两组炽灼残渣平均值 = ${format(average)}
+                <br> 第一组恒重后空坩埚+样 = ${checkNull(m0l, m1l, '0') ? '0' : decimal.add(m0l, m1l).toString()}
+                <br> 第二组恒重后空坩埚+样 = ${checkNull(m0r, m1r, '0') ? '0' : decimal.add(m0r, m1r).toString()}
+`
+                message(msg)
+            })
+
+            $("#clear").click(() => {
+                if (!window.confirm("所填写的数据将被清空，确定？")) return
+
+                $("#roi-name").val('')
+                $("#m0l").val('')
+                $("#m1l").val('')
+                $("#m3l").val('')
+                $("#m0r").val('')
+                $("#m1r").val('')
+                $("#m3r").val('')
+                message(tip)
+            })
+
+            $("#new_page").click(() => {
+                window.open(window.location.href, "_blank")
+            })
+
+            $("#remove").click(() => {
+                let id = $("#roi-name").val()
+                if (id.length == 0) {
+                    confirm("请输入或选择样品批号！")
+                    return
                 }
+                io.remove(id)
+                loadSavedContentsList()
+            })
 
-                message(msg);
-            });
-
-            $("#clear").click(function () {
-                var confirm = window.confirm("所填写的数据(不包括批号)将被清空，确定？");
-                if (!confirm) {
-                    return;
+            $("#restore").click(() => {
+                let id = $("#roi-name").val()
+                if (id.length == 0) {
+                    confirm("请输入或选择样品批号！")
+                    return
                 }
-                input_m0l.value = "";
-                input_m1l.value = "";
-                input_m3l.value = "";
-                input_m0r.value = "";
-                input_m1r.value = "";
-                input_m3r.value = "";
+                let data = io.read(id)
+                let roi = JSON.parse(data)
+                importData(roi)
+            })
 
-                message(tip);
-            });
-
-            $("#new_page").click(function () {
-                window.open(window.location.href, "_blank");
-            });
+            $("#save").click(() => {
+                let id = $("#roi-name").val()
+                if (id.length == 0) {
+                    confirm("请输入或选择样品批号！")
+                    return
+                }
+                let data = JSON.stringify(exportData())
+                io.write(id, data)
+                loadSavedContentsList()
+            })
 
             if (debug) {
-                document.getElementById("m0l").value = 18.34625;
-                document.getElementById("m1l").value = 1.04213;
-                document.getElementById("m3l").value = 19.38511;
+                document.getElementById("m0l").value = 18.34625
+                document.getElementById("m1l").value = 1.04213
+                document.getElementById("m3l").value = 19.38511
             }
-        });
+        })
 
         function message(msg) {
-            $(".msgbox").empty();
-            $(".msgbox").append(msg);
+            $(".msgbox").empty()
+            $(".msgbox").append(msg)
         }
 
         /**
@@ -110,31 +127,87 @@
          * @param m3 干燥恒重后带样品重
          * @return 炽灼残渣（%）
          */
-        function lod(m0, m1, m3) {
-            if (checkNull(m0, m1, m3)) {
-                return "0";
-            }
+        function roi(m0, m1, m3) {
+            if (checkNull(m0, m1, m3)) return "0"
 
-            var a = new Decimal(m0);
-            var b = new Decimal(m1);
-            var c = new Decimal(m3);
+            let a = new Decimal(m0)
+            let b = new Decimal(m1)
+            let c = new Decimal(m3)
 
             // m3 - m0 / m1 * 100
-            var d = decimal.sub(c, a)
-            var e = d.div(b).mul(100);
-            return e.toString();
+            let d = decimal.sub(c, a)
+            let e = d.div(b).mul(100)
+            return e.toString()
         }
 
         function checkNull(m0, m1, m3) {
-            return m0 == '' || m1 == '' || m3 == '';
+            return m0 == '' || m1 == '' || m3 == ''
         }
 
+        function loadSavedContentsList() {
+            // load data from localStorage to input.
+            let keys = io.listKeys()
+            keys.forEach(key => {
+                let timestamp = JSON.parse(io.read(key)).time
+                let time = new Date(timestamp).format("yyyy-MM-dd hh:mm")
+                let option = document.createElement("option")
+                $(option).attr("value", key)
+                $(option).attr("label", `保存于 ${time}`)
+                $("#keys").append(option)
+            })
+        }
+
+        // 为 Date 创建日期格式化方法
+        Date.prototype.format = function (fmt) {
+            let o = {
+                "M+": this.getMonth() + 1,                      //月份
+                "d+": this.getDate(),                           //日
+                "h+": this.getHours(),                          //小时
+                "m+": this.getMinutes(),                        //分
+                "s+": this.getSeconds(),                        //秒
+                "q+": Math.floor((this.getMonth() + 3) / 3),    //季度
+                "S": this.getMilliseconds()                     //毫秒
+            }
+            if (/(y+)/.test(fmt)) {
+                fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length))
+            }
+            for (var k in o) {
+                if (new RegExp("(" + k + ")").test(fmt)) {
+                    fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)))
+                }
+            }
+            return fmt
+        }
+
+        function importData(data) {
+            $("#roi-name").val(data.id)
+            $("#m0l").val(data.m0l)
+            $("#m1l").val(data.m1l)
+            $("#m3l").val(data.m3l)
+            $("#m0r").val(data.m0r)
+            $("#m1r").val(data.m1r)
+            $("#m3r").val(data.m3r)
+        }
+
+        function exportData() {
+            let data = {
+                "time": Date.now(),
+                "id": $("#roi-name").val(),
+                "m0l": $("#m0l").val(),
+                "m1l": $("#m1l").val(),
+                "m3l": $("#m3l").val(),
+                "m0r": $("#m0r").val(),
+                "m1r": $("#m1r").val(),
+                "m3r": $("#m3r").val(),
+            }
+            return data
+        }
     </script>
 </head>
 
 <body>
     <h3>炽灼残渣</h3>
-    <input type="text" name="lod-name" id="lod-name" placeholder="样品批号"><br><br>
+    <input type="text" name="roi-name" id="roi-name" list="keys" placeholder="样品批号"><br><br>
 
     <div class="one-team">
         第一组<br>
@@ -158,9 +231,14 @@
         <button id="new_page">新开标签页</button>
         <button id="clear">清除内容</button>
         <button id="ok">计算</button>
+
+        <button id="remove">删除</button>
+        <button id="restore">恢复</button>
+        <button id="save">保存</button>
     </div>
 
     <div class="msgbox"></div>
+    <datalist id="keys"></datalist>
 
 </body>
 
diff --git a/titer.html b/titer.html
index 25141fa..1abf841 100644
--- a/titer.html
+++ b/titer.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="zh_CN">
+<html lang="zh-cmn-Hans">
 
 <head>
     <meta charset="UTF-8">
@@ -11,67 +11,58 @@
     <script src="./decimal.js"></script>
     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
     <script>
-        var debug = false;
-        var tip = "<br>" +
-            "请输入三次 F 值" +
-            "<br>" +
-            "公式：" +
-            "<br>" +
-            "F' = AVERAGE(F1, F2, F3)" + "<br>" +
-            "RDx = [ Fx - F' ] / F' * 100";
-        var decimal = Decimal.set(
-            {
-                rounding: Decimal.ROUND_HALF_EVEN,
-                precision: 12
-            }
-        );
+        let debug = false
+        let tip = `<br>
+        请输入三次 F 值<br>
+        公式：<br>
+        F' = AVERAGE(F1, F2, F3)<br>
+        RDx = [ Fx - F' ] / F' * 100`
 
+        let decimal = Decimal.set({
+            rounding: Decimal.ROUND_HALF_EVEN,
+            precision: 12
+        })
 
-        $(document).ready(function () {
-            var input_m0 = document.getElementById("m0");
-            var input_m1 = document.getElementById("m1");
-            var input_m2 = document.getElementById("m2");
-
+        $(document).ready(() => {
             $(".msgbox").append(tip)
 
-            $("#ok").click(function () {
-                var m0 = input_m0.value;
-                var m1 = input_m1.value;
-                var m2 = input_m2.value;
+            $("#ok").click(() => {
+                let m0 = $("#m0").val()
+                let m1 = $("#m1").val()
+                let m2 = $("#m2").val()
+                f = average(m0, m1, m2)
 
-                f = average(m0, m1, m2);
+                let msg = `
+                    <br>
+                    F值平均值 = ${f}<br>
+                    RD1 = ${titer(f, m0)}<br>
+                    RD2 = ${titer(f, m1)}<br>
+                    RD3 = ${titer(f, m2)}<br>
+                `
+                message(msg)
+            })
 
-                var msg = "<br>" +
-                    "F值平均值 = " + f + "<br>" +
-                    "RD1 = " + titer(f, m0) + "<br>" +
-                    "RD2 = " + titer(f, m1) + "<br>" +
-                    "RD3 = " + titer(f, m2) + "<br>";
+            $("#clear").click(() => {
+                $("#m0").val("")
+                $("#m1").val("")
+                $("#m2").val("")
+                message(tip)
+            })
 
-                message(msg);
-            });
-
-            $("#clear").click(function () {
-                input_m0.value = "";
-                input_m1.value = "";
-                input_m2.value = "";
-
-                message(tip);
-            });
-
-            $("#new_page").click(function () {
-                window.open(window.location.href, "_blank");
-            });
+            $("#new_page").click(() => {
+                window.open(window.location.href, "_blank")
+            })
 
             if (debug) {
-                document.getElementById("m0").value = 2;
-                document.getElementById("m1").value = 3;
-                document.getElementById("m2").value = 4;
+                $("#m0").val(2)
+                $("#m1").val(3)
+                $("#m2").val(4)
             }
-        });
+        })
 
         function message(msg) {
-            $(".msgbox").empty();
-            $(".msgbox").append(msg);
+            $(".msgbox").empty()
+            $(".msgbox").append(msg)
         }
 
         /**
@@ -81,16 +72,16 @@
          */
         function titer(f, m) {
             temp = decimal.sub(m, f)
-            return temp.div(f).mul(100);
+            return temp.div(f).mul(100)
         }
 
         function average(a, b, c) {
-            var sum = Decimal(a).add(Decimal(b)).add(Decimal(c));
-            return decimal.div(sum, 3);
+            let sum = Decimal(a).add(Decimal(b)).add(Decimal(c))
+            return decimal.div(sum, 3)
         }
 
         function checkNull(m0, m1, m2) {
-            return m0 == '' || m1 == '' || m2 == '';
+            return m0 == '' || m1 == '' || m2 == ''
         }
 
     </script>