@if(!compact){
<section class="credit-card" aria-label="门店额度账户">
 <header><div><h2>门店额度账户</h2><span>{{data()?.storeName}}</span></div><div class="actions"><button type="button" (click)="load()" [disabled]="loading()"><lucide-icon [img]="icons.RefreshCw" [size]="16" [class.spin]="loading()"/>{{loading()?'读取中…':'刷新额度'}}</button>@if(data()?.canPost){<button class="primary" type="button" (click)="start()">充值额度</button>}</div></header>
 @if(error()){<p class="error" role="alert">{{error()}}</p>}@if(message()){<p class="success" role="status">{{message()}}</p>}
 @if(loading()&&!data()){<p>正在读取门店额度…</p>}
 @if(data()){<div class="balances">@for(a of accounts;track a.key){<article><span>{{a.label}}</span><strong>{{balance(a.key)?.balance | number:'1.0-2'}} <small>{{a.unit}}</small></strong><small>可用 {{balance(a.key)?.available | number:'1.0-2'}} · 预留 {{balance(a.key)?.reserved | number:'1.0-2'}}</small></article>}</div>}
 <nav aria-label="门店额度视图"><button type="button" [class.active]="tab()==='accounts'" [attr.aria-pressed]="tab()==='accounts'" (click)="tab.set('accounts')">额度概览</button><button type="button" [class.active]="tab()==='ledger'" [attr.aria-pressed]="tab()==='ledger'" (click)="showLedger()">额度流水</button></nav>
 @if(tab()==='accounts'){<p>总部为门店入账，门店再向所属学生划拨。四类额度分别记账。</p>@if(data()&&!data()?.canPost){<p>{{isStore()?'本店额度由总部充值；为学生充值请进入学生的课时账户。':'当前账号可查看额度；充值需由超级管理员单独授权。'}}</p>}}
 @if(tab()==='ledger'){
 <div class="filters" role="group" aria-label="额度流水筛选">
  <label>账户<select aria-label="账户" [(ngModel)]="accountFilter"><option value="">全部账户</option>@for(a of accounts;track a.key){<option [value]="a.key">{{a.label}}</option>}</select></label>
  <label>业务类型<select aria-label="业务类型" [(ngModel)]="kindFilter"><option value="">全部业务</option>@for(k of ['fund','transfer','refund','adjust','recharge','deduction','lesson'];track k){<option [value]="k">{{kindLabel(k)}}</option>}</select></label>
  <app-operations-date-filter label="开始日期" [value]="dateFrom" (valueChange)="dateFrom=$event"/>
  <app-operations-date-filter label="结束日期" [value]="dateTo" (valueChange)="dateTo=$event"/>
  <div class="filter-actions">
   <button class="primary" type="button" (click)="loadLedger(true)" [disabled]="ledgerBusy()"><lucide-icon [img]="icons.Search" [size]="16"/>{{ledgerBusy()?'查询中…':'查询'}}</button>
   <button type="button" (click)="resetFilters()" [disabled]="ledgerBusy()"><lucide-icon [img]="icons.RotateCcw" [size]="16"/>重置</button>
   <button class="export-button" type="button" (click)="export()" [disabled]="exporting()||ledgerBusy()"><lucide-icon [img]="icons.Download" [size]="16"/>{{exporting()?'导出中…':'导出 Excel'}}</button>
  </div>
 </div>
 @if(ledgerError()){<p class="error" role="alert">{{ledgerError()}}</p>}@if(ledgerBusy()){<p>正在读取流水…</p>}
 <div class="scroll ledger-table" role="region" aria-label="额度流水明细" tabindex="0" [attr.aria-busy]="ledgerBusy()" [class.has-entries]="ledger()?.items?.length"><table><thead><tr><th>时间 / 单号</th><th>账户 / 业务</th><th>变动</th><th>前后余额</th><th>操作人 / 原因</th><th>原单 / 操作</th></tr></thead><tbody>@for(row of ledger()?.items||[];track row.groupId){@for(l of row.lines;track $index){<tr><td>{{row.at|date:'yyyy-MM-dd HH:mm':'+0800'}}<small>{{row.groupId}}</small></td><td>{{label(l.account)}}<small>{{kindLabel(l.kind)}}</small></td><td [class.negative]="l.delta<0">{{l.delta>0?'+':''}}{{l.delta|number:'1.0-2'}}</td><td>{{l.before??'未记录'}} → {{l.after??'未记录'}}</td><td>{{l.operator||'未记录'}}<small>{{l.reason}}</small></td><td><small>{{l.sourceTransactionId||'—'}}</small>@if(data()?.canPost&&l.kind==='fund'&&l.reference){<button type="button" (click)="reverse(l)">纠正入账</button>}</td></tr>}}@empty{<tr><td colspan="6" class="empty-ledger">{{ledgerError()?'流水暂不可用':ledgerBusy()?'读取中…':'没有符合条件的流水'}}</td></tr>}</tbody></table></div>
 <footer class="ledger-footer"><span>共 {{ledger()?.total??'—'}} 笔 · 第 {{page}} 页</span><div class="pagination-actions"><button type="button" (click)="page=page-1;loadLedger()" [disabled]="page<=1||ledgerBusy()">上一页</button><button type="button" (click)="page=page+1;loadLedger()" [disabled]="page*20>=(ledger()?.total||0)||ledgerBusy()">下一页</button></div></footer>
 }
</section>}
@if(open()){
<div class="backdrop" (click)="close()"></div><section class="credit-dialog credit-drawer" role="dialog" aria-modal="true" aria-label="门店额度充值">
<header><div><h2>{{direction==='reverse'?'纠正总部入账':'门店充值额度'}}</h2><span>{{data()?.storeName||'正在读取门店…'}} · ID {{data()?.storeId||'—'}}</span></div><button type="button" (click)="close()" [disabled]="busy()">关闭</button></header>
@if(error()){<p class="error" role="alert">{{error()}}</p>}
@if(loading()){<p>正在读取账户…</p>}
@if(data()&&!data()?.canPost){<p>当前账号没有门店充值权限，请由超级管理员授权。</p>}
@if(data()?.canPost){<form (ngSubmit)="check()"><fieldset [disabled]="busy()||loading()">
@if(direction==='reverse'){<p>关联原单：{{sourceId}}</p><p>填写需要扣回的错误数量；已划拨或预留的额度不能扣回。</p>}@else{<p>填写本次增加的额度，不充值的项目保留 0。</p>}
<div class="amount-grid">@for(a of accounts;track a.key){@if(direction!=='reverse'||sourceAccount===a.key){<label>{{a.label}}（{{a.unit}}）<small>当前 {{balance(a.key)?.balance??'—'}}</small><input [name]="a.key" type="number" min="0" [step]="a.key==='UserPoint'?0.01:1" [(ngModel)]="amounts[a.key]" (ngModelChange)="resetPreview()"/></label>}}</div>
<label>记账方式<select name="method" [(ngModel)]="method" (ngModelChange)="resetPreview()"><option value="">请选择</option><option>微信</option><option>支付宝</option><option>转账</option><option>线下收款</option><option>运营记账</option></select></label>
<label>{{direction==='reverse'?'纠正原因及核对依据':'操作原因'}}<textarea name="reason" [(ngModel)]="reason" (ngModelChange)="resetPreview()" minlength="2" maxlength="500" required rows="2"></textarea></label>
<button class="primary" type="submit">{{busy()?'处理中…':'预览额度变动'}}</button></fieldset></form>
@if(preview();as p){<section class="preview" aria-label="额度变动预览"><h3>确认本次变动</h3><div class="scroll"><table><thead><tr><th>账户</th><th>增减</th><th>原余额</th><th>新余额</th></tr></thead><tbody>@for(l of p.lines;track l.account){<tr><td>{{label(l.account)}}</td><td>{{l.delta>0?'+':''}}{{l.delta}}</td><td>{{l.before}}</td><td>{{l.after}}</td></tr>}</tbody></table></div><button class="primary" type="button" (click)="submit()" [disabled]="busy()">{{busy()?'正在记账…':'确认统一入账'}}</button></section>}}
</section>}