<extend name="Public/bases2" />
<block name="css">
  <link href="__CSS__/game.css" rel="stylesheet" >
  <link href="__CSS__/trade.css" rel="stylesheet" >
	<style>
	.footer * {box-sizing:content-box;}
	@media screen and (min-width:640px) {
		.trade_tit {height:4.44rem;padding:1.4rem 2rem;}
		.new_sell {height:4.44rem;line-height:4.44rem;font-size:15px;}
		.price_sorting {font-size:15px;}
		.serch_go {top:1.2rem;font-size:14px;padding-left:1rem;padding-right:2.8rem;}
		.icon_search {}
		.z_game_detailli {padding:1.4rem 0;}
		.z_date {margin-bottom:1.7rem;font-size:1.6rem;}
		.trade_img {width:19rem;height:10rem;}
		.custom_media .media-heading {font-size:1.8rem;}
		.z_detailp {margin-top:2rem;margin-bottom:0.5rem;}
		.game_btn {padding:0.2rem 0.8rem;font-size:1.4rem;}
		.z_pays {font-size:1.8rem;}
	}
	.good-info-tags {
		display: inline-block;
		color: rgb(151, 151, 151);
		padding: 0.04rem 0.2rem;
		border: 1px solid currentColor;
		border-radius: 20px;
		font-size: 1.3rem;
	}
	</style>
</block>
<block name="body" >
    <!--头部-->
    <div class="zmarg_btm59">

	<header class="header trade-header">
      <div class="">
        <h1 class="trade_caption">账号交易</h1>
		<a href="{:U('Trade/trade_notice')}" class="z_instruction" id="jstradenotice">交易须知</a>
      </div>
    </header>
      <div class="shortcut clearfix marg_t5">
        <ul class="trade_topul z_clearfix">
          <li>
            <a href="{:U('Trade/deal')}">
              <img src="__IMG__/trade/icon_normal_chengjiao@3x.png" />
            </a>
          </li>
          <li>
            <a class="btn_tiaozhuan" url-href="{:U('Trade/publish',array('is_app'=>I('is_app'),'token'=>I('token')))}">
              <img src="__IMG__/trade/icon_normal_maihao@3x.png" />
            </a>
          </li>
          <li>
            <a class="btn_tiaozhuan" url-href="{:U('Trade/record',array('is_app'=>I('is_app'),'token'=>I('token')))}">
              <img src="__IMG__/trade/icon_normal_jilu@3x.png" />
            </a>
          </li>
          <li>
            <a href="javascript:;" class="jschatqq" data-value="{:C('APP_QQ')}">
              <img src="__IMG__/trade/icon_normal_kefu@3x.png" />
            </a>
          </li>
        </ul>
		<ul class="trade_topul z_clearfix scroll1">
			<li onclick="window.location.href=&#39;{:U('Trade/deal')}&#39;">
			 <span>成交动态</span>
			</li>
			<li onclick="window.location.href=&#39;{:U('Trade/publish')}&#39;">
			 <span>我要卖号</span>
			</li>
			<li onclick="window.location.href=&#39;{:U('Trade/record')}&#39;">
			 <span>交易记录</span>
			</li>
			<li class="jschatqq" data-value="{:C('APP_QQ')}">
			 <span>联系客服</span>
			</li>
		</ul>
      </div>
	  <div class="scroll2">
		  <div class="trade_tit" style="background-color:#fff;">
			<div class="new_sell" onclick="window.location.href=&#39;{:U('Trade/index',array('p'=>1,'is_app'=>I('is_app'),'token'=>I('token')))}&#39;">最新出售</div>
			<div class="price_sorting"  onclick="window.location.href=&#39;{:U('Trade/index',array('p'=>1,'px'=>I('px',1),'is_app'=>I('is_app'),'token'=>I('token')))}&#39;">
				<div class="sorting_div">
					<i class="sorting_icon icon_top <eq name='px' value='2'>active</eq>"></i>
					<i class="sorting_icon icon_bottom <eq name='px' value='1'>active</eq>"></i>
				</div>
				价格
			</div>
			<a class="serch_go" href="{:U('trade/search_list',array('is_app'=>I('is_app'),'token'=>I('token')))}">
				<notempty name='Think.get.game_id'>{$game_name}<else />请输入游戏名称</notempty>
				<span class="icon_search"></span>
			</a>
		  </div>
	  </div>
	  <div class="t-list gd-t-list">
            <div class="content gift-content">

			<empty name="lists">

			<!-- 交易页无数据 begin!-->
			<div class="no_data">
				<div class="nodata_content">
					<img class="nodata_img" src="__IMG__/trade/icon_shangpin@3x.png" alt="" height="" width="">
					<notempty name='Think.get.game_id'>
					<p class="nodata_txt">这个游戏还没有商品出售,逛逛其他的吧~</p>
					<else />
					<p class="nodata_txt">暂无商品出售,逛逛其他地方吧~</p>
					</notempty>
				</div>
			</div>
			<!--end! 交易页无数据 -->

			<else />
        <ul class="" id="ajaxContainer" currentpage="{$page}" game_id="{:I('game_id',0)}" game_name="{:I('game_name','')}" maxpage="{$totalpage}">
					<volist name="lists" id="vo">
						<li class="z_game_detailli gameDetail" data_id="{$vo['id']}" >
              <p class="z_date">{$vo.online_time}</p>
						<div class="media custom_media">
						  <div class="media-left">
							<a href="#">
							  <img class="media-object trade_img" src="<notempty name='vo.icon'>{$vo.icon}<else />__IMG__/pic_game@3x.png</notempty>" alt="...">
							</a>
						  </div>
						  <div class="media-body ver_bot">
							<h4 class="media-heading col_17">{$vo.title}</h4>
							<p class="z_clearfix z_detailp">
								<span class="good-info-tags">{$vo.game_name}</span>
								<span class="z_pays">¥{$vo.price}</span>
							</p>
						  </div>
						</div>
            </li>
					</volist>
				</ul>

			 </empty>
            </div>
          </div>

      </div>

    </div>
    </div>
		<div class="popmsg pop-dialog"></div>
    <div class="loading ms-none hidden" id="moreBtn"><a href="javascript:" class="link"></a></div>
    <div class="popwin2 pop-window" style="background:#FFF;"><div class="pop-page"><div class="pop-wrap"></div></div></div>
</block>

<block name="footer">
	<empty name="is_app">
	<footer class="footer">
      <div class="foot-nav">
      <div class="foot-nav-list">
        <a href="{:U('Index/index')}" class="">
          <i class="iconfont icon-home"></i>
          <p>首页</p>
        </a>
        <a href="{:U('Trade/index')}" class="on">
          <i class="iconfont icon-trade"></i>
          <p>交易</p>
        </a>
        <a href="{:U('Shop/index')}" class="">
          <i class="iconfont icon-shop"></i>
          <p>商城</p>
        </a>
         <a href="{:U('Gift/index')}" class="">
          <i class="iconfont icon-gift"></i>
          <p>礼包</p>
        </a>
        <a href="{:U('User/index')}" class="">
          <i class="iconfont icon-user"></i>
          <p>我的</p>
        </a>
      </div>
      </div>
    </footer>
	</empty>
</block>

<block name="script">
		<script src="__JS__/ajaxload.js"></script>
    <script src="__JS__/pop.lwx.min.js"></script>
	<script>

	$(function() {
	    $('.btn_tiaozhuan').click(function () {
			var $this= $(this);
			var url = $this.attr('url-href');
			var login_status = {$login_status|default=0};
			if(login_status == 0){
                try{
                    $mt = "{:get_device_type()}";
                    if($mt==2){
                        window.webkit.messageHandlers.sy_small_login.postMessage(1);
                    }else if($mt!=2){
                        window.mengchuang.sy_small_login();
                    }
                }catch (e) {
                    window.location.href = url;
                }
			}else{
			    window.location.href = url;
			}
        })
		$('.jschatqq').click(function() {
			var qq = $.trim($(this).attr('data-value'));
			var u = navigator.userAgent;
            try{
                $mt = "{:get_device_type()}";
                if($mt==2){
                    window.webkit.messageHandlers.sy_small_serviceQQ.postMessage(1);
                }else if($mt!=2){
                    window.mengchuang.sy_small_serviceQQ();
                }
            }catch (e) {
                if (!!u.match(/AppleWebKit.*Mobile.*/)||!u.match(/AppleWebKit/)) {
                    window.location.href="mqqwpa://im/chat?chat_type=wpa&uin="+qq+"&version=1&src_type=web";
                }else
                    window.location.href="http://wpa.qq.com/msgrd?v=3&uin="+qq+"&site=qq&menu=yes";
                return false;
            }
		});

		//点击商品判断
		$('.gameDetail').click(function(){
		   var pmsg = $(".popmsg").pop();
           var id = $(this).attr('data_id');
           $.ajax({
           	url:"{:U('trade/trade_is_exist')}",
           	type:"POST",
            dataType:"json",
            data:{good_id:id},
            success:function(data){
                if(data.status==1){
                	window.location.href= "{:U('Trade/detail',array('is_app'=>I('is_app'),'token'=>I('token')),false)}/id/"+id;
                }else{
                	pmsg.msg(data.msg);
                }
            },
            error:function(){

            }
           })

		});

		var ac = $('#ajaxContainer');
			var popmsg = $('.loading').pop();

			ajaxload('{:U("ajaxtrade")}',{game_id:ac.attr('game_id'),game_name:ac.attr('game_name')},function(data) {
				if(parseInt(data.status) == 1) {
					ac.attr('currentpage',data.current);
					var html = '',d = data.lists;
					for (var i in d) {
						var item = d[i];
						html += '<li class="z_game_detailli" onclick="window.location.href=&#39;'+item.url+'&#39;">';
            html += '<p class="z_date">'+item.online_time+'</p> ';
						html += '<div class="media">';
						html += '<div class="media-left">';
						html += '<a href="">';
						html += '<img class="media-object trade_img" src="'+(item.icon?item.icon:'__IMG__/pic_game@3x.png')+'" alt="...">';
						html += '</a>';
						html += '</div>';
						html += '<div class="media-body">';
						html += '<h4 class="media-heading">'+item.title+'</h4>';
						html += '<p class="z_clearfix z_detailp">';
						html += '<span class="game_btn">'+item.game_name+'</span>';
						html += '<span class="z_pays">¥'+item.price+'</span>';
						html += '</p>';
						html += '</div></div></li>';
					}

					ac.append(html);
					$('.loading').addClass('ms-none');
					$('#moreBtn').removeClass('ms-none');loads=false;
				} else {
					$('.loading').addClass('ms-none');
          popmsg.msg('已经到底了~');
				}
			});



	//---------------@author   zwm--------------------//
	//---------------date  2018-07-17-----------------//

	// 点击底部悬浮条关闭按钮关闭底部悬浮条
        $(".zclose_div").click(function(){
            $(".div_fixbottom").hide();
        });

		//交易页面上拉时成交状态及最新出售两行fixed在顶部
    var top1=$(".scroll1").offset().top;
		var top2=$(".scroll2").offset().top;

    $(window).scroll(function(){

      var  win_top=$(this).scrollTop();

      if(win_top>=top1){
        $(".scroll1").addClass("ul_fixed");
      }//如果此处用else判断来remove ul_fixed这个类的话是不行的,因为当加上这个类的时候,".scroll1"这个元素fixed的top值是0,
			//获取到的offset.top就相当于是当前滚动条的滚动的距离,
			//win_top与top值就一直相等了,这样会导致抖动;只有与以前的距离做比较才能实现滑上去的时候能回到原来的位置。
      if(win_top<top1){
        $(".scroll1").removeClass("ul_fixed");
      }


  		if(win_top>=top2){
        $(".scroll2").addClass("div_fixed");
				//$("#scroll2").appendTo($("<div class='div_fixed'></div>"));
      }
      if(win_top<top2){
        $(".scroll2").removeClass("div_fixed");
      }

    })

		$('.content').css({'min-height':($(window).height()-$(".header").height()-$(".shortcut").height()-$(".scroll2").height()-$(".foot-nav").height()-50)});
		$(".no_data").css({'height':($('.content').height())});
		//----------------------the end!-------------------------------//
	});
	</script>
</block>