vcomjs/README.md

Vericom AppJs

# VCom UI Utilities

VCom UI Utilities; jQuery tabanlı, kullanıcı arayüzünü kolayca yönetebilmenizi sağlayan bir yardımcı fonksiyonlar setidir. Croppie, Toastify, SweetAlert ve BlockUI gibi 3rd-party kütüphanelerle entegre çalışır. Projede; form temizleme, AJAX işlemleri, toast bildirimleri, modal yönetimi ve görsel kırpma gibi birçok işlevsellik bulunmaktadır.

## 📦 Kurulum

```bash
npm install vcomjs
```
Ya da statik dosyalarla çalışıyorsanız gerekli script ve link etiketlerini HTML dosyanıza ekleyebilirsiniz.



## 📦 Kullanılan Kütüphaneler

- [jQuery](https://jquery.com/)
- [jquery-blockui](http://malsup.com/jquery/block/)
- [Toastify JS](https://github.com/apvarun/toastify-js)
- [Croppie](https://foliotek.github.io/Croppie/)
- Bootstrap Modal (resim kesme işlemi için)

## 🚀 Genel Fonksiyonlar
🧊 1. Block UI

```js
BlockStart();  // Yükleme başlatılır
BlockStop();   // Yükleme durdurulur
```

## 🔔 2. Toast Bildirimleri

```js
ToastOpen("bg-success", "İşlem başarılı", "Başlık");
AddNotif("Uyarı mesajı");
```

## 🧼 3. Form Yardımcıları

```js
ClearForm("#myForm");             // Form içeriğini temizler
GetFormDataAsJSON("#myForm");     // Form verisini JSON objesi olarak döner
```

## 🪟 4. Modal İşlemleri
(Tailwind CSS ile uyumludur)


```js
OpenModal("#myModal");
CloseModal("#myModal");
```

## 🔄 5. Dinamik İçerik Yükleme
Loading:

```js

    var data = GetFormDataAsJSON($('#formId'));
    data.parametre = a;
    var url = '/home/partial';
    var target = '#divId';
    DivLoad(target, data, url).then(res => {
        if (res === "Success") {
            // Yükleme sonrası işlemler
        }
    });
```


loader yok:

```js

    var data = GetFormDataAsJSON($('#formId'));
    data.parametre = a;
    var url = '/home/partial';
    var target = '#divId';
    DivNoLoading(target, data, url).then(data => {
        if (data === "Success") {
            // Yükleme sonrası işlemler
        }
    });
```

## 📨 6. Veri Ekleme / Gönderme

```js

    var Object = GetFormDataAsJSON($('#formId'));
    AppAdd(Object, "/SaveData").then((data) => {
        if (data.status == "Success") {
            // İşlem başarılıysa yapılacaklar
        }
    });
```


## 📤 7. Dosya Yükleme

```js
var formData = new FormData();
formData.append("file", $('#fileInput')[0].files[0]);
AddCollection(formData, "/UploadFile").then((data) => {
        if (data.status == "Success") {
            // İşlem başarılıysa yapılacaklar
        }
 });
```


## ✅ 8. Onaylı İşlemler (SweetAlert ile)

```js
AppConfirm({ id: 123 }, "/DeleteItem", "Silinecek", "Emin misiniz?")
  .then(data => {
    if (data === "Success") {
        // Silme başarılı
    }
});
```

## 🖼️ 9. Görsel Kırpma (Croppie)
📌 Kaydederek kırp:

```js
ImageCrop("#cropperId", "#modalId");
```

👁️ Sadece önizleme:

```js
ImageCropDontSave("#cropperId", "#modalId");
```

Not: #Attachment ID'sine sahip bir input tetikleyici olarak kullanılmalıdır. Croppie ayarları içerisinde viewport boyutları ve kesme alanı tanımlanmalıdır.

## 💡 Ekstra Bilgi
SaveImg() fonksiyonu örneklerde yer almaz, resmi kaydetmek için ayrıca tanımlanmalıdır.

Tüm fonksiyonlar modüler yapıdadır; istenilen dosyadan import edilerek kullanılabilir.

## ✉️ İletişim
Her türlü soru, görüş ve katkı için proje geliştiricisiyle iletişime geçebilirsiniz.

## 📝 Lisans
MIT Lisansı