{php}
$productCategoryList = siteNavigations(3, 2);
{/php}
{if !empty($productCategoryList)}
<div class="pro-slide-title j-nextshow">
    <span class="biaoti">{:lang('categories')}</span>
    <div class="proslide_menubtn">
        <span class="one"></span>
        <span class="two"></span>
        <span class="three"></span>
    </div>
</div>
<ul class="pryiji">
    {foreach $productCategoryList as $productCategoryListItem}
    <li {if in_array($productCategoryListItem.id, $nav_ids)}class="dangpryi" {/if}>
    <a href="{$productCategoryListItem.url|default=''}" title="{$productCategoryListItem.name|default=''}">
        {if !empty($productCategoryListItem['thumb'])}
        <img src="{$productCategoryListItem.thumb|imgwhwebp=38,38}" alt="{$productCategoryListItem.name|default=''}" />
        {/if}

        {$productCategoryListItem.name|default=''}
    </a>
    {if !empty($productCategoryListItem['children'])}
    <i class="iconfont icon-right1"></i>
    <ul class="prerji" style="display: none;">
        {foreach $productCategoryListItem['children'] as $productCategoryListItem2}
        <li {if in_array($productCategoryListItem2.id, $nav_ids)}class="dangpryi" {/if}>
        <a href="{$productCategoryListItem2.url|default=''}" title="{$productCategoryListItem2.name|default=''}">{$productCategoryListItem2.name|default=''}</a>
        {if !empty($productCategoryListItem2['children'])}
        <i class="iconfont icon-right1"></i>
        <ul class="prsanji">
            {foreach $productCategoryListItem2['children'] as $productCategoryListItem3}
            <li {if in_array($productCategoryListItem3.id, $nav_ids)}class="dangpryi" {/if}>
            <a href="{$productCategoryListItem3.url|default=''}" title="{$productCategoryListItem3.name|default=''}">{$productCategoryListItem3.name|default=''}</a>
            </li>
            {/foreach}
        </ul>
        {/if}
        </li>
        {/foreach}
    </ul>
    {/if}

    </li>
    {/foreach}
</ul>
<script type="text/javascript">
    $(".pryiji>li>.iconfont").click(function () {
        if ($(this).next(".prerji").css("display") === 'block') {
            $(this).next(".prerji").css("display", "none");
            $(this).css('transform', 'rotate(0deg)');
            $(this).parent().removeClass("dangpryi")
        } else {
            $(this).next(".prerji").css("display", "block");
            $(this).css('transform', 'rotate(90deg)');
            $(this).parent().addClass("dangpryi")
        }
    });
    $(".prerji>li>.iconfont").click(function () {
        if ($(this).next(".prsanji").css("display") === 'block') {
            $(this).next(".prsanji").css("display", "none");
            $(this).css('transform', 'rotate(0deg)');
            $(this).parent().removeClass("dangprer")
        } else {
            $(this).next(".prsanji").css("display", "block");
            $(this).css('transform', 'rotate(90deg)');
            $(this).parent().addClass("dangprer")
        }
    });
</script>
{/if}