Files
cms-backend/Resources/Public/JavaScript/form-engine/element/select-tree-toolbar.js
T

14 lines
2.7 KiB
JavaScript

/*
* This file is part of the TYPO3 CMS project.
*
* It is free software; you can redistribute it and/or modify it under
* the terms of the GNU General Public License, either version 2
* of the License, or any later version.
*
* For the full copyright and license information, please read the
* LICENSE.txt file that was distributed with this source code.
*
* The TYPO3 project - inspiring people to share!
*/
import{LitElement as d,html as p}from"lit";import{customElement as h}from"lit/decorators.js";import s from"~labels/backend.alt_doc";var f=function(n,e,t,c){var i=arguments.length,l=i<3?e:c===null?c=Object.getOwnPropertyDescriptor(e,t):c,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")l=Reflect.decorate(n,e,t,c);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(l=(i<3?a(l):i>3?a(e,t,l):a(e,t))||l);return i>3&&l&&Object.defineProperty(e,t,l),l};let r=class extends d{constructor(){super(...arguments),this.settings={collapseAllBtn:"collapse-all-btn",expandAllBtn:"expand-all-btn",searchInput:"search-input",toggleHideUnchecked:"hide-unchecked-btn"},this.hideUncheckedState=!1}createRenderRoot(){return this}render(){return p`<div class=tree-toolbar><div class=tree-toolbar__buttons><input type=search autocomplete=off class="form-control ${this.settings.searchInput}" placeholder=${s.get("tcatree.findItem")} @input=${e=>this.filter(e)}><div class=btn-group><button type=button class="btn btn-default ${this.settings.expandAllBtn}" title=${s.get("tcatree.expandAll")} @click=${()=>this.expandAll()}><typo3-backend-icon identifier=apps-pagetree-category-expand-all size=small></typo3-backend-icon></button> <button type=button class="btn btn-default ${this.settings.collapseAllBtn}" title=${s.get("tcatree.collapseAll")} @click=${e=>this.collapseAll(e)}><typo3-backend-icon identifier=apps-pagetree-category-collapse-all size=small></typo3-backend-icon></button> <button type=button class="btn btn-default ${this.settings.toggleHideUnchecked}" title=${s.get("tcatree.toggleHideUnchecked")} @click=${()=>this.toggleHideUnchecked()}><typo3-backend-icon identifier=apps-pagetree-category-toggle-hide-checked size=small></typo3-backend-icon></button></div></div></div>`}collapseAll(e){e.preventDefault(),this.tree.nodes.forEach(t=>{t.__parents.length&&this.tree.hideChildren(t)})}expandAll(){this.tree.expandAll()}filter(e){const t=e.target;this.tree.filter(t.value.trim())}toggleHideUnchecked(){this.hideUncheckedState=!this.hideUncheckedState,this.hideUncheckedState?this.tree.nodes.forEach(e=>{e.checked?(this.tree.showParents(e),e.expanded=!0,e.__hidden=!1):(e.expanded=!1,e.__hidden=!0)}):this.tree.nodes.forEach(e=>e.__hidden=!1)}};r=f([h("typo3-backend-form-selecttree-toolbar")],r);export{r as SelectTreeToolbar};