{"id":1154,"date":"2026-08-23T08:12:27","date_gmt":"2026-08-23T00:12:27","guid":{"rendered":"https:\/\/sevenseaskaraoke.com\/?page_id=1154"},"modified":"2026-08-24T07:55:42","modified_gmt":"2026-08-23T23:55:42","slug":"staff","status":"publish","type":"page","link":"https:\/\/sevenseaskaraoke.com\/index.php\/staff\/","title":{"rendered":"staff"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\n\n\n\nMerdeka Birthday Free 1 Hour - Data Entry<\/title>\n<style>\n :root {\n --ios-blue: #007AFF;\n --ios-blue-dark: #0062CC;\n --ios-red: #FF3B30;\n --ios-green: #34C759;\n --ios-bg: #F2F2F7;\n --ios-card: #FFFFFF;\n --ios-separator: rgba(60,60,67,0.29);\n --ios-label: #000000;\n --ios-secondary-label: #8A8A8E;\n --ios-tertiary-label: #C7C7CC;\n }\n * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }\n body {\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, \"SF Pro Text\", \"SF Pro Display\", \"Helvetica Neue\", Arial, sans-serif;\n background: var(--ios-bg);\n color: var(--ios-label);\n -webkit-font-smoothing: antialiased;\n }\n .page {\n max-width: 480px;\n margin: 0 auto;\n padding-bottom: 48px;\n }\n\n \/* Tablet & desktop: kekal full screen, hanya tambah ruang nafas dan hadkan lebar bacaan *\/\n @media (min-width: 640px) {\n .page {\n max-width: 640px;\n padding-top: 24px;\n }\n .navbar h1 { font-size: 34px; }\n }\n\n \/* Nav bar *\/\n .navbar {\n padding: 12px 16px 4px;\n background: var(--ios-bg);\n position: sticky;\n top: 0;\n z-index: 5;\n }\n .navbar .eyebrow {\n font-size: 13px;\n font-weight: 600;\n color: var(--ios-blue);\n letter-spacing: 0.2px;\n margin-bottom: 2px;\n }\n .navbar h1 {\n font-size: 30px;\n font-weight: 700;\n letter-spacing: -0.4px;\n margin: 0;\n line-height: 1.15;\n }\n .navbar .desc {\n font-size: 14px;\n color: var(--ios-secondary-label);\n margin-top: 4px;\n }\n\n \/* Grouped section *\/\n .group {\n margin: 20px 16px 0;\n }\n .group-header {\n font-size: 13px;\n font-weight: 500;\n color: var(--ios-secondary-label);\n text-transform: uppercase;\n letter-spacing: 0.3px;\n padding: 0 12px 6px;\n }\n .group-card {\n background: var(--ios-card);\n border-radius: 10px;\n overflow: hidden;\n box-shadow: 0 1px 1px rgba(0,0,0,0.02);\n }\n .row {\n display: flex;\n align-items: center;\n padding: 11px 12px;\n position: relative;\n }\n .row + .row::before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 12px;\n right: 0;\n height: 1px;\n background: var(--ios-separator);\n transform: scaleY(0.5);\n }\n .row label {\n flex: 0 0 118px;\n font-size: 15px;\n color: var(--ios-label);\n }\n .row input {\n flex: 1;\n border: none;\n outline: none;\n background: transparent;\n font-size: 15px;\n color: var(--ios-label);\n font-family: inherit;\n text-align: right;\n padding: 2px 0;\n }\n .row input::placeholder { color: var(--ios-tertiary-label); }\n .row input[type=\"date\"] { text-align: right; }\n\n \/* Segmented control *\/\n .segmented {\n display: flex;\n background: rgba(118,118,128,0.12);\n border-radius: 9px;\n padding: 2px;\n margin: 0 16px;\n gap: 2px;\n }\n .segment {\n flex: 1;\n text-align: center;\n padding: 7px 6px;\n font-size: 13.5px;\n font-weight: 500;\n color: var(--ios-label);\n border-radius: 7px;\n cursor: pointer;\n transition: background 0.15s, box-shadow 0.15s, color 0.15s;\n user-select: none;\n }\n .segment.selected {\n background: #FFFFFF;\n box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 1px rgba(0,0,0,0.08);\n font-weight: 600;\n }\n\n \/* Submit button *\/\n .submit-wrap { margin: 28px 16px 0; }\n button.submit-btn {\n width: 100%;\n padding: 15px;\n background: var(--ios-blue);\n color: #fff;\n border: none;\n border-radius: 12px;\n font-size: 16px;\n font-weight: 600;\n font-family: inherit;\n cursor: pointer;\n transition: opacity 0.1s;\n }\n button.submit-btn:active:not(:disabled) { opacity: 0.75; }\n button.submit-btn:disabled {\n background: var(--ios-tertiary-label);\n cursor: not-allowed;\n }\n\n \/* Secondary button *\/\n .check-wrap { margin: 10px 16px 0; }\n a.check-btn, button.check-btn {\n display: block;\n width: 100%;\n padding: 13px;\n background: rgba(0,122,255,0.10);\n color: var(--ios-blue);\n border: none;\n border-radius: 12px;\n font-size: 15px;\n font-weight: 600;\n font-family: inherit;\n text-align: center;\n text-decoration: none;\n box-sizing: border-box;\n cursor: pointer;\n transition: opacity 0.1s;\n }\n a.check-btn:active, button.check-btn:active { opacity: 0.6; }\n\n \/* Message banner *\/\n .msg {\n margin: 14px 16px 0;\n padding: 12px 14px;\n border-radius: 12px;\n font-size: 14px;\n line-height: 1.4;\n display: none;\n }\n .msg.success { background: rgba(52,199,89,0.12); color: #1E8E3E; }\n .msg.error { background: rgba(255,59,48,0.12); color: #D70015; }\n\n .footnote {\n font-size: 12px;\n color: var(--ios-tertiary-label);\n text-align: center;\n margin-top: 18px;\n padding: 0 24px;\n }\n<\/style>\n<\/head>\n<body>\n<div class=\"page\">\n\n <div class=\"navbar\">\n <div class=\"eyebrow\">MERDEKA PROMOTION<\/div>\n <h1>Merdeka Birthday<br>Free 1 Hour<\/h1>\n <div class=\"desc\">Data Entry \u2014 Customer Claim<\/div>\n <\/div>\n\n <form id=\"claimForm\">\n\n <div class=\"group\">\n <div class=\"group-header\">Outlet<\/div>\n <div class=\"segmented\" id=\"outletGroup\">\n <div class=\"segment\" data-value=\"Maharaja\">Maharaja<\/div>\n <div class=\"segment\" data-value=\"Maharani\">Maharani<\/div>\n <div class=\"segment\" data-value=\"Sevenseas\">Sevenseas<\/div>\n <\/div>\n <input type=\"hidden\" id=\"outlet\" name=\"outlet\" required>\n <\/div>\n\n <div class=\"group\">\n <div class=\"group-header\">Butiran Customer<\/div>\n <div class=\"group-card\">\n <div class=\"row\">\n <label for=\"customerName\">Nama<\/label>\n <input type=\"text\" id=\"customerName\" name=\"customerName\" placeholder=\"Nama customer\" required>\n <\/div>\n <div class=\"row\">\n <label for=\"phone\">No. Telefon<\/label>\n <input type=\"tel\" id=\"phone\" name=\"phone\" placeholder=\"012-3456789\" required>\n <\/div>\n <div class=\"row\">\n <label for=\"icNumber\">No. K\/P<\/label>\n <input type=\"text\" id=\"icNumber\" name=\"icNumber\" placeholder=\"990101-14-5678\" required>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"group\">\n <div class=\"group-header\">Claim<\/div>\n <div class=\"group-card\">\n <div class=\"row\">\n <label for=\"claimDate\">Tarikh Claim<\/label>\n <input type=\"date\" id=\"claimDate\" name=\"claimDate\" required>\n <\/div>\n <div class=\"row\">\n <label for=\"staffName\">Nama Staff<\/label>\n <input type=\"text\" id=\"staffName\" name=\"staffName\" placeholder=\"Staff proses\">\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"submit-wrap\">\n <button type=\"submit\" class=\"submit-btn\" id=\"submitBtn\">Hantar Data<\/button>\n <\/div>\n <div class=\"check-wrap\">\n <a class=\"check-btn\" href=\"https:\/\/script.google.com\/macros\/s\/AKfycbze-YY3JQltUV-EyBzQxt5XYScHpFkOTJLWXk2-mb_qbtmosUMgb5OWXl4hiECo9GqO\/exec\" target=\"_blank\" rel=\"noopener noreferrer\">\ud83d\udccb Semak Data di Google Sheet<\/a>\n <\/div>\n <div class=\"msg\" id=\"msgBox\"><\/div>\n <div class=\"footnote\">Data akan disimpan terus ke Google Sheet. Setiap customer hanya boleh claim sekali sahaja merentasi semua outlet.<\/div>\n <\/form>\n<\/div>\n\n<script>\n \/\/ ================================================================\n \/\/ GANTIKAN URL DI BAWAH DENGAN URL WEB APP GOOGLE APPS SCRIPT ANDA\n \/\/ ================================================================\n const SCRIPT_URL = \"https:\/\/script.google.com\/macros\/s\/AKfycbzo3kdzxquu9UCW7D2et3EWPS16ZKWNv5PFbVNSgkw-a5kpXEArwdeCQ1e0oKrey8tu\/exec\";\n\n const outletButtons = document.querySelectorAll('.segment');\n const outletInput = document.getElementById('outlet');\n outletButtons.forEach(btn => {\n btn.addEventListener('click', () => {\n outletButtons.forEach(b => b.classList.remove('selected'));\n btn.classList.add('selected');\n outletInput.value = btn.dataset.value;\n });\n });\n\n \/\/ Default tarikh claim = hari ini\n document.getElementById('claimDate').valueAsDate = new Date();\n\n const form = document.getElementById('claimForm');\n const submitBtn = document.getElementById('submitBtn');\n const msgBox = document.getElementById('msgBox');\n\n form.addEventListener('submit', async function (e) {\n e.preventDefault();\n msgBox.className = 'msg';\n msgBox.textContent = '';\n\n if (!outletInput.value) {\n msgBox.className = 'msg error';\n msgBox.textContent = 'Sila pilih outlet.';\n return;\n }\n\n if (SCRIPT_URL.includes('PASTE_URL')) {\n msgBox.className = 'msg error';\n msgBox.textContent = 'SCRIPT_URL belum diset. Sila ikut arahan setup Google Apps Script dahulu.';\n return;\n }\n\n const data = {\n outlet: outletInput.value,\n customerName: document.getElementById('customerName').value,\n phone: document.getElementById('phone').value,\n icNumber: document.getElementById('icNumber').value,\n claimDate: document.getElementById('claimDate').value,\n staffName: document.getElementById('staffName').value,\n timestamp: new Date().toISOString()\n };\n\n submitBtn.disabled = true;\n submitBtn.textContent = 'Menghantar...';\n\n try {\n const response = await fetch(SCRIPT_URL, {\n method: 'POST',\n headers: { 'Content-Type': 'text\/plain;charset=utf-8' },\n body: JSON.stringify(data)\n });\n const result = await response.json();\n\n if (result.status === 'duplicate') {\n msgBox.className = 'msg error';\n msgBox.textContent = '\u26a0\ufe0f ' + (result.message || 'Customer ini sudah claim promosi ini sebelum ini.');\n } else if (result.status === 'success') {\n msgBox.className = 'msg success';\n msgBox.textContent = '\u2705 Data berjaya dihantar!';\n form.reset();\n outletButtons.forEach(b => b.classList.remove('selected'));\n outletInput.value = '';\n document.getElementById('claimDate').valueAsDate = new Date();\n } else {\n throw new Error('Unexpected response');\n }\n } catch (err) {\n msgBox.className = 'msg error';\n msgBox.textContent = '\u274c Gagal hantar data. Sila cuba lagi atau semak sambungan internet.';\n } finally {\n submitBtn.disabled = false;\n submitBtn.textContent = 'Hantar Data';\n }\n });\n<\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Merdeka Birthday Free 1 Hour – Data Entry MERDEKA PROMOTION Merdeka BirthdayFree 1 Hour Data Entry \u2014 Customer Claim Outlet […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1154","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/sevenseaskaraoke.com\/index.php\/wp-json\/wp\/v2\/pages\/1154","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sevenseaskaraoke.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sevenseaskaraoke.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sevenseaskaraoke.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sevenseaskaraoke.com\/index.php\/wp-json\/wp\/v2\/comments?post=1154"}],"version-history":[{"count":12,"href":"https:\/\/sevenseaskaraoke.com\/index.php\/wp-json\/wp\/v2\/pages\/1154\/revisions"}],"predecessor-version":[{"id":1169,"href":"https:\/\/sevenseaskaraoke.com\/index.php\/wp-json\/wp\/v2\/pages\/1154\/revisions\/1169"}],"wp:attachment":[{"href":"https:\/\/sevenseaskaraoke.com\/index.php\/wp-json\/wp\/v2\/media?parent=1154"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}