forked from verdnatura/salix-front
Formatted project
This commit is contained in:
parent
ecdb785abb
commit
c29a51fc48
|
|
@ -3,7 +3,7 @@ root = true
|
|||
[*]
|
||||
charset = utf-8
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
indent_size = 4
|
||||
end_of_line = lf
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
|
|
|
|||
152
.eslintrc.js
152
.eslintrc.js
|
|
@ -1,80 +1,78 @@
|
|||
module.exports = {
|
||||
// https://eslint.org/docs/user-guide/configuring#configuration-cascading-and-hierarchy
|
||||
// This option interrupts the configuration hierarchy at this file
|
||||
// Remove this if you have an higher level ESLint config file (it usually happens into a monorepos)
|
||||
root: true,
|
||||
// https://eslint.org/docs/user-guide/configuring#configuration-cascading-and-hierarchy
|
||||
// This option interrupts the configuration hierarchy at this file
|
||||
// Remove this if you have an higher level ESLint config file (it usually happens into a monorepos)
|
||||
root: true,
|
||||
|
||||
parserOptions: {
|
||||
parser: '@babel/eslint-parser',
|
||||
ecmaVersion: 2018, // Allows for the parsing of modern ECMAScript features
|
||||
sourceType: 'module' // Allows for the use of imports
|
||||
},
|
||||
|
||||
env: {
|
||||
browser: true
|
||||
},
|
||||
|
||||
// Rules order is important, please avoid shuffling them
|
||||
extends: [
|
||||
// Base ESLint recommended rules
|
||||
// 'eslint:recommended',
|
||||
|
||||
// Uncomment any of the lines below to choose desired strictness,
|
||||
// but leave only one uncommented!
|
||||
// See https://eslint.vuejs.org/rules/#available-rules
|
||||
'plugin:vue/vue3-essential', // Priority A: Essential (Error Prevention)
|
||||
// 'plugin:vue/vue3-strongly-recommended', // Priority B: Strongly Recommended (Improving Readability)
|
||||
// 'plugin:vue/vue3-recommended', // Priority C: Recommended (Minimizing Arbitrary Choices and Cognitive Overhead)
|
||||
|
||||
// https://github.com/prettier/eslint-config-prettier#installation
|
||||
// usage with Prettier, provided by 'eslint-config-prettier'.
|
||||
'prettier'
|
||||
],
|
||||
|
||||
plugins: [
|
||||
// https://eslint.vuejs.org/user-guide/#why-doesn-t-it-work-on-vue-files
|
||||
// required to lint *.vue files
|
||||
'vue',
|
||||
|
||||
// https://github.com/typescript-eslint/typescript-eslint/issues/389#issuecomment-509292674
|
||||
// Prettier has not been included as plugin to avoid performance impact
|
||||
// add it as an extension for your IDE
|
||||
|
||||
],
|
||||
|
||||
globals: {
|
||||
ga: 'readonly', // Google Analytics
|
||||
cordova: 'readonly',
|
||||
__statics: 'readonly',
|
||||
__QUASAR_SSR__: 'readonly',
|
||||
__QUASAR_SSR_SERVER__: 'readonly',
|
||||
__QUASAR_SSR_CLIENT__: 'readonly',
|
||||
__QUASAR_SSR_PWA__: 'readonly',
|
||||
process: 'readonly',
|
||||
Capacitor: 'readonly',
|
||||
chrome: 'readonly',
|
||||
defineProps: 'readonly', // Vue SFC setup compiler macro
|
||||
defineEmits: 'readonly', // Vue SFC setup compiler macro
|
||||
defineExpose: 'readonly' // Vue SFC setup compiler macro
|
||||
},
|
||||
|
||||
// add your custom rules here
|
||||
rules: {
|
||||
|
||||
'prefer-promise-reject-errors': 'off',
|
||||
|
||||
// allow debugger during development only
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
|
||||
},
|
||||
|
||||
overrides: [
|
||||
{
|
||||
files: ['**/*.spec.{js,ts}'],
|
||||
extends: [
|
||||
// Add Cypress-specific lint rules, globals and Cypress plugin
|
||||
// See https://github.com/cypress-io/eslint-plugin-cypress#rules
|
||||
'plugin:cypress/recommended',
|
||||
],
|
||||
parserOptions: {
|
||||
parser: '@babel/eslint-parser',
|
||||
ecmaVersion: 2020, // Allows for the parsing of modern ECMAScript features
|
||||
sourceType: 'module', // Allows for the use of imports
|
||||
},
|
||||
],
|
||||
}
|
||||
|
||||
env: {
|
||||
browser: true,
|
||||
},
|
||||
|
||||
// Rules order is important, please avoid shuffling them
|
||||
extends: [
|
||||
// Base ESLint recommended rules
|
||||
'eslint:recommended',
|
||||
|
||||
// Uncomment any of the lines below to choose desired strictness,
|
||||
// but leave only one uncommented!
|
||||
// See https://eslint.vuejs.org/rules/#available-rules
|
||||
//'plugin:vue/vue3-essential', // Priority A: Essential (Error Prevention)
|
||||
'plugin:vue/vue3-strongly-recommended', // Priority B: Strongly Recommended (Improving Readability)
|
||||
// 'plugin:vue/vue3-recommended', // Priority C: Recommended (Minimizing Arbitrary Choices and Cognitive Overhead)
|
||||
|
||||
// https://github.com/prettier/eslint-config-prettier#installation
|
||||
// usage with Prettier, provided by 'eslint-config-prettier'.
|
||||
'prettier',
|
||||
],
|
||||
|
||||
plugins: [
|
||||
// https://eslint.vuejs.org/user-guide/#why-doesn-t-it-work-on-vue-files
|
||||
// required to lint *.vue files
|
||||
'vue',
|
||||
|
||||
// https://github.com/typescript-eslint/typescript-eslint/issues/389#issuecomment-509292674
|
||||
// Prettier has not been included as plugin to avoid performance impact
|
||||
// add it as an extension for your IDE
|
||||
],
|
||||
|
||||
globals: {
|
||||
ga: 'readonly', // Google Analytics
|
||||
cordova: 'readonly',
|
||||
__statics: 'readonly',
|
||||
__QUASAR_SSR__: 'readonly',
|
||||
__QUASAR_SSR_SERVER__: 'readonly',
|
||||
__QUASAR_SSR_CLIENT__: 'readonly',
|
||||
__QUASAR_SSR_PWA__: 'readonly',
|
||||
process: 'readonly',
|
||||
Capacitor: 'readonly',
|
||||
chrome: 'readonly',
|
||||
defineProps: 'readonly', // Vue SFC setup compiler macro
|
||||
defineEmits: 'readonly', // Vue SFC setup compiler macro
|
||||
defineExpose: 'readonly', // Vue SFC setup compiler macro
|
||||
},
|
||||
|
||||
// add your custom rules here
|
||||
rules: {
|
||||
'prefer-promise-reject-errors': 'off',
|
||||
|
||||
// allow debugger during development only
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||
},
|
||||
|
||||
overrides: [
|
||||
{
|
||||
files: ['**/*.spec.{js,ts}'],
|
||||
extends: [
|
||||
// Add Cypress-specific lint rules, globals and Cypress plugin
|
||||
// See https://github.com/cypress-io/eslint-plugin-cypress#rules
|
||||
'plugin:cypress/recommended',
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@
|
|||
// https://github.com/michael-ciniawsky/postcss-load-config
|
||||
|
||||
module.exports = {
|
||||
plugins: [
|
||||
// to edit target browsers: use "browserslist" field in package.json
|
||||
require('autoprefixer')
|
||||
]
|
||||
}
|
||||
plugins: [
|
||||
// to edit target browsers: use "browserslist" field in package.json
|
||||
require('autoprefixer'),
|
||||
],
|
||||
};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,7 @@
|
|||
module.exports = {
|
||||
singleQuote: true,
|
||||
printWidth: 120,
|
||||
tabWidth: 4,
|
||||
semi: true,
|
||||
endOfLine: 'auto',
|
||||
};
|
||||
|
|
@ -1,15 +1,15 @@
|
|||
{
|
||||
"recommendations": [
|
||||
"dbaeumer.vscode-eslint",
|
||||
"esbenp.prettier-vscode",
|
||||
"editorconfig.editorconfig",
|
||||
"johnsoncodehk.volar",
|
||||
"wayou.vscode-todo-highlight"
|
||||
],
|
||||
"unwantedRecommendations": [
|
||||
"octref.vetur",
|
||||
"hookyqr.beautify",
|
||||
"dbaeumer.jshint",
|
||||
"ms-vscode.vscode-typescript-tslint-plugin"
|
||||
]
|
||||
}
|
||||
"recommendations": [
|
||||
"dbaeumer.vscode-eslint",
|
||||
"esbenp.prettier-vscode",
|
||||
"editorconfig.editorconfig",
|
||||
"johnsoncodehk.volar",
|
||||
"wayou.vscode-todo-highlight"
|
||||
],
|
||||
"unwantedRecommendations": [
|
||||
"octref.vetur",
|
||||
"hookyqr.beautify",
|
||||
"dbaeumer.jshint",
|
||||
"ms-vscode.vscode-typescript-tslint-plugin"
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,24 +1,15 @@
|
|||
{
|
||||
"editor.bracketPairColorization.enabled": true,
|
||||
"editor.guides.bracketPairs": true,
|
||||
"editor.formatOnSave": true,
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode",
|
||||
"editor.codeActionsOnSave": [
|
||||
"source.fixAll.eslint"
|
||||
],
|
||||
"eslint.validate": [
|
||||
"javascript",
|
||||
"javascriptreact",
|
||||
"typescript",
|
||||
"vue"
|
||||
],
|
||||
"jest.jestCommandLine": "jest",
|
||||
"json.schemas": [
|
||||
{
|
||||
"fileMatch": [
|
||||
"cypress.json"
|
||||
],
|
||||
"url": "https://on.cypress.io/cypress.schema.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
"editor.bracketPairColorization.enabled": true,
|
||||
"editor.guides.bracketPairs": true,
|
||||
"editor.formatOnSave": true,
|
||||
"editor.defaultFormatter": "johnsoncodehk.volar",
|
||||
"editor.codeActionsOnSave": ["source.fixAll.eslint"],
|
||||
"eslint.validate": ["javascript", "javascriptreact", "typescript", "vue"],
|
||||
"jest.jestCommandLine": "jest",
|
||||
"json.schemas": [
|
||||
{
|
||||
"fileMatch": ["cypress.json"],
|
||||
"url": "https://on.cypress.io/cypress.schema.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
10
README.md
10
README.md
|
|
@ -3,6 +3,7 @@
|
|||
Salix front-end
|
||||
|
||||
## Install the dependencies
|
||||
|
||||
```bash
|
||||
yarn
|
||||
# or
|
||||
|
|
@ -10,32 +11,33 @@ npm install
|
|||
```
|
||||
|
||||
### Start the app in development mode (hot-code reloading, error reporting, etc.)
|
||||
|
||||
```bash
|
||||
quasar dev
|
||||
```
|
||||
|
||||
|
||||
### Lint the files
|
||||
|
||||
```bash
|
||||
yarn lint
|
||||
# or
|
||||
npm run lint
|
||||
```
|
||||
|
||||
|
||||
### Format the files
|
||||
|
||||
```bash
|
||||
yarn format
|
||||
# or
|
||||
npm run format
|
||||
```
|
||||
|
||||
|
||||
|
||||
### Build the app for production
|
||||
|
||||
```bash
|
||||
quasar build
|
||||
```
|
||||
|
||||
### Customize the configuration
|
||||
|
||||
See [Configuring quasar.config.js](https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js).
|
||||
|
|
|
|||
|
|
@ -9,10 +9,10 @@ let extend = undefined;
|
|||
*/
|
||||
|
||||
if (fs.existsSync('./.babelrc')) {
|
||||
extend = './.babelrc';
|
||||
extend = './.babelrc';
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
presets: ['@quasar/babel-preset-app'],
|
||||
extends: extend,
|
||||
presets: ['@quasar/babel-preset-app'],
|
||||
extends: extend,
|
||||
};
|
||||
|
|
|
|||
26
cypress.json
26
cypress.json
|
|
@ -1,15 +1,15 @@
|
|||
{
|
||||
"baseUrl": "http://localhost:8080/",
|
||||
"fixturesFolder": "test/cypress/fixtures",
|
||||
"integrationFolder": "test/cypress/integration",
|
||||
"pluginsFile": "test/cypress/plugins/index.js",
|
||||
"screenshotsFolder": "test/cypress/screenshots",
|
||||
"supportFile": "test/cypress/support/index.js",
|
||||
"videosFolder": "test/cypress/videos",
|
||||
"video": true,
|
||||
"component": {
|
||||
"componentFolder": "src",
|
||||
"testFiles": "**/*.spec.js",
|
||||
"supportFile": "test/cypress/support/unit.js"
|
||||
}
|
||||
"baseUrl": "http://localhost:8080/",
|
||||
"fixturesFolder": "test/cypress/fixtures",
|
||||
"integrationFolder": "test/cypress/integration",
|
||||
"pluginsFile": "test/cypress/plugins/index.js",
|
||||
"screenshotsFolder": "test/cypress/screenshots",
|
||||
"supportFile": "test/cypress/support/index.js",
|
||||
"videosFolder": "test/cypress/videos",
|
||||
"video": true,
|
||||
"component": {
|
||||
"componentFolder": "src",
|
||||
"testFiles": "**/*.spec.js",
|
||||
"supportFile": "test/cypress/support/unit.js"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
108
jest.config.js
108
jest.config.js
|
|
@ -1,64 +1,56 @@
|
|||
const esModules = ['quasar', 'quasar/lang', 'lodash-es'].join('|');
|
||||
|
||||
module.exports = {
|
||||
globals: {
|
||||
__DEV__: true,
|
||||
// TODO: Remove if resolved natively
|
||||
// See https://github.com/vuejs/vue-jest/issues/175
|
||||
'vue-jest': {
|
||||
pug: { doctype: 'html' },
|
||||
globals: {
|
||||
__DEV__: true,
|
||||
// TODO: Remove if resolved natively
|
||||
// See https://github.com/vuejs/vue-jest/issues/175
|
||||
'vue-jest': {
|
||||
pug: { doctype: 'html' },
|
||||
},
|
||||
},
|
||||
},
|
||||
// Jest assumes we are testing in node environment, specify jsdom environment instead
|
||||
testEnvironment: 'jsdom',
|
||||
// noStackTrace: true,
|
||||
// bail: true,
|
||||
// cache: false,
|
||||
// verbose: true,
|
||||
// watch: true,
|
||||
collectCoverage: false,
|
||||
coverageDirectory: '<rootDir>/test/jest/coverage',
|
||||
collectCoverageFrom: [
|
||||
'<rootDir>/src/**/*.vue',
|
||||
'<rootDir>/src/**/*.js',
|
||||
'<rootDir>/src/**/*.jsx',
|
||||
],
|
||||
// Needed in JS codebases too because of feature flags
|
||||
coveragePathIgnorePatterns: ['/node_modules/', '.d.ts$'],
|
||||
coverageThreshold: {
|
||||
global: {
|
||||
// branches: 50,
|
||||
// functions: 50,
|
||||
// lines: 50,
|
||||
// statements: 50
|
||||
// Jest assumes we are testing in node environment, specify jsdom environment instead
|
||||
testEnvironment: 'jsdom',
|
||||
// noStackTrace: true,
|
||||
// bail: true,
|
||||
// cache: false,
|
||||
// verbose: true,
|
||||
// watch: true,
|
||||
collectCoverage: false,
|
||||
coverageDirectory: '<rootDir>/test/jest/coverage',
|
||||
collectCoverageFrom: ['<rootDir>/src/**/*.vue', '<rootDir>/src/**/*.js', '<rootDir>/src/**/*.jsx'],
|
||||
// Needed in JS codebases too because of feature flags
|
||||
coveragePathIgnorePatterns: ['/node_modules/', '.d.ts$'],
|
||||
coverageThreshold: {
|
||||
global: {
|
||||
// branches: 50,
|
||||
// functions: 50,
|
||||
// lines: 50,
|
||||
// statements: 50
|
||||
},
|
||||
},
|
||||
},
|
||||
testMatch: [
|
||||
'<rootDir>/test/jest/__tests__/**/*.(spec|test).js',
|
||||
'<rootDir>/src/**/*.jest.(spec|test).js',
|
||||
],
|
||||
moduleFileExtensions: ['vue', 'js', 'jsx', 'json'],
|
||||
moduleNameMapper: {
|
||||
'^quasar$': 'quasar/dist/quasar.esm.prod.js',
|
||||
'^~/(.*)$': '<rootDir>/$1',
|
||||
'^src/(.*)$': '<rootDir>/src/$1',
|
||||
'^app/(.*)$': '<rootDir>/$1',
|
||||
'^components/(.*)$': '<rootDir>/src/components/$1',
|
||||
'^layouts/(.*)$': '<rootDir>/src/layouts/$1',
|
||||
'^pages/(.*)$': '<rootDir>/src/pages/$1',
|
||||
'^assets/(.*)$': '<rootDir>/src/assets/$1',
|
||||
'^boot/(.*)$': '<rootDir>/src/boot/$1',
|
||||
'.*css$': '@quasar/quasar-app-extension-testing-unit-jest/stub.css',
|
||||
},
|
||||
transform: {
|
||||
'.*\\.vue$': 'vue-jest',
|
||||
'.*\\.js$': 'babel-jest',
|
||||
'.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$':
|
||||
'jest-transform-stub',
|
||||
// use these if NPM is being flaky, care as hosting could interfere with these
|
||||
// '.*\\.vue$': '@quasar/quasar-app-extension-testing-unit-jest/node_modules/vue-jest',
|
||||
// '.*\\.js$': '@quasar/quasar-app-extension-testing-unit-jest/node_modules/babel-jest'
|
||||
},
|
||||
transformIgnorePatterns: [`node_modules/(?!(${esModules}))`],
|
||||
snapshotSerializers: ['jest-serializer-vue'],
|
||||
testMatch: ['<rootDir>/test/jest/__tests__/**/*.(spec|test).js', '<rootDir>/src/**/*.jest.(spec|test).js'],
|
||||
moduleFileExtensions: ['vue', 'js', 'jsx', 'json'],
|
||||
moduleNameMapper: {
|
||||
'^quasar$': 'quasar/dist/quasar.esm.prod.js',
|
||||
'^~/(.*)$': '<rootDir>/$1',
|
||||
'^src/(.*)$': '<rootDir>/src/$1',
|
||||
'^app/(.*)$': '<rootDir>/$1',
|
||||
'^components/(.*)$': '<rootDir>/src/components/$1',
|
||||
'^layouts/(.*)$': '<rootDir>/src/layouts/$1',
|
||||
'^pages/(.*)$': '<rootDir>/src/pages/$1',
|
||||
'^assets/(.*)$': '<rootDir>/src/assets/$1',
|
||||
'^boot/(.*)$': '<rootDir>/src/boot/$1',
|
||||
'.*css$': '@quasar/quasar-app-extension-testing-unit-jest/stub.css',
|
||||
},
|
||||
transform: {
|
||||
'.*\\.vue$': 'vue-jest',
|
||||
'.*\\.js$': 'babel-jest',
|
||||
'.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub',
|
||||
// use these if NPM is being flaky, care as hosting could interfere with these
|
||||
// '.*\\.vue$': '@quasar/quasar-app-extension-testing-unit-jest/node_modules/vue-jest',
|
||||
// '.*\\.js$': '@quasar/quasar-app-extension-testing-unit-jest/node_modules/babel-jest'
|
||||
},
|
||||
transformIgnorePatterns: [`node_modules/(?!(${esModules}))`],
|
||||
snapshotSerializers: ['jest-serializer-vue'],
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,39 +1,17 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"src/*": [
|
||||
"src/*"
|
||||
],
|
||||
"app/*": [
|
||||
"*"
|
||||
],
|
||||
"components/*": [
|
||||
"src/components/*"
|
||||
],
|
||||
"layouts/*": [
|
||||
"src/layouts/*"
|
||||
],
|
||||
"pages/*": [
|
||||
"src/pages/*"
|
||||
],
|
||||
"assets/*": [
|
||||
"src/assets/*"
|
||||
],
|
||||
"boot/*": [
|
||||
"src/boot/*"
|
||||
],
|
||||
"stores/*": [
|
||||
"src/stores/*"
|
||||
],
|
||||
"vue$": [
|
||||
"node_modules/vue/dist/vue.runtime.esm-bundler.js"
|
||||
]
|
||||
}
|
||||
},
|
||||
"exclude": [
|
||||
"dist",
|
||||
".quasar",
|
||||
"node_modules"
|
||||
]
|
||||
}
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"src/*": ["src/*"],
|
||||
"app/*": ["*"],
|
||||
"components/*": ["src/components/*"],
|
||||
"layouts/*": ["src/layouts/*"],
|
||||
"pages/*": ["src/pages/*"],
|
||||
"assets/*": ["src/assets/*"],
|
||||
"boot/*": ["src/boot/*"],
|
||||
"stores/*": ["src/stores/*"],
|
||||
"vue$": ["node_modules/vue/dist/vue.runtime.esm-bundler.js"]
|
||||
}
|
||||
},
|
||||
"exclude": ["dist", ".quasar", "node_modules"]
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
114
package.json
114
package.json
|
|
@ -1,58 +1,58 @@
|
|||
{
|
||||
"name": "salix-front",
|
||||
"version": "0.0.1",
|
||||
"description": "Salix front-end",
|
||||
"productName": "Salix",
|
||||
"author": "Verdnatura",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"lint": "eslint --ext .js,.vue ./",
|
||||
"format": "prettier --write \"**/*.{js,vue,scss,html,md,json}\" --ignore-path .gitignore",
|
||||
"test": "echo \"See package.json => scripts for available tests.\" && exit 0",
|
||||
"test:unit": "jest --watchAll",
|
||||
"test:unit:ci": "jest --ci",
|
||||
"test:unit:coverage": "jest --coverage",
|
||||
"serve:test:coverage": "quasar serve test/jest/coverage/lcov-report/ --port 8788",
|
||||
"concurrently:dev:jest": "concurrently \"quasar dev\" \"jest --watch\"",
|
||||
"test:e2e": "cross-env E2E_TEST=true start-test \"quasar dev\" http-get://localhost:8080 \"cypress open\"",
|
||||
"test:e2e:ci": "cross-env E2E_TEST=true start-test \"quasar dev\" http-get://localhost:8080 \"cypress run\""
|
||||
},
|
||||
"dependencies": {
|
||||
"@quasar/extras": "^1.0.0",
|
||||
"axios": "^0.21.1",
|
||||
"core-js": "^3.6.5",
|
||||
"quasar": "^2.6.0",
|
||||
"vue": "^3.0.0",
|
||||
"vue-i18n": "^9.0.0",
|
||||
"vue-router": "^4.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/eslint-parser": "^7.13.14",
|
||||
"@quasar/app-webpack": "^3.0.0",
|
||||
"@quasar/quasar-app-extension-testing-e2e-cypress": "^4.0.1",
|
||||
"@quasar/quasar-app-extension-testing-unit-jest": "^3.0.0-alpha.9",
|
||||
"eslint": "^8.10.0",
|
||||
"eslint-config-prettier": "^8.1.0",
|
||||
"eslint-plugin-jest": "^25.2.2",
|
||||
"eslint-plugin-vue": "^8.5.0",
|
||||
"eslint-webpack-plugin": "^3.1.1",
|
||||
"prettier": "^2.5.1",
|
||||
"eslint-plugin-cypress": "^2.11.3"
|
||||
},
|
||||
"browserslist": [
|
||||
"last 10 Chrome versions",
|
||||
"last 10 Firefox versions",
|
||||
"last 4 Edge versions",
|
||||
"last 7 Safari versions",
|
||||
"last 8 Android versions",
|
||||
"last 8 ChromeAndroid versions",
|
||||
"last 8 FirefoxAndroid versions",
|
||||
"last 10 iOS versions",
|
||||
"last 5 Opera versions"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 12.22.1",
|
||||
"npm": ">= 6.13.4",
|
||||
"yarn": ">= 1.21.1"
|
||||
}
|
||||
}
|
||||
"name": "salix-front",
|
||||
"version": "0.0.1",
|
||||
"description": "Salix front-end",
|
||||
"productName": "Salix",
|
||||
"author": "Verdnatura",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"lint": "eslint --ext .js,.vue ./",
|
||||
"format": "prettier --write \"**/*.{js,vue,scss,html,md,json}\" --ignore-path .gitignore",
|
||||
"test": "echo \"See package.json => scripts for available tests.\" && exit 0",
|
||||
"test:unit": "jest --watchAll",
|
||||
"test:unit:ci": "jest --ci",
|
||||
"test:unit:coverage": "jest --coverage",
|
||||
"serve:test:coverage": "quasar serve test/jest/coverage/lcov-report/ --port 8788",
|
||||
"concurrently:dev:jest": "concurrently \"quasar dev\" \"jest --watch\"",
|
||||
"test:e2e": "cross-env E2E_TEST=true start-test \"quasar dev\" http-get://localhost:8080 \"cypress open\"",
|
||||
"test:e2e:ci": "cross-env E2E_TEST=true start-test \"quasar dev\" http-get://localhost:8080 \"cypress run\""
|
||||
},
|
||||
"dependencies": {
|
||||
"@quasar/extras": "^1.0.0",
|
||||
"axios": "^0.21.1",
|
||||
"core-js": "^3.6.5",
|
||||
"quasar": "^2.6.0",
|
||||
"vue": "^3.0.0",
|
||||
"vue-i18n": "^9.0.0",
|
||||
"vue-router": "^4.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/eslint-parser": "^7.13.14",
|
||||
"@quasar/app-webpack": "^3.0.0",
|
||||
"@quasar/quasar-app-extension-testing-e2e-cypress": "^4.0.1",
|
||||
"@quasar/quasar-app-extension-testing-unit-jest": "^3.0.0-alpha.9",
|
||||
"eslint": "^8.10.0",
|
||||
"eslint-config-prettier": "^8.1.0",
|
||||
"eslint-plugin-jest": "^25.2.2",
|
||||
"eslint-plugin-vue": "^8.5.0",
|
||||
"eslint-webpack-plugin": "^3.1.1",
|
||||
"prettier": "^2.5.1",
|
||||
"eslint-plugin-cypress": "^2.11.3"
|
||||
},
|
||||
"browserslist": [
|
||||
"last 10 Chrome versions",
|
||||
"last 10 Firefox versions",
|
||||
"last 4 Edge versions",
|
||||
"last 7 Safari versions",
|
||||
"last 8 Android versions",
|
||||
"last 8 ChromeAndroid versions",
|
||||
"last 8 FirefoxAndroid versions",
|
||||
"last 10 iOS versions",
|
||||
"last 5 Opera versions"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">= 12.22.1",
|
||||
"npm": ">= 6.13.4",
|
||||
"yarn": ">= 1.21.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
359
quasar.config.js
359
quasar.config.js
|
|
@ -8,234 +8,213 @@
|
|||
// Configuration for your app
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js
|
||||
|
||||
|
||||
const ESLintPlugin = require('eslint-webpack-plugin')
|
||||
|
||||
const ESLintPlugin = require('eslint-webpack-plugin');
|
||||
|
||||
const { configure } = require('quasar/wrappers');
|
||||
|
||||
module.exports = configure(function (ctx) {
|
||||
return {
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/supporting-ts
|
||||
supportTS: false,
|
||||
return {
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/supporting-ts
|
||||
supportTS: false,
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/prefetch-feature
|
||||
// preFetch: true,
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/prefetch-feature
|
||||
// preFetch: true,
|
||||
|
||||
// app boot file (/src/boot)
|
||||
// --> boot files are part of "main.js"
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/boot-files
|
||||
boot: [
|
||||
'i18n',
|
||||
'axios',
|
||||
],
|
||||
// app boot file (/src/boot)
|
||||
// --> boot files are part of "main.js"
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/boot-files
|
||||
boot: ['i18n', 'axios'],
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-css
|
||||
css: [
|
||||
'app.scss'
|
||||
],
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-css
|
||||
css: ['app.scss'],
|
||||
|
||||
// https://github.com/quasarframework/quasar/tree/dev/extras
|
||||
extras: [
|
||||
// 'ionicons-v4',
|
||||
// 'mdi-v5',
|
||||
// 'fontawesome-v6',
|
||||
// 'eva-icons',
|
||||
// 'themify',
|
||||
// 'line-awesome',
|
||||
// 'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both!
|
||||
// https://github.com/quasarframework/quasar/tree/dev/extras
|
||||
extras: [
|
||||
// 'ionicons-v4',
|
||||
// 'mdi-v5',
|
||||
// 'fontawesome-v6',
|
||||
// 'eva-icons',
|
||||
// 'themify',
|
||||
// 'line-awesome',
|
||||
// 'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both!
|
||||
|
||||
'roboto-font', // optional, you are not bound to it
|
||||
'material-icons', // optional, you are not bound to it
|
||||
],
|
||||
'roboto-font', // optional, you are not bound to it
|
||||
'material-icons', // optional, you are not bound to it
|
||||
],
|
||||
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-build
|
||||
build: {
|
||||
vueRouterMode: 'hash', // available values: 'hash', 'history'
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-build
|
||||
build: {
|
||||
vueRouterMode: 'hash', // available values: 'hash', 'history'
|
||||
|
||||
// transpile: false,
|
||||
// publicPath: '/',
|
||||
// transpile: false,
|
||||
// publicPath: '/',
|
||||
|
||||
// Add dependencies for transpiling with Babel (Array of string/regex)
|
||||
// (from node_modules, which are by default not transpiled).
|
||||
// Applies only if "transpile" is set to true.
|
||||
// transpileDependencies: [],
|
||||
// Add dependencies for transpiling with Babel (Array of string/regex)
|
||||
// (from node_modules, which are by default not transpiled).
|
||||
// Applies only if "transpile" is set to true.
|
||||
// transpileDependencies: [],
|
||||
|
||||
// rtl: true, // https://quasar.dev/options/rtl-support
|
||||
// preloadChunks: true,
|
||||
// showProgress: false,
|
||||
// gzip: true,
|
||||
// analyze: true,
|
||||
// rtl: true, // https://quasar.dev/options/rtl-support
|
||||
// preloadChunks: true,
|
||||
// showProgress: false,
|
||||
// gzip: true,
|
||||
// analyze: true,
|
||||
|
||||
// Options below are automatically set depending on the env, set them if you want to override
|
||||
// extractCSS: false,
|
||||
// Options below are automatically set depending on the env, set them if you want to override
|
||||
// extractCSS: false,
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/handling-webpack
|
||||
// "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain
|
||||
|
||||
chainWebpack (chain) {
|
||||
chain.plugin('eslint-webpack-plugin')
|
||||
.use(ESLintPlugin, [{ extensions: [ 'js', 'vue' ] }])
|
||||
}
|
||||
|
||||
},
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/handling-webpack
|
||||
// "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain
|
||||
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-devServer
|
||||
devServer: {
|
||||
server: {
|
||||
type: 'http'
|
||||
},
|
||||
port: 8080,
|
||||
open: true // opens browser window automatically
|
||||
},
|
||||
chainWebpack(chain) {
|
||||
chain.plugin('eslint-webpack-plugin').use(ESLintPlugin, [{ extensions: ['js', 'vue'] }]);
|
||||
},
|
||||
},
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-framework
|
||||
framework: {
|
||||
config: {},
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-devServer
|
||||
devServer: {
|
||||
server: {
|
||||
type: 'http',
|
||||
},
|
||||
port: 8080,
|
||||
open: true, // opens browser window automatically
|
||||
},
|
||||
|
||||
// iconSet: 'material-icons', // Quasar icon set
|
||||
// lang: 'en-US', // Quasar language pack
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-framework
|
||||
framework: {
|
||||
config: {},
|
||||
|
||||
// For special cases outside of where the auto-import strategy can have an impact
|
||||
// (like functional components as one of the examples),
|
||||
// you can manually specify Quasar components/directives to be available everywhere:
|
||||
//
|
||||
// components: [],
|
||||
// directives: [],
|
||||
// iconSet: 'material-icons', // Quasar icon set
|
||||
// lang: 'en-US', // Quasar language pack
|
||||
|
||||
// Quasar plugins
|
||||
plugins: []
|
||||
},
|
||||
// For special cases outside of where the auto-import strategy can have an impact
|
||||
// (like functional components as one of the examples),
|
||||
// you can manually specify Quasar components/directives to be available everywhere:
|
||||
//
|
||||
// components: [],
|
||||
// directives: [],
|
||||
|
||||
// animations: 'all', // --- includes all animations
|
||||
// https://quasar.dev/options/animations
|
||||
animations: [],
|
||||
// Quasar plugins
|
||||
plugins: [],
|
||||
},
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/developing-ssr/configuring-ssr
|
||||
ssr: {
|
||||
pwa: false,
|
||||
// animations: 'all', // --- includes all animations
|
||||
// https://quasar.dev/options/animations
|
||||
animations: [],
|
||||
|
||||
// manualStoreHydration: true,
|
||||
// manualPostHydrationTrigger: true,
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/developing-ssr/configuring-ssr
|
||||
ssr: {
|
||||
pwa: false,
|
||||
|
||||
prodPort: 3000, // The default port that the production server should use
|
||||
// (gets superseded if process.env.PORT is specified at runtime)
|
||||
// manualStoreHydration: true,
|
||||
// manualPostHydrationTrigger: true,
|
||||
|
||||
maxAge: 1000 * 60 * 60 * 24 * 30,
|
||||
// Tell browser when a file from the server should expire from cache (in ms)
|
||||
prodPort: 3000, // The default port that the production server should use
|
||||
// (gets superseded if process.env.PORT is specified at runtime)
|
||||
|
||||
|
||||
chainWebpackWebserver (chain) {
|
||||
chain.plugin('eslint-webpack-plugin')
|
||||
.use(ESLintPlugin, [{ extensions: [ 'js' ] }])
|
||||
},
|
||||
|
||||
maxAge: 1000 * 60 * 60 * 24 * 30,
|
||||
// Tell browser when a file from the server should expire from cache (in ms)
|
||||
|
||||
middlewares: [
|
||||
ctx.prod ? 'compression' : '',
|
||||
'render' // keep this as last one
|
||||
]
|
||||
},
|
||||
chainWebpackWebserver(chain) {
|
||||
chain.plugin('eslint-webpack-plugin').use(ESLintPlugin, [{ extensions: ['js'] }]);
|
||||
},
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/developing-pwa/configuring-pwa
|
||||
pwa: {
|
||||
workboxPluginMode: 'GenerateSW', // 'GenerateSW' or 'InjectManifest'
|
||||
workboxOptions: {}, // only for GenerateSW
|
||||
middlewares: [
|
||||
ctx.prod ? 'compression' : '',
|
||||
'render', // keep this as last one
|
||||
],
|
||||
},
|
||||
|
||||
// for the custom service worker ONLY (/src-pwa/custom-service-worker.[js|ts])
|
||||
// if using workbox in InjectManifest mode
|
||||
|
||||
chainWebpackCustomSW (chain) {
|
||||
chain.plugin('eslint-webpack-plugin')
|
||||
.use(ESLintPlugin, [{ extensions: [ 'js' ] }])
|
||||
},
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/developing-pwa/configuring-pwa
|
||||
pwa: {
|
||||
workboxPluginMode: 'GenerateSW', // 'GenerateSW' or 'InjectManifest'
|
||||
workboxOptions: {}, // only for GenerateSW
|
||||
|
||||
manifest: {
|
||||
name: `Salix`,
|
||||
short_name: `Salix`,
|
||||
description: `Salix front-end`,
|
||||
display: 'standalone',
|
||||
orientation: 'portrait',
|
||||
background_color: '#ffffff',
|
||||
theme_color: '#027be3',
|
||||
icons: [
|
||||
{
|
||||
src: 'icons/icon-128x128.png',
|
||||
sizes: '128x128',
|
||||
type: 'image/png'
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-192x192.png',
|
||||
sizes: '192x192',
|
||||
type: 'image/png'
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-256x256.png',
|
||||
sizes: '256x256',
|
||||
type: 'image/png'
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-384x384.png',
|
||||
sizes: '384x384',
|
||||
type: 'image/png'
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-512x512.png',
|
||||
sizes: '512x512',
|
||||
type: 'image/png'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
// for the custom service worker ONLY (/src-pwa/custom-service-worker.[js|ts])
|
||||
// if using workbox in InjectManifest mode
|
||||
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-cordova-apps/configuring-cordova
|
||||
cordova: {
|
||||
// noIosLegacyBuildFlag: true, // uncomment only if you know what you are doing
|
||||
},
|
||||
chainWebpackCustomSW(chain) {
|
||||
chain.plugin('eslint-webpack-plugin').use(ESLintPlugin, [{ extensions: ['js'] }]);
|
||||
},
|
||||
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-capacitor-apps/configuring-capacitor
|
||||
capacitor: {
|
||||
hideSplashscreen: true
|
||||
},
|
||||
manifest: {
|
||||
name: `Salix`,
|
||||
short_name: `Salix`,
|
||||
description: `Salix front-end`,
|
||||
display: 'standalone',
|
||||
orientation: 'portrait',
|
||||
background_color: '#ffffff',
|
||||
theme_color: '#027be3',
|
||||
icons: [
|
||||
{
|
||||
src: 'icons/icon-128x128.png',
|
||||
sizes: '128x128',
|
||||
type: 'image/png',
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-192x192.png',
|
||||
sizes: '192x192',
|
||||
type: 'image/png',
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-256x256.png',
|
||||
sizes: '256x256',
|
||||
type: 'image/png',
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-384x384.png',
|
||||
sizes: '384x384',
|
||||
type: 'image/png',
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-512x512.png',
|
||||
sizes: '512x512',
|
||||
type: 'image/png',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-electron-apps/configuring-electron
|
||||
electron: {
|
||||
bundler: 'packager', // 'packager' or 'builder'
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-cordova-apps/configuring-cordova
|
||||
cordova: {
|
||||
// noIosLegacyBuildFlag: true, // uncomment only if you know what you are doing
|
||||
},
|
||||
|
||||
packager: {
|
||||
// https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-capacitor-apps/configuring-capacitor
|
||||
capacitor: {
|
||||
hideSplashscreen: true,
|
||||
},
|
||||
|
||||
// OS X / Mac App Store
|
||||
// appBundleId: '',
|
||||
// appCategoryType: '',
|
||||
// osxSign: '',
|
||||
// protocol: 'myapp://path',
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-electron-apps/configuring-electron
|
||||
electron: {
|
||||
bundler: 'packager', // 'packager' or 'builder'
|
||||
|
||||
// Windows only
|
||||
// win32metadata: { ... }
|
||||
},
|
||||
packager: {
|
||||
// https://github.com/electron-userland/electron-packager/blob/master/docs/api.md#options
|
||||
// OS X / Mac App Store
|
||||
// appBundleId: '',
|
||||
// appCategoryType: '',
|
||||
// osxSign: '',
|
||||
// protocol: 'myapp://path',
|
||||
// Windows only
|
||||
// win32metadata: { ... }
|
||||
},
|
||||
|
||||
builder: {
|
||||
// https://www.electron.build/configuration/configuration
|
||||
builder: {
|
||||
// https://www.electron.build/configuration/configuration
|
||||
|
||||
appId: 'salix-front'
|
||||
},
|
||||
appId: 'salix-front',
|
||||
},
|
||||
|
||||
// "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain
|
||||
|
||||
chainWebpackMain (chain) {
|
||||
chain.plugin('eslint-webpack-plugin')
|
||||
.use(ESLintPlugin, [{ extensions: [ 'js' ] }])
|
||||
},
|
||||
|
||||
// "chain" is a webpack-chain object https://github.com/neutrinojs/webpack-chain
|
||||
|
||||
|
||||
chainWebpackPreload (chain) {
|
||||
chain.plugin('eslint-webpack-plugin')
|
||||
.use(ESLintPlugin, [{ extensions: [ 'js' ] }])
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
chainWebpackMain(chain) {
|
||||
chain.plugin('eslint-webpack-plugin').use(ESLintPlugin, [{ extensions: ['js'] }]);
|
||||
},
|
||||
|
||||
chainWebpackPreload(chain) {
|
||||
chain.plugin('eslint-webpack-plugin').use(ESLintPlugin, [{ extensions: ['js'] }]);
|
||||
},
|
||||
},
|
||||
};
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,13 +1,9 @@
|
|||
{
|
||||
"@quasar/testing-unit-jest": {
|
||||
"babel": "babelrc",
|
||||
"options": [
|
||||
"scripts"
|
||||
]
|
||||
},
|
||||
"@quasar/testing-e2e-cypress": {
|
||||
"options": [
|
||||
"scripts"
|
||||
]
|
||||
}
|
||||
}
|
||||
"@quasar/testing-unit-jest": {
|
||||
"babel": "babelrc",
|
||||
"options": ["scripts"]
|
||||
},
|
||||
"@quasar/testing-e2e-cypress": {
|
||||
"options": ["scripts"]
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
{
|
||||
"unit-jest": {
|
||||
"runnerCommand": "jest --ci"
|
||||
},
|
||||
"e2e-cypress": {
|
||||
"runnerCommand": "cross-env E2E_TEST=true start-test \"quasar dev\" http-get://localhost:8080 \"cypress run\""
|
||||
},
|
||||
"unit-cypress": {
|
||||
"runnerCommand": "cypress run-ct"
|
||||
}
|
||||
}
|
||||
"unit-jest": {
|
||||
"runnerCommand": "jest --ci"
|
||||
},
|
||||
"e2e-cypress": {
|
||||
"runnerCommand": "cross-env E2E_TEST=true start-test \"quasar dev\" http-get://localhost:8080 \"cypress run\""
|
||||
},
|
||||
"unit-cypress": {
|
||||
"runnerCommand": "cypress run-ct"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
11
src/App.vue
11
src/App.vue
|
|
@ -1,11 +1,8 @@
|
|||
<template>
|
||||
<router-view />
|
||||
<router-view />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent } from 'vue'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'App'
|
||||
})
|
||||
<script setup>
|
||||
const derp = ['asd'];
|
||||
console.log(derp);
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { boot } from 'quasar/wrappers'
|
||||
import axios from 'axios'
|
||||
import { boot } from 'quasar/wrappers';
|
||||
import axios from 'axios';
|
||||
|
||||
// Be careful when using SSR for cross-request state pollution
|
||||
// due to creating a Singleton instance here;
|
||||
|
|
@ -7,18 +7,18 @@ import axios from 'axios'
|
|||
// good idea to move this instance creation inside of the
|
||||
// "export default () => {}" function below (which runs individually
|
||||
// for each client)
|
||||
const api = axios.create({ baseURL: 'https://api.example.com' })
|
||||
const api = axios.create({ baseURL: 'https://api.example.com' });
|
||||
|
||||
export default boot(({ app }) => {
|
||||
// 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
|
||||
|
||||
app.config.globalProperties.$axios = axios
|
||||
// ^ ^ ^ 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
|
||||
app.config.globalProperties.$axios = axios;
|
||||
// ^ ^ ^ 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
|
||||
|
||||
app.config.globalProperties.$api = api
|
||||
// ^ ^ ^ this will allow you to use this.$api (for Vue Options API form)
|
||||
// so you can easily perform requests against your app's API
|
||||
})
|
||||
app.config.globalProperties.$api = api;
|
||||
// ^ ^ ^ this will allow you to use this.$api (for Vue Options API form)
|
||||
// so you can easily perform requests against your app's API
|
||||
});
|
||||
|
||||
export { api }
|
||||
export { api };
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
import { boot } from 'quasar/wrappers'
|
||||
import { createI18n } from 'vue-i18n'
|
||||
import messages from 'src/i18n'
|
||||
import { boot } from 'quasar/wrappers';
|
||||
import { createI18n } from 'vue-i18n';
|
||||
import messages from 'src/i18n';
|
||||
|
||||
export default boot(({ app }) => {
|
||||
const i18n = createI18n({
|
||||
locale: 'en-US',
|
||||
messages
|
||||
})
|
||||
const i18n = createI18n({
|
||||
locale: 'en-US',
|
||||
messages,
|
||||
});
|
||||
|
||||
// Set i18n instance on app
|
||||
app.use(i18n)
|
||||
})
|
||||
// Set i18n instance on app
|
||||
app.use(i18n);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,49 +1,41 @@
|
|||
<template>
|
||||
<q-item
|
||||
clickable
|
||||
tag="a"
|
||||
target="_blank"
|
||||
:href="link"
|
||||
>
|
||||
<q-item-section
|
||||
v-if="icon"
|
||||
avatar
|
||||
>
|
||||
<q-icon :name="icon" />
|
||||
</q-item-section>
|
||||
<q-item clickable tag="a" target="_blank" :href="link">
|
||||
<q-item-section v-if="icon" avatar>
|
||||
<q-icon :name="icon" />
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
<q-item-label>{{ title }}</q-item-label>
|
||||
<q-item-label caption>{{ caption }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item-section>
|
||||
<q-item-label>{{ title }}</q-item-label>
|
||||
<q-item-label caption>{{ caption }}</q-item-label>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent } from 'vue'
|
||||
import { defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'EssentialLink',
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
name: 'EssentialLink',
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
|
||||
caption: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
caption: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
|
||||
link: {
|
||||
type: String,
|
||||
default: '#'
|
||||
},
|
||||
link: {
|
||||
type: String,
|
||||
default: '#',
|
||||
},
|
||||
|
||||
icon: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
}
|
||||
})
|
||||
icon: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,19 +1,12 @@
|
|||
<template>
|
||||
<q-btn
|
||||
data-cy="button"
|
||||
label="test emit"
|
||||
color="positive"
|
||||
rounded
|
||||
icon="edit"
|
||||
@click="$emit('test')"
|
||||
/>
|
||||
<q-btn data-cy="button" label="test emit" color="positive" rounded icon="edit" @click="$emit('test')" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'QuasarButton',
|
||||
emits: ['test'],
|
||||
name: 'QuasarButton',
|
||||
emits: ['test'],
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,21 +1,16 @@
|
|||
<template>
|
||||
<!-- notice dialogRef here -->
|
||||
<q-dialog ref="dialogRef" @hide="onDialogHide" data-cy="dialog">
|
||||
<q-card class="q-dialog-plugin">
|
||||
<q-card-section>{{ message }}</q-card-section>
|
||||
<!-- notice dialogRef here -->
|
||||
<q-dialog ref="dialogRef" @hide="onDialogHide" data-cy="dialog">
|
||||
<q-card class="q-dialog-plugin">
|
||||
<q-card-section>{{ message }}</q-card-section>
|
||||
|
||||
<!-- buttons example -->
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
data-cy="ok-button"
|
||||
color="primary"
|
||||
label="OK"
|
||||
@click="onOKClick"
|
||||
/>
|
||||
<q-btn color="primary" label="Cancel" @click="onCancelClick" />
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
<!-- buttons example -->
|
||||
<q-card-actions align="right">
|
||||
<q-btn data-cy="ok-button" color="primary" label="OK" @click="onOKClick" />
|
||||
<q-btn color="primary" label="Cancel" @click="onCancelClick" />
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -23,49 +18,48 @@ import { useDialogPluginComponent } from 'quasar';
|
|||
import { defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'QuasarDialog',
|
||||
props: {
|
||||
message: {
|
||||
type: String,
|
||||
required: true,
|
||||
name: 'QuasarDialog',
|
||||
props: {
|
||||
message: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
// REQUIRED; need to specify some events that your
|
||||
// component will emit through useDialogPluginComponent()
|
||||
emits: useDialogPluginComponent.emits,
|
||||
// REQUIRED; need to specify some events that your
|
||||
// component will emit through useDialogPluginComponent()
|
||||
emits: useDialogPluginComponent.emits,
|
||||
|
||||
setup() {
|
||||
// REQUIRED; must be called inside of setup()
|
||||
const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } =
|
||||
useDialogPluginComponent();
|
||||
// dialogRef - Vue ref to be applied to QDialog
|
||||
// onDialogHide - Function to be used as handler for @hide on QDialog
|
||||
// onDialogOK - Function to call to settle dialog with "ok" outcome
|
||||
// example: onDialogOK() - no payload
|
||||
// example: onDialogOK({ /*.../* }) - with payload
|
||||
// onDialogCancel - Function to call to settle dialog with "cancel" outcome
|
||||
setup() {
|
||||
// REQUIRED; must be called inside of setup()
|
||||
const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } = useDialogPluginComponent();
|
||||
// dialogRef - Vue ref to be applied to QDialog
|
||||
// onDialogHide - Function to be used as handler for @hide on QDialog
|
||||
// onDialogOK - Function to call to settle dialog with "ok" outcome
|
||||
// example: onDialogOK() - no payload
|
||||
// example: onDialogOK({ /*.../* }) - with payload
|
||||
// onDialogCancel - Function to call to settle dialog with "cancel" outcome
|
||||
|
||||
return {
|
||||
// This is REQUIRED;
|
||||
// Need to inject these (from useDialogPluginComponent() call)
|
||||
// into the vue scope for the vue html template
|
||||
dialogRef,
|
||||
onDialogHide,
|
||||
return {
|
||||
// This is REQUIRED;
|
||||
// Need to inject these (from useDialogPluginComponent() call)
|
||||
// into the vue scope for the vue html template
|
||||
dialogRef,
|
||||
onDialogHide,
|
||||
|
||||
// other methods that we used in our vue html template;
|
||||
// these are part of our example (so not required)
|
||||
onOKClick() {
|
||||
// on OK, it is REQUIRED to
|
||||
// call onDialogOK (with optional payload)
|
||||
onDialogOK();
|
||||
// or with payload: onDialogOK({ ... })
|
||||
// ...and it will also hide the dialog automatically
|
||||
},
|
||||
// other methods that we used in our vue html template;
|
||||
// these are part of our example (so not required)
|
||||
onOKClick() {
|
||||
// on OK, it is REQUIRED to
|
||||
// call onDialogOK (with optional payload)
|
||||
onDialogOK();
|
||||
// or with payload: onDialogOK({ ... })
|
||||
// ...and it will also hide the dialog automatically
|
||||
},
|
||||
|
||||
// we can passthrough onDialogCancel directly
|
||||
onCancelClick: onDialogCancel,
|
||||
};
|
||||
},
|
||||
// we can passthrough onDialogCancel directly
|
||||
onCancelClick: onDialogCancel,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,33 +1,33 @@
|
|||
<template>
|
||||
<q-drawer
|
||||
v-model="showDrawer"
|
||||
show-if-above
|
||||
:width="200"
|
||||
:breakpoint="700"
|
||||
elevated
|
||||
data-cy="drawer"
|
||||
class="bg-primary text-white"
|
||||
>
|
||||
<q-scroll-area class="fit">
|
||||
<div class="q-pa-sm">
|
||||
<div v-for="n in 50" :key="n">Drawer {{ n }} / 50</div>
|
||||
</div>
|
||||
<q-btn data-cy="button">Am I on screen?</q-btn>
|
||||
</q-scroll-area>
|
||||
</q-drawer>
|
||||
<q-drawer
|
||||
v-model="showDrawer"
|
||||
show-if-above
|
||||
:width="200"
|
||||
:breakpoint="700"
|
||||
elevated
|
||||
data-cy="drawer"
|
||||
class="bg-primary text-white"
|
||||
>
|
||||
<q-scroll-area class="fit">
|
||||
<div class="q-pa-sm">
|
||||
<div v-for="n in 50" :key="n">Drawer {{ n }} / 50</div>
|
||||
</div>
|
||||
<q-btn data-cy="button">Am I on screen?</q-btn>
|
||||
</q-scroll-area>
|
||||
</q-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref, defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'QuasarDrawer',
|
||||
setup() {
|
||||
const showDrawer = ref(true);
|
||||
name: 'QuasarDrawer',
|
||||
setup() {
|
||||
const showDrawer = ref(true);
|
||||
|
||||
return {
|
||||
showDrawer,
|
||||
};
|
||||
},
|
||||
return {
|
||||
showDrawer,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,21 +1,21 @@
|
|||
<template>
|
||||
<q-page-sticky position="bottom-right" :offset="[18, 18]">
|
||||
<q-btn data-cy="button" rounded color="accent" icon="arrow_forward">
|
||||
{{ title }}
|
||||
</q-btn>
|
||||
</q-page-sticky>
|
||||
<q-page-sticky position="bottom-right" :offset="[18, 18]">
|
||||
<q-btn data-cy="button" rounded color="accent" icon="arrow_forward">
|
||||
{{ title }}
|
||||
</q-btn>
|
||||
</q-page-sticky>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'QuasarPageSticky',
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
required: true,
|
||||
name: 'QuasarPageSticky',
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,28 +1,21 @@
|
|||
<template>
|
||||
<q-btn color="primary" data-cy="button">
|
||||
Button
|
||||
<q-tooltip
|
||||
v-model="showTooltip"
|
||||
data-cy="tooltip"
|
||||
class="bg-red"
|
||||
:offset="[10, 10]"
|
||||
>
|
||||
Here I am!
|
||||
</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn color="primary" data-cy="button">
|
||||
Button
|
||||
<q-tooltip v-model="showTooltip" data-cy="tooltip" class="bg-red" :offset="[10, 10]"> Here I am! </q-tooltip>
|
||||
</q-btn>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref, defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'QuasarTooltip',
|
||||
setup() {
|
||||
const showTooltip = ref(true);
|
||||
name: 'QuasarTooltip',
|
||||
setup() {
|
||||
const showTooltip = ref(true);
|
||||
|
||||
return {
|
||||
showTooltip,
|
||||
};
|
||||
},
|
||||
return {
|
||||
showTooltip,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -2,43 +2,41 @@ import { mount } from '@cypress/vue';
|
|||
import QuasarButton from '../QuasarButton.vue';
|
||||
|
||||
describe('QuasarButton', () => {
|
||||
it('renders a message', () => {
|
||||
const label = 'Hello there';
|
||||
mount(QuasarButton, {
|
||||
props: {
|
||||
label,
|
||||
},
|
||||
it('renders a message', () => {
|
||||
const label = 'Hello there';
|
||||
mount(QuasarButton, {
|
||||
props: {
|
||||
label,
|
||||
},
|
||||
});
|
||||
|
||||
cy.dataCy('button').should('contain', label);
|
||||
});
|
||||
|
||||
cy.dataCy('button').should('contain', label);
|
||||
});
|
||||
it('renders another message', () => {
|
||||
const label = 'Will this work?';
|
||||
mount(QuasarButton, {
|
||||
props: {
|
||||
label,
|
||||
},
|
||||
});
|
||||
|
||||
it('renders another message', () => {
|
||||
const label = 'Will this work?';
|
||||
mount(QuasarButton, {
|
||||
props: {
|
||||
label,
|
||||
},
|
||||
cy.dataCy('button').should('contain', label);
|
||||
});
|
||||
|
||||
cy.dataCy('button').should('contain', label);
|
||||
});
|
||||
it('should have a `positive` color', () => {
|
||||
mount(QuasarButton);
|
||||
|
||||
it('should have a `positive` color', () => {
|
||||
mount(QuasarButton);
|
||||
cy.dataCy('button').should('have.backgroundColor', 'var(--q-positive)').should('have.color', 'white');
|
||||
});
|
||||
|
||||
cy.dataCy('button')
|
||||
.should('have.backgroundColor', 'var(--q-positive)')
|
||||
.should('have.color', 'white');
|
||||
});
|
||||
it('should emit `test` upon click', () => {
|
||||
mount(QuasarButton);
|
||||
|
||||
it('should emit `test` upon click', () => {
|
||||
mount(QuasarButton);
|
||||
|
||||
cy.dataCy('button')
|
||||
.click()
|
||||
.should(() => {
|
||||
expect(Cypress.vueWrapper.emitted('test')).to.have.length(1);
|
||||
});
|
||||
});
|
||||
cy.dataCy('button')
|
||||
.click()
|
||||
.should(() => {
|
||||
expect(Cypress.vueWrapper.emitted('test')).to.have.length(1);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -3,22 +3,22 @@ import DialogWrapper from 'app/test/cypress/wrappers/DialogWrapper.vue';
|
|||
import QuasarDialog from '../QuasarDialog.vue';
|
||||
|
||||
describe('QuasarDialog', () => {
|
||||
it('should show a dialog with a message', () => {
|
||||
const message = 'Hello, I am a dialog';
|
||||
mount(DialogWrapper, {
|
||||
props: {
|
||||
component: QuasarDialog,
|
||||
componentProps: {
|
||||
message,
|
||||
},
|
||||
},
|
||||
it('should show a dialog with a message', () => {
|
||||
const message = 'Hello, I am a dialog';
|
||||
mount(DialogWrapper, {
|
||||
props: {
|
||||
component: QuasarDialog,
|
||||
componentProps: {
|
||||
message,
|
||||
},
|
||||
},
|
||||
});
|
||||
cy.dataCy('dialog').should('exist').should('contain', message);
|
||||
});
|
||||
cy.dataCy('dialog').should('exist').should('contain', message);
|
||||
});
|
||||
|
||||
it('should close a dialog when clikcing ok', () => {
|
||||
// The dialog is still visible from the previous test
|
||||
cy.dataCy('dialog').should('exist').dataCy('ok-button').click();
|
||||
cy.dataCy('dialog').should('not.exist');
|
||||
});
|
||||
it('should close a dialog when clikcing ok', () => {
|
||||
// The dialog is still visible from the previous test
|
||||
cy.dataCy('dialog').should('exist').dataCy('ok-button').click();
|
||||
cy.dataCy('dialog').should('not.exist');
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -3,19 +3,13 @@ import LayoutContainer from 'app/test/cypress/wrappers/LayoutContainer.vue';
|
|||
import QuasarDrawer from '../QuasarDrawer.vue';
|
||||
|
||||
describe('QuasarDrawer', () => {
|
||||
it('should show a drawer', () => {
|
||||
mount(LayoutContainer, {
|
||||
props: {
|
||||
component: QuasarDrawer,
|
||||
},
|
||||
it('should show a drawer', () => {
|
||||
mount(LayoutContainer, {
|
||||
props: {
|
||||
component: QuasarDrawer,
|
||||
},
|
||||
});
|
||||
cy.dataCy('drawer').should('exist').dataCy('button').should('not.be.visible');
|
||||
cy.get('.q-scrollarea .scroll').scrollTo('bottom', { duration: 500 }).dataCy('button').should('be.visible');
|
||||
});
|
||||
cy.dataCy('drawer')
|
||||
.should('exist')
|
||||
.dataCy('button')
|
||||
.should('not.be.visible');
|
||||
cy.get('.q-scrollarea .scroll')
|
||||
.scrollTo('bottom', { duration: 500 })
|
||||
.dataCy('button')
|
||||
.should('be.visible');
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -3,20 +3,20 @@ import LayoutContainer from 'app/test/cypress/wrappers/LayoutContainer.vue';
|
|||
import QuasarPageSticky from '../QuasarPageSticky.vue';
|
||||
|
||||
describe('QuasarPageSticky', () => {
|
||||
it('should show a sticky at the bottom-right of the page', () => {
|
||||
mount(LayoutContainer, {
|
||||
props: {
|
||||
component: QuasarPageSticky,
|
||||
title: 'Test',
|
||||
},
|
||||
});
|
||||
it('should show a sticky at the bottom-right of the page', () => {
|
||||
mount(LayoutContainer, {
|
||||
props: {
|
||||
component: QuasarPageSticky,
|
||||
title: 'Test',
|
||||
},
|
||||
});
|
||||
|
||||
cy.dataCy('button')
|
||||
.should('be.visible')
|
||||
.should(($el) => {
|
||||
const rect = $el[0].getBoundingClientRect();
|
||||
expect(rect.bottom).to.equal(window.innerHeight - 18);
|
||||
expect(rect.right).to.equal(window.innerWidth - 18);
|
||||
});
|
||||
});
|
||||
cy.dataCy('button')
|
||||
.should('be.visible')
|
||||
.should(($el) => {
|
||||
const rect = $el[0].getBoundingClientRect();
|
||||
expect(rect.bottom).to.equal(window.innerHeight - 18);
|
||||
expect(rect.right).to.equal(window.innerWidth - 18);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -2,10 +2,10 @@ import { mount } from '@cypress/vue';
|
|||
import QuasarTooltip from '../QuasarTooltip.vue';
|
||||
|
||||
describe('QuasarTooltip', () => {
|
||||
it('should show a tooltip', () => {
|
||||
mount(QuasarTooltip);
|
||||
it('should show a tooltip', () => {
|
||||
mount(QuasarTooltip);
|
||||
|
||||
cy.dataCy('button').trigger('mouseover');
|
||||
cy.dataCy('tooltip').contains('Here I am!');
|
||||
});
|
||||
cy.dataCy('button').trigger('mouseover');
|
||||
cy.dataCy('tooltip').contains('Here I am!');
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -12,13 +12,13 @@
|
|||
// to match your app's branding.
|
||||
// Tip: Use the "Theme Builder" on Quasar's documentation website.
|
||||
|
||||
$primary : #1976D2;
|
||||
$secondary : #26A69A;
|
||||
$accent : #9C27B0;
|
||||
$primary: #1976d2;
|
||||
$secondary: #26a69a;
|
||||
$accent: #9c27b0;
|
||||
|
||||
$dark : #1D1D1D;
|
||||
$dark: #1d1d1d;
|
||||
|
||||
$positive : #21BA45;
|
||||
$negative : #C10015;
|
||||
$info : #31CCEC;
|
||||
$warning : #F2C037;
|
||||
$positive: #21ba45;
|
||||
$negative: #c10015;
|
||||
$info: #31ccec;
|
||||
$warning: #f2c037;
|
||||
|
|
|
|||
|
|
@ -2,6 +2,6 @@
|
|||
// so you can safely delete all default props below
|
||||
|
||||
export default {
|
||||
failed: 'Action failed',
|
||||
success: 'Action was successful'
|
||||
}
|
||||
failed: 'Action failed',
|
||||
success: 'Action was successful',
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import enUS from './en-US'
|
||||
import enUS from './en-US';
|
||||
|
||||
export default {
|
||||
'en-US': enUS
|
||||
}
|
||||
'en-US': enUS,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,22 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title><%= productName %></title>
|
||||
<head>
|
||||
<title><%= productName %></title>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="description" content="<%= productDescription %>">
|
||||
<meta name="format-detection" content="telephone=no">
|
||||
<meta name="msapplication-tap-highlight" content="no">
|
||||
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width<% if (ctx.mode.cordova || ctx.mode.capacitor) { %>, viewport-fit=cover<% } %>">
|
||||
<meta charset="utf-8" />
|
||||
<meta name="description" content="<%= productDescription %>" />
|
||||
<meta name="format-detection" content="telephone=no" />
|
||||
<meta name="msapplication-tap-highlight" content="no" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width<% if (ctx.mode.cordova || ctx.mode.capacitor) { %>, viewport-fit=cover<% } %>"
|
||||
/>
|
||||
|
||||
<link rel="icon" type="image/png" sizes="128x128" href="icons/favicon-128x128.png">
|
||||
<link rel="icon" type="image/png" sizes="96x96" href="icons/favicon-96x96.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png">
|
||||
<link rel="icon" type="image/ico" href="favicon.ico">
|
||||
</head>
|
||||
<body>
|
||||
<!-- DO NOT touch the following DIV -->
|
||||
<div id="q-app"></div>
|
||||
</body>
|
||||
<link rel="icon" type="image/png" sizes="128x128" href="icons/favicon-128x128.png" />
|
||||
<link rel="icon" type="image/png" sizes="96x96" href="icons/favicon-96x96.png" />
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png" />
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png" />
|
||||
<link rel="icon" type="image/ico" href="favicon.ico" />
|
||||
</head>
|
||||
<body>
|
||||
<!-- DO NOT touch the following DIV -->
|
||||
<div id="q-app"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,116 +1,95 @@
|
|||
<template>
|
||||
<q-layout view="lHh Lpr lFf">
|
||||
<q-header elevated>
|
||||
<q-toolbar>
|
||||
<q-btn
|
||||
flat
|
||||
dense
|
||||
round
|
||||
icon="menu"
|
||||
aria-label="Menu"
|
||||
@click="toggleLeftDrawer"
|
||||
/>
|
||||
<q-layout view="lHh Lpr lFf">
|
||||
<q-header elevated>
|
||||
<q-toolbar>
|
||||
<q-btn flat dense round icon="menu" aria-label="Menu" @click="toggleLeftDrawer" />
|
||||
|
||||
<q-toolbar-title>
|
||||
Quasar App
|
||||
</q-toolbar-title>
|
||||
<q-toolbar-title> Quasar App </q-toolbar-title>
|
||||
|
||||
<div>Quasar v{{ $q.version }}</div>
|
||||
</q-toolbar>
|
||||
</q-header>
|
||||
<div>Quasar v{{ $q.version }}</div>
|
||||
</q-toolbar>
|
||||
</q-header>
|
||||
|
||||
<q-drawer
|
||||
v-model="leftDrawerOpen"
|
||||
show-if-above
|
||||
bordered
|
||||
>
|
||||
<q-list>
|
||||
<q-item-label
|
||||
header
|
||||
>
|
||||
Essential Links
|
||||
</q-item-label>
|
||||
<q-drawer v-model="leftDrawerOpen" show-if-above bordered>
|
||||
<q-list>
|
||||
<q-item-label header> Essential Links </q-item-label>
|
||||
|
||||
<EssentialLink
|
||||
v-for="link in essentialLinks"
|
||||
:key="link.title"
|
||||
v-bind="link"
|
||||
/>
|
||||
</q-list>
|
||||
</q-drawer>
|
||||
<EssentialLink v-for="link in essentialLinks" :key="link.title" v-bind="link" />
|
||||
</q-list>
|
||||
</q-drawer>
|
||||
|
||||
<q-page-container>
|
||||
<router-view />
|
||||
</q-page-container>
|
||||
</q-layout>
|
||||
<q-page-container>
|
||||
<router-view />
|
||||
</q-page-container>
|
||||
</q-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref } from 'vue'
|
||||
import EssentialLink from 'components/EssentialLink.vue'
|
||||
import { defineComponent, ref } from 'vue';
|
||||
import EssentialLink from 'components/EssentialLink.vue';
|
||||
|
||||
const linksList = [
|
||||
{
|
||||
title: 'Docs',
|
||||
caption: 'quasar.dev',
|
||||
icon: 'school',
|
||||
link: 'https://quasar.dev'
|
||||
},
|
||||
{
|
||||
title: 'Github',
|
||||
caption: 'github.com/quasarframework',
|
||||
icon: 'code',
|
||||
link: 'https://github.com/quasarframework'
|
||||
},
|
||||
{
|
||||
title: 'Discord Chat Channel',
|
||||
caption: 'chat.quasar.dev',
|
||||
icon: 'chat',
|
||||
link: 'https://chat.quasar.dev'
|
||||
},
|
||||
{
|
||||
title: 'Forum',
|
||||
caption: 'forum.quasar.dev',
|
||||
icon: 'record_voice_over',
|
||||
link: 'https://forum.quasar.dev'
|
||||
},
|
||||
{
|
||||
title: 'Twitter',
|
||||
caption: '@quasarframework',
|
||||
icon: 'rss_feed',
|
||||
link: 'https://twitter.quasar.dev'
|
||||
},
|
||||
{
|
||||
title: 'Facebook',
|
||||
caption: '@QuasarFramework',
|
||||
icon: 'public',
|
||||
link: 'https://facebook.quasar.dev'
|
||||
},
|
||||
{
|
||||
title: 'Quasar Awesome',
|
||||
caption: 'Community Quasar projects',
|
||||
icon: 'favorite',
|
||||
link: 'https://awesome.quasar.dev'
|
||||
}
|
||||
]
|
||||
{
|
||||
title: 'Docs',
|
||||
caption: 'quasar.dev',
|
||||
icon: 'school',
|
||||
link: 'https://quasar.dev',
|
||||
},
|
||||
{
|
||||
title: 'Github',
|
||||
caption: 'github.com/quasarframework',
|
||||
icon: 'code',
|
||||
link: 'https://github.com/quasarframework',
|
||||
},
|
||||
{
|
||||
title: 'Discord Chat Channel',
|
||||
caption: 'chat.quasar.dev',
|
||||
icon: 'chat',
|
||||
link: 'https://chat.quasar.dev',
|
||||
},
|
||||
{
|
||||
title: 'Forum',
|
||||
caption: 'forum.quasar.dev',
|
||||
icon: 'record_voice_over',
|
||||
link: 'https://forum.quasar.dev',
|
||||
},
|
||||
{
|
||||
title: 'Twitter',
|
||||
caption: '@quasarframework',
|
||||
icon: 'rss_feed',
|
||||
link: 'https://twitter.quasar.dev',
|
||||
},
|
||||
{
|
||||
title: 'Facebook',
|
||||
caption: '@QuasarFramework',
|
||||
icon: 'public',
|
||||
link: 'https://facebook.quasar.dev',
|
||||
},
|
||||
{
|
||||
title: 'Quasar Awesome',
|
||||
caption: 'Community Quasar projects',
|
||||
icon: 'favorite',
|
||||
link: 'https://awesome.quasar.dev',
|
||||
},
|
||||
];
|
||||
|
||||
export default defineComponent({
|
||||
name: 'MainLayout',
|
||||
name: 'MainLayout',
|
||||
|
||||
components: {
|
||||
EssentialLink
|
||||
},
|
||||
components: {
|
||||
EssentialLink,
|
||||
},
|
||||
|
||||
setup () {
|
||||
const leftDrawerOpen = ref(false)
|
||||
setup() {
|
||||
const leftDrawerOpen = ref(false);
|
||||
|
||||
return {
|
||||
essentialLinks: linksList,
|
||||
leftDrawerOpen,
|
||||
toggleLeftDrawer () {
|
||||
leftDrawerOpen.value = !leftDrawerOpen.value
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
return {
|
||||
essentialLinks: linksList,
|
||||
leftDrawerOpen,
|
||||
toggleLeftDrawer() {
|
||||
leftDrawerOpen.value = !leftDrawerOpen.value;
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,31 +1,19 @@
|
|||
<template>
|
||||
<div class="fullscreen bg-blue text-white text-center q-pa-md flex flex-center">
|
||||
<div>
|
||||
<div style="font-size: 30vh">
|
||||
404
|
||||
</div>
|
||||
<div class="fullscreen bg-blue text-white text-center q-pa-md flex flex-center">
|
||||
<div>
|
||||
<div style="font-size: 30vh">404</div>
|
||||
|
||||
<div class="text-h2" style="opacity:.4">
|
||||
Oops. Nothing here...
|
||||
</div>
|
||||
<div class="text-h2" style="opacity: 0.4">Oops. Nothing here...</div>
|
||||
|
||||
<q-btn
|
||||
class="q-mt-xl"
|
||||
color="white"
|
||||
text-color="blue"
|
||||
unelevated
|
||||
to="/"
|
||||
label="Go Home"
|
||||
no-caps
|
||||
/>
|
||||
<q-btn class="q-mt-xl" color="white" text-color="blue" unelevated to="/" label="Go Home" no-caps />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent } from 'vue'
|
||||
import { defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'ErrorNotFound'
|
||||
})
|
||||
name: 'ErrorNotFound',
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,17 +1,13 @@
|
|||
<template>
|
||||
<q-page class="flex flex-center">
|
||||
<img
|
||||
alt="Quasar logo"
|
||||
src="~assets/quasar-logo-vertical.svg"
|
||||
style="width: 200px; height: 200px"
|
||||
>
|
||||
</q-page>
|
||||
<q-page class="flex flex-center">
|
||||
<img alt="Quasar logo" src="~assets/quasar-logo-vertical.svg" style="width: 200px; height: 200px" />
|
||||
</q-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent } from 'vue'
|
||||
import { defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'IndexPage'
|
||||
})
|
||||
name: 'IndexPage',
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { route } from 'quasar/wrappers'
|
||||
import { createRouter, createMemoryHistory, createWebHistory, createWebHashHistory } from 'vue-router'
|
||||
import routes from './routes'
|
||||
import { route } from 'quasar/wrappers';
|
||||
import { createRouter, createMemoryHistory, createWebHistory, createWebHashHistory } from 'vue-router';
|
||||
import routes from './routes';
|
||||
|
||||
/*
|
||||
* If not building with SSR mode, you can
|
||||
|
|
@ -12,19 +12,21 @@ import routes from './routes'
|
|||
*/
|
||||
|
||||
export default route(function (/* { store, ssrContext } */) {
|
||||
const createHistory = process.env.SERVER
|
||||
? createMemoryHistory
|
||||
: (process.env.VUE_ROUTER_MODE === 'history' ? createWebHistory : createWebHashHistory)
|
||||
const createHistory = process.env.SERVER
|
||||
? createMemoryHistory
|
||||
: process.env.VUE_ROUTER_MODE === 'history'
|
||||
? createWebHistory
|
||||
: createWebHashHistory;
|
||||
|
||||
const Router = createRouter({
|
||||
scrollBehavior: () => ({ left: 0, top: 0 }),
|
||||
routes,
|
||||
const Router = createRouter({
|
||||
scrollBehavior: () => ({ left: 0, top: 0 }),
|
||||
routes,
|
||||
|
||||
// Leave this as is and make changes in quasar.conf.js instead!
|
||||
// quasar.conf.js -> build -> vueRouterMode
|
||||
// quasar.conf.js -> build -> publicPath
|
||||
history: createHistory(process.env.MODE === 'ssr' ? void 0 : process.env.VUE_ROUTER_BASE)
|
||||
})
|
||||
// Leave this as is and make changes in quasar.conf.js instead!
|
||||
// quasar.conf.js -> build -> vueRouterMode
|
||||
// quasar.conf.js -> build -> publicPath
|
||||
history: createHistory(process.env.MODE === 'ssr' ? void 0 : process.env.VUE_ROUTER_BASE),
|
||||
});
|
||||
|
||||
return Router
|
||||
})
|
||||
return Router;
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,19 +1,16 @@
|
|||
|
||||
const routes = [
|
||||
{
|
||||
path: '/',
|
||||
component: () => import('layouts/MainLayout.vue'),
|
||||
children: [
|
||||
{ path: '', component: () => import('pages/IndexPage.vue') }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/',
|
||||
component: () => import('layouts/MainLayout.vue'),
|
||||
children: [{ path: '', component: () => import('pages/IndexPage.vue') }],
|
||||
},
|
||||
|
||||
// Always leave this as last one,
|
||||
// but you can also remove it
|
||||
{
|
||||
path: '/:catchAll(.*)*',
|
||||
component: () => import('pages/ErrorNotFound.vue')
|
||||
}
|
||||
]
|
||||
// Always leave this as last one,
|
||||
// but you can also remove it
|
||||
{
|
||||
path: '/:catchAll(.*)*',
|
||||
component: () => import('pages/ErrorNotFound.vue'),
|
||||
},
|
||||
];
|
||||
|
||||
export default routes
|
||||
export default routes;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "Using fixtures to represent data",
|
||||
"email": "hello@cypress.io",
|
||||
"body": "Fixtures are a great way to mock data for responses to routes"
|
||||
}
|
||||
"name": "Using fixtures to represent data",
|
||||
"email": "hello@cypress.io",
|
||||
"body": "Fixtures are a great way to mock data for responses to routes"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,12 +6,12 @@
|
|||
|
||||
// This test will pass when run against a clean Quasar project
|
||||
describe('Landing', () => {
|
||||
beforeEach(() => {
|
||||
cy.visit('/');
|
||||
});
|
||||
it('.should() - assert that <title> is correct', () => {
|
||||
cy.title().should('include', 'Quasar');
|
||||
});
|
||||
beforeEach(() => {
|
||||
cy.visit('/');
|
||||
});
|
||||
it('.should() - assert that <title> is correct', () => {
|
||||
cy.title().should('include', 'Quasar');
|
||||
});
|
||||
});
|
||||
|
||||
// ** The following code is an example to show you how to write some tests for your home page **
|
||||
|
|
|
|||
|
|
@ -21,11 +21,11 @@
|
|||
// * @type {Cypress.PluginConfig}
|
||||
// */
|
||||
module.exports = async (on, config) => {
|
||||
// // Enable component testing, you can safely remove this
|
||||
// // if you don't plan to use Cypress for unit tests
|
||||
// if (config.testingType === 'component') {
|
||||
// await injectDevServer(on, config);
|
||||
// }
|
||||
// // Enable component testing, you can safely remove this
|
||||
// // if you don't plan to use Cypress for unit tests
|
||||
// if (config.testingType === 'component') {
|
||||
// await injectDevServer(on, config);
|
||||
// }
|
||||
|
||||
return config;
|
||||
return config;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@ import { Dialog } from 'quasar';
|
|||
// For example use the actual i18n instance or mock it
|
||||
// config.global.plugins.push(i18n);
|
||||
config.global.mocks = {
|
||||
$t: () => '',
|
||||
$t: () => '',
|
||||
};
|
||||
|
||||
// Overwrite the transition and transition-group stubs which are stubbed by test-utils by default.
|
||||
|
|
|
|||
|
|
@ -3,24 +3,24 @@ import { defineComponent } from 'vue';
|
|||
import { Dialog } from 'quasar';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'DialogWrapper',
|
||||
props: {
|
||||
component: {
|
||||
type: Object,
|
||||
required: true,
|
||||
name: 'DialogWrapper',
|
||||
props: {
|
||||
component: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
componentProps: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
},
|
||||
componentProps: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
},
|
||||
setup(props) {
|
||||
Dialog.create({
|
||||
component: props.component,
|
||||
setup(props) {
|
||||
Dialog.create({
|
||||
component: props.component,
|
||||
|
||||
// props forwarded to your custom component
|
||||
componentProps: props.componentProps,
|
||||
});
|
||||
},
|
||||
// props forwarded to your custom component
|
||||
componentProps: props.componentProps,
|
||||
});
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,20 +1,20 @@
|
|||
<template>
|
||||
<q-layout>
|
||||
<component :is="component" v-bind="$attrs" />
|
||||
</q-layout>
|
||||
<q-layout>
|
||||
<component :is="component" v-bind="$attrs" />
|
||||
</q-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'LayoutContainer',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
component: {
|
||||
type: Object,
|
||||
required: true,
|
||||
name: 'LayoutContainer',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
component: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
module.exports = {
|
||||
extends: [
|
||||
// Removes 'no-undef' lint errors for Jest global functions (`describe`, `it`, etc),
|
||||
// add Jest-specific lint rules and Jest plugin
|
||||
// See https://github.com/jest-community/eslint-plugin-jest#recommended
|
||||
'plugin:jest/recommended',
|
||||
// Uncomment following line to apply style rules
|
||||
// 'plugin:jest/style',
|
||||
],
|
||||
extends: [
|
||||
// Removes 'no-undef' lint errors for Jest global functions (`describe`, `it`, etc),
|
||||
// add Jest-specific lint rules and Jest plugin
|
||||
// See https://github.com/jest-community/eslint-plugin-jest#recommended
|
||||
'plugin:jest/recommended',
|
||||
// Uncomment following line to apply style rules
|
||||
// 'plugin:jest/style',
|
||||
],
|
||||
};
|
||||
|
|
|
|||
|
|
@ -8,35 +8,35 @@ import MyButton from './demo/MyButton';
|
|||
installQuasarPlugin();
|
||||
|
||||
describe('MyButton', () => {
|
||||
it('has increment method', () => {
|
||||
const wrapper = mount(MyButton);
|
||||
const { vm } = wrapper;
|
||||
it('has increment method', () => {
|
||||
const wrapper = mount(MyButton);
|
||||
const { vm } = wrapper;
|
||||
|
||||
expect(typeof vm.increment).toBe('function');
|
||||
});
|
||||
expect(typeof vm.increment).toBe('function');
|
||||
});
|
||||
|
||||
it('can check the inner text content', () => {
|
||||
const wrapper = mount(MyButton);
|
||||
const { vm } = wrapper;
|
||||
it('can check the inner text content', () => {
|
||||
const wrapper = mount(MyButton);
|
||||
const { vm } = wrapper;
|
||||
|
||||
expect(vm.$el.textContent).toContain('rocket muffin');
|
||||
expect(wrapper.find('.content').text()).toContain('rocket muffin');
|
||||
});
|
||||
expect(vm.$el.textContent).toContain('rocket muffin');
|
||||
expect(wrapper.find('.content').text()).toContain('rocket muffin');
|
||||
});
|
||||
|
||||
it('sets the correct default data', () => {
|
||||
const wrapper = mount(MyButton);
|
||||
const { vm } = wrapper;
|
||||
it('sets the correct default data', () => {
|
||||
const wrapper = mount(MyButton);
|
||||
const { vm } = wrapper;
|
||||
|
||||
expect(typeof vm.counter).toBe('number');
|
||||
expect(vm.counter).toBe(0);
|
||||
});
|
||||
expect(typeof vm.counter).toBe('number');
|
||||
expect(vm.counter).toBe(0);
|
||||
});
|
||||
|
||||
it('correctly updates counter when button is pressed', async () => {
|
||||
const wrapper = shallowMount(MyButton);
|
||||
const { vm } = wrapper;
|
||||
it('correctly updates counter when button is pressed', async () => {
|
||||
const wrapper = shallowMount(MyButton);
|
||||
const { vm } = wrapper;
|
||||
|
||||
const button = wrapper.findComponent(QBtn);
|
||||
await button.trigger('click');
|
||||
expect(vm.counter).toBe(1);
|
||||
});
|
||||
const button = wrapper.findComponent(QBtn);
|
||||
await button.trigger('click');
|
||||
expect(vm.counter).toBe(1);
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -6,25 +6,23 @@ import MyDialog from './demo/MyDialog';
|
|||
installQuasarPlugin();
|
||||
|
||||
describe('MyDialog', () => {
|
||||
beforeEach(() => {
|
||||
mount(MyDialog, {
|
||||
data: () => ({
|
||||
isDialogOpen: true,
|
||||
}),
|
||||
beforeEach(() => {
|
||||
mount(MyDialog, {
|
||||
data: () => ({
|
||||
isDialogOpen: true,
|
||||
}),
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('should mount the document body and expose for testing', () => {
|
||||
const wrapper = new DOMWrapper(document.body);
|
||||
it('should mount the document body and expose for testing', () => {
|
||||
const wrapper = new DOMWrapper(document.body);
|
||||
|
||||
expect(wrapper.find('.q-dialog').exists()).toBeTruthy();
|
||||
});
|
||||
expect(wrapper.find('.q-dialog').exists()).toBeTruthy();
|
||||
});
|
||||
|
||||
it('can check the inner text of the dialog', () => {
|
||||
const wrapper = new DOMWrapper(document.body);
|
||||
it('can check the inner text of the dialog', () => {
|
||||
const wrapper = new DOMWrapper(document.body);
|
||||
|
||||
expect(wrapper.find('.q-dialog').html()).toContain(
|
||||
'Custom dialog which should be tested',
|
||||
);
|
||||
});
|
||||
expect(wrapper.find('.q-dialog').html()).toContain('Custom dialog which should be tested');
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -2,29 +2,29 @@
|
|||
import { defineComponent, ref } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'MyButton',
|
||||
props: {
|
||||
incrementStep: {
|
||||
type: Number,
|
||||
default: 1,
|
||||
name: 'MyButton',
|
||||
props: {
|
||||
incrementStep: {
|
||||
type: Number,
|
||||
default: 1,
|
||||
},
|
||||
},
|
||||
},
|
||||
setup(props) {
|
||||
const counter = ref(0);
|
||||
const input = ref('rocket muffin');
|
||||
function increment() {
|
||||
counter.value += props.incrementStep;
|
||||
}
|
||||
setup(props) {
|
||||
const counter = ref(0);
|
||||
const input = ref('rocket muffin');
|
||||
function increment() {
|
||||
counter.value += props.incrementStep;
|
||||
}
|
||||
|
||||
return { counter, input, increment };
|
||||
},
|
||||
return { counter, input, increment };
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<p class="content">{{ input }}</p>
|
||||
<span>{{ counter }}</span>
|
||||
<q-btn class="button" @click="increment()"></q-btn>
|
||||
</div>
|
||||
<div>
|
||||
<p class="content">{{ input }}</p>
|
||||
<span>{{ counter }}</span>
|
||||
<q-btn class="button" @click="increment()"></q-btn>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,20 +1,20 @@
|
|||
<template>
|
||||
<q-dialog v-model="isDialogOpen">
|
||||
<q-card>
|
||||
<q-card-section>Custom dialog which should be tested</q-card-section>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
<q-dialog v-model="isDialogOpen">
|
||||
<q-card>
|
||||
<q-card-section>Custom dialog which should be tested</q-card-section>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'MyDialog',
|
||||
data() {
|
||||
return {
|
||||
isDialogOpen: false,
|
||||
};
|
||||
},
|
||||
name: 'MyDialog',
|
||||
data() {
|
||||
return {
|
||||
isDialogOpen: false,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue