Skip to content

Q
quasar-web-base
Commit 61480537 authored by Võ Quang Thành Đạt's avatar Võ Quang Thành Đạt
Browse files
Options

config axios

parent 811d164a
Hide whitespace changes
Inline Side-by-side
Showing with 349 additions and 62 deletions
.gitignore
View file @ 61480537
...@@ -31,3 +31,6 @@ yarn-error.log* ...@@ -31,3 +31,6 @@ yarn-error.log*
*.ntvs* *.ntvs*
*.njsproj *.njsproj
*.sln *.sln
*.env
configurations.ts
.env
\ No newline at end of file
package-lock.json
View file @ 61480537
...@@ -10,8 +10,11 @@ ...@@ -10,8 +10,11 @@
"@quasar/extras": "^1.0.0", "@quasar/extras": "^1.0.0",
"axios": "^0.21.1", "axios": "^0.21.1",
"core-js": "^3.6.5", "core-js": "^3.6.5",
"http-status-codes": "^2.1.4",
"quasar": "^2.0.0-beta.1", "quasar": "^2.0.0-beta.1",
"vue-i18n": "^9.0.0-beta.0" "secure-ls": "^1.2.6",
"vue-i18n": "^9.0.0-beta.0",
"vuex-persistedstate": "^4.0.0-beta.3"
}, },
"devDependencies": { "devDependencies": {
"@quasar/app": "^3.0.0-beta.1", "@quasar/app": "^3.0.0-beta.1",
...@@ -19,6 +22,7 @@ ...@@ -19,6 +22,7 @@
"@typescript-eslint/eslint-plugin": "^4.16.1", "@typescript-eslint/eslint-plugin": "^4.16.1",
"@typescript-eslint/parser": "^4.16.1", "@typescript-eslint/parser": "^4.16.1",
"babel-eslint": "^10.0.1", "babel-eslint": "^10.0.1",
"dotenv": "^8.2.0",
"eslint": "^7.14.0", "eslint": "^7.14.0",
"eslint-config-prettier": "^8.1.0", "eslint-config-prettier": "^8.1.0",
"eslint-plugin-vue": "^7.0.0" "eslint-plugin-vue": "^7.0.0"
...@@ -4844,6 +4848,11 @@ ...@@ -4844,6 +4848,11 @@
"node": "*" "node": "*"
} }
}, },
"node_modules/crypto-js": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-3.3.0.tgz",
"integrity": "sha512-DIT51nX0dCfKltpRiXV+/TVZq+Qq2NgF4644+K7Ttnla7zEzqc+kjJyiB96BHNyUTBxyjzRcZYpUdZa+QAqi6Q=="
},
"node_modules/css-color-names": { "node_modules/css-color-names": {
"version": "0.0.4", "version": "0.0.4",
"resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz", "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
...@@ -5695,7 +5704,6 @@ ...@@ -5695,7 +5704,6 @@
"version": "4.2.2", "version": "4.2.2",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz", "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
"integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==", "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==",
"dev": true,
"engines": { "engines": {
"node": ">=0.10.0" "node": ">=0.10.0"
} }
...@@ -6038,6 +6046,15 @@ ...@@ -6038,6 +6046,15 @@
"node": ">=8" "node": ">=8"
} }
}, },
"node_modules/dotenv": {
"version": "8.2.0",
"resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
"integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw==",
"dev": true,
"engines": {
"node": ">=8"
}
},
"node_modules/duplexer": { "node_modules/duplexer": {
"version": "0.1.2", "version": "0.1.2",
"resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz", "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz",
...@@ -8450,6 +8467,11 @@ ...@@ -8450,6 +8467,11 @@
"node": ">=8.0.0" "node": ">=8.0.0"
} }
}, },
"node_modules/http-status-codes": {
"version": "2.1.4",
"resolved": "https://registry.npmjs.org/http-status-codes/-/http-status-codes-2.1.4.tgz",
"integrity": "sha512-MZVIsLKGVOVE1KEnldppe6Ij+vmemMuApDfjhVSLzyYP+td0bREEYyAoIw9yFePoBXManCuBqmiNP5FqJS5Xkg=="
},
"node_modules/https-browserify": { "node_modules/https-browserify": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz", "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
...@@ -9829,6 +9851,14 @@ ...@@ -9829,6 +9851,14 @@
"yallist": "^3.0.2" "yallist": "^3.0.2"
} }
}, },
"node_modules/lz-string": {
"version": "1.4.4",
"resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.4.4.tgz",
"integrity": "sha1-wNjq82BZ9wV5bh40SBHPTEmNOiY=",
"bin": {
"lz-string": "bin/bin.js"
}
},
"node_modules/magic-string": { "node_modules/magic-string": {
"version": "0.25.7", "version": "0.25.7",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz",
...@@ -16811,6 +16841,15 @@ ...@@ -16811,6 +16841,15 @@
"url": "https://opencollective.com/webpack" "url": "https://opencollective.com/webpack"
} }
}, },
"node_modules/secure-ls": {
"version": "1.2.6",
"resolved": "https://registry.npmjs.org/secure-ls/-/secure-ls-1.2.6.tgz",
"integrity": "sha512-g8vUSKl6elSfyAUHodybnNkuZW+mUYEOWj4SZIDg+xoQ1dq5ddktBoOFrtxQBUl88ZyAJOtGWQ1PRaOxkTAuZQ==",
"dependencies": {
"crypto-js": "^3.1.6",
"lz-string": "^1.4.4"
}
},
"node_modules/select-hose": { "node_modules/select-hose": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz", "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
...@@ -17097,6 +17136,11 @@ ...@@ -17097,6 +17136,11 @@
"integrity": "sha512-mRz/m/JVscCrkMyPqHc/bczi3OQHkLTqXHEFu0zDhK/qfv3UcOA4SVmRCLmos4bhjr9ekVQubj/R7waKapmiQg==", "integrity": "sha512-mRz/m/JVscCrkMyPqHc/bczi3OQHkLTqXHEFu0zDhK/qfv3UcOA4SVmRCLmos4bhjr9ekVQubj/R7waKapmiQg==",
"dev": true "dev": true
}, },
"node_modules/shvl": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/shvl/-/shvl-2.0.3.tgz",
"integrity": "sha512-V7C6S9Hlol6SzOJPnQ7qzOVEWUQImt3BNmmzh40wObhla3XOYMe4gGiYzLrJd5TFa+cI2f9LKIRJTTKZSTbWgw=="
},
"node_modules/signal-exit": { "node_modules/signal-exit": {
"version": "3.0.3", "version": "3.0.3",
"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.3.tgz", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.3.tgz",
...@@ -19144,11 +19188,22 @@ ...@@ -19144,11 +19188,22 @@
"version": "4.0.0", "version": "4.0.0",
"resolved": "https://registry.npmjs.org/vuex/-/vuex-4.0.0.tgz", "resolved": "https://registry.npmjs.org/vuex/-/vuex-4.0.0.tgz",
"integrity": "sha512-56VPujlHscP5q/e7Jlpqc40sja4vOhC4uJD1llBCWolVI8ND4+VzisDVkUMl+z5y0MpIImW6HjhNc+ZvuizgOw==", "integrity": "sha512-56VPujlHscP5q/e7Jlpqc40sja4vOhC4uJD1llBCWolVI8ND4+VzisDVkUMl+z5y0MpIImW6HjhNc+ZvuizgOw==",
"dev": true,
"peerDependencies": { "peerDependencies": {
"vue": "^3.0.2" "vue": "^3.0.2"
} }
}, },
"node_modules/vuex-persistedstate": {
"version": "4.0.0-beta.3",
"resolved": "https://registry.npmjs.org/vuex-persistedstate/-/vuex-persistedstate-4.0.0-beta.3.tgz",
"integrity": "sha512-T4IRD27qoUWh+8qr6T6zVp15xO7x/nPgnU13OD0C2uUwA7U9PhGozrj6lvVmMYDyRgc36J0msMXn3GvwHjkIhA==",
"dependencies": {
"deepmerge": "^4.2.2",
"shvl": "^2.0.2"
},
"peerDependencies": {
"vuex": "^3.0 || ^4.0.0-rc"
}
},
"node_modules/watchpack": { "node_modules/watchpack": {
"version": "1.7.5", "version": "1.7.5",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz",
...@@ -25388,6 +25443,11 @@ ...@@ -25388,6 +25443,11 @@
"randomfill": "^1.0.3" "randomfill": "^1.0.3"
} }
}, },
"crypto-js": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-3.3.0.tgz",
"integrity": "sha512-DIT51nX0dCfKltpRiXV+/TVZq+Qq2NgF4644+K7Ttnla7zEzqc+kjJyiB96BHNyUTBxyjzRcZYpUdZa+QAqi6Q=="
},
"css-color-names": { "css-color-names": {
"version": "0.0.4", "version": "0.0.4",
"resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz", "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
...@@ -26053,8 +26113,7 @@ ...@@ -26053,8 +26113,7 @@
"deepmerge": { "deepmerge": {
"version": "4.2.2", "version": "4.2.2",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz", "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz",
"integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==", "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg=="
"dev": true
}, },
"default-gateway": { "default-gateway": {
"version": "4.2.0", "version": "4.2.0",
...@@ -26352,6 +26411,12 @@ ...@@ -26352,6 +26411,12 @@
"is-obj": "^2.0.0" "is-obj": "^2.0.0"
} }
}, },
"dotenv": {
"version": "8.2.0",
"resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
"integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw==",
"dev": true
},
"duplexer": { "duplexer": {
"version": "0.1.2", "version": "0.1.2",
"resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz", "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz",
...@@ -28311,6 +28376,11 @@ ...@@ -28311,6 +28376,11 @@
"micromatch": "^4.0.2" "micromatch": "^4.0.2"
} }
}, },
"http-status-codes": {
"version": "2.1.4",
"resolved": "https://registry.npmjs.org/http-status-codes/-/http-status-codes-2.1.4.tgz",
"integrity": "sha512-MZVIsLKGVOVE1KEnldppe6Ij+vmemMuApDfjhVSLzyYP+td0bREEYyAoIw9yFePoBXManCuBqmiNP5FqJS5Xkg=="
},
"https-browserify": { "https-browserify": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz", "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
...@@ -29386,6 +29456,11 @@ ...@@ -29386,6 +29456,11 @@
"yallist": "^3.0.2" "yallist": "^3.0.2"
} }
}, },
"lz-string": {
"version": "1.4.4",
"resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.4.4.tgz",
"integrity": "sha1-wNjq82BZ9wV5bh40SBHPTEmNOiY="
},
"magic-string": { "magic-string": {
"version": "0.25.7", "version": "0.25.7",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz",
...@@ -34908,6 +34983,15 @@ ...@@ -34908,6 +34983,15 @@
"ajv-keywords": "^3.5.2" "ajv-keywords": "^3.5.2"
} }
}, },
"secure-ls": {
"version": "1.2.6",
"resolved": "https://registry.npmjs.org/secure-ls/-/secure-ls-1.2.6.tgz",
"integrity": "sha512-g8vUSKl6elSfyAUHodybnNkuZW+mUYEOWj4SZIDg+xoQ1dq5ddktBoOFrtxQBUl88ZyAJOtGWQ1PRaOxkTAuZQ==",
"requires": {
"crypto-js": "^3.1.6",
"lz-string": "^1.4.4"
}
},
"select-hose": { "select-hose": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz", "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
...@@ -35159,6 +35243,11 @@ ...@@ -35159,6 +35243,11 @@
"integrity": "sha512-mRz/m/JVscCrkMyPqHc/bczi3OQHkLTqXHEFu0zDhK/qfv3UcOA4SVmRCLmos4bhjr9ekVQubj/R7waKapmiQg==", "integrity": "sha512-mRz/m/JVscCrkMyPqHc/bczi3OQHkLTqXHEFu0zDhK/qfv3UcOA4SVmRCLmos4bhjr9ekVQubj/R7waKapmiQg==",
"dev": true "dev": true
}, },
"shvl": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/shvl/-/shvl-2.0.3.tgz",
"integrity": "sha512-V7C6S9Hlol6SzOJPnQ7qzOVEWUQImt3BNmmzh40wObhla3XOYMe4gGiYzLrJd5TFa+cI2f9LKIRJTTKZSTbWgw=="
},
"signal-exit": { "signal-exit": {
"version": "3.0.3", "version": "3.0.3",
"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.3.tgz", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.3.tgz",
...@@ -36832,9 +36921,17 @@ ...@@ -36832,9 +36921,17 @@
"version": "4.0.0", "version": "4.0.0",
"resolved": "https://registry.npmjs.org/vuex/-/vuex-4.0.0.tgz", "resolved": "https://registry.npmjs.org/vuex/-/vuex-4.0.0.tgz",
"integrity": "sha512-56VPujlHscP5q/e7Jlpqc40sja4vOhC4uJD1llBCWolVI8ND4+VzisDVkUMl+z5y0MpIImW6HjhNc+ZvuizgOw==", "integrity": "sha512-56VPujlHscP5q/e7Jlpqc40sja4vOhC4uJD1llBCWolVI8ND4+VzisDVkUMl+z5y0MpIImW6HjhNc+ZvuizgOw==",
"dev": true,
"requires": {} "requires": {}
}, },
"vuex-persistedstate": {
"version": "4.0.0-beta.3",
"resolved": "https://registry.npmjs.org/vuex-persistedstate/-/vuex-persistedstate-4.0.0-beta.3.tgz",
"integrity": "sha512-T4IRD27qoUWh+8qr6T6zVp15xO7x/nPgnU13OD0C2uUwA7U9PhGozrj6lvVmMYDyRgc36J0msMXn3GvwHjkIhA==",
"requires": {
"deepmerge": "^4.2.2",
"shvl": "^2.0.2"
}
},
"watchpack": { "watchpack": {
"version": "1.7.5", "version": "1.7.5",
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz",
quasar.conf.js
View file @ 61480537
...@@ -19,7 +19,7 @@ module.exports = configure(function (ctx) { ...@@ -19,7 +19,7 @@ module.exports = configure(function (ctx) {
enabled: true, enabled: true,
files: './src/**/*.{ts,tsx,js,jsx,vue}', files: './src/**/*.{ts,tsx,js,jsx,vue}',
}, },
} },
}, },
// https://v2.quasar.dev/quasar-cli/prefetch-feature // https://v2.quasar.dev/quasar-cli/prefetch-feature
...@@ -28,15 +28,10 @@ module.exports = configure(function (ctx) { ...@@ -28,15 +28,10 @@ module.exports = configure(function (ctx) {
// app boot file (/src/boot) // app boot file (/src/boot)
// --> boot files are part of "main.js" // --> boot files are part of "main.js"
// https://v2.quasar.dev/quasar-cli/boot-files // https://v2.quasar.dev/quasar-cli/boot-files
boot: [ boot: ['i18n', 'axios'],
'i18n',
'axios',
],
// https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css // https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css
css: [ css: ['app.scss'],
'app.scss'
],
// https://github.com/quasarframework/quasar/tree/dev/extras // https://github.com/quasarframework/quasar/tree/dev/extras
extras: [ extras: [
...@@ -74,16 +69,19 @@ module.exports = configure(function (ctx) { ...@@ -74,16 +69,19 @@ module.exports = configure(function (ctx) {
// https://v2.quasar.dev/quasar-cli/handling-webpack // https://v2.quasar.dev/quasar-cli/handling-webpack
// "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain // "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain
chainWebpack (/* chain */) { chainWebpack(/* chain */) {
// //
}, },
env: {
api: 'test',
},
}, },
// Full list of options: https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-devServer // Full list of options: https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-devServer
devServer: { devServer: {
https: false, https: false,
port: 8080, port: 8080,
open: true // opens browser window automatically open: true, // opens browser window automatically
}, },
// https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-framework // https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-framework
...@@ -101,7 +99,7 @@ module.exports = configure(function (ctx) { ...@@ -101,7 +99,7 @@ module.exports = configure(function (ctx) {
// directives: [], // directives: [],
// Quasar plugins // Quasar plugins
plugins: [] plugins: ['Notify'],
}, },
// animations: 'all', // --- includes all animations // animations: 'all', // --- includes all animations
...@@ -113,19 +111,19 @@ module.exports = configure(function (ctx) { ...@@ -113,19 +111,19 @@ module.exports = configure(function (ctx) {
pwa: false, pwa: false,
// manualStoreHydration: true, // manualStoreHydration: true,
prodPort: 3000, // The default port that the production server should use prodPort: 3000, // The default port that the production server should use
// (gets superseded if process.env.PORT is specified at runtime) // (gets superseded if process.env.PORT is specified at runtime)
maxAge: 1000 * 60 * 60 * 24 * 30, maxAge: 1000 * 60 * 60 * 24 * 30,
// Tell browser when a file from the server should expire from cache (in ms) // Tell browser when a file from the server should expire from cache (in ms)
chainWebpackWebserver (/* chain */) { chainWebpackWebserver(/* chain */) {
// //
}, },
middlewares: [ middlewares: [
ctx.prod ? 'compression' : '', ctx.prod ? 'compression' : '',
'render' // keep this as last one 'render', // keep this as last one
] ],
}, },
// https://v2.quasar.dev/quasar-cli/developing-pwa/configuring-pwa // https://v2.quasar.dev/quasar-cli/developing-pwa/configuring-pwa
...@@ -135,7 +133,7 @@ module.exports = configure(function (ctx) { ...@@ -135,7 +133,7 @@ module.exports = configure(function (ctx) {
// for the custom service worker ONLY (/src-pwa/custom-service-worker.[js|ts]) // for the custom service worker ONLY (/src-pwa/custom-service-worker.[js|ts])
// if using workbox in InjectManifest mode // if using workbox in InjectManifest mode
chainWebpackCustomSW (/* chain */) { chainWebpackCustomSW(/* chain */) {
// //
}, },
...@@ -151,30 +149,30 @@ module.exports = configure(function (ctx) { ...@@ -151,30 +149,30 @@ module.exports = configure(function (ctx) {
{ {
src: 'icons/icon-128x128.png', src: 'icons/icon-128x128.png',
sizes: '128x128', sizes: '128x128',
type: 'image/png' type: 'image/png',
}, },
{ {
src: 'icons/icon-192x192.png', src: 'icons/icon-192x192.png',
sizes: '192x192', sizes: '192x192',
type: 'image/png' type: 'image/png',
}, },
{ {
src: 'icons/icon-256x256.png', src: 'icons/icon-256x256.png',
sizes: '256x256', sizes: '256x256',
type: 'image/png' type: 'image/png',
}, },
{ {
src: 'icons/icon-384x384.png', src: 'icons/icon-384x384.png',
sizes: '384x384', sizes: '384x384',
type: 'image/png' type: 'image/png',
}, },
{ {
src: 'icons/icon-512x512.png', src: 'icons/icon-512x512.png',
sizes: '512x512', sizes: '512x512',
type: 'image/png' type: 'image/png',
} },
] ],
} },
}, },
// Full list of options: https://v2.quasar.dev/quasar-cli/developing-cordova-apps/configuring-cordova // Full list of options: https://v2.quasar.dev/quasar-cli/developing-cordova-apps/configuring-cordova
...@@ -184,7 +182,7 @@ module.exports = configure(function (ctx) { ...@@ -184,7 +182,7 @@ module.exports = configure(function (ctx) {
// Full list of options: https://v2.quasar.dev/quasar-cli/developing-capacitor-apps/configuring-capacitor // Full list of options: https://v2.quasar.dev/quasar-cli/developing-capacitor-apps/configuring-capacitor
capacitor: { capacitor: {
hideSplashscreen: true hideSplashscreen: true,
}, },
// Full list of options: https://v2.quasar.dev/quasar-cli/developing-electron-apps/configuring-electron // Full list of options: https://v2.quasar.dev/quasar-cli/developing-electron-apps/configuring-electron
...@@ -193,13 +191,11 @@ module.exports = configure(function (ctx) { ...@@ -193,13 +191,11 @@ module.exports = configure(function (ctx) {
packager: { packager: {
// https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options // https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options
// OS X / Mac App Store // OS X / Mac App Store
// appBundleId: '', // appBundleId: '',
// appCategoryType: '', // appCategoryType: '',
// osxSign: '', // osxSign: '',
// protocol: 'myapp://path', // protocol: 'myapp://path',
// Windows only // Windows only
// win32metadata: { ... } // win32metadata: { ... }
}, },
...@@ -207,20 +203,20 @@ module.exports = configure(function (ctx) { ...@@ -207,20 +203,20 @@ module.exports = configure(function (ctx) {
builder: { builder: {
// https://www.electron.build/configuration/configuration // https://www.electron.build/configuration/configuration
appId: 'quasar-web-base' appId: 'quasar-web-base',
}, },
// "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain // "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain
chainWebpack (/* chain */) { chainWebpack(/* chain */) {
// do something with the Electron main process Webpack cfg // do something with the Electron main process Webpack cfg
// extendWebpackMain also available besides this chainWebpackMain // extendWebpackMain also available besides this chainWebpackMain
}, },
// "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain // "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain
chainWebpackPreload (/* chain */) { chainWebpackPreload(/* chain */) {
// do something with the Electron main process Webpack cfg // do something with the Electron main process Webpack cfg
// extendWebpackPreload also available besides this chainWebpackPreload // extendWebpackPreload also available besides this chainWebpackPreload
}, },
} },
} };
}); });
src/assets/configurations.example.ts 0 → 100644
View file @ 61480537
export const config = {
API_ENDPOINT: 'http://cms.vab.xteldev.com/api/',
API_RES_CODE: {
OK: {
code: 0,
},
TOKEN_INVALID: {
code: 1,
},
TOKEN_EXPIRES: {
code: 2,
},
},
};
src/boot/axios.ts
View file @ 61480537
import { boot } from 'quasar/wrappers'; import { boot } from 'quasar/wrappers';
import axios, { AxiosInstance } from 'axios'; import axios, {
AxiosError,
AxiosInstance,
AxiosRequestConfig,
AxiosResponse,
} from 'axios';
import { config } from 'src/assets/configurations';
import { StateInterface } from 'src/store';
import { Store } from 'vuex';
import { Notify } from 'quasar';
import { i18n } from './i18n';
import { StatusCodes } from 'http-status-codes';
declare module '@vue/runtime-core' { declare module '@vue/runtime-core' {
interface ComponentCustomProperties { interface ComponentCustomProperties {
...@@ -7,11 +18,74 @@ declare module '@vue/runtime-core' { ...@@ -7,11 +18,74 @@ declare module '@vue/runtime-core' {
} }
} }
const api = axios.create({ baseURL: 'https://api.example.com' }); const api = axios.create({ baseURL: config.API_ENDPOINT });
export default boot(({ app }) => { export type BaseResponseBody = {
error: {
code: number;
message: string;
};
data: unknown;
};
export default boot(({ app, store }) => {
// for use inside Vue files (Options API) through this.$axios and this.$api // for use inside Vue files (Options API) through this.$axios and this.$api
const $store = store as Store<StateInterface>;
const onRequest = (config: AxiosRequestConfig) => {
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
config.headers.Authorization = `Bearer ${
$store.state.authentication.token || ''
}`;
return config;
};
const onRequestError = (error: Error) => {
Notify.create({
type: 'negative',
message: i18n.global.t('requestErrorMessage'),
});
console.log('[REQUEST ERROR]: ', error);
return Promise.reject(error);
};
const onResponse = (res: AxiosResponse<BaseResponseBody>) => {
if (
res.data.error.code === config.API_RES_CODE.TOKEN_INVALID.code ||
res.data.error.code === config.API_RES_CODE.TOKEN_EXPIRES.code
) {
// ...
Notify.create({
type: 'warning',
message: i18n.global.t('tokenInvalidMessage'),
});
// ... Logout
}
return res;
};
const onResponseError = (error: Error | AxiosError) => {
if (error instanceof Error) {
Notify.create({
type: 'negative',
message: i18n.global.t('responseErrorMessage'),
});
} else {
const axiosError = error as AxiosError;
const response = axiosError.response as AxiosResponse<BaseResponseBody>;
if (response.status === StatusCodes.NOT_FOUND) {
// ...
}
}
console.log('[RESPONSE ERROR]: ', error);
return Promise.reject(error);
};
api.interceptors.request.use(onRequest, onRequestError);
api.interceptors.response.use(onResponse, onResponseError);
app.config.globalProperties.$axios = axios; app.config.globalProperties.$axios = axios;
// ^ ^ ^ this will allow you to use this.$axios (for Vue Options API form) // ^ ^ ^ this will allow you to use this.$axios (for Vue Options API form)
// so you won't necessarily have to import axios in each vue file // so you won't necessarily have to import axios in each vue file
......
src/boot/i18n.ts
View file @ 61480537
...@@ -4,7 +4,7 @@ import { createI18n } from 'vue-i18n'; ...@@ -4,7 +4,7 @@ import { createI18n } from 'vue-i18n';
import messages from 'src/i18n'; import messages from 'src/i18n';
const i18n = createI18n({ const i18n = createI18n({
locale: 'en-US', locale: 'vi',
messages, messages,
}); });
......
src/i18n/en-US/index.ts
View file @ 61480537
// This is just an example, // This is just an example,
// so you can safely delete all default props below // so you can safely delete all default props below
import vi from '../vi';
export default { export default {
failed: 'Action failed', ...vi,
success: 'Action was successful'
}; };
src/i18n/index.ts
View file @ 61480537
import enUS from './en-US'; import enUS from './en-US';
import vi from './vi';
export default { export default {
'en-US': enUS 'en-US': enUS,
vi,
}; };
src/i18n/vi/index.ts 0 → 100644
View file @ 61480537
// This is just an example,
// so you can safely delete all default props below
export default {
failed: 'Action failed',
success: 'Action was successful',
requestErrorMessage: 'Không thể kết nối đến server',
responseErrorMessage: '',
tokenInvalidMessage: 'Phiên đăng nhập hết hạn. Vui lòng đăng nhập lại',
};
src/pages/Index.vue
View file @ 61480537
...@@ -6,18 +6,24 @@ ...@@ -6,18 +6,24 @@
:todos="todos" :todos="todos"
:meta="meta" :meta="meta"
></example-component> ></example-component>
{{ config }}
</q-page> </q-page>
</template> </template>
<script lang="ts"> <script lang="ts">
import { Todo, Meta } from '../components/models'; import { Todo, Meta } from '../components/models';
import ExampleComponent from '../components/CompositionComponent.vue'; import ExampleComponent from '../components/CompositionComponent.vue';
import { defineComponent, ref } from 'vue'; import { defineComponent, ref, onMounted } from 'vue';
import { useStore } from '../store';
export default defineComponent({ export default defineComponent({
name: 'PageIndex', name: 'PageIndex',
components: { ExampleComponent }, components: { ExampleComponent },
setup() { setup() {
const $store = useStore();
onMounted(() => {
$store.commit('authentication/setToken');
});
const todos = ref<Todo[]>([ const todos = ref<Todo[]>([
{ {
id: 1, id: 1,
...@@ -43,6 +49,7 @@ export default defineComponent({ ...@@ -43,6 +49,7 @@ export default defineComponent({
const meta = ref<Meta>({ const meta = ref<Meta>({
totalCount: 1200, totalCount: 1200,
}); });
return { todos, meta }; return { todos, meta };
}, },
}); });
......
src/store/authentication/actions.ts 0 → 100644
View file @ 61480537
import { ActionTree } from 'vuex';
import { StateInterface } from '../index';
import { AuthenticationState } from './state';
const actions: ActionTree<AuthenticationState, StateInterface> = {
someAction (/* context */) {
// your code
}
};
export default actions;
src/store/authentication/getters.ts 0 → 100644
View file @ 61480537
import { GetterTree } from 'vuex';
import { StateInterface } from '../index';
import { AuthenticationState } from './state';
const getters: GetterTree<AuthenticationState, StateInterface> = {
someGetter (/* context */) {
// your code
}
};
export default getters;
src/store/authentication/index.ts 0 → 100644
View file @ 61480537
import { Module } from 'vuex';
import { StateInterface } from '../index';
import state, { AuthenticationState } from './state';
import actions from './actions';
import getters from './getters';
import mutations from './mutations';
const exampleModule: Module<AuthenticationState, StateInterface> = {
namespaced: true,
actions,
getters,
mutations,
state
};
export default exampleModule;
src/store/authentication/mutations.ts 0 → 100644
View file @ 61480537
import { MutationTree } from 'vuex';
import { AuthenticationState } from './state';
const mutation: MutationTree<AuthenticationState> = {
setToken(state) {
state.token = 'aksjhdkajshdk';
},
};
export default mutation;
src/store/authentication/state.ts 0 → 100644
View file @ 61480537
export interface AuthenticationState {
token?: string
}
function state(): AuthenticationState {
return {
token: ''
};
}
export default state;
src/store/index.ts
View file @ 61480537
import { store } from 'quasar/wrappers' import { store } from 'quasar/wrappers';
import { InjectionKey } from 'vue' import { InjectionKey } from 'vue';
import { import {
createStore, createStore,
Store as VuexStore, Store as VuexStore,
useStore as vuexUseStore, useStore as vuexUseStore,
} from 'vuex' } from 'vuex';
// import example from './module-example' import authentication from './authentication';
// import { ExampleStateInterface } from './module-example/state'; import { AuthenticationState } from './authentication/state';
import SecureLS from 'secure-ls';
import createPersistedState from 'vuex-persistedstate';
// eslint-disable-next-line
const ls = new SecureLS({ isCompression: true });
/* /*
* If not building with SSR mode, you can * If not building with SSR mode, you can
...@@ -22,33 +26,50 @@ export interface StateInterface { ...@@ -22,33 +26,50 @@ export interface StateInterface {
// Define your own store structure, using submodules if needed // Define your own store structure, using submodules if needed
// example: ExampleStateInterface; // example: ExampleStateInterface;
// Declared as unknown to avoid linting issue. Best to strongly type as per the line above. // Declared as unknown to avoid linting issue. Best to strongly type as per the line above.
example: unknown authentication: AuthenticationState;
} }
// provide typings for `this.$store` // provide typings for `this.$store`
declare module '@vue/runtime-core' { declare module '@vue/runtime-core' {
interface ComponentCustomProperties { interface ComponentCustomProperties {
$store: VuexStore<StateInterface> $store: VuexStore<StateInterface>;
} }
} }
// provide typings for `useStore` helper // provide typings for `useStore` helper
export const storeKey: InjectionKey<VuexStore<StateInterface>> = Symbol('vuex-key') export const storeKey: InjectionKey<VuexStore<StateInterface>> = Symbol(
'vuex-key'
);
export default store(function (/* { ssrContext } */) { export default store(function (/* { ssrContext } */) {
const Store = createStore<StateInterface>({ const Store = createStore<StateInterface>({
modules: { modules: {
// example // example
authentication,
}, },
plugins: [
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
createPersistedState({
storage: {
// eslint-disable-next-line
getItem: (key: string) => ls.get(key),
// eslint-disable-next-line
setItem: (key: string, value: unknown) => ls.set(key, value),
// eslint-disable-next-line
removeItem: (key: string) => ls.remove(key),
},
}),
],
// enable strict mode (adds overhead!) // enable strict mode (adds overhead!)
// for dev mode and --debug builds only // for dev mode and --debug builds only
strict: !!process.env.DEBUGGING strict: !!process.env.DEBUGGING,
}) });
return Store; return Store;
}) });
export function useStore() { export function useStore() {
return vuexUseStore(storeKey) return vuexUseStore(storeKey);
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment