{php $this->template('header')}
	<style>
	   .bui-page{ position: absolute; left: 0; right: 0; top:0; bottom: 0; z-index: 30; }
		header{ position: fixed; top:0; left: 0; right: 0;height: 3.6rem;z-index: 100;background: #fff }
		#ad-page{z-index: 100; display: none}
		#ad-page main{ position: absolute; top:3.6rem; left: 0 ; right: 0;bottom: 0;}

       .upimg{ height: 4rem; background: #fff; text-align: center; padding: 0.3rem; }
	  .upimg .selimg{ display: inline-block;height: 3.2rem; width: 2.8rem; }
	  .upbtn{ width: 2.8rem; height: 2.8rem;background-color: #f2f2f2;line-height: 2.8rem; text-align: center;position: relative;}
	  .upbtn .myicon{font-size: 1.2rem; color: #c2c2c2}
	  .upbtn .img{position: absolute; left: 0;  top:0;  width: 2.8rem; height: 2.8rem!important; overflow: hidden;background-color: rgba(0,0,0,0);background-repeat: no-repeat;background-position: center;background-size: cover;}
	 
	  .tips{font-size: 0.24rem; color: #c2c2c2; height: 0.6rem; line-height: 0.6rem;}
	
	  .form{ margin: 0.2rem; }
	 


		 .bui-nav>.active {
				    color: #39a4ff;
		}
		 .bui-nav>.bui-btn{ font-size: 0.3rem; }
		 header .bui-searchbar .bui-input{ height: auto; }
		 #ad-page header{ border-bottom: 1px solid #f2f2f2; }
		.bui-tab-head{ padding-right: 2rem;position: relative;border-bottom: 1px solid #f2f2f2 }
		.bui-tab-head .bui-nav{ border-bottom: none }
		.bui-tab-head .success{ width:1.4rem; height: 0.6rem; line-height: 0.6rem!important; position: absolute; right: 0.3rem; top:50%; margin-top: -0.3rem;padding: 0;border-radius: 0.1rem;}
		.type .ad_type{ display: none }
		.type .span1{ margin-bottom: 0.1rem; }
		.type input.bui-check:before {font-size: 0.24rem;}
		.span1 label{ padding-left: 10px;  }
		.span1 .tname{ padding-left: 10px; padding-top:6px;font-size: 0.24rem; color: #888  }
		.btnbox{padding: 0.4rem 0.8rem;}
		.btnbox .bui-btn{ border-radius: 0.1rem; }
		 #scrollList{height: auto;}
		 .xing{font-size: .25rem;color: #ea413c}
		 /*.success{background-color: #ea413c;border-color:#ea413c!important;}*/

	</style>
	<div class="bui-page" id="up">
		<main>
		
	       <div class="edit">
		        <div class="upimg">
		            <div class="selimg" data-id="img">
		                <div class="upbtn">
		                    <span class="myicon icon-add_photo"></span>

		                    <div class="img" {if $vo['img']} style="background-image:url({$vo['img']})"{/if} data-img="{$vo['img']}"></div>
		                </div>
		                <div class="tips">视频封面</div>
		            </div>
		        </div>
                 
		        <div class="form">
                    <h3 class="section-title">视频标题</h3>  
                    <ul class="bui-list">
			            <li class="bui-btn clearactive">
							<div id="name" class="bui-input">
								<textarea class="bui-input"  name="title" cols="30" rows="2" placeholder="请输入视频标题">{$vo['title']}</textarea>
						    </div>
							
						</li>
			           
			            <h3 class="section-title">分享描述</h3>  
			            <li class="bui-btn clearactive">
							<div id="desc" class="bui-input">
								<textarea class="bui-input" name="desc" cols="30" rows="3" placeholder="请输入分享描述">{$vo['desc']}</textarea>
							</div>
							
						</li>
						
						<h3 class="section-title">请选择分类 <span class="xing">*必选选项</span> </h3>  
			            <li class="bui-btn clearactive bui-box">
			        		<div id="select"  class="bui-select" style="width: 100%!important" value="{$vo['cid']}">{if $vo['cid']==0}请选择分类{else} {php echo db('video_cate')->where('id',$vo['cid'])->value('name')} {/if}</div>
						</li>
					

						<h3 class="section-title">浏览量</h3>  
			            <li class="bui-btn bui-box clearactive">
				            <div class="span1">
				                <div class="bui-input user-input">
				                    <input  type="number" value="{$vo['addeye']}" id="addeye" placeholder="请输入点赞量">
				                </div>
				            </div>
				        </li>

						<h3 class="section-title">点赞量</h3>  
			            <li class="bui-btn bui-box clearactive">
				            <div class="span1">
				                <div class="bui-input user-input">
				                    <input  type="number" value="{$vo['addzan']}" id="addzan" placeholder="请输入浏览量">
				                </div>
				            </div>
				        </li> 

						<li class="bui-btn bui-box clearactive">
			                <label class="bui-label">插入广告:</label>
			                <div class="span1">
			                    <div class="bui-input user-input" id="adname" onclick="page()">
			                        {php echo val($vo['adname'],'请选择广告')}
			                    </div>
			                    <input type="hidden" name="adid"  value="{$vo['adid']}">
			                </div>
			            </li>
			              <li class="bui-btn bui-box clearactive">
			                <label class="bui-label">排序:</label>
			                <div class="span1">
			                    <div class="bui-input user-input">
			                        <input name="sort" type="text" value="{$vo['sort']}" placeholder="数字越大排序越靠前哦!">
			                    </div>
			                </div>
			            </li>

					</ul>
                     
                    <div class="btnbox">
                        <div class="bui-btn success" id="save">保存</div>
                    </div>
		        </div>    
	       </div>

          
      </main>
  

	</div>


<div class="bui-page ad-page" id="ad-page">

	<header>
	    <!-- 总分类 -->
				                    <div class="bui-tab-head">
						                <ul class="bui-nav xlarge">
						                   {loop $cate $k $v}
						                    <li class="bui-btn {if $k==0}active{/if}" data-type="{$v['type']}">{$v['name']}</li>
						                   {/loop}
						                   
						                </ul>

						                <div class="bui-btn success" id="wancheng">完成</div>
						            </div>

	                                <!-- 搜索 -->
						            <div id="searchbar" class="bui-searchbar bui-box">
							            <div class="span1">
							    			<div class="bui-input">
							    				<i class="icon-search"></i>
							    				<input type="search" name="search" value="" placeholder="请输入关键字"><i class="icon-removefill" style="display: none;"></i>
							                </div>
							            </div>
							            <div class="btn-search">搜索</div>
									</div>

									<div class="type">
	                                     
	                                      {loop $cate $k $v}
	   
		                                     <div class="bui-fluid-space-4 ad_type" data-cate="{$v['type']}">
		                                       <div class="span1"><input type="radio" name="type" class="bui-check" uncheck="全部" check="全部" value="0"></div>
		                                       {loop $v['list'] $k2 $vo}
												 <div class="span1"><input type="radio" name="type" class="bui-check" uncheck="{$vo['name']}" check="{$vo['name']}" value="{$vo['id']}"></div>
											   {/loop}
												
											</div>
										{/loop}

									</div>
      
    </header>
  <main>
     <div id="scrollList" class="bui-scroll">
								<div class="bui-scroll-head"></div>
								<div class="bui-scroll-main">
									<ul class="bui-list" id="selad">

									</ul>
								</div>
								<div class="bui-scroll-foot"></div>
							</div>
  </main>


 
</div>
	<!-- industry -->
					<div class="mask"></div> 
				    <div id="layui-m-layer0" class="layui-m-layer layui-m-layer1" index="0" style="display: none">
				  		<div class="layui-m-layershade"></div>
				  		<div class="layui-m-layermain">
					  		<div class="layui-m-layersection">
					  			<div class="layui-m-layerchild  layui-m-anim-up" style="position:fixed; left:0; top:0; width:100%; height:100%; border: none; -webkit-animation-duration: .5s; animation-duration: .5s;background: #ffffff;z-index: 1000">
						  			<div class="layui-m-layercont" style="overflow: auto;height: 100%;">
										<div style="padding: 6px;font-size: 12px;color: #ff6600;background: #fff;position: relative;">点击下方即可选择分类 
											<div style="position: absolute;right: 6px;top: 6px;" onclick="col()">
												<i class="icon-close"></i>
											</div> 
										</div>


										<div class="bui-dialog-main" style="height: 100%">

											<div class="bui-list bui-list-select">
												{loop $videocard $k $v}			
												<div class="bui-btn bui-btn-line bui-box industry" data-id="{$v['id']}">
													<div class="span1">{$v['name']}</div>
													<input type="radio" name="test" class="bui-choose {if $v['id']==$vo['cid']} active{/if}" value="{$v['id']}">
												</div>
												{/loop}
 
											</div>

										</div>


									</div>
								</div>
							</div>
						</div>
					</div>
				<!-- END_industry -->


<script>

 var uiToggle,uiList,cate,type=0,keys='';
 
 function page(){

 	 $("#ad-page").show();
 	 
     uiToggle.show("fadeInUp");
 }

 function show_type(){

 	cate=$('.bui-btn.active').data('type');
 	var t=$('.ad_type[data-cate='+cate+']');
 	t.show().siblings().hide();

    t.children().eq(0).children('input').click();
     

 }


bui.ready(function(){

	window.col=function(){

			$('#layui-m-layer0').hide();

		}
		$(document).on('click','.industry',function(){
		
			var t=$(this);
			t.find('input').addClass('active').parents('.industry').siblings('div').find('input').removeClass('active');
			var text=t.find('div').text();
			var id=t.data('id');
			$('#select').attr('value',id).text(text);
			$('#layui-m-layer0').hide();

		})

		$(document).on('click','#select',function(r){

			$('#layui-m-layer0').show();

		})

    
    uiToggle = bui.toggle({id:"#ad-page",effect:"fadeInUp",inOrder:false});

    show_type();
    $('#ad-page main').height('auto');

     var comment = bui.input({
        id: "#name",
        showLength: true,
        showIcon: false,
        maxLength: 255
    })
     var comment = bui.input({
        id: "#desc",
        showLength: true,
        showIcon: false,
        maxLength: 500
    })
   $('.bui-nav .bui-btn').click(function(){
         
         var t=$(this);
         if(t.hasClass('active')){
         	return false;
         }

         t.addClass('active').siblings().removeClass('active');
         show_type();

   })

   // 上传二维码
   $('.upbtn .img').click(function(){

   	       var t=$(this);
   	       var uiLoading = bui.loading({
            appendTo:"body",
            width: 40,
            height: 40,
            
        });

   	       my.upimg((isapp?2:1),1,uiLoading,function(r){
             
                t.css('backgroundImage','url('+r[0]+')').data('img',r[0]);
                uiLoading.hide();

   	       })
           
            

   })

	







	uiList = bui.list({
        id: "#scrollList",
        url: "{php echo iurl('video/ads/edlst')}",
        pageSize: 10,

        data: {cate:cate,type:type,keys:keys},
        //如果分页的字段名不一样,通过field重新定义
        field: {
            page: "page",
            size: "pageSize",
            data: "data"
            
        },
        
        template: function(data) {
            var html = "";
            $('#scrollList').height($(document).height()-$('#ad-page header').height())
            data.map(function(el, index) {
         
                
                var type=el.type;
               

                var tname=$('.ad_type[data-cate='+cate+']').find('input[value='+type+']').attr('check');
                html += `<li class="bui-btn bui-box">
			                <input id="interest${el.id}" type="radio" class="bui-checkbox" name="aid" value="${el.id}">
			                <div class="span1">
			                    <label for="interest${el.id}">${el.name}</label>
			                    <span class="tname">${tname}</span>
			                </div>
			            </li>`;
            });

            return html;
        }
    });


    $('#wancheng').click(function(){
        var aid=$('#selad input:radio:checked').val();
        var name=$('#selad input:radio:checked').siblings('.span1').find('label').text();
        aid=(aid==undefined)?0:aid;
        console.log(aid+' '+name);

        if(aid!=0){

            $('#adname').text(name);
            $('input[name=adid]').val(aid);
        }

    	uiToggle.hide();
    })

    $('.bui-check').click(function(){

    	  var t=$(this);
          cate=t.parents('.ad_type').data('cate');
    	  type=t.val();

    	  if( uiList ){

                uiList.empty();
                uiList.init({
                    page: 1,
                    data:{cate:cate,type:type}
                   
                });
            }
    })





    var uiSearchbar = bui.searchbar({
        id:"#searchbar",
        onRemove: function(ui,keyword) {
            if( uiList ){
                
                //点击搜索清空数据
                uiList.empty();
                // 重新初始化数据
                uiList.init({
                    page: 1,
                    data: {
                        "keys":''
                    }
                });
                
            }
        },
        callback: function (ui,keyword) {
            
            if( uiList ){
                
                //点击搜索清空数据
                uiList.empty();
                // 重新初始化数据
                uiList.init({
                    page: 1,
                    data: {
                        "keys":keyword
                    }
                });
                
            }

        
        }

    });


    $('#save').click(function(){


         var arr={};
	      arr['title']=$('[name=title]').val();
	      arr['desc']=$('[name=desc]').val();
	      arr['adid']=$('[name="adid"]').val();
	      arr['sort']=$('[name="sort"]').val();
	      arr['img']=$('.upbtn .img').data('img');
	      arr['addeye']=$('#addeye').val()?$('#addeye').val():0;
	      arr['addzan']=$('#addzan').val()?$('#addzan').val():0;
	      arr['cid']=$('#select').attr('value')?$('#select').attr('value'):0;
	      // console.log(arr);return false;
	     	
	      if (arr['cid']==0) {

	      		msg('请选择分类',2);
	      		return false;
	      }


	      $.post('',arr,function(r){


	      		if (r.code) {

				          bui.hint({content:'<i class="icon-check"></i><br />保存成功', position:"center" , effect:"fadeInDown"});
				       
				          setTimeout(function(){ window.location.href="{php echo iurl('video/video/play')}&id="+r.data.id;},500);
				            

	      		}else{


	      				return msg(r.msg,2);


	      		}

	      })       


    })
})
</script>