step 53 : copy dan paste v1, untuk komponen reusable
This commit is contained in:
sindhu
253
v1-test-cmp/js/assay_format.js
Normal file
253
v1-test-cmp/js/assay_format.js
Normal file
@@ -0,0 +1,253 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('assayFormat', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
dataSetting: [
|
||||
{
|
||||
idSetting: 1,
|
||||
idJenis: 1,
|
||||
namaJenis: 'TCP Server',
|
||||
info: 'Port 5001',
|
||||
port: '5001',
|
||||
idInterface: 1,
|
||||
namaInterface: 'XN550',
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
server: '',
|
||||
idSerial: -1,
|
||||
namaSerial: '',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
},
|
||||
{
|
||||
idSetting: 2,
|
||||
idJenis: 2,
|
||||
namaJenis: 'TCP Client',
|
||||
info: 'Server 192.168.0.1, Port 4000',
|
||||
port: '4000',
|
||||
idInterface: 2,
|
||||
namaInterface: 'Axsym',
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
server: '192.168.0.1',
|
||||
idSerial: 1,
|
||||
namaSerial: 'ttyS0',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
},
|
||||
{
|
||||
idSetting: 3,
|
||||
idJenis: 3,
|
||||
namaJenis: 'RS232',
|
||||
info: 'ttyS01, 9600, N, 8, 1',
|
||||
port: '',
|
||||
idInterface: 3,
|
||||
namaInterface: 'C311',
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
server: '',
|
||||
idSerial: 1,
|
||||
namaSerial: 'ttyS0',
|
||||
speed: '19200',
|
||||
idParity: 1,
|
||||
namaParity: 'None',
|
||||
idDataBit: 2,
|
||||
namaDataBit: '6',
|
||||
idStopBit: 2,
|
||||
namaStopBit: '1'
|
||||
},
|
||||
],
|
||||
showDialogAdd: false,
|
||||
showDialogEdit: false,
|
||||
loadingVerifikasi: false,
|
||||
isVerifikasiDone: false,
|
||||
assayNo: '',
|
||||
decimalFontEdit: '',
|
||||
assayCodeEdit: '',
|
||||
decimalFont: '',
|
||||
assayCode: '',
|
||||
formulaEdit: '',
|
||||
formulaAdd: '',
|
||||
dataAssayFormat: [
|
||||
{
|
||||
idAssayFormat: 1,
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
assayCode: 'WBC',
|
||||
decimalFont: '5001',
|
||||
formula: ''
|
||||
},
|
||||
{
|
||||
idAssayFormat: 2,
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
assayCode: 'IgG',
|
||||
decimalFont: '2001',
|
||||
formula: ''
|
||||
},
|
||||
{
|
||||
idAssayFormat: 3,
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
assayCode: 'DBIL',
|
||||
decimalFont: '4001',
|
||||
formula: '(TBIL) - (DBIL)'
|
||||
},
|
||||
],
|
||||
selectedInstrument: {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
},
|
||||
selectedInstrumentAdd: {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
},
|
||||
selectedInstrumentEdit: {
|
||||
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',
|
||||
},
|
||||
],
|
||||
hasilVerifikasi: '',
|
||||
isErrorVerifikasi: false,
|
||||
objForm: {
|
||||
isValidForm: false,
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument',
|
||||
decimalFont: '',
|
||||
assayCode: '',
|
||||
formula: '',
|
||||
},
|
||||
objFormEdit: {
|
||||
isValidForm: false,
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument',
|
||||
decimalFont: '',
|
||||
assayCode: '',
|
||||
formula: '',
|
||||
},
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
closeDialog() {
|
||||
this.openInstrument = false;
|
||||
this.selectedInstrumentAdd = {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
};
|
||||
this.loadingVerifikasi = false;
|
||||
this.isVerifikasiDone = false;
|
||||
this.objForm.isValidForm = false;
|
||||
this.isErrorVerifikasi = false;
|
||||
this.hasilVerifikasi = ''
|
||||
this.assayCode = ''
|
||||
this.decimalFont = ''
|
||||
this.formulaAdd = ''
|
||||
this.showDialogAdd = false
|
||||
},
|
||||
onChangeInstrumentSearch(item) {
|
||||
this.openInstrumentSearch = false;
|
||||
this.selectedInstrument = item;
|
||||
},
|
||||
onChangeInstrument(item) {
|
||||
this.openInstrument = false;
|
||||
this.selectedInstrumentAdd = item;
|
||||
this.validateForm();
|
||||
},
|
||||
onChangeInstrumentEdit(item) {
|
||||
this.openInstrument = false;
|
||||
this.selectedInstrumentEdit = item;
|
||||
},
|
||||
onChangeAssayCodeAdd() {
|
||||
this.objForm.assayCode = this.assayCode;
|
||||
this.validateForm();
|
||||
},
|
||||
onChangeDecimalFontAdd() {
|
||||
this.objForm.decimalFont = this.decimalFont;
|
||||
this.validateForm();
|
||||
},
|
||||
onChangeFormulaAdd() {
|
||||
this.objForm.formula = this.formulaAdd;
|
||||
this.validateForm();
|
||||
},
|
||||
onChangeInstrumentMobile(item) {
|
||||
this.openInstrumentSearchMobile = false;
|
||||
// this.selectedInstrument = item;
|
||||
this.selectedInstrument = { ...item };
|
||||
},
|
||||
onProcessVerifikasi() {
|
||||
if (this.isVerifikasiDone == true) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.loadingVerifikasi = true;
|
||||
|
||||
setTimeout(() => {
|
||||
this.loadingVerifikasi = false;
|
||||
this.isErrorVerifikasi = false;
|
||||
this.isVerifikasiDone = true;
|
||||
this.hasilVerifikasi = 'Formula is valid';
|
||||
}, 2000);
|
||||
},
|
||||
openModalEdit(item) {
|
||||
this.selectedInstrumentEdit = {
|
||||
idInstrument: item.idInstrument,
|
||||
namaInstrument: item.namaInstrument
|
||||
}
|
||||
|
||||
this.assayCodeEdit = item.assayCode
|
||||
this.decimalFontEdit = item.decimalFont
|
||||
this.formulaEdit = item.formula
|
||||
|
||||
this.showDialogEdit = !this.showDialogEdit;
|
||||
},
|
||||
closeDialogEdit() {
|
||||
this.loadingVerifikasi = false;
|
||||
this.isErrorVerifikasi = false;
|
||||
this.isVerifikasiDone = false;
|
||||
this.hasilVerifikasi = ''
|
||||
this.showDialogEdit = !this.showDialogEdit;
|
||||
},
|
||||
validateForm() {
|
||||
this.objForm.isValidForm = (
|
||||
this.selectedInstrumentAdd.idInstrument != -1 &&
|
||||
this.decimalFont.trim() !== '' &&
|
||||
this.assayCode.trim() !== '' &&
|
||||
this.formulaAdd.trim() !== ''
|
||||
);
|
||||
},
|
||||
editMobilePage(item) {
|
||||
var json = JSON.stringify(item);
|
||||
localStorage.setItem('itemEditMobile', json)
|
||||
window.location.href = "assay_format_mobile_edit.html";
|
||||
},
|
||||
// 2. Fungsi End
|
||||
}))
|
||||
})
|
||||
94
v1-test-cmp/js/assay_format_mobile_add.js
Normal file
94
v1-test-cmp/js/assay_format_mobile_add.js
Normal file
@@ -0,0 +1,94 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('assayFormatMobileAdd', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
loadingVerifikasi: false,
|
||||
decimalFont: '',
|
||||
assayCode: '',
|
||||
formula: '',
|
||||
selectedInstrument: {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
},
|
||||
openInstrument: false,
|
||||
dataInstrument: [
|
||||
{
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
},
|
||||
{
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
},
|
||||
{
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
},
|
||||
],
|
||||
hasilVerifikasi: '',
|
||||
isErrorVerifikasi: false,
|
||||
isVerifikasiDone: false,
|
||||
objForm: {
|
||||
isValidForm: false,
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument',
|
||||
decimalFont: '',
|
||||
assayCode: '',
|
||||
formula: '',
|
||||
},
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
onChangeFormula() {
|
||||
this.objForm.formula = this.formula;
|
||||
this.validateForm();
|
||||
},
|
||||
onChangeDecimalFont() {
|
||||
this.objForm.decimalFont = this.decimalFont;
|
||||
this.validateForm();
|
||||
},
|
||||
onChangeAssayCode() {
|
||||
this.objForm.assayCode = this.assayCode;
|
||||
this.validateForm();
|
||||
},
|
||||
onChangeInstrument(item) {
|
||||
this.selectedInstrument = item;
|
||||
this.objForm.idInstrument = item.idInstrument;
|
||||
this.objForm.namaInstrument = item.namaInstrument;
|
||||
this.validateForm();
|
||||
},
|
||||
onProcessVerifikasi() {
|
||||
if(this.isVerifikasiDone == true) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.loadingVerifikasi = true;
|
||||
|
||||
setTimeout(() => {
|
||||
this.loadingVerifikasi = false;
|
||||
this.isErrorVerifikasi = false;
|
||||
this.isVerifikasiDone = true;
|
||||
this.hasilVerifikasi = 'Formula is valid';
|
||||
}, 2000);
|
||||
},
|
||||
validateForm() {
|
||||
this.objForm.isValidForm = (
|
||||
this.selectedInstrument.idInstrument != -1 &&
|
||||
this.decimalFont.trim() !== '' &&
|
||||
this.assayCode.trim() !== '' &&
|
||||
this.formula.trim() !== ''
|
||||
);
|
||||
},
|
||||
save() {
|
||||
if (this.objForm.isValidForm === true) {
|
||||
alert('true')
|
||||
} else {
|
||||
alert('inputan harus diisi');
|
||||
}
|
||||
},
|
||||
// 2. Fungsi End
|
||||
})
|
||||
)
|
||||
})
|
||||
109
v1-test-cmp/js/assay_format_mobile_edit.js
Normal file
109
v1-test-cmp/js/assay_format_mobile_edit.js
Normal file
@@ -0,0 +1,109 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('assayFormatMobileEdit', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
let itemEdit = localStorage.getItem('itemEditMobile');
|
||||
// console.log('itemEdit ', itemEdit);
|
||||
if (itemEdit) {
|
||||
let json = JSON.parse(itemEdit);
|
||||
console.log('itemEdit ', json);
|
||||
this.selectedInstrument = {
|
||||
idInstrument: json.idInstrument,
|
||||
namaInstrument: json.namaInstrument
|
||||
};
|
||||
|
||||
this.assayCode = json.assayCode || '';
|
||||
this.decimalFont = json.decimalFont || '';
|
||||
this.formula = json.formula || '';
|
||||
this.idAssayFormat = json.idAssayFormat || -1;
|
||||
}
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
loadingVerifikasi: false,
|
||||
idAssayFormat: -1,
|
||||
decimalFont: '',
|
||||
assayCode: '',
|
||||
formula: '',
|
||||
selectedInstrument: {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
},
|
||||
openInstrument: false,
|
||||
dataInstrument: [
|
||||
{
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
},
|
||||
{
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
},
|
||||
{
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
},
|
||||
],
|
||||
hasilVerifikasi: '',
|
||||
isErrorVerifikasi: false,
|
||||
isVerifikasiDone: false,
|
||||
objForm: {
|
||||
isValidForm: false,
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument',
|
||||
decimalFont: '',
|
||||
assayCode: '',
|
||||
formula: '',
|
||||
},
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
onChangeFormula() {
|
||||
this.objForm.formula = this.formula;
|
||||
this.validateForm();
|
||||
},
|
||||
onChangeDecimalFont() {
|
||||
this.objForm.decimalFont = this.decimalFont;
|
||||
this.validateForm();
|
||||
},
|
||||
onChangeAssayCode() {
|
||||
this.objForm.assayCode = this.assayCode;
|
||||
this.validateForm();
|
||||
},
|
||||
onChangeInstrument(item) {
|
||||
this.selectedInstrument = item;
|
||||
this.objForm.idInstrument = item.idInstrument;
|
||||
this.objForm.namaInstrument = item.namaInstrument;
|
||||
this.validateForm();
|
||||
},
|
||||
onProcessVerifikasi() {
|
||||
if(this.isVerifikasiDone == true) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.loadingVerifikasi = true;
|
||||
|
||||
setTimeout(() => {
|
||||
this.loadingVerifikasi = false;
|
||||
this.isErrorVerifikasi = false;
|
||||
this.isVerifikasiDone = true;
|
||||
this.hasilVerifikasi = 'Formula is valid';
|
||||
}, 2000);
|
||||
},
|
||||
validateForm() {
|
||||
this.objForm.isValidForm = (
|
||||
this.selectedInstrument.idInstrument != -1 &&
|
||||
this.decimalFont.trim() !== '' &&
|
||||
this.assayCode.trim() !== '' &&
|
||||
this.formula.trim() !== ''
|
||||
);
|
||||
},
|
||||
save() {
|
||||
if (this.objForm.isValidForm === true) {
|
||||
alert('true')
|
||||
} else {
|
||||
alert('inputan harus diisi');
|
||||
}
|
||||
},
|
||||
// 2. Fungsi End
|
||||
})
|
||||
)
|
||||
})
|
||||
352
v1-test-cmp/js/master_data.js
Normal file
352
v1-test-cmp/js/master_data.js
Normal file
@@ -0,0 +1,352 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('masterData', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
// multiple select
|
||||
dataAssay: [
|
||||
{
|
||||
idAssay: 1,
|
||||
namaAssay: 'Xn500'
|
||||
},
|
||||
{
|
||||
idAssay: 2,
|
||||
namaAssay: 'HGB'
|
||||
},
|
||||
{
|
||||
idAssay: 3,
|
||||
namaAssay: 'WBC'
|
||||
},
|
||||
{
|
||||
idAssay: 4,
|
||||
namaAssay: 'RBC'
|
||||
},
|
||||
{
|
||||
idAssay: 5,
|
||||
namaAssay: 'PLT'
|
||||
},
|
||||
],
|
||||
dataAlat: [
|
||||
{
|
||||
idAlat: 1,
|
||||
namaAlat: 'Hema 01',
|
||||
},
|
||||
{
|
||||
idAlat: 2,
|
||||
namaAlat: 'Axsym',
|
||||
},
|
||||
{
|
||||
idAlat: 3,
|
||||
namaAlat: 'Cobas C311',
|
||||
},
|
||||
],
|
||||
|
||||
// multiple select
|
||||
dataMaster: [
|
||||
{
|
||||
idMaster: 1,
|
||||
kode: 'A04',
|
||||
namaPemeriksaan: 'Darah Lengkap',
|
||||
harga: '50.000',
|
||||
pemeriksaanStr: 'Xn500, HCB, WBC, RBC, PLT',
|
||||
dataDetail: [
|
||||
{
|
||||
idDetail: 1,
|
||||
dataAlat: {
|
||||
idAlat: 1,
|
||||
namaAlat: 'Hema 01',
|
||||
},
|
||||
dataAssay: [
|
||||
{
|
||||
idAssay: 1,
|
||||
namaAssay: 'Xn500'
|
||||
},
|
||||
{
|
||||
idAssay: 2,
|
||||
namaAssay: 'HGB'
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
idDetail: 2,
|
||||
dataAlat: {
|
||||
idAlat: 3,
|
||||
namaAlat: 'Cobas C311',
|
||||
},
|
||||
dataAssay: [
|
||||
{
|
||||
idAssay: 3,
|
||||
namaAssay: 'WBC'
|
||||
},
|
||||
{
|
||||
idAssay: 4,
|
||||
namaAssay: 'RBC'
|
||||
},
|
||||
{
|
||||
idAssay: 5,
|
||||
namaAssay: 'PLT'
|
||||
},
|
||||
],
|
||||
}
|
||||
],
|
||||
},
|
||||
],
|
||||
showDialogAdd: false,
|
||||
kodeAdd: '',
|
||||
e_kode: '',
|
||||
namaAdd: '',
|
||||
e_nama: '',
|
||||
hargaAdd: '',
|
||||
e_harga: '',
|
||||
formAddArray: [],
|
||||
formEditArray: [],
|
||||
showDialogEdit: false,
|
||||
objForm: {
|
||||
nama: '',
|
||||
kode: '',
|
||||
harga: '',
|
||||
alat: {},
|
||||
assay: []
|
||||
},
|
||||
objFormEdit: {
|
||||
nama: '',
|
||||
kode: '',
|
||||
harga: '',
|
||||
alat: {},
|
||||
assay: []
|
||||
},
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
formDetail(action) {
|
||||
if (action === 'add') {
|
||||
const lastId = this.formAddArray.length;
|
||||
this.formAddArray.push({
|
||||
idForm: lastId + 1,
|
||||
openAlat: false,
|
||||
dataAlatForm: this.dataAlat,
|
||||
selectedAlat: {
|
||||
idAlat: -1,
|
||||
namaAlat: 'Alat'
|
||||
},
|
||||
selectedAssay: [],
|
||||
searchAssay: "",
|
||||
filterItemAssay: this.dataAssay,
|
||||
dataAssayForm: this.dataAssay,
|
||||
openAssayAdd: false,
|
||||
})
|
||||
} else {
|
||||
const lastId = this.formEditArray.length;
|
||||
this.formEditArray.push({
|
||||
idForm: lastId + 1,
|
||||
openAlat: false,
|
||||
dataAlatForm: this.dataAlat,
|
||||
selectedAlat: {
|
||||
idAlat: -1,
|
||||
namaAlat: 'Alat'
|
||||
},
|
||||
selectedAssay: [],
|
||||
searchAssay: "",
|
||||
filterItemAssay: this.dataAssay,
|
||||
dataAssayForm: this.dataAssay,
|
||||
openAssayAdd: false,
|
||||
})
|
||||
}
|
||||
},
|
||||
filterItemAssay(idx, formItem, action) {
|
||||
if (action === 'add') {
|
||||
let formId = formItem.idForm
|
||||
// console.log('formItem ',formItem)
|
||||
let targetForm = this.formAddArray.find(e => e.idForm === formId);
|
||||
|
||||
if (targetForm) {
|
||||
targetForm.openAssayAdd = true
|
||||
let searchTerm = targetForm.searchAssay ? targetForm.searchAssay.toLowerCase() : "";
|
||||
targetForm.filterItemAssay = targetForm.dataAssayForm.filter(item =>
|
||||
item.namaAssay.toLowerCase().includes(searchTerm)
|
||||
);
|
||||
|
||||
// targetForm.dataAssayForm = targetForm.filterItemAssay
|
||||
console.log('Filtered Assay:', targetForm.filterItemAssay);
|
||||
} else {
|
||||
console.warn('Tidak match ID Form nya');
|
||||
}
|
||||
} else {
|
||||
let formId = formItem.idForm
|
||||
// console.log('formItem ',formItem)
|
||||
let targetForm = this.formEditArray.find(e => e.idForm === formId);
|
||||
|
||||
if (targetForm) {
|
||||
targetForm.openAssayAdd = true
|
||||
let searchTerm = targetForm.searchAssay ? targetForm.searchAssay.toLowerCase() : "";
|
||||
targetForm.filterItemAssay = targetForm.dataAssayForm.filter(item =>
|
||||
item.namaAssay.toLowerCase().includes(searchTerm)
|
||||
);
|
||||
|
||||
// targetForm.dataAssayForm = targetForm.filterItemAssay
|
||||
console.log('Filtered Assay:', targetForm.filterItemAssay);
|
||||
} else {
|
||||
console.warn('Tidak match ID Form nya');
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
addItemAssayToForm(item, idForm, action) {
|
||||
if (action === 'add') {
|
||||
let form = this.formAddArray.find(f => f.idForm === idForm);
|
||||
|
||||
if (form) {
|
||||
let exists = form.selectedAssay.some(a => a.idAssay === item.idAssay);
|
||||
if (!exists) {
|
||||
form.selectedAssay.push(item);
|
||||
} else {
|
||||
console.warn("Item sudah dipilih:", item);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
let form = this.formEditArray.find(f => f.idForm === idForm);
|
||||
|
||||
if (form) {
|
||||
let exists = form.selectedAssay.some(a => a.idAssay === item.idAssay);
|
||||
if (!exists) {
|
||||
form.selectedAssay.push(item);
|
||||
} else {
|
||||
console.warn("Item sudah dipilih:", item);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
removeItemAssayToForm(idForm, index, action) {
|
||||
if (action === 'add') {
|
||||
let form = this.formAddArray.find(f => f.idForm === idForm);
|
||||
if (!form) return;
|
||||
|
||||
form.selectedAssay.splice(index, 1);
|
||||
} else {
|
||||
let form = this.formEditArray.find(f => f.idForm === idForm);
|
||||
if (!form) return;
|
||||
|
||||
form.selectedAssay.splice(index, 1);
|
||||
}
|
||||
},
|
||||
closeDialog() {
|
||||
this.formAddArray = []
|
||||
this.kodeAdd = ''
|
||||
this.namaAdd = ''
|
||||
this.hargaAdd = ''
|
||||
this.objForm = {
|
||||
nama: '',
|
||||
kode: '',
|
||||
harga: '',
|
||||
dataAssay: [],
|
||||
}
|
||||
this.showDialogAdd = false
|
||||
},
|
||||
saveA() {
|
||||
this.objForm.alat = this.formAddArray.map(form => form.selectedAlat);
|
||||
this.objForm.assay = this.formAddArray.map(form => form.selectedAssay);
|
||||
|
||||
console.log('Data yang disimpan:', this.objForm);
|
||||
},
|
||||
saveE() {
|
||||
this.objFormEdit.alat = this.formEditArray.map(form => form.selectedAlat);
|
||||
this.objFormEdit.assay = this.formEditArray.map(form => form.selectedAssay);
|
||||
|
||||
console.log('Data Edit yang disimpan:', this.objFormEdit);
|
||||
},
|
||||
deleteData(){
|
||||
console.log('hapus record ke database')
|
||||
},
|
||||
onChangeInstrument(item, idForm, action) {
|
||||
if (action === 'add') {
|
||||
let form = this.formAddArray.find(f => f.idForm === idForm);
|
||||
if (!form) return;
|
||||
|
||||
form.selectedAlat = {
|
||||
idAlat: item.idAlat,
|
||||
namaAlat: item.namaAlat
|
||||
}
|
||||
|
||||
form.openAlat = false
|
||||
} else {
|
||||
let form = this.formEditArray.find(f => f.idForm === idForm);
|
||||
if (!form) return;
|
||||
|
||||
form.selectedAlat = {
|
||||
idAlat: item.idAlat,
|
||||
namaAlat: item.namaAlat
|
||||
}
|
||||
|
||||
form.openAlat = false
|
||||
}
|
||||
|
||||
},
|
||||
onChangeNamaAdd() {
|
||||
this.objForm.nama = this.namaAdd;
|
||||
},
|
||||
onChangeNamaEdit() {
|
||||
this.objFormEdit.nama = this.e_nama;
|
||||
},
|
||||
onChangeKodeAdd() {
|
||||
this.objForm.kode = this.kodeAdd;
|
||||
},
|
||||
onChangeKodeEdit() {
|
||||
this.objFormEdit.kode = this.e_kode;
|
||||
},
|
||||
onChangeHargaAdd() {
|
||||
this.objForm.harga = this.hargaAdd;
|
||||
},
|
||||
onChangeHargaEdit() {
|
||||
this.objFormEdit.harga = this.e_harga;
|
||||
},
|
||||
openModalEdit(item) {
|
||||
console.log('edit item', item)
|
||||
this.e_harga = item.harga
|
||||
this.e_kode = item.kode
|
||||
this.e_nama = item.namaPemeriksaan
|
||||
|
||||
this.formEditArray = [];
|
||||
item.dataDetail.forEach((detail, index) => {
|
||||
this.formEditArray.push({
|
||||
idForm: detail.idDetail,
|
||||
openAlat: false,
|
||||
dataAlatForm: this.dataAlat,
|
||||
selectedAlat: {
|
||||
idAlat: detail.dataAlat.idAlat,
|
||||
namaAlat: detail.dataAlat.namaAlat,
|
||||
},
|
||||
selectedAssay: detail.dataAssay,
|
||||
searchAssay: "",
|
||||
filterItemAssay: [...this.dataAssay],
|
||||
dataAssayForm: [...this.dataAssay],
|
||||
openAssayAdd: false,
|
||||
});
|
||||
})
|
||||
|
||||
|
||||
console.log('formEditArray', this.formEditArray);
|
||||
this.showDialogEdit = !this.showDialogEdit;
|
||||
},
|
||||
closeDialogEdit() {
|
||||
this.formEditArray = []
|
||||
this.e_harga = ''
|
||||
this.e_kode = ''
|
||||
this.e_nama = ''
|
||||
this.objFormEdit = {
|
||||
nama: '',
|
||||
kode: '',
|
||||
harga: '',
|
||||
dataAssay: [],
|
||||
}
|
||||
this.showDialogEdit = false
|
||||
},
|
||||
editMobilePage(item){
|
||||
var json = JSON.stringify(item);
|
||||
localStorage.setItem('itemEditMobile', json);
|
||||
window.location.href = "master_data_mobile_edit.html"
|
||||
},
|
||||
// 2. Fungsi End
|
||||
}))
|
||||
})
|
||||
149
v1-test-cmp/js/master_data_mobile_add.js
Normal file
149
v1-test-cmp/js/master_data_mobile_add.js
Normal file
@@ -0,0 +1,149 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('masterDataPageMobileAdd', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
dataAssay: [
|
||||
{
|
||||
idAssay: 1,
|
||||
namaAssay: 'Xn500'
|
||||
},
|
||||
{
|
||||
idAssay: 2,
|
||||
namaAssay: 'HGB'
|
||||
},
|
||||
{
|
||||
idAssay: 3,
|
||||
namaAssay: 'WBC'
|
||||
},
|
||||
{
|
||||
idAssay: 4,
|
||||
namaAssay: 'RBC'
|
||||
},
|
||||
{
|
||||
idAssay: 5,
|
||||
namaAssay: 'PLT'
|
||||
},
|
||||
],
|
||||
dataAlat: [
|
||||
{
|
||||
idAlat: 1,
|
||||
namaAlat: 'Hema 01',
|
||||
},
|
||||
{
|
||||
idAlat: 2,
|
||||
namaAlat: 'Axsym',
|
||||
},
|
||||
{
|
||||
idAlat: 3,
|
||||
namaAlat: 'Cobas C311',
|
||||
},
|
||||
],
|
||||
kodeAdd: '',
|
||||
namaAdd: '',
|
||||
hargaAdd: '',
|
||||
formAddArray: [],
|
||||
objForm: {
|
||||
nama: '',
|
||||
kode: '',
|
||||
harga: '',
|
||||
alat: {},
|
||||
assay: []
|
||||
},
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
formDetail(action) {
|
||||
if (action === 'add') {
|
||||
const lastId = this.formAddArray.length;
|
||||
this.formAddArray.push({
|
||||
idForm: lastId + 1,
|
||||
openAlat: false,
|
||||
dataAlatForm: this.dataAlat,
|
||||
selectedAlat: {
|
||||
idAlat: -1,
|
||||
namaAlat: 'Alat'
|
||||
},
|
||||
selectedAssay: [],
|
||||
searchAssay: "",
|
||||
filterItemAssay: this.dataAssay,
|
||||
dataAssayForm: this.dataAssay,
|
||||
openAssayAdd: false,
|
||||
})
|
||||
}
|
||||
},
|
||||
filterItemAssay(idx, formItem, action) {
|
||||
if (action === 'add') {
|
||||
let formId = formItem.idForm
|
||||
// console.log('formItem ',formItem)
|
||||
let targetForm = this.formAddArray.find(e => e.idForm === formId);
|
||||
|
||||
if (targetForm) {
|
||||
targetForm.openAssayAdd = true
|
||||
let searchTerm = targetForm.searchAssay ? targetForm.searchAssay.toLowerCase() : "";
|
||||
targetForm.filterItemAssay = targetForm.dataAssayForm.filter(item =>
|
||||
item.namaAssay.toLowerCase().includes(searchTerm)
|
||||
);
|
||||
|
||||
// targetForm.dataAssayForm = targetForm.filterItemAssay
|
||||
console.log('Filtered Assay:', targetForm.filterItemAssay);
|
||||
} else {
|
||||
console.warn('Tidak match ID Form nya');
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
addItemAssayToForm(item, idForm, action) {
|
||||
if (action === 'add') {
|
||||
let form = this.formAddArray.find(f => f.idForm === idForm);
|
||||
|
||||
if (form) {
|
||||
let exists = form.selectedAssay.some(a => a.idAssay === item.idAssay);
|
||||
if (!exists) {
|
||||
form.selectedAssay.push(item);
|
||||
} else {
|
||||
console.warn("Item sudah dipilih:", item);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
removeItemAssayToForm(idForm, index, action) {
|
||||
if (action === 'add') {
|
||||
let form = this.formAddArray.find(f => f.idForm === idForm);
|
||||
if (!form) return;
|
||||
|
||||
form.selectedAssay.splice(index, 1);
|
||||
}
|
||||
},
|
||||
saveA() {
|
||||
this.objForm.alat = this.formAddArray.map(form => form.selectedAlat);
|
||||
this.objForm.assay = this.formAddArray.map(form => form.selectedAssay);
|
||||
|
||||
console.log('Data yang disimpan:', this.objForm);
|
||||
},
|
||||
onChangeInstrument(item, idForm, action) {
|
||||
if (action === 'add') {
|
||||
let form = this.formAddArray.find(f => f.idForm === idForm);
|
||||
if (!form) return;
|
||||
|
||||
form.selectedAlat = {
|
||||
idAlat: item.idAlat,
|
||||
namaAlat: item.namaAlat
|
||||
}
|
||||
|
||||
form.openAlat = false
|
||||
}
|
||||
},
|
||||
onChangeNamaAdd() {
|
||||
this.objForm.nama = this.namaAdd;
|
||||
},
|
||||
onChangeKodeAdd() {
|
||||
this.objForm.kode = this.kodeAdd;
|
||||
},
|
||||
onChangeHargaAdd() {
|
||||
this.objForm.harga = this.hargaAdd;
|
||||
},
|
||||
}))
|
||||
})
|
||||
195
v1-test-cmp/js/master_data_mobile_edit.js
Normal file
195
v1-test-cmp/js/master_data_mobile_edit.js
Normal file
@@ -0,0 +1,195 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('masterDataPageMobileEdit', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
let itemEdit = localStorage.getItem('itemEditMobile');
|
||||
if (itemEdit) {
|
||||
let json = JSON.parse(itemEdit);
|
||||
|
||||
this.e_harga = json.harga
|
||||
this.e_kode = json.kode
|
||||
this.e_nama = json.namaPemeriksaan
|
||||
|
||||
this.formEditArray = [];
|
||||
json.dataDetail.forEach((detail, index) => {
|
||||
this.formEditArray.push({
|
||||
idForm: detail.idDetail,
|
||||
openAlat: false,
|
||||
dataAlatForm: this.dataAlat,
|
||||
selectedAlat: {
|
||||
idAlat: detail.dataAlat.idAlat,
|
||||
namaAlat: detail.dataAlat.namaAlat,
|
||||
},
|
||||
selectedAssay: detail.dataAssay,
|
||||
searchAssay: "",
|
||||
filterItemAssay: [...this.dataAssay],
|
||||
dataAssayForm: [...this.dataAssay],
|
||||
openAssayAdd: false,
|
||||
});
|
||||
})
|
||||
|
||||
console.log('formEditArray', this.formEditArray);
|
||||
}
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
dataAssay: [
|
||||
{
|
||||
idAssay: 1,
|
||||
namaAssay: 'Xn500'
|
||||
},
|
||||
{
|
||||
idAssay: 2,
|
||||
namaAssay: 'HGB'
|
||||
},
|
||||
{
|
||||
idAssay: 3,
|
||||
namaAssay: 'WBC'
|
||||
},
|
||||
{
|
||||
idAssay: 4,
|
||||
namaAssay: 'RBC'
|
||||
},
|
||||
{
|
||||
idAssay: 5,
|
||||
namaAssay: 'PLT'
|
||||
},
|
||||
],
|
||||
dataAlat: [
|
||||
{
|
||||
idAlat: 1,
|
||||
namaAlat: 'Hema 01',
|
||||
},
|
||||
{
|
||||
idAlat: 2,
|
||||
namaAlat: 'Axsym',
|
||||
},
|
||||
{
|
||||
idAlat: 3,
|
||||
namaAlat: 'Cobas C311',
|
||||
},
|
||||
],
|
||||
e_kode: '',
|
||||
e_nama: '',
|
||||
e_harga: '',
|
||||
formEditArray: [],
|
||||
objFormEdit: {
|
||||
nama: '',
|
||||
kode: '',
|
||||
harga: '',
|
||||
alat: {},
|
||||
assay: []
|
||||
},
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
formDetail(action) {
|
||||
if (action === 'edit') {
|
||||
const lastId = this.formEditArray.length;
|
||||
this.formEditArray.push({
|
||||
idForm: lastId + 1,
|
||||
openAlat: false,
|
||||
dataAlatForm: this.dataAlat,
|
||||
selectedAlat: {
|
||||
idAlat: -1,
|
||||
namaAlat: 'Alat'
|
||||
},
|
||||
selectedAssay: [],
|
||||
searchAssay: "",
|
||||
filterItemAssay: this.dataAssay,
|
||||
dataAssayForm: this.dataAssay,
|
||||
openAssayAdd: false,
|
||||
})
|
||||
}
|
||||
},
|
||||
filterItemAssay(idx, formItem, action) {
|
||||
if (action === 'edit') {
|
||||
let formId = formItem.idForm
|
||||
// console.log('formItem ',formItem)
|
||||
let targetForm = this.formEditArray.find(e => e.idForm === formId);
|
||||
|
||||
if (targetForm) {
|
||||
targetForm.openAssayAdd = true
|
||||
let searchTerm = targetForm.searchAssay ? targetForm.searchAssay.toLowerCase() : "";
|
||||
targetForm.filterItemAssay = targetForm.dataAssayForm.filter(item =>
|
||||
item.namaAssay.toLowerCase().includes(searchTerm)
|
||||
);
|
||||
|
||||
// targetForm.dataAssayForm = targetForm.filterItemAssay
|
||||
console.log('Filtered Assay:', targetForm.filterItemAssay);
|
||||
} else {
|
||||
console.warn('Tidak match ID Form nya');
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
addItemAssayToForm(item, idForm, action) {
|
||||
if (action === 'edit') {
|
||||
let form = this.formEditArray.find(f => f.idForm === idForm);
|
||||
|
||||
if (form) {
|
||||
let exists = form.selectedAssay.some(a => a.idAssay === item.idAssay);
|
||||
if (!exists) {
|
||||
form.selectedAssay.push(item);
|
||||
} else {
|
||||
console.warn("Item sudah dipilih:", item);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
removeItemAssayToForm(idForm, index, action) {
|
||||
if (action === 'edit') {
|
||||
let form = this.formEditArray.find(f => f.idForm === idForm);
|
||||
if (!form) return;
|
||||
|
||||
form.selectedAssay.splice(index, 1);
|
||||
}
|
||||
},
|
||||
|
||||
saveE() {
|
||||
this.objFormEdit.alat = this.formEditArray.map(form => form.selectedAlat);
|
||||
this.objFormEdit.assay = this.formEditArray.map(form => form.selectedAssay);
|
||||
|
||||
console.log('Data Edit yang disimpan:', this.objFormEdit);
|
||||
},
|
||||
|
||||
deleteData() {
|
||||
console.log('hapus record ke database')
|
||||
},
|
||||
|
||||
onChangeInstrument(item, idForm, action) {
|
||||
if (action === 'edit') {
|
||||
let form = this.formEditArray.find(f => f.idForm === idForm);
|
||||
if (!form) return;
|
||||
|
||||
form.selectedAlat = {
|
||||
idAlat: item.idAlat,
|
||||
namaAlat: item.namaAlat
|
||||
}
|
||||
|
||||
form.openAlat = false
|
||||
}
|
||||
},
|
||||
onChangeNamaEdit() {
|
||||
this.objFormEdit.nama = this.e_nama;
|
||||
},
|
||||
onChangeKodeEdit() {
|
||||
this.objFormEdit.kode = this.e_kode;
|
||||
},
|
||||
onChangeHargaEdit() {
|
||||
this.objFormEdit.harga = this.e_harga;
|
||||
},
|
||||
closeDialogEdit() {
|
||||
this.formEditArray = []
|
||||
this.e_harga = ''
|
||||
this.e_kode = ''
|
||||
this.e_nama = ''
|
||||
this.objFormEdit = {
|
||||
nama: '',
|
||||
kode: '',
|
||||
harga: '',
|
||||
dataAssay: [],
|
||||
}
|
||||
this.showDialogEdit = false
|
||||
},
|
||||
}))
|
||||
})
|
||||
231
v1-test-cmp/js/mcoba.js
Normal file
231
v1-test-cmp/js/mcoba.js
Normal file
@@ -0,0 +1,231 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('masterData', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
// multiple select
|
||||
dataAssay: [
|
||||
{
|
||||
idAssay: 1,
|
||||
namaAssay: 'Xn500'
|
||||
},
|
||||
{
|
||||
idAssay: 2,
|
||||
namaAssay: 'HGB'
|
||||
},
|
||||
{
|
||||
idAssay: 3,
|
||||
namaAssay: 'WBC'
|
||||
},
|
||||
{
|
||||
idAssay: 4,
|
||||
namaAssay: 'RBC'
|
||||
},
|
||||
{
|
||||
idAssay: 5,
|
||||
namaAssay: 'PLT'
|
||||
},
|
||||
],
|
||||
dataAlat: [
|
||||
{
|
||||
idAlat: 1,
|
||||
namaAlat: 'Hema 01',
|
||||
},
|
||||
{
|
||||
idAlat: 2,
|
||||
namaAlat: 'Axsym',
|
||||
},
|
||||
{
|
||||
idAlat: 3,
|
||||
namaAlat: 'Cobas C311',
|
||||
},
|
||||
],
|
||||
|
||||
// multiple select
|
||||
dataMaster: [
|
||||
{
|
||||
idMaster: 1,
|
||||
kode: 'A04',
|
||||
namaPemeriksaan: 'Darah Lengkap',
|
||||
harga: '50.000',
|
||||
pemeriksaanStr: 'Xn500, HCB, WBC, RBC, PLT',
|
||||
dataAssay: [
|
||||
{
|
||||
idAssay: 1,
|
||||
namaAssay: 'Xn500'
|
||||
},
|
||||
{
|
||||
idAssay: 2,
|
||||
namaAssay: 'HGB'
|
||||
},
|
||||
{
|
||||
idAssay: 3,
|
||||
namaAssay: 'WBC'
|
||||
},
|
||||
{
|
||||
idAssay: 4,
|
||||
namaAssay: 'RBC'
|
||||
},
|
||||
{
|
||||
idAssay: 5,
|
||||
namaAssay: 'PLT'
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
showDialogAdd: false,
|
||||
kodeAdd: '',
|
||||
namaAdd: '',
|
||||
hargaAdd: '',
|
||||
formAddArray: [],
|
||||
showDialogEdit: false,
|
||||
objForm: {
|
||||
nama: '',
|
||||
kode: '',
|
||||
harga: '',
|
||||
alat: {},
|
||||
assay: []
|
||||
},
|
||||
objFormEdit: {
|
||||
nama: '',
|
||||
kode: '',
|
||||
harga: '',
|
||||
dataAssay: [],
|
||||
},
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
formAddDetail() {
|
||||
const lastId = this.formAddArray.length;
|
||||
this.formAddArray.push({
|
||||
idForm: lastId + 1,
|
||||
openAlat: false,
|
||||
dataAlatForm: this.dataAlat,
|
||||
selectedAlat: {
|
||||
idAlat: -1,
|
||||
namaAlat: 'Alat'
|
||||
},
|
||||
selectedAssay: [],
|
||||
searchAssay: "",
|
||||
filterItemAssay: this.dataAssay,
|
||||
dataAssayForm: this.dataAssay,
|
||||
openAssayAdd: false,
|
||||
})
|
||||
},
|
||||
filterItemAssay(idx, formItem) {
|
||||
let formId = formItem.idForm
|
||||
// console.log('formItem ',formItem)
|
||||
let targetForm = this.formAddArray.find(e => e.idForm === formId);
|
||||
|
||||
if (targetForm) {
|
||||
targetForm.openAssayAdd = true
|
||||
let searchTerm = targetForm.searchAssay ? targetForm.searchAssay.toLowerCase() : "";
|
||||
targetForm.filterItemAssay = targetForm.dataAssayForm.filter(item =>
|
||||
item.namaAssay.toLowerCase().includes(searchTerm)
|
||||
);
|
||||
|
||||
// targetForm.dataAssayForm = targetForm.filterItemAssay
|
||||
console.log('Filtered Assay:', targetForm.filterItemAssay);
|
||||
} else {
|
||||
console.warn('Tidak match ID Form nya');
|
||||
}
|
||||
},
|
||||
|
||||
addItemAssayToForm(item, idForm) {
|
||||
let form = this.formAddArray.find(f => f.idForm === idForm);
|
||||
|
||||
if (form) {
|
||||
let exists = form.selectedAssay.some(a => a.idAssay === item.idAssay);
|
||||
if (!exists) {
|
||||
form.selectedAssay.push(item);
|
||||
} else {
|
||||
console.warn("Item sudah dipilih:", item);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
removeItemAssayToForm(idForm, index) {
|
||||
let form = this.formAddArray.find(f => f.idForm === idForm);
|
||||
if (!form) return;
|
||||
|
||||
form.selectedAssay.splice(index, 1);
|
||||
},
|
||||
closeDialog() {
|
||||
this.formAddArray = []
|
||||
this.kodeAdd = ''
|
||||
this.namaAdd = ''
|
||||
this.hargaAdd = ''
|
||||
this.objForm = {
|
||||
nama: '',
|
||||
kode: '',
|
||||
harga: '',
|
||||
dataAssay: [],
|
||||
}
|
||||
this.showDialogAdd = false
|
||||
},
|
||||
saveA() {
|
||||
this.objForm.alat = this.formAddArray.map(form => form.selectedAlat);
|
||||
this.objForm.assay = this.formAddArray.map(form => form.selectedAssay);
|
||||
|
||||
console.log('Data yang disimpan:', this.objForm);
|
||||
},
|
||||
onChangeInstrument(item, idForm) {
|
||||
let form = this.formAddArray.find(f => f.idForm === idForm);
|
||||
if (!form) return;
|
||||
|
||||
form.selectedAlat = {
|
||||
idAlat: item.idAlat,
|
||||
namaAlat: item.namaAlat
|
||||
}
|
||||
|
||||
form.openAlat = false
|
||||
},
|
||||
onChangeInstrumentEdit(item) {
|
||||
this.openInstrument = false;
|
||||
this.selectedInstrumentEdit = item;
|
||||
},
|
||||
onChangeNamaAdd() {
|
||||
this.objForm.nama = this.namaAdd;
|
||||
},
|
||||
onChangeNamaEdit() {
|
||||
this.objFormEdit.nama = this.e_nama;
|
||||
},
|
||||
onChangeKodeAdd() {
|
||||
this.objForm.kode = this.kodeAdd;
|
||||
},
|
||||
onChangeKodeEdit() {
|
||||
this.objFormEdit.kode = this.e_kode;
|
||||
},
|
||||
onChangeHargaAdd() {
|
||||
this.objForm.harga = this.hargaAdd;
|
||||
},
|
||||
onChangeHargaEdit() {
|
||||
this.objFormEdit.harga = this.e_harga;
|
||||
},
|
||||
openModalEdit(item) {
|
||||
// mrn
|
||||
this.e_mrn = item.mrn
|
||||
|
||||
// sid
|
||||
this.e_sid = item.sid
|
||||
|
||||
// name
|
||||
this.e_name = item.name
|
||||
|
||||
// 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 = "order_mobile_edit.html";
|
||||
},
|
||||
// 2. Fungsi End
|
||||
}))
|
||||
})
|
||||
674
v1-test-cmp/js/order.js
Normal file
674
v1-test-cmp/js/order.js
Normal file
@@ -0,0 +1,674 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('order', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
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 = "order_mobile_edit.html";
|
||||
},
|
||||
// 2. Fungsi End
|
||||
}))
|
||||
})
|
||||
674
v1-test-cmp/js/order_mobile_add.js
Normal file
674
v1-test-cmp/js/order_mobile_add.js
Normal file
@@ -0,0 +1,674 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('orderMobileAdd', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
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
|
||||
}))
|
||||
})
|
||||
710
v1-test-cmp/js/order_mobile_edit.js
Normal file
710
v1-test-cmp/js/order_mobile_edit.js
Normal file
@@ -0,0 +1,710 @@
|
||||
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
|
||||
}))
|
||||
})
|
||||
168
v1-test-cmp/js/result.js
Normal file
168
v1-test-cmp/js/result.js
Normal file
@@ -0,0 +1,168 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('result', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
dataSetting: [
|
||||
{
|
||||
idSetting: 1,
|
||||
idJenis: 1,
|
||||
namaJenis: 'TCP Server',
|
||||
info: 'Port 5001',
|
||||
port: '5001',
|
||||
idInterface: 1,
|
||||
namaInterface: 'XN550',
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
server: '',
|
||||
idSerial: -1,
|
||||
namaSerial: '',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
},
|
||||
{
|
||||
idSetting: 2,
|
||||
idJenis: 2,
|
||||
namaJenis: 'TCP Client',
|
||||
info: 'Server 192.168.0.1, Port 4000',
|
||||
port: '4000',
|
||||
idInterface: 2,
|
||||
namaInterface: 'Axsym',
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
server: '192.168.0.1',
|
||||
idSerial: 1,
|
||||
namaSerial: 'ttyS0',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
},
|
||||
{
|
||||
idSetting: 3,
|
||||
idJenis: 3,
|
||||
namaJenis: 'RS232',
|
||||
info: 'ttyS01, 9600, N, 8, 1',
|
||||
port: '',
|
||||
idInterface: 3,
|
||||
namaInterface: 'C311',
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
server: '',
|
||||
idSerial: 1,
|
||||
namaSerial: 'ttyS0',
|
||||
speed: '19200',
|
||||
idParity: 1,
|
||||
namaParity: 'None',
|
||||
idDataBit: 2,
|
||||
namaDataBit: '6',
|
||||
idStopBit: 2,
|
||||
namaStopBit: '1'
|
||||
},
|
||||
],
|
||||
rawData: false,
|
||||
rawDataMobile: false,
|
||||
showDialogAdd: false,
|
||||
showDialogEdit: false,
|
||||
loadingVerifikasi: false,
|
||||
isVerifikasiDone: false,
|
||||
sampleID: '',
|
||||
decimalFontEdit: '',
|
||||
assayCodeEdit: '',
|
||||
decimalFont: '',
|
||||
assayCode: '',
|
||||
formulaEdit: '',
|
||||
formulaAdd: '',
|
||||
dataResult: [
|
||||
{
|
||||
idResult: 1,
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
sampleID: '20251209',
|
||||
assayNo: 'WBC',
|
||||
result: '100',
|
||||
date: '2025-05-01 08:00:01',
|
||||
logs: '',
|
||||
},
|
||||
{
|
||||
idResult: 2,
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
sampleID: '20251209',
|
||||
assayNo: 'IgG',
|
||||
result: '20',
|
||||
date: '2025-05-01 08:00:01',
|
||||
logs: ''
|
||||
},
|
||||
{
|
||||
idResult: 3,
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
sampleID: '20251209',
|
||||
assayNo: 'TBIL',
|
||||
result: '12',
|
||||
date: '2025-05-01 08:00:01',
|
||||
logs: ''
|
||||
},
|
||||
],
|
||||
selectedRawData: {
|
||||
idResult: -1,
|
||||
idInstrument: -1,
|
||||
namaInstrument: '',
|
||||
sampleID: '',
|
||||
assayNo: '',
|
||||
result: '',
|
||||
date: '',
|
||||
logs: '',
|
||||
},
|
||||
selectedInstrument: {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
},
|
||||
openInstrumentSearchMobile: false,
|
||||
openInstrumentSearch: false,
|
||||
dataInstrument: [
|
||||
{
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
},
|
||||
{
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
},
|
||||
{
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
},
|
||||
],
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
onChangeInstrumentSearch(item) {
|
||||
this.openInstrumentSearch = false;
|
||||
this.selectedInstrument = item;
|
||||
},
|
||||
onChangeInstrumentMobile(item) {
|
||||
this.openInstrumentSearchMobile = false;
|
||||
// this.selectedInstrument = item;
|
||||
this.selectedInstrument = { ...item };
|
||||
},
|
||||
openModalRawData(item){
|
||||
this.selectedRawData = item
|
||||
this.rawData = true
|
||||
},
|
||||
closeDialog(){
|
||||
this.rawData = false
|
||||
},
|
||||
// 2. Fungsi End
|
||||
}))
|
||||
})
|
||||
370
v1-test-cmp/js/settings.js
Normal file
370
v1-test-cmp/js/settings.js
Normal file
@@ -0,0 +1,370 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('settingsPage', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init(){
|
||||
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
showDialogAdd: false,
|
||||
showDialogEdit: false,
|
||||
objAddForm: {
|
||||
// idJenis 1
|
||||
port: '',
|
||||
idInterface: -1,
|
||||
namaInterface: '',
|
||||
idInstrument: -1,
|
||||
namaInstrument: '',
|
||||
// idJenis 2 ketambahan server
|
||||
server: '',
|
||||
// idJenis 3
|
||||
idSerial: -1,
|
||||
namaSerial: '',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
},
|
||||
dataSetting: [
|
||||
{
|
||||
idSetting: 1,
|
||||
idJenis: 1,
|
||||
namaJenis: 'TCP Server',
|
||||
info: 'Port 5001',
|
||||
port: '5001',
|
||||
idInterface: 1,
|
||||
namaInterface: 'XN550',
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
server: '',
|
||||
idSerial: -1,
|
||||
namaSerial: '',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
},
|
||||
{
|
||||
idSetting: 2,
|
||||
idJenis: 2,
|
||||
namaJenis: 'TCP Client',
|
||||
info: 'Server 192.168.0.1, Port 4000',
|
||||
port: '4000',
|
||||
idInterface: 2,
|
||||
namaInterface: 'Axsym',
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
server: '192.168.0.1',
|
||||
idSerial: 1,
|
||||
namaSerial: 'ttyS0',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
},
|
||||
{
|
||||
idSetting: 3,
|
||||
idJenis: 3,
|
||||
namaJenis: 'RS232',
|
||||
info: 'ttyS01, 9600, N, 8, 1',
|
||||
port: '',
|
||||
idInterface: 3,
|
||||
namaInterface: 'C311',
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
server: '',
|
||||
idSerial: 1,
|
||||
namaSerial: 'ttyS0',
|
||||
speed: '19200',
|
||||
idParity: 1,
|
||||
namaParity: 'None',
|
||||
idDataBit: 2,
|
||||
namaDataBit: '6',
|
||||
idStopBit: 2,
|
||||
namaStopBit: '1'
|
||||
},
|
||||
],
|
||||
selectedJenis: {
|
||||
idJenis: -1,
|
||||
namaJenis: 'Jenis'
|
||||
},
|
||||
openJenis: false,
|
||||
dataJenis: [
|
||||
{
|
||||
idJenis: 1,
|
||||
namaJenis: 'TCP Server',
|
||||
},
|
||||
{
|
||||
idJenis: 2,
|
||||
namaJenis: 'TCP Client',
|
||||
},
|
||||
{
|
||||
idJenis: 3,
|
||||
namaJenis: 'RS232',
|
||||
},
|
||||
],
|
||||
selectedInterface: {
|
||||
idInterface: -1,
|
||||
namaInterface: 'Interface'
|
||||
},
|
||||
openInterface: false,
|
||||
dataInterface: [
|
||||
{
|
||||
idInterface: 1,
|
||||
namaInterface: 'XN550',
|
||||
},
|
||||
{
|
||||
idInterface: 2,
|
||||
namaInterface: 'Axsym',
|
||||
},
|
||||
{
|
||||
idInterface: 3,
|
||||
namaInterface: 'C311',
|
||||
},
|
||||
],
|
||||
selectedInstrument: {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
},
|
||||
openInstrument: false,
|
||||
dataInstrument: [
|
||||
{
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
},
|
||||
{
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
},
|
||||
{
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
},
|
||||
],
|
||||
selectedSerial: {
|
||||
idSerial: -1,
|
||||
namaSerial: 'Serial'
|
||||
},
|
||||
openSerial: false,
|
||||
dataSerial: [
|
||||
{
|
||||
idSerial: 1,
|
||||
namaSerial: 'ttyS0'
|
||||
},
|
||||
{
|
||||
idSerial: 2,
|
||||
namaSerial: 'psx3'
|
||||
},
|
||||
],
|
||||
selectedParity: {
|
||||
idParity: -1,
|
||||
namaParity: 'Parity'
|
||||
},
|
||||
openParity: false,
|
||||
dataParity: [
|
||||
{
|
||||
idParity: 1,
|
||||
namaParity: 'None'
|
||||
},
|
||||
{
|
||||
idParity: 2,
|
||||
namaParity: 'All'
|
||||
},
|
||||
],
|
||||
selectedDataBit: {
|
||||
idDataBit: -1,
|
||||
namaDataBit: 'DataBit'
|
||||
},
|
||||
openDataBit: false,
|
||||
dataDataBit: [
|
||||
{
|
||||
idDataBit: 1,
|
||||
namaDataBit: '1'
|
||||
},
|
||||
{
|
||||
idDataBit: 2,
|
||||
namaDataBit: '6'
|
||||
},
|
||||
],
|
||||
selectedStopBit: {
|
||||
idStopBit: -1,
|
||||
namaStopBit: 'StopBit'
|
||||
},
|
||||
openStopBit: false,
|
||||
dataStopBit: [
|
||||
{
|
||||
idStopBit: 1,
|
||||
namaStopBit: '0'
|
||||
},
|
||||
{
|
||||
idStopBit: 2,
|
||||
namaStopBit: '1'
|
||||
},
|
||||
],
|
||||
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
closeDialog() {
|
||||
this.openInterface = false;
|
||||
this.openInstrument = false;
|
||||
this.openSerial = false;
|
||||
this.openParity = false;
|
||||
this.openDataBit = false;
|
||||
this.openStopBit = false;
|
||||
this.selectedJenis = {
|
||||
idJenis: -1,
|
||||
namaJenis: 'Jenis'
|
||||
};
|
||||
this.selectedInterface = {
|
||||
idInterface: -1,
|
||||
namaInterface: 'Interface'
|
||||
};
|
||||
this.selectedInstrument = {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
}
|
||||
this.selectedSerial = {
|
||||
idSerial: -1,
|
||||
namaSerial: 'Serial'
|
||||
},
|
||||
this.selectedParity = {
|
||||
idParity: -1,
|
||||
namaParity: 'Parity'
|
||||
},
|
||||
this.selectedDataBit = {
|
||||
idDataBit: -1,
|
||||
namaDataBit: 'DataBit'
|
||||
},
|
||||
this.selectedStopBit = {
|
||||
idStopBit: -1,
|
||||
namaStopBit: 'StopBit'
|
||||
},
|
||||
this.showDialogAdd = false
|
||||
},
|
||||
onChangeJenis(item) {
|
||||
this.openJenis = false;
|
||||
this.selectedJenis = item;
|
||||
|
||||
// clear form
|
||||
this.objAddForm = {
|
||||
port: '',
|
||||
idInterface: -1,
|
||||
namaInterface: '',
|
||||
idInstrument: -1,
|
||||
namaInstrument: '',
|
||||
server: '',
|
||||
idSerial: -1,
|
||||
namaSerial: '',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
};
|
||||
|
||||
// clear selected
|
||||
this.selectedInterface = {
|
||||
idInterface: -1,
|
||||
namaInterface: 'Interface'
|
||||
};
|
||||
this.selectedInstrument = {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
}
|
||||
this.selectedSerial = {
|
||||
idSerial: -1,
|
||||
namaSerial: 'Serial'
|
||||
},
|
||||
this.selectedParity = {
|
||||
idParity: -1,
|
||||
namaParity: 'Parity'
|
||||
},
|
||||
this.selectedDataBit = {
|
||||
idDataBit: -1,
|
||||
namaDataBit: 'DataBit'
|
||||
},
|
||||
this.selectedStopBit = {
|
||||
idStopBit: -1,
|
||||
namaStopBit: 'StopBit'
|
||||
}
|
||||
},
|
||||
onChangeInterface(item) {
|
||||
this.openInterface = false;
|
||||
this.selectedInterface = item;
|
||||
},
|
||||
onChangeInstrument(item) {
|
||||
this.openInstrument = false;
|
||||
this.selectedInstrument = item;
|
||||
},
|
||||
onChangeSerial(item) {
|
||||
this.openSerial = false;
|
||||
this.selectedSerial = item;
|
||||
},
|
||||
onChangeParity(item) {
|
||||
this.openParity = false;
|
||||
this.selectedParity = item;
|
||||
},
|
||||
onChangeDataBit(item) {
|
||||
this.openDataBit = false;
|
||||
this.selectedDataBit = item;
|
||||
},
|
||||
onChangeStopBit(item) {
|
||||
this.openStopBit = false;
|
||||
this.selectedStopBit = item;
|
||||
},
|
||||
openModalEdit(item) {
|
||||
this.selectedJenis = {
|
||||
idJenis: item.idJenis,
|
||||
namaJenis: item.namaJenis,
|
||||
},
|
||||
this.port = item.port
|
||||
this.server = item.server
|
||||
this.selectedInterface = {
|
||||
idInterface: item.idInterface,
|
||||
namaInterface: item.namaInterface
|
||||
}
|
||||
this.selectedInstrument = {
|
||||
idInstrument: item.idInstrument,
|
||||
namaInstrument: item.namaInstrument
|
||||
}
|
||||
this.selectedSerial = {
|
||||
idSerial: item.idSerial,
|
||||
namaSerial: item.namaSerial
|
||||
},
|
||||
this.speed = item.speed
|
||||
this.selectedParity = {
|
||||
idParity: item.idParity,
|
||||
namaParity: item.namaParity
|
||||
},
|
||||
this.selectedDataBit = {
|
||||
idDataBit: item.idDataBit,
|
||||
namaDataBit: item.namaDataBit
|
||||
},
|
||||
this.selectedStopBit = {
|
||||
idStopBit: item.idStopBit,
|
||||
namaStopBit: item.namaStopBit
|
||||
},
|
||||
|
||||
this.showDialogEdit = !this.showDialogEdit;
|
||||
},
|
||||
closeDialogEdit() {
|
||||
this.showDialogEdit = !this.showDialogEdit;
|
||||
},
|
||||
editMobilePage(item) {
|
||||
var json = JSON.stringify(item);
|
||||
localStorage.setItem('itemEditMobile', json);
|
||||
window.location.href = "settings_mobile_edit.html"
|
||||
},
|
||||
// 2. Fungsi End
|
||||
}))
|
||||
})
|
||||
221
v1-test-cmp/js/settings_mobile_add.js
Normal file
221
v1-test-cmp/js/settings_mobile_add.js
Normal file
@@ -0,0 +1,221 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('settingsPageMobileAdd', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
objAddForm: {
|
||||
// idJenis 1
|
||||
port: '',
|
||||
idInterface: -1,
|
||||
namaInterface: '',
|
||||
idInstrument: -1,
|
||||
namaInstrument: '',
|
||||
// idJenis 2 ketambahan server
|
||||
server: '',
|
||||
// idJenis 3
|
||||
idSerial: -1,
|
||||
namaSerial: '',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
},
|
||||
openJenis: false,
|
||||
selectedJenis: {
|
||||
idJenis: -1,
|
||||
namaJenis: 'Jenis'
|
||||
},
|
||||
dataJenis: [
|
||||
{
|
||||
idJenis: 1,
|
||||
namaJenis: 'TCP Server',
|
||||
},
|
||||
{
|
||||
idJenis: 2,
|
||||
namaJenis: 'TCP Client',
|
||||
},
|
||||
{
|
||||
idJenis: 3,
|
||||
namaJenis: 'RS232',
|
||||
},
|
||||
],
|
||||
selectedInterface: {
|
||||
idInterface: -1,
|
||||
namaInterface: 'Interface'
|
||||
},
|
||||
openInterface: false,
|
||||
dataInterface: [
|
||||
{
|
||||
idInterface: 1,
|
||||
namaInterface: 'XN550',
|
||||
},
|
||||
{
|
||||
idInterface: 2,
|
||||
namaInterface: 'Axsym',
|
||||
},
|
||||
{
|
||||
idInterface: 3,
|
||||
namaInterface: 'C311',
|
||||
},
|
||||
],
|
||||
selectedInstrument: {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
},
|
||||
openInstrument: false,
|
||||
dataInstrument: [
|
||||
{
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
},
|
||||
{
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
},
|
||||
{
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
},
|
||||
],
|
||||
selectedSerial: {
|
||||
idSerial: -1,
|
||||
namaSerial: 'Serial'
|
||||
},
|
||||
openSerial: false,
|
||||
dataSerial: [
|
||||
{
|
||||
idSerial: 1,
|
||||
namaSerial: 'ttyS0'
|
||||
},
|
||||
{
|
||||
idSerial: 2,
|
||||
namaSerial: 'psx3'
|
||||
},
|
||||
],
|
||||
selectedParity: {
|
||||
idParity: -1,
|
||||
namaParity: 'Parity'
|
||||
},
|
||||
openParity: false,
|
||||
dataParity: [
|
||||
{
|
||||
idParity: 1,
|
||||
namaParity: 'None'
|
||||
},
|
||||
{
|
||||
idParity: 2,
|
||||
namaParity: 'All'
|
||||
},
|
||||
],
|
||||
selectedDataBit: {
|
||||
idDataBit: -1,
|
||||
namaDataBit: 'DataBit'
|
||||
},
|
||||
openDataBit: false,
|
||||
dataDataBit: [
|
||||
{
|
||||
idDataBit: 1,
|
||||
namaDataBit: '1'
|
||||
},
|
||||
{
|
||||
idDataBit: 2,
|
||||
namaDataBit: '6'
|
||||
},
|
||||
],
|
||||
selectedStopBit: {
|
||||
idStopBit: -1,
|
||||
namaStopBit: 'StopBit'
|
||||
},
|
||||
openStopBit: false,
|
||||
dataStopBit: [
|
||||
{
|
||||
idStopBit: 1,
|
||||
namaStopBit: '0'
|
||||
},
|
||||
{
|
||||
idStopBit: 2,
|
||||
namaStopBit: '1'
|
||||
},
|
||||
],
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
onChangeJenis(item) {
|
||||
this.openJenis = false;
|
||||
this.selectedJenis = item;
|
||||
|
||||
// clear form
|
||||
this.objAddForm = {
|
||||
port: '',
|
||||
idInterface: -1,
|
||||
namaInterface: '',
|
||||
idInstrument: -1,
|
||||
namaInstrument: '',
|
||||
server: '',
|
||||
idSerial: -1,
|
||||
namaSerial: '',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
};
|
||||
|
||||
// clear selected
|
||||
this.selectedInterface = {
|
||||
idInterface: -1,
|
||||
namaInterface: 'Interface'
|
||||
};
|
||||
this.selectedInstrument = {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
}
|
||||
this.selectedSerial = {
|
||||
idSerial: -1,
|
||||
namaSerial: 'Serial'
|
||||
},
|
||||
this.selectedParity = {
|
||||
idParity: -1,
|
||||
namaParity: 'Parity'
|
||||
},
|
||||
this.selectedDataBit = {
|
||||
idDataBit: -1,
|
||||
namaDataBit: 'DataBit'
|
||||
},
|
||||
this.selectedStopBit = {
|
||||
idStopBit: -1,
|
||||
namaStopBit: 'StopBit'
|
||||
}
|
||||
},
|
||||
onChangeInterface(item) {
|
||||
this.openInterface = false;
|
||||
this.selectedInterface = item;
|
||||
},
|
||||
onChangeInstrument(item) {
|
||||
this.openInstrument = false;
|
||||
this.selectedInstrument = item;
|
||||
},
|
||||
onChangeSerial(item) {
|
||||
this.openSerial = false;
|
||||
this.selectedSerial = item;
|
||||
},
|
||||
onChangeParity(item) {
|
||||
this.openParity = false;
|
||||
this.selectedParity = item;
|
||||
},
|
||||
onChangeDataBit(item) {
|
||||
this.openDataBit = false;
|
||||
this.selectedDataBit = item;
|
||||
},
|
||||
onChangeStopBit(item) {
|
||||
this.openStopBit = false;
|
||||
this.selectedStopBit = item;
|
||||
},
|
||||
}))
|
||||
})
|
||||
309
v1-test-cmp/js/settings_mobile_edit.js
Normal file
309
v1-test-cmp/js/settings_mobile_edit.js
Normal file
@@ -0,0 +1,309 @@
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('settingsPageMobileEdit', () => ({
|
||||
// 0. Init dijalankan sebelum inisialisasi
|
||||
init() {
|
||||
let itemEdit = localStorage.getItem('itemEditMobile');
|
||||
if (itemEdit) {
|
||||
let json = JSON.parse(itemEdit);
|
||||
|
||||
this.selectedJenis = {
|
||||
idJenis: json.idJenis || -1,
|
||||
namaJenis: json.namaJenis || 'Jenis'
|
||||
};
|
||||
|
||||
this.port = json.port || '';
|
||||
this.server = json.server || '';
|
||||
|
||||
this.selectedInterface = {
|
||||
idInterface: json.idInterface || -1,
|
||||
namaInterface: json.namaInterface || 'Interface'
|
||||
};
|
||||
|
||||
this.selectedInstrument = {
|
||||
idInstrument: json.idInstrument || -1,
|
||||
namaInstrument: json.namaInstrument || 'Instrument'
|
||||
};
|
||||
|
||||
this.selectedSerial = {
|
||||
idSerial: json.idSerial || -1,
|
||||
namaSerial: json.namaSerial || 'Serial'
|
||||
};
|
||||
|
||||
this.speed = json.speed || '';
|
||||
|
||||
this.selectedParity = {
|
||||
idParity: json.idParity || -1,
|
||||
namaParity: json.namaParity || 'Parity'
|
||||
};
|
||||
|
||||
this.selectedDataBit = {
|
||||
idDataBit: json.idDataBit || -1,
|
||||
namaDataBit: json.namaDataBit || 'Data Bit'
|
||||
};
|
||||
|
||||
this.selectedStopBit = {
|
||||
idStopBit: json.idStopBit || -1,
|
||||
namaStopBit: json.namaStopBit || 'Stop Bit'
|
||||
};
|
||||
}
|
||||
},
|
||||
// 1. Inisialisasi Start
|
||||
objAddForm: {
|
||||
// idJenis 1
|
||||
port: '',
|
||||
idInterface: -1,
|
||||
namaInterface: '',
|
||||
idInstrument: -1,
|
||||
namaInstrument: '',
|
||||
// idJenis 2 ketambahan server
|
||||
server: '',
|
||||
// idJenis 3
|
||||
idSerial: -1,
|
||||
namaSerial: '',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
},
|
||||
openJenis: false,
|
||||
selectedJenis: {
|
||||
idJenis: -1,
|
||||
namaJenis: 'Jenis'
|
||||
},
|
||||
dataJenis: [
|
||||
{
|
||||
idJenis: 1,
|
||||
namaJenis: 'TCP Server',
|
||||
},
|
||||
{
|
||||
idJenis: 2,
|
||||
namaJenis: 'TCP Client',
|
||||
},
|
||||
{
|
||||
idJenis: 3,
|
||||
namaJenis: 'RS232',
|
||||
},
|
||||
],
|
||||
selectedInterface: {
|
||||
idInterface: -1,
|
||||
namaInterface: 'Interface'
|
||||
},
|
||||
openInterface: false,
|
||||
dataInterface: [
|
||||
{
|
||||
idInterface: 1,
|
||||
namaInterface: 'XN550',
|
||||
},
|
||||
{
|
||||
idInterface: 2,
|
||||
namaInterface: 'Axsym',
|
||||
},
|
||||
{
|
||||
idInterface: 3,
|
||||
namaInterface: 'C311',
|
||||
},
|
||||
],
|
||||
selectedInstrument: {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
},
|
||||
openInstrument: false,
|
||||
dataInstrument: [
|
||||
{
|
||||
idInstrument: 1,
|
||||
namaInstrument: 'Hema 01',
|
||||
},
|
||||
{
|
||||
idInstrument: 2,
|
||||
namaInstrument: 'Axsym',
|
||||
},
|
||||
{
|
||||
idInstrument: 3,
|
||||
namaInstrument: 'Cobas C311',
|
||||
},
|
||||
],
|
||||
selectedSerial: {
|
||||
idSerial: -1,
|
||||
namaSerial: 'Serial'
|
||||
},
|
||||
openSerial: false,
|
||||
dataSerial: [
|
||||
{
|
||||
idSerial: 1,
|
||||
namaSerial: 'ttyS0'
|
||||
},
|
||||
{
|
||||
idSerial: 2,
|
||||
namaSerial: 'psx3'
|
||||
},
|
||||
],
|
||||
selectedParity: {
|
||||
idParity: -1,
|
||||
namaParity: 'Parity'
|
||||
},
|
||||
openParity: false,
|
||||
dataParity: [
|
||||
{
|
||||
idParity: 1,
|
||||
namaParity: 'None'
|
||||
},
|
||||
{
|
||||
idParity: 2,
|
||||
namaParity: 'All'
|
||||
},
|
||||
],
|
||||
selectedDataBit: {
|
||||
idDataBit: -1,
|
||||
namaDataBit: 'DataBit'
|
||||
},
|
||||
openDataBit: false,
|
||||
dataDataBit: [
|
||||
{
|
||||
idDataBit: 1,
|
||||
namaDataBit: '1'
|
||||
},
|
||||
{
|
||||
idDataBit: 2,
|
||||
namaDataBit: '6'
|
||||
},
|
||||
],
|
||||
selectedStopBit: {
|
||||
idStopBit: -1,
|
||||
namaStopBit: 'StopBit'
|
||||
},
|
||||
openStopBit: false,
|
||||
dataStopBit: [
|
||||
{
|
||||
idStopBit: 1,
|
||||
namaStopBit: '0'
|
||||
},
|
||||
{
|
||||
idStopBit: 2,
|
||||
namaStopBit: '1'
|
||||
},
|
||||
],
|
||||
// 1. Inisialisasi End
|
||||
// 2. Fungsi Start
|
||||
onChangeJenis(item) {
|
||||
let itemEdit = localStorage.getItem('itemEditMobile');
|
||||
if (itemEdit != null) {
|
||||
let json = JSON.parse(itemEdit);
|
||||
|
||||
this.selectedJenis = {
|
||||
idJenis: json.idJenis || -1,
|
||||
namaJenis: json.namaJenis || 'Jenis'
|
||||
};
|
||||
|
||||
this.port = json.port || '';
|
||||
this.server = json.server || '';
|
||||
|
||||
this.selectedInterface = {
|
||||
idInterface: json.idInterface || -1,
|
||||
namaInterface: json.namaInterface || 'Interface'
|
||||
};
|
||||
|
||||
this.selectedInstrument = {
|
||||
idInstrument: json.idInstrument || -1,
|
||||
namaInstrument: json.namaInstrument || 'Instrument'
|
||||
};
|
||||
|
||||
this.selectedSerial = {
|
||||
idSerial: json.idSerial || -1,
|
||||
namaSerial: json.namaSerial || 'Serial'
|
||||
};
|
||||
|
||||
this.speed = json.speed || '';
|
||||
|
||||
this.selectedParity = {
|
||||
idParity: json.idParity || -1,
|
||||
namaParity: json.namaParity || 'Parity'
|
||||
};
|
||||
|
||||
this.selectedDataBit = {
|
||||
idDataBit: json.idDataBit || -1,
|
||||
namaDataBit: json.namaDataBit || 'Data Bit'
|
||||
};
|
||||
|
||||
this.selectedStopBit = {
|
||||
idStopBit: json.idStopBit || -1,
|
||||
namaStopBit: json.namaStopBit || 'Stop Bit'
|
||||
};
|
||||
} else {
|
||||
// clear selected
|
||||
this.selectedInterface = {
|
||||
idInterface: -1,
|
||||
namaInterface: 'Interface'
|
||||
};
|
||||
this.selectedInstrument = {
|
||||
idInstrument: -1,
|
||||
namaInstrument: 'Instrument'
|
||||
}
|
||||
this.selectedSerial = {
|
||||
idSerial: -1,
|
||||
namaSerial: 'Serial'
|
||||
},
|
||||
this.selectedParity = {
|
||||
idParity: -1,
|
||||
namaParity: 'Parity'
|
||||
},
|
||||
this.selectedDataBit = {
|
||||
idDataBit: -1,
|
||||
namaDataBit: 'DataBit'
|
||||
},
|
||||
this.selectedStopBit = {
|
||||
idStopBit: -1,
|
||||
namaStopBit: 'StopBit'
|
||||
}
|
||||
}
|
||||
|
||||
this.openJenis = false;
|
||||
this.selectedJenis = item;
|
||||
|
||||
// clear form
|
||||
this.objAddForm = {
|
||||
port: '',
|
||||
idInterface: -1,
|
||||
namaInterface: '',
|
||||
idInstrument: -1,
|
||||
namaInstrument: '',
|
||||
server: '',
|
||||
idSerial: -1,
|
||||
namaSerial: '',
|
||||
speed: '',
|
||||
idParity: -1,
|
||||
namaParity: '',
|
||||
idDataBit: -1,
|
||||
namaDataBit: '',
|
||||
idStopBit: -1,
|
||||
namaStopBit: ''
|
||||
};
|
||||
},
|
||||
onChangeInterface(item) {
|
||||
this.openInterface = false;
|
||||
this.selectedInterface = item;
|
||||
},
|
||||
onChangeInstrument(item) {
|
||||
this.openInstrument = false;
|
||||
this.selectedInstrument = item;
|
||||
},
|
||||
onChangeSerial(item) {
|
||||
this.openSerial = false;
|
||||
this.selectedSerial = item;
|
||||
},
|
||||
onChangeParity(item) {
|
||||
this.openParity = false;
|
||||
this.selectedParity = item;
|
||||
},
|
||||
onChangeDataBit(item) {
|
||||
this.openDataBit = false;
|
||||
this.selectedDataBit = item;
|
||||
},
|
||||
onChangeStopBit(item) {
|
||||
this.openStopBit = false;
|
||||
this.selectedStopBit = item;
|
||||
},
|
||||
}))
|
||||
})
|
||||
Reference in New Issue
Block a user