| 1: | <?php
|
| 2: |
|
| 3: |
|
| 4: |
|
| 5: |
|
| 6: | class Tabs extends Sphp\tools\Component{
|
| 7: | private $activeli = 1;
|
| 8: | private $disabletabs = array();
|
| 9: | private $activeblock = 1;
|
| 10: | private $tabhead = '<nav>
|
| 11: | <div class="nav nav-tabs" id="nav-tab" role="tablist">
|
| 12: | <button class="nav-link active" id="nav-home-tab" data-bs-toggle="tab" data-bs-target="#nav-home" type="button" role="tab" aria-controls="nav-home" aria-selected="true">Home</button>
|
| 13: | <button class="nav-link" id="nav-profile-tab" data-bs-toggle="tab" data-bs-target="#nav-profile" type="button" role="tab" aria-controls="nav-profile" aria-selected="false">Profile</button>
|
| 14: | <button class="nav-link" id="nav-contact-tab" data-bs-toggle="tab" data-bs-target="#nav-contact" type="button" role="tab" aria-controls="nav-contact" aria-selected="false">Contact</button>
|
| 15: | <button class="nav-link" id="nav-disabled-tab" data-bs-toggle="tab" data-bs-target="#nav-disabled" type="button" role="tab" aria-controls="nav-disabled" aria-selected="false" disabled>Disabled</button>
|
| 16: | </div>
|
| 17: | </nav>
|
| 18: | ';
|
| 19: |
|
| 20: | protected function oncreate($element) {
|
| 21: | $Client = SphpBase::sphp_request();
|
| 22: | if($Client->request($this->name .'li')!="" && $Client->request($this->name .'li')!="null"){
|
| 23: | $this->activeli = $Client->request($this->name . 'li');
|
| 24: | }
|
| 25: | }
|
| 26: |
|
| 27: | public function fu_disableTabs($param) {
|
| 28: | $arr = explode(",",$param);
|
| 29: | foreach ($arr as $key => $value) {
|
| 30: | $this->disabletabs[$value] = $value;
|
| 31: | }
|
| 32: | }
|
| 33: | protected function onparse($event,$element) {
|
| 34: | global $ctrl;
|
| 35: |
|
| 36: | if($event=="start"){
|
| 37: | static $countli;
|
| 38: | if($element->attributes['class']=="nav-link"){
|
| 39: | $countli += 1;
|
| 40: | $element->attributes['data-linum'] = $countli;
|
| 41: | if(isset($this->disabletabs[$countli])){
|
| 42: | $element->attributes['class'] = $element->getAttribute("class") . " disabled";
|
| 43: | }
|
| 44: | else if($this->activeli == $countli){
|
| 45: | $cls = "";
|
| 46: | if(isset($element->attributes['class'])){
|
| 47: | $cls = $element->attributes['class'];
|
| 48: | }
|
| 49: | $element->attributes['class'] = $cls . " active " ;
|
| 50: | $this->activeblock = $countli;
|
| 51: | }
|
| 52: | if($this->activeblock == $countli){
|
| 53: | $this->activeblock = substr($element->attributes['href'],1);
|
| 54: | }
|
| 55: | }else if(isset($element->attributes['id']) && $element->attributes['id'] == $this->activeblock){
|
| 56: | $cls = "";
|
| 57: | if(isset($element->attributes['class'])){
|
| 58: | $cls = $element->attributes['class'];
|
| 59: | }
|
| 60: | $element->attributes['class'] = $cls . " in active" ;
|
| 61: | }
|
| 62: |
|
| 63: | }
|
| 64: | }
|
| 65: | protected function onjsrender2() {
|
| 66: | addHeaderJSFunctionCode('ready', 'tab1', ' $(".nav-tabs").on(\'show.bs.tab\', "li.disabled a", function(event) {
|
| 67: | event.stopImmediatePropagation();
|
| 68: | return false;
|
| 69: | });
|
| 70: | $(".nav-tabs").off(\'show.bs.tab\', "li:not(.disabled) a");
|
| 71: | $(\'.nav-tabs\').on(\'shown.bs.tab\', "li:not(.disabled) a", function(e){
|
| 72: | activeTab = $(e.target).data("linum");
|
| 73: | previousTab = $(e.relatedTarget).data("linum");
|
| 74: | });');
|
| 75: | addHeaderJSCode('tab1', ' activeTab = "'.$this->activeli.'"; previousTab = "null";');
|
| 76: | }
|
| 77: | protected function onrender(){
|
| 78: | $this->class .= " tabblock";
|
| 79: | $tabgroup = "tab";
|
| 80: | $tabgroup2 = "nav-tabs";
|
| 81: | $tabgroup3 = "";
|
| 82: | switch($this->styler){
|
| 83: | case 1:{ $tabgroup = "pill"; $tabgroup2 = "nav-pills"; break;}
|
| 84: | case 2:{ $tabgroup = "pill"; $tabgroup2 = "flex-column nav-pills me-3"; $tabgroup3 = 'aria-orientation="vertical"'; $this->class .= " d-flex align-items-start"; break;}
|
| 85: | case 3:{ $tabgroup = "underline"; $tabgroup2 = "nav-underline"; break;}
|
| 86: | }
|
| 87: | $tabhead1 = "";
|
| 88: | $this->element->iterateChildren(function($event,$ele1) use(&$tabhead1,$tabgroup){
|
| 89: | if(!$event && $ele1->tagName == "tab"){
|
| 90: | if(! $ele1->hasAttribute("id")) $ele1->setAttribute("id", 'nav-'. strtolower($ele1->getAttribute("text")));
|
| 91: | $ele1->appendAttribute("class"," tab-pane fade");
|
| 92: | $ele1->tagName = 'div';
|
| 93: | $active = "";
|
| 94: | $ele1->setAttribute("role","tabpanel");
|
| 95: | $ele1->setAttribute("aria-labelledby","btn-" . $ele1->getAttribute("id"));
|
| 96: | $ele1->setAttribute("tabindex","0");
|
| 97: | if($ele1->hasAttribute("active")) {$active = " active"; $ele1->appendAttribute("class"," show active");}
|
| 98: | $ele1->setInnerPreTag('<div class="card"><div class="card-body">');
|
| 99: | $ele1->setInnerPostTag('</div></div>');
|
| 100: | $tabhead1 .= ' <li class="nav-item" role="presentation">'
|
| 101: | . '<button class="nav-link'. $active .'" id="btn-'. $ele1->getAttribute("id") .'" data-bs-toggle="'. $tabgroup .'" data-bs-target="#'. $ele1->getAttribute("id") .'" type="button" role="tab" aria-controls="'. $ele1->getAttribute("id") .'" aria-selected="false">'. $ele1->getAttribute("text") .'</button></li>';
|
| 102: | }
|
| 103: | }
|
| 104: | );
|
| 105: |
|
| 106: | $this->element->setInnerPreTag('<ul class="nav '. $tabgroup2 .'" id="nav-'. $this->name .'" role="tablist" '. $tabgroup3 .'>' . $tabhead1 . '</ul>
|
| 107: | <div class="tab-content" id="nav-'. $this->name .'-content">
|
| 108: | ');
|
| 109: | $this->element->setInnerPostTag('</div>');
|
| 110: | }
|
| 111: |
|
| 112: | }
|
| 113: | |