HEL-121: 第2批——两端外壳 + 管理总览 + 公司工作台(按原型换壳,保留 showView/角标/退出逻辑)
Co-authored-by: multica-agent <github@multica.ai>
This commit is contained in:
+247
-121
@@ -6,144 +6,257 @@
|
||||
<meta name="description" content="金牛集团总账管理端" />
|
||||
<title>总账管理端 · 金牛集团</title>
|
||||
<link rel="stylesheet" href="styles.css" />
|
||||
<link rel="stylesheet" href="design-system.css?v=2" />
|
||||
</head>
|
||||
<body data-portal="admin">
|
||||
<!--
|
||||
THESIS: 总账端是一座可下钻的集团资金控制台,拒绝平铺报表式首页。
|
||||
OWN-WORLD: 深黑工作场景、半透明石墨玻璃、荧光绿指令和琥珀红风险信号;大圆角与细光边建立空间层级。
|
||||
STORY: 管理员先从四个关键指标定位风险,再进入审核、账期或公司借贷目录逐层追溯。
|
||||
FIRST VIEWPORT: 浮动侧栏与窄顶栏围合工作区;四张统计卡领衔,计算口径和优先事项紧随其后,借贷目录承接下钻。
|
||||
FORM: 用户参考图锁定的深色玻璃财务工作台,Operate 模式;seed key fe8a50aa。
|
||||
FINISH: unreviewed and undocumented is unfinished; this build ends with the finish review, the verdict, and DESIGN.md
|
||||
-->
|
||||
<a class="skip-link" href="#main-content">跳到主要内容</a>
|
||||
<div class="app-shell">
|
||||
<div class="shell">
|
||||
<aside class="sidebar" id="sidebar" aria-label="总账管理导航">
|
||||
<div class="brand"><span class="brand-mark">金</span><span class="brand-copy"><strong>金牛集团</strong><small>总账管理端</small></span></div>
|
||||
<nav class="nav-list">
|
||||
<button class="nav-item is-active" data-view="dashboard"><svg><use href="icons.svg#layout-dashboard"/></svg><span>管理总览</span></button>
|
||||
<button class="nav-item" data-view="pair"><svg><use href="icons.svg#arrow-left-right"/></svg><span>往来查询</span></button>
|
||||
<button class="nav-item" data-view="audit"><svg><use href="icons.svg#list-checks"/></svg><span>审核中心</span><b>6</b></button>
|
||||
<button class="nav-item" data-view="flows"><svg><use href="icons.svg#file-spreadsheet"/></svg><span>流水管理</span></button>
|
||||
<button class="nav-item" data-view="companies"><svg><use href="icons.svg#users"/></svg><span>公司与账号</span></button>
|
||||
<button class="nav-item" data-view="settings"><svg><use href="icons.svg#calendar"/></svg><span>结账与期初</span></button>
|
||||
<button class="nav-item" data-view="reminders"><svg><use href="icons.svg#bell"/></svg><span>提醒管理</span><b>4</b></button>
|
||||
<div class="side-brand">
|
||||
<div class="brand-name">金牛实业 · 资金往来</div>
|
||||
<div class="brand-sub">HENAN JINNIU INDUSTRIAL GROUP</div>
|
||||
<span class="side-role">总账管理端</span>
|
||||
</div>
|
||||
<nav class="side-nav">
|
||||
<div class="nav-group">日常</div>
|
||||
<a class="active" data-view="dashboard" href="#dashboard"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"><rect x="3" y="3" width="8" height="8" rx="1.5"/><rect x="13" y="3" width="8" height="5" rx="1.5"/><rect x="13" y="10" width="8" height="11" rx="1.5"/><rect x="3" y="13" width="8" height="8" rx="1.5"/></svg><span class="nav-label">管理总览</span></a>
|
||||
<a data-view="pair" href="#pair"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"><path d="M7 8h13l-3.5-3.5M17 16H4l3.5 3.5"/></svg><span class="nav-label">往来查询</span></a>
|
||||
<a data-view="audit" href="#audit"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"><path d="M9 11.5l2 2 4-4.5"/><rect x="4" y="3" width="16" height="18" rx="2"/></svg><span class="nav-label">审核中心</span><span class="nav-badge">6</span></a>
|
||||
<a data-view="flows" href="#flows"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"><path d="M4 6h16M4 12h16M4 18h10"/></svg><span class="nav-label">流水管理</span></a>
|
||||
<div class="nav-group">基础与结账</div>
|
||||
<a data-view="companies" href="#companies"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"><path d="M4 21V8l8-5 8 5v13"/><path d="M9 21v-6h6v6"/></svg><span class="nav-label">公司与账号</span></a>
|
||||
<a data-view="settings" href="#settings"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"><circle cx="12" cy="12" r="8.5"/><path d="M12 7v5l3.5 2"/></svg><span class="nav-label">结账与期初</span></a>
|
||||
<a data-view="reminders" href="#reminders"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"><path d="M6 9a6 6 0 1 1 12 0c0 5 2 6 2 6H4s2-1 2-6"/><path d="M10 19a2 2 0 0 0 4 0"/></svg><span class="nav-label">提醒管理</span></a>
|
||||
</nav>
|
||||
<div class="sidebar-footer">
|
||||
<a class="nav-item" href="index.html"><svg><use href="icons.svg#log-out"/></svg><span>退出登录</span></a>
|
||||
<div class="user-block"><span class="avatar">管</span><span><strong>系统管理员</strong><small>全部公司权限</small></span></div>
|
||||
<div class="side-foot">
|
||||
<div class="user-row">
|
||||
<span class="avatar">管</span>
|
||||
<div>
|
||||
<div class="user-name">系统管理员</div>
|
||||
<div class="user-meta">集团总账会计</div>
|
||||
</div>
|
||||
<button class="logout" type="button">退出</button>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<div class="workspace">
|
||||
<main id="main-content">
|
||||
<div class="main">
|
||||
<div class="topbar">
|
||||
<span class="crumb">总账管理端 / <b id="currentViewName">管理总览</b></span>
|
||||
<div class="topbar-right">
|
||||
<span class="tag">账期 2026-07</span>
|
||||
<span class="tag">统计截止 2026-08-20</span>
|
||||
<button class="btn btn-sm" data-view-link="settings">结账检查</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<main class="content" id="main-content">
|
||||
<section class="app-view is-active" data-page="dashboard">
|
||||
<header class="page-heading dashboard-head"><div><h1>管理总览</h1><p>集团账务口径与高优先级事项</p></div>
|
||||
<div class="content-toolbar">
|
||||
<label class="search-box"><svg><use href="icons.svg#search"/></svg><span class="sr-only">全局检索</span><input id="globalSearch" type="search" placeholder="检索公司、账号或流水" /></label>
|
||||
<div class="toolbar-group">
|
||||
<button class="icon-button" data-view-link="reminders" aria-label="提醒管理,4 项未处理" title="提醒管理"><svg><use href="icons.svg#bell"/></svg><i class="notification-dot">4</i></button>
|
||||
<button class="period-button" type="button"><svg><use href="icons.svg#calendar"/></svg><span>截至 2026.07.31</span></button>
|
||||
<button class="button secondary" data-view-link="settings"><svg><use href="icons.svg#settings"/></svg>账期设置</button>
|
||||
</div>
|
||||
<div class="page-head">
|
||||
<div>
|
||||
<h1>管理总览</h1>
|
||||
<p class="page-sub">2026-01-01 至 2026-08-20,集团 6 家成员公司相互往来累计发生 8.11 亿元、392 笔明细。页面上任意数字与公司均可逐级穿透,直至银行原始流水。</p>
|
||||
</div>
|
||||
<div class="page-actions">
|
||||
<button class="btn" data-view-link="pair">往来查询</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="metric-grid" aria-label="总账关键指标">
|
||||
<article class="metric-card danger" data-metric-link="audit" tabindex="0" role="button" aria-label="查看 7 项待审核事项">
|
||||
<div class="metric-copy"><span class="metric-label">待审核事项</span><strong class="metric-value">7<small>项</small></strong></div>
|
||||
<span class="metric-icon"><svg><use href="icons.svg#list-checks"/></svg></span>
|
||||
<p class="metric-foot"><strong>2 项高风险</strong> · 影响当前结账</p>
|
||||
</article>
|
||||
<article class="metric-card warning" data-metric-link="audit" tabindex="0" role="button" aria-label="查看 3 个流水异常账户">
|
||||
<div class="metric-copy"><span class="metric-label">流水异常账户</span><strong class="metric-value">3<small>个</small></strong></div>
|
||||
<span class="metric-icon"><svg><use href="icons.svg#circle-alert"/></svg></span>
|
||||
<p class="metric-foot"><strong>1 个已逾期</strong> · 最长缺口 21 天</p>
|
||||
</article>
|
||||
<article class="metric-card" data-metric-link="reminders" tabindex="0" role="button" aria-label="查看 2 家未完成提交公司">
|
||||
<div class="metric-copy"><span class="metric-label">未完成提交公司</span><strong class="metric-value">2<small>/ 6</small></strong></div>
|
||||
<span class="metric-icon"><svg><use href="icons.svg#users"/></svg></span>
|
||||
<p class="metric-foot"><strong>4 家已完成</strong> · 截止 08.05</p>
|
||||
</article>
|
||||
<article class="metric-card success" data-metric-link="settings" tabindex="0" role="button" aria-label="查看当前结账设置和状态">
|
||||
<div class="metric-copy"><span class="metric-label">当前结账状态</span><strong class="metric-value">待处理</strong></div>
|
||||
<span class="metric-icon"><svg><use href="icons.svg#calendar"/></svg></span>
|
||||
<p class="metric-foot"><strong>2026 年 7 月</strong> · 3 项条件未通过</p>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
<section class="period-ribbon" aria-label="当前计算口径">
|
||||
<div><span>全局起算日</span><strong>2026.01.01</strong></div>
|
||||
<div><span>当前统计截止</span><strong>2026.07.31</strong></div>
|
||||
<div><span>每月结账日</span><strong>次月 5 日</strong></div>
|
||||
<div class="period-warning"><svg><use href="icons.svg#circle-alert"/></svg><span><strong>2 家公司存在起算缺口</strong><small>最早缺口始于 2026.01.01</small></span><button class="text-button" data-view-link="audit">去审核</button></div>
|
||||
</section>
|
||||
|
||||
<div class="admin-dashboard-grid">
|
||||
<section class="panel priority-panel">
|
||||
<div class="panel-heading"><div><h2>优先处理</h2><p>影响当前账期可靠性的事项</p></div><button class="text-button" data-view-link="audit">查看全部 7 项</button></div>
|
||||
<div class="task-list compact-task-list">
|
||||
<button data-detail="gap-a"><span class="task-level danger">高</span><span><strong>A公司 · 工行账户断档</strong><small>缺少 07.01—07.21,影响 7 月结账</small></span><b>已逾期 2 天</b><svg><use href="icons.svg#chevron-right"/></svg></button>
|
||||
<button data-detail="match-bd"><span class="task-level warning">中</span><span><strong>B公司 ↔ D公司 · 单边待匹配</strong><small>6 笔,合计 312.00 万元</small></span><b>今日新增</b><svg><use href="icons.svg#chevron-right"/></svg></button>
|
||||
<button data-detail="calib-f"><span class="task-level warning">中</span><span><strong>F公司 · 起算区间待校准</strong><small>01.01—01.16 无银行流水覆盖</small></span><b>待公司确认</b><svg><use href="icons.svg#chevron-right"/></svg></button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<aside class="panel quick-pair-panel">
|
||||
<div class="panel-heading"><div><h2>公司往来快查</h2><p>直接查询任意两个公司</p></div></div>
|
||||
<form class="quick-pair-form" data-pair-form>
|
||||
<label class="field"><span>本方公司</span><select name="from"><option>A公司</option><option>B公司</option><option>C公司</option><option>D公司</option><option>E公司</option><option>F公司</option></select></label>
|
||||
<button class="swap-button" type="button" data-swap aria-label="交换公司" title="交换公司"><svg><use href="icons.svg#arrow-left-right"/></svg></button>
|
||||
<label class="field"><span>对方公司</span><select name="to"><option>B公司</option><option>C公司</option><option>D公司</option><option>E公司</option><option>F公司</option><option>A公司</option></select></label>
|
||||
<button class="button primary" type="submit"><svg><use href="icons.svg#search"/></svg>查询往来</button>
|
||||
</form>
|
||||
<div class="quick-result"><span>A公司对B公司</span><strong>应收 1,280.00<small>万元</small></strong><p>已确认 4 笔 · 待审核 1 笔</p></div>
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
<section class="panel company-ledger-panel">
|
||||
<div class="panel-heading"><div><h2>公司借贷目录</h2><p>统计区间 2026.01.01—2026.07.31 · 单位:万元</p></div><label class="inline-search"><svg><use href="icons.svg#search"/></svg><input data-filter-target="companyLedgers" placeholder="快速检索公司" /></label></div>
|
||||
<div class="ledger-head"><span>公司</span><span>借方合计</span><span>贷方合计</span><span>期末方向</span><span>待审核</span><span></span></div>
|
||||
<div id="companyLedgers" class="company-ledgers">
|
||||
<details class="company-ledger" open>
|
||||
<summary><span class="company-name"><i>A</i><b>A公司</b><small>4 个银行账户</small></span><strong class="amount debit">2,416.00</strong><strong class="amount credit">1,136.00</strong><span><em class="status success">应收</em><b class="amount">1,280.00</b></span><span class="status warning">1 笔</span><svg><use href="icons.svg#chevron-down"/></svg></summary>
|
||||
<div class="ledger-breakdown">
|
||||
<section><header><h3>借方明细</h3><strong>2,416.00</strong></header><button class="subject-row" data-pair-link="A公司|B公司"><span><b>B公司</b><small>应收 · 4 笔</small></span><strong>1,280.00</strong><svg><use href="icons.svg#chevron-right"/></svg></button><button class="subject-row" data-pair-link="A公司|C公司"><span><b>C公司</b><small>其他应收 · 3 笔</small></span><strong>1,136.00</strong><svg><use href="icons.svg#chevron-right"/></svg></button></section>
|
||||
<section><header><h3>贷方明细</h3><strong>1,136.00</strong></header><button class="subject-row" data-pair-link="A公司|D公司"><span><b>D公司</b><small>应付 · 2 笔</small></span><strong>728.00</strong><svg><use href="icons.svg#chevron-right"/></svg></button><button class="subject-row" data-pair-link="A公司|E公司"><span><b>E公司</b><small>其他应付 · 2 笔</small></span><strong>408.00</strong><svg><use href="icons.svg#chevron-right"/></svg></button></section>
|
||||
</div>
|
||||
</details>
|
||||
<details class="company-ledger"><summary><span class="company-name"><i>B</i><b>B公司</b><small>3 个银行账户</small></span><strong class="amount debit">3,020.00</strong><strong class="amount credit">1,740.00</strong><span><em class="status danger">应付</em><b class="amount">1,280.00</b></span><span class="status warning">3 笔</span><svg><use href="icons.svg#chevron-down"/></svg></summary><div class="ledger-breakdown"><section><header><h3>借方明细</h3><strong>3,020.00</strong></header><button class="subject-row" data-pair-link="B公司|D公司"><span><b>D公司</b><small>其他应收 · 6 笔</small></span><strong>2,150.00</strong><svg><use href="icons.svg#chevron-right"/></svg></button></section><section><header><h3>贷方明细</h3><strong>1,740.00</strong></header><button class="subject-row" data-pair-link="B公司|A公司"><span><b>A公司</b><small>应付 · 4 笔</small></span><strong>1,280.00</strong><svg><use href="icons.svg#chevron-right"/></svg></button></section></div></details>
|
||||
<details class="company-ledger"><summary><span class="company-name"><i>C</i><b>C公司</b><small>2 个银行账户</small></span><strong class="amount debit">1,894.00</strong><strong class="amount credit">1,052.00</strong><span><em class="status success">应收</em><b class="amount">842.00</b></span><span class="status neutral">0 笔</span><svg><use href="icons.svg#chevron-down"/></svg></summary><div class="ledger-breakdown"><section><header><h3>借方明细</h3><strong>1,894.00</strong></header><button class="subject-row" data-pair-link="C公司|E公司"><span><b>E公司</b><small>应收 · 5 笔</small></span><strong>1,052.00</strong><svg><use href="icons.svg#chevron-right"/></svg></button></section><section><header><h3>贷方明细</h3><strong>1,052.00</strong></header><button class="subject-row" data-pair-link="C公司|A公司"><span><b>A公司</b><small>其他应付 · 3 笔</small></span><strong>1,052.00</strong><svg><use href="icons.svg#chevron-right"/></svg></button></section></div></details>
|
||||
<div class="grid grid-4">
|
||||
<div class="card stat-card">
|
||||
<div class="stat-label">往来借方总额 · 年初至今</div>
|
||||
<div class="stat-value">42,040.30<span class="unit">万元</span></div>
|
||||
<div class="stat-foot">6 家公司合计 · 明细 392 笔</div>
|
||||
</div>
|
||||
</section>
|
||||
<div class="card stat-card">
|
||||
<div class="stat-label">往来贷方总额 · 年初至今</div>
|
||||
<div class="stat-value">39,040.30<span class="unit">万元</span></div>
|
||||
<div class="stat-foot">6 家公司合计 · 与借方同源互证</div>
|
||||
</div>
|
||||
<div class="card stat-card warn">
|
||||
<div class="stat-label">借贷轧差 · 未匹配</div>
|
||||
<div class="stat-value">3,000.00<span class="unit">万元</span></div>
|
||||
<div class="stat-foot">由单边流水与待确认往来形成,可在往来查询核对</div>
|
||||
</div>
|
||||
<div class="card stat-card">
|
||||
<div class="stat-label">7 月账期确认进度</div>
|
||||
<div class="stat-value">50<span class="unit">%</span></div>
|
||||
<div class="progress" style="margin-top: 10px;"><span style="width: 50%;"></span></div>
|
||||
<div class="stat-foot" style="margin-top: 8px;">3 家已完成 · 2 家在途 · 1 家未提交</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="panel timeline-panel" aria-label="账期时间轴">
|
||||
<div class="panel-heading"><div><h2>账期时间轴</h2><p>起算日 2026.01.01 · 每月 5 日结上月账</p></div><span class="status danger">1 处断档 · 7 月结账日 08.05</span></div>
|
||||
<div class="timeline" role="img" aria-label="2026 年账期时间轴:1 至 6 月已结账,7 月进行中,工商银行 9481 在 07.01 至 07.21 断档,今天 08.08">
|
||||
<div class="timeline-bar">
|
||||
<span class="timeline-seg is-closed" style="left:0;width:81.9%"></span>
|
||||
<span class="timeline-seg is-current" style="left:81.9%;width:15.8%"></span>
|
||||
<span class="timeline-gap" style="left:81.9%;width:9.1%"></span>
|
||||
<i class="timeline-today" style="left:99.1%"></i>
|
||||
<div class="grid grid-3-2" style="margin-top: 14px;">
|
||||
<div class="stack">
|
||||
<div class="card" id="companyTotals">
|
||||
<div class="card-head">
|
||||
<span class="card-title">各公司往来合计<span class="sub">2026-01-01 至 2026-08-20 · 单位:万元 · 点击任意行查看该公司往来明细</span></span>
|
||||
<input class="input" id="company-search" aria-label="搜索公司" placeholder="搜索公司…" style="width: 170px;" />
|
||||
</div>
|
||||
<div class="table-wrap" style="border: 0;">
|
||||
<table class="ds-table">
|
||||
<thead>
|
||||
<tr><th>公司</th><th class="num-col">借方合计</th><th class="num-col">贷方合计</th><th class="num-col">明细笔数</th><th class="num-col">期末净往来</th><th>7 月状态</th></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="clickable" data-view-link="pair">
|
||||
<td class="cell-main">金牛煤业<span class="cell-sub">河南金牛煤业有限公司</span></td>
|
||||
<td class="num-col">18,420.50</td>
|
||||
<td class="num-col">12,386.00</td>
|
||||
<td class="num-col">128</td>
|
||||
<td class="num-col amt-in">+6,034.50</td>
|
||||
<td><span class="pill pill-success">已完成</span></td>
|
||||
</tr>
|
||||
<tr class="clickable" data-view-link="pair">
|
||||
<td class="cell-main">金牛物流<span class="cell-sub">河南金牛物流有限公司</span></td>
|
||||
<td class="num-col">6,208.75</td>
|
||||
<td class="num-col">7,914.30</td>
|
||||
<td class="num-col">74</td>
|
||||
<td class="num-col amt-out">-1,705.55</td>
|
||||
<td><span class="pill pill-success">已完成</span></td>
|
||||
</tr>
|
||||
<tr class="clickable" data-view-link="pair">
|
||||
<td class="cell-main">金牛贸易<span class="cell-sub">河南金牛贸易有限公司</span></td>
|
||||
<td class="num-col">9,850.00</td>
|
||||
<td class="num-col">9,102.40</td>
|
||||
<td class="num-col">86</td>
|
||||
<td class="num-col amt-in">+747.60</td>
|
||||
<td><span class="pill pill-success">已完成</span></td>
|
||||
</tr>
|
||||
<tr class="clickable" data-view-link="pair">
|
||||
<td class="cell-main">金牛置业<span class="cell-sub">河南金牛置业有限公司</span></td>
|
||||
<td class="num-col">3,960.20</td>
|
||||
<td class="num-col">5,730.00</td>
|
||||
<td class="num-col">52</td>
|
||||
<td class="num-col amt-out">-1,769.80</td>
|
||||
<td><span class="pill pill-warn">流水待补</span></td>
|
||||
</tr>
|
||||
<tr class="clickable" data-view-link="pair">
|
||||
<td class="cell-main">金牛新能源<span class="cell-sub">河南金牛新能源有限公司</span></td>
|
||||
<td class="num-col">2,130.00</td>
|
||||
<td class="num-col">2,886.00</td>
|
||||
<td class="num-col">31</td>
|
||||
<td class="num-col amt-out">-756.00</td>
|
||||
<td><span class="pill pill-warn">确认中</span></td>
|
||||
</tr>
|
||||
<tr class="clickable" data-view-link="pair">
|
||||
<td class="cell-main">金牛农业<span class="cell-sub">河南金牛农业科技发展有限公司</span></td>
|
||||
<td class="num-col">1,470.85</td>
|
||||
<td class="num-col">1,021.60</td>
|
||||
<td class="num-col">21</td>
|
||||
<td class="num-col amt-in">+449.25</td>
|
||||
<td><span class="pill pill-danger">未提交</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td>合计 · 6 家</td>
|
||||
<td class="num-col">42,040.30</td>
|
||||
<td class="num-col">39,040.30</td>
|
||||
<td class="num-col">392</td>
|
||||
<td class="num-col">+3,000.00</td>
|
||||
<td>—</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="timeline-ticks" aria-hidden="true">
|
||||
<span style="left:0">01.01<small>起算日</small></span>
|
||||
<span style="left:14%">2月</span>
|
||||
<span style="left:26.7%">3月</span>
|
||||
<span style="left:40.7%">4月</span>
|
||||
<span style="left:54.3%">5月</span>
|
||||
<span style="left:68.3%">6月</span>
|
||||
<span style="left:81.9%">7月</span>
|
||||
<span style="left:95.9%">8月</span>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-head">
|
||||
<span class="card-title">公司对查<span class="sub">选择两家公司,直达它们之间的往来明细</span></span>
|
||||
</div>
|
||||
<div class="row" style="align-items: flex-end; flex-wrap: wrap;">
|
||||
<div class="field" style="flex: 1 1 190px; margin-bottom: 0;">
|
||||
<label for="ql-self">本方公司</label>
|
||||
<select class="select" id="ql-self">
|
||||
<option>河南金牛煤业有限公司</option>
|
||||
<option>河南金牛物流有限公司</option>
|
||||
<option>河南金牛贸易有限公司</option>
|
||||
<option>河南金牛置业有限公司</option>
|
||||
<option>河南金牛新能源有限公司</option>
|
||||
<option selected>河南金牛农业科技发展有限公司</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="meta" style="padding: 0 4px 9px; flex: none;">↔</span>
|
||||
<div class="field" style="flex: 1 1 190px; margin-bottom: 0;">
|
||||
<label for="ql-peer">对方公司</label>
|
||||
<select class="select" id="ql-peer">
|
||||
<option selected>河南金牛煤业有限公司</option>
|
||||
<option>河南金牛物流有限公司</option>
|
||||
<option>河南金牛贸易有限公司</option>
|
||||
<option>河南金牛置业有限公司</option>
|
||||
<option>河南金牛新能源有限公司</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detail-box row-between" style="margin-top: 12px;">
|
||||
<div>
|
||||
<div style="font-weight: 650;">金牛农业 → 应收 386.24 万元</div>
|
||||
<div class="meta" style="margin-top: 2px;">14 笔(借 9 / 贷 5)· 最早未结 2026-03-12</div>
|
||||
</div>
|
||||
<button class="btn btn-sm" data-view-link="pair">查看逐笔往来</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="timeline-legend">
|
||||
<li><i class="dot success"></i>1—6 月已结账</li>
|
||||
<li><i class="dot warning"></i>7 月进行中 · 08.05 结账</li>
|
||||
<li><i class="dot danger"></i>工行 9481 断档 07.01—07.21</li>
|
||||
<li><i class="dot today"></i>今天 08.08</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<div class="stack">
|
||||
<div class="card">
|
||||
<div class="card-head">
|
||||
<span class="card-title">待办队列<span class="sub">12 项待处理 · 下方为影响结账的前 4 项,从第 1 项开始</span></span>
|
||||
<button class="btn btn-sm btn-ghost" data-view-link="audit">审核中心 →</button>
|
||||
</div>
|
||||
<div class="list-row">
|
||||
<span class="pill pill-danger">高</span>
|
||||
<div class="lr-main">
|
||||
<div class="lr-title">金牛置业 · 中行尾号 8821 账户 7 月流水断档 11 天</div>
|
||||
<div class="lr-sub">07-06 至 07-16 无流水,影响与金牛煤业 320 万元往来的归集</div>
|
||||
</div>
|
||||
<button class="btn btn-sm" data-view-link="audit">去审核</button>
|
||||
</div>
|
||||
<div class="list-row">
|
||||
<span class="pill pill-danger">高</span>
|
||||
<div class="lr-main">
|
||||
<div class="lr-title">金牛农业 7 月全部账户未提交流水</div>
|
||||
<div class="lr-sub">已发 2 次系统提醒,最近一次 08-18,仍未响应</div>
|
||||
</div>
|
||||
<button class="btn btn-sm" data-view-link="reminders">再提醒</button>
|
||||
</div>
|
||||
<div class="list-row">
|
||||
<span class="pill pill-warn">中</span>
|
||||
<div class="lr-main">
|
||||
<div class="lr-title">金牛新能源 ↔ 金牛贸易 3 笔单边流水待对方证据</div>
|
||||
<div class="lr-sub">合计 486 万元,需新能源侧选择对方银行流水佐证</div>
|
||||
</div>
|
||||
<button class="btn btn-sm" data-view-link="audit">去审核</button>
|
||||
</div>
|
||||
<div class="list-row">
|
||||
<span class="pill pill-warn">中</span>
|
||||
<div class="lr-main">
|
||||
<div class="lr-title">5 笔手工记录待确认往来科目</div>
|
||||
<div class="lr-sub">应收 / 其他应收待判定,涉及煤业、物流、贸易</div>
|
||||
</div>
|
||||
<button class="btn btn-sm" data-view-link="audit">去审核</button>
|
||||
</div>
|
||||
<div class="table-foot">
|
||||
<span>其余 8 项为低风险与已挂起事项</span>
|
||||
<button class="btn btn-sm btn-ghost" data-view-link="audit" style="color: var(--fg); font-weight: 550;">进入审核中心 →</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-head">
|
||||
<span class="card-title">账期与结账<span class="sub">每月 5 日结账 · 全局起算日 2026-01-01</span></span>
|
||||
</div>
|
||||
<dl class="kv">
|
||||
<dt>当前账期</dt><dd>2026-07 · 进行中</dd>
|
||||
<dt>结账日</dt><dd style="color: color-mix(in oklch, var(--warn) 78%, black); font-weight: 650;">2026-08-29(顺延)· 距今 9 天</dd>
|
||||
<dt>上一账期</dt><dd>2026-06 · 已于 07-03 结账</dd>
|
||||
</dl>
|
||||
<button class="btn" data-view-link="settings" style="width: 100%; margin-top: 14px;">进入结账检查</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="app-view" data-page="pair">
|
||||
@@ -232,5 +345,18 @@
|
||||
</dialog>
|
||||
<div class="toast-region" id="toastRegion" aria-live="polite"></div>
|
||||
<script src="app.js"></script>
|
||||
<script>
|
||||
(function () {
|
||||
var input = document.getElementById("company-search");
|
||||
if (!input) return;
|
||||
input.addEventListener("input", function () {
|
||||
var q = this.value.trim();
|
||||
var rows = document.querySelectorAll("#companyTotals tbody tr");
|
||||
rows.forEach(function (tr) {
|
||||
tr.style.display = (!q || tr.textContent.indexOf(q) > -1) ? "" : "none";
|
||||
});
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user