Skip to content

Commit 60fcfdf

Browse files
co0lc0derco0lc0der
committed
refactor CardWidget
1 parent ca81af3 commit 60fcfdf

File tree

2 files changed

+146
-30
lines changed

2 files changed

+146
-30
lines changed

‎README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@ to the require section of your `composer.json` file.
4141
- `string $ajaxLoad = ''` - URL for loading data, if it is not empty it shows a spinner before data loaded
4242
- `string $ajaxOverlay = 'overlay'` - type of loading overlay ('overlay', 'dark')
4343
- `string $shadow = ''` - type of loading overlay ('shadow-none', 'shadow-sm', 'shadow', 'shadow-lg')
44-
- `array $items = []` - list of header custom items (labels, buttons, links)
44+
- `array $tools = []` - list of header custom tools (labels, buttons, links)
4545

4646
## How to use
4747

@@ -58,7 +58,7 @@ Use `CardWidget` to add your content in adminLTE card
5858
'collapse' => true, // show collapse button in card header
5959
'shadow' => 'shadow-sm', // use small shadow
6060
'close' => true, // show close button in card header
61-
'items' => [ // array with config to add custom labels, buttons or links
61+
'tools' => [ // array with config to add custom labels, buttons or links
6262
[
6363
'label',
6464
'new',

‎src/CardWidget.php

Lines changed: 144 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -4,23 +4,99 @@
44
use yii\bootstrap\Html;
55
use yii\web\View;
66

7+
/**
8+
* Class CardWidget
9+
* @package co0lc0der\Lte3Widgets
10+
*/
711
class CardWidget extends \yii\base\Widget
812
{
9-
public string $title; // title of a card
10-
public string $color = ''; // color of a card header (Bootstrap 4 colors. 'success', 'danger' еtс.)
11-
public bool $outline = false; // makes an outlined card
12-
public bool $background = false; // makes a colored card, uses $color property (Bootstrap 4 colors)
13-
public bool $gradient = false; // makes a gradient card, uses $color property (Bootstrap 4 colors)
14-
public string $footer = ''; // content of card footer
15-
public bool $collapse = true; // show/hide collapse button inside card header
16-
public bool $hide = false; // show/hide a collapsed card after initialization
17-
public bool $expand = false; // show/hide maximize button inside card header
18-
public bool $close = false; // show/hide close button inside card header
19-
public string $ajaxLoad = ''; // show loading spinner
20-
public string $ajaxOverlay = 'overlay';// type of loading overlay ('overlay', 'dark')
21-
public string $shadow = ''; // type of loading overlay ('shadow-none', 'shadow-sm', 'shadow', 'shadow-lg')
22-
public array $items = []; // list of header custom items (labels, buttons, links)
13+
/**
14+
* title of a card
15+
* @var string
16+
*/
17+
public string $title;
2318

19+
/**
20+
* color of a card header (Bootstrap 4 colors. 'success', 'danger' еtс.)
21+
* @var string
22+
*/
23+
public string $color = '';
24+
25+
/**
26+
* makes an outlined card
27+
* @var bool
28+
*/
29+
public bool $outline = false;
30+
31+
/**
32+
* makes a colored card, uses $color property (Bootstrap 4 colors)
33+
* @var bool
34+
*/
35+
public bool $background = false;
36+
37+
/**
38+
* makes a gradient card, uses $color property (Bootstrap 4 colors)
39+
* @var bool
40+
*/
41+
public bool $gradient = false;
42+
43+
/**
44+
* content of card footer
45+
* @var string
46+
*/
47+
public string $footer = '';
48+
49+
/**
50+
* show / hide collapse button inside card header
51+
* @var bool
52+
*/
53+
public bool $collapse = true;
54+
55+
/**
56+
* show / hide a collapsed card after initialization
57+
* @var bool
58+
*/
59+
public bool $hide = false;
60+
61+
/**
62+
* show / hide collapse button inside card header
63+
* @var bool
64+
*/
65+
public bool $expand = false;
66+
/**
67+
* show / hide maximize button inside card header
68+
* @var bool
69+
*/
70+
public bool $close = false;
71+
72+
/**
73+
* URL for loading data, if it is not empty it shows a spinner before data loaded
74+
* @var string
75+
*/
76+
public string $ajaxLoad = '';
77+
78+
/**
79+
* type of loading overlay ('overlay', 'dark')
80+
* @var string
81+
*/
82+
public string $ajaxOverlay = 'overlay';
83+
84+
/**
85+
* type of loading overlay
86+
* ('shadow-none', 'shadow-sm', 'shadow', 'shadow-lg')
87+
* @var string
88+
*/
89+
public string $shadow = '';
90+
91+
/**
92+
* list of header custom tools (labels, buttons, links)
93+
* @var array
94+
*/
95+
public array $tools = [];
96+
97+
/**
98+
* @return void
99+
*/
24100
public function init()
25101
{
26102
parent::init();
@@ -60,22 +136,26 @@ public function init()
60136
]
61137
];
62138
}
139+
63140
ob_start();
64141
}
65142

143+
/**
144+
* @return string
145+
*/
66146
public function run(): string
67147
{
68148
$this->registerJs();
69149
$content = ob_get_clean();
70150
$html = Html::beginTag('div', ['class' => $this->getCardClass()]);
71151

72152
$html .= Html::beginTag('div', ['class' => $this->getCardHeaderClass()]);
73-
$html .= (!empty($this->title)) ? Html::tag('h3', $this->title, ['class' => 'card-title']) : '';
74-
$html .= Html::tag('div', $this->getCardTools(), ['class' => 'card-tools']);
153+
$html .= $this->getCardTitle();
154+
$html .= $this->getCardTools();
75155
$html .= Html::endTag('div'); // the end of a card header
76156

77-
$html .= Html::tag('div', $content, ['class' => 'card-body']);
78-
$html .= ($this->footer) ? Html::tag('div', $this->footer, ['class' => 'card-footer']) : '';
157+
$html .= $this->getCardBody($content);
158+
$html .= $this->getCardFooter();
79159

80160
if ($this->ajaxLoad) {
81161
$overlay = ($this->ajaxOverlay == 'dark') ? 'overlay dark' : 'overlay';
@@ -87,6 +167,34 @@ public function run(): string
87167
return $html;
88168
}
89169

170+
/**
171+
* @return string
172+
*/
173+
private function getCardTitle(): string
174+
{
175+
return (!empty($this->title)) ? Html::tag('h3', $this->title, ['class' => 'card-title']) : '';
176+
}
177+
178+
/**
179+
* @param string $content
180+
* @return string
181+
*/
182+
private function getCardBody(string $content = ''): string
183+
{
184+
return (!empty($content)) ? Html::tag('div', $content, ['class' => 'card-body']) : '';
185+
}
186+
187+
/**
188+
* @return string
189+
*/
190+
private function getCardFooter(): string
191+
{
192+
return (!empty($this->footer)) ? Html::tag('div', $this->footer, ['class' => 'card-footer']) : '';
193+
}
194+
195+
/**
196+
* @return string
197+
*/
90198
private function getCardClass(): string
91199
{
92200
$class = "card";
@@ -101,19 +209,25 @@ private function getCardClass(): string
101209
return $class;
102210
}
103211

212+
/**
213+
* @return string
214+
*/
104215
private function getCardHeaderClass(): string
105216
{
106217
$class = 'card-header';
107218

108219
return $class;
109220
}
110221

222+
/**
223+
* @return string
224+
*/
111225
private function getCardTools(): string
112226
{
113227
$html = '';
114228

115-
if (is_array($this->items)){
116-
foreach ($this->items as $item){
229+
if (is_array($this->tools)) {
230+
foreach ($this->tools as $item) {
117231
if ($item[0] == 'button') {
118232
$html .= Html::button($item[1], array_merge(['class' => 'btn btn-tool'], $item[2]));
119233
} else if ($item[0] == 'label') {
@@ -124,21 +238,23 @@ private function getCardTools(): string
124238
}
125239
}
126240

127-
return $html;
241+
return (!empty($html)) ? Html::tag('div', $html, ['class' => 'card-tools']) : '';
128242
}
129243

244+
/**
245+
* @return void
246+
*/
130247
private function registerJs(): void
131248
{
132249
if ($this->ajaxLoad) {
133250
$this->view->registerJs("
134-
$.each($('[data-ajax-load-url]'), function(i, el) {
135-
let url = $(el).attr('data-ajax-load-url');
136-
$(el).siblings('.card-body').load(url, function() {
137-
$(el).remove();
138-
});
139-
});
251+
$.each($('[data-ajax-load-url]'), function(i, el) {
252+
let url = $(el).attr('data-ajax-load-url');
253+
$(el).siblings('.card-body').load(url, function() {
254+
$(el).remove();
255+
});
256+
});
140257
", View::POS_READY, 'ajaxLoad');
141258
}
142259
}
143260
}
144-

0 commit comments

Comments
 (0)