122 lines
5.0 KiB
Smarty
122 lines
5.0 KiB
Smarty
<div data-sortable="articles_sortable_{$instance}" data-autocomplete-items="articles_{$instance}" class="panel-group panel-group-lists">
|
|
<script id="multiselectAutocomplete_articles_{$instance}" type="text/x-dot-template">
|
|
{literal}
|
|
{{~it.items :item :index}}
|
|
<div class="panel autocomplete-results" data-form-item="{{=item.value}}" style="display:none">
|
|
<div class="panel-body">
|
|
<div{/literal}{if $sortable}{literal} class="col-md-1"{/literal}{/if}{literal}>
|
|
{/literal}{if $sortable}{literal}
|
|
<span class="drag-drop-mover pull-right">
|
|
<i class="bi bi-arrows-move handle"></i>
|
|
</span>
|
|
<input type="hidden" data-sort=""
|
|
name="data[{/literal}{$inputName}{literal}][{{? item.index }}-{{=item.index}}{{??}}{{=index + 1}}{{?}}][position]"
|
|
value="{{=item.position}}">
|
|
{/literal}{/if}{literal}
|
|
|
|
<input type="hidden" class="form-control input-sm"
|
|
name="data[{/literal}{$inputName}{literal}][{{? item.index }}-{{=item.index}}{{??}}{{=index + 1}}{{?}}][id_article]"
|
|
value="{{=item.value}}">
|
|
</div>
|
|
<div class="col-md-6">
|
|
<p class="product-title">
|
|
<a href="javascript:nw('articles', '{{=item.value}}')">{{=item.label}}</a><br>
|
|
</p>
|
|
</div>
|
|
|
|
<div class="col-md-4">
|
|
{{? it.articlesRelatedTypes}}
|
|
<p>
|
|
<select class="selecter" multiple
|
|
name="data[{/literal}{$inputName}{literal}][{{? item.index }}-{{=item.index}}{{??}}{{=index + 1}}{{?}}][type][]"
|
|
data-placeholder="Vyberte typ souvisejícího článku...">
|
|
{{~it.articlesRelatedTypes :type :typeIndex}}
|
|
<option value="{{=type.id}}" {{? item.types && item.types.includes(type.id) }} selected="selected" {{?}}>
|
|
{{=type.name}}
|
|
</option>
|
|
{{~}}
|
|
</select>
|
|
</p>
|
|
{{?}}
|
|
</div>
|
|
|
|
<div class="col-md-1">
|
|
<a class="btn-sm btn btn-danger" data-form-delete>
|
|
<input class="hidden" type="checkbox"
|
|
name="data[{/literal}{$inputName}{literal}][{{? item.index }}-{{=item.index}}{{??}}{{=index + 1}}{{?}}][delete]"/>
|
|
<span class="glyphicon glyphicon-remove"></span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{~}}
|
|
{/literal}
|
|
</script>
|
|
</div>
|
|
<script type="application/javascript">
|
|
$('{$searchInput nofilter}')
|
|
.multiSelectAutoComplete({
|
|
formTemplate: '#multiselectAutocomplete_articles_{$instance}',
|
|
formWrapper: 'articles_{$instance}',
|
|
type: 'articles',
|
|
itemIdentifierKey: 'value',
|
|
{if $except}parameters: 'except_article={$except}',{/if}
|
|
{literal}
|
|
subtemplates: {
|
|
menuItem: '<div tabindex="-1" data-autocomplete-item="{{=index}}">' +
|
|
'<p>{{=item.text}}</p>' +
|
|
'{{#def.buttons}}' +
|
|
'</div>' +
|
|
'{{#def.bottom}}',
|
|
},
|
|
{/literal}
|
|
{if $sortable}
|
|
afterSelect: function () {
|
|
$('[data-sortable="articles_sortable_{$instance}"]').sortable('refresh');
|
|
$('[data-sortable="articles_sortable_{$instance}"]').data('uiSortable')._trigger('update');
|
|
}
|
|
{/if}
|
|
{if $additionalData},
|
|
templateContext: {
|
|
{foreach $additionalData as $key => $data}
|
|
"{$key}": {$data|json_encode nofilter}
|
|
{/foreach}
|
|
}
|
|
{/if}
|
|
{block "autocomplete-config"}{/block}
|
|
})
|
|
.multiSelectAutoComplete('addItems', {
|
|
"items": {$items|json_encode nofilter}
|
|
{if $additionalData}
|
|
{foreach $additionalData as $key => $data}
|
|
,"{$key}": {$data|json_encode nofilter}
|
|
{/foreach}
|
|
{/if}
|
|
});
|
|
|
|
initForm({
|
|
selector: '[data-autocomplete-items="articles_{$instance}"]',
|
|
beforeAdd: function (callback) {
|
|
var $item = callback();
|
|
return false;
|
|
}
|
|
});
|
|
|
|
{if $sortable}
|
|
$('[data-sortable="articles_sortable_{$instance}"]').sortable({
|
|
helper: function (e, row) {
|
|
var $row = $(row);
|
|
var $helper = $row.clone().addClass('drag-drop');
|
|
return $helper[0];
|
|
},
|
|
update: function (event, ui) {
|
|
$(this).children().each(function (index, item) {
|
|
$(item).find('[data-sort]').val($(item).index()).change();
|
|
});
|
|
},
|
|
handle: '.handle',
|
|
placeholder: 'placeholder',
|
|
});
|
|
{/if}
|
|
</script>
|