195 lines
8.1 KiB
HTML
195 lines
8.1 KiB
HTML
{layout name="layout2" /}
|
||
<style>
|
||
.invoice-info-card {
|
||
margin-bottom: 15px;
|
||
border-radius: 4px;
|
||
box-shadow: 0 1px 2px rgba(0,0,0,0.1);
|
||
}
|
||
.invoice-info-card .layui-card-header {
|
||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||
color: #fff;
|
||
font-weight: bold;
|
||
border-radius: 4px 4px 0 0;
|
||
}
|
||
.invoice-info-card .layui-card-header:first-child {
|
||
background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
|
||
}
|
||
.info-row {
|
||
padding: 12px 0;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
}
|
||
.info-row:last-child {
|
||
border-bottom: none;
|
||
}
|
||
.info-label {
|
||
font-weight: 600;
|
||
color: #333;
|
||
min-width: 180px;
|
||
display: inline-block;
|
||
}
|
||
.info-value {
|
||
color: #666;
|
||
word-break: break-all;
|
||
}
|
||
.info-badge {
|
||
font-size: 13px;
|
||
padding: 4px 12px;
|
||
}
|
||
.file-preview {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 10px;
|
||
padding: 8px 12px;
|
||
background: #f8f9fa;
|
||
border-radius: 4px;
|
||
border: 1px solid #e9ecef;
|
||
}
|
||
.section-divider {
|
||
height: 1px;
|
||
background: linear-gradient(to right, transparent, #e0e0e0, transparent);
|
||
margin: 20px 0;
|
||
}
|
||
</style>
|
||
<div class="">
|
||
<div class="layui-card-body" pad15>
|
||
<!-- 基本信息 -->
|
||
<div class="layui-card invoice-info-card">
|
||
<div class="layui-card-header">
|
||
<i class="layui-icon layui-icon-file"></i> 基本信息
|
||
</div>
|
||
<div class="layui-card-body">
|
||
<div class="info-row">
|
||
<span class="info-label">记录ID：</span>
|
||
<span class="info-value">{$invoice.id}</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">发票信息ID：</span>
|
||
<span class="info-value">{$invoice.invoice_id}</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">状态：</span>
|
||
<span class="info-value">
|
||
{if $invoice.state == 1}
|
||
<span class="layui-badge layui-bg-blue info-badge">待开票</span>
|
||
{elseif $invoice.state == 2}
|
||
<span class="layui-badge layui-bg-red info-badge">驳回</span>
|
||
{elseif $invoice.state == 3}
|
||
<span class="layui-badge layui-bg-green info-badge">完成</span>
|
||
{else}
|
||
<span class="layui-badge layui-bg-gray info-badge">未知</span>
|
||
{/if}
|
||
</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">发票文件：</span>
|
||
<span class="info-value">
|
||
{if $invoice.document}
|
||
<div class="file-preview">
|
||
<a href="{$invoice.document_url}" target="_blank" class="layui-btn layui-btn-primary layui-btn-xs">
|
||
<i class="layui-icon layui-icon-download-circle"></i> 查看文件
|
||
</a>
|
||
<span style="color: #999; font-size: 12px;">{$invoice.document_url}</span>
|
||
</div>
|
||
{else}
|
||
<span style="color: #999;">无文件</span>
|
||
{/if}
|
||
</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">创建时间：</span>
|
||
<span class="info-value">{$invoice.create_time|default='--'}</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">更新时间：</span>
|
||
<span class="info-value">{$invoice.update_time|default='--'}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 订单信息 -->
|
||
<div class="layui-card invoice-info-card">
|
||
<div class="layui-card-header">
|
||
<i class="layui-icon layui-icon-cart"></i> 订单信息
|
||
</div>
|
||
<div class="layui-card-body">
|
||
<div class="info-row">
|
||
<span class="info-label">订单编号：</span>
|
||
<span class="info-value">{$invoice.order.order_sn ?? "--"}</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">订单金额：</span>
|
||
<span class="info-value" style="color: #f56c6c; font-weight: bold; font-size: 16px;">
|
||
¥{$invoice.order.settle_amount ?? "0.00"}
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 用户信息 -->
|
||
<div class="layui-card invoice-info-card">
|
||
<div class="layui-card-header">
|
||
<i class="layui-icon layui-icon-user"></i> 用户信息
|
||
</div>
|
||
<div class="layui-card-body">
|
||
<div class="info-row">
|
||
<span class="info-label">系统用户名：</span>
|
||
<span class="info-value">{$invoice.invoice.user.nickname ?? "--"}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 发票抬头信息 -->
|
||
<div class="layui-card invoice-info-card">
|
||
<div class="layui-card-header">
|
||
<i class="layui-icon layui-icon-form"></i> 发票抬头信息
|
||
</div>
|
||
<div class="layui-card-body">
|
||
<div class="info-row">
|
||
<span class="info-label">类型：</span>
|
||
<span class="info-value">
|
||
{if $invoice.invoice.type == 1}
|
||
<span class="layui-badge layui-bg-blue info-badge">个人</span>
|
||
{elseif $invoice.invoice.type == 2}
|
||
<span class="layui-badge layui-bg-orange info-badge">企业</span>
|
||
{else}
|
||
<span class="layui-badge layui-bg-gray info-badge">未知</span>
|
||
{/if}
|
||
</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">发票类型：</span>
|
||
<span class="info-value">{$invoice.invoice.invoice_type ?? "--"}</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">发票抬头/企业名称：</span>
|
||
<span class="info-value" style="font-weight: 500;">{$invoice.invoice.invoice_title ?? "--"}</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">纳税人识别号/统一社会信用代码：</span>
|
||
<span class="info-value" style="font-family: 'Courier New', monospace; letter-spacing: 1px;">
|
||
{$invoice.invoice.identification ?? "--"}
|
||
</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">注册地址：</span>
|
||
<span class="info-value">{$invoice.invoice.address ?? "--"}</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">注册电话：</span>
|
||
<span class="info-value">{$invoice.invoice.phone ?? "--"}</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">开户行：</span>
|
||
<span class="info-value">{$invoice.invoice.bank ?? "--"}</span>
|
||
</div>
|
||
<div class="info-row">
|
||
<span class="info-label">开户账号：</span>
|
||
<span class="info-value" style="font-family: 'Courier New', monospace;">
|
||
{$invoice.invoice.account ?? "--"}
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|