hbk01/qctool
1
0
Fork 0
Code Issues Pull Requests Activity

+ 常用操作规程更名为操作规程

Browse Source 
+ 首页功能列表增加高度以防止误触
+ 添加设置页面
+ 删除 L014-1 与 L414-5KR 相关物质计算页面
This commit is contained in:
艾志坚
2023-04-19 03:59:52 +08:00
parent d45bd30dd7
commit 47c81f9efb
7 changed files with 284 additions and 592 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
index.html
View File

@@ -7,8 +7,12 @@
<link rel="stylesheet" href="./statics/github.css">
<link rel="stylesheet" href="./statics/theme.css">
<script src="./statics/modules/jquery.min.js"></script>
<script>
let page = 10
<script type="module">
import { IO } from "./statics/modules/tools.js"
let settings = new IO('settings')
let num = settings.read("index.history.num")
let page = num == null ? 10 : num
let url = `https://api.github.com/repos/hbk01/hbk01.github.io/commits?per_page=${page}`
let functions = [
@@ -33,27 +37,53 @@
"location": "./views/expir-info.html"
},
{
"name": "常用操作规程",
"location": "./views/common-sop.html"
"name": "操作规程",
"location": "./views/sop.html"
}
// {
// "name": "L414-5KR 相关物质",
// "location": "./views/L414-5KR-impurities.html"
// },
// {
// "name": "L014-1 相关物质",
// "location": "./views/L014-1-impurities.html"
// }
]
$(document).ready(() => {
// var getRandomColor = () => '#' + (Math.random() * 0xffffff << 0).toString(16)
$(() => {
// 检查是否已初始化设置
let init = settings.read("settings.initialized")
if (init != "true") {
// 移除所有项目
settings.listKeys().forEach(key => {
settings.remove(key)
})
// 云端获取默认设置并写入
$.getJSON("../statics/settings.json", (data) => {
for (const iterator of data) {
settings.write(iterator.id, iterator.default)
settings.write(`${iterator.id}.desc`, iterator.description)
}
// 写入完成后重新加载页面，以应用当前设置
window.location.reload()
})
}
let hidden = settings.read("index.functions.hidden")
hidden = hidden == "" ? [] : hidden.split(',')
// 加载功能列表
functions.forEach(value => {
for (const iterator of hidden) {
if (value.location.endsWith(iterator)) {
return
}
}
let div = `<div class="item" onclick="window.location.href='${value.location}'">${value.name}</div>`
$(".list").append(div)
})
let show = settings.read("index.history.enable")
if (show == "false") {
$("#changelog_title").hide()
return
}
// 加载最近的 commit 记录
$.getJSON(url, data => {
let color1 = '#f9f9f9'
@@ -94,7 +124,7 @@
</head>
<body>
<h4>功能列表</h4>
<h4 onclick="window.location.href='./views/settings.html'">功能列表</h4>
<div class="list"></div>
<h4>关于</h4>
<div class="about">
@@ -103,7 +133,7 @@
<a href="https://github.com/hbk01/hbk01.github.io">Github</a> ，并由
<a href="https://docs.github.com/en/pages">Github Pages</a> 提供页面构建及部署服务。
</div>
<h4>变更日志</h4>
<h4 id="changelog_title">变更日志</h4>
<div class="changelog" style="width: 100%;"></div>
</body>

36
statics/settings.json Normal file
View File

@@ -0,0 +1,36 @@
[
{
"id": "settings.initialized",
"group": "settings",
"title": "是否已经初始化",
"description": "指示初始化状态，请勿更改此项",
"type": "boolean",
"default": true
},
{
"id": "index.history.enable",
"group": "index.html",
"title": "显示变更日志",
"description": "若设置为 false ，则不显示变更日志",
"type": "boolean",
"default": true
},
{
"id": "index.history.num",
"group": "index.html",
"title": "日志显示数量",
"description": "要显示多少条变更日志",
"type": "number",
"default": 10
},
{
"id": "index.functions.hidden",
"group": "index.html",
"title": "隐藏入口",
"description": "在功能列表中隐藏匹配到文件名的条目",
"type": "array",
"default": [
"titer.html"
]
}
]

8
statics/theme.css
View File

@@ -16,9 +16,9 @@ a {
}
.item {
height: 32px;
height: 38px;
text-align: left;
line-height: 32px;
line-height: 38px;
margin-top: 5px;
padding-left: 10px;
background-color: #f5f5f5;
@@ -27,9 +27,9 @@ a {
}
.item:active {
height: 32px;
height: 38px;
text-align: left;
line-height: 32px;
line-height: 38px;
margin-top: 5px;
padding-left: 10px;
background-color: #ffffff;

281
views/L014-1-impurities.html
View File

@@ -1,281 +0,0 @@
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<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>
<link rel="stylesheet" href="../statics/github.css">
<link rel="stylesheet" href="../statics/theme.css">
<script src="../statics/modules/jquery.min.js"></script>
<script type="module">
import { Decimal } from "../statics/modules/decimal.mjs"
let decimal = Decimal.set({
rounding: Decimal.ROUND_HALF_EVEN,
precision: 12
})
const ROUNDING = Decimal.ROUND_HALF_EVEN // 舍入模式：四舍六入五成双
const PRECISION = 2 // 计算精度
const DEBUG = false // debug 开关
const DIMER_MAX = 2.5 // 2.2-Dimer 最大值
const AT_MAX = 1.0 // 2-乙酰噻吩 最大值
const TOTAL_IMPURITIES_MAX = 4 // 总杂 最大值
const PURTY_MIN = 96 // 纯度 最小值
const DIMER_RRF = 1.34 // 2.2-Dimer 的 RRF
const AT_RRF = 2.06 // 2-乙酰噻吩 的 RRF
const msg = `
<b>相关参数：</b><br>
&nbsp;&nbsp; 2.2-Dimer 的 RRF: ${DIMER_RRF}<br>
&nbsp;&nbsp; 2-乙酰噻吩的 RRF: ${AT_RRF}<br>
<br>
<b>质量标准：</b><br>
&nbsp;&nbsp; 2.2-Dimer &le; ${DIMER_MAX}% <br>
&nbsp;&nbsp; 2-乙酰噻吩 &le; ${AT_MAX.toFixed(1)}% <br>
&nbsp;&nbsp; 杂质总量 &le; ${TOTAL_IMPURITIES_MAX}% <br>
&nbsp;&nbsp; 纯度 &ge; ${PURTY_MIN}% <br>
`
$(document).ready(() => {
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)
}
$("#msgbox").html(msg)
$("#new_page").click(() => window.open(window.location.href, '_BLANK'))
$("#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").html(msg)
$("#table").hide()
})
$("#ok").click(() => {
let one_dimer = $("#one-dimer").val()
let two_dimer = $("#two-dimer").val()
let one_014_1 = $("#one-014-1").val()
let two_014_1 = $("#two-014-1").val()
let one_at = $("#one-at").val()
let two_at = $("#two-at").val()
let one_all = $("#one-all").val()
let two_all = $("#two-all").val()
let one_dimer_ = func_dimer(one_dimer, one_all)
let one_at_ = func_at(one_at, one_all)
let one_impurities = func_impurities(one_dimer, one_at, one_014_1, one_all)
let one_purity = func_purity(one_impurities)
let two_dimer_ = func_dimer(two_dimer, two_all)
let two_at_ = func_at(two_at, two_all)
let two_impurities = func_impurities(two_dimer, two_at, two_014_1, two_all)
let two_purity = func_purity(two_impurities)
let average_dimer = average(one_dimer_, two_dimer_)
let average_at = average(one_at_, two_at_)
let average_impurities = average(one_impurities, two_impurities)
let average_purity = average(one_purity, two_purity)
let data = {
"one": {
"dimer": format(one_dimer_, DIMER_MAX),
"at": format(one_at_, AT_MAX),
"impurities": format(one_impurities, TOTAL_IMPURITIES_MAX),
"purity": format(one_purity, 100, PURTY_MIN)
},
"two": {
"dimer": format(two_dimer_, DIMER_MAX),
"at": format(two_at_, AT_MAX),
"impurities": format(two_impurities, TOTAL_IMPURITIES_MAX),
"purity": format(two_purity, 100, PURTY_MIN)
},
"average": {
"dimer": format(average_dimer, DIMER_MAX),
"at": format(average_at, AT_MAX),
"impurities": format(average_impurities, TOTAL_IMPURITIES_MAX),
"purity": format(average_purity, 100, PURTY_MIN)
}
}
generateTable(data)
})
})
function func_dimer(dimer, all) {
if (dimer == '' || all == '') return 0
// dimer% = [dimer / (all * RRF)] * 100
let x = decimal.mul(all, DIMER_RRF)
let y = decimal.div(dimer, x).mul(100)
return toFixed(y)
}
function func_at(at, all) {
if (at == '' || all == '') return 0
// at% = [at / (all * RRF)] * 100
let x = decimal.mul(all, AT_RRF)
let y = decimal.div(at, x).mul(100)
return toFixed(y)
}
function 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 z = decimal.add(y, func_dimer(dimer, all)).add(func_at(at, all))
return toFixed(z)
}
function func_purity(total_impurities) {
if (total_impurities == '') return 0
// purty% = 100 - impurities%
return toFixed(decimal.sub(100, total_impurities))
}
function average(a, b) {
let value = decimal.add(a, b).div(2)
// 大于等于 1 时只保留一位小数，否则保留两位
return value.toFixed(value >= 1 ? 1 : 2, ROUNDING)
}
function format(value, max, min = 0) {
if (value == 0) {
return 'ND' // means 'Not Detected'
}
if (value > max || value < min) {
return `<span style='color: red;'>${value}</span>`
}
return value
}
function toFixed(value) {
return value.toFixed(value >= 1 ? 2 : 3, ROUNDING)
}
function generateTable(data) {
$("#table").show()
$("#Dimer>#one").html(data.one.dimer)
$("#2-AT>#one").html(data.one.at)
$("#impurities>#one").html(data.one.impurities)
$("#purity>#one").html(data.one.purity)
$("#Dimer>#two").html(data.two.dimer)
$("#2-AT>#two").html(data.two.at)
$("#impurities>#two").html(data.two.impurities)
$("#purity>#two").html(data.two.purity)
$("#Dimer>#average").html(data.average.dimer)
$("#2-AT>#average").html(data.average.at)
$("#impurities>#average").html(data.average.impurities)
$("#purity>#average").html(data.average.purity)
}
</script>
<style>
.container {
display: grid;
grid-template-columns: 1fr 1fr;
column-gap: 2%
}
input {
width: auto;
}
</style>
</head>
<body>
<h3>L014-1 相关物质</h3>
<div class="container">
<span>第一组</span>
<span>第二组</span>
<input type="number" name="one-dimer" id="one-dimer" inputmode="numeric" placeholder="2.2-Dimer 峰面积">
<input type="number" name="two-dimer" id="two-dimer" inputmode="numeric" placeholder="2.2-Dimer 峰面积">
<input type="number" name="one-at" id="one-at" inputmode="numeric" placeholder="2-乙酰噻吩峰面积">
<input type="number" name="two-at" id="two-at" inputmode="numeric" placeholder="2-乙酰噻吩峰面积">
<input type="number" name="one-014-1" id="one-014-1" inputmode="numeric" placeholder="L014-1 峰面积">
<input type="number" name="two-014-1" id="two-014-1" inputmode="numeric" placeholder="L014-1 峰面积">
<input type="number" name="one-all" id="one-all" inputmode="numeric" placeholder="总峰面积">
<input type="number" name="two-all" id="two-all" inputmode="numeric" placeholder="总峰面积">
</div>
<br>
<div class="buttons">
<button id="new_page">新开标签页</button>
<button id="clear">清除内容</button>
<button id="ok">计算</button>
</div>
<br>
<table id="table" style="font-size: small; width: 100%; text-align: center; display: none;">
<caption>计算结果</caption>
<tr>
<th scope="col">/</th>
<th scope="col">第一组(%)</th>
<th scope="col">第二组(%)</th>
<th scope="col">平均值(%)</th>
</tr>
<tr id="Dimer">
<th scope="row">2.2-Dimer</th>
<td id="one"></td>
<td id="two"></td>
<td id="average"></td>
</tr>
<tr id="2-AT">
<th scope="row">2-乙酰噻吩</th>
<td id="one"></td>
<td id="two"></td>
<td id="average"></td>
</tr>
<tr id="max_impurities">
<th scope="row">最大单杂</th>
<td id="one">/</td>
<td id="two">/</td>
<td id="average">/</td>
</tr>
<tr id="impurities">
<th scope="row">杂质总量</th>
<td id="one"></td>
<td id="two"></td>
<td id="average"></td>
</tr>
<tr id="purity">
<th scope="row">纯度</th>
<td id="one"></td>
<td id="two"></td>
<td id="average"></td>
</tr>
</table>
<div id="msgbox"></div>
</body>
</html>

286
views/L414-5KR-impurities.html
View File

@@ -1,286 +0,0 @@
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<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>L414-5KR 相关物质</title>
<link rel="stylesheet" href="../statics/github.css">
<link rel="stylesheet" href="../statics/theme.css">
<script src="../statics/modules/jquery.min.js"></script>
<script type="module">
import { Decimal } from "../statics/modules/decimal.mjs"
// debug 开关
const DEBUG = false
// 校正因子
const F_L414_3 = 0.80
const F_L414_5_IM = 1.48
// 计算精度
const PRECISION = 3
// 操规允许的最大值
const MAX_L414_3 = 0.3
const MAX_L414_5_IM = 1.0
const MAX_TOTAL_IMPURITIES = 2.0
const MIN_PURITY = 98.0
let tips_params = `
<b>相关参数：</b><br>
&nbsp;&nbsp; L414-3 的校正因子: ${F_L414_3.toFixed(2)}<br>
&nbsp;&nbsp; L414-5-IM 的校正因子: ${F_L414_5_IM}<br>
`
let tips_standard = `
<b>质量标准：</b><br>
&nbsp;&nbsp; L414-3 &le; ${MAX_L414_3}% <br>
&nbsp;&nbsp; L414-401 &le; 0.2% <br>
&nbsp;&nbsp; L414-5-IM &le; ${MAX_L414_5_IM.toFixed(1)}% <br>
&nbsp;&nbsp; 最大单杂 &le; 0.50% <br>
&nbsp;&nbsp; 杂质总量 &le; ${MAX_TOTAL_IMPURITIES}% <br>
&nbsp;&nbsp; 纯度 &ge; ${MIN_PURITY}% <br>
`
// 默认的消息提示
let tips = `
${tips_params}
<br>
${tips_standard}
`
let decimal = Decimal.set({
rounding: Decimal.ROUND_HALF_EVEN,
precision: 12
})
$(document).ready(() => {
let one_all = $("#one-all")
let one_414_3 = $("#one-414-3")
let one_414_5_im = $("#one-414-5-im")
let one_414_5 = $("#one-414-5")
let two_all = $("#two-all")
let two_414_3 = $("#two-414-3")
let two_414_5_im = $("#two-414-5-im")
let two_414_5 = $("#two-414-5")
if (DEBUG) {
one_414_3.val(1762)
one_414_5_im.val(2614)
one_414_5.val(24001626)
one_all.val(24075340)
two_414_3.val(2175)
two_414_5_im.val(3319)
two_414_5.val(24320630)
two_all.val(24409434)
}
$("#msgbox").html(tips)
$("#new_page").click(() => window.open(window.location.href, "_BLANK"))
$("#clear").click(() => {
one_all.val("")
two_all.val("")
one_414_3.val("")
two_414_3.val("")
one_414_5_im.val("")
two_414_5_im.val("")
one_414_5.val("")
two_414_5.val("")
$("#msgbox").empty()
$("#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)
let two_414_3_cf = correctionFactor(two_414_3.val(), two_all.val(), F_L414_3)
let two_414_5_im_cf = correctionFactor(two_414_5_im.val(), two_all.val(), F_L414_5_IM)
let one_total_impurities = totalImpurities(
one_all.val(), one_414_5.val(),
one_414_3.val(), one_414_3_cf,
one_414_5_im.val(), one_414_5_im_cf
)
let two_total_impurities = totalImpurities(
two_all.val(), two_414_5.val(),
two_414_3.val(), two_414_3_cf,
two_414_5_im.val(), two_414_5_im_cf
)
let one_purity = decimal.sub(100, one_total_impurities).toFixed(PRECISION)
let two_purity = decimal.sub(100, two_total_impurities).toFixed(PRECISION)
let data = {
"one": {
"L414_3": format(one_414_3_cf, MAX_L414_3),
"L414_5_IM": format(one_414_5_im_cf, MAX_L414_5_IM),
"impurities": format(one_total_impurities, MAX_TOTAL_IMPURITIES),
"purity": format(one_purity, MIN_PURITY, true)
},
"two": {
"L414_3": format(two_414_3_cf, MAX_L414_3),
"L414_5_IM": format(two_414_5_im_cf, MAX_L414_5_IM),
"impurities": format(two_total_impurities, MAX_TOTAL_IMPURITIES),
"purity": format(two_purity, MIN_PURITY, true)
},
"average": {
"L414_3": format(average(one_414_3_cf, two_414_3_cf), MAX_L414_3),
"L414_5_IM": format(average(one_414_5_im_cf, two_414_5_im_cf), MAX_L414_5_IM),
"impurities": format(average(one_total_impurities, two_total_impurities), MAX_TOTAL_IMPURITIES),
"purity": format(average(one_purity, two_purity, 1), MIN_PURITY, true)
}
}
$("#table").show()
generateTable(data)
$("#msgbox").html(`
<br>
<b>注意：</b><br>
&nbsp;&nbsp; 结果表格中，标注 / 的仅用于占行，具体结果需查看色谱图峰表。<br>
<br>
${tips}
`)
})
})
/**
* 将结果输出到表格中
*/
function generateTable(data) {
$("#L414-3>#one").html(data.one.L414_3)
$("#L414-5-IM>#one").html(data.one.L414_5_IM)
$("#impurities>#one").html(data.one.impurities)
$("#purity>#one").html(data.one.purity)
$("#L414-3>#two").html(data.two.L414_3)
$("#L414-5-IM>#two").html(data.two.L414_5_IM)
$("#impurities>#two").html(data.two.impurities)
$("#purity>#two").html(data.two.purity)
$("#L414-3>#average").html(data.average.L414_3)
$("#L414-5-IM>#average").html(data.average.L414_5_IM)
$("#impurities>#average").html(data.average.impurities)
$("#purity>#average").html(data.average.purity)
}
/**
* 代入校正因子进行计算
*/
function correctionFactor(pa, paa, f) {
if (pa == '' || paa == '' || f == '') return 0
return decimal.div(pa, paa).mul(f).mul(100).toFixed(PRECISION, Decimal.ROUND_HALF_EVEN)
}
/**
* 计算杂质总量
*/
function totalImpurities(paa, l414_5, l414_3, l414_3_rrf, l414_5_im, l414_5_im_rrf) {
if (paa == '' || l414_5 == '' || l414_3 == '' || l414_3_rrf == '' ||
l414_5_im == '' || l414_5_im_rrf == '') return 0
// X = All - (L414-5) - (L414-3) - (L414-5-IM) / All * 100
// R = X + (%L414-3) + (%L414-5-IM)
let a = decimal.sub(paa, l414_5).sub(l414_3).sub(l414_5_im)
let b = decimal.div(a, paa).mul(100)
let r = decimal.add(b, l414_3_rrf).add(l414_5_im_rrf)
return r.toFixed(PRECISION, Decimal.ROUND_HALF_EVEN)
}
function format(value, max, morethen = false) {
let red_value = `<span style='color: red;'>${value}</span>`
if (value == 0) return "ND"
if (value < 0) return red_value
if (!morethen && value >= max) return red_value
if (morethen && value <= max) return red_value
return `${value}`
}
/**
* 求两个数的平均值
*/
function average(a, b, fd = (PRECISION - 1)) {
return decimal.add(a, b).div(2).toFixed(fd)
}
</script>
</head>
<body>
<h3>L414-5KR 相关物质</h3>
<div class="one">
第一组<br>
<input type="number" name="one-414-3" id="one-414-3" , placeholder="L414-3 峰面积" inputmode="numeric">
<input type="number" name="one-414-5-im" id="one-414-5-im" , placeholder="L414-5-IM 峰面积" inputmode="numeric">
<input type="number" name="one-414-5" id="one-414-5" , placeholder="L414-5 峰面积" inputmode="numeric">
<input type="number" name="one-all" id="one-all" placeholder="总峰面积" inputmode="numeric">
</div>
<br>
<div class="two">
第二组<br>
<input type="number" name="two-414-3" id="two-414-3" , placeholder="L414-3 峰面积" inputmode="numeric">
<input type="number" name="two-414-5-im" id="two-414-5-im" , placeholder="L414-5-IM 峰面积" inputmode="numeric">
<input type="number" name="two-414-5" id="two-414-5" , placeholder="L414-5 峰面积" inputmode="numeric">
<input type="number" name="two-all" id="two-all" placeholder="总峰面积" inputmode="numeric">
</div>
<br>
<div class="buttons">
<button id="new_page">新开标签页</button>
<button id="clear">清除内容</button>
<button id="ok">计算</button>
</div>
<br>
<table id="table" style="font-size: small; width: 100%; text-align: center; display: none;">
<caption>计算结果</caption>
<tr>
<th scope="col">/</th>
<th scope="col">第一组(%)</th>
<th scope="col">第二组(%)</th>
<th scope="col">平均值(%)</th>
</tr>
<tr id="L414-3">
<th scope="row">L414-3</th>
<td id="one"></td>
<td id="two"></td>
<td id="average"></td>
</tr>
<tr id="L414-4">
<th scope="row">L414-401</th>
<td id="one">/</td>
<td id="two">/</td>
<td id="average">/</td>
</tr>
<tr id="L414-5-IM">
<th scope="row">L414-5-IM</th>
<td id="one"></td>
<td id="two"></td>
<td id="average"></td>
</tr>
<tr id="purity">
<th scope="row">纯度</th>
<td id="one"></td>
<td id="two"></td>
<td id="average"></td>
</tr>
<tr id="max_impurities">
<th scope="row">最大单杂</th>
<td id="one">/</td>
<td id="two">/</td>
<td id="average">/</td>
</tr>
<tr id="impurities">
<th scope="row">杂质总量</th>
<td id="one"></td>
<td id="two"></td>
<td id="average"></td>
</tr>
</table>
<div id="msgbox"></div>
</body>
</html>

194
views/settings.html Normal file
View File

@@ -0,0 +1,194 @@
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Settings</title>
<script src="../statics/modules/jquery.min.js"></script>
<link rel="stylesheet" href="../statics/github.css">
<link rel="stylesheet" href="../statics/theme.css">
<style>
* {
padding: 0;
margin: 0;
}
textarea {
width: 85vw;
height: 70vh;
padding: 2vw;
margin: 3vw;
font-size: medium;
line-height: 1.2;
border: 1px solid #cbcbcb;
border-radius: 5px;
}
</style>
<script type="module">
import { IO } from "../statics/modules/tools.js"
const io = new IO("settings")
$(() => {
const textarea = $("#textarea")
// 写入默认设置
if (readSettings().length == 0) {
writeDefaultSettings(() => {
$("#refresh").click()
})
}
$("#reset").click(() => {
if (confirm("确定要恢复默认设置吗？\n该选项将会覆盖当前已保存的设置")) {
writeDefaultSettings(() => {
$("#refresh").click()
})
}
})
$("#go_index").click(() => {
window.location.href = "../index.html"
})
$("#refresh").click(() => {
let settings = readSettingsWithComments()
let string = ""
settings.forEach(item => {
string = string.concat(item).concat("\n")
})
textarea.val(string)
})
$("#refresh").click()
$("#save").click(() => {
let text = $("#textarea").val()
let settings = text.split("\n")
writeSettings(settings)
})
})
function readSettingsWithComments() {
let texts = []
texts.push("# 以井号开头的行是注释，注释将被忽略。")
texts.push("# 一行仅可填写一个设置，以键值对 (key=value) 的形式出现。")
texts.push("# 等号左边为设置的唯一标识，右边为该设置的值")
texts.push("# 若值有多个，使用英文逗号分隔 (e.g. key=value1,value2)")
texts.push("# 等号和用于分隔多个值的英文逗号左右两边不得有空格")
texts.push("")
for (const setting of readSettings()) {
let comment = io.read(`${setting.key}.desc`)
texts.push(`# ${comment}`)
texts.push(`${setting.key}=${setting.value}`)
texts.push("")
}
return texts
}
function readSettings() {
let settings = []
for (const iterator of io.listKeys().sort()) {
if (!iterator.endsWith(".desc")) {
settings.push({
key: iterator,
value: io.read(iterator)
})
}
}
return settings
}
function writeSettings(settings) {
if (settings.length == 0) {
return
}
io.listKeys().forEach(key => {
if (!key.endsWith(".desc")) {
io.remove(key)
}
})
settings.forEach(item => {
if (item.startsWith("#")) {
return
}
let key = item.split('=')[0]
let value = item.split('=')[1]
if (key != item && key != '') {
io.write(key, value)
}
})
}
function writeDefaultSettings(action) {
io.listKeys().forEach(key => {
io.remove(key)
})
$.getJSON("../statics/settings.json", (settings) => {
for (const iterator of settings) {
io.write(iterator.id, iterator.default)
io.write(`${iterator.id}.desc`, iterator.description)
}
action()
})
}
function createItem(data) {
let div = document.createElement("div")
div.setAttribute("class", "setting_item")
let span = document.createElement("span")
let span_title = document.createElement("span")
let span_description = document.createElement("span")
span_title.setAttribute("class", "title")
span_description.setAttribute("class", "description")
span_description.innerHTML = data.description
span.appendChild(span_title)
span.appendChild(document.createElement("br"))
span.appendChild(span_description)
div.appendChild(span)
switch (data.type) {
case 'boolean':
span_title.innerHTML = `${data.title} (${data.default ? "ON" : "OFF"})`
let button = document.createElement("button")
button.innerText = data.default ? "OFF" : "ON"
button.setAttribute("id", data.id)
div.appendChild(button)
break
case 'number':
span_title.innerHTML = `${data.title} (${data.default})`
let input = document.createElement("input")
input.setAttribute("type", "number")
input.setAttribute("value", data.default)
input.setAttribute("id", data.id)
div.appendChild(input)
break
default:
break
}
return div
}
</script>
</head>
<body>
<textarea id="textarea" wrap="off" autocomplete="off"></textarea>
<br>
<div id="buttons" style="text-align: center;">
<button id="reset">恢复默认设置</button>
<button id="go_index">回到首页</button>
<button id="refresh">刷新</button>
<button id="save">保存</button>
</div>
<div id="msg"></div>
</body>
</html>

9
views/common-sop.html → views/sop.html
View File

@@ -5,7 +5,7 @@
<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>常用操作规程</title>
<title>操作规程</title>
<link rel="stylesheet" href="../statics/github.css">
<link rel="stylesheet" href="../statics/theme.css">
<style>
@@ -32,7 +32,7 @@
const md = window.markdownit({
breaks: true
})
const tips = `整理了常用的操作规程中的关键内容以供查询，请以纸质操作规程为准！`
const tips = `<br>整理了常用的操作规程中的关键内容以供查询，请以纸质操作规程为准！`
const sop = [
"L014-1",
"L018-1",
@@ -58,7 +58,7 @@
}
$("#content").empty()
$("#content").text("加载中...")
$("#content").html("<br>加载中...")
$.ajax({
url: `../statics/sop/${name}`,
success: (data) => {
@@ -74,9 +74,8 @@
<body>
<div>
<label for="selector">选择要查看的操作规程：</label><br>
<select name="selector" id="selector">
<option value='null' selected>请选择</option>
<option value='null' selected>选择要查看的操作规程</option>
</select>
</div>
<div id="content"></div>