JavaScript для бизнес логики

Реализованный пример

Порой пользователю на сайте необходимо рассчитать стоимость какой-либо услуги. На помощь разработчику сайта, для того, чтобы удовлетворить желание посетителя приходит JavaScript.
Здесь разберем момент расчета стоимости услуги на примере кружка робототехники.

[html]

<form role=»form» action=» method=’POST’ >

<div>Направление</div>

<select onchange = «sayMya();» name=»direction» class=»nameOrg» data-tilda-req=»1″ style=»color:#000000; border:3px solid #59c0df; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px;»>
<option value=»Робототехника» selected=»selected»>Робототехника</option>
<option value=»Шахматы8″ >Шахматы 8 занятий</option>
<option value=»Шахматы4″ >Шахматы 4 занятия</option>
</select>

<div> Площадка</div>

<select name=»place» onchange = «sayMya();» class=»Place» data-tilda-req=»1″ style=»color:#000000; border:3px solid #59c0df; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px;»>
<option value=»Беловежская» selected=»selected»>Беловежская</option>
<option value=»Строгино» >Строгино</option>
<option value=»Жулебино» >Жулебино</option>
<option value=»Свиблово» >Свиблово</option>
<option value=»Звенигород» >Звенигород</option>
<option value=»Можайск» >Можайск</option>
</select>

<div>Количество оплачиваемых месяцев (скидки при оплате нескольких месяцев сразу)</div>

<select onchange = «sayMya();» name=»nummonth» class=»Price» data-tilda-req=»1″ style=»color:#000000; border:3px solid #59c0df; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px;»>
<option value=»Одно занятие» >Одно занятие</option>
<option value=»1″ >1 месяц</option>
<option value=»2″ >2 месяца</option>
<option value=»3 — 10% скидка» selected=»selected»>3 месяца — 10% скидка</option>
<option value=»4 — 10% скидка» >4 месяца — 10% скидка</option>
<option value=»5 — 10% скидка» >5 месяцев — 10% скидка</option>
</select>

<div> Сумма оплаты</div>

<input onchange=»changeSum();» type=»text» name=»amountpay» class=»t-input js-tilda-rule newSum» value=»» placeholder=»3000″ data-tilda-req=»1″ style=»color:#000000; border:3px solid #59c0df; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px;»>
</form>

[/html]

[javascript]
// При загрузке страницы инициализируем окно суммы
window.onload = function(){
var newSum = undefined;
sayMya(newSum);
}
// Главная функция («СкажиМяу»)
function sayMya(newSum)
{
cursorPrice = $(‘.Price :selected’).val(); // Получает значение из селектора с классом Price
cursorOrg = $(‘.nameOrg :selected’).val();// Получает значение из селектора с классом nameOrg
cursorPlace = $(‘.Place :selected’).val(); // Получает значение из селектора с классом Place

var isMonth = false; // булева переменная, определяет выбрал пользователь оплату по месяцам или по дням
var discount = 1; // Расчет скидки (0..1)
var months = 1; // Кол-во оплаченных месяцев
var price = 1000; // Цена за курс

// Смотрим данные селектора с классом Price и определяем скидку и параметр isMonth
switch(cursorPrice)
{
case (‘Одно занятие’) :
isMonth = false;
discount = 1;
break;

case (‘1’):
case (‘2’):
isMonth = true;
discount = 1;
break;

case (‘3 — 10% скидка’) :
case (‘4 — 10% скидка’) :
case (‘5 — 10% скидка’) :
isMonth = true;
discount = 0.9;
break;

default :
break;
}

// Смотрим данные селектора с классом Price и кол-во месяцев (только месяцев!!!)
switch(cursorPrice)
{
case (‘1’) : months = 1; break;
case (‘2’) : months = 2; break;
case (‘3 — 10% скидка’) : months = 3; break;
case (‘4 — 10% скидка’) : months = 4; break;
case (‘5 — 10% скидка’) : months = 5; break;
}
// Смотрим данные селектора с классом Place и определяем цену за месяц/день
// в зависимости от локации индивида
switch(cursorPlace)
{
case (‘Беловежская’) :
switch(cursorOrg)
{
case (‘Робототехника’) : price = isMonth ? 3000 : 1000; break;
case (‘Шахматы8’) : price = isMonth ? 3200 : 700; break;
case (‘Шахматы4’) : price = isMonth ? 2000 : 700; break;
default : break;
}
break;
case (‘Строгино’) :
switch(cursorOrg)
{
case (‘Робототехника’) : price = isMonth ? 3000 : 1000; break;
case (‘Шахматы8’) : price = 0; break;
case (‘Шахматы4’) : price = 0; break;
default : break;
}
break;
case (‘Свиблово’) :
switch(cursorOrg)
{
case (‘Робототехника’) : price = isMonth ? 3000 : 1000; break;
case (‘Шахматы8’) : price = 0; break;
case (‘Шахматы4’) : price = 0; break;
default : break;
}
break;
case (‘Жулебино’) :
switch(cursorOrg)
{
case (‘Робототехника’) : price = isMonth ? 3000 : 1000; break;
case (‘Шахматы8’) : price = 0; break;
case (‘Шахматы4’) : price = 0; break;
default : break;
}
break;

case (‘Звенигород’) :
switch(cursorOrg)
{
case (‘Робототехника’) : price = isMonth ? 3000 : 1000; break;
case (‘Шахматы8’) : price = isMonth ? 3200 : 700; break;
case (‘Шахматы4’) : price = isMonth ? 2000 : 700; break;
default : break;
}
break;
case (‘Можайск’) :
switch(cursorOrg)
{
case (‘Робототехника’) : price = isMonth ? 2500 : 850; break;
case (‘Шахматы8’) : price = 0; break;
case (‘Шахматы4’) : price = 0; break;
default : break;
}
break;
default : break;
}
// Расчитываем сумму (если параметром newSum не передается значение), если передается — count = newSum
var count = newSum === undefined ? price * months * discount : newSum;

// Создаем переменную согласно требований Тильды
var value = ‘#order:’ + cursorOrg + ‘,’ + cursorPlace + ‘,’ + cursorPrice + ‘=’ + count;

// Полученное значение вставляем в качестве ссылки
//document.getElementById(‘abc’).href = value;

// Сумму исходя из бизнес-логики вставляем в поле «Сумма к оплате»
document.getElementsByName(‘amountpay’)[0].value = count;
}

// Функция, выполняющаяся при изменении значения в поле «Сумма к оплате»
function changeSum(){
var url = document.getElementById(‘abc’).href;
var newSum = document.getElementsByName(‘amountpay’)[0].value;
sayMya(newSum);
// alert(newSum);
}
[/javascript]

Добавить комментарий