<?php defined('ROOT') or exit('Can\'t Access !'); ?>
<link href="<?php echo $template_shop_path;?>/visual/modules/common/screening/css/style.css" rel="stylesheet">


<div class="col-md-12">
     <div class="cation-content cation-content-1" id="sxid">
    <div class="cation-middle">
        <dl class="cation-list">
            <dt><?php echo lang('category');?>：</dt>
            <dd id="cateGory">
                <a href="#" rel="" name="mode" class="all"><?php echo lang('all_columns');?></a>
            </dd>
        </dl>
        <dl class="cation-list">
            <dt><?php echo lang('type');?>：</dt>
            <dd id="type">
                <a href="#" rel="" name="theme" class="all"><?php echo lang('all_type');?></a>
            </dd>
        </dl>
        <dl class="cation-list">
            <dt><?php echo lang('special');?>：</dt>
            <dd id="special">
                <a href="#" rel="" name="system" class="all"><?php echo lang('all_special');?></a>
            </dd>
        </dl>
        <dl class="cation-list">
            <dt><?php echo lang('price');?>：</dt>
            <dd id="getprice">
                <input  type="text" name="minprice" id="minprice" value="<?php if($minprice) { ?><?php echo $minprice;?><?php } else { ?>0<?php } ?>" placeholder="<?php echo lang('unit');?>" /> - <input  type="text" name="maxprice" placeholder="<?php echo lang('unit');?>" id="maxprice" value="<?php echo $maxprice;?>"/>
            </dd>
        </dl>
        <input type="button" onclick="getWhere()" value="<?php echo lang('sure');?>" class="btn cation-btn cation-btn-1">
    </div>
</div>
</div>

<style type="text/css">

    .cation-list-1 a {
        font-size:14px;
        color:#333333;
        border-color:$_link-border-color;
        border-radius: $_link-border-radius;
        background:$_link-background-color;
    }

    .cation-list-1 a.active,.cation-list-1 a:hover {
        color:#000000;
        border-color:$_link-border-hover-color;
        border-radius: $_link-border-hover-radius;
        background:$_link-background-hover-color;
    }

    .cation-list-1 dt {
        font-size:14px;
        color:#000000;
    }
    .cation-list-1 dt:hover {
        font-size:14px;
        color:#000000;
    }

    .cation-content-1 .cation-list{
        border-bottom-color: #cccccc;
    }

    .cation-content-1 {
        border-color:#eeeeee;
        background:rgba(255, 255, 255, 0);
    }
    .cation-content-1:hover {
        background:rgba(255, 255, 255, 0);
        border-color:#eeeeee;
    }
    .cation-btn-1 {
        font-size:14px;
        color:#ffffff;
        border-color:#ff680d;
        border-radius: 3px;
        background:#ff680d;
    }
    .cation-btn-1:hover {
        color:#ffffff;
        border-color:#ff680d;
        border-radius: 3px;
        background:#ff680d;
    }
</style>

<script type="text/javascript">

    var whereDate={"cateGory":"<?php echo $cateGorycolor;?>","type":"<?php echo $typecolor;?>","special":"<?php echo $specialcolor;?>"};

    $(function(){

        $.get('<?php echo url("archive/getScreening/langurl/".lang::getistemplate());?>', function(data){
            var dataObj = JSON.parse(data);
            var cateGoryData=dataObj['cateGoryData'];
            var cateGory=document.getElementById('cateGory');
            setHtml(cateGoryData,cateGory,'cateGory');
            var typeData=dataObj['typeData'];
            var type=document.getElementById('type');
            setHtml(typeData,type,'type');
            var specialData=dataObj['specialData'];
            var special=document.getElementById('special');
            setHtml(specialData,special,'special');
            if(cateGoryData.length==0 && typeData.length==0 && specialData.length==0){
                $("#sxid").remove();
            }
        });
        function setHtml(data,elementStr,name) {
            if(data.length>0){
                var str='';
                var strcolor=false;
                for(var i=0;i<data.length;i++){
                    var reg=/[`~！!@#$%^&*_+<>{}\/'[\]]/g;
                    data[i].name=data[i].name.replace(reg,'-');
                    if((name=='cateGory' && '<?php echo $cateGorycolor;?>'==data[i].id ) || (name=='type' && '<?php echo $typecolor;?>'==data[i].id)
                        || (name=='special' && '<?php echo $specialcolor;?>'==data[i].id)){
                        str =str+ '  <a href="javascript:void(0)" class="active" onclick="setWhere(\''+name+'\','+data[i].id+',this)" rel="'+data[i].name+'"  name="'+name+'" >'+data[i].name;+'</a>  '
                        whereDate['name']=data[i].id;
                        strcolor=true;
                    }else{
                        str =str+ '  <a href="javascript:void(0)" onclick="setWhere(\''+name+'\','+data[i].id+',this)" rel="'+data[i].name+'"  name="'+name+'">'+data[i].name;+'</a>  '
                    }

                }
                var strhead='';
                var classtype="";
                if(!strcolor){
                    classtype="class=\"active\"";
                    whereDate['name']='';
                }
                if(name=='cateGory' ){
                    strhead='<a href="javascript:void(0)" '+classtype+'  rel="" onclick="setWhere(\''+name+'\',\'\',this)" name="'+name+'" ><?php echo lang('all_columns');?></a>';
                }else if (name=='type' ) {
                    strhead='<a href="javascript:void(0)" '+classtype+' rel="" onclick="setWhere(\''+name+'\',\'\',this)" name="'+name+'" ><?php echo lang('all_type');?></a>';
                }else if (name=='special' ) {
                    strhead='<a href="javascript:void(0)" '+classtype+'  rel="" onclick="setWhere(\''+name+'\',\'\',this)" name="'+name+'" ><?php echo lang('all_special');?></a>';
                }

                str=strhead+str;
                elementStr.innerHTML=str;
            }else{

                $(elementStr).parent().remove();
                whereDate['name']='';
            }
        }
    });

    function setWhere(name,key,setcolor){
        whereDate[name]=key;

        $("[name="+name+"]").removeClass("active");
        $(setcolor).addClass("active");

    }

    function getWhere(){

        var newpath="<?php echo url('archive/listscreening/langurl/'.lang::getistemplate());?>";
        for ( var key in whereDate) {
            newpath =newpath+'&'+key+'='+whereDate[key];
        }
        if($('#minprice').val() != '' ){
            newpath=newpath+'&minprice='+$('#minprice').val();
        }
        if($('#maxprice').val() != ''){
            newpath=newpath+'&maxprice='+$('#maxprice').val();
        }
        window.location.href = newpath;
    }

</script>

