{include file='public/header'}
<div class="wrap {$background_class}"><!-- 有三个区服 shaiya_02 shaiya_03   -->
    <div class="top"></div>
    <div class="clear"></div>
    <div class="zbk_list w1100">
        {include file='public/login'}
        {include file='public/my_nav'}
        <div class="detail_box">
            <div class="pos_nav"><a href="/my/index.html?mode=1">我的珍宝阁</a><i>></i><a href="/my/index.html?mode=1">我的订单</a><a href="">提交订单</a></div>
            <div class="pay_status-info">
                <div class="pay-detail">
                    <div class="step step_on">
                        <span class="icon_block">1</span>
                        <p class="step-status">提交订单</p>
                        <p class="step-time time">{:date("Y-m-d H:i:s",$order['addtime'])}</p>
                        <div class="overstep  overstep_1">
                            <p class="overstep-status1">付款</p>
                            <span class="icon_block icon_flow"></span>
                        </div>
                    </div>

                    <div {if $order.pay_status == 1}class="step step_on"{else/}class="step"{/if}>
                        <span class="icon_block">2</span>
                        <p class="step-status">付款成功</p>
                        <p class="overstep-time time"></p>
                        <div class="overstep  overstep_2">
                            <p class="overstep-status1">发货至游戏内</p>
                            <span class="icon_block icon_flow"></span>
                        </div>
                    </div>
                    <div {if $order.api_status == 1}class="step step_on"{else/}class="step"{/if}>
                        <span class="icon_block">3</span>
                        <p class="step-status">发货成功<br/>请在游戏内查收</p>
                        <p class="overstep-time time"></p>
                    </div>
                </div>
            </div>

            {if $order['ordertype'] == 1}
            <div class="item_box_01">
                <div class="item_l">
                    <div class="avt">
                        <img src="{$details.job_head ?? ''}">
                    </div>
                </div>
                <div class="item_r">
                    <div class="item_r_tit">
                        <h1><i class="icon-01"></i><span>角色亮点</span></h1>
                        <p>{$details.title ?? ""}</p>
                    </div>
                </div>
            </div>
            <div class="item_box_05">
                <div class="item_lable">角色名：{$details.chaname ?? ""}</div>
                <div class="item_lable">等级：{$details.chalv ?? 0}级</div>
                <div class="item_lable">价格：{$details.price ?? "0.00"}元</div>
                <div class="item_lable">职业：{$details.job_text ?? ""}（{$details.grow_text ?? ""}模式）</div>
                <div class="item_detail">
                    <a href="/trade/role/{$details.id}.html" class="orderbtn">查看完整出售信息</a>
                </div>
            </div>
            {/if}

            {if $order['ordertype'] == 2}
            <div class="item_box_06">
                <div class="pic" id="order-pic" data-item='{:json_encode($item, JSON_UNESCAPED_UNICODE)}'>
                    <img style="background-image: url('{$item['iconset'] ?? ''}'); background-position-x: {$item['iconx']}px; background-position-y: {$item['icony']}px; width: 32px;height: 32px;">
                </div>
                <div class="item_box_item">
                    <div class="item_lable">道具名称：{$item.itemname ?? ""}</div>
                    <div class="item_lable">道具状态：<span class="row_color">{$item.og_text ?? ""}</span></div>
                    <div class="item_lable">可用职业：
                        {if $item.job_type == 0}
                        <a href="javascript:;" class="row_color job_type" data-item="{$item.job_text}" lay-on="job-type-tips">{$item.job_type_text ?? ""}</a>
                        {else/}
                        {$item.job_type_text ?? ""}
                        {/if}
                    </div>
                    <div class="item_lable">数量：{$details.num ?? 0}</div>
                    <div class="item_lable">单价：{$details.unit_price ?? 0}元</div>
                    <div class="item_lable">出售剩余时间：
                        <span class="row_color">
                            {if in_array($details.trade_status, [4, 5, 6, 7])}
                                已结束
                            {else/}
                                {if (($order.outtime_type ?? 0) == 1) && $details.outtime_type == 3}
                                    {$order['outtime_text'] ?? ""}
                                {elseif $details.outtime_type == 3}
                                    已结束
                                {else/}
                                    {$details.outtime_text ?? ""}
                                {/if}
                            {/if}
                        </span>
                    </div>
                    <div class="item_detail">
                        <a href="/trade/prop/{$details.id}.html" class="orderbtn">查看完整出售信息</a>
                    </div>
                </div>

            </div>
            {/if}

            {if $order['ordertype'] == 0}
            <div class="item_box_04">
                <div class="item_lable">名称：金币 {$details.num ?? 0}万</div>
                <div class="item_lable">单价：{$details.unit_price ?? 0}元/万金币</div>
                <div class="item_lable">出售剩余时间：
                    <span class="row_color">
                        {if in_array($details.trade_status, [4, 5, 6, 7])}
                                已结束
                        {else/}
                            {if (($order.outtime_type ?? 0) == 1) && $details.outtime_type == 3}
                                {$order['outtime_text'] ?? ""}
                            {elseif $details.outtime_type == 3}
                                已结束
                            {else/}
                                {$details.outtime_text ?? ""}
                            {/if}
                        {/if}
                    </span>
                </div>
            </div>
            {/if}
            <div class="payinfo">
                <p>订单号：{$order['orderno']}</p>
                <p>价格：{$order['price']}元（商品价格由卖方收取）</p>
                <p>订单状态：<span {if $order.pay_status == 0}class="row_color"{elseif $order.pay_status == 2}class="row_color_03"{/if}>{$order['pay_status_text'] ?? ""}</span></p>
                <p>下单时间：{:date("Y-m-d H:i:s",$order['addtime'])}</p>
                {if $order.pay_status == 2}
                    <p>订单取消时间：{:date("Y-m-d H:i:s",$order['cancel_time'])}</p>
                {elseif $order.pay_status == 1}
                    <p>订单支付时间：{:date("Y-m-d H:i:s",$order['paytime'])}</p>
                {else/}
                    <p>订单过期时间：{:date("Y-m-d H:i:s",$order['outtime'])}</p>
                {/if}
                <p>总计：<span class="row_color">{$order['price']}元</span></p>
                {if $order.pay_status == 0}
                <div class="pay-type">
                    <form action="" class="layui-form">
                        <div class="layui-form-item">
                            <label class="layui-form-label">付款方式：</label>
                            <div>
                                <input type="radio" name="paytype" value="alipay" title="支付宝" checked>
                            </div>
                        </div>
                        {if ($order.ordertype == 0 || $order.ordertype == 2)}
                        <div class="layui-form-item">
                            <label class="layui-form-label">选择角色：</label>
                            <div class="layui-input-inline">
                                <select name="chaid" lay-filter="chaidTest">
                                    <option value="0">请选择角色</option>
                                    {notempty name='roles'}
                                    {foreach $roles as $k => $vo}
                                    <option value="{$k}">{$vo}</option>
                                    {/foreach}
                                    {/notempty}
                                </select>
                            </div>
                        </div>
                        {/if}
                        <input type="hidden" name="orderno" value="{$order.orderno ?? ''}">
                        <input type="hidden" name="tousername" value="{$order.tousername ?? ''}">
                        <input type="hidden" name="ordertype" value="{$order.ordertype ?? ''}">
                        <div class="info_btn">
                            <a href="javascript:;" class="pay-btn" lay-submit lay-filter="go-pay">去支付</a>
                            <a href="javascript:;" class="collect-btn" onclick="cancel('{$order.orderno}')">取消订单</a>
                            <a href="javascript:void(0);" onclick="history.back(); setTimeout(() => location.reload(), 100);" class="back-btn">返回</a>
                        </div>
                    </form>
                </div>
                {/if}
            </div>
            {include file="public/intro"}
            {include file="public/vade"}
        </div>
    </div>
    {include file="public/footer"}
</div>
<script>
    layui.use(function(){
        var layer = layui.layer;
        $("a.job_type").on('mouseenter', function() {
            var items = $(this).data("item");
            if (items) {
                // 展示
                layer.tips("<span style='color: #000000;'>"+items+"</span>", this, {
                    tips: [3, '#FFFFFF'],
                    time: 0
                });
            }
        });
        $("a.job_type").on('mouseleave', function() {
            layer.closeAll('tips');
        });
    });
</script>