@if (loading()) { <div class="order-state"><lucide-icon class="spin" [img]="icons.RefreshCw" [size]="20" />正在加载订单</div> }
@else {
@if (order(); as item) {
  <section class="order-page">
    <header><div><span>订单号</span><strong>{{ item['OrderNo'] || item['id'] || item['ID'] }}</strong></div><b [class.done]="isPaid()">{{ isMerchant() ? orderStatus() : (isPaid() ? '已支付' : '待付款') }}</b></header>
    <section class="timeline"><div class="active"><lucide-icon [img]="icons.CreditCard" [size]="18" /><span>支付</span></div><div [class.active]="isDelivered()"><lucide-icon [img]="icons.Truck" [size]="18" /><span>发货</span></div><div [class.active]="isSigned()"><lucide-icon [img]="icons.PackageCheck" [size]="18" /><span>完成</span></div></section>

    <section class="order-card details"><h2>{{ isPickup() ? '到店自提' : '收货信息' }}</h2><dl>@if (isPickup()) { <div><dt>取货状态</dt><dd>{{ isPickedUp() ? '货物已被取出' : '暂未上门取货' }}</dd></div> } @else { <div><dt>收货人</dt><dd>{{ item['Receiver'] || item['ReceivName'] || '-' }}</dd></div><div><dt>联系电话</dt><dd>{{ item['MobileNum'] || item['Mobile'] || '-' }}</dd></div><div><dt>收货地址</dt><dd>{{ item['Shengfen'] || '' }} {{ item['Jiedao'] || item['Address'] || '-' }}</dd></div> }</dl></section>

    <section class="order-card products"><h2>商品清单</h2>@for (cart of carts(); track cart['CartID'] ?? cart['ID'] ?? $index) { <article><img [src]="itemImage(cart)" [alt]="itemName(cart)" /><div><strong>{{ itemName(cart) }}</strong><span>数量 × {{ cart['Pronum'] || cart['pronum'] || 1 }}</span></div><b>¥{{ cart['Shijia'] || cart['AllMoney'] || cart['LinPrice'] || 0 }}</b></article> }<div class="amount-row"><span>@if (discount() > 0) { 优惠券已减免 ¥{{ discount() | number:'1.2-2' }} }</span><strong>订单金额 ¥{{ amount() | number:'1.2-2' }}</strong></div></section>

    <section class="order-card details"><h2>快递信息</h2>@if (express()['ID']) { <dl><div><dt>快递公司</dt><dd>{{ express()['ExpComp'] || '-' }}</dd></div><div><dt>快递单号</dt><dd>{{ express()['ExpNo'] || '-' }}</dd></div>@if (express()['ExpRemind']) { <div><dt>快递备注</dt><dd>{{ express()['ExpRemind'] }}</dd></div> }</dl> } @else { <p class="empty-copy">暂无物流信息</p> }</section>

    <section class="order-card details"><h2><lucide-icon [img]="icons.ReceiptText" [size]="18" />发票信息</h2>@if (needsInvoice()) { <dl><div><dt>发票类型</dt><dd>{{ invoiceType() }}</dd></div><div><dt>{{ invoiceType() === '个人' ? '姓名' : '企业名称' }}</dt><dd>{{ invoice()['InvHead'] || '-' }}</dd></div><div><dt>{{ invoiceType() === '个人' ? '身份证号' : '信用代码' }}</dt><dd>{{ invoice()['UserCode'] || '-' }}</dd></div><div><dt>联系邮箱</dt><dd>{{ invoice()['UserEmail'] || '-' }}</dd></div>@if (invoiceType() === '企业') { <div><dt>注册电话</dt><dd>{{ invoice()['UserMobile'] || '-' }}</dd></div><div><dt>注册地址</dt><dd>{{ invoice()['UserAddress'] || '-' }}</dd></div><div><dt>开户银行</dt><dd>{{ invoice()['UserBankName'] || '-' }}</dd></div><div><dt>银行账号</dt><dd>{{ invoice()['UserBankAccount'] || '-' }}</dd></div> }</dl> } @else { <p class="empty-copy">该订单无需开具发票</p> }</section>

    @if (isMerchant()) { <section class="order-card buyer"><div><lucide-icon [img]="icons.UserRound" [size]="18" /><img [src]="buyerAvatar()" alt="买家头像" /><strong>{{ buyer()['honeyName'] || buyer()['userName'] || '买家' }}</strong></div><time>下单时间：{{ dateText(item['AddTime']) }}</time></section> }

    @if (!isMerchant() && !isPaid()) { <section class="order-card payment"><h2>重新支付</h2><label><span>支付密码</span><input type="password" [(ngModel)]="payPassword" autocomplete="current-password" placeholder="余额支付时必填" /></label><div class="pay-actions"><button type="button" (click)="settle(1)" [disabled]="paying()">余额支付</button><button type="button" (click)="settle(2)" [disabled]="paying()">微信支付</button><button type="button" (click)="settle(3)" [disabled]="paying()">支付宝</button></div></section> }

    <section class="order-links">@if (isMerchant()) { @if (canDeliver()) { <button type="button" (click)="deliveryOpen.set(true)"><lucide-icon [img]="icons.Send" [size]="18" />发送货物</button> } <button type="button" class="secondary" (click)="backToOrders()">回到订单列表</button> } @else { <a routerLink="/pages/shop/order_appeal" [queryParams]="{ id: orderId() }">申请售后</a><a routerLink="/pages/shop/order_comment" [queryParams]="{ id: orderId() }">评价订单</a>@if (isPaid() && isDelivered() && !isSigned()) { <button type="button" (click)="signFor()"><lucide-icon [img]="icons.CheckCircle2" [size]="18" />确认收货</button> } }</section>
  </section>
}
}

@if (deliveryOpen()) { <div class="delivery-backdrop" (click)="deliveryOpen.set(false)"><section class="delivery-dialog" (click)="$event.stopPropagation()"><header><h2>发送货物</h2><button type="button" aria-label="关闭" (click)="deliveryOpen.set(false)"><lucide-icon [img]="icons.X" [size]="20" /></button></header><label><span>快递公司</span><select [(ngModel)]="expComp"><option value="">请选择快递公司</option>@for (company of expressCompanies; track company) { <option [value]="company">{{ company }}</option> }</select></label><label><span>快递单号</span><input [(ngModel)]="expNo" autocomplete="off" placeholder="请填写快递单号" /></label><label><span>快递备注</span><textarea [(ngModel)]="expRemind" rows="4"></textarea></label><button type="button" class="deliver-button" (click)="deliver()">确认发货</button></section></div> }