scott
/
crm


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299
							
{extend name="public/layout"/} {block name="title"}在施工地{/block} {block name="body"}
	<link rel="stylesheet" href="__STATIC__/css/csspc.css">
	<link rel="stylesheet" href="__STATIC__/css/font.css">
<style>
	html,body{height: 100%;min-width: 830px;}
	.bodys{height: 100%;overflow-y:auto;background: #F6F7FB;padding: 25px;}
    .huise333{color:#333;}
    .layui-input{height: 46px;}
    .layui-form-label{width:30%;padding: 0;}
    .layui-form-label input{width:100%;}
    .layui-input-block{width:68%;min-height: 46px;}
    .mjtext{width:100px;height: 46px;float:left;}
    .searchIco{right:5%;font-size:24px;color:#28A1FF;top:8%; text-align: center;line-height: 38px;cursor: pointer;}
    .bottom_btn{bottom:0;left:0;width:100%;background: #fff;padding: 10px 25px;}
    .checkallbox{top:0;left:0;width:100%;}
	.checkallbox .layui-form-checkbox[lay-skin=primary]{max-width:20px;max-height: 20px;margin-top:-4px;}
	.checkallbox .layui-form-checkbox[lay-skin=primary] i{width:20px;height: 20px;line-height: 20px;}
    .seach-box{height: 67vh;overflow-y: auto;padding-bottom: 20px;position: relative;}
    .seach-box li{overflow: hidden;}
    .seach-box .layui-form-checkbox{float:left;margin-top:16px;padding-right:20px;width:20px;height: 20px;}
    .seach-box .layui-form-checkbox i{width:20px;height: 20px;font-size: 16px;border: 1px solid rgb(210, 210, 210);line-height: 19px;}
    .chekboximg{width:20px;height: 20px;}
    .noneimgs{position: absolute;top:0;left:0;bottom:0;right:0;margin:auto;}
</style>
<body>
	<div class="bodys wpsr">
		<form class="layui-form layui-form-box woverflow width100_">
			<div class="woverflow">
				<div class="layui-input-kos wpsr wleft width40_">
		              <input type="text" name="title" placeholder="请输入标题" autocomplete="off" class="layui-input ss-title">
		               <i class="fa fa-search searchIco wpsa ds" aria-hidden="true"></i>
		        </div>
		    	<div class="layui-form-item wright width55_" style="clear: none;">
		            <label class="layui-form-label lh46">面积搜索：</label>
		            <div class="layui-input-block">
		              <input type="text" name="square_start"  autocomplete="off" class="layui-input mjtext ss-mj-start">
		              <p class="wleft font18 lh46 huise333 mdlr10">至</p>
		              <input type="text" name="square_end" autocomplete="off" class="layui-input mjtext ss-mj-end">
		              <p class="wleft font18 lh46 huise333 mdl10">m²</p>
		            </div>
		        </div>
			</div>
       		
       		<div class="wpsr">
       			<div class="checkallbox mdb10">
			        <input lay-skin="primary" type="checkbox" id="checkall" name="type" lay-filter="allChoose" value="checkall"/><span class="huise333">全选</span><span class="huise999 ids mdl20 font16">共<span class="count_case"></span>个案例</span>
	       		</div>
			    <div class="seach-box">
			        <ul id="case_ul"></ul>
			    </div>
       		</div>
       		
       
	       <div class="bottom_btn wpsa woverflow">
	       		<p class="wleft lanse lh38 font14">已选择装修案例（<span class="count">0</span>个）</p>
	       		<div class="wright">
	       			<button type="button" lay-submit class="layui-btn layui-btn-normal pdlr30" lay-filter="material_case_submit" id="material_case_submit">保存</button>
		        	<button type="button" class="layui-btn layui-btn-primary cancel_btn layui-border-blue pdlr30">取消</button>
	       		</div>
	       </div>
       
       </form>
	</div>
</body>
{/block} {block name="js"}
<script>
	layui.config({
		base: '__LAYUI__/',
		urlbase: '/sys'
	}).extend({
		index: 'lib/index' //主入口模块
	}).use(['index', 'form'], function() {
		var $ = layui.$,
		form = layui.form,
		arrlst = [],
		checkboxlist=[],
		checkboxlist1 = [],
		checkboxlist2 = [],
		count = 0,
		housetype_id = "{$housetype_id}",
		data = {
			title:'',
			square_start:0,
			square_end:0
		},
		listcount=0;
		$('.searchIco').click(function(){
			var sstitle = $('.ss-title').val();
			var ssmjstart = $('.ss-mj-start').val();
			var ssmjend = $('.ss-mj-end').val();
			var filterArray = [];
			function ssmjlist(square_start,square_end){
				filterArray = $.grep(arrlst,(currentValue) => {
					if(square_start==''){
						return currentValue.square < square_end;
					}else if(square_end==''){
						return currentValue.square == square_start;
					}else if(square_start!==''&&square_end!==''){
						return currentValue.square > square_start  && currentValue.square < square_end;
					}
				});
			}
			ssmjlist(ssmjstart,ssmjend);
			var ssarrlist = arrlst.filter((item) => item.title.includes(sstitle));
			if(sstitle==''&&ssmjstart==''&&ssmjend==''){
				set_step_Html(ssarrlist,0);
			}else if(sstitle!==''&&ssmjstart==''&&ssmjend==''){
				set_step_Html(ssarrlist,1);
			}else if(sstitle==''&&ssmjstart!==''){
				set_step_Html(filterArray,1);
			}else if(sstitle==''&&ssmjend!==''){
				set_step_Html(filterArray,1);
			}else if(sstitle!==''&&ssmjstart!==''&&ssmjend!==''){
				var listarrbox=[];		
				for(var i=0;i<ssarrlist.length;i++){
					for(var j=0;j<filterArray.length;j++){
						console.log(ssarrlist[i].id==filterArray[j].id)
						if(ssarrlist[i].id==filterArray[j].id){
							listarrbox.push(filterArray[j])
						}
					}
				}
				set_step_Html(listarrbox,1);
			}
		})

		ajax_api(data);
		function ajax_api(data){
			$.ajax({
				url: '{:url("building/material_case",["housetype_id"=> $housetype_id])}',
				type: 'post',
				dataType: 'json',
				data:data,
				success: function (res) {
					console.log(res)
					if(res.code==0){
						listcount=res.count;
						$('.count_case').html(res.count);
						arrlst = res.data;
				        set_step_Html(arrlst,0);
						if(res.count==0){
				        	$('#case_ul').append('<img class="noneimgs" src="__STATIC__/img/nonedata.png"/>');
				        }
					}
				}
			});
		}

		function set_step_Html(set_List,isarrs) {
			$('#case_ul')[0].innerHTML = $.map(set_List, (v, i) => {
				return `<li class="lh50 woverflow">
			            	<input class="ds mdt17 wleft" data-index="${i}" data-material_case_id="${v.id}" lay-filter="textCheck" ${v.selected?'checked':''} type="checkbox" name="" value="${v.id}" data-isoff="${v.selected}"/>
			            	<img class="wleft mdt15 chekboximg" src="__STATIC__/img/anliico.png"/>
			            	<p class="wleft width68_ mdl10 font18 textlh1">${v.title}</p>
			            	<p class="font18 wright width20_ huise999">面积：${v.square}m²</p>
			            </li>`
			}).join('');
			var child = $(".seach-box input[type='checkbox']");
			if(isarrs==0){
				checkboxlist=[];	
			}else{
				checkboxlist1=[];
			}
			child.each(function (index, item) {
            	if($(this).data('isoff')){
            		$(this).prop('checked',true)
            		if(isarrs==0){
            			checkboxlist.push(item.value);	
            		}else{
            			checkboxlist1.push(item.value);
            		}
            		
            	}
            });
	        if(isarrs==0){
            	count=checkboxlist.length	
            }else{
            	count=checkboxlist.length+checkboxlist1.length
            }
		    $('.count').html(count);
			form.on('checkbox(allChoose)', function (data) {
	            checkboxlist=[];
	            child.each(function (index, item) {
	            	if(data.elem.checked){
	            		item.checked = data.elem.checked;
	            		if(isarrs==0){
	            			checkboxlist.push(item.value);
	            		}else{
	            			checkboxlist1.push(item.value);
	            		}
	            	}else{
	            		item.checked = false
	            	}
	            });
	            if(isarrs==0){
	            	count=checkboxlist.length	
	            }else{
	            	count=checkboxlist.length+checkboxlist1.length
	            }
	            $('.count').html(count);
	            form.render('checkbox');
	        });
	        
	        form.on('checkbox(textCheck)', function (data) {
	        	if(data.elem.checked){
	        		if(isarrs==0){
	        			checkboxlist.push(data.value);
	        		}else{
	        			checkboxlist1.push(data.value);
	        		}
	        	}else{
	        		$.each(checkboxlist, function(index,item) {
	        			if(item==data.value){
	        				checkboxlist.splice(index,1)
	        			}
	        		});
	        		$.each(checkboxlist1, function(index,item) {
	        			if(item==data.value){
	        				checkboxlist1.splice(index,1)
	        			}
	        		});
	        	}
	            count=checkboxlist.length;
	            $('.count').html(count);
	            var parent = $(data.othis).closest('#case_ul');
	            var inputlist = parent.find('li input');
	            var listinput=[];
	            for(var i=0;i<inputlist.length;i++){
					if(inputlist[i].checked){
						listinput.push(1);
					}
	            }
            	if(listinput.length==inputlist.length){
            		$('#checkall').prop('checked', true);
            	}else{
            		$('#checkall').prop('checked', false);
            	}
	            form.render('checkbox');
	        });        
			form.render('checkbox');
		} 
		
		form.on('submit(material_case_submit)', function(data) {
			$.ajax({
				url: '{:url("change_material_case")}',
				type: 'post',
				data: {
					housetype_id:housetype_id,
					material_case_id:arrmerge(checkboxlist,checkboxlist1).join(',')
				},
				dataType: 'json',
				success: function(res) {
					if(res.code === 0) {
						layer.msg(res.msg,{
							anim: 0,time: 1000,icon: 6,
						}, function() {
							var index = parent.layer.getFrameIndex(window.name);
							parent.layui.table.reload('grant'); //重载表格
							parent.layer.close(index); //再执行关闭
						});
					} else {
						layer.msg(res.msg, {anim: 0,time: 1000,icon: 5});
					}
				}
			});
			return false;
		});
		
		$('.cancel_btn').click(function(){
			var index = parent.layer.getFrameIndex(window.name);
			parent.layer.close(index);
		})
		
		function arrmerge(arr1,arr2){
			$.map(arr1,(v,index)=>{
				if(v !==''){
					let idx = arr2.indexOf(v);
					if(idx > -1){
						arr2.splice(idx,1)
					}
				}
			})
			checkboxlist = arr1.concat(arr2);
			return checkboxlist;
		}
		function arrmergew(arrs){
			let temp = [];
			for(let i=0;i<arrs.length;i++){
				if(temp.indexOf(arrs[i])===-1){
					temp.push(arrs[i])
				}
			}
			return temp;
		}
		
	})
</script>
{/block}