{{:ModuleInclude('public/header')}}

<div class="right-content">
    <div class="content-nav">
        <a href="{{:PluginsAdminUrl('vr_ticket', 'admin', 'ticketlist')}}" class="am-btn am-btn-secondary am-btn-xs">
            <i class="am-icon-angle-left"></i> 返回列表
        </a>
        <span>票详情</span>
    </div>

    <div class="am-g am-margin-top">
        <!-- 左侧：票基本信息 -->
        <div class="am-u-sm-6">
            <div class="am-panel am-panel-default">
                <div class="am-panel-hd">票基础信息</div>
                <div class="am-panel-bd">
                    <table class="am-table am-text-sm">
                        <tr>
                            <td width="100" class="am-text-gray">票码</td>
                            <td>{{$ticket.ticket_code}}</td>
                        </tr>
                        <tr>
                            <td class="am-text-gray">订单号</td>
                            <td>{{$ticket.order_no}}</td>
                        </tr>
                        <tr>
                            <td class="am-text-gray">商品名</td>
                            <td>{{$ticket.goods_name}}</td>
                        </tr>
                        <tr>
                            <td class="am-text-gray">观演人</td>
                            <td>{{$ticket.visitor_name}}</td>
                        </tr>
                        <tr>
                            <td class="am-text-gray">手机号</td>
                            <td>{{$ticket.mobile}}</td>
                        </tr>
                        <tr>
                            <td class="am-text-gray">身份证</td>
                            <td>{{if !empty($ticket.id_card)}}{{$ticket.id_card}}{{else}}未填写{{/if}}</td>
                        </tr>
                        <tr>
                            <td class="am-text-gray">座位信息</td>
                            <td>{{if !empty($ticket.seat_info)}}{{$ticket.seat_info}}{{else}}无{{/if}}</td>
                        </tr>
                        <tr>
                            <td class="am-text-gray">状态</td>
                            <td>
                                {{if $ticket.status == 0}}
                                <span class="am-badge am-badge-warning">未核销</span>
                                {{elseif $ticket.status == 1}}
                                <span class="am-badge am-badge-success">已核销</span>
                                {{elseif $ticket.status == 2}}
                                <span class="am-badge am-badge-danger">已退款</span>
                                {{/if}}
                            </td>
                        </tr>
                        <tr>
                            <td class="am-text-gray">发放时间</td>
                            <td>{{$ticket.create_time}}</td>
                        </tr>
                        {{if $ticket.status == 1}}
                        <tr>
                            <td class="am-text-gray">核销时间</td>
                            <td>{{$ticket.verify_time}}</td>
                        </tr>
                        <tr>
                            <td class="am-text-gray">核销人</td>
                            <td>{{if !empty($ticket.verifier_name)}}{{$ticket.verifier_name}}{{else}}未知{{/if}}</td>
                        </tr>
                        {{/if}}
                    </table>
                </div>
            </div>
        </div>

        <!-- 右侧：二维码 -->
        <div class="am-u-sm-6">
            <div class="am-panel am-panel-default">
                <div class="am-panel-hd">票条形码</div>
                <div class="am-panel-bd am-text-center">
                    <div id="qrcode-container" class="am-margin-bottom">
                        <!-- QR 码将由 JsBarcode 生成 -->
                        <svg id="qrcode-svg"></svg>
                    </div>
                    <p class="am-text-gray am-text-sm">票码：{{$ticket.ticket_code}}</p>
                    
                    <!-- 条形码 -->
                    <div class="am-margin-top">
                        <svg id="barcode"></svg>
                    </div>
                </div>
            </div>
            
            <!-- 核销操作（仅未核销状态显示） -->
            {{if $ticket.status == 0}}
            <div class="am-panel am-panel-default am-margin-top">
                <div class="am-panel-hd">核销操作</div>
                <div class="am-panel-bd">
                    <form class="am-form form-validation" id="verify-form">
                        <input type="hidden" name="ticket_code" value="{{$ticket.ticket_code}}" />
                        <div class="am-form-group">
                            <button type="submit" class="am-btn am-btn-primary am-btn-block am-radius" data-am-loading="{spinner: 'circle-o-notch', loadingText: '核销中...'}">
                                <i class="am-icon-check"></i> 立即核销
                            </button>
                        </div>
                    </form>
                </div>
            </div>
            {{/if}}
        </div>
    </div>
</div>

<script src="{{$public_host}}static/common/lib/JsBarcode/JsBarcode.all.min.js"></script>
<script>
$(function() {
    // 生成条形码
    var ticketCode = '{{$ticket.ticket_code}}';
    if (typeof JsBarcode !== 'undefined') {
        JsBarcode('#barcode', ticketCode, {
            format: 'CODE128',
            width: 2,
            height: 60,
            displayValue: true,
            fontSize: 14
        });
    }
    
    // 核销表单提交
    $('#verify-form').on('submit', function(e) {
        e.preventDefault();
        
        var $btn = $(this).find('button[type="submit"]');
        
        $btn.button('loading');
        
        $.ajax({
            url: '{{:PluginsAdminUrl("vr_ticket", "admin", "ticketverify")}}',
            type: 'POST',
            data: { ticket_code: ticketCode },
            dataType: 'json',
            success: function(res) {
                $btn.button('reset');
                
                if (res.code === 0) {
                    alert('核销成功');
                    location.reload();
                } else {
                    alert(res.msg || '核销失败');
                }
            },
            error: function() {
                $btn.button('reset');
                alert('网络请求失败');
            }
        });
    });
});
</script>

{{:ModuleInclude('public/footer')}}