Merhaba arkadaşlar firmama lazım diye sürekli uğraşıyordum word şablonlarından sıkıldım ve ortaya böyle bir şey çıkardım.
test için :
DEMO
indirmek için :
Download Not : açık kaynak herhangi bir yerine isim vs. yazmadım dilediğiniz gibi geliştirip kullanabilirsiniz.
Alıntı
Kullanıcı Arayüzü Tasarımı: Modern ve duyarlı bir tasarım için TailwindCSS kullanıldı.
Dinamik Öğeler: Kullanıcılar ürün/hizmet öğelerini ekleyebilir, kaldırabilir ve düzenleyebilir.
Gerçek Zamanlı Hesaplamalar: Ara Toplam, KDV ve Genel Toplam anında hesaplanır.
Para Birimi Desteği: Doğru biçimlendirme ile TRY, USD ve EUR'yu destekler.
Kalıcılık: Veriler LocalStorage'a kaydedilir ve sayfa yüklendiğinde geri yüklenir.
Dışa Aktarma: Kullanıcılar teklifi JSON dosyası olarak dışa aktarabilir.
Yazdırma/PDF: Temiz PDF'ler oluşturmak için optimize edilmiş yazdırma stilleri.
Doğrulama Adımları
1. Görsel İnceleme
Tarayıcınızda
index.html dosyasını açın.
1. Tasarım:
Yeni modern tasarımla (geçişler, gölgeler) düzenin profesyonel ve duyarlı görünüp görünmediğini kontrol edin.
"Fiyat Teklifi" başlığının ve şirket/müşteri bölümlerinin görünür olduğundan emin olun.
"Teklif Notu / Açıklama" alanının mevcut olduğundan emin olun.
2. Fonksiyonel Testler
Ürün Ekle: "Yeni Satır Ekle"ye tıklayın ve yeni bir satırın göründüğünden emin olun.
Ürünü Düzenle: Miktarı ve fiyatı değiştirin. "Toplam" sütununun güncellendiğinden emin olun.
Ürünü Kaldır: Çöp kutusu simgesine tıklayın (bir satırın üzerine gelin) ve satırın kaldırıldığından emin olun.
Para Birimi: Açılır menüden para birimini değiştirin. Toplamlardaki para birimi sembolünün değiştiğini doğrulayın.
Vergi Oranı: KDV oranını değiştirin. Vergi Tutarı ve Genel Toplamın güncellendiğini doğrulayın.
Teklif Notu: "Teklif Notu / Açıklama" alanına metin girin.
3. Kalıcılık ve Dışa Aktarma
Kaydet: Not dahil bazı verileri doldurun ve "Kaydet"e tıklayın. Sayfayı yenileyin. Veriler kalıcı olmalıdır.
Dışa Aktar: "JSON İndir"e tıklayın. Not da dahil olmak üzere teklif verilerini içeren bir JSON dosyası indirilecektir.
Yazdır: "Yazdır"a tıklayın. Tarayıcının yazdırma iletişim kutusu, temiz ve yazıcı dostu bir düzenle açılacaktır.