effendy/qris_bank_jatim
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update homepage

Browse Source
This commit is contained in:
bagus-arie05
2025-09-08 15:07:49 +07:00
parent 5980946669
commit 003925d57a
8 changed files with 1354 additions and 893 deletions
Download Patch File Download Diff File Expand all files Collapse all files
layouts/default.vue
+7
View File
@@ -0,0 +1,7 @@
<template>
<v-app>
<v-main>
<slot />
</v-main>
</v-app>
</template>
nuxt.config.ts
+23 -2
View File
@@ -1,4 +1,5 @@
// https://nuxt.com/docs/api/configuration/nuxt-config
import vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
export default defineNuxtConfig({
compatibilityDate: '2025-07-15',
devtools: { enabled: true },
@@ -10,6 +11,26 @@ export default defineNuxtConfig({
'@nuxt/scripts',
'@nuxt/test-utils',
'@nuxt/ui',
'@pinia/nuxt'
]
'@pinia/nuxt',
(_options, nuxt) => {
nuxt.hooks.hook('vite:extendConfig', (config) => {
// @ts-expect-error
config.plugins.push(vuetify({ autoImport: true }))
})
},
//...
],
css: [
'vuetify/lib/styles/main.sass',
'@mdi/font/css/materialdesignicons.min.css',
],
build: {
transpile: ['vuetify'],
},
app: {
head: {
viewport: 'width=device-width,initial-scale=1',
charset: 'utf-8'
}
}
})
package-lock.json
Generated
+455
View File
@@ -24,6 +24,7 @@
"vue-router": "^4.5.1"
},
"devDependencies": {
"sass-embedded": "^1.92.1",
"vite-plugin-vuetify": "^2.1.2",
"vuetify": "^3.9.7"
}
@@ -489,6 +490,13 @@
"node": ">=6.9.0"
}
},
"node_modules/@bufbuild/protobuf": {
"version": "2.7.0",
"resolved": "https://registry.npmjs.org/@bufbuild/protobuf/-/protobuf-2.7.0.tgz",
"integrity": "sha512-qn6tAIZEw5i/wiESBF4nQxZkl86aY4KoO0IkUa2Lh+rya64oTOdJQFlZuMwI1Qz9VBJQrQC4QlSA2DNek5gCOA==",
"devOptional": true,
"license": "(Apache-2.0 AND BSD-3-Clause)"
},
"node_modules/@capsizecss/metrics": {
"version": "3.5.0",
"resolved": "https://registry.npmjs.org/@capsizecss/metrics/-/metrics-3.5.0.tgz",
@@ -6466,6 +6474,13 @@
"ieee754": "^1.2.1"
}
},
"node_modules/buffer-builder": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/buffer-builder/-/buffer-builder-0.2.0.tgz",
"integrity": "sha512-7VPMEPuYznPSoR21NE1zvd2Xna6c/CloiZCfcMXR1Jny6PjX0N4Nsa38zcBFo/FMK+BlA+FLKbJCQ0i2yxp+Xg==",
"devOptional": true,
"license": "MIT/X11"
},
"node_modules/buffer-crc32": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-1.0.0.tgz",
@@ -6967,6 +6982,13 @@
"integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==",
"license": "MIT"
},
"node_modules/colorjs.io": {
"version": "0.5.2",
"resolved": "https://registry.npmjs.org/colorjs.io/-/colorjs.io-0.5.2.tgz",
"integrity": "sha512-twmVoizEW7ylZSN32OgKdXRmo1qg+wT5/6C3xu5b9QsWzSFAhHLn2xd8ro0diCsKfCj1RdaTP/nrcW+vAoQPIw==",
"devOptional": true,
"license": "MIT"
},
"node_modules/colortranslator": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/colortranslator/-/colortranslator-5.0.0.tgz",
@@ -9698,6 +9720,13 @@
"integrity": "sha512-K6acvFaelNxx8wc2VjbIzXKDVB0Khs0QT35U6NkGfTdCmjLNcO2945m7RFNR9/RPVFm48hq7QPzK8uGH18HCGw==",
"license": "MIT"
},
"node_modules/immutable": {
"version": "5.1.3",
"resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.3.tgz",
"integrity": "sha512-+chQdDfvscSF1SJqv2gn4SRO2ZyS3xL3r7IW/wWEEzrzLisnOlKiQu5ytC/BVNcS15C39WT2Hg/bjKjDMcu+zg==",
"devOptional": true,
"license": "MIT"
},
"node_modules/import-fresh": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
@@ -14361,6 +14390,16 @@
"queue-microtask": "^1.2.2"
}
},
"node_modules/rxjs": {
"version": "7.8.2",
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz",
"integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==",
"devOptional": true,
"license": "Apache-2.0",
"dependencies": {
"tslib": "^2.1.0"
}
},
"node_modules/safe-buffer": {
"version": "5.2.1",
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
@@ -14381,6 +14420,392 @@
],
"license": "MIT"
},
"node_modules/sass": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.92.1.tgz",
"integrity": "sha512-ffmsdbwqb3XeyR8jJR6KelIXARM9bFQe8A6Q3W4Klmwy5Ckd5gz7jgUNHo4UOqutU5Sk1DtKLbpDP0nLCg1xqQ==",
"license": "MIT",
"optional": true,
"dependencies": {
"chokidar": "^4.0.0",
"immutable": "^5.0.2",
"source-map-js": ">=0.6.2 <2.0.0"
},
"bin": {
"sass": "sass.js"
},
"engines": {
"node": ">=14.0.0"
},
"optionalDependencies": {
"@parcel/watcher": "^2.4.1"
}
},
"node_modules/sass-embedded": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded/-/sass-embedded-1.92.1.tgz",
"integrity": "sha512-28YwLnF5atAhogt3E4hXzz/NB9dwKffyw08a7DEasLh94P7+aELkG3ENSHYCWB9QFN14hYNLfwr9ozUsPDhcDQ==",
"devOptional": true,
"license": "MIT",
"dependencies": {
"@bufbuild/protobuf": "^2.5.0",
"buffer-builder": "^0.2.0",
"colorjs.io": "^0.5.0",
"immutable": "^5.0.2",
"rxjs": "^7.4.0",
"supports-color": "^8.1.1",
"sync-child-process": "^1.0.2",
"varint": "^6.0.0"
},
"bin": {
"sass": "dist/bin/sass.js"
},
"engines": {
"node": ">=16.0.0"
},
"optionalDependencies": {
"sass-embedded-all-unknown": "1.92.1",
"sass-embedded-android-arm": "1.92.1",
"sass-embedded-android-arm64": "1.92.1",
"sass-embedded-android-riscv64": "1.92.1",
"sass-embedded-android-x64": "1.92.1",
"sass-embedded-darwin-arm64": "1.92.1",
"sass-embedded-darwin-x64": "1.92.1",
"sass-embedded-linux-arm": "1.92.1",
"sass-embedded-linux-arm64": "1.92.1",
"sass-embedded-linux-musl-arm": "1.92.1",
"sass-embedded-linux-musl-arm64": "1.92.1",
"sass-embedded-linux-musl-riscv64": "1.92.1",
"sass-embedded-linux-musl-x64": "1.92.1",
"sass-embedded-linux-riscv64": "1.92.1",
"sass-embedded-linux-x64": "1.92.1",
"sass-embedded-unknown-all": "1.92.1",
"sass-embedded-win32-arm64": "1.92.1",
"sass-embedded-win32-x64": "1.92.1"
}
},
"node_modules/sass-embedded-all-unknown": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-all-unknown/-/sass-embedded-all-unknown-1.92.1.tgz",
"integrity": "sha512-5t6/YZf+vhO3OY/49h8RCL6Cwo78luva0M+TnTM9gu9ASffRXAuOVLNKciSXa3loptyemDDS6IU5/dVH5w0KmA==",
"cpu": [
"!arm",
"!arm64",
"!riscv64",
"!x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"dependencies": {
"sass": "1.92.1"
}
},
"node_modules/sass-embedded-android-arm": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-android-arm/-/sass-embedded-android-arm-1.92.1.tgz",
"integrity": "sha512-4EjpVVzuksERdgAd4BqeSXFnWtWN3DSRyEIUPJ7BhcS9sfDh2Gf6miI2kNTvIQLJ2XIJynDDcEQ8a1U9KwKUTQ==",
"cpu": [
"arm"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-android-arm64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-android-arm64/-/sass-embedded-android-arm64-1.92.1.tgz",
"integrity": "sha512-Q+UruGb7yKawHagVmVDRRKsnc4mJZvWMBnuRCu2coJo2FofyqBmXohVGXbxko97sYceA9TJTrUEx3WVKQUNCbQ==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-android-riscv64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-android-riscv64/-/sass-embedded-android-riscv64-1.92.1.tgz",
"integrity": "sha512-nCY5btLlX7W7Jc6cCL6D2Yklpiu540EJ2G08YVGu12DrAMCBzqM347CSRf2ojp1H8jyhvmLkaFwnrJWzh+6S+w==",
"cpu": [
"riscv64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-android-x64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-android-x64/-/sass-embedded-android-x64-1.92.1.tgz",
"integrity": "sha512-qYWR3bftJ77aLYwYDFuzDI4dcwVVixxqQxlIQWNGkHRCexj614qGSSHemr18C2eVj3mjXAQxTQxU68U7pkGPAA==",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-darwin-arm64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-darwin-arm64/-/sass-embedded-darwin-arm64-1.92.1.tgz",
"integrity": "sha512-g2yQ3txjMYLKMjL2cW1xRO9nnV3ijf95NbX/QShtV6tiVUETZNWDsRMDEwBNGYY6PTE/UZerjJL1R/2xpQg6WA==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-darwin-x64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-darwin-x64/-/sass-embedded-darwin-x64-1.92.1.tgz",
"integrity": "sha512-eH+fgxLQhTEPjZPCgPAVuX5e514Qp/4DMAUMtlNShv4cr4TD5qOp1XlsPYR/b7uE7p2cKFkUpUn/bHNqJ2ay4A==",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-arm": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-arm/-/sass-embedded-linux-arm-1.92.1.tgz",
"integrity": "sha512-cT3w8yoQTqrtZvWLJeutEGmawITDTY4J6oSVQjeDcPnnoPt0gOFxem8YMznraACXvahw/2+KJDH33BTNgiPo0A==",
"cpu": [
"arm"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-arm64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-arm64/-/sass-embedded-linux-arm64-1.92.1.tgz",
"integrity": "sha512-dNmlpGeZkry1BofhAdGFBXrpM69y9LlYuNnncf+HfsOOUtj8j0q1RwS+zb5asknhKFUOAG8GCGRY1df7Rwu35g==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-musl-arm": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm/-/sass-embedded-linux-musl-arm-1.92.1.tgz",
"integrity": "sha512-nPBos6lI31ef2zQhqTZhFOU7ar4impJbLIax0XsqS269YsiCwjhk11VmUloJTpFlJuKMiVXNo7dPx+katxhD/Q==",
"cpu": [
"arm"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-musl-arm64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm64/-/sass-embedded-linux-musl-arm64-1.92.1.tgz",
"integrity": "sha512-TfiEBkCyNzVoOhjHXUT+vZ6+p0ueDbvRw6f4jHdkvljZzXdXMby4wh7BU1odl69rgRTkSvYKhgbErRLDR/F7pQ==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-musl-riscv64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-riscv64/-/sass-embedded-linux-musl-riscv64-1.92.1.tgz",
"integrity": "sha512-R+RcJA4EYpJDE9JM1GgPYgZo7x94FlxZ6jPodOQkEaZ1S9kvXVCuP5X/0PXRPhu08KJOfeMsAElzfdAjUf7KJg==",
"cpu": [
"riscv64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-musl-x64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-x64/-/sass-embedded-linux-musl-x64-1.92.1.tgz",
"integrity": "sha512-/HolYRGXJjx8nLw6oj5ZrkR7PFM7X/5kE4MYZaFMpDIPIcw3bqB2fUXLo/MYlRLsw7gBAT6hJAMBrNdKuTphfw==",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-riscv64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-riscv64/-/sass-embedded-linux-riscv64-1.92.1.tgz",
"integrity": "sha512-b9bxe0CMsbSsLx3nrR0cq8xpIkoAC6X36o4DGMITF3m2v3KsojC7ru9X0Gz+zUFr6rwpq/0lTNzFLNu6sPNo3w==",
"cpu": [
"riscv64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-x64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-x64/-/sass-embedded-linux-x64-1.92.1.tgz",
"integrity": "sha512-xuiK5Jp5NldW4bvlC7AuX1Wf7o0gLZ3md/hNg+bkTvxtCDgnUHtfdo8Q+xWP11bD9QX31xXFWpmUB8UDLi6XQQ==",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-unknown-all": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-unknown-all/-/sass-embedded-unknown-all-1.92.1.tgz",
"integrity": "sha512-AT9oXvtNY4N+Nd0wvoWqq9A5HjdH/X3aUH4boQUtXyaJ/9DUwnQmBpP5Gtn028ZS8exOGBdobmmWAuigv0k/OA==",
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"!android",
"!darwin",
"!linux",
"!win32"
],
"dependencies": {
"sass": "1.92.1"
}
},
"node_modules/sass-embedded-win32-arm64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-win32-arm64/-/sass-embedded-win32-arm64-1.92.1.tgz",
"integrity": "sha512-KvmpQjY9yTBMtTYz4WBqetlv9bGaDW1aStcu7MSTbH7YiSybX/9fnxlCAEQv1WlIidQhcJAiyk0Eae+LGK7cIQ==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-win32-x64": {
"version": "1.92.1",
"resolved": "https://registry.npmjs.org/sass-embedded-win32-x64/-/sass-embedded-win32-x64-1.92.1.tgz",
"integrity": "sha512-B6Nz/GbH7Vkpb2TkQHsGcczWM5t+70VWopWF1x5V5yxLpA8ZzVQ7NTKKi+jDoVY2Efu6ZyzgT9n5KgG2kWliXA==",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded/node_modules/supports-color": {
"version": "8.1.1",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
"integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
"devOptional": true,
"license": "MIT",
"dependencies": {
"has-flag": "^4.0.0"
},
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/chalk/supports-color?sponsor=1"
}
},
"node_modules/sax": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/sax/-/sax-1.4.1.tgz",
@@ -15155,6 +15580,29 @@
"url": "https://opencollective.com/svgo"
}
},
"node_modules/sync-child-process": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/sync-child-process/-/sync-child-process-1.0.2.tgz",
"integrity": "sha512-8lD+t2KrrScJ/7KXCSyfhT3/hRq78rC0wBFqNJXv3mZyn6hW2ypM05JmlSvtqRbeq6jqA94oHbxAr2vYsJ8vDA==",
"devOptional": true,
"license": "MIT",
"dependencies": {
"sync-message-port": "^1.0.0"
},
"engines": {
"node": ">=16.0.0"
}
},
"node_modules/sync-message-port": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/sync-message-port/-/sync-message-port-1.1.3.tgz",
"integrity": "sha512-GTt8rSKje5FilG+wEdfCkOcLL7LWqpMlr2c3LRuKt/YXxcJ52aGSbGBAdI4L3aaqfrBt6y711El53ItyH1NWzg==",
"devOptional": true,
"license": "MIT",
"engines": {
"node": ">=16.0.0"
}
},
"node_modules/system-architecture": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/system-architecture/-/system-architecture-0.1.0.tgz",
@@ -16185,6 +16633,13 @@
}
}
},
"node_modules/varint": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/varint/-/varint-6.0.0.tgz",
"integrity": "sha512-cXEIW6cfr15lFv563k4GuVuW/fiwjknytD37jIOLSdSWuOI6WnO/oKwmP2FQTU2l01LP8/M5TSAJpzUaGe3uWg==",
"devOptional": true,
"license": "MIT"
},
"node_modules/vaul-vue": {
"version": "0.4.1",
"resolved": "https://registry.npmjs.org/vaul-vue/-/vaul-vue-0.4.1.tgz",
package.json
+3 -1
View File
@@ -24,9 +24,11 @@
"pinia": "^3.0.3",
"typescript": "^5.9.2",
"vue": "^3.5.20",
"vue-router": "^4.5.1"
"vue-router": "^4.5.1",
"vuetify": "^3.4.0"
},
"devDependencies": {
"sass-embedded": "^1.92.1",
"vite-plugin-vuetify": "^2.1.2",
"vuetify": "^3.9.7"
}
pages/Home.vue
+700 -730
View File
File diff suppressed because it is too large Load Diff
pages/figma.vue
+119
View File
@@ -0,0 +1,119 @@
<template>
<v-container fluid class="pa-0">
<div class="rotated-container">
<div class="header-container">
<v-sheet
class="orange-bar"
color="orange-lighten-1"
position="absolute"
></v-sheet>
<v-row no-gutters align="center" class="content-row">
<v-col cols="auto" class="rotated-text-container">
<div class="text-h3 font-weight-bold rotated-text text-orange-darken-1">With Love We Serve</div>
<div class="text-body-1 font-weight-medium rotated-text">Kami Menyediakan Layanan Medis yang Dapat Anda Percayai</div>
</v-col>
<v-spacer></v-spacer>
<v-col cols="auto" class="rotated-text-container text-white">
<div class="text-h6 font-weight-bold rotated-text">rsusaifulanwar.jatimprov.go.id</div>
</v-col>
<v-col cols="auto" class="d-flex flex-column align-center justify-center">
<v-avatar size="40" rounded="0" class="mb-1">
<v-img src="https://placehold.co/40x40"></v-img>
</v-avatar>
</v-col>
<v-col cols="auto" class="rotated-text-container text-white">
<div class="text-h6 font-weight-bold rotated-text">0341-362101</div>
</v-col>
<v-col cols="auto" class="rotated-text-container text-white">
<div class="text-h6 font-weight-bold rotated-text">rssasaifulanwar</div>
</v-col>
<v-col cols="auto" class="rotated-text-container text-white">
<div class="text-h6 font-weight-bold rotated-text">+62 815-5560-6668</div>
</v-col>
</v-row>
</div>
</div>
</v-container>
</template>
<script setup>
// No script logic needed for this static layout
</script>
<style scoped>
.rotated-container {
width: 1133px;
height: 744px;
position: relative;
/* Rotate the entire container 90 degrees clockwise */
transform: rotate(90deg) translateX(0);
transform-origin: top left;
background: white;
overflow: hidden;
}
.header-container {
position: absolute;
left: 46px;
top: 9px;
/* Use flexbox for spacing as per the original design */
display: flex;
align-items: center;
gap: 40px;
}
.content-row {
width: 100%;
}
.orange-bar {
width: 1041px;
height: 72px;
left: 0;
top: -9px;
border-top-left-radius: 60px;
border-top-right-radius: 60px;
z-index: 1; /* Ensure it's behind the text */
}
.rotated-text-container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.rotated-text {
/* Rotate the text 90 degrees counter-clockwise to appear upright in the rotated container */
transform: rotate(-90deg);
transform-origin: top left;
white-space: nowrap; /* Prevent text from wrapping */
}
.rotated-text-container:nth-child(1) .rotated-text:nth-child(1) {
height: 32px; /* Adjusted to fit the original size */
}
.rotated-text-container:nth-child(3) .rotated-text {
height: 272px; /* Match original height */
}
.rotated-text-container:nth-child(5) .rotated-text {
height: 123px; /* Match original height */
}
.rotated-text-container:nth-child(6) .rotated-text {
height: 144px; /* Match original height */
}
.rotated-text-container:nth-child(7) .rotated-text {
height: 181px; /* Match original height */
}
</style>
plugins/vuetify.ts
+27
View File
@@ -0,0 +1,27 @@
import { createVuetify } from 'vuetify'
import * as components from 'vuetify/components'
import * as directives from 'vuetify/directives'
export default defineNuxtPlugin((app) => {
const vuetify = createVuetify({
components,
directives,
theme: {
defaultTheme: 'light',
themes: {
light: {
colors: {
primary: '#FF9800',
secondary: '#FFC107',
accent: '#FF5722',
error: '#F44336',
warning: '#FF9800',
info: '#2196F3',
success: '#4CAF50'
}
}
}
}
})
app.vueApp.use(vuetify)
})
stores/payment.ts
+20 -160
View File
@@ -1,171 +1,31 @@
// stores/payment.ts
import { defineStore } from 'pinia'
// Define a type for the store's state
export interface PaymentState {
payment: {
id: string | null
amount: number
description: string
patientName: string
qrCode: string
status: 'pending' | 'success' | 'failed' | 'expired'
expiryTime: string | null
}
loket: {
id: number | null
name: string
ipAddress: string
location: string
isActive: boolean
}
loading: boolean
error: string | null
}
export const usePaymentStore = defineStore('payment', {
state: (): PaymentState => ({
payment: {
id: null,
amount: 0,
description: '',
patientName: '',
qrCode: '',
status: 'pending',
expiryTime: null,
state: () => ({
currentStep: 1, // 1: info, 2: qr, 3: success
patientInfo: {
name: 'ALDY GUSTINARA',
amount: 'Rp 1.520.000',
expiry: '2025-08-24 12:30:00'
},
loket: {
id: null,
name: '',
ipAddress: '',
location: '',
isActive: false,
},
loading: false,
error: null,
qrCode: 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgZmlsbD0iIzAwMCIvPjxyZWN0IHg9IjEwIiB5PSIxMCIgd2lkdGg9IjE4MCIgaGVpZ2h0PSIxODAiIGZpbGw9IiNmZmYiLz48L3N2Zz4='
}),
getters: {
isSystemReady: (state) => {
return state.loket.id && state.loket.isActive
},
paymentExpired: (state) => {
if (!state.payment.expiryTime) return false
return new Date() > new Date(state.payment.expiryTime)
},
},
actions: {
setLoading(loading: boolean) {
this.loading = loading
},
setError(error: string | null) {
this.error = error
},
clearError() {
this.error = null
},
setPaymentData(data: Partial<PaymentState['payment']>) {
this.payment = { ...this.payment, ...data }
},
setLoketInfo(data: Partial<PaymentState['loket']>) {
this.loket = { ...this.loket, ...data }
},
resetPayment() {
this.payment = {
id: null,
amount: 0,
description: '',
patientName: '',
qrCode: '',
status: 'pending',
expiryTime: null,
nextStep() {
if (this.currentStep < 3) {
this.currentStep++
}
},
// Actions for API calls
async fetchLoketInfo() {
try {
this.setLoading(true)
this.clearError()
const { data } = await $fetch('/api/loket/info', {
headers: {
'X-Client-IP': await this.getClientIP(),
},
})
this.setLoketInfo(data)
return data
} catch (error: any) {
const errorMessage = error.data?.message || 'Gagal mengambil info loket'
this.setError(errorMessage)
throw error
} finally {
this.setLoading(false)
prevStep() {
if (this.currentStep > 1) {
this.currentStep--
}
},
async generatePayment(paymentData: {
patient_name: string
amount: number
description: string
loket_id: number
loket_ip: string
}) {
try {
this.setLoading(true)
this.clearError()
const { data } = await $fetch('/api/payment/generate', {
method: 'POST',
body: paymentData,
headers: {
'X-Client-IP': await this.getClientIP(),
},
})
this.setPaymentData(data)
return data
} catch (error: any) {
const errorMessage = error.data?.message || 'Gagal generate pembayaran'
this.setError(errorMessage)
throw error
} finally {
this.setLoading(false)
}
},
async checkPaymentStatus(paymentId: string) {
try {
const { data } = await $fetch(`/api/payment/status/${paymentId}`)
this.setPaymentData({ status: data.status })
return data
} catch (error) {
console.error('Error checking payment status:', error)
throw error
}
},
// Helper method to get client IP
async getClientIP(): Promise<string> {
if (process.client) {
try {
const response = await fetch('https://api.ipify.org?format=json')
const data = await response.json()
return data.ip
} catch {
return window.location.hostname === 'localhost'
? '127.0.0.1'
: window.location.hostname
}
}
return 'server-side'
},
},
reset() {
this.currentStep = 1
}
}
})