{php $this->template('header')}

  <link rel="stylesheet" href="{$public}css/fans/index/index.css?{php echo time()}">

{php echo share(快来看看我的粉丝,user($uid,'headimgurl'),快来看看我的粉丝)}
<div class="bui-page">

    <main id="main">
			
			
		
			<div class="bui-box">

             <div class="span1">
                <!-- 单个下拉结构 -->
                <div id="sex" class="bui-dropdown">
                    <div class="bui-btn bui-box">
                        <div class="span1">性别</div>
                        <i class="icon-dropdown"></i>
                    </div>
                </div>
            </div>
            <div class="span1">
                <!-- 动态渲染 -->
                <div  class="bui-dropdown">
                    <div class="bui-btn" id="chooseCity">
                       <!--  <div class="span1">城市</div> -->
                        <div class="bui-box">
			                <div class="selected-val" id="province"></div>
			                <div class="selected-val" id="city"> </div>
			                <!-- <div class="selected-val" id="district"> </div> -->
			            </div>
			            <div class="right_box">
                        	<i class="icon-dropdown"></i>
                        </div>
			           
                    </div>
                </div>
            </div>
           
            <div class="span1">
                <!-- 单个下拉结构 -->
                <div id="quyu" class="bui-dropdown">
                    <div class="bui-btn bui-box">
                        <div class="span1">行业</div>
                        <i class="icon-dropdown"></i>
                    </div>
                    <ul class="bui-list">
                        <li class="bui-btn" value="0">全部</li>
                        {loop $industry $k $v}
                        <li class="bui-btn" value="{$v['id']}">{$v['name']}</li>
                        {/loop}
                    </ul>
                </div>
            </div>
        </div>
       		<div id="scrollList" class="bui-scroll">
       			
		        <div class="bui-scroll-head"></div>
		        <div class="bui-scroll-main">
					<div class="tab-home">
						<ul class="bui-list bui-list-thumbnail">
			               
			            	 <!-- <li class="bui-btn bui-box">
			                <div class="yuan" style="background-image: url(https://thirdwx.qlogo.cn/mmopen/EWo3hwIVSD21agHwwy30hPibblSeYJtjCHfgnic1E9XvIvibUE68Ww7VjbXL5ejiakiaxYkNr514XoLpQFQdWqdT5KW50HpO2xQA3/132)"></div>
			                <div class="span1">
								<div class="nickname">
									1111
								</div>
								<div class="address"> 22222 </div>
			                </div>
			                <div class="right">
								
								<span class="bui-btn mini guanzhu"> <i class="icon-plus"></i> 关注 </span>
			                </div>
			            </li> -->
                          	
                        </ul>
			        </div>
			        <div class="bui-scroll-foot"></div>
			    </div>

			</div>
         	
    </main>
   
</div>

	<div id="infos" class="dsnone">	
				<div id="box">
				       <div id="user">
				            
				            <div class="face">
				              <img src="" id="face">
				            
				            </div>
				            <div class="name" id="name"></div>
				            <div class="tips">
				              您可以通过以下方式联系TA哦~
				             </div>

				             <div class="lianxi aui-row">
				                 
				                 <div class="aui-col-xs-6 item">
									<img src="{$public}/img/wx.png" style="width: 40px" >
				                    <div class="hao" id="weixin"></div>
				                    <div id="tihuan">
				                    <div class="layui-btn layui-btn-xs ewm"  tapmode onclick="chakan()" data-ewm="">查看二维码</div>
				                    </div>
				                 </div>
				                 <div class="aui-col-xs-6 item">
				                 	<img src="{$public}/img/phone.png" style="width: 40px" >
				                     <div class="hao" id="phone"></div>
				                     <a class="layui-btn layui-btn-xs" tapmode id="tell" >拨打电话</a>
				                 </div>
				             </div>

				             <div class="tips" style="margin-top:10px;">*温馨提示:请谨慎甄别。</div>

				        </div>

				          <div class="close" tapmode onClick="gb()">
				        
				          </div>

				   </div>


			</div>
			<div class="dsnone" id="mengban2"></div>


              <div class="boxes dsnone">
             	<div class="img_box text-c">
	                <div class="img">
	                  <img src="" id="wxcode" />
	                </div>
	                <span>长按上面二维码识别</span>
                </div>
                 <div class="close " tapmode onClick="gb()"> </div>
              </div>
<script>


    bui.ready(function(){

    	var vip="{php echo $this->vip}";

    	if (vip!=1) {

    		$('#vip_box').show();
    		// return false;
    	}



    	var data={};

    	var uiDoropdown3 = bui.dropdown({
	        id: "#quyu",
	        relative: true,
	        callback: function(e) {
	            data.industry=this.value()

	           if( uiList ){
	                uiList.empty();
	                uiList.init({
	                    page: 1,
	                    data: data
	                });
	            }
	        }
	    })
	    var uiDoropdown1 = bui.dropdown({
	        id: "#sex",
	        data: [{
	            name: "不限",
	            value: "0"
	        },{
	            name: "男",
	            value: "1"
	        }, {
	            name: "女",
	            value: "2"
	        }],
	        relative: true,
	        callback: function(e) {
	        	quyu(); 
	            data.sex=this.value();
	            if( uiList ){
	                uiList.empty();
	                uiList.init({
	                    page: 1,
	                    data: data
	                });
	            }
	        }
	    });
	    var citySelect = null;
		loader.import("{$public}js/city.js?time={php echo time()}", function() {

		    citySelect = bui.levelselect({
		        data: citys,
		        title: "选择您的地区",
		        log: true,
		        placeholder:'城市',
		        trigger: ".selected-val",
		        level: 3,
		        field: {
		            name: "n",
		            data: ["c", "a"],
		        },
		        

		    })

		})

		$("#chooseCity").on("click", function() {
		    citySelect.show();
		    citySelect.on("lastchange",function () {
	           	quyu();
	           	if( uiList ){
	                uiList.empty();
	                uiList.init({
	                    page: 1,
	                    data: data
	                });
	            }
	            citySelect.off("lastchange");
	       	});

		})

		
		function quyu(){
			if ($('#province').text()=='城市') {

				return false;
			}
			data.province=$('#province').text();
			data.city=$('#city').text();
			return data;

		}
   
    	var uiList = bui.list({
		        id: "#scrollList",
		        url: "{php echo iurl('fans/index/index')}",
		        pageSize: 10, 
		        data: {},
		        field: {
		            page: "page",
		            size: "pageSize",
		            data: "data"
		        },
              template: function(data) {
            	var html = "";
            	data.forEach(function(el, index) {
                 	
                 	html += `<li class="bui-btn bui-box" >
			                <div class="yuan" style="background-image: url(${el.user.headimgurl})"></div>
			                <div class="span1">
								<div class="nickname">
									${el.user.nickname}
								</div>
								<div class="address"> <i class="iconfont icon-dizhi "></i> ${el.user.province} ${el.user.city} </div>
			                </div>
			                <div class="right">
								
								<span class="bui-btn mini guanzhu lianxi" onclick="lianxi('${el.user.headimgurl}','${el.user.weixin}','${el.user.wxcode}','${el.user.phone}','${el.user.nickname}')"> 联 系 他 </span>
			                </div>
			            </li>`
                    
                  	});
            		if (html==''&&page==1) {

            			html=	`<div class="img" id="kongkong">
									<img src="{$public}img/empty.png">
									<p>空空如也...</p>
								</div>`;
            			
            		}
            		 
                  	return html;
              	}
          	});

    		window.lianxi=function(img,weixin,wxcode,phone,name){
    			if (wxcode=='') {

    				wxcode="{$public}img/zanwu.png";

    			}
    			var str=`<div class="layui-btn layui-btn-xs ewm"  tapmode onclick="chakan('`+wxcode+`')">查看二维码</div>`;
        		$('#infos').removeClass('dsnone');
				$('#mengban2').removeClass('dsnone')
				$('#name').text(name);
				$('#phone').text(phone);
				$('#weixin').text(weixin);
				$('#face').attr('src',img);
				$('#tell').attr('href','tel:'+phone);
 				$('#tihuan').html(str)
    		}

    		window.gb=function(){

    			$('#infos').addClass('dsnone');
				$('#mengban2').addClass('dsnone');
				$('.boxes').addClass('dsnone')

    		}

    		window.chakan=function(wxcode){
    			$('#infos').addClass('dsnone');
    			$('#mengban2').removeClass('dsnone')
    			$('#wxcode').attr('src',wxcode);
    			$('.boxes').removeClass('dsnone')
    		}

    })


 
</script>

{php $this->template('footer')}