(function(){
    X.pageLogic['screen'] = {
        init : function(){
            var width = window.innerWidth - 270;
            $(".screen-box").css("width",width+"px");

            // 显示隐藏添加条件按钮
            $(".screen-right-box .img").click(function(){
                if($(".screen-buttom-box").css('display') == 'block'){
                    $(".screen-buttom-box").hide();
                    $(".screen-left-qei").css('bottom','0px');
                    $(".screen-right-box .img").css('transform','rotate(180deg)');
                }else {
                    $(".screen-buttom-box").show();
                    $(".screen-left-qei").css('bottom','24px');
                    $(".screen-right-box .img").css('transform','rotate(360deg)');
                }
            });

            //清空按钮
            $(".screen-right-box .qingkong").click(function(){
                layer.closeAll();
            });

            $(".screen-left-box .screen-left-qei").click(function(){
                if($(this).html() == "且"){
                    $(this).html("或");
                }else {
                    $(this).html("且");
                }
            })

            var dataid = 1;//给添加的数据一个id，方便后面好对应数据
            //默认开始时有一个数据
            var data = [];

            // {
            //     'dataid': 0,
            //     'conditionone': '来源渠道' ,
            //     'conditiononeid': '1' , 
            //     'conditiontwo':'等于' , 
            //     'conditiontwotime': true , 
            //     'conditiontwotimestart':'0000000000', 
            //     'conditionthree':'' }
            //初始一个数据
            // X.laytpldata ("#screen-con-box-dot" ,data,".screen-con-box");
            // X.laydropdown(rightboxid,arr,function(d){
            //     console.log(d);
            // });
            updatascreencon();
            function updatascreencon(){
                var index = dataid;
                var Divcon =  `<div class="screen-con-bg" id="screen-con-bg`+index+`">
                    <div class="left-type" id="left-type`+index+`" data-id="left-type`+index+`">
                        <img src="./static/img/zhanghu.png">
                        <span>来源渠道</span>
                    </div>

                    <div class="content-type">
                        <select class="screen-content-sel" data-id="screen-content-sel`+index+`" id="screen-content-sel`+index+`" name="interest" lay-filter="aihao">
                            <option>等于</option>
                            <option>不等于</option>
                        </select>

                        <div class="screen-content-time-box" id="screen-content-time-box`+index+`">
                            <img src="./static/img/rqi.png">
                            <input class="timechoice" id="time-box-timechoice`+index+`" data-id="time-box-timechoice`+index+`" value="2021-03-11 ~ 2021-04-09" readonly="readonly">
                        </div>
                    </div>
                    <div class="right-box" id="right-box`+index+`">
                        <input type="type" class="screen-right-txt" data-id="`+index+`" placeholder="输入条件">
                    </div>
                    <div class="screen-del" data-id="screen-del`+index+`"></div>
                </div>`
                $(".screen-con-box").append(Divcon);
                var rightboxid = "#right-box"+index+" .screen-right-txt";
                X.laydropdown(rightboxid,X.DATA.search.condition,function(d){
                    $(rightboxid).val(d.title);
                });
                // 添加数据
                var arr = {
                    'dataid':dataid++,
                    'conditionone': '来源渠道' ,
                    'conditiononeid': '1' , 
                    'conditiontwo':'等于' , 
                    'conditiontwotime': true , 
                    'conditiontwotimestart':'0000000000', 
                    'conditionthree':'' 
                    };
                data.push(arr);
                X.daterender("#time-box-timechoice"+index);
                if(data.length > 1){
                    $(".screen-left-qei").show();
                }
            }
            
            //条件添加按钮
            $(".screen-buttom-box .screen-buttom").click(function(){
                updatascreencon();
            });

            X.daterender("#time-box-timechoice1");

            $(document).on("click",".screen-con-bg .left-type",function(){
                var obj = $(this); 
                var offset = obj.offset();
                //点击按钮，数据，向左偏移，向右偏移
                X.querycriteriapop(X.DATA.search,'category',offset.left,offset.top+obj.height(),function(val){
                    var id = obj.attr("data-id");
                    $("#"+id+" "+"span").html(val.title); //修改筛选项一
                    var idarr = id.split('type');
                    var index = idarr[1]; //获取到点击的第几个
                    data[index]['conditionone'] = val.title; //修改数组里面title的值
                    data[index]['conditiononeid'] = val.id;
                    if(val.type == "time"){
                        $("#screen-content-time-box"+index).show();//显示时间选择
                        $("#screen-content-sel"+index).hide();//隐藏下拉框
                        $("#right-box"+index).hide();//隐藏文本框
                        data[index]['conditiontwotimestart'] = $("#time-box-timechoice"+index).val();
                    }else {
                        $("#screen-content-time-box"+index).hide();//隐藏时间选择
                        $("#screen-content-sel"+index).show();//显示下拉框
                        var txtval = $("#screen-content-sel"+index).val();
                        if(txtval == 4 || txtval == 5 ){
                            $("#right-box"+index).hide();//隐藏文本框
                        }else {
                            $("#right-box"+index).show();//隐藏文本框
                        }
                    }
                //    console.log(data);
                });
            });

            //下拉选项触发事件
            $(".screen-content-sel").change(function(){
                var val = $(this).val();
                var dataid = $(this).attr("data-id");
                var arr = dataid.split('sel');
                var index = arr[1];
                data[index]['conditiontwo'] = val;
                // console.log(data);
            });

            //时间选择框数字发生改变
            $('.screen-content-time-box .timechoice').bind('input propertychange', function() {
                var txt =  $(this).val()
                var dataid = $(this).attr("data-id");
                var arr = dataid.split('timechoice');
                var index = arr[1];
                data[index]['conditiontwotimestart'] = txt;
                // console.log(data);
            })

            //文本框条件输入触发事件
            $('.screen-right-txt').bind('input propertychange', function() {
                var txt =  $(this).val();
                var index = $(this).attr("data-id");
                data[index]['conditionthree'] = txt;
                console.log(data);
            })

            //删除按钮
            $(document).on("click",".screen-con-bg .screen-del",function(){
                if(data.length > 1){
                    var dataid = $(this).attr('data-id');
                    var arr = dataid.split('del');
                    var index = arr[1];
                    for(let i in data){
                        if(index == data[i]['dataid']){
                            data.splice(i, 1);
                            $("#screen-con-bg"+index).remove();
                        }
                    }
                    if(data.length == 1){
                        $(".screen-left-box .screen-left-qei").hide();
                    }
                }else {
                    layer.closeAll();
                }
                
            })

            // 计算按钮
            $(".screen-right-box .jisuan").click(function(){
                console.log(data);
                // 刷新看板里的数据暂时没有
                
                
            }) 

        }
    };
})();