khuseini / pimcore-radbrick
在Pimcore中创建AreaBricks的RAD方法
Requires
- php: >=7.3
Requires (Dev)
- infection/infection: ^0.16.2
- php-coveralls/php-coveralls: ^2.2
- phpspec/prophecy-phpunit: ^2
- phpstan/phpstan: ^0.12.17
- phpunit/phpunit: ^9.1
- pimcore/pimcore: ^6
- sebastian/phpcpd: ^5.0
- squizlabs/php_codesniffer: ^3.5
This package is auto-updated.
Last update: 2022-04-29 01:13:43 UTC
README
PimcoreRadBrickBundle
在Pimcore中创建AreaBricks的RAD方法
目的
配置Pimcore AreaBricks视图和编辑模板中的数据和可编辑内容。
安装
composer require khusseini/pimcore-radbrick
用法
只需启用Bundle,在您的config.yml
中测试此配置,然后开始创建模板。
pimcore_rad_brick: areabricks: my_wysiwyg: label: WYSIWYG // Label to use in admin UI icon: ~ // Path to icon in admin UI open: ~ // Set the open html close: ~ // Set the close html use_edit: false // Use edit.html.twig class: ~ // Use an existing symfony service editables: wysiwyg_content: type: wysiwyg options: [] // you can pass here any options accepted by the editable
现在在views/Areas/my_wysiwyg/view.html.twig
中创建模板,就像平常一样。
{# add autogenerated meta description #} {% do pimcore_head_meta().setDescription(wysiwyg_content.getData(), 160) %} <div class="content"> {% pimcoreglossary %} {{ wysiwyg_content|raw }} {% endpimcoreglossary %} </div>
创建多个实例
为了创建具有相同配置的多个可编辑实例,只需添加instances
属性即可。
config.yml
pimcore_rad_brick: areabricks: my_wysiwyg: label: WYSIWYG editables: wysiwyg_content: instances: 3 type: wysiwyg options: [] // you can pass here any options accepted by the editable
使用可编辑的基本名称创建实例变量,并使用instance_ids
中提供的ID或简单地使用数组索引后缀。
{% for wysiwyg_instance in wysiwyg_content %} {{ wysiwyg_instance|raw }} {% endfor %}
使实例可配置
在大多数情况下,将可编辑实例的数量硬编码没有太多意义。为了使实例数量可通过管理员进行配置,我们将利用表达式语言组件的力量。
pimcore_rad_brick: areabricks: my_wysiwyg: label: WYSIWYG use_edit: true // Note that we use an edit template to configure the instances editables: num_editors: type: select options: store: [1,2,5] wysiwyg_content: instances: view.get("num_editors").getData() type: wysiwyg
注意:表达式上下文包含以下对象
request
:当前的Request
对象view
:当前的ViewModel
datasources
:DatasourceRegistry
实际示例
一个更实际的例子是将其集成到bootstrap网格中。可以轻松创建两个AreaBricks来支持bootstrap网格。
pimcore_rad_brick: areabricks: container: label: Container use_edit: true editables: container_css_class: type: input container_area_block: type: areablock options: allowed: - columns params: forceEditInView: true columns: label: Columns use_edit: true editables: num_columns: type: select options: store: [1, 2, 3, 4, 5, 6] defaultValue: 1 column_area_block: instances: view.get("num_columns").getData() type: areablock options: params: forceEditInView: true
container/view.html.twig
:
<div class="container"> {{ container_area_block|raw }} </div>
columns/edit.html.twig
:
# of Columns: {{ num_columns|raw }}
columns/view.html.twig
:
{% set col_width = 12 / num_columns.getData() %} <div class="row"> {% for column in column_area_block) %} <div class="col-{{ col_width }}"> {{ column|raw }} </div> {% else %} <div class="col-{{ col_width }}"> {{ column_area_block|raw }} </div> {% endfor %} </div>
使用组
您可能已经注意到了上述示例中的奇怪else
情况。这是由于instances
的工作方式。如果只配置了一个实例,则变量在视图中作为可编辑的呈现,而不是数组。
为了保持实例在数组或组中,可以使用groups
和group
配置来为可编辑内容提供模板。
config.yml
:
areabricks: promo_box: label: Promo Box use_edit: true groups: boxes: instances: 'view["num_boxes"].getValue() ? : 2' editables: num_boxes: type: select options: store: [2, 3, 5] link: type: link group: boxes image: type: image group: boxes
promo_box/edit.html.twig
:
# of Boxes: {{ num_boxes|raw }}
view.html.twig
:
<div> {% for box in boxes %} {{ box.link|raw }} {{ box.image|raw }} {% endfor %} </div>
使用映射
有时您的AreaBrick中的可编辑内容依赖于某些配置值。可以使用map
配置节点来映射可编辑内容之间的数据。
例如,一个图片AreaBrick可以配置为使用特定的缩略图
edit.html.twig
Thumbnail: {{ image_thumbnail|raw }}
view.html.twig
<div class="image-container"> {{ image_content|raw }} </div>
config.yml
pimcore_rad_brick: areabricks: image: label: Image editables: image_thumbnail: type: input image_content: type: image map: - source: '[image_thumbnail].data' target: '[options][thumbnail]'
source
和target
属性使用Symfony属性访问组件来获取和插入数据。
上述映射示例将从 image_thumbnail
可编辑属性(位于 ViewModel 中,因此使用数组表示法)中获取 data
属性的值,并将其直接插入到 [pimcore_rad_brick][areabricks][image][editables][image_content][options][thumbnail]
配置树中。
使用数据源
数据源简化了创建从其他服务获取数据的组件。例如,在 CoreShop 中,可能希望显示包含特定类别产品的滑块。
config.yml
pimcore_rad_brick: ## Define data sources to be used by areabricks datasources: products_by_category: service_id: 'app.repository.product' method: 'findByCategory' args: - '[category]' ## Specify which data to pass. The input array is passed by areabricks. areabricks: category_slider: label: Category Slider editables: select_category: type: relation options: types: ['object'] subtypes: object: ['object'] classes: ['CoreShopCategory'] datasources: ## Datasource configuration for this areabrick products: id: products_by_category args: category: 'view["category"].getElement()' ## Define category argument (available in input array to the datasource above)
数据源输入参数的属性路径包含以下信息
request
:访问当前请求对象view
:访问 ViewModel 中的元素
edit.html.twig
Category: {{ select_category|raw }}
view.html.twig
<div class="slider"> {% for product in products %} <div class="item">{% include 'product-tile.tml.twig' with {product: product} only %}</div> </div>
连接可编辑和数据源
在使用数据源时,还可以将可编辑连接到数据源中的项。例如,产品摘要可能有需要手动添加的标语,但所有其他字段都由产品填写。以下配置可以解决这个问题
pimcore_rad_brick: datasources: products_by_category: service_id: 'app.repository.product' method: 'findByCategory' args: - '[category]' ## Specify which data to pass. The input array is passed by areabricks. areabricks: category_slider: label: Category Slider use_edit: true editables: select_category: type: relation options: types: ['object'] subtypes: object: ['object'] classes: ['CoreShopCategory'] product_title: type: input datasource: name: products id: item.getId() # Specify ID source (will be casted to string) datasources: products: id: products_by_category args: category: view["select_category"].getElement()
贡献
如果您发现缺少某些内容,并且没有相应的 issue 或者想帮助修复错误或文档,请随时提交 PR。阅读代码并尝试使用 vendor/bin/phpunit
运行测试。编码标准是 @PSR2
,并将使用 php-cs-fixer
格式化代码。未来将使用 Scrutinizer 来强制执行编码标准。