<!DOCTYPE HTML>
<html>
    <head>
        <{include file="block/sheader.html"}>
    </head>
    <body>
        <header>
            <i class="left"><a href="<{link ctl='index'}>" class="ico headerIco headerIco_3"></a></i>
            <div class="title">
                选择师傅
            </div>
            <i class="right"></i>
        </header>
        <section class="page_center_box">
            <div class="masterLsit" id="wrapper" style="height:600px; position: relative;">
                <ul class="pub_list_box">
                    
                </ul>
            </div>
        </section>
        <script id="data_list" type="text/x-jquery-tmpl">
            <li class="pub_list border_t border_b pad10 mb10 bgcolor_white">
                <div class="pub_img fl">
                    <div><a href="<{link ctl='staff/order_detail' args='${staff_id}'}>"><img src="<{$pager.img}>/${face}" width="100" height="100"></a></div>
                    <a href="javascript:void(0);" rel="${staff_id}" data="${name}" role="${mobile}" class="pub_btn mt10">选Ta</a>
                </div>
                <div class="pub_wz">
                    <p class="name"><a href="<{link ctl='staff/order_detail' args='${staff_id}'}>">${name}</a> {{if d>0}}<span class="fr range black9"><em class="ico"></em>${d}</span>{{/if}}</p>
                    <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
                        <tr>
                            <td><p class="black9"><span class="fontcl1">${rate}%</span>好评</p></td>
                            <td><p class="black9">${year_num}年经验</p></td>
                            <td align="right"><p class="black9">服务${orders}次</p></td>
                        </tr>
                    </table>
                    <div class="repairLabel_box mt10">
                        <div class="fr"><a href="javascript:void(0);" class="more black9">更多</a></div>
                        <div class="repairLabel_nr">
                            <div class="repairLabel_one" id = "div_each">
                            {{each(i,cate) skill}}
                                {{if i<=5}}<a href="javascript:void(0);" class="repairLabel">${cate}</a>{{/if}}
                            {{/each}}
                            <span class="repairLabel_two">
                                {{each(k,val) skill}}
                                    {{if k>5}}
                                       <a href="javascript:void(0);" class="repairLabel">${val}</a>
                                    {{/if}}  
                                {{/each}}
                            </span> 
                            </div>
                        </div>
                </div>
                <div class="clear"></div>
            </li>
        </script>
        <script>
            var page = 1;
            var wapper = document.querySelector("#wrapper ul");
            var order = "<{$order}>";
            var url = "<{link ctl='staff/order_items'}>";
            build_refresher_items(url, {page: 1,order:order}, "#data_list", wapper);
            refresher.init({
                id: "wrapper",
                pullDownAction: function () {
                    post_json = {page: 1,order:order};
                    $("#wrapper ul").html("");
                    $("#pullUp").hide();
                    build_refresher_items(url, post_json, '#data_list', wapper);
                    page = 1;
                    myScroll.refresh();
                },
                pullUpAction: function () {
                    page++;
                    post_json = {page: page,order:order};
                    build_refresher_items(url, post_json, '#data_list', wapper);
                    myScroll.refresh();
                },
            });

        </script>   

        <script>
            $(document).ready(function () {
                /*师傅列表显示更多标签*/
                $(document).on('click', '.more', function () {    
                    if ($(this).hasClass("on")) {
                        $(this).removeClass("on");
                        $(this).parents(".repairLabel_box").find(".repairLabel_two").hide();
                    }
                    else {
                        $(this).addClass("on");
                        $(this).parents(".repairLabel_box").find(".repairLabel_two").show();
                    }
                });
                var order = "<{$order}>"; 
                if(order){
                    $(document).on('click','.pub_btn',function(){
                        var order_staff_id = $(this).attr('rel');
                        var order_staff_name = $(this).attr('data');
                        var order_staff_mobile = $(this).attr('role');
                        localStorage.setItem('order_staff_id',order_staff_id);
                        localStorage.setItem('order_staff_name',order_staff_name);
                        localStorage.setItem('order_staff_mobile',order_staff_mobile);
                        var link = "<{link ctl='order/order' args=oooo}>"; 
                        setTimeout(function () {
                            window.location.href = link.replace('oooo', order);
                        }, 1000);
                    })
                }
            });
        </script>
        <!-- Swiper JS -->
        <!-- Initialize Swiper -->
    </body>
</html>
