@agung_dhewe/webapps 1.1.2

package/libs/fgta5js-dist/fonts/karla.css

@@ -0,0 +1,142 @@
+/* latin-ext */
+/* karla-italic-latin-ext.woff2 */
+@font-face {
+	font-family: 'Karla';
+	font-style: italic;
+	font-weight: 200;
+	font-display: swap;
+	src: url('karla-italic-latin-ext.woff2') format('woff2');
+	unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: italic;
+	font-weight: 400;
+	font-display: swap;
+	src: url('karla-italic-latin-ext.woff2') format('woff2');
+	unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: italic;
+	font-weight: 700;
+	font-display: swap;
+	src: url('karla-italic-latin-ext.woff2') format('woff2');
+	unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: italic;
+	font-weight: 900;
+	font-display: swap;
+	src: url('karla-italic-latin-ext.woff2') format('woff2');
+	unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+
+/* latin */
+/* karla-italic-latin.woff2 */
+@font-face {
+	font-family: 'Karla';
+	font-style: italic;
+	font-weight: 200;
+	font-display: swap;
+	src: url('karla-italic-latin.woff2') format('woff2');
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: italic;
+	font-weight: 400;
+	font-display: swap;
+	src: url('karla-italic-latin.woff2') format('woff2');
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: italic;
+	font-weight: 700;
+	font-display: swap;
+	src: url('karla-italic-latin.woff2') format('woff2');
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: italic;
+	font-weight: 900;
+	font-display: swap;
+	src: url('karla-italic-latin.woff2') format('woff2');
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+
+/* latin-ext */
+/* karla-normal-latin-ext.woff2 */
+@font-face {
+	font-family: 'Karla';
+	font-style: normal;
+	font-weight: 200;
+	font-display: swap;
+	src: url('karla-normal-latin-ext.woff2') format('woff2');
+	unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: normal;
+	font-weight: 400;
+	font-display: swap;
+	src: url('karla-normal-latin-ext.woff2') format('woff2');
+	unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: normal;
+	font-weight: 700;
+	font-display: swap;
+	src: url('karla-normal-latin-ext.woff2') format('woff2');
+	unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: normal;
+	font-weight: 900;
+	font-display: swap;
+	src: url('karla-normal-latin-ext.woff2') format('woff2');
+	unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+/* latin */
+/* karla-normal-latin.woff2 */
+@font-face {
+	font-family: 'Karla';
+	font-style: normal;
+	font-weight: 200;
+	font-display: swap;
+	src: url('karla-normal-latin.woff2') format('woff2');
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: normal;
+	font-weight: 400;
+	font-display: swap;
+	src: url('karla-normal-latin.woff2') format('woff2');
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: normal;
+	font-weight: 700;
+	font-display: swap;
+	src: url('karla-normal-latin.woff2') format('woff2');
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+@font-face {
+	font-family: 'Karla';
+	font-style: normal;
+	font-weight: 900;
+	font-display: swap;
+	src: url('karla-normal-latin.woff2') format('woff2');
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+

package/libs/webmodule/module-edit.css

@@ -0,0 +1,163 @@
+.module-form {
+	display: flex; 
+	column-gap: 10px; 
+	row-gap: 5px; 
+	flex-wrap: wrap; 
+	margin-bottom: 20px;
+}
+
+
+
+
+.input-field {
+	display: flex;
+	column-gap: 10px;
+	/* background-color: aliceblue; */
+}
+
+.input-field > label {
+	margin-top: 4px;
+	font-size: 0.8rem;
+	font-weight: bold;
+	
+}
+
+@media screen and (max-width: 500px) {
+	.input-field {
+		flex-direction: column;
+	}
+
+	.input-field > div[label],
+	.input-field > label {
+		text-align: left;
+		margin-bottom: 5px;
+		width: fit-content;
+		min-width: unset;
+	}
+}
+
+
+@media screen and (min-width: 501px) {
+	.input-field > label {
+		text-align: right;
+		width: 80px;
+		min-width: 80px;
+	}
+}
+
+
+
+
+
+
+@media screen and (max-width: 500px) {
+	/* Box information detil */
+	.panel-detil {
+		margin: 50px 0 0 0;
+	}
+}
+
+@media screen and (min-width: 501px) {
+	/* Box information detil */
+	.panel-detil {
+		margin: 50px 20px 20px 20px;
+	}
+}
+
+
+.panel-detil [panel-title] {
+	font-weight: bold;
+	background-color: #2c2f60;
+	color: #fff;
+	border-radius: 10px 10px 0 0;
+	padding: 10px 10px 10px 15px;
+	font-weight: 1.1rem;
+}
+
+.panel-detil [panel-content] {
+	background-color: #ececec;
+	padding: 5px 0 10px 0;
+	border-radius: 0 0 10px 10px;
+	
+}
+
+.panel-detil-row {
+	display: grid;
+	grid-template-columns: 1fr 1fr; /* 2 kolom */
+	grid-template-rows: auto auto; /* 2 baris */
+	column-gap: 10px; /* jarak antar item */
+	padding: 10px 15px 10px 15px;
+	color: rgb(80, 80, 80);
+
+}
+
+.panel-detil-row [data-info] {
+	font-weight: bold;
+	text-align: right;
+}
+
+.panel-detil-row a {
+	font-weight: bold;
+	text-decoration: none;
+	color: rgb(80, 80, 80);
+}
+
+.panel-detil-row-highligted {
+	background-color: #2c2f6031;
+	color: #fff
+}
+
+.panel-detil-row-highligted a {
+	color: #fff
+}
+
+
+
+
+
+
+
+
+/* Record Bar */
+.panel-recordbar {
+	display: flex;
+}
+
+
+.panel-recordbar[data-view="nodetil"] {
+	margin-top: 60px;
+	padding-top: 10px;
+	border-top: 1px solid #c4c7e8;
+}
+
+@media screen and (max-width: 500px) {
+	.panel-recordbar {
+		margin-top: 12px;
+	}
+}
+
+@media screen and (min-width: 501px) {
+	.panel-recordbar {
+		margin: 12px 20px 20px 20px;
+	}
+}
+
+
+.panel-recordbar > div {
+	padding: 2px 10px 2px 10px;
+	border-left: 1px solid #bebebe;
+	
+}
+
+.panel-recordbar > div:first-child {
+	border-left: 0
+}
+
+.panel-recordbar a {
+	color: #4a4a4a
+}
+
+.panel-recordbar a:hover {
+	color: #000
+	
+}

package/libs/webmodule/module-footer.css

@@ -0,0 +1,22 @@
+.footer-buttons-container {
+	display: flex;
+	justify-content: space-between;
+	width: 100%;
+
+}
+
+@media screen and (max-width: 500px) {
+	.footer-buttons-container {
+		padding-left: 5px;
+		padding-right: 5px;
+	}
+
+
+}
+
+@media screen and (min-width: 501px) {
+	.footer-buttons-container {
+		padding-left: 50px;
+		padding-right: 50px;
+	}
+}

package/libs/webmodule/module-list.css

@@ -0,0 +1,25 @@
+.search-container {
+	display: flex;
+	margin-bottom: 10px;
+	margin-top: 10px;
+	column-gap: 10px;
+}
+
+.search-container > button {
+	align-self: flex-start;
+}
+
+.search-parameters {
+	display: flex;
+	column-gap: 10px;
+}
+
+@media screen and (max-width: 500px) {
+	.search-parameters {
+		flex-grow: 1;
+	}
+}
+
+@media screen and (min-width: 501px) {
+	
+}

package/libs/webmodule/module.css

@@ -0,0 +1,52 @@
+@import url('./module-list.css');
+@import url('./module-edit.css');
+@import url('./module-footer.css');
+
+
+body {
+	overflow-x: hidden;
+
+}
+
+
+
+#fRecord-section  [name="panel"] {
+	display: flex;
+}
+
+
+#fRecord-section [name="row"] {
+	display: flex;
+	margin-bottom: 5px;
+}
+
+#fRecord-section [name="column"] div:nth-child(even) {
+	margin-bottom: 15px;
+}
+
+#fRecord-section [name="caption"] {
+	width: 120px;
+	text-align: right;
+	padding-right: 10px;
+	font-weight: bold;
+	font-size: 0.8rem;
+}
+
+
+.logcell {
+	padding: 4px 8px 5px 8px;
+	border-bottom: 1px solid #e7e7e7;
+	font-size: 0.7rem;
+}
+
+.logheader {
+	padding: 4px 8px 6px 8px;
+	font-weight: bold;
+	border-bottom: 1px solid #8d8d8d;
+	font-size: 0.8rem;
+
+}
+
+
+
+

package/libs/webmodule/module.js

@@ -0,0 +1,195 @@
+const RESET_CONFIRM = 'Sudah ada perubahan data, apakah akan direset?'
+const NEWDATA_CONFIRM  = 'Sudah ada perubahan data, apakah akan membuat baru?'
+const BACK_CONFIRM = 'Sudah ada perubahan data, apakah akan kembali ke list?'
+const DELETE_CONFIRM = 'Apakah akan hapus data '
+const EDIT_WARNING = 'Silakan data di save atau di reset dahulu'
+
+class Module {
+	static get RESET_CONFIRM() { return RESET_CONFIRM }
+	static get NEWDATA_CONFIRM() { return NEWDATA_CONFIRM }
+	static get BACK_CONFIRM() { return BACK_CONFIRM }
+	static get DELETE_CONFIRM() { return DELETE_CONFIRM }
+	static get EDIT_WARNING() { return EDIT_WARNING }
+	
+	constructor() {
+	}
+
+	static isMobileDevice() {
+		return /Mobi|Android|iPhone|iPad|iPod|BlackBerry|Opera Mini|IEMobile/i.test(navigator.userAgent);
+	}
+
+	static renderFooterButtons(footerButtonsContainer) { 
+		const footer = document.querySelector('footer.fgta5-app-footer')
+		footer.innerHTML = ''
+
+		// masukkan semua footerButtonsContainer ke footer
+		for (var bc of Array.from(footerButtonsContainer)) {
+			var section = bc.closest('section')
+			bc.setAttribute('data-section', section.id)
+
+			footer.appendChild(bc)
+		}
+	}
+
+
+	static async sleep(ms) {
+		return new Promise(lanjut=>{
+			setTimeout(()=>{
+				lanjut()
+			}, ms)
+		})
+	}
+
+
+	static async download(url, args) {
+		const method = 'POST'
+		const body = JSON.stringify(args)
+		const headers = {
+			'Content-Type': 'application/json'
+		}
+
+		// tambahkan informasi header
+		headers['appid'] = 'fgta'
+		headers['timestamp'] = 'timestamp'
+		headers['verifier'] = 'verifier'
+
+		try {
+			const response = await fetch(url, {method, headers, body})
+			if (!response.ok) {
+				const status = response.status
+				
+				let errorMessage
+				if (status==401) {
+					// belum login, hapus session login
+					sessionStorage.removeItem('login');
+					sessionStorage.removeItem('login_nexturl');
+					errorMessage = 'need authorization to download asset'
+				} else {
+					errorMessage = 'download fail'
+				}
+
+				const err = new Error(errorMessage)
+				err.status = status
+				err.code = response.code || 1
+				throw err
+			}
+
+			let filename = 'download'; // fallback
+			const disposition = response.headers.get('Content-Disposition');
+	
+			if (disposition && disposition.includes('filename=')) {
+				const match = disposition.match(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/);
+				if (match != null && match[1]) {
+					filename = match[1].replace(/['"]/g, ''); // hapus tanda kutip
+				}
+			}
+
+			// Ambil file sebagai blob
+			const blob = await response.blob();
+
+
+			// Buat link download
+			const downloadUrl = URL.createObjectURL(blob)
+			const a = document.createElement('a')
+			a.setAttribute('target', '_blank')
+			a.href = downloadUrl
+			a.download = filename // atau nama file yang sesuai
+			document.body.appendChild(a)
+			a.click()
+			a.remove()
+			URL.revokeObjectURL(downloadUrl); // bersihkan URL blob
+
+		} catch (err) {
+			await this.processError(err)
+			// throw err	
+		}
+	}
+
+
+	static async apiCall(url, args, formData) {
+		const inFrane = window.self !== window.top;
+		const api = new $fgta5.ApiEndpoint(url)
+
+		api.setHeader('appid', 'fgta')
+		api.setHeader('timestamp', 'timestamp')
+		api.setHeader('verifier', 'verifier')
+		
+		try {
+			const result = await api.execute(args, formData)
+			return result 
+		} catch (err) {
+			this.processError(err)
+			throw err
+		}
+	}
+
+
+	static async processError(err) {
+		const inFrane = window.self !== window.top;
+		const currentUrl = window.location.href;
+		if (err.status==401) {
+			console.error(err)
+			await $fgta5.MessageBox.error(err.message)
+			if (inFrane) {
+				window.parent.postMessage({
+					action:'REDIRECT_TO_LOGIN',
+					href: '/login',
+					nexturl: currentUrl
+
+				}, '*')
+			} else {
+				location.href = `/login?nexturl=${currentUrl}`
+			}
+			await this.sleep(10000)
+			throw err				
+		} else {
+			throw err
+		}
+
+	}
+
+
+	static async loadTemplate(name) {
+		const tpl = document.querySelector(`template[name="${name}"]`)
+		if (tpl==null) {
+			throw new Error(`template "${name}" is not found!`)
+		}
+
+		const clone = tpl.content.cloneNode(true); // salin isi template
+		document.body.appendChild(clone);
+	}	
+
+
+
+	static insertAtCursor(input, char) {
+		const start = input.selectionStart;
+		const end = input.selectionEnd;
+		const value = input.value;
+		input.value = value.slice(0, start) + char + value.slice(end);
+		input.setSelectionRange(start + 1, start + 1);
+	}
+
+	static deleteAtCursor(input, mode) {
+		const start = input.selectionStart;
+		const end = input.selectionEnd;
+		const value = input.value;
+
+		if (start === end) {
+			if (mode === 'backspace' && start > 0) {
+			input.value = value.slice(0, start - 1) + value.slice(end);
+			input.setSelectionRange(start - 1, start - 1);
+			} else if (mode === 'delete' && start < value.length) {
+			input.value = value.slice(0, start) + value.slice(end + 1);
+			input.setSelectionRange(start, start);
+			}
+		} else {
+			input.value = value.slice(0, start) + value.slice(end);
+			input.setSelectionRange(start, start);
+		}
+	}
+}
+
+
+
+
+

package/libs/webmodule/pagehelper.mjs

@@ -0,0 +1,45 @@
+
+export async function openSection(self, sectionName, params, fnOpened) {
+	const context = params.Context
+	const Crsl = context.Crsl
+	const section = Crsl.Items[sectionName]
+	section.setSectionReturn(params.sectionReturn)
+	section.show({}, fnOpened)
+} 
+
+
+export function renderLog(tbody, data) {
+	tbody.innerHTML = ''
+
+	for (var row of data) {
+		const tr = document.createElement('tr')
+
+		const tdTime = document.createElement('td')
+		tdTime.innerHTML = row.log_time
+		tdTime.classList.add('logcell')
+
+		const tdUser = document.createElement('td')
+		tdUser.innerHTML = row.log_user_name
+		tdUser.classList.add('logcell')
+
+		const tdAction = document.createElement('td')
+		tdAction.innerHTML = row.log_action
+		tdAction.classList.add('logcell')
+
+		const tdIP = document.createElement('td')
+		tdIP.innerHTML = row.log_ipaddress
+		tdIP.classList.add('logcell')
+
+		const tdRemark = document.createElement('td')
+		tdRemark.innerHTML = row.log_remark
+		tdRemark.classList.add('logcell')
+
+
+		tr.appendChild(tdTime)
+		tr.appendChild(tdUser)
+		tr.appendChild(tdAction)
+		tr.appendChild(tdIP)
+		tr.appendChild(tdRemark)
+		tbody.appendChild(tr)
+	}
+}