r98/stats.html · 约 2927 字符
1<!doctype html>
2<html lang="zh-CN">
3<head>
4<meta charset="utf-8">
5<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
6<title>统计报表</title>
7<link rel="stylesheet" href="style.css">
8</head>
9<body>
10<div class="app">
11 <header class="top">
12 <div class="top-l">库管端 · 赵磊</div>
13 <div class="top-r">统计报表</div>
14 </header>
15 <main class="main">
16<div class="grid" style="margin-bottom:12px">
17 <div class="kpi"><div class="n">236</div><div class="l">本月领用件数</div></div>
18 <div class="kpi"><div class="n">48</div><div class="l">领用人次</div></div>
19 <div class="kpi"><div class="n">12</div><div class="l">采购入库单</div></div>
20 <div class="kpi"><div class="n">¥3.2k</div><div class="l">采购金额</div></div>
21</div>
22<div class="card">
23 <div class="sec-title"><span>🏆</span> Top 领用用品</div>
24 <div style="margin:10px 0"><div class="row"><span style="font-size:13px;color:#fff">A4 打印纸</span><b style="color:var(--pri);font-size:13px">86 包</b></div><div class="bar" style="margin-top:5px"><i style="width:100%"></i></div></div><div style="margin:10px 0"><div class="row"><span style="font-size:13px;color:#fff">中性笔（黑）</span><b style="color:var(--pri);font-size:13px">240 支</b></div><div class="bar" style="margin-top:5px"><i style="width:82%"></i></div></div><div style="margin:10px 0"><div class="row"><span style="font-size:13px;color:#fff">回形针</span><b style="color:var(--pri);font-size:13px">120 盒</b></div><div class="bar" style="margin-top:5px"><i style="width:64%"></i></div></div><div style="margin:10px 0"><div class="row"><span style="font-size:13px;color:#fff">便利贴</span><b style="color:var(--pri);font-size:13px">95 本</b></div><div class="bar" style="margin-top:5px"><i style="width:51%"></i></div></div><div style="margin:10px 0"><div class="row"><span style="font-size:13px;color:#fff">文件夹</span><b style="color:var(--pri);font-size:13px">53 个</b></div><div class="bar" style="margin-top:5px"><i style="width:38%"></i></div></div>
25</div>
26<div class="card">
27 <div class="sec-title"><span>📊</span> 品类分布</div>
28 <div class="sgrid">
29 <div class="it"><span class="e">🖊️</span>文具 41%</div><div class="it"><span class="e">📄</span>纸张 27%</div>
30 <div class="it"><span class="e">🔧</span>设备 19%</div><div class="it"><span class="e">📦</span>其他 13%</div>
31 </div>
32</div>
33</main>
34 <nav class="nav"><a class="" href="approve.html"><span class="ic">✅</span>审批</a><a class="" href="stock.html"><span class="ic">📦</span>库存</a><a class="" href="stock_in.html"><span class="ic">🚚</span>入库</a><a class=" on" href="stats.html"><span class="ic">📊</span>报表</a><a class="" href="mine.html"><span class="ic">👤</span>我的</a></nav>
35</div>
36<script></script>
37</body>
38</html>