{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/trade_nav'}
        <div class="detail_box">
            <div class="pos_nav"><a href="/trade/index.html?{$query}">浏览商品</a><i>></i><a href="javascript:;">商品详情</a></div>
            <div class="item_box_04">
                <div class="pic" id="prop-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_lable_wrap" title="{$item.itemname ?? ""}">道具名称：{$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">价格：{$details.price ?? 0}元</div>
                    <div class="item_lable">
                        {if in_array($details.trade_status, [4, 5, 6, 7])}
                        出售剩余时间：已结束
                        {else/}
                            {if $details.outtime_type == 1}
                            出售剩余时间：<span class="row_color">{$details.outtime_text ?? ""}</span>
                            {elseif $details.outtime_type == 2}
                            公示剩余时间：<span class="row_color">{$details.outtime_text ?? ""}</span>
                            {else/}
                            出售剩余时间：已结束
                            {/if}
                        {/if}
                    </div>
                </div>
            </div>
<!--            道具tips-->
            <div class="prop_tips" id="prop_tips">

            </div>
            <div class="info_btn">
                {if $details.trade_status == 2}
                <a class="pay-btn" href="javascript:;" onclick="buy({$details.tid ?? 0}, 2)">购买</a>
                {/if}
                <a href="javascript:;" onclick="collect(this, {$params.id}, 2)" class="collect-btn">{if $is_collect}取消收藏{else/}收藏{/if}</a>
                <a href="javascript:void(0);" onclick="history.back(); return false;" class="back-btn">返回</a>
            </div>
        </div>
        {include file="public/intro"}
        {include file="public/vade"}
    </div>
    {include file="public/footer"}
</div>
<script>
    $(function () {
        var items = $("#prop-pic").data("item");
        // 模块输出
        var tips = showBackPackTips(items);
        if (tips) {
            $("#prop_tips").html(tips);
        }
    })
    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>