Ta instrukcja przeznaczona jest dla standardowych szablonów Comarch starszych niż wersja 2019.6.
Jeśli posiadasz w sklepie kilka adresów do kontaktu, możesz umożliwić swoim klientom wybór jednego z nich na formularzu kontaktowym. Aby to zrobić, skorzystaj z poniższych instrukcji. Poszczególne pliki, które należy zmodyfikować znajdują się w Panelu administracyjnym w sekcji: Wygląd sklepu/ Ustawienia/ Więcej/ Edytuj ustawienia zaawansowane następnie Więcej/ Edytuj HTML.
1. Bursztyn i Opal
1.1. W pliku contact.html odnajdź element z id „ContactSendForm” i powyżej pola e-mail dodaj poniższy kod:
{% if config.Contact.Contacts[0] -%}
<select name="contactId" class="department" required>
{% for contact in config.Contact.Contacts -%}
<option value="{{ contact.Id }}">{{ contact.Name }}</option>
{% endfor -%}
</select>
{% endif -%}
1.2. Aby wygląd nowego pola był spójny z resztą formularza, w pliku scss/contact.scss odnajdź selektor „.contact-info .contact-form input, .contact-info .contact-form textarea” i zamień go na:
.contact-info .contact-form input, .contact-info .contact-form textarea, .contact-info .contact-form select
1.3. Skompiluj i zminifikuj pliki scss.
1.4. Aby walidacja działała poprawnie, w pliku js/init.js, odnajdź funkcję resetForm(form) i podmień ją na:
function resetForm(form) {
var inputs = form.find('input:not([disabled]):not([type=hidden]), select:not([disabled]):not(".department"), textarea:not([disabled])');
inputs.each(function () {
$(this).val('');
});
$('.loader-icon').remove();
$('.send-contact-form').removeClass('posting');
}
1.5. Zminifikuj pliki js.
2. Agat
2.1. W pliku contact.html odnajdź element z id „contact-form” i powyżej pola e-mail dodaj poniższy kod:
{% if config.Contact.Contacts[0] -%}
<div class="input-group">
<span class="required-fields-info">{{ translations.Department }} *</span>
<select name="contactId" required>
{% for contact in config.Contact.Contacts -%}
<option value="{{ contact.Id }}">{{ contact.Name }}</option>
{% endfor -%}
</select>
</div>
{% endif -%}
2.2. Aby wygląd nowego pola był spójny z resztą formularza, w pliku scss/mobile1.scss odnajdź selektor „input, textarea” i zamień go na:
input, textarea, .contact-form-popup select
2.3. Skompiluj i zminifikuj pliki scss.
2.4. Dodaj tłumaczenie dla frazy Department [Dział]
Tłumaczenie należy dodać w Panelu administracyjnym: Wygląd sklepu/ Ustawienia na zakładce Tłumaczenia.
3. Szafir
3.1. W pliku common/navigation-bars/navigation-contact.html odnajdź element z klasą „form-lq form-ui” i wewnątrz niego dodaj poniższy kod:
{% if config.Contact.Contacts[0] -%}
<div>
<label>{{ translations.Department }}<span class='required-ui'>*</span></label>
<span class="select-background-ui w100-ui">
<select name="contactId" required>
{% for contact in config.Contact.Contacts -%}
<option value="{{ contact.Id }}">{{ contact.Name }}</option>
{% endfor -%}
</select>
</span>
<i class="ti-angle-down select-arrow-ui"></i>
</div>
{% endif -%}
3.2. Dodaj tłumaczenie dla frazy Department [Dział]
Tłumaczenie należy dodać w Panelu administracyjnym: Wygląd sklepu/ Ustawienia na zakładce Tłumaczenia.
3.3. Aby walidacja działała poprawnie, w pliku js/init-ui2.js, odnajdź funkcję sendContactForm(e) i podmień ją na:
function sendContactForm(e) {
if(app.validationBeforePost(e) != 'error'){
$('.during-ajax-modal-lq').removeClass('hidden-lq');
var form = $(e.currentTarget).parents('.form-lq');
var inputs = form.find('input, textarea, select');
var data = inputs.serializeArray();
data.push({name: "__csrf", value: __CSRF});
$.post('', data, function(result) {
$('.during-ajax-modal-lq').addClass('hidden-lq');
if (result.action.Result) {
var message = form.data('success');
app.temporaryMessage(form, message);
$.each(inputs, function (index, value) {
if ($(value).attr('name') !== 'contactId' && $(value).attr('name') !== '__action') {
$(value).val('');
}
});
form.find('.message-lq').remove();
} else {
var message = '<p>' + result.action.Message + '</p>';
if(result.action.Code != 100){
app.message(form, message);
}
}
});
$(e.currentTarget).removeClass('error-lq');
} else {
$(e.currentTarget).addClass('error-lq');
}
}
3.4. Zminifikuj pliki js.