Skip to content

Commit 58a3f80

Browse files
excelwebzoneexcelwebzone
committed
Enhanced global and settings macros
1 parent bdbb2de commit 58a3f80

File tree

2 files changed

+285
-14
lines changed

2 files changed

+285
-14
lines changed

‎src/Resources/views/admin/settings/macros.html.twig‎

Lines changed: 223 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
{% macro containerBlock(title, cta, description, body) %}
2-
<div class="container-block">
1+
{% macro containerBlock(title, cta, description, body, class = null) %}
2+
<div class="container-block {{ class }}">
33
<div class="container-block-header">
44
<span class="container-block-title">{{ title|title }}</span>
55
<span class="container-block-cta">{{ cta|raw }}</span>
@@ -12,3 +12,224 @@
1212
{% endif %}
1313
</div>
1414
{% endmacro %}
15+
16+
{% macro containerBlockToggle(id, title, body, class = null) %}
17+
<div class="container-block js-toggle-container {{ class }}" id="{{ id }}">
18+
<div class="container-block-header">
19+
<span class="container-block-title js-toggle-button">
20+
<span class="zmdi zmdi-chevron-down"></span>
21+
{{ title|title }}
22+
</span>
23+
</div>
24+
<div class="container-block-body js-toggle-content hide">
25+
{{ body|raw }}
26+
</div>
27+
</div>
28+
{% endmacro %}
29+
30+
{% macro renderTable(titles, rows, isBordered = true, class = null, rowsClass = null, id = null, data = {}) %}
31+
<div class="settings-content-table {{ class }}"
32+
{% if id %}
33+
id="{{ id }}"
34+
{% endif %}
35+
36+
{% for key, value in data %}
37+
data-{{ key }}="{{ value }}"
38+
{% endfor %}
39+
>
40+
<div class="settings-content-table-block {% if isBordered %}is-bordered{% endif %}">
41+
<div class="settings-content-table-header">
42+
{% for title in titles %}
43+
{{ title|raw }}
44+
{% endfor %}
45+
</div>
46+
47+
<div class="{{ rowsClass }}">
48+
{% for row in rows %}
49+
{{ row|raw }}
50+
{% endfor %}
51+
</div>
52+
</div>
53+
</div>
54+
{% endmacro %}
55+
56+
{% macro renderRow(items, data = {}, class = null) %}
57+
<div class="settings-content-table-item {{ class }}"
58+
{% for key, value in data %}
59+
data-{{ key }}="{{ value }}"
60+
{% endfor %}
61+
>
62+
{% for item in items %}
63+
{{ item|raw }}
64+
{% endfor %}
65+
</div>
66+
{% endmacro %}
67+
68+
{% macro renderDragIcon(isHeader = false) %}
69+
<div class="settings-content-table-item-drag-icon">
70+
{% if not isHeader %}
71+
<i class="material-icons drag-handle">drag_handle</i>
72+
{% endif %}
73+
</div>
74+
{% endmacro %}
75+
76+
{% macro renderLabel(items, isHeader = false, isFixed = false, class = null) %}
77+
<div class="settings-content-table-item-label {% if isHeader %}is-header{% endif %} {% if isFixed %}is-fixed{% endif %} {{ class }}">
78+
{% for item in items %}
79+
{{ item|raw }}
80+
{% endfor %}
81+
</div>
82+
{% endmacro %}
83+
84+
{% macro renderLabelFixed(items, isHeader = false, class = null) %}
85+
{{ _self.renderLabel(items, isHeader, true, class) }}
86+
{% endmacro %}
87+
88+
{% macro addLabel(label, class = null) %}
89+
<div class="settings-content-table-item-label-content {{ class }}">{{ label|raw }}</div>
90+
{% endmacro %}
91+
92+
{% macro addLabelSearch(placeholder = 'Search') %}
93+
<div class="settings-content-table-item-label-content">
94+
<div class="popup-container js-toggle-container" data-toggle="tooltip" data-placement="bottom" title="Search">
95+
<i class="button button-toggle zmdi zmdi-search js-toggle-button" data-toggle-open-class="active" data-toggle-focus=".list-search>.input-text"></i>
96+
97+
<div class="popup-content list-search open-right bg-transparent js-toggle-content">
98+
<input type="text" placeholder="{{ placeholder }}" class="search input-text pt-0" autocomplete="off" />
99+
</div>
100+
</div>
101+
</div>
102+
{% endmacro %}
103+
104+
{% macro addLabelIcon(icon, isHeader = false) %}
105+
<div class="settings-content-table-item-icon">
106+
{% if not isHeader %}
107+
<i class="{{ icon }}"></i>
108+
{% endif %}
109+
</div>
110+
{% endmacro %}
111+
112+
{% macro renderColumn(items, isHeader = false, isNarrow = false, class = null, ignore = false) %}
113+
{% if not ignore %}
114+
<div class="settings-content-table-item-column {% if isHeader %}is-header{% endif %} {% if isNarrow %}is-narrow{% endif %} {{ class }}">
115+
{% for item in items %}
116+
{{ item|raw }}
117+
{% endfor %}
118+
</div>
119+
{% endif %}
120+
{% endmacro %}
121+
122+
{% macro renderColumnNarrow(items, isHeader = false, class = null, ignore = false) %}
123+
{{ _self.renderColumn(items, isHeader, true, class, ignore) }}
124+
{% endmacro %}
125+
126+
{% macro addColumnHtml(html) %}
127+
{{ html|raw }}
128+
{% endmacro %}
129+
130+
{% macro addColumnHelpIcon(icon, title) %}
131+
<span class="help-icon" data-toggle="tooltip" data-placement="top" title="{{ title }}">
132+
<i class="{{ icon }}"></i>
133+
</span>
134+
{% endmacro %}
135+
136+
{% macro renderActions(actions = [], length = null, class = null) %}
137+
<div class="settings-content-table-item-actions {{ class }}" data-icons="{{ length|default(actions|length) }}">
138+
{% for action in actions %}
139+
{{ action|raw }}
140+
{% endfor %}
141+
</div>
142+
{% endmacro %}
143+
144+
{% macro addActionGroup(actions, hide = false, class = null) %}
145+
<div class="{{ class }} {% if hide %}hide{% endif %}">
146+
{% for action in actions %}
147+
{{ action|raw }}
148+
{% endfor %}
149+
</div>
150+
{% endmacro %}
151+
152+
{% macro addActionLink(title, icon, endpoint, data = {}, class = null, ignore = false) %}
153+
{% import '@SymfonyAdmin/macros.html.twig' as UI %}
154+
155+
{% if not ignore %}
156+
{{ UI.link({
157+
iCss: icon,
158+
iTooltip: {
159+
title: title
160+
},
161+
class: 'settings-content-table-item-action-icon',
162+
aCss: class,
163+
data: data|merge({
164+
endpoint: endpoint
165+
})
166+
}) }}
167+
{% endif %}
168+
{% endmacro %}
169+
170+
{% macro addActionModal(title, icon, endpoint, data = {}, ignore = false) %}
171+
{% import '@SymfonyAdmin/macros.html.twig' as UI %}
172+
173+
{% if not ignore %}
174+
{{ UI.link({
175+
iCss: icon,
176+
iTooltip: {
177+
title: title
178+
},
179+
class: 'settings-content-table-item-action-icon',
180+
aCss: 'js-entity-modal',
181+
data: data|merge({
182+
endpoint: endpoint
183+
})
184+
}) }}
185+
{% endif %}
186+
{% endmacro %}
187+
188+
{% macro addActionModalTemplate(title, icon, template, arguments, ignore = false) %}
189+
{% import '@SymfonyAdmin/macros.html.twig' as UI %}
190+
191+
{% if not ignore %}
192+
{{ UI.link({
193+
iCss: icon,
194+
iTooltip: {
195+
title: title
196+
},
197+
class: 'settings-content-table-item-action-icon',
198+
aCss: 'js-entity-modal-template',
199+
data: {
200+
template: template,
201+
arguments: arguments|json_encode
202+
}
203+
}) }}
204+
{% endif %}
205+
{% endmacro %}
206+
207+
{% macro addActionToggleObject(title, icon, data = {}, ignore = false) %}
208+
{% import '@SymfonyAdmin/macros.html.twig' as UI %}
209+
210+
{% if not ignore %}
211+
{{ UI.link({
212+
iCss: icon,
213+
iTooltip: {
214+
title: title
215+
},
216+
class: 'settings-content-table-item-action-icon',
217+
aCss: 'js-toggle-object',
218+
data: data
219+
}) }}
220+
{% endif %}
221+
{% endmacro %}
222+
223+
{% macro renderUserLabel(user) %}
224+
{% import '@SymfonyAdmin/macros.html.twig' as UI %}
225+
226+
<div class="settings-content-company-user-list-item-thumbnail media">
227+
<span class="settings-content-company-user-picture media-left">
228+
{{ UI.profileImageComponentEntity(user) }}
229+
</span>
230+
<div class="settings-content-main-content media-body">
231+
<a href="{{ path('admin_settings_users_profile_edit', {id: user.id}) }}" class="settings-content-company-user-text name">{{ user }}</a>
232+
<div class="settings-content-secondary-content email">{{ user.email }}</div>
233+
</div>
234+
</div>
235+
{% endmacro %}

‎src/Resources/views/macros.html.twig‎

Lines changed: 62 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,16 @@
1+
{#
2+
Create an icon
3+
Parameters - array:
4+
[
5+
class - default class
6+
title - tooltip title
7+
placement - tooltip placement (default: top)
8+
]
9+
#}
10+
{% macro icon(parameters) %}
11+
<i class="{{ parameters.class }}" {% if parameters.title is defined and parameters.title %}data-toggle="tooltip" data-placement="{{ parameters.placement|default('top') }}" title="{{ parameters.title }}"{% endif %}></i>
12+
{% endmacro %}
13+
114
{#
215
Create the link
316
Parameters - array:
@@ -9,15 +22,22 @@
922
aCss - additional button class
1023
iCss - css class for 'i' tag (icon)
1124
iSelf - show icon before link
25+
iTooltip - add icon tooltip ({placement: top, title: '...'})
1226
data - additional data attributes
1327
]
1428
#}
1529
{% macro link(parameters) %}
30+
{% import _self as UI %}
31+
1632
{# need to remove spaces just before label #}
1733
{% set iconHtml = '' %}
1834
{% if parameters.iCss is defined and parameters.iCss %}
1935
{% set iconHtml %}
20-
<i class="{{ parameters.iCss }}"></i>
36+
{{ UI.icon({
37+
class: parameters.iCss,
38+
title: parameters.iTooltip|default({}).title|default(false),
39+
placement: parameters.iTooltip|default({}).placement|default(false)
40+
}) }}
2141
{% endset %}
2242
{% endif %}
2343
{% if parameters.iSelf is defined and parameters.iSelf %}
@@ -41,7 +61,7 @@
4161
{% if parameters.iSelf is not defined or not parameters.iSelf %}
4262
{{ iconHtml|trim|raw }}
4363
{% endif %}
44-
{{- parameters.label|trim|raw }}
64+
{{- parameters.label|default('')|trim|raw }}
4565
</a>
4666
{% endapply %}
4767
{% endmacro %}
@@ -1104,20 +1124,50 @@
11041124
{% endif %}
11051125
{% endmacro %}
11061126
1107-
{% macro deleteModalTemplate(deleteUrl) %}
1108-
<script type="text/template" id="deleteModalTemplate">
1127+
{% macro deleteModalTemplate(deleteUrl, removeRowKey = null, id = 'delete') %}
1128+
{% import _self as UI %}
1129+
1130+
{% set data = [] %}
1131+
{% if removeRowKey %}
1132+
{% set data = data|merge({
1133+
'remove-row': removeRowKey
1134+
}) %}
1135+
{% endif %}
1136+
1137+
{{ UI.renderModalTemplate(id, deleteUrl, data, 'Are you sure you want to remove __NAME__?', null, null, true, true, 'Cancel', 'Delete') }}
1138+
{% endmacro %}
1139+
1140+
{% macro renderModalTemplate(id, url, data = {}, header = null, body = null, footer = null, isDelete = false, isSlim = false, cancelButton = 'Cancel', submitButton = 'Submit') %}
1141+
<script type="text/template" id="{{ id }}ModalTemplate">
11091142
<form class="modal-form js-entity-form"
1110-
data-endpoint="{{ deleteUrl|replace({'__ID__': '<%- id %>'})|raw }}"
1143+
data-endpoint="{{ url|replace({'__ID__': '<%- id %>'})|raw }}"
11111144
data-submit="true"
1145+
1146+
{% for key, value in data %}
1147+
data-{{ key }}="{{ value|replace({'__ID__': '<%- id %>', '__NAME__': '<%- name %>'})|raw }}"
1148+
{% endfor %}
11121149
>
1113-
<input type="hidden" name="_method" value="DELETE" />
1150+
{% if isDelete %}
1151+
<input type="hidden" name="_method" value="DELETE" />
1152+
{% endif %}
11141153
1115-
<div class="modal-header modal-slim-header">
1116-
Are you sure you want to remove <%- name %>
1117-
</div>
1118-
<div class="modal-footer modal-slim-footer">
1119-
<button type="button" class="button button-flat" data-dismiss="modal">Cancel</button>
1120-
<button type="submit" class="button button-flat button-flat-primary">Delete</button>
1154+
{% if header %}
1155+
<div class="modal-header {% if isSlim %}modal-slim-header{% endif %}">
1156+
{{ header|replace({'__ID__': '<%- id %>', '__NAME__': '<%- name %>'})|raw }}
1157+
</div>
1158+
{% endif %}
1159+
{% if body %}
1160+
<div class="modal-body">
1161+
{{ body|replace({'__ID__': '<%- id %>', '__NAME__': '<%- name %>'})|raw }}
1162+
</div>
1163+
{% endif %}
1164+
<div class="modal-footer {% if isSlim %}modal-slim-footer{% endif %}">
1165+
<button type="button" class="button button-flat" data-dismiss="modal">{{ cancelButton }}</button>
1166+
<button type="submit" class="button button-flat button-flat-primary">{{ submitButton }}</button>
1167+
1168+
{% if footer %}
1169+
{{ footer|replace({'__ID__': '<%- id %>', '__NAME__': '<%- name %>'})|raw }}
1170+
{% endif %}
11211171
</div>
11221172
<div class="modal-corner">
11231173
<div class="button-close" data-dismiss="modal">

0 commit comments

Comments
 (0)