|
Здравейте, написах си един код, който в последствие измених с помощ от chatgpt, но все нещо се обърква накрая.
| CODE | <!DOCTYPE html>
<html lang="bg">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Генератор на документ</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/docxtemplater/3.49.0/docxtemplater.min.js"></script>
<script src="https://unpkg.com/pizzip@3.1.7/dist/pizzip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js"></script>
<style>
.form-container {
max-width: 800px;
margin: 20px auto;
}
#offerFields, #tenPercentFields, #remainingFields {
display: none;
}
</style>
</head>
<body>
<div class="container form-container">
<div class="card">
<div class="card-header">
Данни от лична карта на клиента
</div>
<div class="card-body">
<form id="dataForm">
<!-- Полета за данни от лична карта на клиента -->
<div class="form-group">
<label for="date">Дата на подписване на депозита</label>
<input type="date" class="form-control" id="date" name="date" required>
</div>
<div class="form-group">
<label for="three_names">Три имена</label>
<input type="text" class="form-control" id="three_names" name="three_names" required>
</div>
<div class="form-group">
<label for="egn">ЕГН</label>
<input type="text" class="form-control" id="egn" name="egn" required>
</div>
<div class="form-group">
<label for="lk_number">Номер на лична карта</label>
<input type="text" class="form-control" id="lk_number" name="lk_number" required>
</div>
<div class="form-group">
<label for="date_card">Дата на издаване на личната карта</label>
<input type="date" class="form-control" id="date_card" name="date_card" required>
</div>
<div class="form-group">
<label for="mvr_card">От къде е издадена личната карта</label>
<input type="text" class="form-control" id="mvr_card" name="mvr_card" required>
</div>
<div class="form-group">
<label for="address">Адрес по лична карта</label>
<input type="text" class="form-control" id="address" name="address" required>
</div>
<!-- Полета за депозита -->
<div class="form-group">
<label for="sum">Колко пари оставя клиента?</label>
<input type="number" class="form-control" id="sum" name="sum" required>
</div>
<div class="form-group">
<label for="sum_in_letters">Сумата словом</label>
<input type="text" class="form-control" id="sum_in_letters" name="sum_in_letters" placeholder="Изпишете сумата словом" required>
</div>
<div class="form-group">
<label for="property_description">Описание на имота</label>
<input type="text" class="form-control" id="property_description" name="property_description" required>
</div>
<div class="form-group">
<label for="payment_method">Метод на плащане</label>
<select class="form-control" id="payment_method" name="payment_method" required>
<option value="bank">По банков път</option>
<option value="office">В офиса</option>
</select>
</div>
<!-- Полета за изчисления -->
<div class="form-group">
<label for="end_date_pd">Краен срок за предварителен договор</label>
<input type="date" class="form-control" id="end_date_pd" name="end_date_pd" required>
</div>
<div class="form-group">
<label for="prodajna_cena">Офертна цена на имота в евро</label>
<input type="number" class="form-control" id="prodajna_cena" name="prodajna_cena" required>
</div>
<div class="form-group">
<label for="prodajna_cena_letters">Офертна цена словом</label>
<input type="text" class="form-control" id="prodajna_cena_letters" name="prodajna_cena_letters" placeholder="Изпишете сумата словом">
</div>
<div class="form-group">
<label for="predlojenie_za_cena">Предложение за цена</label>
<select class="form-control" id="predlojenie_za_cena" name="predlojenie_za_cena" required>
<option value="">Избери</option>
<option value="offer">Купувачът предлага цена</option>
<option value="no_offer">Купувачът НЕ предлага цена</option>
</select>
</div>
<!-- Полета за допълнителни опции -->
<div class="form-group">
<label for="additional_option">Допълнителна опция</label>
<select class="form-control" id="additional_option" name="additional_option">
<option value="">Избери</option>
<option value="if_no_accept">Ако офертата не бъде приета</option>
<option value="direct_deal">Влизане директно в сделка</option>
</select>
</div>
<!-- Поле за крайна дата на нотариално изповядване -->
<div class="form-group">
<label for="notary_date">Крайна дата на нотариално изповядване</label>
<input type="date" class="form-control" id="notary_date" name="notary_date">
</div>
<!-- Полета за допълнителни изчисления -->
<div id="offerFields">
<div class="form-group">
<label for="sum_predlojenie">Предложена цена в евро</label>
<input type="number" class="form-control" id="sum_predlojenie" name="sum_predlojenie">
</div>
<div class="form-group">
<label for="sum_predlojenie_letters">Предложена цена словом</label>
<input type="text" class="form-control" id="sum_predlojenie_letters" name="sum_predlojenie_letters" placeholder="Изпишете сумата словом">
</div>
<div class="form-group">
<label for="sum_predlojenie_in_lv">Левова равностойност</label>
<input type="text" class="form-control" id="sum_predlojenie_in_lv" name="sum_predlojenie_in_lv" readonly>
</div>
<div class="form-group">
<label for="sum_predlojenie_in_lv_letters">Левова равностойност словом</label>
<input type="text" class="form-control" id="sum_predlojenie_in_lv_letters" name="sum_predlojenie_in_lv_letters">
</div>
</div>
<!-- Полета за 10% -->
<div id="tenPercentFields">
<div class="form-group">
<label for="ten_procent">10% от предложената цена</label>
<input type="text" class="form-control" id="ten_procent" name="ten_procent" readonly>
</div>
<div class="form-group">
<label for="ten_procent_letters">10% от предложената цена словом</label>
<input type="text" class="form-control" id="ten_procent_letters" name="ten_procent_letters" placeholder="Изпишете 10% словом">
</div>
<div class="form-group">
<label for="ten_procent_in_leva">10% от предложената цена в левове</label>
<input type="text" class="form-control" id="ten_procent_in_leva" name="ten_procent_in_leva" readonly>
</div>
<div class="form-group">
<label for="ten_procent_in_leva_letters">10% от предложената цена в левове словом</label>
<input type="text" class="form-control" id="ten_procent_in_leva_letters" name="ten_procent_in_leva_letters">
</div>
</div>
<!-- Полета за остатъчната сума -->
<div id="remainingFields">
<div class="form-group">
<label for="ostanala_suma">Остатъчна сума</label>
<input type="text" class="form-control" id="ostanala_suma" name="ostanala_suma" readonly>
</div>
<div class="form-group">
<label for="ostanala_suma_letters">Остатъчна сума словом</label>
<input type="text" class="form-control" id="ostanala_suma_letters" name="ostanala_suma_letters" placeholder="Изпишете остатъчната сума словом">
</div>
<div class="form-group">
<label for="ostanala_suma_in_leva">Остатъчна сума в левове</label>
<input type="text" class="form-control" id="ostanala_suma_in_leva" name="ostanala_suma_in_leva" readonly>
</div>
<div class="form-group">
<label for="ostanala_suma_in_leva_letters">Остатъчна сума в левове словом</label>
<input type="text" class="form-control" id="ostanala_suma_in_leva_letters" name="ostanala_suma_in_leva_letters">
</div>
</div>
<button type="submit" class="btn btn-primary">Генерирай документ</button>
</form>
</div>
</div>
</div>
<script>
document.getElementById('dataForm').addEventListener('submit', function(event) {
event.preventDefault();
var formData = new FormData(this);
var data = {};
formData.forEach((value, key) => { data[key] = value });
// Форматиране на датата
function formatDate(dateString) {
var date = new Date(dateString);
var day = ("0" + date.getDate()).slice(-2);
var month = ("0" + (date.getMonth() + 1)).slice(-2);
var year = date.getFullYear();
return day + "." + month + "." + year;
}
// Присвояване на форматирани дати
data.date = formatDate(data.date);
data.date_card = formatDate(data.date_card);
data.end_date_pd = formatDate(data.end_date_pd);
data.notary_date = formatDate(data.notary_date);
// Определяне на текста за payment_method
var paymentMethod = document.getElementById('payment_method').value;
if (paymentMethod === 'bank') {
data.payment_method = 'се превежда по банковата сметка "НЕКСТИМО" ЕООД, а именно: BG11BPBI 7942 102 640 820 1 "Юробанк България" АД';
} else if (paymentMethod === 'office') {
data.payment_method = 'се оставят на отговорно съхранение в офиса на "НЕКСТИМО" ЕООД, находящ се в гр. Пловдив, бул. "Дунав" №68';
}
// Логика за обработка на предложената цена
var predlojenieZaCena = document.getElementById('predlojenie_za_cena').value;
if (predlojenieZaCena === 'offer') {
var sumPredlojenie = parseFloat(document.getElementById('sum_predlojenie').value);
var sumPredlojenieInLv = (sumPredlojenie * 1.95583).toFixed(2);
var sumPredlojenieInLvLetters = document.getElementById('sum_predlojenie_in_lv_letters').value;
var tenProcent = (sumPredlojenie * 0.10).toFixed(2);
var tenProcentInLeva = (tenProcent * 1.95583).toFixed(2);
var tenProcentLetters = document.getElementById('ten_procent_letters').value;
var tenProcentInLevaLetters = document.getElementById('ten_procent_in_leva_letters').value;
var ostanalaSuma = (sumPredlojenie - tenProcent).toFixed(2);
var ostanalaSumaInLeva = (ostanalaSuma * 1.95583).toFixed(2);
var ostanalaSumaLetters = document.getElementById('ostanala_suma_letters').value;
var ostanalaSumaInLevaLetters = document.getElementById('ostanala_suma_in_leva_letters').value;
data.predlojenie_za_cena = `предлага цена за закупуване на гореописания имот в размер на €${sumPredlojenie} /${document.getElementById('sum_predlojenie_letters').value}/, или левовата равностойност по фиксинга на БНБ ${sumPredlojenieInLv}лв. /${sumPredlojenieInLvLetters} лева/. Ако тази цена бъде приета се преминава`;
data.sum_predlojenie = sumPredlojenie;
data.sum_predlojenie_in_lv = sumPredlojenieInLv;
data.sum_predlojenie_in_lv_letters = sumPredlojenieInLvLetters;
data.ten_procent = tenProcent;
data.ten_procent_letters = tenProcentLetters;
data.ten_procent_in_leva = tenProcentInLeva;
data.ten_procent_in_leva_letters = tenProcentInLevaLetters;
data.ostanala_suma = ostanalaSuma;
data.ostanala_suma_letters = ostanalaSumaLetters;
data.ostanala_suma_in_leva = ostanalaSumaInLeva;
data.ostanala_suma_in_leva_letters = ostanalaSumaInLevaLetters;
} else if (predlojenieZaCena === 'no_offer') {
data.predlojenie_za_cena = 'Купувачът не предлага цена.';
}
// Обработка на допълнителната опция
var additionalOption = document.getElementById('additional_option').value;
if (additionalOption === 'if_no_accept') {
data.if_no_accept = 'Ако офертата не бъде приета, депозитът се възстановява на КУПУВАЧА.';
} else if (additionalOption === 'direct_deal') {
data.if_no_accept = ''; // Оставя празно поле
}
// Зареждане на шаблона и генериране на документа
fetch('template.docx')
.then(response => response.arrayBuffer())
.then(templateData => {
var zip = new PizZip(templateData);
var doc = new window.docxtemplater(zip);
doc.setData(data);
try {
doc.render();
} catch (error) {
console.error('Error rendering template:', error);
}
var out = doc.getZip().generate({ type: "blob" });
saveAs(out, "document.docx");
})
.catch(error => console.error('Error fetching template:', error));
});
// Добавяме функцията за актуализация на изчисленията в реално време
function updateCalculations() {
var sumPredlojenie = parseFloat(document.getElementById('sum_predlojenie').value) || 0;
var sumPredlojenieInLv = (sumPredlojenie * 1.95583).toFixed(2);
var tenProcent = (sumPredlojenie * 0.10).toFixed(2);
var tenProcentInLeva = (tenProcent * 1.95583).toFixed(2);
var ostanalaSuma = (sumPredlojenie - tenProcent).toFixed(2);
var ostanalaSumaInLeva = (ostanalaSuma * 1.95583).toFixed(2);
document.getElementById('sum_predlojenie_in_lv').value = sumPredlojenieInLv;
document.getElementById('ten_procent').value = tenProcent;
document.getElementById('ten_procent_in_leva').value = tenProcentInLeva;
document.getElementById('ostanala_suma').value = ostanalaSuma;
document.getElementById('ostanala_suma_in_leva').value = ostanalaSumaInLeva;
}
// Добавяме слушатели за промяна на полетата
document.getElementById('sum_predlojenie').addEventListener('input', updateCalculations);
document.getElementById('predlojenie_za_cena').addEventListener('change', function() {
var value = this.value;
document.getElementById('offerFields').style.display = value === 'offer' ? 'block' : 'none';
document.getElementById('tenPercentFields').style.display = value === 'offer' ? 'block' : 'none';
document.getElementById('remainingFields').style.display = value === 'offer' ? 'block' : 'none';
updateCalculations();
});
</script>
</body>
</html> |
Когато избирам менюто "Купувачът НЕ предлага цена", трябва да изпише текста "преминава"
В този случай ще се появят допълнителни 4 допълнителни input-а
Първия input ще е некоригиращ се и автоматично ще изчислява на принципа на умножение {prodajna_cena} x 10%, това изчисление вече го прави кода и е кръстено {ten_procent}
Под този input трябва да има input text в който да мога да въведа словом резултата от изчислението, което е кръстено {ten_procent_letters}, под тях ще се появи
input, който не мога да коригирам, той изчислява на принципна на умножение {ten_procent} x 1,95583. Резултата е кръстен {ten_procent_in_leva}, а под него искам да имам input text в който да въвеждам словом резултата. Кръстено е {ten_procent_in_leva_letters}
под него ще се появят още четири input-a
първият е input, който не мога да коригирам и се казва {ostanala_suma}, той изчислява на принципа събиране и изваждане следното:
{ostanala_suma} минус {ten_procent}.
Под него искам да имам input text, в който да въвеждам словом резултата.
Под тях трябва да имам input, който не мога да коригирам и в него се изчислява на принципа умножение следното:
{ostanala_suma_in_leva} x 1,95583
под него искам да имам input text в който да мога да въвеждам резултата словом, който input кръстихме {ostanala_suma_in_leva_letters}
Изчисленията трябва да са видими в реално време.
Може ли да ми помогнете да го довърша?
|
Къде бъркам?, docxtemplater
Помощ 
Търсене 
Потребители 
Календар 
Правила
