Skip to content

Instantly share code, notes, and snippets.

@flymio

flymio/basket.js

Last active October 8, 2021 14:31
Show Gist options
  • Save flymio/d2c40cf63a0f38e94abf2bed2ca6c5a4 to your computer and use it in GitHub Desktop.
Save flymio/d2c40cf63a0f38e94abf2bed2ca6c5a4 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
basket.js
sep = Brackets.templateLiteral;
// склонение числительных
function declOfNum(number, titles) {
cases = [2, 0, 1, 1, 1, 2];
return titles[ (number%100>4 && number%100<20)? 2 : cases[(number%10<5)?number%10:5] ];
}
// всякая херня типа расчета суммы заказа (товары+доставка) и пр. - макросы
Brackets.addFilter('priceQ', function (price, quantity) {
return (parseFloat(price) * parseFloat(quantity)).toFixed(2);
}).addFilter('addDelivery', function (price, delivery) {
if (delivery === undefined) {
//location.reload();
};
if (!isNaN(delivery)) {
return (parseFloat(price) + parseFloat(delivery)).toFixed(2);
}else{
return parseFloat(price);
}
}).addFilter('checkMinimum', function (price) {
price=parseInt(price)-500;
if (price>0){
return 1;
}
return 0;
}).addFilter('get_case', function (quantity){
return declOfNum(quantity, ['товар', 'товара', 'товаров']);
}).addFilter('showWeight', function (weight){
return (weight/1000).toFixed(2);
}).addFilter('showDesc', function (total){
var desc = '';
var deliverytotal = 3500-total;
if (total<500) {
total_min = false;
desc = 'Минимальная сумма заказа 500р.';
}
if (total>500 && total<3500) {
total_min = true;
desc = 'Для бесплатной доставки докупите товаров на ';
desc+= Math.round(deliverytotal);
desc+= ' руб.';
}
if (total>3500) {
total_min = true;
desc = 'Поздравляем, доставка будет бесплатной!';
}
return desc;
}).addFilter('showWeightBlocked', function (weight){
return 'disabled="disabled"';
}).addMacro('showWeightBlocked', function(){
if (shop.weight>30000){
return '_template += _templateAdd(' + sep + '<div class="btn">Максимальный вес заказа - 30кг. Пожалуста, удалите некоторые товары и обновите страницу.</div>'+sep+');';
}
else{
return '_template += _templateAdd(' + sep + '<button type="submit" name="submit" class="btn order-content__submit">Перейти к оплате</button>'+sep+');';
}
}).addFilter('showdsb', function (quantity, amount, step) {
amount = parseInt(amount*10)/10;
var next = quantity;
//console.log(next, amount);
if (next >= amount){
//console.log('disabled');
return 'disabled="disabled"';
}
return '';
});
tmpl_cart = Brackets.render({
el: '#order-content-show',
data: { // вместо этого хеша тут твой json
desc: desc,
items: shop.items,
quantity: shop.quantity_int || 0,
total: shop.total,
weight: shop.weight || 0,
total_min: total_min,
comment: getData("comment"),
address: getData("address"),
flat: getData("flat"),
name: getData("name"),
email: getData("email"),
phone: getData("phone"),
entrance: getData("entrance"),
intercom: getData("intercom"),
delivery: delivery || 0,
}
});
Raw
basket_brackets.html
<div id="order-content-show">
{{if !total }}
<p>Ваша корзина пуста</p>
{{else}}
<div class="order__content">
<div class="order__products">
<div class="order__products-heading">
<h5 class="order__products-title">Товары в заказе</h5>
<div class="order__products-controls">
<div class="order__products-search-container">
</div>
<div class="order__products-button-container">
<a href="javascript:void(0)" class="order__products-button cart-clean">Очистить<span> корзину</span></a>
</div>
</div>
</div>
<div class="order__products-list">
<div class="order__products-titles">
<div class="order__products-titles-content">
<div class="order__products-titles-cell order__products-photo">Фото</div>
<div class="order__products-titles-cell order__products-name">Название</div>
<div class="order__products-titles-cell order__products-price">Цена</div>
<div class="order__products-titles-cell order__products-count">Количество</div>
<div class="order__products-titles-cell order__products-sum">Сумма</div>
<div class="order__products-titles-cell order__products-delete"></div>
</div>
</div>
<div class="order__products-elements">
{{foreach items as key,it}}
<div class="order__products-item {{$it.classname1}}">
<div class="order__products-item-content">
<div class="order__products-item-cell order__products-photo">
<a href="{{$it.url}}" class="order__products-item-img-block">
<img src="{{$it.pict}}" alt="{{$it.name}}" class="order__products-item-img">
</a>
</div>
<div class="order__products-item-cell order__products-name">
<h6 class="order__products-item-title">
<a href="{{$it.url}}" class="order__products-item-title-link">{{$it.name}}</a>
</h6>
</div>
<div class="order__products-item-inner-content">
<div class="order__products-item-cell order__products-price">
<div class="order__products-item-prices">
<div class="order__products-item-price order__products-item-price_new">{{$it.price}} ₽</div>
</div>
</div>
<div class="order__products-item-cell order__products-count {{$it.classname2}}">
<div class="order__products-item-counter-empty">Нет в наличии</div>
</div>
<div class="order__products-item-cell order__products-count {{$it.classname3}}">
<!-- (counter) -->
<div class="counter order__products-item-counter">
<input inputmode="numeric" type="text" name="counter_{{$it.id}}" value="{{$it.quantity}} {{$it.unit}}" class="counter__input" data-step="{{$it.MEASURE_STEP}}" data-count="" max="{{$it.amount}}" min="{{$it.MEASURE_STEP}}" data-unit="{{$it.unit}}">
<div class="counter__button counter__button_minus" data-button="minus"></div>
<div class="counter__button counter__button_plus" data-button="plus" {{$it.quantity|showDsb:it.amount,it.step}}></div>
</div>
<!-- End (counter) -->
</div>
<div class="order__products-item-cell order__products-sum">
<div class="order__products-item-sum-number">{{$it.price|priceQ:it.quantity}} ₽</div>
</div>
<div class="order__products-item-cell order__products-delete">
<a href="#" class="order__products-item-button-delete order-products__delete" data-id="{{$it.id}}"></a>
</div>
</div>
</div>
</div>
{{/foreach}}
</div>
</div>
</div>
<div class="order__form">
<div class="order__form-section">
<h4 class="order__form-title">Адрес доставки</h4>
<div class="order__fields">
<div class="order__field-item order__field-item_big">
<!-- (field) -->
<div class="field">
<label>
<span class="field__name">Адрес доставки<span> *</span></span>
<span class="field__content">
<span class="field__clear"></span>
<input id="address" type="text" name="address" value="{{$address}}" placeholder="Укажите адрес" class="b-store b-address field__input field__element-clear" required="required">
</span>
</label>
</div>
<!-- End (field) -->
</div>
<div class="order__field-item order__field-item_small">
<!-- (field) -->
<div class="field">
<label>
<span class="field__name">Квартира/Офис<span> *</span></span>
<span class="field__content">
<span class="field__clear"></span>
<input type="text" name="flat" value="{{$flat}}" placeholder="Номер квартиры" class="b-store field__input field__element-clear" required="required">
</span>
</label>
</div>
<!-- End (field) -->
</div>
<div class="order__field-item order__field-item_small">
<!-- (field) -->
<div class="field">
<label>
<span class="field__name">Подъезд<span> *</span></span>
<span class="field__content">
<span class="field__clear"></span>
<input type="text" name="entrance" value="{{$entrance}}" placeholder="Номер подъезда" class="b-store field__input field__element-clear" required="required">
</span>
</label>
</div>
<!-- End (field) -->
</div>
<div class="order__field-item order__field-item_small">
<!-- (field) -->
<div class="field">
<label>
<span class="field__name">Домофон</span>
<span class="field__content">
<span class="field__clear"></span>
<input type="text" name="intercom" value="{{$intercom}}" placeholder="Код от домофона" class="b-store field__input field__element-clear">
</span>
</label>
</div>
<!-- End (field) -->
</div>
<div class="order__field-item order__field-item_big">
<!-- (field) -->
<div class="field">
<label>
<span class="field__name">Комментарий</span>
<span class="field__content">
<textarea name="comment" placeholder="Дополнительная информация для курьера" class="b-store field__textarea">{{$comment}}</textarea>
</span>
</label>
</div>
<!-- End (field) -->
</div>
</div>
<div class="order__form-sub-elements">
</div>
</div>
<div class="order__form-section">
<h4 class="order__form-title">Информация о получателе</h4>
<div class="order__fields">
<div class="order__field-item order__field-item_big">
<!-- (field) -->
<div class="field">
<label>
<span class="field__name">ФИО<span> *</span></span>
<span class="field__content">
<span class="field__clear"></span>
<input type="text" name="name" value="{{$name}}" placeholder="Укажите ваше ФИО" class="b-store field__input field__element-clear" required="required">
</span>
</label>
</div>
<!-- End (field) -->
</div>
<div class="order__field-item order__field-item_middle">
<!-- (field) -->
<div class="field">
<label>
<span class="field__name">Номер телефона<span> *</span></span>
<span class="field__content">
<span class="field__clear"></span>
<input min="11" max="12" type="tel" name="phone" value="{{$phone}}" placeholder="Укажите ваш номер телефона" class="b-store field__input field__element-clear" required="required" id="phone_2">
</span>
</label>
</div>
<!-- End (field) -->
</div>
<div class="order__field-item order__field-item_middle">
<!-- (field) -->
<div class="field">
<label>
<span class="field__name">Электронная почта<span> *</span></span>
<span class="field__content">
<span class="field__clear"></span>
<input type="email" name="email" value="{{$email}}" placeholder="Укажите ваш e-mail" class="b-store field__input field__element-clear" required="required">
</span>
</label>
</div>
<!-- End (field) -->
</div>
</div>
</div>
<div class="order__form-section">
<h4 class="order__form-title">Способ оплаты</h4>
<div class="order__variables">
<div class="order__variable-item">
<!-- (switcher) -->
<label class="switcher order__variable-switcher">
<input type="radio" name="PAY_SYSTEM_ID" value="2" class="switcher__input order__variable-switcher-input" checked>
<span class="switcher__content order__variable-switcher-content">
<span class="switcher__marker order__variable-switcher-marker">
<svg class="switcher__icon-check">
<use xlink:href="/local/templates/megamart/images/icons.svg#icon-check"></use>
</svg>
</span>
<span class="switcher__text order__variable-switcher-text">Банковская карта</span>
</span>
</label>
<!-- End (switcher) -->
</div>
</div>
</div>
<div class="order__form-button-block">
{{if total_min }}
{{showWeightBlocked weight}}
{{else}}
<button type="submit" name="submit" class="btn order__submit order__submit_form" disabled="disabled">Перейти к оплате</button>
<div class="cart-warning">Минимальная сумма заказа - 500 рублей.</div>
{{/if}}
На Вашей банковской карте будет <strong>временно списана сумма 1р</strong>.
Итоговая стоимость покупки будет окончательно списана с карты после финальной сборки заказа в магазине и (при необходимости) согласованием с Вами позиций к замене.
Одновременно первоначально заблокированная сумма возвращается на Вашу карту.<br>Нажимая «Перейти к оплате», вы соглашаетесь <a href="/docs/user_agreement.php">с условиями использования</a>. <br>С подробными условиями доставки можно ознакомиться на странице <a href="/info/">о доставке</a> </div>
</div>
</div>
<div class="order__side-bar">
<div class="order__dop-info" id="order-bar">
<div class="order__dop-info-content">
<h4 class="order__dop-info-title">Ваш заказ</h4>
<div class="order__form-promo">
<input type="text" name="promo" value="" placeholder="Введите промокод" class="order__form-promo-input">
<button type="button" class="order__form-promo-button">
<svg class="order__form-promo-button-icon">
<use xlink:href="/local/templates/megamart/images/icons.svg#icon-cursor"></use>
</svg>
</button>
</div>
<div class="order__dop-info-list">
<div class="order__dop-info-item">
<div class="order__dop-info-item-content {{if !total_min }}cart-warning{{/if}}">
<div class="order__dop-info-name">Сумма заказа</div>
<div class="order__dop-info-value">{{$total}} ₽.</div>
</div>
</div>
<div class="order__dop-info-item">
<div class="order__dop-info-item-content">
<div class="order__dop-info-name">Вес</div>
<div class="order__dop-info-value">{{$weight|showWeight}} кг.</div>
</div>
</div>
<div class="order__dop-info-item">
<div class="order__dop-info-item-content">
<div class="order__dop-info-name">Доставка</div>
<div class="order__dop-info-value">{{$delivery}} ₽.</div>
</div>
</div>
<div class="order__dop-info-item g-hidden">
<div class="order__dop-info-item-content">
<div class="order__dop-info-name">Скидка</div>
<div class="order__dop-info-value order__dop-info-value_sale">-{sale} ₽.</div>
</div>
</div>
<div class="order__dop-info-item order__dop-info-item_big">
<div class="order__dop-info-item-content">
<div class="order__dop-info-name">Итого:</div>
<div class="order__dop-info-value">{{$total|addDelivery:delivery}} ₽</div>
</div>
</div>
</div>
</div>
{{if !total_min }}
<button type="submit" name="submit" class="btn order__submit order-content__submit" disabled="disabled">Перейти к оплате</button>
<br/>
<div class="cart-warning">Минимальная сумма заказа - 500 рублей.</div>
{{else}}
{{showWeightBlocked weight}}
{{/if}}
<br/>
<!-- End (btn) -->
<p class="order-content__ahtung order-content__ahtung_column">На Вашей банковской карте будет <strong>временно списана сумма 1р</strong>.
Итоговая стоимость покупки будет окончательно списана с карты после финальной сборки заказа в магазине и (при необходимости) согласованием с Вами позиций к замене.
Одновременно первоначально заблокированная сумма возвращается на Вашу карту.<br/>Нажимая «Перейти к оплате», вы соглашаетесь <a href="/docs/user_agreement.php">с условиями использования</a>. <br>С подробными условиями доставки можно ознакомиться на странице <a href="/info/">о доставке</a></p>
</div>
{{/if}}
</div>
</div>
</section>
<!-- End (order) -->
</form>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment