dataTable.bootstrapTable({
    url:'datatable/pasien',
    showColumns: true,
    showColumnsToggleAll: true,
    showRefresh: true,
    sortable: true,
    search: true,
    searchOnEnterKey: false,
    searchHighlight: false,
    pagination: true,
    pageSize: 10,
    pageList: [25, 50, 100, 200],
    cookie: true,
    icons: {
        refresh: "fas fa-sync",
        columns: "fas fa-th-list",
    },
    columns: [
        {
            title: "Name",
            field: "name",
            sortable: true,
        },
        {
            title: "Tanggal Lahir",
            field: "birth", // tetap ambil dari field birth
            sortable: true,
            formatter: function(value, row, index) {
                if (!value) return '-';

                const birthDate = new Date(value);
                const today = new Date();
                let age = today.getFullYear() - birthDate.getFullYear();
                const m = today.getMonth() - birthDate.getMonth();

                if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {
                    age--; // kalau bulan & tanggal belum lewat, umur dikurangi 1
                }
                return row?.birth +' <strong>('+ age +' Tahun)</strong>';
            }
        },

        {
            title: "Jenis Kelamin",
            field: "gender",
            sortable: true,
        },
        {
            title: "Action",
            field: "uid",
            sortable: true,
            formatter: (value, row) => {
                let buttons = "";
                buttons += `
                    <button class="btn btn-datatable btn-icon btn-primary my-auto" onclick="editData(this)" data-uid="${row.uid}" data-name="${row.name}" data-gender="${row.gender}" data-birth="${row.birth}" data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Edit">
                        <i class="far fa-edit fa-fw"></i>
                    </button>
                `
                buttons += `
                    <button class="btn btn-datatable btn-icon btn-danger ml-2" onclick="deleteData('${row?.uid}', '${row?.name}')" data-bs-toggle="tooltip" data-bs-placement="top" data-bs-title="Delete">
                        <i class="far fa-trash-can fa-fw"></i>
                    </button>
                `
                return `
                <div class="d-flex space-x">
                    ${buttons}
                </div>
            `;
            },
        },
    ],
});