Files
xport-tailwind-alpine/v1-test-cmp/js/order_mobile_edit.js

710 lines
22 KiB
JavaScript

document.addEventListener('alpine:init', () => {
Alpine.data('orderMobileEdit', () => ({
// 0. Init dijalankan sebelum inisialisasi
init() {
if (localStorage.getItem('itemEditMobile') != null) {
let orderData = JSON.parse(localStorage.getItem('itemEditMobile'));
console.log("itemEditMobile ", orderData);
// Set Order Date
let selectedDate = new Date(orderData.date.split('/').reverse().join('-'));
this.selectedDayOD = selectedDate.getDate();
this.monthOD = selectedDate.getMonth();
this.yearOD = selectedDate.getFullYear();
this.datepickerValueOD = this.formatDate(selectedDate);
this.getNoOfDaysOD();
// Set MRN
this.mrnAdd = orderData.mrn;
// Set SID
this.sidAdd = orderData.sid;
// Set Name
this.nameAdd = orderData.name;
// Set DOB
let selectedDateDOB = new Date(orderData.dob.split('/').reverse().join('-'));
this.selectedDayDOB = selectedDateDOB.getDate();
this.monthDOB = selectedDateDOB.getMonth();
this.yearDOB = selectedDateDOB.getFullYear();
this.datepickerValueDOB = this.formatDate(selectedDateDOB);
this.getNoOfDaysDOB();
// Set Pemeriksaan
this.selectedPemeriksaan = [...orderData.dataPemeriksaan];
// Pastikan filtered list pemeriksaan ada
this.filteredPemeriksaan = [...this.dataPemeriksaan];
}
let today = new Date();
this.selectedDaySD = today.getDate();
this.month = today.getMonth();
this.year = today.getFullYear();
// this.datepickerValueSD = this.formatDate(today);
this.datepickerValueSD = 'Start Date'
this.getNoOfDays();
this.selectedDaySD = today.getDate();
// End Date Functions
this.selectedDayED = today.getDate();
this.monthED = today.getMonth();
this.yearED = today.getFullYear();
this.datepickerValueED = 'End Date';
this.getNoOfDaysED();
// Order Date
this.selectedDayOD = today.getDate();
this.monthOD = today.getMonth();
this.yearOD = today.getFullYear();
this.datepickerValueOD = this.formatDate(today);
this.getNoOfDaysOD();
this.e_selectedDayOD = today.getDate();
this.e_monthOD = today.getMonth();
this.e_yearOD = today.getFullYear();
this.e_datepickerValueOD = this.formatDate(today);
this.e_getNoOfDaysOD();
// DOB
this.selectedDayDOB = today.getDate();
this.monthDOB = today.getMonth();
this.yearDOB = today.getFullYear();
this.datepickerValueDOB = this.formatDate(today);
this.getNoOfDaysDOB();
this.e_selectedDayDOB = today.getDate();
this.e_monthDOB = today.getMonth();
this.e_yearDOB = today.getFullYear();
this.e_datepickerValueDOB = this.formatDate(today);
this.e_getNoOfDaysDOB();
// multiple pemeriksaan add
this.filteredPemeriksaan = [...this.dataPemeriksaan];
},
// 1. Inisialisasi Start
// datepicker
selectedDaySD: null,
showDatepickerSD: false,
datepickerValueSD: '',
month: 0,
year: 0,
no_of_days: [],
blankdays: [],
selectedDayED: null,
showDatepickerED: false,
datepickerValueED: '',
monthED: 0,
yearED: 0,
no_of_daysED: [],
blankdaysED: [],
// Order Date Variables
showDatepickerOD: false,
selectedDayOD: null,
datepickerValueOD: '',
monthOD: 0,
yearOD: 0,
no_of_daysOD: [],
blankdaysOD: [],
e_showDatepickerOD: false,
e_selectedDayOD: null,
e_datepickerValueOD: '',
e_monthOD: 0,
e_yearOD: 0,
e_no_of_daysOD: [],
e_blankdaysOD: [],
// DOB Variabless
showDatepickerDOB: false,
selectedDayDOB: null,
datepickerValueDOB: '',
monthDOB: 0,
yearDOB: 0,
no_of_daysDOB: [],
blankdaysDOB: [],
e_showDatepickerDOB: false,
e_selectedDayDOB: null,
e_datepickerValueDOB: '',
e_monthDOB: 0,
e_yearDOB: 0,
e_no_of_daysDOB: [],
e_blankdaysDOB: [],
MONTH_NAMES: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
DAYS: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
formatDate(date) {
let day = date.getDate().toString().padStart(2, '0');
let month = (date.getMonth() + 1).toString().padStart(2, '0');
let year = date.getFullYear();
return `${day}/${month}/${year}`;
},
prevMonth() {
if (this.month === 0) {
this.year--;
this.month = 11;
} else {
this.month--;
}
this.getNoOfDays();
},
nextMonth() {
if (this.month === 11) {
this.year++;
this.month = 0;
} else {
this.month++;
}
this.getNoOfDays();
},
getDateValue(date) {
let selectedDate = new Date(this.year, this.month, date);
this.selectedDaySD = date; // Simpan tanggal yang dipilih
this.datepickerValueSD = this.formatDate(selectedDate);
this.showDatepickerSD = false;
},
isToday(date) {
let today = new Date();
let d = new Date(this.year, this.month, date);
return today.toDateString() === d.toDateString();
},
isSelected(date) {
return this.selectedDaySD === date;
},
getNoOfDays() {
let daysInMonth = new Date(this.year, this.month + 1, 0).getDate();
let dayOfWeek = new Date(this.year, this.month, 1).getDay();
this.blankdays = Array.from({ length: dayOfWeek }, (_, i) => i);
this.no_of_days = Array.from({ length: daysInMonth }, (_, i) => i + 1);
},
setDate(date) {
let selectedDate = new Date(this.year, this.month, date);
this.selectedDaySD = date;
this.datepickerValueSD = this.formatDate(selectedDate);
this.showDatepickerSD = false;
},
// End Date Functions
prevMonthED() {
if (this.monthED === 0) {
this.yearED--;
this.monthED = 11;
} else {
this.monthED--;
}
this.getNoOfDaysED();
},
nextMonthED() {
if (this.monthED === 11) {
this.yearED++;
this.monthED = 0;
} else {
this.monthED++;
}
this.getNoOfDaysED();
},
setDateED(date) {
let selectedDate = new Date(this.yearED, this.monthED, date);
this.selectedDayED = date;
this.datepickerValueED = this.formatDate(selectedDate);
this.showDatepickerED = false;
},
isSelectedED(date) {
return this.selectedDayED === date;
},
getNoOfDaysED() {
let daysInMonth = new Date(this.yearED, this.monthED + 1, 0).getDate();
let dayOfWeek = new Date(this.yearED, this.monthED, 1).getDay();
this.blankdaysED = Array.from({ length: dayOfWeek }, (_, i) => i);
this.no_of_daysED = Array.from({ length: daysInMonth }, (_, i) => i + 1);
},
// Order Date Functions
prevMonthOD() {
if (this.monthOD === 0) {
this.yearOD--;
this.monthOD = 11;
} else {
this.monthOD--;
}
this.getNoOfDaysOD();
},
nextMonthOD() {
if (this.monthOD === 11) {
this.yearOD++;
this.monthOD = 0;
} else {
this.monthOD++;
}
this.getNoOfDaysOD();
},
setDateOD(date) {
let selectedDate = new Date(this.yearOD, this.monthOD, date);
this.selectedDayOD = date;
this.datepickerValueOD = this.formatDate(selectedDate);
this.showDatepickerOD = false;
},
isSelectedOD(date) {
return this.selectedDayOD === date;
},
getNoOfDaysOD() {
let daysInMonth = new Date(this.yearOD, this.monthOD + 1, 0).getDate();
let dayOfWeek = new Date(this.yearOD, this.monthOD, 1).getDay();
this.blankdaysOD = Array.from({ length: dayOfWeek }, (_, i) => i);
this.no_of_daysOD = Array.from({ length: daysInMonth }, (_, i) => i + 1);
},
// edit order date
e_prevMonthOD() {
if (this.e_monthOD === 0) {
this.e_yearOD--;
this.e_monthOD = 11;
} else {
this.e_monthOD--;
}
this.e_getNoOfDaysOD();
},
e_nextMonthOD() {
if (this.e_monthOD === 11) {
this.e_yearOD++;
this.e_monthOD = 0;
} else {
this.e_monthOD++;
}
this.e_getNoOfDaysOD();
},
e_setDateOD(date) {
let selectedDate = new Date(this.e_yearOD, this.e_monthOD, date);
this.e_selectedDayOD = date;
this.e_datepickerValueOD = this.formatDate(selectedDate);
this.e_showDatepickerOD = false;
},
e_isSelectedOD(date) {
return this.e_selectedDayOD === date;
},
e_getNoOfDaysOD() {
let daysInMonth = new Date(this.e_yearOD, this.e_monthOD + 1, 0).getDate();
let dayOfWeek = new Date(this.e_yearOD, this.e_monthOD, 1).getDay();
this.e_blankdaysOD = Array.from({ length: dayOfWeek }, (_, i) => i);
this.e_no_of_daysOD = Array.from({ length: daysInMonth }, (_, i) => i + 1);
},
// Dob Functions
prevMonthDOB() {
if (this.monthDOB === 0) {
this.yearDOB--;
this.monthDOB = 11;
} else {
this.monthDOB--;
}
this.getNoOfDaysDOB();
},
nextMonthDOB() {
if (this.monthDOB === 11) {
this.yearDOB++;
this.monthDOB = 0;
} else {
this.monthDOB++;
}
this.getNoOfDaysDOB();
},
setDateDOB(date) {
let selectedDate = new Date(this.yearDOB, this.monthDOB, date);
this.selectedDayDOB = date;
this.datepickerValueDOB = this.formatDate(selectedDate);
this.showDatepickerDOB = false;
},
isSelectedDOB(date) {
return this.selectedDayDOB === date;
},
getNoOfDaysDOB() {
let daysInMonth = new Date(this.yearDOB, this.monthDOB + 1, 0).getDate();
let dayOfWeek = new Date(this.yearDOB, this.monthDOB, 1).getDay();
this.blankdaysDOB = Array.from({ length: dayOfWeek }, (_, i) => i);
this.no_of_daysDOB = Array.from({ length: daysInMonth }, (_, i) => i + 1);
},
// edit dob
e_prevMonthDOB() {
if (this.e_monthDOB === 0) {
this.e_yearDOB--;
this.e_monthDOB = 11;
} else {
this.e_monthDOB--;
}
this.e_getNoOfDaysDOB();
},
e_nextMonthDOB() {
if (this.e_monthDOB === 11) {
this.e_yearDOB++;
this.e_monthDOB = 0;
} else {
this.e_monthDOB++;
}
this.e_getNoOfDaysDOB();
},
e_setDateDOB(date) {
let selectedDate = new Date(this.e_yearDOB, this.e_monthDOB, date);
this.e_selectedDayDOB = date;
this.e_datepickerValueDOB = this.formatDate(selectedDate);
this.e_showDatepickerDOB = false;
},
e_isSelectedDOB(date) {
return this.e_selectedDayDOB === date;
},
e_getNoOfDaysDOB() {
let daysInMonth = new Date(this.e_yearDOB, this.e_monthDOB + 1, 0).getDate();
let dayOfWeek = new Date(this.e_yearDOB, this.e_monthDOB, 1).getDay();
this.e_blankdaysDOB = Array.from({ length: dayOfWeek }, (_, i) => i);
this.e_no_of_daysDOB = Array.from({ length: daysInMonth }, (_, i) => i + 1);
},
// datepicker
// multiple select
openPemeriksaanAdd: false,
searchPemeriksaan: "",
selectedPemeriksaan: [],
dataPemeriksaan: [
{
idPemeriksaan: 1,
namaPemeriksaan: 'SGOT'
},
{
idPemeriksaan: 2,
namaPemeriksaan: 'SGPT'
},
{
idPemeriksaan: 3,
namaPemeriksaan: 'GLOB'
},
{
idPemeriksaan: 4,
namaPemeriksaan: 'TBIL'
},
{
idPemeriksaan: 5,
namaPemeriksaan: 'Darah Lengkap'
},
],
filteredItemPemeriksaan: [],
filterItemPemeriksaan() {
this.filteredPemeriksaan = this.dataPemeriksaan.filter(item =>
item.namaPemeriksaan.toLowerCase().includes(this.searchPemeriksaan.toLowerCase())
);
},
addItemPemeriksaan(item) {
if (!this.selectedPemeriksaan.some(p => p.idPemeriksaan === item.idPemeriksaan)) {
this.selectedPemeriksaan.push(item);
this.objForm.pemeriksaan.push(item);
}
this.searchPemeriksaan = "";
this.filterItemPemeriksaan();
},
removeItemPemeriksaan(index) {
this.selectedPemeriksaan.splice(index, 1);
},
// edit multiple
openPemeriksaanEdit: false,
e_searchPemeriksaan: "",
e_selectedPemeriksaan: [],
e_filteredItemPemeriksaan: [],
e_filterItemPemeriksaan() {
if (this.e_searchPemeriksaan.trim() === '') {
this.e_filteredPemeriksaan = [...this.dataPemeriksaan];
} else {
this.e_filteredPemeriksaan = this.dataPemeriksaan.filter((item) =>
item.namaPemeriksaan.toLowerCase().includes(this.e_searchPemeriksaan.toLowerCase())
);
}
},
e_ItemPemeriksaan(item) {
if (!this.e_selectedPemeriksaan.some(p => p.idPemeriksaan === item.idPemeriksaan)) {
this.e_selectedPemeriksaan.push(item);
this.objFormEdit.pemeriksaan.push(item);
}
this.e_searchPemeriksaan = "";
this.e_filterItemPemeriksaan();
},
e_removeItemPemeriksaan(index) {
this.e_selectedPemeriksaan.splice(index, 1);
},
// multiple select
showDialogAdd: false,
showDialogEdit: false,
loadingVerifikasi: false,
isVerifikasiDone: false,
MRN_SID: '',
dataOrder: [
{
idOrder: 1,
date: '01/03/2025',
mrn: 'P.2024.205.1',
sid: 'SRK1234SK',
name: 'Joko Santoso',
dob: '09/05/2008',
pemeriksaanStr: 'SGOT, SGPT, GLOB, TBIL',
dataPemeriksaan: [
{
idPemeriksaan: 1,
namaPemeriksaan: 'SGOT'
},
{
idPemeriksaan: 2,
namaPemeriksaan: 'SGPT'
},
{
idPemeriksaan: 3,
namaPemeriksaan: 'GLOB'
},
{
idPemeriksaan: 4,
namaPemeriksaan: 'TBIL'
},
],
},
{
idOrder: 2,
date: '02/03/2025',
mrn: 'P.2024.205.1',
sid: 'SRK1234SK',
name: 'Joko Santoso',
dob: '01/03/2000',
pemeriksaanStr: 'SGOT, SGPT, GLOB, TBIL',
dataPemeriksaan: [
{
idPemeriksaan: 1,
namaPemeriksaan: 'SGOT'
},
{
idPemeriksaan: 2,
namaPemeriksaan: 'SGPT'
},
{
idPemeriksaan: 3,
namaPemeriksaan: 'GLOB'
},
{
idPemeriksaan: 4,
namaPemeriksaan: 'TBIL'
},
],
},
{
idOrder: 3,
date: '02/03/2025',
mrn: 'P.2024.205.1',
sid: 'SRK1234SK',
name: 'Joko Santoso',
dob: '01/03/2000',
pemeriksaanStr: 'SGOT, SGPT, GLOB, TBIL, Darah Lengkap',
dataPemeriksaan: [
{
idPemeriksaan: 1,
namaPemeriksaan: 'SGOT'
},
{
idPemeriksaan: 2,
namaPemeriksaan: 'SGPT'
},
{
idPemeriksaan: 3,
namaPemeriksaan: 'GLOB'
},
{
idPemeriksaan: 4,
namaPemeriksaan: 'TBIL'
},
{
idPemeriksaan: 5,
namaPemeriksaan: 'Darah Lengkap'
},
],
},
],
selectedInstrument: {
idInstrument: -1,
namaInstrument: 'Instrument'
},
openInstrument: false,
openInstrumentSearchMobile: false,
openInstrumentSearch: false,
dataInstrument: [
{
idInstrument: 1,
namaInstrument: 'Hema 01',
},
{
idInstrument: 2,
namaInstrument: 'Axsym',
},
{
idInstrument: 3,
namaInstrument: 'Cobas C311',
},
],
mrnAdd: '',
e_mrn: '',
datePickerValueAdd: '',
sidAdd: '',
e_sid: '',
nameAdd: '',
e_name: '',
dobAdd: '',
pemeriksaanAdd: [],
objForm: {
date: '',
mrn: '',
sid: '',
name: '',
dob: '',
pemeriksaan: [],
},
objFormEdit: {
date: '',
mrn: '',
sid: '',
name: '',
dob: '',
pemeriksaan: [],
},
// 1. Inisialisasi End
// 2. Fungsi Start
closeDialog() {
this.pemeriksaanAdd = []
this.filteredItemPemeriksaan = []
this.selectedPemeriksaan = []
this.mrnAdd = ''
this.datePickerValueAdd = ''
this.sidAdd = ''
this.nameAdd = ''
this.dobAdd = ''
this.objForm = {
date: '',
mrn: '',
sid: '',
name: '',
dob: '',
pemeriksaan: [],
}
this.showDialogAdd = false
},
onChangeInstrumentSearch(item) {
this.openInstrumentSearch = false;
this.selectedInstrument = item;
},
onChangeInstrument(item) {
this.openInstrument = false;
this.selectedInstrumentAdd = item;
},
onChangeInstrumentEdit(item) {
this.openInstrument = false;
this.selectedInstrumentEdit = item;
},
onChangeMrnAdd() {
this.objForm.mrn = this.mrnAdd;
},
onChangeMrnEdit() {
this.objFormEdit.mrn = this.e_mrn;
},
onChangeSidAdd() {
this.objForm.sid = this.sidAdd;
},
onChangeSidEdit() {
this.objFormEdit.sid = this.e_sid;
},
onChangeNameAdd() {
this.objForm.name = this.nameAdd;
},
onChangeNameEdit() {
this.objFormEdit.name = this.e_name;
},
onChangeInstrumentMobile(item) {
this.openInstrumentSearchMobile = false;
// this.selectedInstrument = item;
this.selectedInstrument = { ...item };
},
openModalEdit(item) {
// Order date edit
let selectedDate = new Date(item.date.split('/').reverse().join('-'));
this.e_selectedDayOD = selectedDate.getDate();
this.e_monthOD = selectedDate.getMonth();
this.e_yearOD = selectedDate.getFullYear();
this.e_datepickerValueOD = this.formatDate(selectedDate);
this.e_getNoOfDaysOD();
// mrn
this.e_mrn = item.mrn
// sid
this.e_sid = item.sid
// name
this.e_name = item.name
// DOB edit
let selectedDateDOB = new Date(item.dob.split('/').reverse().join('-'));
this.e_selectedDayDOB = selectedDateDOB.getDate();
this.e_monthDOB = selectedDateDOB.getMonth();
this.e_yearDOB = selectedDateDOB.getFullYear();
this.e_datepickerValueDOB = this.formatDate(selectedDateDOB);
this.e_getNoOfDaysDOB();
// multiple pemeriksaan
this.e_selectedPemeriksaan = [...item.dataPemeriksaan];
this.e_filteredPemeriksaan = [...this.dataPemeriksaan];
this.showDialogEdit = !this.showDialogEdit;
},
closeDialogEdit() {
this.showDialogEdit = !this.showDialogEdit;
},
editMobilePage(item) {
var json = JSON.stringify(item);
localStorage.setItem('itemEditMobile', json)
window.location.href = "assay_format_mobile_edit.html";
},
// 2. Fungsi End
}))
})