mdpasien add edit
This commit is contained in:
Sas Andy
@@ -98,78 +98,254 @@ templ CssMdPasien() {
|
||||
}
|
||||
|
||||
templ JsMdPasien() {
|
||||
<script>
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
console.log("Before Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
|
||||
});
|
||||
<script type="text/javascript">
|
||||
|
||||
window.addEventListener("DOMContentLoaded", () => {
|
||||
document.addEventListener('htmx:afterSwap', function(event) {
|
||||
// Reinitialize selectpicker after HTMX content swap
|
||||
$('.selectpicker').selectpicker('refresh');
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:beforeRequest', function(event) {
|
||||
console.log("Before Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
console.log("After Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheError', function(event) {
|
||||
console.log("Error History Cache Error")
|
||||
console.log(event.detail.cause)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheMissError', function(event) {
|
||||
console.log("Error History Cache Miss Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.path)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:oobErrorNoTarget', function(event) {
|
||||
console.log("Error OOB No Target")
|
||||
console.log(event.detail.content)
|
||||
});
|
||||
document.addEventListener('htmx:onLoadError', function(event) {
|
||||
console.log("Error On Load")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.target)
|
||||
console.log(event.detail.exception)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:responseError', function(event) {
|
||||
console.log("Error Response")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sendError', function(event) {
|
||||
console.log("Error Send Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sseError', function(event) {
|
||||
console.log("Error Sse ")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.error)
|
||||
console.log(event.detail.source)
|
||||
});
|
||||
document.addEventListener('htmx:swapError', function(event) {
|
||||
console.log("Error Swap Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target Swap: "+event.detail.target)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:targetError', function(event) {
|
||||
console.log("Error target")
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target ID: "+event.detail.target)
|
||||
});
|
||||
htmx.onLoad(function(content) {
|
||||
const dobElement = document.querySelectorAll("input[name='dob']");
|
||||
const dayElement = document.querySelectorAll("input[name='hari']");
|
||||
const monthElement = document.querySelectorAll("input[name='bulan']");
|
||||
const yearElement = document.querySelectorAll("input[name='tahun']");
|
||||
|
||||
for(var i = 0; i < dobElement.length; i++) {
|
||||
dobElement[i].addEventListener("change", (event) => {
|
||||
try {
|
||||
todate= new Date();
|
||||
|
||||
|
||||
var age= [], fromdate= new Date(event.target.value),
|
||||
y= [todate.getFullYear(), fromdate.getFullYear()],
|
||||
ydiff= y[0]-y[1],
|
||||
m= [todate.getMonth(), fromdate.getMonth()],
|
||||
mdiff= m[0]-m[1],
|
||||
d= [todate.getDate(), fromdate.getDate()],
|
||||
ddiff= d[0]-d[1];
|
||||
|
||||
if(mdiff < 0 || (mdiff=== 0 && ddiff<0))--ydiff;
|
||||
if(mdiff<0) mdiff+= 12;
|
||||
if(ddiff<0){
|
||||
fromdate.setMonth(m[1]+1, 0);
|
||||
ddiff= fromdate.getDate()-d[1]+d[0];
|
||||
--mdiff;
|
||||
}
|
||||
if(ydiff> 0) age.push(ydiff+ ' year'+(ydiff> 1? 's ':' '));
|
||||
if(mdiff> 0) age.push(mdiff+ ' month'+(mdiff> 1? 's':''));
|
||||
if(ddiff> 0) age.push(ddiff+ ' day'+(ddiff> 1? 's':''));
|
||||
if(age.length>1) age.splice(age.length-1,0,' and ');
|
||||
for (var t = 0; t < yearElement.length; ++t) {
|
||||
yearElement[t].value = ydiff;
|
||||
}
|
||||
for (var m = 0; m < monthElement.length; ++m) {
|
||||
monthElement[m].value = mdiff;
|
||||
|
||||
}
|
||||
for (var d = 0; d < dayElement.length; ++d) {
|
||||
dayElement[d].value = ddiff;
|
||||
|
||||
}
|
||||
|
||||
|
||||
// var tanggalLahir = event.target.value;
|
||||
// console.log("tgl lahir");
|
||||
// console.log(tanggalLahir);
|
||||
// const [ tahunLahir, bulanLahir, hariLahir] = tanggalLahir.split('-').map(Number);
|
||||
|
||||
// // Mendapatkan tanggal saat ini
|
||||
// const tanggalSekarang = new Date();
|
||||
// const tahunSekarang = tanggalSekarang.getFullYear();
|
||||
// const bulanSekarang = tanggalSekarang.getMonth() + 1; // getMonth() dimulai dari 0
|
||||
// const hariSekarang = tanggalSekarang.getDate();
|
||||
// console.log("Menghitung tahun, bulan, dan hari")
|
||||
|
||||
// // Menghitung tahun, bulan, dan hari
|
||||
// let tahunUmur = tahunSekarang - tahunLahir;
|
||||
// let bulanUmur = bulanSekarang - bulanLahir;
|
||||
// let hariUmur = hariSekarang - hariLahir;
|
||||
// console.log("bulanUmur < 0")
|
||||
|
||||
// // Jika bulan negatif, kurangi satu tahun dan tambah 12 bulan
|
||||
// if (bulanUmur < 0) {
|
||||
// tahunUmur--;
|
||||
// bulanUmur += 12;
|
||||
// }
|
||||
// console.log("hariUmur < 0")
|
||||
|
||||
// // Jika hari negatif, kurangi satu bulan dan tambahkan jumlah hari dari bulan sebelumnya
|
||||
// if (hariUmur < 0) {
|
||||
// bulanUmur--;
|
||||
|
||||
// // Mendapatkan jumlah hari dalam bulan sebelumnya
|
||||
// const bulanSebelumnya = bulanSekarang - 1 < 1 ? 12 : bulanSekarang - 1;
|
||||
// const tahunSebelumnya = bulanSebelumnya === 12 ? tahunSekarang - 1 : tahunSekarang;
|
||||
// hariUmur += new Date(tahunSebelumnya, bulanSebelumnya, 0).getDate();
|
||||
// }
|
||||
// console.log("sampai mau assign value")
|
||||
// for (var t = 0; t < yearElement.length; ++t) {
|
||||
// yearElement[t].value = tahunUmur;
|
||||
// }
|
||||
// for (var m = 0; m < monthElement.length; ++m) {
|
||||
// monthElement[m].value = bulanUmur;
|
||||
|
||||
// }
|
||||
// for (var d = 0; d < dayElement.length; ++d) {
|
||||
// dayElement[d].value = hariUmur;
|
||||
|
||||
// }
|
||||
// // yearElement[i].value = tahunUmur;
|
||||
// // monthElement[i].value = bulanUmur;
|
||||
// // dayElement[i].value = hariUmur;
|
||||
// console.log("tahunUmur "+ tahunUmur);
|
||||
// console.log("bukanUmur "+ bulanUmur);
|
||||
// console.log("hariUmur "+ hariUmur);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
|
||||
}
|
||||
}, false);
|
||||
}
|
||||
function tentukanTanggalLahir(umurTahun, umurBulan, umurHari) {
|
||||
// Memecah tanggal sekarang menjadi tahun, bulan, dan hari
|
||||
var tanggalSekarang = new Date().toISOString().slice(0, 10)
|
||||
console.log("tanggal sekarang");
|
||||
console.log(tanggalSekarang);
|
||||
const [tahunSekarang, bulanSekarang, hariSekarang] = tanggalSekarang.split('-').map(Number);
|
||||
|
||||
|
||||
// Mengurangi umur dari tanggal sekarang
|
||||
let tahunLahir = tahunSekarang - umurTahun;
|
||||
let bulanLahir = bulanSekarang - umurBulan;
|
||||
let hariLahir = hariSekarang - umurHari;
|
||||
|
||||
// Jika hari negatif, kurangi satu bulan dan tambahkan jumlah hari dari bulan sebelumnya
|
||||
if (hariLahir < 0) {
|
||||
bulanLahir--;
|
||||
|
||||
// Mendapatkan jumlah hari dalam bulan sebelumnya
|
||||
const bulanSebelumnya = bulanSekarang - 1 < 1 ? 12 : bulanSekarang - 1;
|
||||
const tahunSebelumnya = bulanSebelumnya === 12 ? tahunSekarang - 1 : tahunSekarang;
|
||||
hariLahir += new Date(tahunSebelumnya, bulanSebelumnya, 0).getDate();
|
||||
}
|
||||
|
||||
// Jika bulan negatif, kurangi satu tahun dan tambahkan 12 bulan
|
||||
if (bulanLahir < 0) {
|
||||
tahunLahir--;
|
||||
bulanLahir += 12;
|
||||
}
|
||||
|
||||
// Mengembalikan tanggal lahir dalam format YYYY-MM-DD
|
||||
return `${tahunLahir}-${String(bulanLahir).padStart(2, '0')}-${String(hariLahir).padStart(2, '0')}`;
|
||||
}
|
||||
|
||||
dayElement[0].addEventListener("change", (event) => {
|
||||
const tgll = tentukanTanggalLahir(yearElement[0].value, monthElement[0].value, dayElement[0].value);
|
||||
console.log(`Tanggal Lahir: ${tgll}`);
|
||||
dobElement[0].value = tgll
|
||||
});
|
||||
monthElement[0].addEventListener("change", (event) => {
|
||||
const tgll = tentukanTanggalLahir(yearElement[0].value, monthElement[0].value, dayElement[0].value);
|
||||
console.log(`Tanggal Lahir: ${tgll}`);
|
||||
dobElement[0].value = tgll
|
||||
|
||||
});
|
||||
yearElement[0].addEventListener("change", (event) => {
|
||||
const tgll = tentukanTanggalLahir(yearElement[0].value, monthElement[0].value, dayElement[0].value);
|
||||
console.log(`Tanggal Lahir: ${tgll}`);
|
||||
dobElement[0].value = tgll
|
||||
});
|
||||
dayElement[1].addEventListener("change", (event) => {
|
||||
const tgll = tentukanTanggalLahir(yearElement[1].value, monthElement[1].value, dayElement[1].value);
|
||||
console.log(`Tanggal Lahir: ${tgll}`);
|
||||
dobElement[1].value = tgll
|
||||
});
|
||||
monthElement[1].addEventListener("change", (event) => {
|
||||
const tgll = tentukanTanggalLahir(yearElement[1].value, monthElement[1].value, dayElement[1].value);
|
||||
console.log(`Tanggal Lahir: ${tgll}`);
|
||||
dobElement[1].value = tgll
|
||||
|
||||
});
|
||||
yearElement[1].addEventListener("change", (event) => {
|
||||
const tgll = tentukanTanggalLahir(yearElement[1].value, monthElement[1].value, dayElement[1].value);
|
||||
console.log(`Tanggal Lahir: ${tgll}`);
|
||||
dobElement[1].value = tgll
|
||||
});
|
||||
});
|
||||
|
||||
document.addEventListener('htmx:afterRequest', function(event) {
|
||||
console.log("After Request")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.target)
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheError', function(event) {
|
||||
console.log("Error History Cache Error")
|
||||
console.log(event.detail.cause)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:historyCacheMissError', function(event) {
|
||||
console.log("Error History Cache Miss Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.path)
|
||||
|
||||
});
|
||||
document.addEventListener('htmx:oobErrorNoTarget', function(event) {
|
||||
console.log("Error OOB No Target")
|
||||
console.log(event.detail.content)
|
||||
});
|
||||
document.addEventListener('htmx:onLoadError', function(event) {
|
||||
console.log("Error On Load")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.target)
|
||||
console.log(event.detail.exception)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:responseError', function(event) {
|
||||
console.log("Error Response")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sendError', function(event) {
|
||||
console.log("Error Send Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:sseError', function(event) {
|
||||
console.log("Error Sse ")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.error)
|
||||
console.log(event.detail.source)
|
||||
});
|
||||
document.addEventListener('htmx:swapError', function(event) {
|
||||
console.log("Error Swap Error")
|
||||
console.log(event.detail.xhr)
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target Swap: "+event.detail.target)
|
||||
console.log(event.detail.requestConfig)
|
||||
});
|
||||
document.addEventListener('htmx:targetError', function(event) {
|
||||
console.log("Error target")
|
||||
console.log(event.detail.elt)
|
||||
console.log("Target ID: "+event.detail.target)
|
||||
});
|
||||
</script>
|
||||
});
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
}
|
||||
|
||||
script BeforeRequestContent() {
|
||||
|
||||
File diff suppressed because one or more lines are too long
585
views/dev/mdpasien/mdpasienformmodal.templ
Normal file
585
views/dev/mdpasien/mdpasienformmodal.templ
Normal file
@@ -0,0 +1,585 @@
|
||||
package dev_mdpasienview
|
||||
|
||||
import "cpone/models"
|
||||
import "cpone/component/modal"
|
||||
import "cpone/component/customdatepicker"
|
||||
import "cpone/component/customdropdown"
|
||||
import "cpone/component/customtextfield"
|
||||
import "strconv"
|
||||
import "cpone/component/customuploadfoto"
|
||||
|
||||
templ PasienForm(data models.PasienFormComponent) {
|
||||
<div class="">
|
||||
<form
|
||||
id={ data.IDComponent }
|
||||
hx-encoding="multipart/form-data"
|
||||
hx-post={ data.Link }
|
||||
class="form"
|
||||
hx-target={ data.HxTarget }
|
||||
hx-swap={ data.HxSwap }
|
||||
hx-include={ data.HxInclude }
|
||||
hx-indicator=".formloading"
|
||||
hx-on::before-request={ HandleFormBeforeRequest() }
|
||||
hx-on::after-request={ HandleFormAfterRequest() }
|
||||
>
|
||||
@modalcomponent.ModalXL(data.ModalID,
|
||||
data.ModalTitle,
|
||||
data.DialogBody,
|
||||
data.DialogAction,
|
||||
data.ButtonCLose)
|
||||
</form>
|
||||
</div>
|
||||
}
|
||||
|
||||
script HandleFormBeforeRequest() {
|
||||
console.log("handle disable btn add");
|
||||
const btnActCancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
for (let i = 0; i < btnActCancel.length; i++) {
|
||||
btnActCancel[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].setAttribute('disabled', 'true');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
script HandleFormAfterRequest() {
|
||||
console.log("handle enable btn add");
|
||||
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ TmpisiDD() {
|
||||
<option>a</option>
|
||||
}
|
||||
|
||||
templ ListItemSapaan(
|
||||
dataStation []models.SapaanPasien,
|
||||
selected int) {
|
||||
for _, v := range dataStation {
|
||||
if v.M_TitleID == selected {
|
||||
<option value={ strconv.Itoa(v.M_TitleID) } selected="selected">{ v.M_TitleName }</option>
|
||||
} else {
|
||||
<option value={ strconv.Itoa(v.M_TitleID) }>{ v.M_TitleName }</option>
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
templ ListItemTerminology(
|
||||
dataStation []models.TerminologyV0,
|
||||
selected string) {
|
||||
for _, v := range dataStation {
|
||||
if (v.Code + "@" + v.CodeSystem) == selected {
|
||||
<option value={ v.Code + "@" + v.CodeSystem } selected="selected">{ v.Display }</option>
|
||||
} else {
|
||||
<option value={ v.Code + "@" + v.CodeSystem }>{ v.Display }</option>
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
templ BodyFormPasien(prm models.PasineFormBodyComponent) {
|
||||
<div id={ prm.IDForm } hx-swap-oob={ prm.HxSwapOOB } hx-on::load={ prm.HxOnLoad }>
|
||||
<div class="container p-0">
|
||||
<div class="row">
|
||||
<div class="col-lg-10">
|
||||
<!--begin::Row 1-->
|
||||
<div class="form-row">
|
||||
<div class="col-md-6 col-lg-2">
|
||||
@customdropdown.CustomDropdownForm(models.CustomDropdownV2Prm{
|
||||
Name: "sapaan",
|
||||
Label: "Sapaan",
|
||||
Placeholder: "Sapaan",
|
||||
ErrorMsg: prm.SapaanErr,
|
||||
ListItem: prm.SapaanItems})
|
||||
</div>
|
||||
<div class="col-md-6 col-lg-3">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
Label: "Imbuhan Awal",
|
||||
Name: "imbuhanawal",
|
||||
Placeholder: "Imbuhan Awal",
|
||||
Type: "text",
|
||||
Value: prm.ImbuhanAwalVal,
|
||||
ErrorMsg: prm.ImbuhanAwalErr})
|
||||
</div>
|
||||
<div class="col-md-6 col-lg-5">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
Label: "Nama",
|
||||
Name: "nama",
|
||||
Placeholder: "Nama",
|
||||
Type: "text",
|
||||
Value: prm.NamaVal,
|
||||
ErrorMsg: prm.NamaErr})
|
||||
</div>
|
||||
<div class="col-md-6 col-lg-2">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
Label: "Imbuhan Akhir",
|
||||
Name: "imbuhanakhir",
|
||||
Placeholder: "Imbuhan Akhir",
|
||||
Type: "text",
|
||||
Value: prm.ImbuhanAkhirVal,
|
||||
ErrorMsg: prm.ImbuhanAkhirErr})
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Row 1-->
|
||||
<!--begin::Row 2-->
|
||||
<div class="row mt-5">
|
||||
<div class="col-md-6">
|
||||
<!-- begin::Jenis Kelamin -->
|
||||
@customdropdown.CustomDropdownForm(models.CustomDropdownV2Prm{
|
||||
Name: "gender",
|
||||
Label: "Jenis Kelamin",
|
||||
Placeholder: "Jenis Kelamin",
|
||||
ErrorMsg: prm.GenderErr,
|
||||
ListItem: prm.GenderItems})
|
||||
<!-- end::Jenis Kelamin -->
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<!-- begin::Tanggal Lahir -->
|
||||
@customdatepicker.CustomDatePickerV2(models.CustomDatePickerPrm{Label: "Tanggal Lahir",
|
||||
Name: "dob",
|
||||
Placeholder: "Tanggal lahir",
|
||||
Value: prm.DobVal,
|
||||
|
||||
ErrorMsg: prm.DobErr,
|
||||
})
|
||||
<!-- end::Tanggal Lahir -->
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Row 2-->
|
||||
<!--begin::Row 3-->
|
||||
<div class="row mt-5">
|
||||
<div class="col-lg-6">
|
||||
<!-- begin::Umur -->
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
|
||||
Label: "Tahun",
|
||||
Name: "tahun",
|
||||
Placeholder: "Tahun",
|
||||
Type: "number",
|
||||
Value: prm.YearVal,
|
||||
ErrorMsg: prm.YearErr})
|
||||
</div>
|
||||
<div class="col">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
|
||||
Label: "Bulan",
|
||||
Name: "bulan",
|
||||
Placeholder: "Bulan",
|
||||
Min: "0",
|
||||
Max: "12",
|
||||
Type: "number",
|
||||
Value: prm.MonthVal,
|
||||
ErrorMsg: prm.MonthErr})
|
||||
</div>
|
||||
<div class="col">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
|
||||
Label: "Hari",
|
||||
Name: "hari",
|
||||
Placeholder: "Hari",
|
||||
Type: "number",
|
||||
Min: "0",
|
||||
Max: "31",
|
||||
Value: prm.DayVal,
|
||||
ErrorMsg: prm.DayErr})
|
||||
</div>
|
||||
</div>
|
||||
<!-- end::Umur -->
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<!-- begin::Darah -->
|
||||
<div class="form-row">
|
||||
<!-- begin::Golongan Darah -->
|
||||
<div class="col">
|
||||
@customdropdown.CustomDropdownForm(models.CustomDropdownV2Prm{
|
||||
Name: "goldar",
|
||||
Label: "Golongan Darah",
|
||||
Placeholder: "Golongan Darah",
|
||||
ErrorMsg: prm.GoldarErr,
|
||||
ListItem: prm.GoldarItems})
|
||||
</div>
|
||||
<!-- end::Golongan Darah -->
|
||||
<!-- begin::Rhesus -->
|
||||
<div class="col">
|
||||
@customdropdown.CustomDropdownForm(models.CustomDropdownV2Prm{
|
||||
Name: "rhesus",
|
||||
Label: "Rhesus",
|
||||
Placeholder: "Rhesus",
|
||||
ErrorMsg: prm.RhesusErr,
|
||||
ListItem: prm.RhesusItems})
|
||||
</div>
|
||||
<!-- end::Rhesus -->
|
||||
</div>
|
||||
<!-- end::Darah -->
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Row 3-->
|
||||
<!--begin::Row 4-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Pekerjaan-->
|
||||
<div class="col-md-6">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
Label: "Pekerjaan",
|
||||
Name: "pekerjaan",
|
||||
Placeholder: "Pekerjaan",
|
||||
Type: "text",
|
||||
Value: prm.PekerjaanVal,
|
||||
ErrorMsg: prm.PekerjaanErr})
|
||||
</div>
|
||||
<!--end::Pekerjaan-->
|
||||
<!--begin::Departemen-->
|
||||
<div class="col-md-6">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
Label: "Departement",
|
||||
Name: "departement",
|
||||
Placeholder: "Departement",
|
||||
Type: "text",
|
||||
Value: prm.DepartementVal,
|
||||
ErrorMsg: prm.DepartementErr})
|
||||
</div>
|
||||
<!--end::Departemen-->
|
||||
</div>
|
||||
<!--end::Row 4-->
|
||||
<!--begin::Row 5-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Posisi-->
|
||||
<div class="col-md-6">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
Label: "Posisi",
|
||||
Name: "posisi",
|
||||
Placeholder: "Posisi",
|
||||
Type: "text",
|
||||
Value: prm.PosisiVal,
|
||||
ErrorMsg: prm.PosisiErr})
|
||||
</div>
|
||||
<!--end::Posisi-->
|
||||
<!--Begin::Pendidikan Terakhir-->
|
||||
<div class="col-md-6">
|
||||
@customdropdown.CustomDropdownForm(models.CustomDropdownV2Prm{
|
||||
Name: "pendidikan",
|
||||
Label: "Pendidikan Terakhir",
|
||||
Placeholder: "Pendidikan Terakhir",
|
||||
ErrorMsg: prm.PendidikanErr,
|
||||
ListItem: prm.PendidikanItems})
|
||||
</div>
|
||||
<!--end::Pendidikan Terakhir-->
|
||||
</div>
|
||||
<!--end::Row 5-->
|
||||
<!--begin::Row 6-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Kewarganegaraan-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<label
|
||||
for="input1"
|
||||
style="font-family: Poppins; font-weight: 600;"
|
||||
>Kewarganegaraan</label>
|
||||
<div class="form-control border-0 h-auto p-0 mt-3">
|
||||
<div class="form-group">
|
||||
<div
|
||||
class="justify-content-around"
|
||||
style="display: flex; gap: 20px;"
|
||||
>
|
||||
<label
|
||||
style="display: flex; align-items: center; gap: 5px;"
|
||||
>
|
||||
<input
|
||||
type="radio"
|
||||
if prm.CitizenshipVal == "WNI" {
|
||||
checked="checked"
|
||||
}
|
||||
if prm.CitizenshipVal == "" {
|
||||
checked="checked"
|
||||
}
|
||||
name="nationality"
|
||||
value="WNI"
|
||||
/>
|
||||
<p style="margin: 0;">WNI</p>
|
||||
</label>
|
||||
<label
|
||||
style="display: flex; align-items: center; gap: 5px;"
|
||||
>
|
||||
<input
|
||||
type="radio"
|
||||
if prm.CitizenshipVal == "WNA" {
|
||||
checked="checked"
|
||||
}
|
||||
name="nationality"
|
||||
value="WNA"
|
||||
/>
|
||||
<p style="margin: 0;">WNA</p>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Kewarganegaraan-->
|
||||
<!--Begin::Etnis-->
|
||||
<div class="col-md-6">
|
||||
@customdropdown.CustomDropdownForm(models.CustomDropdownV2Prm{
|
||||
Name: "etnis",
|
||||
Label: "Etnis",
|
||||
Placeholder: "Etnis",
|
||||
ErrorMsg: prm.EtnisErr,
|
||||
ListItem: prm.EtnisItems})
|
||||
</div>
|
||||
<!--end::Etnis-->
|
||||
</div>
|
||||
<!--end::Row 6-->
|
||||
<!--begin::Row 7-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Identitas-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
@customdropdown.CustomDropdownForm(models.CustomDropdownV2Prm{
|
||||
Name: "identitas",
|
||||
Label: "Identitas",
|
||||
Placeholder: "Identitas",
|
||||
ErrorMsg: prm.IDErr,
|
||||
ListItem: prm.IDItems})
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Identitas-->
|
||||
<!--Begin::Nomor Identitas-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
Label: "Nomor Identitas",
|
||||
Name: "nomoridentitas",
|
||||
Placeholder: "Nomor Identitas",
|
||||
Type: "text",
|
||||
Value: prm.NoIDhVal,
|
||||
ErrorMsg: prm.NoIDErr})
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Nomor Identitas-->
|
||||
</div>
|
||||
<!--end::Row 7-->
|
||||
<!--begin::Row 8-->
|
||||
<div class="row mt-5">
|
||||
<!--begin::Nomor Hp-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
Label: "Nomor Hp",
|
||||
Name: "hp",
|
||||
Placeholder: "Nomor Hp",
|
||||
Type: "text",
|
||||
Value: prm.HpVal,
|
||||
ErrorMsg: prm.HpErr})
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Nomor Hp-->
|
||||
<!--Begin::Email-->
|
||||
<div class="col-md-6">
|
||||
<div class="form-row">
|
||||
<div class="col">
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{
|
||||
Label: "Email",
|
||||
Name: "email",
|
||||
Placeholder: "email",
|
||||
Type: "text",
|
||||
Value: prm.EmailVal,
|
||||
ErrorMsg: prm.EmailErr})
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end::Email-->
|
||||
</div>
|
||||
<!--end::Row 8-->
|
||||
</div>
|
||||
<div class="col-lg-2">
|
||||
<!-- person.png start -->
|
||||
// <div class="row">
|
||||
// <div class="col">
|
||||
// <img
|
||||
// src="asset-corporate-portal/media/person/person.png"
|
||||
// />
|
||||
// // style="display: block; width: 13vw;"
|
||||
// </div>
|
||||
// </div>
|
||||
// <div class="row mt-5">
|
||||
// <div class="col">
|
||||
// <button
|
||||
// class="btn bg-primary-transparent text-center text-primary"
|
||||
// >
|
||||
// // style="width: 13vw; font-weight: 600;"
|
||||
// Update Foto
|
||||
// </button>
|
||||
// </div>
|
||||
// </div>
|
||||
// <div>
|
||||
// <div class="text-center">
|
||||
// <img
|
||||
// id="preview-image"
|
||||
// if prm.LinkFoto == "" {
|
||||
// src="asset-corporate-portal/media/person/person.png"
|
||||
// } else {
|
||||
// src={ prm.LinkFoto }
|
||||
// }
|
||||
// class="rounded-lg"
|
||||
// alt="..."
|
||||
// style="width: 10vw; min-width: 100px;"
|
||||
// />
|
||||
// </div>
|
||||
// <label for="file-upload" class="btn btn-light-primary d-block mt-5">
|
||||
// Update Foto
|
||||
// </label>
|
||||
// <input
|
||||
// id="file-upload"
|
||||
// style="display: none;"
|
||||
// name="pasienprofile"
|
||||
// type="file"
|
||||
// accept=".png, .jpg, .jpeg"
|
||||
// onchange={ OnSelect() }
|
||||
// hx-on::load={ OnSelect() }
|
||||
// />
|
||||
// </div>
|
||||
<div>
|
||||
@customuploadfoto.CustomUploadFotoWithPreview(models.CustomUploadFotoPrm{
|
||||
ID: prm.IDComponentUpload,
|
||||
Name: "pasienprofile",
|
||||
Accept: ".png, .jpg, .jpeg",
|
||||
Label: "Update Foto",
|
||||
LinkFoto: prm.LinkFoto,
|
||||
})
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{ID: "pasienid",
|
||||
Name: "pasienid",
|
||||
Type: "hidden",
|
||||
Value: prm.IDPasien})
|
||||
<!-- person.png end -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
script JsHideModal(modalID string) {
|
||||
$(modalID).modal('hide')
|
||||
}
|
||||
|
||||
script OnSelect() {
|
||||
const fileInput = document.getElementById("file-upload");
|
||||
|
||||
const previewImage = document.getElementById("preview-image");
|
||||
|
||||
if (fileInput.files.length > 0) {
|
||||
if (fileInput.files[0].size > 500000) {
|
||||
fileInput.value = "";
|
||||
Swal.fire("Warning", "File is too big!", "warning");
|
||||
} else {
|
||||
previewImage.src = URL.createObjectURL(fileInput.files[0]);
|
||||
}
|
||||
}
|
||||
|
||||
// 👇️ reset file input once you're done
|
||||
|
||||
}
|
||||
|
||||
script JsShowModal(modalID string) {
|
||||
$(modalID).modal('show')
|
||||
const btnactcancel = document.querySelectorAll('.btnactcancel');
|
||||
const btnactsavedata = document.querySelectorAll('.btnactsavedata');
|
||||
|
||||
|
||||
for (let i = 0; i < btnactcancel.length; i++) {
|
||||
btnactcancel[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
for (let i = 0; i < btnactsavedata.length; i++) {
|
||||
btnactsavedata[i].removeAttribute('disabled');
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
templ ActionFormPasien(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<div>
|
||||
<button
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
hx-indicator=".cancelloading"
|
||||
type="button"
|
||||
class="btn btn-outline-secondary font-weight-bolder rounded-lg mr-4 btnactcancel "
|
||||
data-dismiss="modal"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm cancelloading" role="status" aria-hidden="true"></span>
|
||||
Batal
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-primary btn-shadow font-weight-bold rounded-lg btnactsavedata"
|
||||
>
|
||||
<span class="htmx-indicator spinner-border spinner-border-sm formloading" role="status" aria-hidden="true"></span>
|
||||
Simpan
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ BtnCloseFormPasien(LinkClose string, targetClose string, hxSwapClose string, modalID string) {
|
||||
<button
|
||||
hx-post={ LinkClose }
|
||||
hx-target={ targetClose }
|
||||
hx-swap={ hxSwapClose }
|
||||
type="button"
|
||||
hx-on::after-request={ JsHideModal(modalID) }
|
||||
class="close btnactcancel"
|
||||
data-dismiss="modal"
|
||||
aria-label="Close"
|
||||
>
|
||||
<i aria-hidden="true" class="ki ki-close"></i>
|
||||
</button>
|
||||
}
|
||||
|
||||
templ DeleteConfirmationBody(inputId string,
|
||||
componentID string,
|
||||
message string,
|
||||
datHeader []string,
|
||||
dataText []string,
|
||||
hxOnLoad templ.ComponentScript) {
|
||||
<div id={ componentID } hx-on::load={ hxOnLoad }>
|
||||
<p>{ message }</p>
|
||||
<div class="card rounded-lg">
|
||||
<div class="card-body d-flex flex-row">
|
||||
<div class="d-flex flex-column">
|
||||
for _, v := range datHeader {
|
||||
<div class="mb-1 mt-1 text-disabled font-weight-bold mr-5">{ v }</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex flex-column ">
|
||||
for _, v := range dataText {
|
||||
<div class="mb-1 mt-1 font-weight-bold">
|
||||
{ v }
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@customtextfield.CustomTextFieldv2(models.CustomTextFieldv2Prm{Name: "pasienid", ID: "pasienid", Type: "hidden", Value: inputId})
|
||||
</div>
|
||||
}
|
||||
1116
views/dev/mdpasien/mdpasienformmodal_templ.go
Normal file
1116
views/dev/mdpasien/mdpasienformmodal_templ.go
Normal file
File diff suppressed because it is too large
Load Diff
@@ -43,7 +43,7 @@ templ RowPasien(data []models.Pasien,
|
||||
) {
|
||||
if len(data) == 0 {
|
||||
<tr>
|
||||
<td colspan="4" class="text-center">Data Tidak Ditemukan</td>
|
||||
<td colspan="5" class="text-center">Data Tidak Ditemukan</td>
|
||||
</tr>
|
||||
}
|
||||
for _, v := range data {
|
||||
|
||||
@@ -103,7 +103,7 @@ func RowPasien(data []models.Pasien,
|
||||
}
|
||||
ctx = templ.ClearChildren(ctx)
|
||||
if len(data) == 0 {
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<tr><td colspan=\"4\" class=\"text-center\">Data Tidak Ditemukan</td></tr>")
|
||||
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<tr><td colspan=\"5\" class=\"text-center\">Data Tidak Ditemukan</td></tr>")
|
||||
if templ_7745c5c3_Err != nil {
|
||||
return templ_7745c5c3_Err
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user