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
|
||||
|
|
|
|||
22
.eslintrc.js
22
.eslintrc.js
|
|
@ -6,29 +6,29 @@ module.exports = {
|
|||
|
||||
parserOptions: {
|
||||
parser: '@babel/eslint-parser',
|
||||
ecmaVersion: 2018, // Allows for the parsing of modern ECMAScript features
|
||||
sourceType: 'module' // Allows for the use of imports
|
||||
ecmaVersion: 2020, // Allows for the parsing of modern ECMAScript features
|
||||
sourceType: 'module', // Allows for the use of imports
|
||||
},
|
||||
|
||||
env: {
|
||||
browser: true
|
||||
browser: true,
|
||||
},
|
||||
|
||||
// Rules order is important, please avoid shuffling them
|
||||
extends: [
|
||||
// Base ESLint recommended rules
|
||||
// 'eslint:recommended',
|
||||
'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-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'
|
||||
'prettier',
|
||||
],
|
||||
|
||||
plugins: [
|
||||
|
|
@ -39,7 +39,6 @@ module.exports = {
|
|||
// 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: {
|
||||
|
|
@ -55,16 +54,15 @@ module.exports = {
|
|||
chrome: 'readonly',
|
||||
defineProps: 'readonly', // Vue SFC setup compiler macro
|
||||
defineEmits: 'readonly', // Vue SFC setup compiler macro
|
||||
defineExpose: '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'
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||
},
|
||||
|
||||
overrides: [
|
||||
|
|
@ -77,4 +75,4 @@ module.exports = {
|
|||
],
|
||||
},
|
||||
],
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -4,6 +4,6 @@
|
|||
module.exports = {
|
||||
plugins: [
|
||||
// to edit target browsers: use "browserslist" field in package.json
|
||||
require('autoprefixer')
|
||||
]
|
||||
}
|
||||
require('autoprefixer'),
|
||||
],
|
||||
};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,7 @@
|
|||
module.exports = {
|
||||
singleQuote: true,
|
||||
printWidth: 120,
|
||||
tabWidth: 4,
|
||||
semi: true,
|
||||
endOfLine: 'auto',
|
||||
};
|
||||
|
|
@ -2,22 +2,13 @@
|
|||
"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"
|
||||
],
|
||||
"editor.defaultFormatter": "johnsoncodehk.volar",
|
||||
"editor.codeActionsOnSave": ["source.fixAll.eslint"],
|
||||
"eslint.validate": ["javascript", "javascriptreact", "typescript", "vue"],
|
||||
"jest.jestCommandLine": "jest",
|
||||
"json.schemas": [
|
||||
{
|
||||
"fileMatch": [
|
||||
"cypress.json"
|
||||
],
|
||||
"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).
|
||||
|
|
|
|||
|
|
@ -18,11 +18,7 @@ module.exports = {
|
|||
// watch: true,
|
||||
collectCoverage: false,
|
||||
coverageDirectory: '<rootDir>/test/jest/coverage',
|
||||
collectCoverageFrom: [
|
||||
'<rootDir>/src/**/*.vue',
|
||||
'<rootDir>/src/**/*.js',
|
||||
'<rootDir>/src/**/*.jsx',
|
||||
],
|
||||
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: {
|
||||
|
|
@ -33,10 +29,7 @@ module.exports = {
|
|||
// statements: 50
|
||||
},
|
||||
},
|
||||
testMatch: [
|
||||
'<rootDir>/test/jest/__tests__/**/*.(spec|test).js',
|
||||
'<rootDir>/src/**/*.jest.(spec|test).js',
|
||||
],
|
||||
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',
|
||||
|
|
@ -53,8 +46,7 @@ module.exports = {
|
|||
transform: {
|
||||
'.*\\.vue$': 'vue-jest',
|
||||
'.*\\.js$': 'babel-jest',
|
||||
'.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$':
|
||||
'jest-transform-stub',
|
||||
'.+\\.(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'
|
||||
|
|
|
|||
|
|
@ -2,38 +2,16 @@
|
|||
"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"
|
||||
]
|
||||
"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"
|
||||
]
|
||||
"exclude": ["dist", ".quasar", "node_modules"]
|
||||
}
|
||||
|
|
@ -8,9 +8,7 @@
|
|||
// 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');
|
||||
|
||||
|
|
@ -25,15 +23,10 @@ module.exports = configure(function (ctx) {
|
|||
// app boot file (/src/boot)
|
||||
// --> boot files are part of "main.js"
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/boot-files
|
||||
boot: [
|
||||
'i18n',
|
||||
'axios',
|
||||
],
|
||||
boot: ['i18n', 'axios'],
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-css
|
||||
css: [
|
||||
'app.scss'
|
||||
],
|
||||
css: ['app.scss'],
|
||||
|
||||
// https://github.com/quasarframework/quasar/tree/dev/extras
|
||||
extras: [
|
||||
|
|
@ -73,20 +66,18 @@ module.exports = configure(function (ctx) {
|
|||
// 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' ] }])
|
||||
}
|
||||
|
||||
chainWebpack(chain) {
|
||||
chain.plugin('eslint-webpack-plugin').use(ESLintPlugin, [{ extensions: ['js', 'vue'] }]);
|
||||
},
|
||||
},
|
||||
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-devServer
|
||||
devServer: {
|
||||
server: {
|
||||
type: 'http'
|
||||
type: 'http',
|
||||
},
|
||||
port: 8080,
|
||||
open: true // opens browser window automatically
|
||||
open: true, // opens browser window automatically
|
||||
},
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/quasar-config-js#Property%3A-framework
|
||||
|
|
@ -104,7 +95,7 @@ module.exports = configure(function (ctx) {
|
|||
// directives: [],
|
||||
|
||||
// Quasar plugins
|
||||
plugins: []
|
||||
plugins: [],
|
||||
},
|
||||
|
||||
// animations: 'all', // --- includes all animations
|
||||
|
|
@ -124,17 +115,14 @@ module.exports = configure(function (ctx) {
|
|||
maxAge: 1000 * 60 * 60 * 24 * 30,
|
||||
// Tell browser when a file from the server should expire from cache (in ms)
|
||||
|
||||
|
||||
chainWebpackWebserver (chain) {
|
||||
chain.plugin('eslint-webpack-plugin')
|
||||
.use(ESLintPlugin, [{ extensions: [ 'js' ] }])
|
||||
chainWebpackWebserver(chain) {
|
||||
chain.plugin('eslint-webpack-plugin').use(ESLintPlugin, [{ extensions: ['js'] }]);
|
||||
},
|
||||
|
||||
|
||||
middlewares: [
|
||||
ctx.prod ? 'compression' : '',
|
||||
'render' // keep this as last one
|
||||
]
|
||||
'render', // keep this as last one
|
||||
],
|
||||
},
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli-webpack/developing-pwa/configuring-pwa
|
||||
|
|
@ -145,12 +133,10 @@ module.exports = configure(function (ctx) {
|
|||
// 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' ] }])
|
||||
chainWebpackCustomSW(chain) {
|
||||
chain.plugin('eslint-webpack-plugin').use(ESLintPlugin, [{ extensions: ['js'] }]);
|
||||
},
|
||||
|
||||
|
||||
manifest: {
|
||||
name: `Salix`,
|
||||
short_name: `Salix`,
|
||||
|
|
@ -163,30 +149,30 @@ module.exports = configure(function (ctx) {
|
|||
{
|
||||
src: 'icons/icon-128x128.png',
|
||||
sizes: '128x128',
|
||||
type: 'image/png'
|
||||
type: 'image/png',
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-192x192.png',
|
||||
sizes: '192x192',
|
||||
type: 'image/png'
|
||||
type: 'image/png',
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-256x256.png',
|
||||
sizes: '256x256',
|
||||
type: 'image/png'
|
||||
type: 'image/png',
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-384x384.png',
|
||||
sizes: '384x384',
|
||||
type: 'image/png'
|
||||
type: 'image/png',
|
||||
},
|
||||
{
|
||||
src: 'icons/icon-512x512.png',
|
||||
sizes: '512x512',
|
||||
type: 'image/png'
|
||||
}
|
||||
]
|
||||
}
|
||||
type: 'image/png',
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-cordova-apps/configuring-cordova
|
||||
|
|
@ -196,7 +182,7 @@ module.exports = configure(function (ctx) {
|
|||
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-capacitor-apps/configuring-capacitor
|
||||
capacitor: {
|
||||
hideSplashscreen: true
|
||||
hideSplashscreen: true,
|
||||
},
|
||||
|
||||
// Full list of options: https://v2.quasar.dev/quasar-cli-webpack/developing-electron-apps/configuring-electron
|
||||
|
|
@ -205,13 +191,11 @@ module.exports = configure(function (ctx) {
|
|||
|
||||
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: { ... }
|
||||
},
|
||||
|
|
@ -219,23 +203,18 @@ module.exports = configure(function (ctx) {
|
|||
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' ] }])
|
||||
chainWebpackMain(chain) {
|
||||
chain.plugin('eslint-webpack-plugin').use(ESLintPlugin, [{ extensions: ['js'] }]);
|
||||
},
|
||||
|
||||
|
||||
|
||||
chainWebpackPreload (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"
|
||||
]
|
||||
"options": ["scripts"]
|
||||
},
|
||||
"@quasar/testing-e2e-cypress": {
|
||||
"options": [
|
||||
"scripts"
|
||||
]
|
||||
"options": ["scripts"]
|
||||
}
|
||||
}
|
||||
|
|
@ -2,10 +2,7 @@
|
|||
<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
|
||||
|
||||
app.config.globalProperties.$axios = axios
|
||||
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
|
||||
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
|
||||
})
|
||||
messages,
|
||||
});
|
||||
|
||||
// Set i18n instance on app
|
||||
app.use(i18n)
|
||||
})
|
||||
app.use(i18n);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,14 +1,6 @@
|
|||
<template>
|
||||
<q-item
|
||||
clickable
|
||||
tag="a"
|
||||
target="_blank"
|
||||
:href="link"
|
||||
>
|
||||
<q-item-section
|
||||
v-if="icon"
|
||||
avatar
|
||||
>
|
||||
<q-item clickable tag="a" target="_blank" :href="link">
|
||||
<q-item-section v-if="icon" avatar>
|
||||
<q-icon :name="icon" />
|
||||
</q-item-section>
|
||||
|
||||
|
|
@ -20,30 +12,30 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent } from 'vue'
|
||||
import { defineComponent } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'EssentialLink',
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
required: true
|
||||
required: true,
|
||||
},
|
||||
|
||||
caption: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: '',
|
||||
},
|
||||
|
||||
link: {
|
||||
type: String,
|
||||
default: '#'
|
||||
default: '#',
|
||||
},
|
||||
|
||||
icon: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
}
|
||||
})
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,5 @@
|
|||
<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>
|
||||
|
|
|
|||
|
|
@ -6,12 +6,7 @@
|
|||
|
||||
<!-- buttons example -->
|
||||
<q-card-actions align="right">
|
||||
<q-btn
|
||||
data-cy="ok-button"
|
||||
color="primary"
|
||||
label="OK"
|
||||
@click="onOKClick"
|
||||
/>
|
||||
<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>
|
||||
|
|
@ -37,8 +32,7 @@ export default defineComponent({
|
|||
|
||||
setup() {
|
||||
// REQUIRED; must be called inside of setup()
|
||||
const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } =
|
||||
useDialogPluginComponent();
|
||||
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
|
||||
|
|
|
|||
|
|
@ -1,14 +1,7 @@
|
|||
<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-tooltip v-model="showTooltip" data-cy="tooltip" class="bg-red" :offset="[10, 10]"> Here I am! </q-tooltip>
|
||||
</q-btn>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -27,9 +27,7 @@ describe('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', () => {
|
||||
|
|
|
|||
|
|
@ -9,13 +9,7 @@ describe('QuasarDrawer', () => {
|
|||
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');
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -3,5 +3,5 @@
|
|||
|
||||
export default {
|
||||
failed: 'Action failed',
|
||||
success: 'Action was successful'
|
||||
}
|
||||
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,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -3,17 +3,20 @@
|
|||
<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">
|
||||
<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 -->
|
||||
|
|
|
|||
|
|
@ -2,40 +2,19 @@
|
|||
<q-layout view="lHh Lpr lFf">
|
||||
<q-header elevated>
|
||||
<q-toolbar>
|
||||
<q-btn
|
||||
flat
|
||||
dense
|
||||
round
|
||||
icon="menu"
|
||||
aria-label="Menu"
|
||||
@click="toggleLeftDrawer"
|
||||
/>
|
||||
<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>
|
||||
|
||||
<q-drawer
|
||||
v-model="leftDrawerOpen"
|
||||
show-if-above
|
||||
bordered
|
||||
>
|
||||
<q-drawer v-model="leftDrawerOpen" show-if-above bordered>
|
||||
<q-list>
|
||||
<q-item-label
|
||||
header
|
||||
>
|
||||
Essential Links
|
||||
</q-item-label>
|
||||
<q-item-label header> Essential Links </q-item-label>
|
||||
|
||||
<EssentialLink
|
||||
v-for="link in essentialLinks"
|
||||
:key="link.title"
|
||||
v-bind="link"
|
||||
/>
|
||||
<EssentialLink v-for="link in essentialLinks" :key="link.title" v-bind="link" />
|
||||
</q-list>
|
||||
</q-drawer>
|
||||
|
||||
|
|
@ -46,71 +25,71 @@
|
|||
</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'
|
||||
link: 'https://quasar.dev',
|
||||
},
|
||||
{
|
||||
title: 'Github',
|
||||
caption: 'github.com/quasarframework',
|
||||
icon: 'code',
|
||||
link: 'https://github.com/quasarframework'
|
||||
link: 'https://github.com/quasarframework',
|
||||
},
|
||||
{
|
||||
title: 'Discord Chat Channel',
|
||||
caption: 'chat.quasar.dev',
|
||||
icon: 'chat',
|
||||
link: 'https://chat.quasar.dev'
|
||||
link: 'https://chat.quasar.dev',
|
||||
},
|
||||
{
|
||||
title: 'Forum',
|
||||
caption: 'forum.quasar.dev',
|
||||
icon: 'record_voice_over',
|
||||
link: 'https://forum.quasar.dev'
|
||||
link: 'https://forum.quasar.dev',
|
||||
},
|
||||
{
|
||||
title: 'Twitter',
|
||||
caption: '@quasarframework',
|
||||
icon: 'rss_feed',
|
||||
link: 'https://twitter.quasar.dev'
|
||||
link: 'https://twitter.quasar.dev',
|
||||
},
|
||||
{
|
||||
title: 'Facebook',
|
||||
caption: '@QuasarFramework',
|
||||
icon: 'public',
|
||||
link: 'https://facebook.quasar.dev'
|
||||
link: 'https://facebook.quasar.dev',
|
||||
},
|
||||
{
|
||||
title: 'Quasar Awesome',
|
||||
caption: 'Community Quasar projects',
|
||||
icon: 'favorite',
|
||||
link: 'https://awesome.quasar.dev'
|
||||
}
|
||||
]
|
||||
link: 'https://awesome.quasar.dev',
|
||||
},
|
||||
];
|
||||
|
||||
export default defineComponent({
|
||||
name: 'MainLayout',
|
||||
|
||||
components: {
|
||||
EssentialLink
|
||||
EssentialLink,
|
||||
},
|
||||
|
||||
setup () {
|
||||
const leftDrawerOpen = ref(false)
|
||||
setup() {
|
||||
const leftDrawerOpen = ref(false);
|
||||
|
||||
return {
|
||||
essentialLinks: linksList,
|
||||
leftDrawerOpen,
|
||||
toggleLeftDrawer () {
|
||||
leftDrawerOpen.value = !leftDrawerOpen.value
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
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 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>
|
||||
</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"
|
||||
>
|
||||
<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
|
||||
|
|
@ -14,7 +14,9 @@ import routes from './routes'
|
|||
export default route(function (/* { store, ssrContext } */) {
|
||||
const createHistory = process.env.SERVER
|
||||
? createMemoryHistory
|
||||
: (process.env.VUE_ROUTER_MODE === 'history' ? createWebHistory : createWebHashHistory)
|
||||
: process.env.VUE_ROUTER_MODE === 'history'
|
||||
? createWebHistory
|
||||
: createWebHashHistory;
|
||||
|
||||
const Router = createRouter({
|
||||
scrollBehavior: () => ({ left: 0, top: 0 }),
|
||||
|
|
@ -23,8 +25,8 @@ export default route(function (/* { store, ssrContext } */) {
|
|||
// 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)
|
||||
})
|
||||
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') }
|
||||
]
|
||||
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')
|
||||
}
|
||||
]
|
||||
component: () => import('pages/ErrorNotFound.vue'),
|
||||
},
|
||||
];
|
||||
|
||||
export default routes
|
||||
export default routes;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -23,8 +23,6 @@ describe('MyDialog', () => {
|
|||
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');
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue