murph-core/src/core/Resources/views/admin/crud/index.html.twig
Simon Vieille 1d0b657c83
add sass classes to mange with of elements
fix the aspect of the actions's column in the crud

add background in the modal header

change vavigation pills colors
2023-10-25 19:12:02 +02:00

340 lines
21 KiB
Twig

{% extends '@Core/admin/layout.html.twig' %}
{% set context = context ?? 'index' %}
{% block title %}{{ configuration.pageTitle(context)|trans }} {{ parent() ? ('- ' ~ parent()) : '' }}{% endblock %}
{% block body %}
{% block header %}
{%- set pb -%}
{% if pager.paginationData.pageCount < 2 %}
{% if filters.show %}
pb-3
{% else %}
pb-5
{% endif %}
{% else %}
pb-3
{% endif %}
{%- endset -%}
<div class="bg-light">
<div class="crud-header">
{% block header_title %}
<h1 class="crud-header-title">{{ configuration.pageTitle(context)|trans }}</h1>
{% endblock %}
{%- block header_actions %}
<div class="crud-header-actions">
<div class="btn-group">
{%- block header_actions_before %}{% endblock -%}
{%- if configuration.action(context, 'new', true) %}
<a href="{{ path(configuration.pageRoute('new'), configuration.pageRouteParams('new')) }}" class="btn btn-primary">
<span class="fa fa-plus pr-1"></span>
<span class="d-none d-md-inline">
{{ configuration.actionTitle(context, 'new', 'New')|trans }}
</span>
</a>
{% endif -%}
{%- if header_actions_dropdown_menu is not defined %}
{% set header_actions_dropdown_menu = '' %}
{% endif -%}
{%- block header_actions_after %}{% endblock -%}
{%- block header_actions_dropdown %}
{%- if header_actions_dropdown_menu %}
<button type="button" class="btn btn-white dropdown-toggle dropdown-toggle-hide-after" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="font-weight-bold">
⋅⋅⋅
</span>
</button>
<div class="dropdown-menu dropdown-menu-right">
{{ header_actions_dropdown_menu|raw }}
</div>
{% endif -%}
{% endblock -%}
</div>
</div>
{% endblock %}
</div>
{% block header_filter_pager %}
{% if filters.show %}
<div class="row crud-header-filter">
<div class="col-auto ml-auto {% if pager.getPaginationData.pageCount > 1 %}mr-3{% endif %}">
<button data-modal="{{ path(configuration.pageRoute('filter'), configuration.pageRouteParams('filter')) }}" class="btn btn-sm btn-secondary">
{{ 'Filter'|trans }} {% if not filters.isEmpty %}({{ 'yes'|trans }}){% endif %}
</button>
</div>
<div class="col-auto">
{{ knp_pagination_render(pager) }}
</div>
</div>
{% else %}
<div class="crud-header-filter">
{{ knp_pagination_render(pager) }}
</div>
{% endif %}
{% endblock %}
</div>
{% endblock %}
{% block list %}
{% set isSortable = configuration.isSortableCollection(context) %}
<div class="table-responsive">
<table class="table">
{% block list_header %}
<thead class="thead-light">
<tr>
{% if configuration.hasBatchAction(context) %}
<th class="crud-batch-column">
<input type="checkbox">
</th>
{% endif %}
{% for label, config in configuration.fields(context) %}
{% block list_header_item %}
{% set attr = config.options.attr is defined ? config.options.attr : [] %}
{% set isSortable = config.options.sort ?? false %}
<th {% for key, value in attr %}{{ key }}="{{ value }}"{% endfor %}>
{% if isSortable %}
{% if sort %}
{% if sort.label == label %}
{% if sort.direction == 'asc' %}
{% set newDirection = 'desc' %}
{% set icon = 'fa fa-sort-amount-down-alt' %}
{% else %}
{% set newDirection = 'asc' %}
{% set icon = 'fa fa-sort-amount-up-alt' %}
{% endif %}
{% set url = path(configuration.getPageRoute(context), {
_sort: config.options.sort[0],
_sort_direction: newDirection,
}|merge(configuration.pageRouteParams(context))) %}
{% else %}
{% set url = path(configuration.getPageRoute(context), {
_sort: config.options.sort[0],
_sort_direction: 'asc',
}|merge(configuration.pageRouteParams(context))) %}
{% set icon = null %}
{% endif %}
<a href="{{ url }}">
{% if icon is defined %}
<span class="{{ icon }}"></span>
{% endif %}
{{ label|trans }}
</a>
{% else %}
{{ label|trans }}
{% endif %}
{% else %}
{{ label|trans }}
{% endif %}
</th>
{% endblock %}
{% endfor %}
{% if configuration.showActions %}
<th class="crud-action-column miw-100 text-right">
{{ 'Actions'|trans }}
</th>
{% endif %}
</tr>
</thead>
{% endblock %}
{% block list_items %}
{% if isSortable %}
{% set dataSortable = 'data-sortable' %}
{% set dataSortableRoute = 'data-sortable-route="' ~ path(
configuration.pageRoute('sort'),
{
_token: csrf_token('sort'),
page: pager.currentPageNumber,
context: context,
}|merge(configuration.pageRouteParams('sort'))
) ~ '"' %}
{% else %}
{% set dataSortable = '' %}
{% set dataSortableRoute = '' %}
{% endif %}
<tbody {{ dataSortable }} {{ dataSortableRoute|raw }}>
{% for item in pager %}
{% if isSortable %}
{% set dataSortableItem = 'data-sortable-item="' ~ loop.index ~ '"' %}
{% else %}
{% set dataSortableItem = '' %}
{% endif %}
{% block list_item %}
{%- set dbClick %}
{% if configuration.action(context, 'show', true, [item]) %}
{{ path(configuration.pageRoute('show'), {entity: item.id}|merge(configuration.pageRouteParams('show'))) }}
{% elseif configuration.action(context, 'edit', true, [item]) %}
{{ path(configuration.pageRoute('edit'), {entity: item.id}|merge(configuration.pageRouteParams('show'))) }}
{% endif %}
{% endset -%}
<tr {{ dataSortableItem|raw }} {% if configuration.doubleClick(context) %}data-dblclick="{{ dbClick }}"{% endif %} class="{{ loop.index is odd ? 'is-odd' : 'is-even' }}">
{% if configuration.hasBatchAction(context) %}
<td class="crud-batch-column">
<input type="checkbox" class="batch_form" name="batch[items][{{ loop.index }}]" form="form-batch" value="{{ loop.index }}">
</td>
{% endif %}
{% for label, config in configuration.fields(context) %}
{% set attr = config.options.attr ?? [] %}
{% set action = config.options.action ?? null %}
{% set inlineForm = config.options.inline_form ?? null %}
<td {% for key, value in attr %}{{ key }}="{{ value }}"{% endfor %}>
{% if inlineForm and configuration.action(context, 'edit', true, [item]) %}
<a href="#" data-modal="{{ path(
configuration.pageroute('inline_edit'), {
entity: item.id,
context: context,
label: label,
redirectTo: app.request.pathInfo,
}|merge(configuration.pagerouteparams('inline_edit'))) }}" data-modal-create>
{{ render_field(item, config, configuration.defaultlocale) }}
</a>
{% elseif action == 'show' and configuration.action(context, 'show', true, [item]) %}
<a href="{{ path(configuration.pageRoute('show'), {entity: item.id}|merge(configuration.pageRouteParams('show'))) }}">
{{ render_field(item, config, configuration.defaultLocale) }}
</a>
{% elseif action == 'edit' and configuration.action(context, 'edit', true, [item]) %}
<a href="{{ path(configuration.pageroute('edit'), {entity: item.id}|merge(configuration.pagerouteparams('edit'))) }}">
{{ render_field(item, config, configuration.defaultlocale) }}
</a>
{% else %}
{{ render_field(item, config, configuration.defaultLocale) }}
{% endif %}
</td>
{% endfor %}
{% if configuration.showActions %}
<td class="crud-action-column col-2 miw-200 text-right">
{% block list_item_actions %}
{% block list_item_actions_before %}{% endblock %}
{% block list_item_action_show %}
{% if configuration.action(context, 'show', true, [item]) %}
<a href="{{ path(configuration.pageRoute('show'), {entity: item.id}|merge(configuration.pageRouteParams('show'))) }}" class="btn btn-sm btn-secondary mr-1">
<span class="fa fa-eye"></span>
</a>
{% endif %}
{% endblock %}
{% block list_item_action_edit %}
{% if configuration.action(context, 'edit', true, [item]) %}
<a href="{{ path(configuration.pageRoute('edit'), {entity: item.id}|merge(configuration.pageRouteParams('edit'))) }}" class="btn btn-sm btn-primary mr-1">
<span class="fa fa-edit"></span>
</a>
{% endif %}
{% endblock %}
{% block list_item_action_delete %}
{% if configuration.action(context, 'delete', true, [item]) %}
<button type="submit" form="form-delete-{{ item.id }}" class="btn btn-sm btn-danger">
<span class="fa fa-trash"></span>
</button>
<form method="post" action="{{ path(configuration.pageRoute('delete'), {entity: item.id}|merge(configuration.pageRouteParams('delete'))) }}" id="form-delete-{{ item.id }}" data-form-confirm>
<input type="hidden" name="_method" value="DELETE">
<input type="hidden" name="_token" value="{{ csrf_token('delete' ~ item.id) }}">
</form>
{% endif %}
{% endblock %}
{% block list_item_actions_after %}{% endblock %}
{% endblock %}
</td>
{% endif %}
</tr>
{% endblock %}
{% if loop.last %}
{% block list_footer %}
{% set count = configuration.fields(context)|length + 1 %}
{% if configuration.hasBatchAction(context) %}
{% set count = count + 1 %}
{% endif %}
<tr>
<td class="col-12 text-black-50 border-0" colspan="{{ count }}">
{% block list_footer_before %}{% endblock %}
{% if isSortable %}
<div class="mb-2">
<span class="fa fa-hand-pointer"></span>
{{ 'You can sort items with drag & drop'|trans }}
</div>
{% endif %}
{% if configuration.hasBatchAction(context) %}
<div class="mb-2">
<form class="form-inline" action="{{ path(configuration.pageRoute('batch'), {
page: pager.currentPageNumber,
redirectTo: app.request.uri
}|merge(configuration.pageRouteParams('batch'))) }}" id="form-batch" method="POST">
<select class="form-control my-1 mr-sm-2" name="batch[target]">
<option value="selection">{{ 'For selection'|trans }}</option>
<option value="all">{{ 'For all items'|trans }}</option>
</select>
<select class="form-control my-1 mr-sm-2" id="form-batch-action" name="batch[action]">
<option value=""></option>
{% for action, conf in configuration.batchActions(context) %}
<option value="{{ action }}" {% if conf.isGlobal %}data-isglobal="true"{% endif %}>
{{ conf.label|trans }}
</option>
{% endfor %}
</select>
<input type="hidden" name="batch[_token]" value="{{ csrf_token('batch') }}">
<button type="submit" class="btn btn-primary my-1">
<span class="loader spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
{{ 'Run'|trans }}
</button>
</form>
</div>
{% endif %}
{% block list_footer_after %}{% endblock %}
</td>
</tr>
{% endblock %}
{% endif %}
{% else %}
{% set count = configuration.fields(context)|length + 1 %}
{% if configuration.hasBatchAction(context) %}
{% set count = count + 1 %}
{% endif %}
<tr>
<td class="col-12 text-center p-4 text-black-50" colspan="{{ count }}">
<div class="display-1">
<span class="fa fa-search"></span>
</div>
<div class="display-5 mt-3">
{{ 'No result'|trans }}
</div>
</td>
</tr>
{% endfor %}
</tbody>
{% endblock %}
</table>
</div>
{% endblock %}
{% endblock %}