+ 添加常用标品信息功能

+ 设备信息数量提示移至表格头部
This commit is contained in:
2023-03-13 21:36:28 +08:00
parent f9a6e8f052
commit ae2c723468
4 changed files with 233 additions and 12 deletions

View File

@@ -8,12 +8,36 @@
<title>设备信息</title>
<link rel="stylesheet" href="../statics/github.css">
<link rel="stylesheet" href="../statics/theme.css">
<style>
.expir30 {
color: darkorange;
}
.expir7 {
color: red;
}
.expired {
color: red;
text-decoration: line-through;
}
.pure-table {
width: 100%;
font-size: small;
}
.pure-table caption {
font-style: normal;
}
</style>
<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(() => {
createTable(info)
$("#keyword").attr("placeholder", "输入查询关键字(忽略大小写)")
$("#search").click(() => {
let keyword = $("#keyword").val()
if (keyword == "") {
@@ -39,9 +63,12 @@
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")
let caption = document.createElement("caption")
caption.innerText = `共找到 ${data.length} 条记录`
table.appendChild(caption)
// add header
let tr = document.createElement("tr")
let th_where = document.createElement("th")
@@ -80,9 +107,6 @@
})
content.appendChild(table)
let num = document.createElement("span")
num.innerText = `${data.length} 条记录`
content.appendChild(num)
}
// 设置日期样式
@@ -94,15 +118,15 @@
let day = (date - Date.now()) / 86400000
if (day <= 0) {
return `<span style='color: red;'><s>${value}</s></span>`
return `<span class='expired'>${value}</span>`
}
if (day <= 7) {
return `<span style='color: red;'>${value}</span>`
return `<span class='expir7'>${value}</span>`
}
if (day <= 30) {
return `<span style='color: darkorange;'>${value}</span>`
return `<span class='expir30'>${value}</span>`
}
return value
@@ -112,15 +136,15 @@
<body>
<div style="width: 100%; white-space: nowrap;">
<input style="width: 80%;" type="text" id="keyword" placeholder="">
<input style="width: 80%;" type="text" id="keyword" placeholder="输入查询关键字(忽略大小写)">
<button style="width: 15%;" id="search" type="submit">搜索</button>
</div>
<div id="content"></div>
<p>
过期提醒:<br>
<span style="color: darkorange;">黄色表示有效期剩余30天</span><br>
<span style="color: red;">红色表示有效期剩余7天</span><br>
<span style="color: red;"><s>红色加删除线表示已过期</s></span><br>
<span class="expir30">黄色表示有效期剩余30天</span><br>
<span class="expir7">红色表示有效期剩余7天</span><br>
<span class="expired">红色加删除线表示已过期</span><br>
</p>
</body>