v1.php 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <?php
  2. namespace zin;
  3. require_once dirname(__DIR__) . DS . 'btn' . DS . 'v1.php';
  4. class collapseBtn extends wg
  5. {
  6. /**
  7. * @var mixed[]
  8. */
  9. protected static $defineProps = array(
  10. 'target: string', // 展开折叠的目标元素选择器。
  11. 'parent: string' // 目标元素与按钮共同的父级元素选择器,使用 closest 辅助目标元素的确定。
  12. );
  13. protected function build()
  14. {
  15. $target = $this->prop('target');
  16. $parent = $this->prop('parent');
  17. return btn
  18. (
  19. setClass('btn-link', 'collapse-btn'),
  20. set($this->getRestProps()),
  21. set::icon('angle-down icon-lg text-gray'),
  22. on::click()->do
  23. (
  24. <<<JS
  25. const btn = event.target.closest('.collapse-btn');
  26. const icon = btn.querySelector('.icon');
  27. icon.classList.toggle('icon-angle-down');
  28. icon.classList.toggle('icon-angle-top');
  29. const parentElm = btn.closest('{$parent}');
  30. const targetElm = parentElm.querySelector('{$target}');
  31. if(targetElm) targetElm.classList.toggle('hidden');
  32. JS
  33. )
  34. );
  35. }
  36. }