File: /home/retile.ru/public_html/admin/view/template/extension/module/uni_gallery_form.twig
{{ header }}
{{ column_left }}
<div id="content">
<div class="page-header">
<div class="container-fluid">
<div class="pull-right">
<a onclick="$('#form').submit();" data-toggle="tooltip" title="{{ button_save }}" class="btn btn-primary"><i class="fa fa-save"></i></a>
<a href="{{ cancel }}" data-toggle="tooltip" title="{{ button_cancel }}" class="btn btn-default"><i class="fa fa-reply"></i></a>
</div>
<h1>{{ heading_title }}</h1><br />
<ul class="breadcrumb">
{% for breadcrumb in breadcrumbs %}
<li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li>
{% endfor %}
</ul>
</div>
</div>
<div class="container-fluid">
{% if error_warning %}
<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> {{ error_warning }}<button type="button" class="close" data-dismiss="alert">×</button></div>
{% endif %}
{% if error_name %}
<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> {{ error_form }}<button type="button" class="close" data-dismiss="alert">×</button></div>
{% endif %}
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title"><i class="fa fa-pencil"></i>{{ entry_title_edit }}</h3>
</div>
<div class="panel-body">
<form action="{{ action }}" method="post" enctype="multipart/form-data" id="form" class="form-horizontal">
<ul class="nav nav-tabs">
<li><a href="#gallery-data-tab" data-toggle="tab">{{ text_tab }}</a></li>
<li><a href="#gallery-data-tab2" data-toggle="tab">SEO</a></li>
<li><a href="#gallery-data-tab1" data-toggle="tab">{{ text_tab1 }}</a></li>
</ul>
<div class="tab-content">
<div id="gallery-data-tab" class="tab-pane">
<div class="gallery-data__item">
<div class="col-sm-2 control-label">* {{ entry_name }}</div>
<div>
<ul class="nav nav-tabs">
{% for lang in languages %}
<li><a href="#gallery-title-{{ lang.language_id }}" data-toggle="tab"><img src="language/{{ lang.code }}/{{ lang.code }}.png" title="{{ lang.name }}" /></a></li>
{% endfor %}
</ul>
<div class="tab-content">
{% for lang in languages %}
<div id="gallery-title-{{ lang.language_id }}" class="tab-pane">
<input type="text" name="gallery_description[{{ lang.language_id }}][name]" value="{{ gallery_description[lang.language_id].name }}" placeholder="{{ text_name }}" class="form-control" />
{% if error_name[lang.language_id] %}
<div class="text-danger">{{ error_name[lang.language_id] }}</div>
{% endif %}
<textarea name="gallery_description[{{ lang.language_id }}][meta_description]" rows="3" placeholder="{{ text_meta_description }}" id="input-meta-description1" class="form-control">{{ gallery_description[lang.language_id].meta_description }}</textarea>
<textarea name="gallery_description[{{ lang.language_id }}][meta_keyword]" rows="3" placeholder="{{ text_meta_keyword }}" id="input-meta-description1" class="form-control">{{ gallery_description[lang.language_id].meta_keyword }}</textarea>
<textarea name="gallery_description[{{ lang.language_id }}][description]" data-lang="{{ summernote }}" data-toggle="summernote">{{ gallery_description[lang.language_id].description }}</textarea>
</div>
{% endfor %}
</div>
</div>
</div>
<div class="gallery-data__item">
<div class="col-sm-2 control-label">{{ entry_sort_order }}</div>
<div>
<input type="text" name="sort_order" value="{{ sort_order }}" class="form-control" />
</div>
</div>
<div class="gallery-data__item">
<div class="col-sm-2 control-label">{{ entry_store }}</div>
<div class="overflow" style="height:120px;">
{% for store in stores %}
<label><input type="checkbox" name="stores[]" value="{{ store.store_id }}" {{ store.store_id in gallery_stores ? 'checked="checked"' }} /><span></span>{{ store.name }}</label>
{% endfor %}
</div>
</div>
<div class="gallery-data__item">
<div class="col-sm-2 control-label">{{ entry_status }}</div>
<div>
<select name="status" class="form-control">
<option value="1" {{ status ? 'selected="selected"' }}>{{ text_enabled }}</option>
<option value="0" {{ status == 0 ? 'selected="selected"' }}>{{ text_disabled }}</option>
</select>
</div>
</div>
</div>
<div id="gallery-data-tab2" class="tab-pane">
<div class="alert alert-info"><i class="fa fa-info-circle"></i> {{ text_seo_alert }}</div>
<div class="table-responsive">
<div class="gallery-data__item">
<div class="col-sm-2 control-label" style="font-weight:400">{{ entry_store }}</div>
<div>SEO URL</div>
</div>
{% for store in stores %}
<div class="gallery-data__item">
<div class="col-sm-2 control-label">{{ store.name }}</div>
<div>
{% for language in languages %}
<div class="input-group">
<span class="input-group-addon">
<img src="language/{{ language.code }}/{{ language.code }}.png" title="{{ language.name }}" />
</span>
<input type="text" name="seo_url[{{ store.store_id }}][{{ language.language_id }}]" value="{{ seo_url[store.store_id][language.language_id] }}" placeholder="SEO URL" class="form-control" />
</div>
{% if error_keyword[store.store_id][language.language_id] %}
<div class="text-danger">{{ error_keyword[store.store_id][language.language_id] }}</div>
{% endif %}
{% endfor %}
</div>
</div>
{% endfor %}
</div>
</div>
<div id="gallery-data-tab1" class="tab-pane">
<div class="gallery-images" style="padding: 0 15px">
{% set image_row = 0 %}
{% for image in images %}
<div class="gallery-data__item">
<div class="text-center">
<a href="" id="thumb-image{{ image_row }}" data-toggle="image" class="img-thumbnail">
<img src="{{ image.thumb ? image.thumb : placeholder }}" alt="" title="" data-placeholder="{{ placeholder }}" />
</a>
<input type="hidden" name="gallery_image[{{ image_row }}][image]" value="{{ image.image }}" id="input-image{{ image_row }}" />
</div>
<div>
<ul class="nav nav-tabs">
{% for lang in languages %}
<li><a href="#gallery-img-title-{{ image_row }}-{{ lang.language_id }}" data-toggle="tab"><img src="language/{{ lang.code }}/{{ lang.code }}.png" title="{{ lang.name }}" /></a></li>
{% endfor %}
</ul>
<div class="tab-content">
{% for lang in languages %}
<div id="gallery-img-title-{{ image_row }}-{{ lang.language_id }}" class="tab-pane">
<input type="text" name="gallery_image[{{ image_row }}][description][{{ lang.language_id }}][title]" value="{{ image.description[lang.language_id].title }}" placeholder="{{ text_title }}" class="form-control" />
<input type="text" name="gallery_image[{{ image_row }}][description][{{ lang.language_id }}][link]" value="{{ image.description[lang.language_id].link }}" placeholder="{{ text_link }}" class="form-control" />
</div>
{% endfor %}
<input type="text" name="gallery_image[{{ image_row }}][sort_order]" value="{{ image.sort_order }}" placeholder="{{ text_sort_order }}" class="form-control" style="margin:10px 0 0" />
</div>
</div>
<button type="button" onclick="$(this).parent().remove();" data-toggle="tooltip" title="{{ button_remove }}" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button>
{% set image_row = image_row + 1 %}
</div>
{% endfor %}
</div>
<div>
<button type="button" onclick="addImage();" data-toggle="tooltip" title="{{ button_image_add }}" class="btn btn-primary"><i class="fa fa-plus-circle"></i> {{ button_image_add }}</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<style>
.gallery-data__item {display:flex;width:100%;align-items:center;margin: 0 -15px 20px;padding:0 0 20px;border-bottom:solid 1px #ddd}
.gallery-data__item > div:nth-child(2){flex:1 1 auto;margin:0 15px}
.gallery-data__item .nav{margin:0 0 10px}
.gallery-data__item .nav li a {padding:5px 12px}
.gallery-data__item .control-label {padding-top:0;font-weight:700}
.gallery-data__item input + input {margin:10px 0}
.gallery-data__item textarea {min-height:auto;margin:10px 0 !important}
.gallery-data__item textarea + textarea {margin:0 0 10px}
.gallery-data__item .text-danger {margin:8px 0 0}
.overflow {display:flex;flex-direction:column;height:180px;overflow:auto;padding:15px;border:solid 1px #ddd;border-radius:4px;background:#f2f2f2;box-shadow:inset 0 0 10px #ddd;}
.overflow b {display:inline !important;font-weight:400 !important}
.overflow label {display:flex;align-items:center;margin:0 0 10px !important;font-weight:400;cursor:pointer}
.overflow span {width:10px;margin:0 0 10px}
#content label input[type="checkbox"] {display:none}
#content label input[type="checkbox"] + span{position:relative;content:'';display:inline-block;vertical-align:middle;margin:0 10px 0 0;width:38px;height:18px;background:#ccc;border:solid 1px #999;border-radius:10px;box-shadow:inset 0 1px 2px rgba(0, 0, 0, .3);cursor:pointer;transition:all ease-in-out .2s}
#content label input[type="checkbox"]:checked + span {background:#6ab344}
#content label input[type="checkbox"] + span:after {position:absolute;top:1px;right:auto;left:2px;width:14px;height:14px;content:'';background:#fff;border-radius:100%;transition:all ease-in-out .2s}
#content label input[type="checkbox"]:checked + span:after {right:auto;left:21px;background:#fff}
</style>
<script>
$(function() {
$('.nav-tabs').each(function() {
$(this).find('li:first a').tab('show');
});
});
</script>
<script>
let image_row = {{ image_row }};
function addImage() {
html = '<div class="gallery-data__item">';
html += '<div class="text-center">';
html += '<a href="" id="thumb-image'+image_row+'" data-toggle="image" class="img-thumbnail">';
html += '<img src="{{ image.thumb ? image.thumb : placeholder }}" alt="" title="" data-placeholder="{{ placeholder }}" />';
html += '</a>';
html += '<input type="hidden" name="gallery_image['+image_row+'][image]" value="" id="input-image'+image_row+'" />';
html += '</div>';
html += '<div>';
html += '<ul class="nav nav-tabs">';
{% for lang in languages %}
html += '<li><a href="#gallery-img-title-'+image_row+'-{{ lang.language_id }}" data-toggle="tab"><img src="language/{{ lang.code }}/{{ lang.code }}.png" title="{{ lang.name }}" /></a></li>';
{% endfor %}
html += '</ul>';
html += '<div class="tab-content">';
{% for lang in languages %}
html += '<div id="gallery-img-title-'+image_row+'-{{ lang.language_id }}" class="tab-pane">';
html += '<input type="text" name="gallery_image['+image_row+'][description][{{ lang.language_id }}][title]" value="" placeholder="{{ text_title }}" class="form-control" />';
html += '<input type="text" name="gallery_image['+image_row+'][description][{{ lang.language_id }}][link]" value="" placeholder="{{ text_link }}" class="form-control" />';
html += '</div>';
{% endfor %}
html += '<input type="text" name="gallery_image['+image_row+'][sort_order]" value="0" placeholder="{{ text_sort_order }}" class="form-control" style="margin:10px 0 0" />';
html += '</div>';
html += '</div>';
html += '<button type="button" onclick="$(this).parent().remove();" data-toggle="tooltip" title="{{ button_remove }}" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button>';
html += '</div>';
$('.gallery-images').append(html);
$('.gallery-images .nav-tabs').each(function() {
$(this).find('li:first a').tab('show');
});
image_row++;
}
</script>
{{ footer }}