678f64d772
后端新增通用分页模块，为报销单、员工、预算、agent 资产等 端点统一接入分页参数和游标查询，优化 repository 层分页实 现，前端服务层适配分页响应结构，完善预算图表和全局样式， 优化侧边栏和企业选择器组件，引入 Element Plus 插件注册。
2295 lines
80 KiB
HTML
2295 lines
80 KiB
HTML
<!doctype html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>X-Financial 智能费控平台核心说明文档</title>
|
||
<style>
|
||
:root {
|
||
color-scheme: light;
|
||
--bg: #f6f8f6;
|
||
--surface: #ffffff;
|
||
--surface-soft: #f9fbfa;
|
||
--surface-strong: #edf4f0;
|
||
--ink: #14201c;
|
||
--ink-soft: #43534d;
|
||
--muted: #6b7a74;
|
||
--line: #dce6e1;
|
||
--line-strong: #c5d5ce;
|
||
--teal: #0f766e;
|
||
--teal-deep: #0b4f49;
|
||
--teal-soft: #e5f4f1;
|
||
--blue: #2459a7;
|
||
--blue-soft: #eaf1fb;
|
||
--amber: #a35f00;
|
||
--amber-soft: #fff4dc;
|
||
--red: #b43c2d;
|
||
--red-soft: #fff0ed;
|
||
--green: #287947;
|
||
--green-soft: #e8f5ec;
|
||
--shadow: 0 18px 40px rgba(23, 42, 35, 0.08);
|
||
--shadow-soft: 0 10px 24px rgba(23, 42, 35, 0.06);
|
||
--radius: 8px;
|
||
--font: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", "Segoe UI", sans-serif;
|
||
--mono: "Cascadia Code", "JetBrains Mono", Consolas, monospace;
|
||
}
|
||
|
||
* {
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
html {
|
||
scroll-behavior: smooth;
|
||
}
|
||
|
||
body {
|
||
margin: 0;
|
||
background:
|
||
linear-gradient(180deg, rgba(229, 244, 241, 0.82), rgba(246, 248, 246, 0.96) 360px),
|
||
var(--bg);
|
||
color: var(--ink);
|
||
font-family: var(--font);
|
||
font-size: 14px;
|
||
line-height: 1.72;
|
||
letter-spacing: 0;
|
||
overflow-wrap: anywhere;
|
||
}
|
||
|
||
a {
|
||
color: inherit;
|
||
text-decoration: none;
|
||
}
|
||
|
||
img {
|
||
display: block;
|
||
max-width: 100%;
|
||
}
|
||
|
||
code {
|
||
padding: 2px 6px;
|
||
border-radius: 6px;
|
||
background: rgba(15, 118, 110, 0.08);
|
||
color: var(--teal-deep);
|
||
font-family: var(--mono);
|
||
font-size: 0.92em;
|
||
}
|
||
|
||
.page {
|
||
display: grid;
|
||
grid-template-columns: 268px minmax(0, 1fr) 238px;
|
||
min-height: 100dvh;
|
||
}
|
||
|
||
.sidebar,
|
||
.toc {
|
||
position: sticky;
|
||
top: 0;
|
||
height: 100dvh;
|
||
overflow: auto;
|
||
background: rgba(255, 255, 255, 0.9);
|
||
backdrop-filter: blur(18px);
|
||
}
|
||
|
||
.sidebar {
|
||
padding: 24px 18px;
|
||
border-right: 1px solid var(--line);
|
||
}
|
||
|
||
.toc {
|
||
padding: 28px 18px;
|
||
border-left: 1px solid var(--line);
|
||
}
|
||
|
||
.brand {
|
||
display: grid;
|
||
gap: 12px;
|
||
padding-bottom: 20px;
|
||
border-bottom: 1px solid var(--line);
|
||
}
|
||
|
||
.brand-line {
|
||
display: flex;
|
||
gap: 12px;
|
||
align-items: center;
|
||
}
|
||
|
||
.brand-mark {
|
||
display: grid;
|
||
width: 42px;
|
||
height: 42px;
|
||
place-items: center;
|
||
border-radius: 8px;
|
||
background: #102f2b;
|
||
color: #fff;
|
||
font-weight: 900;
|
||
box-shadow: 0 14px 26px rgba(16, 47, 43, 0.22);
|
||
}
|
||
|
||
.brand-title {
|
||
font-size: 15px;
|
||
font-weight: 900;
|
||
line-height: 1.28;
|
||
}
|
||
|
||
.brand-subtitle {
|
||
color: var(--muted);
|
||
font-size: 12px;
|
||
line-height: 1.55;
|
||
}
|
||
|
||
.nav-label,
|
||
.toc-title {
|
||
margin: 22px 0 10px;
|
||
color: var(--muted);
|
||
font-size: 12px;
|
||
font-weight: 850;
|
||
}
|
||
|
||
.nav {
|
||
display: grid;
|
||
gap: 5px;
|
||
}
|
||
|
||
.nav a,
|
||
.toc a {
|
||
display: flex;
|
||
align-items: center;
|
||
min-height: 34px;
|
||
padding: 7px 10px;
|
||
border-radius: 8px;
|
||
color: var(--ink-soft);
|
||
font-size: 13px;
|
||
font-weight: 760;
|
||
}
|
||
|
||
.nav a:hover,
|
||
.toc a:hover {
|
||
background: var(--teal-soft);
|
||
color: var(--teal-deep);
|
||
}
|
||
|
||
.dot {
|
||
flex: 0 0 auto;
|
||
width: 7px;
|
||
height: 7px;
|
||
margin-right: 10px;
|
||
border-radius: 99px;
|
||
background: var(--line-strong);
|
||
}
|
||
|
||
.nav a:hover .dot,
|
||
.toc a:hover .dot {
|
||
background: var(--teal);
|
||
}
|
||
|
||
.side-note {
|
||
margin-top: 24px;
|
||
padding: 12px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: var(--surface-soft);
|
||
color: var(--ink-soft);
|
||
font-size: 12px;
|
||
line-height: 1.58;
|
||
}
|
||
|
||
main {
|
||
min-width: 0;
|
||
padding: 34px 42px 58px;
|
||
}
|
||
|
||
.hero {
|
||
position: relative;
|
||
overflow: hidden;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background:
|
||
linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(238, 247, 244, 0.92)),
|
||
var(--surface);
|
||
box-shadow: var(--shadow);
|
||
}
|
||
|
||
.hero::before {
|
||
content: "";
|
||
position: absolute;
|
||
inset: 0;
|
||
pointer-events: none;
|
||
background-image:
|
||
linear-gradient(rgba(15, 118, 110, 0.08) 1px, transparent 1px),
|
||
linear-gradient(90deg, rgba(15, 118, 110, 0.08) 1px, transparent 1px);
|
||
background-size: 28px 28px;
|
||
mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.9), transparent 72%);
|
||
}
|
||
|
||
.hero-inner {
|
||
position: relative;
|
||
display: grid;
|
||
grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
|
||
gap: 18px;
|
||
align-items: stretch;
|
||
padding: 30px;
|
||
}
|
||
|
||
.eyebrow {
|
||
display: inline-flex;
|
||
gap: 8px;
|
||
align-items: center;
|
||
margin-bottom: 12px;
|
||
color: var(--teal-deep);
|
||
font-size: 12px;
|
||
font-weight: 900;
|
||
}
|
||
|
||
.eyebrow::before {
|
||
content: "";
|
||
width: 24px;
|
||
height: 2px;
|
||
background: var(--teal);
|
||
}
|
||
|
||
h1,
|
||
h2,
|
||
h3 {
|
||
margin: 0;
|
||
letter-spacing: 0;
|
||
line-height: 1.18;
|
||
}
|
||
|
||
h1 {
|
||
max-width: 780px;
|
||
font-size: clamp(30px, 4vw, 54px);
|
||
font-weight: 920;
|
||
}
|
||
|
||
h2 {
|
||
font-size: 27px;
|
||
font-weight: 900;
|
||
}
|
||
|
||
h3 {
|
||
font-size: 18px;
|
||
font-weight: 880;
|
||
}
|
||
|
||
p {
|
||
margin: 0;
|
||
}
|
||
|
||
.lead {
|
||
max-width: 800px;
|
||
margin-top: 18px;
|
||
color: var(--ink-soft);
|
||
font-size: 16px;
|
||
line-height: 1.8;
|
||
}
|
||
|
||
.hero-metrics {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||
gap: 10px;
|
||
align-content: start;
|
||
}
|
||
|
||
.metric {
|
||
min-height: 126px;
|
||
padding: 16px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: rgba(255, 255, 255, 0.86);
|
||
box-shadow: var(--shadow-soft);
|
||
}
|
||
|
||
.metric-value {
|
||
color: var(--teal-deep);
|
||
font-size: 24px;
|
||
font-weight: 920;
|
||
line-height: 1.1;
|
||
}
|
||
|
||
.metric-label {
|
||
margin-top: 8px;
|
||
color: var(--ink);
|
||
font-weight: 850;
|
||
}
|
||
|
||
.metric-desc {
|
||
margin-top: 6px;
|
||
color: var(--muted);
|
||
font-size: 12px;
|
||
line-height: 1.55;
|
||
}
|
||
|
||
.doc-meta {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 8px;
|
||
margin-top: 18px;
|
||
}
|
||
|
||
.tag {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
min-height: 28px;
|
||
padding: 4px 9px;
|
||
border: 1px solid var(--line);
|
||
border-radius: 8px;
|
||
background: rgba(255, 255, 255, 0.74);
|
||
color: var(--ink-soft);
|
||
font-size: 12px;
|
||
font-weight: 760;
|
||
}
|
||
|
||
.section {
|
||
margin-top: 34px;
|
||
padding: 28px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: rgba(255, 255, 255, 0.92);
|
||
box-shadow: var(--shadow-soft);
|
||
}
|
||
|
||
.section-head {
|
||
display: grid;
|
||
gap: 10px;
|
||
max-width: 860px;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.section-kicker {
|
||
color: var(--teal-deep);
|
||
font-size: 12px;
|
||
font-weight: 900;
|
||
}
|
||
|
||
.section-desc {
|
||
color: var(--ink-soft);
|
||
font-size: 15px;
|
||
line-height: 1.8;
|
||
}
|
||
|
||
.grid {
|
||
display: grid;
|
||
gap: 14px;
|
||
}
|
||
|
||
.cols-2 {
|
||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||
}
|
||
|
||
.cols-3 {
|
||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||
}
|
||
|
||
.cols-4 {
|
||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||
}
|
||
|
||
.card {
|
||
min-width: 0;
|
||
padding: 18px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: var(--surface);
|
||
}
|
||
|
||
.card strong {
|
||
display: block;
|
||
margin-bottom: 8px;
|
||
color: var(--ink);
|
||
font-size: 15px;
|
||
font-weight: 880;
|
||
}
|
||
|
||
.card p {
|
||
color: var(--ink-soft);
|
||
line-height: 1.72;
|
||
}
|
||
|
||
.card small {
|
||
display: block;
|
||
margin-top: 12px;
|
||
color: var(--muted);
|
||
font-family: var(--mono);
|
||
font-size: 11px;
|
||
line-height: 1.55;
|
||
}
|
||
|
||
.accent-teal {
|
||
border-top: 4px solid var(--teal);
|
||
}
|
||
|
||
.accent-blue {
|
||
border-top: 4px solid var(--blue);
|
||
}
|
||
|
||
.accent-amber {
|
||
border-top: 4px solid var(--amber);
|
||
}
|
||
|
||
.accent-red {
|
||
border-top: 4px solid var(--red);
|
||
}
|
||
|
||
.callout {
|
||
display: grid;
|
||
gap: 8px;
|
||
margin: 18px 0 0;
|
||
padding: 16px 18px;
|
||
border: 1px solid var(--line-strong);
|
||
border-left: 4px solid var(--teal);
|
||
border-radius: var(--radius);
|
||
background: var(--surface-strong);
|
||
}
|
||
|
||
.callout-title {
|
||
color: var(--teal-deep);
|
||
font-weight: 900;
|
||
}
|
||
|
||
.callout p {
|
||
color: var(--ink-soft);
|
||
}
|
||
|
||
.deep-copy {
|
||
display: grid;
|
||
gap: 12px;
|
||
margin-bottom: 18px;
|
||
color: var(--ink-soft);
|
||
font-size: 15px;
|
||
line-height: 1.86;
|
||
}
|
||
|
||
.evidence-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||
gap: 12px;
|
||
margin: 18px 0;
|
||
}
|
||
|
||
.evidence-card {
|
||
min-width: 0;
|
||
padding: 16px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: var(--surface-soft);
|
||
}
|
||
|
||
.evidence-card strong {
|
||
display: block;
|
||
margin-bottom: 8px;
|
||
color: var(--teal-deep);
|
||
font-size: 17px;
|
||
font-weight: 920;
|
||
}
|
||
|
||
.evidence-card span {
|
||
display: block;
|
||
color: var(--ink-soft);
|
||
font-size: 13px;
|
||
line-height: 1.65;
|
||
}
|
||
|
||
.split {
|
||
display: grid;
|
||
grid-template-columns: minmax(0, 0.96fr) minmax(340px, 1.04fr);
|
||
gap: 18px;
|
||
align-items: start;
|
||
}
|
||
|
||
.bullets {
|
||
display: grid;
|
||
gap: 10px;
|
||
margin: 0;
|
||
padding: 0;
|
||
list-style: none;
|
||
}
|
||
|
||
.bullets li {
|
||
position: relative;
|
||
padding-left: 20px;
|
||
color: var(--ink-soft);
|
||
}
|
||
|
||
.bullets li::before {
|
||
content: "";
|
||
position: absolute;
|
||
top: 0.78em;
|
||
left: 0;
|
||
width: 7px;
|
||
height: 7px;
|
||
border-radius: 99px;
|
||
background: var(--teal);
|
||
}
|
||
|
||
.process {
|
||
display: grid;
|
||
gap: 10px;
|
||
margin-top: 14px;
|
||
}
|
||
|
||
.process-step {
|
||
display: grid;
|
||
grid-template-columns: 34px minmax(0, 1fr);
|
||
gap: 12px;
|
||
align-items: start;
|
||
padding: 12px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: var(--surface-soft);
|
||
}
|
||
|
||
.step-no {
|
||
display: grid;
|
||
width: 34px;
|
||
height: 34px;
|
||
place-items: center;
|
||
border-radius: 8px;
|
||
background: #102f2b;
|
||
color: #fff;
|
||
font-family: var(--mono);
|
||
font-size: 12px;
|
||
font-weight: 900;
|
||
}
|
||
|
||
.step-title {
|
||
color: var(--ink);
|
||
font-weight: 900;
|
||
}
|
||
|
||
.step-text {
|
||
margin-top: 4px;
|
||
color: var(--ink-soft);
|
||
line-height: 1.65;
|
||
}
|
||
|
||
.diagram {
|
||
overflow: hidden;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: #fbfdfc;
|
||
}
|
||
|
||
.diagram svg {
|
||
display: block;
|
||
width: 100%;
|
||
height: auto;
|
||
}
|
||
|
||
.diagram-caption {
|
||
padding: 12px 16px;
|
||
border-top: 1px solid var(--line);
|
||
color: var(--muted);
|
||
font-size: 12px;
|
||
line-height: 1.55;
|
||
}
|
||
|
||
.flow-diagram {
|
||
display: grid;
|
||
gap: 16px;
|
||
padding: 18px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: #fbfdfc;
|
||
}
|
||
|
||
.flow-row {
|
||
display: grid;
|
||
grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr));
|
||
gap: 12px;
|
||
align-items: stretch;
|
||
}
|
||
|
||
.flow-node {
|
||
position: relative;
|
||
min-width: 0;
|
||
min-height: 86px;
|
||
padding: 14px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: var(--surface);
|
||
box-shadow: var(--shadow-soft);
|
||
}
|
||
|
||
.flow-node::after {
|
||
content: "→";
|
||
position: absolute;
|
||
top: 50%;
|
||
right: -13px;
|
||
z-index: 1;
|
||
transform: translateY(-50%);
|
||
color: var(--teal);
|
||
font-size: 18px;
|
||
font-weight: 900;
|
||
}
|
||
|
||
.flow-row .flow-node:last-child::after,
|
||
.flow-node.no-arrow::after {
|
||
display: none;
|
||
}
|
||
|
||
.flow-node.dark {
|
||
border-color: #102f2b;
|
||
background: #102f2b;
|
||
color: #fff;
|
||
}
|
||
|
||
.flow-node.amber {
|
||
border-color: #ecd0a5;
|
||
background: #fff8eb;
|
||
}
|
||
|
||
.flow-node.blue {
|
||
border-color: #c7d8f3;
|
||
background: #f0f6ff;
|
||
}
|
||
|
||
.flow-node-title {
|
||
color: inherit;
|
||
font-size: 14px;
|
||
font-weight: 900;
|
||
line-height: 1.35;
|
||
}
|
||
|
||
.flow-node-text {
|
||
margin-top: 7px;
|
||
color: var(--muted);
|
||
font-size: 12px;
|
||
line-height: 1.58;
|
||
}
|
||
|
||
.flow-node.dark .flow-node-text {
|
||
color: rgba(255, 255, 255, 0.74);
|
||
}
|
||
|
||
.flow-band {
|
||
padding: 14px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: var(--surface-strong);
|
||
text-align: center;
|
||
}
|
||
|
||
.flow-band strong {
|
||
display: block;
|
||
color: var(--teal-deep);
|
||
font-weight: 920;
|
||
}
|
||
|
||
.flow-band span {
|
||
display: block;
|
||
margin-top: 5px;
|
||
color: var(--ink-soft);
|
||
font-size: 12px;
|
||
}
|
||
|
||
.flow-loop {
|
||
padding: 12px 14px;
|
||
border: 1px dashed var(--line-strong);
|
||
border-radius: var(--radius);
|
||
color: var(--ink-soft);
|
||
font-size: 13px;
|
||
line-height: 1.62;
|
||
text-align: center;
|
||
}
|
||
|
||
.module-list {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||
gap: 12px;
|
||
}
|
||
|
||
.module-item {
|
||
padding: 16px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: var(--surface);
|
||
}
|
||
|
||
.module-title {
|
||
margin-bottom: 8px;
|
||
color: var(--ink);
|
||
font-weight: 900;
|
||
}
|
||
|
||
.module-desc {
|
||
color: var(--ink-soft);
|
||
line-height: 1.68;
|
||
}
|
||
|
||
.code-row {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 7px;
|
||
margin-top: 12px;
|
||
}
|
||
|
||
.code-chip {
|
||
padding: 3px 7px;
|
||
border: 1px solid var(--line);
|
||
border-radius: 6px;
|
||
background: var(--surface-soft);
|
||
color: var(--teal-deep);
|
||
font-family: var(--mono);
|
||
font-size: 11px;
|
||
}
|
||
|
||
.gallery {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||
gap: 16px;
|
||
}
|
||
|
||
figure {
|
||
margin: 0;
|
||
overflow: hidden;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: var(--surface);
|
||
box-shadow: var(--shadow-soft);
|
||
}
|
||
|
||
figure img {
|
||
width: 100%;
|
||
aspect-ratio: 16 / 9;
|
||
object-fit: cover;
|
||
object-position: top left;
|
||
border-bottom: 1px solid var(--line);
|
||
background: #edf2ef;
|
||
}
|
||
|
||
figcaption {
|
||
padding: 12px 14px 14px;
|
||
color: var(--ink-soft);
|
||
font-size: 13px;
|
||
line-height: 1.62;
|
||
}
|
||
|
||
figcaption strong {
|
||
display: block;
|
||
margin-bottom: 4px;
|
||
color: var(--ink);
|
||
font-size: 14px;
|
||
font-weight: 880;
|
||
}
|
||
|
||
.formula {
|
||
margin-top: 14px;
|
||
padding: 16px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: #101a16;
|
||
color: #edf8f4;
|
||
font-family: var(--mono);
|
||
font-size: 12.5px;
|
||
line-height: 1.72;
|
||
overflow: auto;
|
||
white-space: pre;
|
||
}
|
||
|
||
.timeline {
|
||
display: grid;
|
||
gap: 10px;
|
||
margin-top: 14px;
|
||
}
|
||
|
||
.timeline-item {
|
||
display: grid;
|
||
grid-template-columns: 118px minmax(0, 1fr);
|
||
gap: 14px;
|
||
padding: 14px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: var(--surface);
|
||
}
|
||
|
||
.timeline-phase {
|
||
color: var(--teal-deep);
|
||
font-weight: 900;
|
||
}
|
||
|
||
.timeline-text {
|
||
color: var(--ink-soft);
|
||
}
|
||
|
||
.footer {
|
||
margin-top: 34px;
|
||
padding: 22px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: #102f2b;
|
||
color: rgba(255, 255, 255, 0.82);
|
||
}
|
||
|
||
.footer strong {
|
||
display: block;
|
||
margin-bottom: 8px;
|
||
color: #fff;
|
||
font-size: 16px;
|
||
}
|
||
|
||
.source-list {
|
||
display: grid;
|
||
gap: 10px;
|
||
margin: 0;
|
||
padding: 0;
|
||
list-style: none;
|
||
}
|
||
|
||
.source-list li {
|
||
padding: 12px 14px;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
background: var(--surface);
|
||
color: var(--ink-soft);
|
||
}
|
||
|
||
.source-list a {
|
||
color: var(--teal-deep);
|
||
font-weight: 850;
|
||
text-decoration: underline;
|
||
text-underline-offset: 3px;
|
||
}
|
||
|
||
/* 竞品分析表格样式 */
|
||
.comp-table-wrapper {
|
||
width: 100%;
|
||
overflow-x: auto;
|
||
margin: 24px 0;
|
||
border: 1px solid var(--line);
|
||
border-radius: var(--radius);
|
||
box-shadow: var(--shadow-soft);
|
||
background: var(--surface);
|
||
}
|
||
|
||
.comp-table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
text-align: left;
|
||
font-size: 13px;
|
||
}
|
||
|
||
.comp-table th,
|
||
.comp-table td {
|
||
padding: 14px 16px;
|
||
border-bottom: 1px solid var(--line);
|
||
vertical-align: top;
|
||
line-height: 1.68;
|
||
}
|
||
|
||
.comp-table th {
|
||
background: var(--surface-strong);
|
||
color: var(--teal-deep);
|
||
font-weight: 900;
|
||
font-size: 13.5px;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.comp-table tr:last-child td {
|
||
border-bottom: none;
|
||
}
|
||
|
||
.comp-table tr:hover td {
|
||
background: var(--surface-soft);
|
||
}
|
||
|
||
.comp-highlight {
|
||
background: var(--teal-soft);
|
||
font-weight: 850;
|
||
color: var(--teal-deep);
|
||
}
|
||
|
||
.comp-table td ul {
|
||
margin: 0;
|
||
padding-left: 18px;
|
||
}
|
||
|
||
.comp-table td li {
|
||
margin-bottom: 4px;
|
||
}
|
||
|
||
/* 痛点方案卡片微动效与特色样式 */
|
||
.card {
|
||
transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.22s ease, border-color 0.22s ease;
|
||
}
|
||
|
||
.card:hover {
|
||
transform: translateY(-2px);
|
||
box-shadow: var(--shadow-soft);
|
||
border-color: var(--teal);
|
||
}
|
||
|
||
.twin-sandbox-card {
|
||
grid-column: span 2;
|
||
background: linear-gradient(135deg, var(--surface) 60%, var(--teal-soft) 100%);
|
||
border: 1px solid var(--line-strong);
|
||
}
|
||
|
||
.twin-sandbox-badge {
|
||
display: inline-block;
|
||
padding: 2px 8px;
|
||
background: var(--teal-deep);
|
||
color: #fff;
|
||
font-size: 11px;
|
||
border-radius: 99px;
|
||
margin-bottom: 8px;
|
||
font-weight: 850;
|
||
}
|
||
|
||
@media (max-width: 1024px) {
|
||
.twin-sandbox-card {
|
||
grid-column: span 1;
|
||
}
|
||
}
|
||
|
||
/* 仿真沙盘交互组件样式 */
|
||
.twin-simulator-box {
|
||
margin-top: 20px;
|
||
padding: 18px;
|
||
border: 1px solid var(--line-strong);
|
||
border-radius: var(--radius);
|
||
background: rgba(15, 118, 110, 0.03);
|
||
backdrop-filter: blur(10px);
|
||
}
|
||
|
||
.twin-sim-title {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
font-size: 13px;
|
||
font-weight: 900;
|
||
color: var(--teal-deep);
|
||
margin-bottom: 14px;
|
||
border-bottom: 1px dashed var(--line);
|
||
padding-bottom: 8px;
|
||
}
|
||
|
||
.sim-dot {
|
||
width: 8px;
|
||
height: 8px;
|
||
background: var(--teal);
|
||
border-radius: 50%;
|
||
animation: pulse 1.8s infinite;
|
||
}
|
||
|
||
@keyframes pulse {
|
||
0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(15, 118, 110, 0.5); }
|
||
70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(15, 118, 110, 0); }
|
||
100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(15, 118, 110, 0); }
|
||
}
|
||
|
||
.twin-sim-layout {
|
||
display: grid;
|
||
grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
|
||
gap: 18px;
|
||
}
|
||
|
||
.twin-sim-ctrl {
|
||
display: grid;
|
||
gap: 12px;
|
||
align-content: start;
|
||
}
|
||
|
||
.ctrl-group {
|
||
display: grid;
|
||
gap: 6px;
|
||
}
|
||
|
||
.ctrl-group label {
|
||
font-size: 12px;
|
||
font-weight: 850;
|
||
color: var(--ink-soft);
|
||
}
|
||
|
||
.ctrl-group select {
|
||
width: 100%;
|
||
height: 34px;
|
||
padding: 0 8px;
|
||
border: 1px solid var(--line);
|
||
border-radius: 6px;
|
||
background: var(--surface);
|
||
color: var(--ink);
|
||
font-size: 12.5px;
|
||
font-family: var(--font);
|
||
outline: none;
|
||
}
|
||
|
||
.ctrl-group select:focus {
|
||
border-color: var(--teal);
|
||
}
|
||
|
||
.highlight-val {
|
||
color: var(--teal-deep);
|
||
font-weight: 900;
|
||
font-family: var(--mono);
|
||
}
|
||
|
||
.ctrl-group input[type="range"] {
|
||
-webkit-appearance: none;
|
||
width: 100%;
|
||
height: 6px;
|
||
border-radius: 3px;
|
||
background: var(--line);
|
||
outline: none;
|
||
}
|
||
|
||
.ctrl-group input[type="range"]::-webkit-slider-thumb {
|
||
-webkit-appearance: none;
|
||
appearance: none;
|
||
width: 16px;
|
||
height: 16px;
|
||
border-radius: 50%;
|
||
background: var(--teal);
|
||
cursor: pointer;
|
||
border: 2px solid var(--surface);
|
||
box-shadow: 0 2px 6px rgba(15,118,110,0.3);
|
||
transition: transform 0.1s ease;
|
||
}
|
||
|
||
.ctrl-group input[type="range"]::-webkit-slider-thumb:hover {
|
||
transform: scale(1.15);
|
||
}
|
||
|
||
.range-labels {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
font-size: 10px;
|
||
color: var(--muted);
|
||
margin-top: 2px;
|
||
font-family: var(--mono);
|
||
}
|
||
|
||
#run-sim-btn {
|
||
width: 100%;
|
||
height: 36px;
|
||
background: var(--teal-deep);
|
||
color: #fff;
|
||
border: none;
|
||
border-radius: 6px;
|
||
font-size: 13px;
|
||
font-weight: 900;
|
||
cursor: pointer;
|
||
box-shadow: 0 4px 12px rgba(16, 47, 43, 0.2);
|
||
transition: all 0.2s ease;
|
||
}
|
||
|
||
#run-sim-btn:hover {
|
||
background: var(--teal);
|
||
transform: translateY(-1px);
|
||
box-shadow: 0 6px 16px rgba(15, 118, 110, 0.3);
|
||
}
|
||
|
||
#run-sim-btn:active {
|
||
transform: translateY(0);
|
||
}
|
||
|
||
.twin-sim-display {
|
||
position: relative;
|
||
border: 1px solid var(--line);
|
||
border-radius: 6px;
|
||
background: var(--surface);
|
||
padding: 12px;
|
||
display: grid;
|
||
align-content: space-between;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.sim-scanner {
|
||
position: absolute;
|
||
top: -100%;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 12px;
|
||
background: linear-gradient(180deg, rgba(15, 118, 110, 0.2) 0%, transparent 100%);
|
||
pointer-events: none;
|
||
z-index: 2;
|
||
}
|
||
|
||
.sim-scanner.scanning {
|
||
animation: scan 1.2s ease-in-out;
|
||
}
|
||
|
||
@keyframes scan {
|
||
0% { top: -10px; }
|
||
100% { top: 100%; }
|
||
}
|
||
|
||
.metric-group {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||
gap: 10px;
|
||
z-index: 1;
|
||
}
|
||
|
||
.sim-metric {
|
||
padding: 8px;
|
||
border: 1px solid var(--surface-strong);
|
||
border-radius: 6px;
|
||
background: var(--surface-soft);
|
||
display: grid;
|
||
gap: 4px;
|
||
}
|
||
|
||
.sim-metric .m-label {
|
||
font-size: 11px;
|
||
color: var(--muted);
|
||
}
|
||
|
||
.sim-metric .m-value {
|
||
font-family: var(--mono);
|
||
font-size: 16px;
|
||
font-weight: 900;
|
||
line-height: 1.1;
|
||
}
|
||
|
||
.sim-metric .m-value.teal { color: var(--teal); }
|
||
.sim-metric .m-value.orange { color: var(--amber); }
|
||
.sim-metric .m-value.red { color: var(--red); }
|
||
.sim-metric .m-value.blue { color: var(--blue); }
|
||
|
||
.sim-report-badge {
|
||
margin-top: 10px;
|
||
padding: 4px;
|
||
border-radius: 4px;
|
||
background: var(--surface-strong);
|
||
color: var(--teal-deep);
|
||
font-size: 10.5px;
|
||
font-weight: 850;
|
||
text-align: center;
|
||
transition: all 0.3s ease;
|
||
z-index: 1;
|
||
}
|
||
|
||
.sim-report-badge.success {
|
||
background: var(--teal-soft);
|
||
color: var(--teal-deep);
|
||
border: 1px solid rgba(15, 118, 110, 0.2);
|
||
}
|
||
|
||
@media (max-width: 580px) {
|
||
.twin-sim-layout {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
}
|
||
|
||
@media (max-width: 1500px) {
|
||
.page {
|
||
grid-template-columns: 236px minmax(0, 1fr);
|
||
}
|
||
|
||
.toc {
|
||
display: none;
|
||
}
|
||
|
||
.split {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
}
|
||
|
||
@media (max-width: 1180px) {
|
||
.flow-row {
|
||
grid-template-columns: 1fr !important;
|
||
}
|
||
|
||
.flow-node::after {
|
||
top: auto;
|
||
right: 50%;
|
||
bottom: -18px;
|
||
transform: translateX(50%) rotate(90deg);
|
||
}
|
||
}
|
||
|
||
@media (max-width: 880px) {
|
||
.page {
|
||
display: block;
|
||
}
|
||
|
||
.sidebar {
|
||
position: relative;
|
||
height: auto;
|
||
border-right: 0;
|
||
border-bottom: 1px solid var(--line);
|
||
}
|
||
|
||
.nav {
|
||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||
}
|
||
|
||
main {
|
||
padding: 22px 16px 44px;
|
||
}
|
||
|
||
.hero-inner,
|
||
.split,
|
||
.cols-2,
|
||
.cols-3,
|
||
.cols-4,
|
||
.evidence-grid,
|
||
.module-list,
|
||
.gallery {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
|
||
.hero-inner,
|
||
.section {
|
||
padding: 20px;
|
||
}
|
||
|
||
.hero-metrics {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
|
||
.timeline-item {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
}
|
||
|
||
@media print {
|
||
body {
|
||
background: #fff;
|
||
}
|
||
|
||
.page {
|
||
display: block;
|
||
}
|
||
|
||
.sidebar,
|
||
.toc {
|
||
display: none;
|
||
}
|
||
|
||
main {
|
||
padding: 0;
|
||
}
|
||
|
||
.section,
|
||
.hero,
|
||
figure {
|
||
break-inside: avoid;
|
||
box-shadow: none;
|
||
}
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="page">
|
||
<aside class="sidebar">
|
||
<div class="brand">
|
||
<div class="brand-line">
|
||
<div class="brand-mark">XF</div>
|
||
<div>
|
||
<div class="brand-title">智能费控平台</div>
|
||
<div class="brand-subtitle">X-Financial 核心说明</div>
|
||
</div>
|
||
</div>
|
||
<p class="brand-subtitle">
|
||
本文档基于当前项目模块、架构文档、后端服务与页面截图整理，
|
||
用于产品介绍、内部汇报和方案评审。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="nav-label">文档导航</div>
|
||
<nav class="nav" aria-label="主导航">
|
||
<a href="#why"><span class="dot"></span>为什么要做</a>
|
||
<a href="#future"><span class="dot"></span>未来地位</a>
|
||
<a href="#blue"><span class="dot"></span>蓝海空间</a>
|
||
<a href="#competitor-analysis"><span class="dot"></span>竞品对比</a>
|
||
<a href="#painpoints-solution"><span class="dot"></span>痛点解决</a>
|
||
<a href="#goal"><span class="dot"></span>开发目的</a>
|
||
<a href="#algorithms"><span class="dot"></span>核心算法</a>
|
||
<a href="#modules"><span class="dot"></span>项目模块</a>
|
||
<a href="#architecture"><span class="dot"></span>架构图</a>
|
||
<a href="#ontology"><span class="dot"></span>本体语义层</a>
|
||
<a href="#screens"><span class="dot"></span>关键页面</a>
|
||
<a href="#roadmap"><span class="dot"></span>演进路线</a>
|
||
<a href="#sources"><span class="dot"></span>趋势来源</a>
|
||
</nav>
|
||
|
||
<div class="side-note">
|
||
关键词：费控画像、预算占比、规则中心、双智能体循环、Hermes 数字员工、
|
||
本体语义层、RAG 知识检索、风险解释、财务洞察。
|
||
</div>
|
||
</aside>
|
||
|
||
<main>
|
||
<header class="hero" id="top">
|
||
<div class="hero-inner">
|
||
<div>
|
||
<div class="eyebrow">X-Financial / Intelligent Expense Control</div>
|
||
<h1>从报销工具，到企业费用智能操作系统</h1>
|
||
<p class="lead">
|
||
智能费控平台的核心价值，不是把传统审批流程搬到线上，
|
||
而是把费用、预算、组织、制度、票据、行为画像和智能体能力
|
||
连接成一套可解释、可追溯、可持续进化的企业财务风控中枢。
|
||
</p>
|
||
<div class="doc-meta">
|
||
<span class="tag">面向管理层</span>
|
||
<span class="tag">面向财务共享</span>
|
||
<span class="tag">面向研发评审</span>
|
||
<span class="tag">HTML 单页文档</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="hero-metrics" aria-label="核心摘要">
|
||
<div class="metric">
|
||
<div class="metric-value">2 层</div>
|
||
<div class="metric-label">双智能体循环</div>
|
||
<div class="metric-desc">User Agent 处理用户操作；Hermes 在后台持续巡检数据与流转风险。</div>
|
||
</div>
|
||
<div class="metric">
|
||
<div class="metric-value">10+</div>
|
||
<div class="metric-label">业务模块</div>
|
||
<div class="metric-desc">覆盖总览、单据、预算、规则、数字员工、知识库、日志和设置。</div>
|
||
</div>
|
||
<div class="metric">
|
||
<div class="metric-value">8 字段</div>
|
||
<div class="metric-label">本体协议核心</div>
|
||
<div class="metric-desc">domain、scenario、intent、entities、time_range、constraints、risk_signals、next_step。</div>
|
||
</div>
|
||
<div class="metric">
|
||
<div class="metric-value">4 类</div>
|
||
<div class="metric-label">画像与风控算法</div>
|
||
<div class="metric-desc">申请人费用画像、员工行为画像、预算费用模型、规则/本体/RAG 分析。</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<section class="section" id="why">
|
||
<div class="section-head">
|
||
<div class="section-kicker">01 / WHY</div>
|
||
<h2>为什么要做智能费控平台</h2>
|
||
<p class="section-desc">
|
||
智能费控不是把报销审批电子化，而是把企业每一笔支出变成可理解、可预测、可解释的经营信号。
|
||
当前，在金税四期深化、数电发票单轨制全面普及的政策背景下，传统的“后置流程型”费控已被逼入死胡同，企业必须构建全链路智能费控平台。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="deep-copy">
|
||
<p>
|
||
第一，<strong>数电票时代倒逼全链路数字化</strong>。随着全国数电发票的单轨制落地，发票的真伪验重、多系统抵扣、合规归档以及全生命周期的追踪已无法通过传统人工肉眼或零散的OCR识别来解决。系统必须具备在发票导入瞬间进行结构化解析、关联交易比对、业务事由交叉匹配的自动化能力，实现“开票即采集、采集即验真、入账即归档”。
|
||
</p>
|
||
<p>
|
||
第二，<strong>企业从“事后核销”向“事前控制”的主动性跨越</strong>。传统ERP与报销系统核心是“记账与流程审批”，当员工提交报销单时，费用早已产生。智能费控利用 RAG 知识检索、预算实时联动，在费用申请阶段甚至消费发生的瞬间（如因公商旅预订）就进行预算额度校验与制度约束，使费控前置到决策端。
|
||
</p>
|
||
<p>
|
||
第三，<strong>费用舞弊与异常的隐性化、复杂化</strong>。根据 ACFE 2024 年《全球职业舞弊与滥用报告》显示，全球企业中约有 15% 的舞弊案件与费用报销直接相关，且平均潜伏期长达 18 个月。传统的强硬制度配置只能拦截“超标准”、“无附件”等显性异常，但对于拆单报销、异地多点异常消费、同组偏离度过高、长期合作供应商异常开票等隐性风控，需要基于大数据画像和语义关系的图谱检测。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="evidence-grid" aria-label="趋势证据">
|
||
<div class="evidence-card">
|
||
<strong>59%</strong>
|
||
<span>Gartner 2025 年调研显示，财务 AI 采用率已达到约六成，知识管理、应付自动化和异常检测是高频用例。</span>
|
||
</div>
|
||
<div class="evidence-card">
|
||
<strong>85%</strong>
|
||
<span>McKinsey CFO Pulse 提到，多数 CFO 期待 AI 生成洞察、减少手工分析，把财务人员释放到更高价值工作。</span>
|
||
</div>
|
||
<div class="evidence-card">
|
||
<strong>25%</strong>
|
||
<span>Salesforce 2025 年 CFO 调研显示，CFO 平均把约四分之一 AI 预算投向 AI Agent，数字劳动力进入预算层。</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="grid cols-2">
|
||
<article class="card accent-teal">
|
||
<strong>1. 从事后核销，变成事前控制</strong>
|
||
<p>
|
||
传统系统往往在报销单提交后才发现问题，智能费控可以在申请阶段就识别预算余量、
|
||
费用类型、地点、票据要求和制度约束。这样报销不是最后一关，而是从费用发生前就开始的控制链路。
|
||
</p>
|
||
</article>
|
||
<article class="card accent-blue">
|
||
<strong>2. 从人找规则，变成规则找风险</strong>
|
||
<p>
|
||
制度、Excel 规则、风险 JSON、知识库和历史记录被统一纳入规则中心与本体语义层，
|
||
系统可以自动给出命中原因、制度依据和补正建议，减少审批人凭经验反复判断。
|
||
</p>
|
||
</article>
|
||
<article class="card accent-amber">
|
||
<strong>3. 从部门口径，变成企业费用画像</strong>
|
||
<p>
|
||
部门、岗位、职级、费用类型、预算池、审批质量和 AI 协作记录共同构成画像，
|
||
让财务看到“为什么这个单据值得关注”，也让部门负责人知道费用结构是否偏离经营节奏。
|
||
</p>
|
||
</article>
|
||
<article class="card accent-red">
|
||
<strong>4. 从流程系统，变成智能运营中枢</strong>
|
||
<p>
|
||
Hermes 数字员工可以按计划巡检风险、生成报告、汇总异常、沉淀优化候选，
|
||
让财务团队从重复检查转向规则治理、预算策略、风险决策和经营分析。
|
||
</p>
|
||
</article>
|
||
</div>
|
||
|
||
<div class="callout">
|
||
<div class="callout-title">一句话定位</div>
|
||
<p>
|
||
智能费控平台不是“更漂亮的报销页面”，而是企业经营数据进入财务风控体系的语义入口，
|
||
也是未来 AI 财务中台最容易落地、最容易证明价值的入口之一。
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section" id="future">
|
||
<div class="section-head">
|
||
<div class="section-kicker">02 / COMPANY POSITION</div>
|
||
<h2>费控在未来公司的地位</h2>
|
||
<p class="section-desc">
|
||
未来公司的费控，会从“报销审批工具”变成“企业费用智能操作系统”（Expense OS）。
|
||
它一端连接员工和部门的真实业务动作，另一端连接预算、现金流、成本、风险、制度和管理决策。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="deep-copy">
|
||
<p>
|
||
从<strong>组织分工与决策支持</strong>来看，CFO 的角色正加速从“合规记录者”转变为“战略业务伙伴（HR/IT/业务协同的中心）”。Deloitte 2025 年未来财务展望报告指出，财务部门未来的工作精力将有 70% 倾斜于数据分析和未来预测。智能费控则是这一变革的第一步——通过把一线经营活动（如差旅、招待、项目交付）产生的每一笔资金流动转化为语义数据，为 CFO 的“战略驾驶舱”提供实时的一手信号。
|
||
</p>
|
||
<p>
|
||
从<strong>预算与资源控制</strong>来看，未来的预算管控不再是“年初编预算，月底对账单”的静态割裂状态。智能费控通过建立动态预算池与资金控制链，使预算能够在秒级发生响应。这保证了业务部门在项目推进过程中，能实时感知每一笔花费对项目整体毛利空间、部门现金流余量的动态影响，促使人人关注经营效果。
|
||
</p>
|
||
<p>
|
||
从<strong>业务运营与体验</strong>来看，智能费控是消除部门隔阂、降低一线行政摩擦的“润滑剂”。当平台实现高度数字化与免报销消费结算时，员工不再需要贴票垫资，管理者不再需要在审批页面盲目点“同意”，财务不再需要枯燥审单，整个公司的运营效率将得到数量级提升。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="split">
|
||
<div>
|
||
<ul class="bullets">
|
||
<li><strong>经营支出中枢 (Expense OS)：</strong> 将多系统的零散流程、差旅出行、第三方消费直接通过本体层收归统一。</li>
|
||
<li><strong>预算守护雷达：</strong> 在业务动作发生时实现“秒级预算占用与测算”，而不是事后核销时的“超支警告”。</li>
|
||
<li><strong>合规内控防火墙：</strong> 结合发票验真、合同信息、行程轨迹和行为偏差等多模态数据对风险自动拦截。</li>
|
||
<li><strong>战略决策沙盘：</strong> 支持 CFO 和高管直接询问“各项目利润健康度”、“政策变动预算消耗预测”等深度命题。</li>
|
||
<li><strong>自进化规则工厂：</strong> 依据历史人工审批意见和申诉结果，系统能自动推荐规则优化方案，实现制度灰度升级。</li>
|
||
</ul>
|
||
</div>
|
||
<div>
|
||
<div class="flow-diagram" aria-label="费控未来地位流程图">
|
||
<div class="flow-row" style="--cols: 3">
|
||
<div class="flow-node">
|
||
<div class="flow-node-title">业务场景</div>
|
||
<div class="flow-node-text">差旅、招待、采购、项目外包、会务支出</div>
|
||
</div>
|
||
<div class="flow-node dark">
|
||
<div class="flow-node-title">费用智能操作系统</div>
|
||
<div class="flow-node-text">本体语义 · 实时预算 · 智能体 · 仿真沙盘</div>
|
||
</div>
|
||
<div class="flow-node">
|
||
<div class="flow-node-title">经营结果</div>
|
||
<div class="flow-node-text">成本优化、合规账套、税务风险减免、现金流稳健</div>
|
||
</div>
|
||
</div>
|
||
<div class="flow-row" style="--cols: 3">
|
||
<div class="flow-node blue">
|
||
<div class="flow-node-title">CFO 战略看板</div>
|
||
<div class="flow-node-text">业财融合数据、动态毛利预警、资金利用率</div>
|
||
</div>
|
||
<div class="flow-node amber">
|
||
<div class="flow-node-title">数字孪生仿真</div>
|
||
<div class="flow-node-text">制度变动测算、预算优化预测、行为偏差度</div>
|
||
</div>
|
||
<div class="flow-node blue">
|
||
<div class="flow-node-title">协同平台</div>
|
||
<div class="flow-node-text">免贴票、即时审批、智能助手交互</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="diagram-caption">
|
||
智能费控平台向上承接公司战略与预算规则，向下沉入业务一线动作，最终演化为企业支出的全局操作系统。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section" id="blue">
|
||
<div class="section-head">
|
||
<div class="section-kicker">03 / BLUE OCEAN</div>
|
||
<h2>智能分析费控平台的蓝海</h2>
|
||
<p class="section-desc">
|
||
传统的报销系统、OA 工作流和财务共享软件已是一片红海，产品竞争停留在表单设计与流程配置层面。而真正能为企业带来颠覆性价值的“智能费控蓝海”，则存在于从流程处理到智能化决策预测的跃迁中。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="deep-copy">
|
||
<p>
|
||
根据全球著名调研机构 Grand View Research 2025 发布的市场预测报告，全球差旅与费用管理（T&E）软件市场规模在 2030 年将达到 <strong>106.9 亿美元</strong>，2024 至 2030 年的复合年增长率（CAGR）高达 <strong>16.9%</strong>。报告中特别强调，市场增长的核心引擎已不再是单纯的“线上化审批”，而是引入 AI Agent 进行决策自动化、基于 OCR/LLM 的隐性欺诈检测、以及基于企业历史支出行为的可持续 ESG 碳足迹追踪。这表明，“费用智能化与经营沙盘仿真”是蕴含巨大商业溢价的崭新蓝海。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="grid cols-3">
|
||
<article class="card">
|
||
<strong>1. 认知与决策型 AI Agent</strong>
|
||
<p>从“机械填表和固定规则校验”跨越到“能基于上下文自主决策、异常判定、并提供人机协同解释”的财务数字员工。</p>
|
||
</article>
|
||
<article class="card">
|
||
<strong>2. 财务数字孪生与政策仿真</strong>
|
||
<p>基于公司历史发票、人员组织、预算规则建立仿真模型，模拟差旅标准或预算政策调整后，对企业资金流与利润的实际影响。</p>
|
||
</article>
|
||
<article class="card">
|
||
<strong>3. 多源异构数据语义对齐</strong>
|
||
<p>打破各子系统（CRM、ERP、OA、商旅聚合商）接口壁垒，利用 Semantic Ontology 本体语义层实现业务数据的天然降维对齐。</p>
|
||
</article>
|
||
<article class="card">
|
||
<strong>4. 行为偏离与隐性欺诈识别</strong>
|
||
<p>基于知识图谱与图机器学习技术，识别跨期拆单、虚假报销、同组偏离异常、跨部门关联交易等人工难以察觉的系统性风险。</p>
|
||
</article>
|
||
<article class="card">
|
||
<strong>5. 自进化规则治理闭环</strong>
|
||
<p>支持自然语言输入制度，由 LLM 自动翻译成系统执行规则，并通过人工申诉与退回反馈，在后台自动完成规则库的校准 and 修正。</p>
|
||
</article>
|
||
<article class="card">
|
||
<strong>6. 绿色财务与 ESG 碳足迹</strong>
|
||
<p>在费控和商旅端自动提取交通工具、酒店的排放系数，帮助企业在进行费用管控的同时，同步测算并生成企业 ESG 碳足迹报告。</p>
|
||
</article>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section" id="competitor-analysis">
|
||
<div class="section-head">
|
||
<div class="section-kicker">03.1 / COMPETITORS</div>
|
||
<h2>主流费控系统竞品分析</h2>
|
||
<p class="section-desc">
|
||
要实现上述蓝海构想，必须客观分析当前市场上主流的费控软件。各大软件定位明确，但普遍在“智能化决策”、“跨系统语义融合”及“政策仿真”方面存在显著痛点。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="comp-table-wrapper">
|
||
<table class="comp-table">
|
||
<thead>
|
||
<tr>
|
||
<th style="width: 14%">竞品名称</th>
|
||
<th style="width: 25%">核心定位与主要优势</th>
|
||
<th style="width: 28%">核心痛点与局限性</th>
|
||
<th style="width: 33%">X-Financial 的创新解决与差异化</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td><strong>SAP Concur</strong></td>
|
||
<td>
|
||
<ul>
|
||
<li>全球化费控天花板，支持多币种、多税制、全球财税合规。</li>
|
||
<li>商旅生态极其成熟，能够与 SAP ERP 体系深度咬合。</li>
|
||
</ul>
|
||
</td>
|
||
<td>
|
||
<ul>
|
||
<li>本土化体验被国内用户诟病（如数电发票处理缓慢）。</li>
|
||
<li>系统界面臃肿，配置与二次开发极为繁琐。</li>
|
||
<li>实施周期漫长，运维与实施费用极其高昂。</li>
|
||
</ul>
|
||
</td>
|
||
<td class="comp-highlight">
|
||
<ul>
|
||
<li>原生适配数电发票单轨制，具备开箱即用的 AI 智能验真归档。</li>
|
||
<li>基于本地化轻量级大模型架构，大幅降低实施门槛和部署成本。</li>
|
||
</ul>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>分贝通</strong></td>
|
||
<td>
|
||
<ul>
|
||
<li>以商旅消费支付为切入点，打造“商旅+支付+费控”模式。</li>
|
||
<li>倡导“无需报销”体验，员工体验极佳。</li>
|
||
</ul>
|
||
</td>
|
||
<td>
|
||
<ul>
|
||
<li>强依赖平台内置的消费商城生态，在面对大量零星线下费用、外包采购时灵活性不足。</li>
|
||
<li>对于复杂的多级跨账簿预算、动态共享额度的精细化管控能力相对偏弱。</li>
|
||
</ul>
|
||
</td>
|
||
<td class="comp-highlight">
|
||
<ul>
|
||
<li>提供基于本体层屏蔽异构商城壁垒的通用解析能力，线下报销补件与线上免报销消费实现语义对齐。</li>
|
||
<li>支持复杂层级的预算池（部门/项目/成本中心）秒级动态关联管控。</li>
|
||
</ul>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>合思 (易快报)</strong></td>
|
||
<td>
|
||
<ul>
|
||
<li>一站式业财收支管理，国内市占率居前。</li>
|
||
<li>生态系统对接广泛，能与国内主流 ERP 无缝打通，配置灵活。</li>
|
||
</ul>
|
||
</td>
|
||
<td>
|
||
<ul>
|
||
<li>系统逻辑依然以“传统工作流表单”为主，交互较为传统，缺乏智能助理的深度参与。</li>
|
||
<li>缺乏中长周期的员工行为偏差分析、规则误报自适应纠偏机制。</li>
|
||
</ul>
|
||
</td>
|
||
<td class="comp-highlight">
|
||
<ul>
|
||
<li>前台 User Agent 支持自然语言直接进行报销提问、草稿生成、异常核对与智能交互。</li>
|
||
<li>通过共享本体与规则中心，让财务人员可以用自然语言配置和灰度升级风控规则。</li>
|
||
</ul>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td><strong>每刻报销</strong></td>
|
||
<td>
|
||
<ul>
|
||
<li>专注于大中型企业的智能财务共享，规则引擎非常强大。</li>
|
||
<li>AI 智能审单能力强，支持复杂的集团化多层级架构。</li>
|
||
</ul>
|
||
</td>
|
||
<td>
|
||
<ul>
|
||
<li>系统的学习曲线陡峭，对业务人员和普通员工的交互不够平滑。</li>
|
||
<li>侧重于既定流程的合规审计，对于预算和费控政策调整带来的前瞻性影响缺乏模拟仿真能力。</li>
|
||
</ul>
|
||
</td>
|
||
<td class="comp-highlight">
|
||
<ul>
|
||
<li>前台大模型辅助，降低普通用户填单学习曲线。</li>
|
||
<li><strong>核心差异化：首创“财务数字孪生与仿真沙盘”</strong>，在系统级测试和决策前对费控变动进行量化分析预测。</li>
|
||
</ul>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section" id="painpoints-solution">
|
||
<div class="section-head">
|
||
<div class="section-kicker">03.2 / SOLUTIONS</div>
|
||
<h2>X-Financial 痛点解决方案</h2>
|
||
<p class="section-desc">
|
||
针对以上竞品普遍面临的系统孤岛、缺乏智能决策、政策调整靠经验等痛点，X-Financial 提出了以 **“AI + 数字化 + 财务数字孪生”** 为核心的下一代费控解决方案。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="grid cols-2">
|
||
<article class="card accent-teal">
|
||
<strong>一、 解决多系统孤岛：Semantic Ontology 本体语义层</strong>
|
||
<p>
|
||
传统软件通过 API 强行硬编码对接 CRM、ERP 和商旅系统，一旦系统升级，接口极易断裂，导致业财数据“语义断层”。
|
||
</p>
|
||
<p style="margin-top: 8px; font-size: 13px;">
|
||
<strong>X-Financial 方案：</strong> 我们设计了包含 8 个关键因子的本体语义协议（domain, scenario, intent 等）。无论是口语化描述、页面动作还是三方消费接口，都先被解析为统一的“本体状态”，再分发至下层服务。这实现了跨系统的语义级天然对齐，让数据真正融为一体。
|
||
</p>
|
||
</article>
|
||
|
||
<article class="card accent-blue">
|
||
<strong>二、 解决财务假智能：User Agent & Hermes 双智能体闭环</strong>
|
||
<p>
|
||
市面软件仅使用 OCR 识别将文字填入表单，人工审核工作量并没有显著降低，也无法识别隐性舞弊。
|
||
</p>
|
||
<p style="margin-top: 8px; font-size: 13px;">
|
||
<strong>X-Financial 方案：</strong> 我们构建了双 Agent 循环。前台 <strong>User Agent</strong> 帮员工和财务进行友好交互，自动查漏补正，解释退回原因；后台 <strong>Hermes 数字员工</strong> 定时在数据底座扫描，分析员工近90/180天的费用画像和行为画像，依据同组偏差算法自动判定隐性风险，出具报告。
|
||
</p>
|
||
</article>
|
||
|
||
<article class="card accent-amber">
|
||
<strong>三、 解决规则配置难：LLM 驱动的规则与知识工厂</strong>
|
||
<p>
|
||
传统系统的规则引擎配置需要 IT 人员编写繁杂的条件表达式，难以响应公司制度的频繁变动。
|
||
</p>
|
||
<p style="margin-top: 8px; font-size: 13px;">
|
||
<strong>X-Financial 方案：</strong> 支持财务直接上传自然语言描述的制度文档。系统通过大模型将文本转化为可测试、可执行的规则库资产；当发生审批争议或误报时，支持财务通过“反馈池”对规则 and 知识库进行一键校正，进入自进化闭环。
|
||
</p>
|
||
</article>
|
||
|
||
<article class="card twin-sandbox-card">
|
||
<span class="twin-sandbox-badge">首创蓝海技术</span>
|
||
<strong>四、 解决政策盲目调整：财务数字孪生与仿真沙盘（Financial Digital Twin）</strong>
|
||
<p>
|
||
很多企业在遇到经营波动时，会盲目调低差旅标准（如酒店降低20%），这容易导致员工满意度下降、灰色报销增多或合规偏离率升高，甚至因行政摩擦上升造成更大的隐性成本。目前市场没有任何一款软件能评估规则调整带来的实际后果。
|
||
</p>
|
||
<p style="margin-top: 8px; font-size: 13.5px;">
|
||
<strong>X-Financial 方案：</strong> 我们通过融合组织架构树、员工费用画像、预算控制规则与历史发票数据库，为企业构建了一个“财务数字孪生体”。当管理层想要修改政策（如“下调销售部酒店标准 15%”）时，可在系统<strong>仿真沙盘（Simulation Sandbox）</strong>中运行模拟。沙盘会模拟历史真实或合成出的数万个出差场景进行回归测算，量化预测此次政策调整对“未来费用降幅（预估降低11%）”、“员工合规偏离率（预估提升8%）”、“预计审批流程摩擦时间（预估提升12%）”的多维影响，为企业提供真正科学的决策辅助。
|
||
</p>
|
||
</article>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section" id="goal">
|
||
<div class="section-head">
|
||
<div class="section-kicker">04 / PROJECT GOAL</div>
|
||
<h2>开发这个平台的目的</h2>
|
||
<p class="section-desc">
|
||
当前项目的目标是做一套可演示、可扩展、可继续工程化的智能费控底座。
|
||
它既要能承载真实报销、审批、预算和知识库流程，也要能承载智能体调用和后续自进化闭环。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="process">
|
||
<div class="process-step">
|
||
<div class="step-no">01</div>
|
||
<div>
|
||
<div class="step-title">让用户用自然语言完成费用流程</div>
|
||
<div class="step-text">用户可以描述出差、招待、补件、审批问题，系统通过本体解析成结构化字段，再交给编排器和对应服务处理。</div>
|
||
</div>
|
||
</div>
|
||
<div class="process-step">
|
||
<div class="step-no">02</div>
|
||
<div>
|
||
<div class="step-title">让财务看到预算和风险的真实原因</div>
|
||
<div class="step-text">预算中心计算预算占用、剩余额度、审批后使用率；规则中心解释风险规则命中；画像算法给出同组基准。</div>
|
||
</div>
|
||
</div>
|
||
<div class="process-step">
|
||
<div class="step-no">03</div>
|
||
<div>
|
||
<div class="step-title">让 Hermes 自动发现隐藏问题</div>
|
||
<div class="step-text">后台数字员工读取单据、聚类上下文、识别拆单和异常频次等隐性风险，再形成报告和工单候选。</div>
|
||
</div>
|
||
</div>
|
||
<div class="process-step">
|
||
<div class="step-no">04</div>
|
||
<div>
|
||
<div class="step-title">让知识、规则和反馈持续进化</div>
|
||
<div class="step-text">人工反馈、OCR 修正、规则误报漏报、审批意见改写和知识问答反馈进入候选池，经人工审核后更新规则或知识。</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section" id="algorithms">
|
||
<div class="section-head">
|
||
<div class="section-kicker">05 / ALGORITHMS</div>
|
||
<h2>相关算法与智能分析能力</h2>
|
||
<p class="section-desc">
|
||
项目中已经沉淀了独立算法目录和多个业务模型。核心原则是：
|
||
先有可解释公式，再进入服务；算法输出“依据 + 建议动作”，不直接替代人工审批。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="grid cols-2">
|
||
<article class="card accent-teal">
|
||
<strong>申请人费用画像</strong>
|
||
<p>
|
||
根据近 90/180 天申请频次、金额占用、同组偏离、历史退回调减、本次申请偏离等指标，
|
||
计算画像风险分和审批建议强度。
|
||
</p>
|
||
<small>applicant_expense_profile.py / applicant_expense_profile_formula.md</small>
|
||
</article>
|
||
<article class="card accent-blue">
|
||
<strong>员工行为画像</strong>
|
||
<p>
|
||
覆盖费用支出画像、流程质量画像、AI 协作强度、审批行为画像，
|
||
支持按照部门、岗位、职级和费用类型建立同组基准。
|
||
</p>
|
||
<small>employee_behavior_profile.py / employee_behavior_profile_service.py</small>
|
||
</article>
|
||
<article class="card accent-amber">
|
||
<strong>预算费用管控模型</strong>
|
||
<p>
|
||
结合预算总额、已占用、已核销、本次申请金额、审批后使用率、预警线和超预算金额，
|
||
输出 recommended、caution、review、block 等建议。
|
||
</p>
|
||
<small>budget_expense_control.py / budget.py</small>
|
||
</article>
|
||
<article class="card accent-red">
|
||
<strong>风险规则与本体桥接</strong>
|
||
<p>
|
||
风险信号会映射到具体规则编码，例如重复发票、地点不一致、附件不匹配、事由过短，
|
||
使自然语言风险问题能落到可执行规则。
|
||
</p>
|
||
<small>risk_ontology_bridge.py / risk_rule_template_executor.py</small>
|
||
</article>
|
||
</div>
|
||
|
||
<div class="formula" aria-label="画像核心公式">profile_score =
|
||
frequency_score * 0.20
|
||
+ amount_occupancy_score * 0.25
|
||
+ peer_deviation_score * 0.25
|
||
+ adjustment_history_score * 0.15
|
||
+ current_claim_deviation_score * 0.15
|
||
|
||
budget_control =
|
||
claim_amount_ratio
|
||
+ after_usage_rate
|
||
+ over_budget_amount
|
||
+ missing_business_context
|
||
+ control_action</div>
|
||
</section>
|
||
|
||
<section class="section" id="modules">
|
||
<div class="section-head">
|
||
<div class="section-kicker">06 / MODULES</div>
|
||
<h2>当前项目模块与核心能力</h2>
|
||
<p class="section-desc">
|
||
前端提供业务操作入口，后端提供领域服务、智能体编排、本体解析、规则资产、知识检索和审计追踪。
|
||
其中最核心的是：本体语义层、Orchestrator、User Agent、Hermes、预算/单据服务、规则中心和画像算法。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="module-list">
|
||
<div class="module-item">
|
||
<div class="module-title">前端应用层</div>
|
||
<p class="module-desc">
|
||
总览、个人工作台、单据中心、预算中心、规则中心、数字员工、员工管理、制度知识、日志管理、系统设置。
|
||
</p>
|
||
<div class="code-row">
|
||
<span class="code-chip">OverviewView</span>
|
||
<span class="code-chip">BudgetCenterView</span>
|
||
<span class="code-chip">AuditView</span>
|
||
<span class="code-chip">DigitalEmployeesView</span>
|
||
<span class="code-chip">DocumentsCenterView</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="module-item">
|
||
<div class="module-title">单据与报销服务</div>
|
||
<p class="module-desc">
|
||
支持申请单、报销单、附件、票据分析、审批、退回、归档、预算联动和 AI 结构化核对。
|
||
</p>
|
||
<div class="code-row">
|
||
<span class="code-chip">ExpenseClaimService</span>
|
||
<span class="code-chip">expense_claim_budget_flow</span>
|
||
<span class="code-chip">expense_claim_risk_review</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="module-item">
|
||
<div class="module-title">预算中心</div>
|
||
<p class="module-desc">
|
||
管理预算额度、部门/项目/成本中心维度、预算占用、核销、可用余额、预警线和超预算控制。
|
||
</p>
|
||
<div class="code-row">
|
||
<span class="code-chip">BudgetService</span>
|
||
<span class="code-chip">BudgetAllocation</span>
|
||
<span class="code-chip">BudgetReservation</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="module-item">
|
||
<div class="module-title">规则中心</div>
|
||
<p class="module-desc">
|
||
管理财务规则、风险规则、规则测试、规则等级、业务场景、费用类型范围和规则资产版本。
|
||
</p>
|
||
<div class="code-row">
|
||
<span class="code-chip">AgentAssetService</span>
|
||
<span class="code-chip">AgentFoundationRiskRuleMixin</span>
|
||
<span class="code-chip">risk-rules</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="module-item">
|
||
<div class="module-title">本体语义层</div>
|
||
<p class="module-desc">
|
||
把自然语言、页面动作、附件上下文和定时任务解析成统一协议，供 Agent 和工具调用使用。
|
||
</p>
|
||
<div class="code-row">
|
||
<span class="code-chip">SemanticOntologyService</span>
|
||
<span class="code-chip">ontology_detection</span>
|
||
<span class="code-chip">ontology_extraction</span>
|
||
<span class="code-chip">ontology_validation</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="module-item">
|
||
<div class="module-title">Agent 编排与追踪</div>
|
||
<p class="module-desc">
|
||
Orchestrator 决定进入 User Agent 或 Hermes，记录本体解析、工具调用、降级结果和审计轨迹。
|
||
</p>
|
||
<div class="code-row">
|
||
<span class="code-chip">OrchestratorService</span>
|
||
<span class="code-chip">OrchestratorExecutionEngine</span>
|
||
<span class="code-chip">AgentRunService</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="module-item">
|
||
<div class="module-title">知识库与 RAG</div>
|
||
<p class="module-desc">
|
||
对制度、FAQ、Excel、PDF、DOCX 进行检索和结构化回答，支持本地文本块与 LightRAG 运行时融合。
|
||
</p>
|
||
<div class="code-row">
|
||
<span class="code-chip">KnowledgeRagService</span>
|
||
<span class="code-chip">knowledge_document_extractors</span>
|
||
<span class="code-chip">knowledge_ingest_log</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="module-item">
|
||
<div class="module-title">Hermes 数字员工</div>
|
||
<p class="module-desc">
|
||
后台执行风险扫描、费用报告、员工画像刷新、任务日志记录和风险报告沉淀。
|
||
</p>
|
||
<div class="code-row">
|
||
<span class="code-chip">HermesRiskScannerService</span>
|
||
<span class="code-chip">hermes_scheduler</span>
|
||
<span class="code-chip">HermesRiskReport</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section" id="architecture">
|
||
<div class="section-head">
|
||
<div class="section-kicker">07 / ARCHITECTURE</div>
|
||
<h2>双智能体循环架构</h2>
|
||
<p class="section-desc">
|
||
外层 User Agent 负责用户操作、问答、草稿和确认；内层 Hermes 负责后台巡检、隐性风险、任务报告和候选优化。
|
||
两者不争夺职责，而是共享本体、规则、知识、数据和审计。
|
||
</p>
|
||
</div>
|
||
|
||
<div>
|
||
<div class="flow-diagram" aria-label="X-Financial 双智能体循环架构图">
|
||
<div class="flow-band">
|
||
<strong>外层循环：User Agent 面向用户操作</strong>
|
||
<span>处理用户自然语言、页面动作、草稿生成、审批解释和确认后的流程写入</span>
|
||
</div>
|
||
<div class="flow-row" style="--cols: 5">
|
||
<div class="flow-node">
|
||
<div class="flow-node-title">用户输入</div>
|
||
<div class="flow-node-text">自然语言、页面按钮、附件上下文</div>
|
||
</div>
|
||
<div class="flow-node">
|
||
<div class="flow-node-title">本体解析</div>
|
||
<div class="flow-node-text">场景、意图、实体、缺槽位</div>
|
||
</div>
|
||
<div class="flow-node dark">
|
||
<div class="flow-node-title">Orchestrator</div>
|
||
<div class="flow-node-text">路由、权限、审计、降级</div>
|
||
</div>
|
||
<div class="flow-node">
|
||
<div class="flow-node-title">工具执行</div>
|
||
<div class="flow-node-text">DB、规则、RAG、OCR、预算</div>
|
||
</div>
|
||
<div class="flow-node">
|
||
<div class="flow-node-title">回答/草稿</div>
|
||
<div class="flow-node-text">解释、核对、确认、提交</div>
|
||
</div>
|
||
</div>
|
||
<div class="flow-loop">
|
||
用户确认、补充字段或修改核对结果后，继续回到同一个会话上下文。
|
||
</div>
|
||
<div class="flow-band">
|
||
<strong>共享中台</strong>
|
||
<span>语义本体 · 规则资产 · 知识库 · 业务数据库 · AgentRun Trace · 权限审计</span>
|
||
</div>
|
||
<div class="flow-band">
|
||
<strong>内层循环：Hermes 数字员工监控核心数据与流转风险</strong>
|
||
<span>面向系统事件和定时任务，负责长期巡检、隐性风险、报告与优化候选</span>
|
||
</div>
|
||
<div class="flow-row" style="--cols: 5">
|
||
<div class="flow-node amber">
|
||
<div class="flow-node-title">定时触发</div>
|
||
<div class="flow-node-text">schedule、system event、手动触发</div>
|
||
</div>
|
||
<div class="flow-node amber">
|
||
<div class="flow-node-title">数据快照</div>
|
||
<div class="flow-node-text">预算、单据、员工、日志</div>
|
||
</div>
|
||
<div class="flow-node amber">
|
||
<div class="flow-node-title">风险分析</div>
|
||
<div class="flow-node-text">规则、LLM、画像、同组基准</div>
|
||
</div>
|
||
<div class="flow-node amber">
|
||
<div class="flow-node-title">报告/工单</div>
|
||
<div class="flow-node-text">risk_report、work_items、snapshot</div>
|
||
</div>
|
||
<div class="flow-node amber">
|
||
<div class="flow-node-title">反馈候选</div>
|
||
<div class="flow-node-text">规则、知识、OCR、Prompt</div>
|
||
</div>
|
||
</div>
|
||
<div class="flow-loop">
|
||
Hermes 只生成候选和报告；规则上线、知识发布、审批和付款仍需要权限、确认和人工审核。
|
||
</div>
|
||
</div>
|
||
<div class="diagram-caption">
|
||
双循环的关键不是“两个聊天机器人”，而是把用户主动流程和后台系统巡检拆开，
|
||
再通过统一语义协议、规则资产、业务数据和审计日志连接起来。
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section" id="ontology">
|
||
<div class="section-head">
|
||
<div class="section-kicker">08 / ONTOLOGY</div>
|
||
<h2>本体语义层的优势</h2>
|
||
<p class="section-desc">
|
||
当前项目已经接入本体语义层。它的价值在于把“用户怎么说”和“系统怎么执行”隔开，
|
||
让自然语言、页面动作、定时任务、规则中心和数据库查询都走同一套协议。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="split">
|
||
<div class="grid">
|
||
<article class="card accent-teal">
|
||
<strong>减少关键词误判</strong>
|
||
<p>
|
||
用户说“我今天去客户现场，招待客户”，不能因为出现“客户”就误路由到应收查询。
|
||
本体会综合场景、意图、缺槽位和上下文判断。
|
||
</p>
|
||
</article>
|
||
<article class="card accent-blue">
|
||
<strong>让 Agent 调用可审计</strong>
|
||
<p>
|
||
每次调用都能保留 scenario、intent、entities、risk_flags、next_step，
|
||
便于回放、追责和优化。
|
||
</p>
|
||
</article>
|
||
<article class="card accent-amber">
|
||
<strong>让规则与预算复用同一语义</strong>
|
||
<p>
|
||
费用类型、部门、预算期间、预算科目、风险信号都可以被统一解析，
|
||
减少前后端重复写规则。
|
||
</p>
|
||
</article>
|
||
</div>
|
||
|
||
<div>
|
||
<div class="flow-diagram" aria-label="本体语义层协议图">
|
||
<div class="flow-row" style="--cols: 2">
|
||
<div class="flow-node">
|
||
<div class="flow-node-title">自然语言 / 页面动作</div>
|
||
<div class="flow-node-text">用户提问、发起申请、编辑核对、上传附件</div>
|
||
</div>
|
||
<div class="flow-node">
|
||
<div class="flow-node-title">定时任务 / 系统事件</div>
|
||
<div class="flow-node-text">风险巡检、知识同步、MCP 健康检查</div>
|
||
</div>
|
||
</div>
|
||
<div class="flow-band">
|
||
<strong>Semantic Ontology</strong>
|
||
<span>domain · scenario · intent · entities · time_range · constraints · risk_signals · next_step</span>
|
||
</div>
|
||
<div class="flow-row" style="--cols: 3">
|
||
<div class="flow-node blue">
|
||
<div class="flow-node-title">数据库查询</div>
|
||
<div class="flow-node-text">预算、单据、员工、部门、应收应付</div>
|
||
</div>
|
||
<div class="flow-node blue">
|
||
<div class="flow-node-title">规则 / MCP</div>
|
||
<div class="flow-node-text">风险规则、票据校验、外部服务</div>
|
||
</div>
|
||
<div class="flow-node blue">
|
||
<div class="flow-node-title">知识 / RAG</div>
|
||
<div class="flow-node-text">制度条款、FAQ、历史解释、证据来源</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="diagram-caption">
|
||
本体层不直接给最终答案，它输出可执行协议，让后续工具和 Agent 按相同语义工作。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="formula" aria-label="本体协议字段">{
|
||
"domain": "reimbursement",
|
||
"scenario": "travel_reimbursement",
|
||
"intent": "risk_check",
|
||
"entities": ["employee", "department", "expense_type", "budget_period"],
|
||
"time_range": {},
|
||
"constraints": {},
|
||
"risk_signals": ["duplicate_invoice", "over_budget"],
|
||
"next_step": "run_rule"
|
||
}</div>
|
||
</section>
|
||
|
||
<section class="section" id="screens">
|
||
<div class="section-head">
|
||
<div class="section-kicker">09 / PRODUCT SCREENS</div>
|
||
<h2>关键页面截图</h2>
|
||
<p class="section-desc">
|
||
下列截图来自当前项目 `web/UI` 目录，用来展示平台已经覆盖的核心操作面：
|
||
管理总览、预算、单据、智能助手、知识库、日志和设置。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="gallery">
|
||
<figure>
|
||
<img src="../../../web/UI/首页新.png" alt="X-Financial 首页总览截图" loading="lazy">
|
||
<figcaption>
|
||
<strong>财务运营总览</strong>
|
||
汇总业务流转、风险信号和关键指标，是管理层进入智能费控平台的第一屏。
|
||
</figcaption>
|
||
</figure>
|
||
<figure>
|
||
<img src="../../../web/UI/预算中心.jpg" alt="预算中心截图" loading="lazy">
|
||
<figcaption>
|
||
<strong>预算中心</strong>
|
||
维护部门、项目、费用类型预算，跟踪预算占用、可用余额和超预算预警。
|
||
</figcaption>
|
||
</figure>
|
||
<figure>
|
||
<img src="../../../web/UI/对话界面.png" alt="智能助手对话界面截图" loading="lazy">
|
||
<figcaption>
|
||
<strong>User Agent 对话</strong>
|
||
承接自然语言查询、流程草稿、风险解释和用户确认，是外层智能体循环的入口。
|
||
</figcaption>
|
||
</figure>
|
||
<figure>
|
||
<img src="../../../web/UI/审批中心详情.png" alt="审批中心详情截图" loading="lazy">
|
||
<figcaption>
|
||
<strong>单据与审批详情</strong>
|
||
展示申请、报销、审批意见、附件核对、风险提示和可追溯处理记录。
|
||
</figcaption>
|
||
</figure>
|
||
<figure>
|
||
<img src="../../../web/UI/知识库.png" alt="制度知识库截图" loading="lazy">
|
||
<figcaption>
|
||
<strong>制度与知识库</strong>
|
||
承载制度文档、知识检索和 RAG 证据来源，支持智能问答和规则解释。
|
||
</figcaption>
|
||
</figure>
|
||
<figure>
|
||
<img src="../../../web/UI/日志界面.jpg" alt="日志管理页面截图" loading="lazy">
|
||
<figcaption>
|
||
<strong>日志管理</strong>
|
||
观察 Agent Run、工具调用、语义解析、知识同步和系统运行状态。
|
||
</figcaption>
|
||
</figure>
|
||
<figure>
|
||
<img src="../../../web/UI/首页风险.png" alt="风险总览截图" loading="lazy">
|
||
<figcaption>
|
||
<strong>风险洞察</strong>
|
||
用于展示风险分布、异常趋势和需要财务关注的事项。
|
||
</figcaption>
|
||
</figure>
|
||
<figure>
|
||
<img src="../../../web/UI/设置界面.png" alt="系统设置截图" loading="lazy">
|
||
<figcaption>
|
||
<strong>系统设置</strong>
|
||
管理企业信息、模型接入、日志策略、渲染配置和通知能力。
|
||
</figcaption>
|
||
</figure>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section" id="roadmap">
|
||
<div class="section-head">
|
||
<div class="section-kicker">10 / EVOLUTION</div>
|
||
<h2>建议演进路线</h2>
|
||
<p class="section-desc">
|
||
当前项目已经具备智能费控雏形。后续重点不是堆更多页面，而是把本体、预算、画像、规则、
|
||
Hermes 和反馈闭环做深，让平台从“能演示”走向“可运营”。
|
||
</p>
|
||
</div>
|
||
|
||
<div class="timeline">
|
||
<div class="timeline-item">
|
||
<div class="timeline-phase">阶段一</div>
|
||
<div class="timeline-text">
|
||
完成本体协议、单据中心、预算中心、规则中心、知识库和 Agent Run 追踪的稳定联动。
|
||
</div>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<div class="timeline-phase">阶段二</div>
|
||
<div class="timeline-text">
|
||
加强费用画像、部门预算占比、审批建议、风险解释和单据详情页的业务可读性。
|
||
</div>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<div class="timeline-phase">阶段三</div>
|
||
<div class="timeline-text">
|
||
将 Hermes 的风险扫描、费用报告、员工画像刷新和规则质量复盘变成可配置任务。
|
||
</div>
|
||
</div>
|
||
<div class="timeline-item">
|
||
<div class="timeline-phase">阶段四</div>
|
||
<div class="timeline-text">
|
||
建立人工反馈池，让 OCR 修正、规则误报漏报、审批意见改写和知识问答反馈形成候选优化项。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="callout">
|
||
<div class="callout-title">关键原则</div>
|
||
<p>
|
||
自进化不等于自动改线上规则。Hermes 负责发现、聚类、建议和生成候选；
|
||
最终规则、知识、审批和付款仍然必须经过权限、确认和人工审核。
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="section" id="sources">
|
||
<div class="section-head">
|
||
<div class="section-kicker">11 / SOURCES</div>
|
||
<h2>趋势依据与引用来源</h2>
|
||
<p class="section-desc">
|
||
本文档中的市场趋势、CFO 角色变化、AI Agent 预算、异常检测和费控市场空间，参考了以下公开资料。
|
||
</p>
|
||
</div>
|
||
|
||
<ul class="source-list">
|
||
<li>
|
||
<a href="https://www.gartner.com/en/newsroom/press-releases/2025-11-18-gartner-survey-shows-finance-ai-adoption-remains-steady-in-2025" target="_blank" rel="noreferrer">
|
||
Gartner：2025 年财务 AI 采用率与主要用例
|
||
</a>
|
||
<br>
|
||
资料显示财务 AI 采用率为 59%，知识管理、应付流程自动化、错误与异常检测是主要落地场景。
|
||
</li>
|
||
<li>
|
||
<a href="https://www.mckinsey.com/featured-insights/week-in-charts/cfos-counting-on-gen-ai" target="_blank" rel="noreferrer">
|
||
McKinsey：CFOs counting on gen AI
|
||
</a>
|
||
<br>
|
||
CFO 调研显示，85% 受访者期待 AI 生成洞察、减少人工分析，71% 已使用者认为 AI 提升了生产力。
|
||
</li>
|
||
<li>
|
||
<a href="https://www.deloitte.com/us/en/insights/topics/business-strategy-growth/apac-cfo-2025-survey-report.html" target="_blank" rel="noreferrer">
|
||
Deloitte APAC CFO 2025 Survey
|
||
</a>
|
||
<br>
|
||
接近一半 CFO 预计生成式 AI 会在两年内显著改变行业、组织和财务职能。
|
||
</li>
|
||
<li>
|
||
<a href="https://www.salesforce.com/news/stories/cfos-invest-ai-for-growth/" target="_blank" rel="noreferrer">
|
||
Salesforce：CFOs Invest in AI for Growth 2025
|
||
</a>
|
||
<br>
|
||
CFO 平均将 25% AI 预算投入 AI Agent，61% 认为 AI Agent/数字劳动力对竞争力关键。
|
||
</li>
|
||
<li>
|
||
<a href="https://www.usbank.com/corporate-and-commercial-banking/treasury-payment-solutions/corporate-payment-services/corporate-credit-cards/5-ways-prevent-expense-report-fraud.html" target="_blank" rel="noreferrer">
|
||
U.S. Bank / ACFE：费用报销舞弊风险
|
||
</a>
|
||
<br>
|
||
文章引用 ACFE 2024 Report to the Nations，指出费用报销舞弊平均损失和发现周期，说明费用风险需要持续监控。
|
||
</li>
|
||
<li>
|
||
<a href="https://www.grandviewresearch.com/press-release/global-travel-expense-management-software-market" target="_blank" rel="noreferrer">
|
||
Grand View Research：差旅与费用管理软件市场
|
||
</a>
|
||
<br>
|
||
报告预计全球 T&E 管理软件市场到 2030 年达到 106.9 亿美元，AI、OCR、审批自动化和风险管理是关键方向。
|
||
</li>
|
||
</ul>
|
||
</section>
|
||
|
||
<footer class="footer">
|
||
<strong>结论</strong>
|
||
<p>
|
||
X-Financial 的智能费控方向已经具备清晰技术骨架：
|
||
本体语义层负责理解，Orchestrator 负责调度，User Agent 负责用户流程，
|
||
Hermes 负责后台内循环，预算、规则、画像和知识库负责提供可解释依据。
|
||
继续沿着这条线做深，平台会从“报销工具”成长为企业费用经营与财务风控的智能中台。
|
||
</p>
|
||
</footer>
|
||
</main>
|
||
|
||
<aside class="toc" aria-label="本页目录">
|
||
<div class="toc-title">本页目录</div>
|
||
<a href="#top"><span class="dot"></span>顶部概览</a>
|
||
<a href="#why"><span class="dot"></span>为什么要做</a>
|
||
<a href="#future"><span class="dot"></span>未来地位</a>
|
||
<a href="#blue"><span class="dot"></span>蓝海空间</a>
|
||
<a href="#competitor-analysis"><span class="dot"></span>竞品对比</a>
|
||
<a href="#painpoints-solution"><span class="dot"></span>痛点解决</a>
|
||
<a href="#goal"><span class="dot"></span>开发目的</a>
|
||
<a href="#algorithms"><span class="dot"></span>算法能力</a>
|
||
<a href="#modules"><span class="dot"></span>模块清单</a>
|
||
<a href="#architecture"><span class="dot"></span>双智能体</a>
|
||
<a href="#ontology"><span class="dot"></span>本体优势</a>
|
||
<a href="#screens"><span class="dot"></span>关键截图</a>
|
||
<a href="#roadmap"><span class="dot"></span>演进路线</a>
|
||
<a href="#sources"><span class="dot"></span>趋势来源</a>
|
||
<div class="side-note">
|
||
打开方式：直接用浏览器打开本 HTML 文件即可。截图通过相对路径引用当前仓库的 `web/UI` 目录。
|
||
</div>
|
||
</aside>
|
||
</div>
|
||
</body>
|
||
</html>
|