{extend name="Public/wx_base" /}
{block name="title"}我的客资{/block}
{block name="main"}
	<link rel="stylesheet" href="__PUBLIC__/mobile/css/reset.css?v={$Think.const.APP_VERSION}">
	<link rel="stylesheet" href="__PUBLIC__/mobile/mui/css/mui.min.css?v={$Think.const.APP_VERSION}">
	<link rel="stylesheet" href="__PUBLIC__/mobile/mui/css/mui.picker.min.css?v={$Think.const.APP_VERSION}">
	<link rel="stylesheet" href="__PUBLIC__/mobile/css/record.css?v={$Think.const.APP_VERSION}">
	<script src="__PUBLIC__/mobile/js/jquery-2.1.0.js?v={$Think.const.APP_VERSION}"></script>
	<script src="__PUBLIC__/mobile/mui/js/mui.picker.min.js?v={$Think.const.APP_VERSION}"></script>
<style>
	.mui-col-xs-9 {
		width: 100%;
	}
</style>
<div class="mui-content">
	<div class="record-search">
		<div class="search-block">
			<form method="post" id="form01" action="{:Url('crm/Customer/customerTiBao')}">
			<input type="text" placeholder="输入姓名/手机号进行搜索" name="search" id="search" value="{$search}">
			<i class="mui-icon mui-icon-search" id="search-btn"></i>
			</form>
		</div>
		<div class="rer-more">更多</div>
		<div class="more-contain">
			<div class="more-left">
				<form action="{:Url('crm/Customer/customerTiBao')}" method="post" id="form02">
				<button id="btn1" type="button" data-options='{"type":"date","beginYear":2014,"endYear":2020}' class="btn">开始时间</button>
					<input type="hidden" id="time1" name="time1" value="{$time1}">
				<span>至</span>
				<button id="btn2" type="button"  data-options='{"type":"date","beginYear":2014,"endYear":2020}' class="btn">结束时间</button>
					<input type="hidden" id="time2" name="time2" value="{$time2}">
				</form>
			</div>
			<div class="more-right">
				<span class="rer-span rer-blue"><a href="{:Url('crm/Customer/customerTiBao',['time'=>1])}">本月</a></span>
				<span class="rer-span"><a href="{:Url('crm/Customer/customerTiBao',['time'=>2])}">上月</a></span>
				<span class="rer-span"><a href="{:Url('crm/Customer/customerTiBao',['flag'=>1])}">我提报的</a></span>
				<span class="rer-span"><a href="{:Url('crm/Customer/customerTiBao',['flag'=>2])}">分配给我的</a></span>
				<span class="rer-span"><a href="{:Url('crm/Customer/customerTiBao',['flag'=>3])}">全部</a></span>
			</div>
            <input type="hidden" id="page" value="">
            <input type="hidden" id="count" value="{$count}">
            <input type="hidden" id="flag" value="{$flag|default=3}">
            <input type="hidden" id="time" value="{$time}">
		</div>
	</div>
    <div id="pullrefresh" class="mui-content mui-scroll-wrapper" style="top:61px;">
    <div class="mui-scroll">
	<ul class="mui-table-view mui-table-view-striped mui-table-view-condensed">
		{if condition="empty($tibao)"}暂无记录{/if}
		{volist name="tibao" id="tibao" key="key"}
		<li class="mui-table-view-cell">
            <a href="{:Url('crm/Customer/kzdetails',['id'=>$tibao.id])}">
        <div class="mui-table rer-tit">
				<div class="mui-table-cell mui-col-xs-8">
					<span class="mui-ellipsis">{$tibao.customer_name}</span>
				</div>
				<div class="mui-table-cell mui-col-xs-4 mui-text-right">
					<span class="mui-h5 rer-org">
						{if condition="$tibao.is_success eq 1"}
						已订单
						{elseif condition="$tibao.is_success eq 3"}
						已定金
						{elseif condition="$tibao.is_intostore eq 2"}
						已进店
						{elseif condition="$tibao.is_intostore eq 5 or $tibao.erp_loss eq 2"}
						进店流失
						{elseif condition="$tibao.is_intostore eq 4"}
						邀约流失
						{elseif condition="$tibao.is_loss eq 1"}
						不再追踪
						{elseif condition="$tibao.is_intostore eq 1 and $tibao.yjd"}
						邀约进店
						{elseif condition="$tibao.is_valid eq 1"}
						有效客资
						{elseif condition="$tibao.is_valid eq 3"}
						无效客资
						{else/}
                        待定客资
						{/if}
					</span>
				</div>
			</div>
			<div class="rer-second">
				<div class="rer-date">录入日期：{$tibao.creator_day}</div>
				<div class="rer-phone">手机号码：{$tibao.customer_tel}</div>
                <div class="rer-phone">客资标记：{$tibao.sign_name}</div>
			</div>
			<div class="mui-table">
				<div class="mui-table-cell mui-col-xs-9">
					<p class="mui-h6 mui-ellipsis">
						{if $tibao.yjd_day}{$tibao.yjd_day} 预约 {$tibao.syjd_day} 进店{/if}
					</p>
				</div>
			</div>
			<div class="mui-table">
				<div class="mui-table-cell mui-col-xs-9">
					<p class="mui-h6 mui-ellipsis">
						{if $tibao.creator_day}{$tibao.creator_day} 录入 {/if}
						{if condition="$tibao.order_day eq true"}{$tibao.order_day} 成交{/if}
					</p>
				</div>
			</div>
			{if $tibao.sales_staff_id eq $Think.session.staff_id}
			<div class="mui-table">
				<div class="mui-table-cell mui-col-xs-9">
					<p class="mui-h6 mui-ellipsis">
						{if $tibao.jr_day}{$tibao.jr_day} 接收分配 {/if}
					</p>
					<p class="mui-h6 mui-ellipsis">
						{if condition="$tibao.c_star_day eq true"}{$tibao.c_star_day} 开始追踪{/if}
					</p>
				</div>
			</div>
			{/if}
            </a>
        </li>
		{/volist}
	</ul>
    </div>
</div>
    </div>
<script>
    mui('body').on('tap','a',function(){
        window.top.location.href=this.href;
    });
	(function($) {
		$.init();
		var btns = $('#btn1');
		btns.each(function(i, btn) {
			btn.addEventListener('tap', function() {
				var optionsJson = this.getAttribute('data-options') || '{}';
				var options = JSON.parse(optionsJson);
				var id = this.getAttribute('id');
				/*
				 * 首次显示时实例化组件
				 * 示例为了简洁，将 options 放在了按钮的 dom 上
				 * 也可以直接通过代码声明 optinos 用于实例化 DtPicker
				 */
				var that=this;
				var picker = new $.DtPicker(options);
				picker.show(function(rs) {
					/*
					 * rs.value 拼合后的 value
					 * rs.text 拼合后的 text
					 * rs.y 年，可以通过 rs.y.vaue 和 rs.y.text 获取值和文本
					 * rs.m 月，用法同年
					 * rs.d 日，用法同年
					 * rs.h 时，用法同年
					 * rs.i 分（minutes 的第二个字母），用法同年
					 */
					that.innerText = rs.text;
					document.getElementById('time1').value = rs;
					/*
					 * 返回 false 可以阻止选择框的关闭
					 * return false;
					 */
					/*
					 * 释放组件资源，释放后将将不能再操作组件
					 * 通常情况下，不需要示放组件，new DtPicker(options) 后，可以一直使用。
					 * 当前示例，因为内容较多，如不进行资原释放，在某些设备上会较慢。
					 * 所以每次用完便立即调用 dispose 进行释放，下次用时再创建新实例。
					 */
					picker.dispose();
				});
			}, false);
		});
	})(mui);
	(function($) {
		$.init();
		var btns = $('#btn2');
		btns.each(function(i, btn) {
			btn.addEventListener('tap', function() {
				var optionsJson = this.getAttribute('data-options') || '{}';
				var options = JSON.parse(optionsJson);
				var id = this.getAttribute('id');
				/*
				 * 首次显示时实例化组件
				 * 示例为了简洁，将 options 放在了按钮的 dom 上
				 * 也可以直接通过代码声明 optinos 用于实例化 DtPicker
				 */
				var that=this;
				var picker = new $.DtPicker(options);
				picker.show(function(rs) {
					/*
					 * rs.value 拼合后的 value
					 * rs.text 拼合后的 text
					 * rs.y 年，可以通过 rs.y.vaue 和 rs.y.text 获取值和文本
					 * rs.m 月，用法同年
					 * rs.d 日，用法同年
					 * rs.h 时，用法同年
					 * rs.i 分（minutes 的第二个字母），用法同年
					 */
					that.innerText = rs.text;
					document.getElementById('time2').value = rs;
					document.getElementById('form02').submit();
					/*
					 * 返回 false 可以阻止选择框的关闭
					 * return false;
					 */
					/*
					 * 释放组件资源，释放后将将不能再操作组件
					 * 通常情况下，不需要示放组件，new DtPicker(options) 后，可以一直使用。
					 * 当前示例，因为内容较多，如不进行资原释放，在某些设备上会较慢。
					 * 所以每次用完便立即调用 dispose 进行释放，下次用时再创建新实例。
					 */
					picker.dispose();
				});
			}, false);
		});
	})(mui);
	$(function() {
		$(".rer-span").click(function() {
			$(this).addClass("rer-blue").siblings('.rer-span').removeClass("rer-blue");
		});

		$(".rer-more").click(function() {
			$(".more-contain").slideToggle(400);
			$(this).toggleClass("rer-up");
		});

//		搜索事件
		$("#search-btn").click(function(){
			$("#form01").submit();
		})
	})
</script>
<!--上拉加载-->
<script>
    mui.init({
        pullRefresh: {
            container: '#pullrefresh',
            up: {
                contentrefresh: '正在加载...',
                callback: pullupRefresh
            }
        }
    });
    var count = 0;
    /**
     * 上拉加载具体业务实现
     */
    function pullupRefresh() {
        var page = $('#page').val() ? $('#page').val() : 2;
        var search = $('#search').val();
        var total= $('#count').val();
        var flag= $('#flag').val();
        var time= $('#time').val();
        var time1= $('#time1').val();
        var time2= $('#time2').val();
        setTimeout(function() {
            mui('#pullrefresh').pullRefresh().endPullupToRefresh((++count > total)); //参数为true代表没有更多数据了。
            var table = document.body.querySelector('.mui-table-view');
            var cells = document.body.querySelectorAll('.mui-table-view-cell');

            $.ajax({
                type: "POST",
                url: "{:Url('crm/Customer/customerTBAJAX')}",
                data: {page: page,search:search,flag:flag,time:time,time1:time1,time2:time2},
                dataType: 'json',
                success: function (ret) {
                    if (ret !== false) {
                        for (var i = 0, len = ret.length; i < len; i++) {
                            var li = document.createElement('li');
                            li.className = 'mui-table-view-cell';
                            var inp = '<a href="/crm/Customer/kzdetails/id/'+ret[i]["id"]+'"><div class="mui-table rer-tit"><div class="mui-table-cell mui-col-xs-8"><span class="mui-ellipsis">'+ret[i]["customer_name"]+'</span></div>';
                            if(ret[i]['is_valid'] == 1){
                                var valid = '有效客资';
                            }else if(ret[i]['is_valid'] == 2){
                                var valid = '待定';
                            }else if(ret[i]['is_valid'] == 3){
                                var valid = '无效客资';
                            }else if(ret[i]['is_valid'] == 4){
                                var valid = '被驳回';
                            }
                            inp += '<div class="mui-table-cell mui-col-xs-4 mui-text-right"><span class="mui-h5 rer-org">'+valid+'</span></div></div>';
                            inp += '<div class="rer-second"><div class="rer-date">录入日期：'+ret[i]["creator_day"]+'</div><div class="rer-phone">手机号码：'+ret[i]["customer_tel"]+'</div><div class="rer-phone">客资标记：'+ret[i]["sign_name"]+'</div></div>';
                            if(ret[i]["yjd_day"]){
                                var time1 = ret[i]["yjd_day"]+' 预约';
                                inp += '<div class="mui-table"><div class="mui-table-cell mui-col-xs-9"><p class="mui-h6 mui-ellipsis">'+time1+'</p> </div></div>';
                            }else{
                                var time1 = '';
                            }
                            if(ret[i]["syjd_day"]){
                                var time2 = ret[i]["syjd_day"]+' 进店';
                                inp += '<div class="mui-table"><div class="mui-table-cell mui-col-xs-9"><p class="mui-h6 mui-ellipsis">'+time2+'</p> </div></div>';
                            }else{
                                var time2 = '';
                            }


                            if(ret[i]["creator_day"]){
                                var create = ret[i]["creator_day"]+' 录入';
                                inp += '<div class="mui-table"><div class="mui-table-cell mui-col-xs-9"><p class="mui-h6 mui-ellipsis">'+create+'</p></div></div>';
                            }else{
                                var create = '';
                            }
                            if(ret[i]["order_day"]){
                                var succ = ret[i]["order_day"]+' 成交';
                                inp += '<div class="mui-table"><div class="mui-table-cell mui-col-xs-9"><p class="mui-h6 mui-ellipsis">'+succ+'</p></div></div>';
                            }else{
                                var succ = '';
                            }
                            inp += '<div class="mui-table"><div class="mui-table-cell mui-col-xs-9"><p class="mui-h6 mui-ellipsis">'+create+'  '+succ+'</p></div></div>';
                            if(ret[i]["jr_day"]){
                                var jr = ret[i]["jr_day"]+' 接收分配';
                                inp += '<div class="mui-table"><div class="mui-table-cell mui-col-xs-9"><p class="mui-h6 mui-ellipsis">'+jr+'</p></div></div>';
                            }else{
                                var jr = '';
                            }
                            if(ret[i]["c_star_day"]){
                                var zz = ret[i]["c_star_day"]+' 开始追踪';
                                inp += '<div class="mui-table"><div class="mui-table-cell mui-col-xs-9"><p class="mui-h6 mui-ellipsis">'+zz+'</p></div></div>';
                            }else{
                                var zz = '';
                            }
                            li.innerHTML = '<li class="mui-table-view-cell">'+inp+'</a></li>';
                            table.appendChild(li);
                        }
                    } else {
                        mui.alert('没有更多数据了');
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    var ret = XMLHttpRequest.responseJSON
                    mui.alert('没有更多数据了');
                }
            })
        }, 1500);
        $('#page').val(parseInt(page)+1);
    }
</script>
{/block}