问题描述
创建手风琴或子类别视图?
我正在尝试从 product.category 视图创建一个手风琴视图。
我希望所有类别都在顶部,如果其中任何一个有孩子,我希望他们在手风琴列表或子类别中。
例如:
-
全部/购买/椅子/C88
-
全部
-
购买
-
椅子
- C88
-
-
-
我想要这个产品类别
谢谢
解决方法
让我们使用引导手风琴 (https://getbootstrap.com/docs/4.0/components/collapse/),例如:对于属于 category_1 中包含的 category_2 的产品:
<odoo>
<template id="products_categories_nested_accordions" inherit_id="website_sale.products_categories" active="False" customize_show="True" name="eCommerce Categories">
<xpath expr="//div[@id='products_grid_before']" position="inside">
<a href="#" role="button" class="collapsed" data-toggle="collapse" t-attf-data-target=".#{category_1.name}" t-attf-data="#{category_1.name}" aria-expanded="false">
<span class="fa fa-plus pull-right"/>
<label t-field="category_1.name" />
</a>
<t t-foreach="category_1.categories_2_ids" t-as="category_2">
<div t-attf-class=" collapse #{category_1.name} "
t-attf-data="#{category_2.name}" >
<a href="#" role="button" class="collapsed" data-toggle="collapse" t-attf-data-target=".#{category_2.name}" t-attf-data="#{category_2.name}" aria-expanded="false">
<span class="fa fa-plus pull-right"/>
<label t-field="category_2.name" />
</a>
</div>
<t t-foreach="products" t-as="product">
<div t-attf-class=" collapse #{category_2.name} "
t-attf-data="#{product.name}" >
<span itemprop="name" t-field="product.name" class="my-0" />
</div>
</t>
</t>
</xpath>
</template>
</odoo>
依此类推,其他嵌套类别彼此...