approve.html · 约 4387 字符
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.0, maximum-scale=1.0, user-scalable=no">
6<title>驰旭科技OA · 在线审批</title>
7<link rel="stylesheet" href="style.css">
8</head>
9<body>
10<div class="wrap">
11<div class="header">
12 <div class="top"><span class="role">经理端</span><span style="margin-left:auto;font-size:12px;opacity:.85">驰旭科技</span></div>
13 <h1>在线审批</h1>
14 <div class="sub">李四 · 部门经理</div>
15</div>
16
17<div class="kpi">
18 <div class="box"><div class="num" style="color:var(--accent)">4</div><div class="lab">待我审批</div></div>
19 <div class="box"><div class="num" style="color:#16a34a">2</div><div class="lab">今日已办</div></div>
20</div>
21<div class="seg">
22 <div class="sg on">待审批</div><div class="sg">已审批</div><div class="sg">我发起的</div>
23</div>
24<div class="section-title"><span>待审批单据</span><span class="more">共 4 条</span></div>
25<div class="list"><div class="row">
26 <div class="avatar">👤</div>
27 <div class="info"><div class="t">张三 · 请假申请</div><div class="s">年假 09-15 至 09-16 · 2 天</div><div class="s">提交 09-13</div></div>
28 <div style="display:flex;flex-direction:column;gap:6px">
29 <span class="btn" onclick="alert('已通过（演示）')">通过</span>
30 <span class="btn ghost" onclick="alert('已驳回（演示）')">驳回</span>
31 </div>
32</div><div class="row">
33 <div class="avatar">👤</div>
34 <div class="info"><div class="t">赵六 · 报销申请</div><div class="s">差旅费 ¥2,150.00</div><div class="s">提交 09-13</div></div>
35 <div style="display:flex;flex-direction:column;gap:6px">
36 <span class="btn" onclick="alert('已通过（演示）')">通过</span>
37 <span class="btn ghost" onclick="alert('已驳回（演示）')">驳回</span>
38 </div>
39</div><div class="row">
40 <div class="avatar">👤</div>
41 <div class="info"><div class="t">孙七 · 请假申请</div><div class="s">调休 09-18 全天 · 1 天</div><div class="s">提交 09-12</div></div>
42 <div style="display:flex;flex-direction:column;gap:6px">
43 <span class="btn" onclick="alert('已通过（演示）')">通过</span>
44 <span class="btn ghost" onclick="alert('已驳回（演示）')">驳回</span>
45 </div>
46</div><div class="row">
47 <div class="avatar">👤</div>
48 <div class="info"><div class="t">周八 · 采购申请</div><div class="s">研发测试机 ¥8,600.00</div><div class="s">提交 09-12</div></div>
49 <div style="display:flex;flex-direction:column;gap:6px">
50 <span class="btn" onclick="alert('已通过（演示）')">通过</span>
51 <span class="btn ghost" onclick="alert('已驳回（演示）')">驳回</span>
52 </div>
53</div></div>
54<div class="section-title"><span>审批流程（请假申请）</span></div>
55<div class="timeline"><div class="step done"><div class="dot"></div><div class="info"><div class="st">发起申请</div><div class="sd">张三 · 09-13 09:20</div></div></div><div class="step "><div class="dot"></div><div class="info"><div class="st">部门经理审批</div><div class="sd">李四 · 待处理</div></div></div><div class="step wait"><div class="dot"></div><div class="info"><div class="st">总经理审批</div><div class="sd">陈总 · —</div></div></div><div class="step wait"><div class="dot"></div><div class="info"><div class="st">财务复核</div><div class="sd">出纳 · —</div></div></div></div>
56<div class="section-title"><span>已审批</span></div>
57<div class="list"><div class="row"><div class="avatar">👤</div><div class="info"><div class="t">吴九 · 报销申请</div><div class="s">09-11</div></div><span class="tag ok">已通过</span></div><div class="row"><div class="avatar">👤</div><div class="info"><div class="t">郑十 · 请假申请</div><div class="s">09-09</div></div><span class="tag no">已驳回</span></div></div>
58
59<div class="bottom-nav"><a class="nav-item active" href="approve.html"><span class="icon">✅</span>审批</a><a class="nav-item" href="org.html"><span class="icon">🏢</span>组织</a><a class="nav-item" href="role.html"><span class="icon">🔐</span>权限</a><a class="nav-item" href="flow.html"><span class="icon">⚙️</span>流程</a></div>
60<div class="safe-bottom"></div>
61</div>
62</body>
63</html>