/**产 品筛选简码开始*/
add_shortcode('productFilter','productFilter_f');
function productFilter_f()
{
?>
<script src="/wp-content/plugins/elementor-list-widget/assets/owlcarousel/jquery.min.js"></script>
<script src="/wp-content/plugins/elementor-list-widget/assets/js/ion.rangeSlider.min.js"></script>
<script src="/wp-content/plugins/elementor-list-widget/assets/js/avalon.js"></script>
<script type="text/javascript">var ajax_url = '<?php echo admin_url(); ?>admin-ajax.php';</script>
<div class="page-products" ms-controller="product_list">
<div class="inner">
<div class="subnav fnt18 wow fadeInUp50" style="visibility: visible; animation-name: fadeInUp50;">
<div class="w1440">
<ul>
<?php
$categories = get_terms( ['taxonomy' => 'product_cat', 'hide_empty' => false] );
foreach ($categories as $value) {
$isshows = get_term_meta($value->term_id,'isshows');
$value->isshow = $isshows[0][0] == 'isshows' ? 1 : 2;
?>
<li ms-click="changeCategory(<?php echo $value->term_id;?>)" data-id="<?php echo $value->term_id;?>" data-shows="<?php echo $value->isshow;?>" data-name="<?php echo $value->name;?>"><a href="javascript:;"><?php echo $value->name;?></a></li>
<?php
}
?>
</ul>
</div>
</div>
<div class="sub-range wow fadeInUp50" style="visibility: visible; animation-name: fadeInUp50;" ms-if="isshows==1">
<div class="w1440 in">
<div class="name fnt16">Viewing Distance</div>
<div class="select-range ">
<input type="text" class="js-range-slider irs-hidden-input" name="my_range" value="" data-type="double" data-min="0" data-max="16" data-from="2.5" data-to="8" data-grid="true" tabindex="-1" readonly="">
</div>
</div>
</div>
<div class="content wow fadeInUp50" style="visibility: visible; animation-name: fadeInUp50;">
<div class="w1440">
<ul>
<li class="wow fadeInUp50" style="visibility: visible; animation-name: fadeInUp50;" ms-repeat-el="lists">
<div class="box">
<a ms-attr-href="{{el.links}}" target="_blank">
<div class="img"><img ms-attr-src="{{el.thumbnail}}" class="lazy" alt="">
<span class="new"></span>
</div>
<div class="txt">
<h3 class="fnt24">{{el.post_title}}</h3>
<h5>{{el.post_excerpt}}</h5>
<p class="fnt16">Available Pixel Pitches: {{el.cs}}</p>
</div>
</a>
</div>
</li>
</ul>
<div class="btn-more wow fadeInUp50" style="visibility: visible; animation-name: fadeInUp50;">
<a href="javascript:;" ms-click="getMore">Veiw more</a>
</div>
</div>
</div>
</div>
</div>
<script>
var vm = avalon.define({
$id:"product_list",
cid:<?php echo $categories[0]->term_id;?>,
fm:'2.5',
sm:'8',
lists:[],
rangeVal:'',
offset:0,
isshows:<?php echo $categories[0]->isshow;?>,
catename:'<?php echo single_cat_title();?>',
rangechange:function(a){
$(".js-range-slider").ionRangeSlider({
postfix: "m",
step: 0.5,
});
$('.js-range-slider').on('change', function() {
vm.offset = 0;
vm.lists = [];
var datas = $(this).val();
vm.fm = datas.split(";")[0];
vm.sm = datas.split(";")[1];
vm.getProductList();
});
},
changeCategory:function(obj){
vm.offset = 0;
vm.lists = [];
vm.cid = obj;
vm.getProductList();
vm.isshows = $(this).data("shows");
$(this).attr("disabled",true).siblings().attr("disabled",false);
$(this).css("pointer-events","none").siblings().css("pointer-events",'all');
},
getProductList:function(){
$.ajax({
url:ajax_url,
type:'post',
data:'action=vote_prodct_lists&cid=' + vm.cid + '&fm=' + vm.fm + '&sm=' + vm.sm + '&offset=' + vm.offset + '&ishow=' + vm.isshows,
success:function(result){
var lenRe =result;
if(lenRe.length == 0){
return
}
vm.lists = vm.lists.concat(result);
}
})
},
getMore:function(){
vm.offset+=6;
vm.getProductList();
},
pageCurid:function(){
if(vm.catename && vm.catename.length>0){
$.each($(".subnav ul li"),function(){
console.log($(this).data("name"));
if($(this).data("name") == vm.catename){
vm.cid = $(this).data("id");
$(this).addClass('active').siblings().removeClass('active');
}
})
}else{
$(".page-products ul li").eq(0).addClass('active');
vm.cid = <?php echo $categories[0]->term_id;?>;
}
vm.getProductList();
}
})
vm.rangechange();
vm.pageCurid();
</script>
<?php
}
/**产品筛选简码结束*/
