geolba/tethys.backend
2
0
Fork 1
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

- prettier formatting
All checks were successful
CI Pipeline / japa-tests (push) Successful in 51s
Details

Browse Source 
- npm updates
- new SearchMap.vue component
This commit is contained in:
Kaimbacher 2023-10-31 15:38:43 +01:00
parent 7bc9f90cca
commit a7142f694f
74 changed files with 3360 additions and 3577 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

132
.adonisrc.json
View File

@ -1,73 +1,63 @@
{ {
"typescript": true, "typescript": true,
"commands": [ "commands": [
"./commands", "./commands",
"@adonisjs/core/build/commands/index.js", "@adonisjs/core/build/commands/index.js",
"@adonisjs/repl/build/commands", "@adonisjs/repl/build/commands",
"@eidellev/inertia-adonisjs/build/commands", "@eidellev/inertia-adonisjs/build/commands",
"@adonisjs/lucid/build/commands" "@adonisjs/lucid/build/commands"
], ],
"exceptionHandlerNamespace": "App/Exceptions/Handler", "exceptionHandlerNamespace": "App/Exceptions/Handler",
"aliases": { "aliases": {
"App": "app", "App": "app",
"Config": "config", "Config": "config",
"Database": "database", "Database": "database",
"Contracts": "contracts" "Contracts": "contracts"
}, },
"preloads": [ "preloads": [
"./start/routes", "./start/routes",
"./start/kernel", "./start/kernel",
{ {
"file": "./start/inertia", "file": "./start/inertia",
"environment": [ "environment": ["web"]
"web" },
] {
}, "file": "./start/validator",
{ "environment": ["web"]
"file": "./start/validator", }
"environment": [ ],
"web" "providers": [
] "./providers/AppProvider",
} "@adonisjs/core",
], "@adonisjs/session",
"providers": [ "@adonisjs/view",
"./providers/AppProvider", "@adonisjs/shield",
"@adonisjs/core", "@eidellev/inertia-adonisjs",
"@adonisjs/session", "@adonisjs/lucid",
"@adonisjs/view", "@adonisjs/auth",
"@adonisjs/shield", "@eidellev/adonis-stardust",
"@eidellev/inertia-adonisjs", "./providers/QueryBuilderProvider",
"@adonisjs/lucid", "./providers/TokenWorkerProvider"
"@adonisjs/auth", ],
"@eidellev/adonis-stardust", "metaFiles": [
"./providers/QueryBuilderProvider", {
"./providers/TokenWorkerProvider" "pattern": "public/**",
], "reloadServer": false
"metaFiles": [ },
{ {
"pattern": "public/**", "pattern": "resources/views/**/*.edge",
"reloadServer": false "reloadServer": false
}, }
{ ],
"pattern": "resources/views/**/*.edge", "aceProviders": ["@adonisjs/repl"],
"reloadServer": false "tests": {
} "suites": [
], {
"aceProviders": [ "name": "functional",
"@adonisjs/repl" "files": ["tests/functional/**/*.spec(.ts|.js)"],
], "timeout": 60000
"tests": { }
"suites": [ ]
{ },
"name": "functional", "testProviders": ["@japa/preset-adonis/TestsProvider"]
"files": [
"tests/functional/**/*.spec(.ts|.js)"
],
"timeout": 60000
}
]
},
"testProviders": [
"@japa/preset-adonis/TestsProvider"
]
} }

70
.babelrc
View File

@ -1,37 +1,37 @@
{ {
"presets": [ "presets": [
[ [
"@babel/preset-env", "@babel/preset-env",
{ {
"targets": { "targets": {
"edge": "17", "edge": "17",
"firefox": "60", "firefox": "60",
"chrome": "67", "chrome": "67",
"safari": "11.1" "safari": "11.1"
} }
// "useBuiltIns": "usage", // "useBuiltIns": "usage",
// "corejs": "3.16" // "corejs": "3.16"
// "targets":{"node":"16"} // "targets":{"node":"16"}
// "useBuiltIns": "entry", // "useBuiltIns": "entry",
// "targets": "> 0.25%, not dead" // "targets": "> 0.25%, not dead"
} }
], ],
// "@babel/preset-env", // "@babel/preset-env",
"@babel/preset-typescript" "@babel/preset-typescript"
], ],
"plugins": [ "plugins": [
// [ // [
// "@babel/plugin-transform-typescript", { // "@babel/plugin-transform-typescript", {
// "allowDeclareFields": true // "allowDeclareFields": true
// }], // }],
[ [
"@babel/plugin-proposal-decorators", "@babel/plugin-proposal-decorators",
{ {
"legacy": true "legacy": true
} }
], ],
"@babel/proposal-class-properties" "@babel/proposal-class-properties"
// "@babel/proposal-object-rest-spread" // "@babel/proposal-object-rest-spread"
] ]
} }

22
.eslintrc.json
View File

@ -1,24 +1,14 @@
{ {
"extends": [ "extends": ["plugin:adonis/typescriptApp", "prettier"],
"plugin:adonis/typescriptApp", "plugins": ["prettier"],
"prettier"
],
"plugins": [
"prettier"
],
"rules": { "rules": {
"prettier/prettier": [ "prettier/prettier": ["error", { "singleQuote": true }],
"error", "@typescript-eslint/indent": ["error", 4, { "ignoredNodes": ["PropertyDefinition", "TSUnionType"] }],
{ "singleQuote": true }
],
"@typescript-eslint/indent": ["error", 4, { "ignoredNodes": ["PropertyDefinition", "TSUnionType"] }],
"@typescript-eslint/naming-convention": [ "@typescript-eslint/naming-convention": [
"warn", "warn",
{ {
"selector": "interface", "selector": "interface",
"format": [ "format": ["PascalCase"],
"PascalCase"
],
"custom": { "custom": {
"regex": "^I[A-Z]", "regex": "^I[A-Z]",
"match": false "match": false
@ -26,4 +16,4 @@
} }
] ]
} }
} }

5
.gitea/workflows/ci.yaml
View File

@ -13,7 +13,7 @@ jobs:
runs-on: ubuntu-latest runs-on: ubuntu-latest
container: node:16-bullseye container: node:16-bullseye
services: services:
mydb: mydb:
image: postgres:latest image: postgres:latest
@ -27,8 +27,7 @@ jobs:
- 5432:5432 - 5432:5432
# Set health checks to wait until postgres has started # Set health checks to wait until postgres has started
options: --health-cmd pg_isready --health-interval 10s --health-timeout 5s --health-retries 5 options: --health-cmd pg_isready --health-interval 10s --health-timeout 5s --health-retries 5
steps: steps:
# this will check out the current branch (https://github.com/actions/checkout#Push-a-commit-using-the-built-in-token) # this will check out the current branch (https://github.com/actions/checkout#Push-a-commit-using-the-built-in-token)
- name: 1 Check out repository code - name: 1 Check out repository code

1227
ace-manifest.json
View File

File diff suppressed because it is too large Load Diff

2
app/Controllers/Http/Editor/DatasetsController.ts
View File

@ -100,7 +100,7 @@ export default class DatasetsController {
try { try {
// console.log(doc); // console.log(doc);
let document = JSON.parse(`${doc}`); let document = JSON.parse(`${doc}`);
// https://opensearch.org/docs/2.1/opensearch/supported-field-types/geo-shape/ // https://opensearch.org/docs/2.1/opensearch/supported-field-types/geo-shape/
// Define the new document // Define the new document

4
commands/IndexDatasets.ts
View File

@ -9,7 +9,7 @@ import { transform } from 'saxon-js';
import { Client } from '@opensearch-project/opensearch'; import { Client } from '@opensearch-project/opensearch';
const opensearchNode = process.env.OPENSEARCH_HOST || 'localhost'; const opensearchNode = process.env.OPENSEARCH_HOST || 'localhost';
const client = new Client({ node: `http://${opensearchNode}:9200` }); // replace with your OpenSearch endpoint const client = new Client({ node: `http://${opensearchNode}` }); // replace with your OpenSearch endpoint
export default class IndexDatasets extends BaseCommand { export default class IndexDatasets extends BaseCommand {
public static commandName = 'index:datasets'; public static commandName = 'index:datasets';
@ -87,7 +87,7 @@ export default class IndexDatasets extends BaseCommand {
}); });
Logger.info(`dataset with publish_id ${dataset.publish_id} successfully indexed`); Logger.info(`dataset with publish_id ${dataset.publish_id} successfully indexed`);
} catch (error) { } catch (error) {
Logger.error(`An error occurred while uindexing datsaet with publish_id ${dataset.publish_id}.`); Logger.error(`An error occurred while indexing datsaet with publish_id ${dataset.publish_id}.`);
} }
} }

621
package-lock.json generated
View File

@ -2682,9 +2682,9 @@
} }
}, },
"node_modules/@eslint-community/regexpp": { "node_modules/@eslint-community/regexpp": {
"version": "4.9.1", "version": "4.10.0",
"resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.9.1.tgz", "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.10.0.tgz",
"integrity": "sha512-Y27x+MBLjXa+0JWDhykM3+JE+il3kHKAEqabfEWq3SDhZjLYb6/BHL/JKFnH3fe207JaXkyDo685Oc2Glt6ifA==", "integrity": "sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA==",
"dev": true, "dev": true,
"engines": { "engines": {
"node": "^12.0.0 || ^14.0.0 || >=16.0.0" "node": "^12.0.0 || ^14.0.0 || >=16.0.0"
@ -2826,9 +2826,9 @@
"dev": true "dev": true
}, },
"node_modules/@inertiajs/core": { "node_modules/@inertiajs/core": {
"version": "1.0.12", "version": "1.0.13",
"resolved": "https://registry.npmjs.org/@inertiajs/core/-/core-1.0.12.tgz", "resolved": "https://registry.npmjs.org/@inertiajs/core/-/core-1.0.13.tgz",
"integrity": "sha512-N9RBmkL7p6N81NT4pBJpU6CmLqO1/VrTdVjIoEjnOpqTjNJnX6Zyq4j8ld2tqLDEd7FZ2tITY30AV1ncvI7B6g==", "integrity": "sha512-xPvogbRgAXbogP16EBnGduEmVtImdncEBNQF9etRFF5Ne2nrJafeFgM0FZHqsSqCDvA4jjk8b8Ezt6gZRPK9hg==",
"dependencies": { "dependencies": {
"axios": "^1.2.0", "axios": "^1.2.0",
"deepmerge": "^4.0.0", "deepmerge": "^4.0.0",
@ -2837,9 +2837,9 @@
} }
}, },
"node_modules/@inertiajs/core/node_modules/axios": { "node_modules/@inertiajs/core/node_modules/axios": {
"version": "1.5.1", "version": "1.6.0",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.5.1.tgz", "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.0.tgz",
"integrity": "sha512-Q28iYCWzNHjAm+yEAot5QaAMxhMghWLFVf7rRdwhUI+c2jix2DUXjAHXVi+s1ibs3mjPO/cCgbA++3BjD0vP/A==", "integrity": "sha512-EZ1DYihju9pwVB+jg67ogm+Tmqc6JmhamRN6I4Zt8DfZu5lbcQGw3ozH9lFejSJgs/ibaef3A9PMXPLeefFGJg==",
"dependencies": { "dependencies": {
"follow-redirects": "^1.15.0", "follow-redirects": "^1.15.0",
"form-data": "^4.0.0", "form-data": "^4.0.0",
@ -2857,11 +2857,11 @@
} }
}, },
"node_modules/@inertiajs/vue3": { "node_modules/@inertiajs/vue3": {
"version": "1.0.12", "version": "1.0.13",
"resolved": "https://registry.npmjs.org/@inertiajs/vue3/-/vue3-1.0.12.tgz", "resolved": "https://registry.npmjs.org/@inertiajs/vue3/-/vue3-1.0.13.tgz",
"integrity": "sha512-ycMtiCequV/IyPhzXQAnS0uFXTBVkmaXqygAADrLNtkLczGqpCuazULXp3lIArJfotjtx10kEQ8ojTHcQ4bg1g==", "integrity": "sha512-KtUZBP0qRjAHX+ZKpBRFrAwwxUpq51eNhfxxp8A7NAn0OpajfQB8cwVkB4368JGOdjkGFLhDJkMpzfxe0qlPPg==",
"dependencies": { "dependencies": {
"@inertiajs/core": "1.0.12", "@inertiajs/core": "1.0.13",
"lodash.clonedeep": "^4.5.0", "lodash.clonedeep": "^4.5.0",
"lodash.isequal": "^4.5.0" "lodash.isequal": "^4.5.0"
}, },
@ -3964,9 +3964,9 @@
} }
}, },
"node_modules/@types/estree": { "node_modules/@types/estree": {
"version": "1.0.3", "version": "1.0.4",
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.3.tgz", "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.4.tgz",
"integrity": "sha512-CS2rOaoQ/eAgAfcTfq6amKG7bsN+EMcgGY4FAFQdvSj2y1ixvOZTUA9mOtCai7E1SYu283XNw7urKK30nP3wkQ==", "integrity": "sha512-2JwWnHK9H+wUZNorf2Zr6ves96WHoWDJIftkcxPKsS7Djta6Zu519LarhRNljPXkpsZR2ZMwNCPeW7omW07BJw==",
"dev": true, "dev": true,
"peer": true "peer": true
}, },
@ -4122,11 +4122,20 @@
"dev": true "dev": true
}, },
"node_modules/@types/node": { "node_modules/@types/node": {
"version": "20.8.7", "version": "20.8.10",
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.8.7.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-20.8.10.tgz",
"integrity": "sha512-21TKHHh3eUHIi2MloeptJWALuCu5H7HQTdTrWIFReA8ad+aggoX+lRes3ex7/FtpC+sVUpFMQ+QTfYr74mruiQ==", "integrity": "sha512-TlgT8JntpcbmKUFzjhsyhGfP2fsiz1Mv56im6enJ905xG1DAYesxJaeSbGqQmAw8OWPdhyJGhGSQGKRNJ45u9w==",
"dependencies": { "dependencies": {
"undici-types": "~5.25.1" "undici-types": "~5.26.4"
}
},
"node_modules/@types/node-forge": {
"version": "1.3.8",
"resolved": "https://registry.npmjs.org/@types/node-forge/-/node-forge-1.3.8.tgz",
"integrity": "sha512-vGXshY9vim9CJjrpcS5raqSjEfKlJcWy2HNdgUasR66fAnVEYarrf1ULV4nfvpC1nZq/moA9qyqBcu83x+Jlrg==",
"dev": true,
"dependencies": {
"@types/node": "*"
} }
}, },
"node_modules/@types/pino": { "node_modules/@types/pino": {
@ -4545,36 +4554,36 @@
"dev": true "dev": true
}, },
"node_modules/@vue/compiler-core": { "node_modules/@vue/compiler-core": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.3.6.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.3.7.tgz",
"integrity": "sha512-2JNjemwaNwf+MkkatATVZi7oAH1Hx0B04DdPH3ZoZ8vKC1xZVP7nl4HIsk8XYd3r+/52sqqoz9TWzYc3yE9dqA==", "integrity": "sha512-pACdY6YnTNVLXsB86YD8OF9ihwpolzhhtdLVHhBL6do/ykr6kKXNYABRtNMGrsQXpEXXyAdwvWWkuTbs4MFtPQ==",
"dependencies": { "dependencies": {
"@babel/parser": "^7.23.0", "@babel/parser": "^7.23.0",
"@vue/shared": "3.3.6", "@vue/shared": "3.3.7",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"source-map-js": "^1.0.2" "source-map-js": "^1.0.2"
} }
}, },
"node_modules/@vue/compiler-dom": { "node_modules/@vue/compiler-dom": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.3.6.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.3.7.tgz",
"integrity": "sha512-1MxXcJYMHiTPexjLAJUkNs/Tw2eDf2tY3a0rL+LfuWyiKN2s6jvSwywH3PWD8bKICjfebX3GWx2Os8jkRDq3Ng==", "integrity": "sha512-0LwkyJjnUPssXv/d1vNJ0PKfBlDoQs7n81CbO6Q0zdL7H1EzqYRrTVXDqdBVqro0aJjo/FOa1qBAPVI4PGSHBw==",
"dependencies": { "dependencies": {
"@vue/compiler-core": "3.3.6", "@vue/compiler-core": "3.3.7",
"@vue/shared": "3.3.6" "@vue/shared": "3.3.7"
} }
}, },
"node_modules/@vue/compiler-sfc": { "node_modules/@vue/compiler-sfc": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.3.6.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.3.7.tgz",
"integrity": "sha512-/Kms6du2h1VrXFreuZmlvQej8B1zenBqIohP0690IUBkJjsFvJxY0crcvVRJ0UhMgSR9dewB+khdR1DfbpArJA==", "integrity": "sha512-7pfldWy/J75U/ZyYIXRVqvLRw3vmfxDo2YLMwVtWVNew8Sm8d6wodM+OYFq4ll/UxfqVr0XKiVwti32PCrruAw==",
"dependencies": { "dependencies": {
"@babel/parser": "^7.23.0", "@babel/parser": "^7.23.0",
"@vue/compiler-core": "3.3.6", "@vue/compiler-core": "3.3.7",
"@vue/compiler-dom": "3.3.6", "@vue/compiler-dom": "3.3.7",
"@vue/compiler-ssr": "3.3.6", "@vue/compiler-ssr": "3.3.7",
"@vue/reactivity-transform": "3.3.6", "@vue/reactivity-transform": "3.3.7",
"@vue/shared": "3.3.6", "@vue/shared": "3.3.7",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"magic-string": "^0.30.5", "magic-string": "^0.30.5",
"postcss": "^8.4.31", "postcss": "^8.4.31",
@ -4582,12 +4591,12 @@
} }
}, },
"node_modules/@vue/compiler-ssr": { "node_modules/@vue/compiler-ssr": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.3.6.tgz", "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.3.7.tgz",
"integrity": "sha512-QTIHAfDCHhjXlYGkUg5KH7YwYtdUM1vcFl/FxFDlD6d0nXAmnjizka3HITp8DGudzHndv2PjKVS44vqqy0vP4w==", "integrity": "sha512-TxOfNVVeH3zgBc82kcUv+emNHo+vKnlRrkv8YvQU5+Y5LJGJwSNzcmLUoxD/dNzv0bhQ/F0s+InlgV0NrApJZg==",
"dependencies": { "dependencies": {
"@vue/compiler-dom": "3.3.6", "@vue/compiler-dom": "3.3.7",
"@vue/shared": "3.3.6" "@vue/shared": "3.3.7"
} }
}, },
"node_modules/@vue/devtools-api": { "node_modules/@vue/devtools-api": {
@ -4597,41 +4606,41 @@
"dev": true "dev": true
}, },
"node_modules/@vue/reactivity": { "node_modules/@vue/reactivity": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.3.6.tgz", "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.3.7.tgz",
"integrity": "sha512-gtChAumfQz5lSy5jZXfyXbKrIYPf9XEOrIr6rxwVyeWVjFhJwmwPLtV6Yis+M9onzX++I5AVE9j+iPH60U+B8Q==", "integrity": "sha512-cZNVjWiw00708WqT0zRpyAgduG79dScKEPYJXq2xj/aMtk3SKvL3FBt2QKUlh6EHBJ1m8RhBY+ikBUzwc7/khg==",
"dependencies": { "dependencies": {
"@vue/shared": "3.3.6" "@vue/shared": "3.3.7"
} }
}, },
"node_modules/@vue/reactivity-transform": { "node_modules/@vue/reactivity-transform": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.3.6.tgz", "resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.3.7.tgz",
"integrity": "sha512-RlJl4dHfeO7EuzU1iJOsrlqWyJfHTkJbvYz/IOJWqu8dlCNWtxWX377WI0VsbAgBizjwD+3ZjdnvSyyFW1YVng==", "integrity": "sha512-APhRmLVbgE1VPGtoLQoWBJEaQk4V8JUsqrQihImVqKT+8U6Qi3t5ATcg4Y9wGAPb3kIhetpufyZ1RhwbZCIdDA==",
"dependencies": { "dependencies": {
"@babel/parser": "^7.23.0", "@babel/parser": "^7.23.0",
"@vue/compiler-core": "3.3.6", "@vue/compiler-core": "3.3.7",
"@vue/shared": "3.3.6", "@vue/shared": "3.3.7",
"estree-walker": "^2.0.2", "estree-walker": "^2.0.2",
"magic-string": "^0.30.5" "magic-string": "^0.30.5"
} }
}, },
"node_modules/@vue/runtime-core": { "node_modules/@vue/runtime-core": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.3.6.tgz", "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.3.7.tgz",
"integrity": "sha512-qp7HTP1iw1UW2ZGJ8L3zpqlngrBKvLsDAcq5lA6JvEXHmpoEmjKju7ahM9W2p/h51h0OT5F2fGlP/gMhHOmbUA==", "integrity": "sha512-LHq9du3ubLZFdK/BP0Ysy3zhHqRfBn80Uc+T5Hz3maFJBGhci1MafccnL3rpd5/3wVfRHAe6c+PnlO2PAavPTQ==",
"dependencies": { "dependencies": {
"@vue/reactivity": "3.3.6", "@vue/reactivity": "3.3.7",
"@vue/shared": "3.3.6" "@vue/shared": "3.3.7"
} }
}, },
"node_modules/@vue/runtime-dom": { "node_modules/@vue/runtime-dom": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.3.6.tgz", "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.3.7.tgz",
"integrity": "sha512-AoX3Cp8NqMXjLbIG9YR6n/pPLWE9TiDdk6wTJHFnl2GpHzDFH1HLBC9wlqqQ7RlnvN3bVLpzPGAAH00SAtOxHg==", "integrity": "sha512-PFQU1oeJxikdDmrfoNQay5nD4tcPNYixUBruZzVX/l0eyZvFKElZUjW4KctCcs52nnpMGO6UDK+jF5oV4GT5Lw==",
"dependencies": { "dependencies": {
"@vue/runtime-core": "3.3.6", "@vue/runtime-core": "3.3.7",
"@vue/shared": "3.3.6", "@vue/shared": "3.3.7",
"csstype": "^3.1.2" "csstype": "^3.1.2"
} }
}, },
@ -4641,21 +4650,21 @@
"integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==" "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ=="
}, },
"node_modules/@vue/server-renderer": { "node_modules/@vue/server-renderer": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.3.6.tgz", "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.3.7.tgz",
"integrity": "sha512-kgLoN43W4ERdZ6dpyy+gnk2ZHtcOaIr5Uc/WUP5DRwutgvluzu2pudsZGoD2b7AEJHByUVMa9k6Sho5lLRCykw==", "integrity": "sha512-UlpKDInd1hIZiNuVVVvLgxpfnSouxKQOSE2bOfQpBuGwxRV/JqqTCyyjXUWiwtVMyeRaZhOYYqntxElk8FhBhw==",
"dependencies": { "dependencies": {
"@vue/compiler-ssr": "3.3.6", "@vue/compiler-ssr": "3.3.7",
"@vue/shared": "3.3.6" "@vue/shared": "3.3.7"
}, },
"peerDependencies": { "peerDependencies": {
"vue": "3.3.6" "vue": "3.3.7"
} }
}, },
"node_modules/@vue/shared": { "node_modules/@vue/shared": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.3.6.tgz", "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.3.7.tgz",
"integrity": "sha512-Xno5pEqg8SVhomD0kTSmfh30ZEmV/+jZtyh39q6QflrjdJCXah5lrnOLi9KB6a5k5aAHXMXjoMnxlzUkCNfWLQ==" "integrity": "sha512-N/tbkINRUDExgcPTBvxNkvHGu504k8lzlNQRITVnm6YjOjwa4r0nnbd4Jb01sNpur5hAllyRJzSK5PvB9PPwRg=="
}, },
"node_modules/@vue/tsconfig": { "node_modules/@vue/tsconfig": {
"version": "0.4.0", "version": "0.4.0",
@ -4914,9 +4923,9 @@
} }
}, },
"node_modules/acorn": { "node_modules/acorn": {
"version": "8.10.0", "version": "8.11.2",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.10.0.tgz", "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.2.tgz",
"integrity": "sha512-F0SAmZ8iUtS//m8DmCTA0jlh6TDKkHQyK6xc6V4KDTyZKA9dnvX9/3sRTVQrWm79glUAZbnmmNcdYwUIHWVybw==", "integrity": "sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==",
"bin": { "bin": {
"acorn": "bin/acorn" "acorn": "bin/acorn"
}, },
@ -4997,9 +5006,9 @@
} }
}, },
"node_modules/acorn-walk": { "node_modules/acorn-walk": {
"version": "8.2.0", "version": "8.3.0",
"resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.2.0.tgz", "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.0.tgz",
"integrity": "sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==", "integrity": "sha512-FS7hV565M5l1R08MXqo8odwMTB02C2UqzB17RVgu9EyuYFBqJZ3/ZY97sQD5FewVu1UyDFc1yztUDrAwT0EypA==",
"engines": { "engines": {
"node": ">=0.4.0" "node": ">=0.4.0"
} }
@ -5816,13 +5825,13 @@
} }
}, },
"node_modules/babel-plugin-polyfill-corejs3": { "node_modules/babel-plugin-polyfill-corejs3": {
"version": "0.8.5", "version": "0.8.6",
"resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.8.5.tgz", "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.8.6.tgz",
"integrity": "sha512-Q6CdATeAvbScWPNLB8lzSO7fgUVBkQt6zLgNlfyeCr/EQaEQR+bWiBYYPYAFyE528BMjRhL+1QBMOI4jc/c5TA==", "integrity": "sha512-leDIc4l4tUgU7str5BWLS2h8q2N4Nf6lGZP6UrNDxdtfF2g69eJ5L0H7S8A5Ln/arfFAfHor5InAdZuIOwZdgQ==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@babel/helper-define-polyfill-provider": "^0.4.3", "@babel/helper-define-polyfill-provider": "^0.4.3",
"core-js-compat": "^3.32.2" "core-js-compat": "^3.33.1"
}, },
"peerDependencies": { "peerDependencies": {
"@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0" "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
@ -6290,9 +6299,9 @@
} }
}, },
"node_modules/caniuse-lite": { "node_modules/caniuse-lite": {
"version": "1.0.30001553", "version": "1.0.30001559",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001553.tgz", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001559.tgz",
"integrity": "sha512-N0ttd6TrFfuqKNi+pMgWJTb9qrdJu4JSpgPFLe/lrD19ugC6fZgF0pUewRowDwzdDnb9V41mFcdlYgl/PyKf4A==", "integrity": "sha512-cPiMKZgqgkg5LY3/ntGeLFUpi6tzddBNS58A4tnTgQw1zON7u2sZMU7SzOeVH4tj20++9ggL+V6FDOFMTaFFYA==",
"dev": true, "dev": true,
"funding": [ "funding": [
{ {
@ -6523,75 +6532,17 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/class-utils/node_modules/is-accessor-descriptor": {
"version": "0.1.6",
"resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
"integrity": "sha512-e1BM1qnDbMRG3ll2U9dSK0UMHuWOs3pY3AtcFsmvwPtKL3MML/Q86i+GilLfvqEs4GW+ExB91tQ3Ig9noDIZ+A==",
"dev": true,
"dependencies": {
"kind-of": "^3.0.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/class-utils/node_modules/is-accessor-descriptor/node_modules/kind-of": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
"integrity": "sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==",
"dev": true,
"dependencies": {
"is-buffer": "^1.1.5"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/class-utils/node_modules/is-data-descriptor": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
"integrity": "sha512-+w9D5ulSoBNlmw9OHn3U2v51SyoCd0he+bB3xMl62oijhrspxowjU+AIcDY0N3iEJbUEkB15IlMASQsxYigvXg==",
"dev": true,
"dependencies": {
"kind-of": "^3.0.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/class-utils/node_modules/is-data-descriptor/node_modules/kind-of": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
"integrity": "sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==",
"dev": true,
"dependencies": {
"is-buffer": "^1.1.5"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/class-utils/node_modules/is-descriptor": { "node_modules/class-utils/node_modules/is-descriptor": {
"version": "0.1.6", "version": "0.1.7",
"resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz", "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.7.tgz",
"integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==", "integrity": "sha512-C3grZTvObeN1xud4cRWl366OMXZTj0+HGyk4hvfpx4ZHt1Pb60ANSXqCK7pdOTeUQpRzECBSTphqvD7U+l22Eg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"is-accessor-descriptor": "^0.1.6", "is-accessor-descriptor": "^1.0.1",
"is-data-descriptor": "^0.1.4", "is-data-descriptor": "^1.0.1"
"kind-of": "^5.0.0"
}, },
"engines": { "engines": {
"node": ">=0.10.0" "node": ">= 0.4"
}
},
"node_modules/class-utils/node_modules/kind-of": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
"integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw==",
"dev": true,
"engines": {
"node": ">=0.10.0"
} }
}, },
"node_modules/clean-stack": { "node_modules/clean-stack": {
@ -6958,9 +6909,9 @@
} }
}, },
"node_modules/core-js-compat": { "node_modules/core-js-compat": {
"version": "3.33.1", "version": "3.33.2",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.33.1.tgz", "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.33.2.tgz",
"integrity": "sha512-6pYKNOgD/j/bkC5xS5IIg6bncid3rfrI42oBH1SQJbsmYPKF7rhzcFzYCcxYMmNQQ0rCEB8WqpW7QHndOggaeQ==", "integrity": "sha512-axfo+wxFVxnqf8RvxTzoAlzW4gRoacrHeoFlc9n0x50+7BEyZL/Rt3hicaED1/CEd7I6tPCPVUYcJwCMO5XUYw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"browserslist": "^4.22.1" "browserslist": "^4.22.1"
@ -8152,9 +8103,9 @@
"integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==" "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow=="
}, },
"node_modules/electron-to-chromium": { "node_modules/electron-to-chromium": {
"version": "1.4.563", "version": "1.4.571",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.563.tgz", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.571.tgz",
"integrity": "sha512-dg5gj5qOgfZNkPNeyKBZQAQitIQ/xwfIDmEQJHCbXaD9ebTZxwJXUsDYcBlAvZGZLi+/354l35J1wkmP6CqYaw==", "integrity": "sha512-Sc+VtKwKCDj3f/kLBjdyjMpNzoZsU6WuL/wFb6EH8USmHEcebxRXcRrVpOpayxd52tuey4RUDpUsw5OS5LhJqg==",
"dev": true "dev": true
}, },
"node_modules/emittery": { "node_modules/emittery": {
@ -8751,66 +8702,17 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/expand-brackets/node_modules/is-accessor-descriptor": {
"version": "0.1.6",
"resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
"integrity": "sha512-e1BM1qnDbMRG3ll2U9dSK0UMHuWOs3pY3AtcFsmvwPtKL3MML/Q86i+GilLfvqEs4GW+ExB91tQ3Ig9noDIZ+A==",
"dev": true,
"dependencies": {
"kind-of": "^3.0.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/expand-brackets/node_modules/is-accessor-descriptor/node_modules/kind-of": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
"integrity": "sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==",
"dev": true,
"dependencies": {
"is-buffer": "^1.1.5"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/expand-brackets/node_modules/is-data-descriptor": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
"integrity": "sha512-+w9D5ulSoBNlmw9OHn3U2v51SyoCd0he+bB3xMl62oijhrspxowjU+AIcDY0N3iEJbUEkB15IlMASQsxYigvXg==",
"dev": true,
"dependencies": {
"kind-of": "^3.0.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/expand-brackets/node_modules/is-data-descriptor/node_modules/kind-of": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
"integrity": "sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==",
"dev": true,
"dependencies": {
"is-buffer": "^1.1.5"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/expand-brackets/node_modules/is-descriptor": { "node_modules/expand-brackets/node_modules/is-descriptor": {
"version": "0.1.6", "version": "0.1.7",
"resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz", "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.7.tgz",
"integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==", "integrity": "sha512-C3grZTvObeN1xud4cRWl366OMXZTj0+HGyk4hvfpx4ZHt1Pb60ANSXqCK7pdOTeUQpRzECBSTphqvD7U+l22Eg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"is-accessor-descriptor": "^0.1.6", "is-accessor-descriptor": "^1.0.1",
"is-data-descriptor": "^0.1.4", "is-data-descriptor": "^1.0.1"
"kind-of": "^5.0.0"
}, },
"engines": { "engines": {
"node": ">=0.10.0" "node": ">= 0.4"
} }
}, },
"node_modules/expand-brackets/node_modules/is-extendable": { "node_modules/expand-brackets/node_modules/is-extendable": {
@ -8822,15 +8724,6 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/expand-brackets/node_modules/kind-of": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
"integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw==",
"dev": true,
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/expand-brackets/node_modules/ms": { "node_modules/expand-brackets/node_modules/ms": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
@ -10428,15 +10321,15 @@
} }
}, },
"node_modules/is-accessor-descriptor": { "node_modules/is-accessor-descriptor": {
"version": "1.0.0", "version": "1.0.1",
"resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz", "resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-1.0.1.tgz",
"integrity": "sha512-m5hnHTkcVsPfqx3AKlyttIPb7J+XykHvJP2B9bZDjlhLIoEq4XoK64Vg7boZlVWYK6LUY94dYPEE7Lh0ZkZKcQ==", "integrity": "sha512-YBUanLI8Yoihw923YeFUS5fs0fF2f5TSFTNiYAAzhhDscDa3lEqYuz1pDOEP5KvX94I9ey3vsqjJcLVFVU+3QA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"kind-of": "^6.0.0" "hasown": "^2.0.0"
}, },
"engines": { "engines": {
"node": ">=0.10.0" "node": ">= 0.10"
} }
}, },
"node_modules/is-arrayish": { "node_modules/is-arrayish": {
@ -10474,29 +10367,28 @@
} }
}, },
"node_modules/is-data-descriptor": { "node_modules/is-data-descriptor": {
"version": "1.0.0", "version": "1.0.1",
"resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz", "resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-1.0.1.tgz",
"integrity": "sha512-jbRXy1FmtAoCjQkVmIVYwuuqDFUbaOeDjmed1tOGPrsMhtJA4rD9tkgA0F1qJ3gRFRXcHYVkdeaP50Q5rE/jLQ==", "integrity": "sha512-bc4NlCDiCr28U4aEsQ3Qs2491gVq4V8G7MQyws968ImqjKuYtTJXrl7Vq7jsN7Ly/C3xj5KWFrY7sHNeDkAzXw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"kind-of": "^6.0.0" "hasown": "^2.0.0"
}, },
"engines": { "engines": {
"node": ">=0.10.0" "node": ">= 0.4"
} }
}, },
"node_modules/is-descriptor": { "node_modules/is-descriptor": {
"version": "1.0.2", "version": "1.0.3",
"resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.2.tgz", "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-1.0.3.tgz",
"integrity": "sha512-2eis5WqQGV7peooDyLmNEPUrps9+SXX5c9pL3xEB+4e9HnGuDa7mB7kHxHw4CbqS9k1T2hOH3miL8n8WtiYVtg==", "integrity": "sha512-JCNNGbwWZEVaSPtS45mdtrneRWJFp07LLmykxeFV5F6oBvNF8vHSfJuJgoT472pSfk+Mf8VnlrspaFBHWM8JAw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"is-accessor-descriptor": "^1.0.0", "is-accessor-descriptor": "^1.0.1",
"is-data-descriptor": "^1.0.0", "is-data-descriptor": "^1.0.1"
"kind-of": "^6.0.2"
}, },
"engines": { "engines": {
"node": ">=0.10.0" "node": ">= 0.4"
} }
}, },
"node_modules/is-docker": { "node_modules/is-docker": {
@ -11150,9 +11042,9 @@
} }
}, },
"node_modules/jiti": { "node_modules/jiti": {
"version": "1.20.0", "version": "1.21.0",
"resolved": "https://registry.npmjs.org/jiti/-/jiti-1.20.0.tgz", "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.0.tgz",
"integrity": "sha512-3TV69ZbrvV6U5DfQimop50jE9Dl6J8O1ja1dvBbMba/sZ3YBEQqJ2VZRoQPVnhlzjNtU1vaXRZVrVjU4qtm8yA==", "integrity": "sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==",
"dev": true, "dev": true,
"bin": { "bin": {
"jiti": "bin/jiti.js" "jiti": "bin/jiti.js"
@ -12423,51 +12315,17 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/object-copy/node_modules/is-accessor-descriptor": {
"version": "0.1.6",
"resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
"integrity": "sha512-e1BM1qnDbMRG3ll2U9dSK0UMHuWOs3pY3AtcFsmvwPtKL3MML/Q86i+GilLfvqEs4GW+ExB91tQ3Ig9noDIZ+A==",
"dev": true,
"dependencies": {
"kind-of": "^3.0.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/object-copy/node_modules/is-data-descriptor": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
"integrity": "sha512-+w9D5ulSoBNlmw9OHn3U2v51SyoCd0he+bB3xMl62oijhrspxowjU+AIcDY0N3iEJbUEkB15IlMASQsxYigvXg==",
"dev": true,
"dependencies": {
"kind-of": "^3.0.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/object-copy/node_modules/is-descriptor": { "node_modules/object-copy/node_modules/is-descriptor": {
"version": "0.1.6", "version": "0.1.7",
"resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz", "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.7.tgz",
"integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==", "integrity": "sha512-C3grZTvObeN1xud4cRWl366OMXZTj0+HGyk4hvfpx4ZHt1Pb60ANSXqCK7pdOTeUQpRzECBSTphqvD7U+l22Eg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"is-accessor-descriptor": "^0.1.6", "is-accessor-descriptor": "^1.0.1",
"is-data-descriptor": "^0.1.4", "is-data-descriptor": "^1.0.1"
"kind-of": "^5.0.0"
}, },
"engines": { "engines": {
"node": ">=0.10.0" "node": ">= 0.4"
}
},
"node_modules/object-copy/node_modules/is-descriptor/node_modules/kind-of": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
"integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw==",
"dev": true,
"engines": {
"node": ">=0.10.0"
} }
}, },
"node_modules/object-copy/node_modules/kind-of": { "node_modules/object-copy/node_modules/kind-of": {
@ -14206,9 +14064,9 @@
} }
}, },
"node_modules/punycode": { "node_modules/punycode": {
"version": "2.3.0", "version": "2.3.1",
"resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.0.tgz", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
"integrity": "sha512-rRV+zQD8tVFys26lAGR9WUuS4iUAngJScM+ZRSKtvl5tKeZ2t5bvdNFdNHBW9FWR4guGHlgmsZ1G7BSm2wTbuA==", "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
"dev": true, "dev": true,
"engines": { "engines": {
"node": ">=6" "node": ">=6"
@ -14798,9 +14656,9 @@
} }
}, },
"node_modules/saxon-js/node_modules/axios": { "node_modules/saxon-js/node_modules/axios": {
"version": "1.5.1", "version": "1.6.0",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.5.1.tgz", "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.0.tgz",
"integrity": "sha512-Q28iYCWzNHjAm+yEAot5QaAMxhMghWLFVf7rRdwhUI+c2jix2DUXjAHXVi+s1ibs3mjPO/cCgbA++3BjD0vP/A==", "integrity": "sha512-EZ1DYihju9pwVB+jg67ogm+Tmqc6JmhamRN6I4Zt8DfZu5lbcQGw3ozH9lFejSJgs/ibaef3A9PMXPLeefFGJg==",
"dependencies": { "dependencies": {
"follow-redirects": "^1.15.0", "follow-redirects": "^1.15.0",
"form-data": "^4.0.0", "form-data": "^4.0.0",
@ -14878,11 +14736,12 @@
"dev": true "dev": true
}, },
"node_modules/selfsigned": { "node_modules/selfsigned": {
"version": "2.1.1", "version": "2.4.1",
"resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-2.1.1.tgz", "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-2.4.1.tgz",
"integrity": "sha512-GSL3aowiF7wa/WtSFwnUrludWFoNhftq8bUkH9pkzjpN2XSPOAYEgg6e0sS9s0rZwgJzJiQRPU18A6clnoW5wQ==", "integrity": "sha512-th5B4L2U+eGLq1TVh7zNRGBapioSORUeymIydxgFpwww9d2qyKvtuPU2jJuHvYAwwqi2Y596QBL3eEqcPEYL8Q==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@types/node-forge": "^1.3.0",
"node-forge": "^1" "node-forge": "^1"
}, },
"engines": { "engines": {
@ -15383,66 +15242,17 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/snapdragon/node_modules/is-accessor-descriptor": {
"version": "0.1.6",
"resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
"integrity": "sha512-e1BM1qnDbMRG3ll2U9dSK0UMHuWOs3pY3AtcFsmvwPtKL3MML/Q86i+GilLfvqEs4GW+ExB91tQ3Ig9noDIZ+A==",
"dev": true,
"dependencies": {
"kind-of": "^3.0.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/snapdragon/node_modules/is-accessor-descriptor/node_modules/kind-of": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
"integrity": "sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==",
"dev": true,
"dependencies": {
"is-buffer": "^1.1.5"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/snapdragon/node_modules/is-data-descriptor": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
"integrity": "sha512-+w9D5ulSoBNlmw9OHn3U2v51SyoCd0he+bB3xMl62oijhrspxowjU+AIcDY0N3iEJbUEkB15IlMASQsxYigvXg==",
"dev": true,
"dependencies": {
"kind-of": "^3.0.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/snapdragon/node_modules/is-data-descriptor/node_modules/kind-of": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
"integrity": "sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==",
"dev": true,
"dependencies": {
"is-buffer": "^1.1.5"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/snapdragon/node_modules/is-descriptor": { "node_modules/snapdragon/node_modules/is-descriptor": {
"version": "0.1.6", "version": "0.1.7",
"resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz", "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.7.tgz",
"integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==", "integrity": "sha512-C3grZTvObeN1xud4cRWl366OMXZTj0+HGyk4hvfpx4ZHt1Pb60ANSXqCK7pdOTeUQpRzECBSTphqvD7U+l22Eg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"is-accessor-descriptor": "^0.1.6", "is-accessor-descriptor": "^1.0.1",
"is-data-descriptor": "^0.1.4", "is-data-descriptor": "^1.0.1"
"kind-of": "^5.0.0"
}, },
"engines": { "engines": {
"node": ">=0.10.0" "node": ">= 0.4"
} }
}, },
"node_modules/snapdragon/node_modules/is-extendable": { "node_modules/snapdragon/node_modules/is-extendable": {
@ -15454,15 +15264,6 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/snapdragon/node_modules/kind-of": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
"integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw==",
"dev": true,
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/snapdragon/node_modules/ms": { "node_modules/snapdragon/node_modules/ms": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
@ -15670,75 +15471,17 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/static-extend/node_modules/is-accessor-descriptor": {
"version": "0.1.6",
"resolved": "https://registry.npmjs.org/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz",
"integrity": "sha512-e1BM1qnDbMRG3ll2U9dSK0UMHuWOs3pY3AtcFsmvwPtKL3MML/Q86i+GilLfvqEs4GW+ExB91tQ3Ig9noDIZ+A==",
"dev": true,
"dependencies": {
"kind-of": "^3.0.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/static-extend/node_modules/is-accessor-descriptor/node_modules/kind-of": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
"integrity": "sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==",
"dev": true,
"dependencies": {
"is-buffer": "^1.1.5"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/static-extend/node_modules/is-data-descriptor": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz",
"integrity": "sha512-+w9D5ulSoBNlmw9OHn3U2v51SyoCd0he+bB3xMl62oijhrspxowjU+AIcDY0N3iEJbUEkB15IlMASQsxYigvXg==",
"dev": true,
"dependencies": {
"kind-of": "^3.0.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/static-extend/node_modules/is-data-descriptor/node_modules/kind-of": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
"integrity": "sha512-NOW9QQXMoZGg/oqnVNoNTTIFEIid1627WCffUBJEdMxYApq7mNE7CpzucIPc+ZQg25Phej7IJSmX3hO+oblOtQ==",
"dev": true,
"dependencies": {
"is-buffer": "^1.1.5"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/static-extend/node_modules/is-descriptor": { "node_modules/static-extend/node_modules/is-descriptor": {
"version": "0.1.6", "version": "0.1.7",
"resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.6.tgz", "resolved": "https://registry.npmjs.org/is-descriptor/-/is-descriptor-0.1.7.tgz",
"integrity": "sha512-avDYr0SB3DwO9zsMov0gKCESFYqCnE4hq/4z3TdUlukEy5t9C0YRq7HLrsN52NAcqXKaepeCD0n+B0arnVG3Hg==", "integrity": "sha512-C3grZTvObeN1xud4cRWl366OMXZTj0+HGyk4hvfpx4ZHt1Pb60ANSXqCK7pdOTeUQpRzECBSTphqvD7U+l22Eg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"is-accessor-descriptor": "^0.1.6", "is-accessor-descriptor": "^1.0.1",
"is-data-descriptor": "^0.1.4", "is-data-descriptor": "^1.0.1"
"kind-of": "^5.0.0"
}, },
"engines": { "engines": {
"node": ">=0.10.0" "node": ">= 0.4"
}
},
"node_modules/static-extend/node_modules/kind-of": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-5.1.0.tgz",
"integrity": "sha512-NGEErnH6F2vUuXDh+OlbcKW7/wOcfdRHaZ7VWtqCztfHri/++YKmP51OdWeGPuqCOba6kk2OTe5d02VmTB80Pw==",
"dev": true,
"engines": {
"node": ">=0.10.0"
} }
}, },
"node_modules/statuses": { "node_modules/statuses": {
@ -16204,9 +15947,9 @@
} }
}, },
"node_modules/tailwindcss": { "node_modules/tailwindcss": {
"version": "3.3.3", "version": "3.3.5",
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.3.tgz", "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.5.tgz",
"integrity": "sha512-A0KgSkef7eE4Mf+nKJ83i75TMyq8HqY3qmFIJSWy8bNt0v1lG7jUcpGpoTFxAwYcWOphcTBLPPJg+bDfhDf52w==", "integrity": "sha512-5SEZU4J7pxZgSkv7FP1zY8i2TIAOooNZ1e/OGtxIEv6GltpoiXUqWvLy89+a10qYTB1N5Ifkuw9lqQkN9sscvA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@alloc/quick-lru": "^5.2.0", "@alloc/quick-lru": "^5.2.0",
@ -16214,10 +15957,10 @@
"chokidar": "^3.5.3", "chokidar": "^3.5.3",
"didyoumean": "^1.2.2", "didyoumean": "^1.2.2",
"dlv": "^1.1.3", "dlv": "^1.1.3",
"fast-glob": "^3.2.12", "fast-glob": "^3.3.0",
"glob-parent": "^6.0.2", "glob-parent": "^6.0.2",
"is-glob": "^4.0.3", "is-glob": "^4.0.3",
"jiti": "^1.18.2", "jiti": "^1.19.1",
"lilconfig": "^2.1.0", "lilconfig": "^2.1.0",
"micromatch": "^4.0.5", "micromatch": "^4.0.5",
"normalize-path": "^3.0.0", "normalize-path": "^3.0.0",
@ -16269,9 +16012,9 @@
} }
}, },
"node_modules/terser": { "node_modules/terser": {
"version": "5.22.0", "version": "5.23.0",
"resolved": "https://registry.npmjs.org/terser/-/terser-5.22.0.tgz", "resolved": "https://registry.npmjs.org/terser/-/terser-5.23.0.tgz",
"integrity": "sha512-hHZVLgRA2z4NWcN6aS5rQDc+7Dcy58HOf2zbYwmFcQ+ua3h6eEFf5lIDKTzbWwlazPyOZsFQO8V80/IjVNExEw==", "integrity": "sha512-Iyy83LN0uX9ZZLCX4Qbu5JiHiWjOCTwrmM9InWOzVeM++KNWEsqV4YgN9U9E8AlohQ6Gs42ztczlWOG/lwDAMA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@jridgewell/source-map": "^0.3.3", "@jridgewell/source-map": "^0.3.3",
@ -16767,9 +16510,9 @@
} }
}, },
"node_modules/undici-types": { "node_modules/undici-types": {
"version": "5.25.3", "version": "5.26.5",
"resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.25.3.tgz", "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
"integrity": "sha512-Ga1jfYwRn7+cP9v8auvEXN1rX3sWqlayd4HP7OKk4mZWylEmu3KzXDUGrQUN6Ol7qo1gPvB2e5gX6udnyEPgdA==" "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA=="
}, },
"node_modules/unicode-canonical-property-names-ecmascript": { "node_modules/unicode-canonical-property-names-ecmascript": {
"version": "2.0.0", "version": "2.0.0",
@ -17064,15 +16807,15 @@
} }
}, },
"node_modules/vue": { "node_modules/vue": {
"version": "3.3.6", "version": "3.3.7",
"resolved": "https://registry.npmjs.org/vue/-/vue-3.3.6.tgz", "resolved": "https://registry.npmjs.org/vue/-/vue-3.3.7.tgz",
"integrity": "sha512-jJIDETeWJnoY+gfn4ZtMPMS5KtbP4ax+CT4dcQFhTnWEk8xMupFyQ0JxL28nvT/M4+p4a0ptxaV2WY0LiIxvRg==", "integrity": "sha512-YEMDia1ZTv1TeBbnu6VybatmSteGOS3A3YgfINOfraCbf85wdKHzscD6HSS/vB4GAtI7sa1XPX7HcQaJ1l24zA==",
"dependencies": { "dependencies": {
"@vue/compiler-dom": "3.3.6", "@vue/compiler-dom": "3.3.7",
"@vue/compiler-sfc": "3.3.6", "@vue/compiler-sfc": "3.3.7",
"@vue/runtime-dom": "3.3.6", "@vue/runtime-dom": "3.3.7",
"@vue/server-renderer": "3.3.6", "@vue/server-renderer": "3.3.7",
"@vue/shared": "3.3.6" "@vue/shared": "3.3.7"
}, },
"peerDependencies": { "peerDependencies": {
"typescript": "*" "typescript": "*"
@ -17093,9 +16836,9 @@
} }
}, },
"node_modules/vue-loader": { "node_modules/vue-loader": {
"version": "17.3.0", "version": "17.3.1",
"resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-17.3.0.tgz", "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-17.3.1.tgz",
"integrity": "sha512-VUURABiN0TIUz0yvJJ/V/rZjGUh10JZtD+IDI5bXFslzFi9mV6ebKkPzoqiSi8e0vh8Ip7JHJx+I0AzAG0KsCA==", "integrity": "sha512-nmVu7KU8geOyzsStyyaxID/uBGDMS8BkPXb6Lu2SNkMawriIbb+hYrNtgftHMKxOSkjjjTF5OSSwPo3KP59egg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"chalk": "^4.1.0", "chalk": "^4.1.0",
@ -17686,9 +17429,9 @@
} }
}, },
"node_modules/xslt3/node_modules/axios": { "node_modules/xslt3/node_modules/axios": {
"version": "1.5.1", "version": "1.6.0",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.5.1.tgz", "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.0.tgz",
"integrity": "sha512-Q28iYCWzNHjAm+yEAot5QaAMxhMghWLFVf7rRdwhUI+c2jix2DUXjAHXVi+s1ibs3mjPO/cCgbA++3BjD0vP/A==", "integrity": "sha512-EZ1DYihju9pwVB+jg67ogm+Tmqc6JmhamRN6I4Zt8DfZu5lbcQGw3ozH9lFejSJgs/ibaef3A9PMXPLeefFGJg==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"follow-redirects": "^1.15.0", "follow-redirects": "^1.15.0",

13
public/records.json
View File

@ -43,16 +43,16 @@
"title_output": { "title_output": {
"type": "keyword", "type": "keyword",
"index": false "index": false
}, },
"abstract": { "abstract": {
"type": "text" "type": "text"
}, },
"abstract_output": { "abstract_output": {
"type": "keyword", "type": "keyword",
"index": false "index": false
}, },
"author": { "author": {
"type": "text", "type": "text",
"fields": { "fields": {
"keyword": { "keyword": {
"type": "keyword", "type": "keyword",
@ -64,7 +64,7 @@
"type": "keyword" "type": "keyword"
}, },
"subjects": { "subjects": {
"type": "text", "type": "text",
"fields": { "fields": {
"keyword": { "keyword": {
"type": "keyword", "type": "keyword",
@ -116,8 +116,7 @@
}, },
"publisher_place": { "publisher_place": {
"type": "text" "type": "text"
}, },
"geo_location": { "geo_location": {
"type": "geo_shape", "type": "geo_shape",
"tree": "quadtree", "tree": "quadtree",
@ -136,8 +135,6 @@
"type": "float" "type": "float"
}, },
"status": { "status": {
"type": "keyword" "type": "keyword"
} }

30
readme.md
View File

@ -3,15 +3,16 @@
Welcome to the Tethys Research Repository Backend System! This is the backend component responsible for managing datasets, users, and the core functionality of the Tethys Data Research Repository. Welcome to the Tethys Research Repository Backend System! This is the backend component responsible for managing datasets, users, and the core functionality of the Tethys Data Research Repository.
## Table of Contents ## Table of Contents
- [Getting Started](#getting-started)
- [Prerequisites](#prerequisites) - [Getting Started](#getting-started)
- [Installation](#installation) - [Prerequisites](#prerequisites)
- [Usage](#usage) - [Installation](#installation)
- [Configuration](#configuration) - [Usage](#usage)
- [Database](#database) - [Configuration](#configuration)
- [API Documentation](#api-documentation) - [Database](#database)
- [Contributing](#contributing) - [API Documentation](#api-documentation)
- [License](#license) - [Contributing](#contributing)
- [License](#license)
## Getting Started ## Getting Started
@ -19,13 +20,14 @@ Welcome to the Tethys Research Repository Backend System! This is the backend co
Before you begin, ensure you have met the following requirements: Before you begin, ensure you have met the following requirements:
- Node.js and npm installed on your development machine. - Node.js and npm installed on your development machine.
- A running PostgreSQL database instance. - A running PostgreSQL database instance.
- AdonisJS CLI globally installed. - AdonisJS CLI globally installed.
### Installation ### Installation
1. Clone this repository: 1. Clone this repository:
```bash ```bash
git clone https://gitea.geologie.ac.at/geolba/tethys.backend.git git clone https://gitea.geologie.ac.at/geolba/tethys.backend.git
```

26
resources/js/Components/Admin/MenuItemList.vue
View File

@ -1,11 +1,8 @@
<script setup> <script setup>
import { Link } from "@inertiajs/vue3" import { Link } from '@inertiajs/vue3';
import BaseButton from "@/Components/BaseButton.vue" import BaseButton from '@/Components/BaseButton.vue';
import BaseButtons from "@/Components/BaseButtons.vue" import BaseButtons from '@/Components/BaseButtons.vue';
import { import { mdiSquareEditOutline, mdiTrashCan } from '@mdi/js';
mdiSquareEditOutline,
mdiTrashCan,
} from "@mdi/js"
const props = defineProps({ const props = defineProps({
item: { item: {
@ -22,9 +19,9 @@ const props = defineProps({
}, },
level: { level: {
type: Number, type: Number,
default: 0 default: 0,
}, },
}) });
</script> </script>
<template> <template>
@ -40,8 +37,13 @@ const props = defineProps({
</td> </td>
<td v-if="can.edit || can.delete" class="before:hidden lg:w-1 whitespace-nowrap"> <td v-if="can.edit || can.delete" class="before:hidden lg:w-1 whitespace-nowrap">
<BaseButtons type="justify-start lg:justify-end" no-wrap> <BaseButtons type="justify-start lg:justify-end" no-wrap>
<BaseButton v-if="can.edit" :route-name="route('menu.item.edit', { menu: menu.id, item: item.id })" <BaseButton
color="info" :icon="mdiSquareEditOutline" small /> v-if="can.edit"
:route-name="route('menu.item.edit', { menu: menu.id, item: item.id })"
color="info"
:icon="mdiSquareEditOutline"
small
/>
<BaseButton v-if="can.delete" color="danger" :icon="mdiTrashCan" small @click="destroy(item.id)" /> <BaseButton v-if="can.delete" color="danger" :icon="mdiTrashCan" small @click="destroy(item.id)" />
</BaseButtons> </BaseButtons>
</td> </td>
@ -49,4 +51,4 @@ const props = defineProps({
<template v-for="item in item.children"> <template v-for="item in item.children">
<MenuItemList :item="item" :menu="menu" :can="can" :level="level + 1" /> <MenuItemList :item="item" :menu="menu" :can="can" :level="level + 1" />
</template> </template>
</template> </template>

91
resources/js/Components/Admin/Pagination.vue
View File

@ -59,24 +59,33 @@ total:
<template> <template>
<!-- <nav v-if="data.links.length > 3" --> <!-- <nav v-if="data.links.length > 3" -->
<nav v-if="data.total > 3" role="navigation" aria-label="Pagination Navigation" <nav v-if="data.total > 3" role="navigation" aria-label="Pagination Navigation" class="flex items-center justify-between">
class="flex items-center justify-between">
<div class="flex justify-between flex-1 sm:hidden"> <div class="flex justify-between flex-1 sm:hidden">
<span v-if="data.current_page <= 1" <span
class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default leading-5 rounded-md"> v-if="data.current_page <= 1"
class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default leading-5 rounded-md"
>
Previous Previous
</span> </span>
<Link v-else :href="data.previous_page_url" <Link
class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150"> v-else
Previous :href="data.previous_page_url"
class="relative inline-flex items-center px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150"
>
Previous
</Link> </Link>
<Link v-if="data.current_page < data.last_page" :href="data.next_page_url" <Link
class="relative inline-flex items-center px-4 py-2 ml-3 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150"> v-if="data.current_page < data.last_page"
Next :href="data.next_page_url"
class="relative inline-flex items-center px-4 py-2 ml-3 text-sm font-medium text-gray-700 bg-white border border-gray-300 leading-5 rounded-md hover:text-gray-500 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-700 transition ease-in-out duration-150"
>
Next
</Link> </Link>
<span v-else <span
class="relative inline-flex items-center px-4 py-2 ml-3 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default leading-5 rounded-md"> v-else
class="relative inline-flex items-center px-4 py-2 ml-3 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default leading-5 rounded-md"
>
Next Next
</span> </span>
</div> </div>
@ -99,24 +108,33 @@ total:
<span v-if="props.data.current_page <= 1" aria-disabled="true" aria-label="Previous"> <span v-if="props.data.current_page <= 1" aria-disabled="true" aria-label="Previous">
<span <span
class="relative inline-flex items-center px-2 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default rounded-l-md leading-5" class="relative inline-flex items-center px-2 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default rounded-l-md leading-5"
aria-hidden="true"> aria-hidden="true"
>
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" <path
fill-rule="evenodd"
d="M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z" d="M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z"
clip-rule="evenodd" /> clip-rule="evenodd"
/>
</svg> </svg>
</span> </span>
</span> </span>
<!-- <Link v-else :href="data.previous_page_url" rel="prev" --> <!-- <Link v-else :href="data.previous_page_url" rel="prev" -->
<Link v-else :href="prevPageLink" rel="prev" <Link
v-else
:href="prevPageLink"
rel="prev"
class="relative inline-flex items-center px-2 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 rounded-l-md leading-5 hover:text-gray-400 focus:z-10 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-500 transition ease-in-out duration-150" class="relative inline-flex items-center px-2 py-2 text-sm font-medium text-gray-500 bg-white border border-gray-300 rounded-l-md leading-5 hover:text-gray-400 focus:z-10 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-500 transition ease-in-out duration-150"
aria-label="Previous"> aria-label="Previous"
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20"> >
<path fill-rule="evenodd" <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
d="M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z" <path
clip-rule="evenodd" /> fill-rule="evenodd"
</svg> d="M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z"
clip-rule="evenodd"
/>
</svg>
</Link> </Link>
<!-- <template v-for="(link, key) in data.links"> <!-- <template v-for="(link, key) in data.links">
@ -133,24 +151,33 @@ total:
</template> </template>
</template> --> </template> -->
<Link v-if="props.data.current_page < props.data.last_page" :href="nextPageLink" rel="next" <Link
v-if="props.data.current_page < props.data.last_page"
:href="nextPageLink"
rel="next"
class="relative inline-flex items-center px-2 py-2 -ml-px text-sm font-medium text-gray-500 bg-white border border-gray-300 rounded-r-md leading-5 hover:text-gray-400 focus:z-10 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-500 transition ease-in-out duration-150" class="relative inline-flex items-center px-2 py-2 -ml-px text-sm font-medium text-gray-500 bg-white border border-gray-300 rounded-r-md leading-5 hover:text-gray-400 focus:z-10 focus:outline-none focus:ring ring-gray-300 focus:border-blue-300 active:bg-gray-100 active:text-gray-500 transition ease-in-out duration-150"
aria-label="Next"> aria-label="Next"
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20"> >
<path fill-rule="evenodd" <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" <path
clip-rule="evenodd" /> fill-rule="evenodd"
</svg> d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"
clip-rule="evenodd"
/>
</svg>
</Link> </Link>
<!-- else disabled link --> <!-- else disabled link -->
<span v-else aria-disabled="true" aria-label="Next"> <span v-else aria-disabled="true" aria-label="Next">
<span <span
class="relative inline-flex items-center px-2 py-2 -ml-px text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default rounded-r-md leading-5" class="relative inline-flex items-center px-2 py-2 -ml-px text-sm font-medium text-gray-500 bg-white border border-gray-300 cursor-default rounded-r-md leading-5"
aria-hidden="true"> aria-hidden="true"
>
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" <path
fill-rule="evenodd"
d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"
clip-rule="evenodd" /> clip-rule="evenodd"
/>
</svg> </svg>
</span> </span>
</span> </span>

98
resources/js/Components/Admin/Sort.vue
View File

@ -4,73 +4,59 @@ import { Link } from '@inertiajs/vue3';
import { stardust } from '@eidellev/adonis-stardust/client'; import { stardust } from '@eidellev/adonis-stardust/client';
const props = defineProps({ const props = defineProps({
label: { label: {
type: String, type: String,
default: '', default: '',
}, },
attribute: { attribute: {
type: String, type: String,
default: '', default: '',
}, },
search: { search: {
type: String, type: String,
default: '', default: '',
}, },
}); });
const downFill = ref('lightgray'); const downFill = ref('lightgray');
const upFill = ref('lightgray'); const upFill = ref('lightgray');
const sortLink = computed(() => { const sortLink = computed(() => {
let url = new URL(document.location); let url = new URL(document.location);
let sortValue = url.searchParams.get('sort'); let sortValue = url.searchParams.get('sort');
if (sortValue == props.attribute) { if (sortValue == props.attribute) {
url.searchParams.set('sort', '-' + props.attribute); url.searchParams.set('sort', '-' + props.attribute);
upFill.value = 'black'; upFill.value = 'black';
} else if (sortValue === '-' + props.attribute) { } else if (sortValue === '-' + props.attribute) {
url.searchParams.set('sort', props.attribute); url.searchParams.set('sort', props.attribute);
downFill.value = 'black'; downFill.value = 'black';
} else { } else {
url.searchParams.set('sort', props.attribute); url.searchParams.set('sort', props.attribute);
} }
if (props.search == '') { if (props.search == '') {
url.searchParams.delete('search'); url.searchParams.delete('search');
} else { } else {
url.searchParams.set('search', props.search); url.searchParams.set('search', props.search);
} }
return url.href; return url.href;
}); });
</script> </script>
<template> <template>
<div class="flex items-center gap-4"> <div class="flex items-center gap-4">
<Link :href="sortLink" class="no-underline hover:underline text-cyan-600 dark:text-cyan-400"> <Link :href="sortLink" class="no-underline hover:underline text-cyan-600 dark:text-cyan-400">
{{ label }} {{ label }}
</Link> </Link>
<div class="flex flex-col"> <div class="flex flex-col">
<svg <svg class="inline-block" xmlns="http://www.w3.org/2000/svg" width="15px" height="15px" viewBox="0 0 15 15" fill="none">
class="inline-block" <path d="M7.5 3L15 11H0L7.5 3Z" :fill="upFill" />
xmlns="http://www.w3.org/2000/svg" </svg>
width="15px" <svg class="inline-block" xmlns="http://www.w3.org/2000/svg" width="15px" height="15px" viewBox="0 0 15 15" fill="none">
height="15px" <path d="M7.49988 12L-0.00012207 4L14.9999 4L7.49988 12Z" :fill="downFill" />
viewBox="0 0 15 15" </svg>
fill="none" </div>
> </div>
<path d="M7.5 3L15 11H0L7.5 3Z" :fill="upFill" />
</svg>
<svg
class="inline-block"
xmlns="http://www.w3.org/2000/svg"
width="15px"
height="15px"
viewBox="0 0 15 15"
fill="none"
>
<path d="M7.49988 12L-0.00012207 4L14.9999 4L7.49988 12Z" :fill="downFill" />
</svg>
</div>
</div>
</template> </template>

20
resources/js/Components/AsideMenu.vue
View File

@ -3,7 +3,7 @@
// import { usePage } from '@inertiajs/vue3' // import { usePage } from '@inertiajs/vue3'
// import { usePage } from '@inertiajs/inertia-vue3'; // import { usePage } from '@inertiajs/inertia-vue3';
import { LayoutService } from '@/Stores/layout'; import { LayoutService } from '@/Stores/layout';
import menu from '@/menu' import menu from '@/menu';
import AsideMenuLayer from '@/Components/AsideMenuLayer.vue'; import AsideMenuLayer from '@/Components/AsideMenuLayer.vue';
import OverlayLayer from '@/Components/OverlayLayer.vue'; import OverlayLayer from '@/Components/OverlayLayer.vue';
@ -14,15 +14,15 @@ const layoutService = LayoutService();
</script> </script>
<template> <template>
<AsideMenuLayer <AsideMenuLayer
v-if="menu && Object.keys(menu).length" v-if="menu && Object.keys(menu).length"
:menu="menu" :menu="menu"
:class="[ :class="[
layoutService.isAsideMobileExpanded ? 'left-0' : '-left-60 lg:left-0', layoutService.isAsideMobileExpanded ? 'left-0' : '-left-60 lg:left-0',
{ 'lg:hidden xl:flex': !layoutService.isAsideLgActive }, { 'lg:hidden xl:flex': !layoutService.isAsideLgActive },
]" ]"
/> />
<!-- <OverlayLayer <!-- <OverlayLayer
v-show="layoutService.isAsideLgActive" v-show="layoutService.isAsideLgActive"
z-index="z-30" z-index="z-30"
@overlay-click="layoutService.isAsideLgActive = false" @overlay-click="layoutService.isAsideLgActive = false"

104
resources/js/Components/AsideMenuItem.vue
View File

@ -11,14 +11,14 @@ import AsideMenuList from '@/Components/AsideMenuList.vue';
import { stardust } from '@eidellev/adonis-stardust/client'; import { stardust } from '@eidellev/adonis-stardust/client';
const props = defineProps({ const props = defineProps({
item: { item: {
type: Object, type: Object,
required: true, required: true,
}, },
isDropdownList: Boolean, isDropdownList: Boolean,
}); });
const itemRoute = computed(() => (props.item && props.item.route ? stardust.route(props.item.route): '')); const itemRoute = computed(() => (props.item && props.item.route ? stardust.route(props.item.route) : ''));
// const isCurrentRoute = computed(() => (props.item && props.item.route ? stardust.isCurrent(props.item.route): false)); // const isCurrentRoute = computed(() => (props.item && props.item.route ? stardust.isCurrent(props.item.route): false));
const itemHref = computed(() => (props.item && props.item.href ? props.item.href : '')); const itemHref = computed(() => (props.item && props.item.href ? props.item.href : ''));
@ -31,64 +31,74 @@ const hasColor = computed(() => props.item && props.item.color);
const isDropdownActive = ref(false); const isDropdownActive = ref(false);
const componentClass = computed(() => [ const componentClass = computed(() => [
props.isDropdownList ? 'py-3 px-6 text-sm font-semibold' : 'py-3 px-6', props.isDropdownList ? 'py-3 px-6 text-sm font-semibold' : 'py-3 px-6',
hasColor.value ? getButtonColor(props.item.color, false, true) : styleService.asideMenuItemStyle, hasColor.value ? getButtonColor(props.item.color, false, true) : styleService.asideMenuItemStyle,
]); ]);
const hasDropdown = computed(() => props.item.children); const hasDropdown = computed(() => props.item.children);
const menuClick = (event) => { const menuClick = (event) => {
emit('menu-click', event, props.item); emit('menu-click', event, props.item);
if (hasDropdown.value) { if (hasDropdown.value) {
isDropdownActive.value = !isDropdownActive.value; isDropdownActive.value = !isDropdownActive.value;
} }
}; };
const activeInactiveStyle = computed(() => { const activeInactiveStyle = computed(() => {
if (props.item.route && stardust.isCurrent(props.item.route)) { if (props.item.route && stardust.isCurrent(props.item.route)) {
// console.log(props.item.route); // console.log(props.item.route);
return styleService.asideMenuItemActiveStyle; return styleService.asideMenuItemActiveStyle;
} } else {
else { return null;
return null; }
}
}); });
const is = computed(() => { const is = computed(() => {
if (props.item.href) { if (props.item.href) {
return 'a' return 'a';
} }
if (props.item.route) { if (props.item.route) {
return Link return Link;
} }
return 'div' return 'div';
}) });
// props.routeName && stardust.isCurrent(props.routeName) ? props.activeColor : null // props.routeName && stardust.isCurrent(props.routeName) ? props.activeColor : null
</script> </script>
<!-- :target="props.item.target ?? null" --> <!-- :target="props.item.target ?? null" -->
<template> <template>
<li> <li>
<!-- <component :is="itemHref ? 'div' : Link" :href="itemHref ? itemHref : itemRoute" --> <!-- <component :is="itemHref ? 'div' : Link" :href="itemHref ? itemHref : itemRoute" -->
<component :is="is" :href="itemRoute ? stardust.route(props.item.route) : props.item.href" <component
class="flex cursor-pointer dark:text-slate-300 dark:hover:text-white" :class="componentClass" :is="is"
@click="menuClick" v-bind:target="props.item.target ?? null"> :href="itemRoute ? stardust.route(props.item.route) : props.item.href"
<BaseIcon v-if="item.icon" :path="item.icon" class="flex-none" :class="activeInactiveStyle" w="w-16" class="flex cursor-pointer dark:text-slate-300 dark:hover:text-white"
:size="18" /> :class="componentClass"
<span class="grow text-ellipsis line-clamp-1" :class="activeInactiveStyle"> @click="menuClick"
{{ item.label }} v-bind:target="props.item.target ?? null"
</span> >
<!-- plus icon for expanding sub menu --> <BaseIcon v-if="item.icon" :path="item.icon" class="flex-none" :class="activeInactiveStyle" w="w-16" :size="18" />
<BaseIcon v-if="hasDropdown" :path="isDropdownActive ? mdiMinus : mdiPlus" class="flex-none" <span class="grow text-ellipsis line-clamp-1" :class="activeInactiveStyle">
:class="activeInactiveStyle" w="w-12" @click.prevent="menuClick"/> {{ item.label }}
</component> </span>
<AsideMenuList v-if="hasDropdown" :menu="item.children" :class="[ <!-- plus icon for expanding sub menu -->
styleService.asideMenuDropdownStyle, <BaseIcon
isDropdownActive ? 'block dark:bg-slate-800/50' : 'hidden', v-if="hasDropdown"
]" is-dropdown-list /> :path="isDropdownActive ? mdiMinus : mdiPlus"
</li> class="flex-none"
:class="activeInactiveStyle"
w="w-12"
@click.prevent="menuClick"
/>
</component>
<AsideMenuList
v-if="hasDropdown"
:menu="item.children"
:class="[styleService.asideMenuDropdownStyle, isDropdownActive ? 'block dark:bg-slate-800/50' : 'hidden']"
is-dropdown-list
/>
</li>
</template> </template>

69
resources/js/Components/AsideMenuLayer.vue
View File

@ -1,5 +1,5 @@
<script setup> <script setup>
import { router } from '@inertiajs/vue3' import { router } from '@inertiajs/vue3';
// import { Inertia } from '@inertiajs/inertia'; // import { Inertia } from '@inertiajs/inertia';
import { stardust } from '@eidellev/adonis-stardust/client'; import { stardust } from '@eidellev/adonis-stardust/client';
import { mdiLogout, mdiClose } from '@mdi/js'; import { mdiLogout, mdiClose } from '@mdi/js';
@ -11,10 +11,10 @@ import AsideMenuItem from '@/Components/AsideMenuItem.vue';
import BaseIcon from '@/Components/BaseIcon.vue'; import BaseIcon from '@/Components/BaseIcon.vue';
defineProps({ defineProps({
menu: { menu: {
type: Object, type: Object,
default: () => { }, default: () => {},
}, },
}); });
const emit = defineEmits(['menu-click']); const emit = defineEmits(['menu-click']);
@ -24,43 +24,44 @@ const layoutStore = LayoutService();
const styleStore = StyleService(); const styleStore = StyleService();
const logoutItem = computed(() => ({ const logoutItem = computed(() => ({
name: 'Logout', name: 'Logout',
label: 'Logout', label: 'Logout',
icon: mdiLogout, icon: mdiLogout,
color: 'info', color: 'info',
link: '#', link: '#',
})); }));
const logoutItemClick = async () => { const logoutItemClick = async () => {
// router.post(route('logout')); // router.post(route('logout'));
await router.post(stardust.route('logout')); await router.post(stardust.route('logout'));
}; };
const menuClick = (event, item) => { const menuClick = (event, item) => {
emit('menu-click', event, item); emit('menu-click', event, item);
}; };
</script> </script>
<template> <template>
<aside id="aside" class="lg:py-2 lg:pl-2 w-60 fixed flex z-40 top-0 h-screen transition-position overflow-hidden"> <aside id="aside" class="lg:py-2 lg:pl-2 w-60 fixed flex z-40 top-0 h-screen transition-position overflow-hidden">
<div :class="styleStore.asideStyle" class="lg:rounded-xl flex-1 flex flex-col overflow-hidden dark:bg-slate-900"> <div :class="styleStore.asideStyle" class="lg:rounded-xl flex-1 flex flex-col overflow-hidden dark:bg-slate-900">
<div :class="styleStore.asideBrandStyle" <div :class="styleStore.asideBrandStyle" class="flex flex-row h-14 items-center justify-between dark:bg-slate-900">
class="flex flex-row h-14 items-center justify-between dark:bg-slate-900"> <div class="text-center flex-1 lg:text-left lg:pl-6 xl:text-center xl:pl-0">
<div class="text-center flex-1 lg:text-left lg:pl-6 xl:text-center xl:pl-0"> <b class="font-black">Menu</b>
<b class="font-black">Menu</b> </div>
</div> <button class="hidden lg:inline-block xl:hidden p-3" @click.prevent="layoutStore.isAsideLgActive = false">
<button class="hidden lg:inline-block xl:hidden p-3" @click.prevent="layoutStore.isAsideLgActive = false"> <BaseIcon :path="mdiClose" />
<BaseIcon :path="mdiClose" /> </button>
</button> </div>
</div> <div
<div :class="styleStore.darkMode ? 'aside-scrollbars-[slate]' : styleStore.asideScrollbarsStyle" :class="styleStore.darkMode ? 'aside-scrollbars-[slate]' : styleStore.asideScrollbarsStyle"
class="flex-1 overflow-y-auto overflow-x-hidden"> class="flex-1 overflow-y-auto overflow-x-hidden"
<AsideMenuList v-bind:menu="menu" @menu-click="menuClick" /> >
</div> <AsideMenuList v-bind:menu="menu" @menu-click="menuClick" />
<!-- <p class="menu-label">About</p>> --> </div>
<ul class="menu-list"> <!-- <p class="menu-label">About</p>> -->
<AsideMenuItem :item="logoutItem" @menu-click="logoutItemClick" /> <ul class="menu-list">
</ul> <AsideMenuItem :item="logoutItem" @menu-click="logoutItemClick" />
</div> </ul>
</aside> </div>
</aside>
</template> </template>

172
resources/js/Components/BaseButton.vue
View File

@ -6,112 +6,112 @@ import { getButtonColor } from '@/colors.js';
import BaseIcon from '@/Components/BaseIcon.vue'; import BaseIcon from '@/Components/BaseIcon.vue';
const props = defineProps({ const props = defineProps({
label: { label: {
type: [String, Number], type: [String, Number],
default: null, default: null,
}, },
icon: { icon: {
type: String, type: String,
default: null, default: null,
}, },
href: { href: {
type: String, type: String,
default: null, default: null,
}, },
target: { target: {
type: String, type: String,
default: null, default: null,
}, },
routeName: { routeName: {
type: String, type: String,
default: null, default: null,
}, },
type: { type: {
type: String, type: String,
default: null, default: null,
}, },
color: { color: {
type: String, type: String,
default: 'white', default: 'white',
}, },
as: { as: {
type: String, type: String,
default: null, default: null,
}, },
small: Boolean, small: Boolean,
outline: Boolean, outline: Boolean,
active: Boolean, active: Boolean,
disabled: Boolean, disabled: Boolean,
roundedFull: Boolean, roundedFull: Boolean,
}); });
const is = computed(() => { const is = computed(() => {
if (props.as) { if (props.as) {
return props.as; return props.as;
} }
if (props.routeName) { if (props.routeName) {
return Link; return Link;
} }
if (props.href) { if (props.href) {
return 'a'; return 'a';
} }
return 'button'; return 'button';
}); });
const computedType = computed(() => { const computedType = computed(() => {
if (is.value === 'button') { if (is.value === 'button') {
return props.type ?? 'button'; return props.type ?? 'button';
} }
return null; return null;
}); });
const labelClass = computed(() => (props.small && props.icon ? 'px-1' : 'px-2')); const labelClass = computed(() => (props.small && props.icon ? 'px-1' : 'px-2'));
const componentClass = computed(() => { const componentClass = computed(() => {
const base = [ const base = [
'inline-flex', 'inline-flex',
'cursor-pointer', 'cursor-pointer',
'justify-center', 'justify-center',
'items-center', 'items-center',
'whitespace-nowrap', 'whitespace-nowrap',
'focus:outline-none', 'focus:outline-none',
'transition-colors', 'transition-colors',
'focus:ring-2', 'focus:ring-2',
'duration-150', 'duration-150',
'border', 'border',
props.roundedFull ? 'rounded-full' : 'rounded', props.roundedFull ? 'rounded-full' : 'rounded',
props.active ? 'ring ring-black dark:ring-white' : 'ring-blue-700', props.active ? 'ring ring-black dark:ring-white' : 'ring-blue-700',
getButtonColor(props.color, props.outline, !props.disabled), getButtonColor(props.color, props.outline, !props.disabled),
]; ];
if (props.small) { if (props.small) {
base.push('text-sm', props.roundedFull ? 'px-3 py-1' : 'p-1'); base.push('text-sm', props.roundedFull ? 'px-3 py-1' : 'p-1');
} else { } else {
base.push('py-2', props.roundedFull ? 'px-6' : 'px-3'); base.push('py-2', props.roundedFull ? 'px-6' : 'px-3');
} }
if (props.disabled) { if (props.disabled) {
base.push('cursor-not-allowed', props.outline ? 'opacity-50' : 'opacity-70'); base.push('cursor-not-allowed', props.outline ? 'opacity-50' : 'opacity-70');
} }
return base; return base;
}); });
</script> </script>
<template> <template>
<component <component
:is="is" :is="is"
:class="componentClass" :class="componentClass"
:href="routeName ? routeName : href" :href="routeName ? routeName : href"
:type="computedType" :type="computedType"
:target="target" :target="target"
:disabled="disabled" :disabled="disabled"
> >
<BaseIcon v-if="icon" :path="icon" /> <BaseIcon v-if="icon" :path="icon" />
<span v-if="label" :class="labelClass">{{ label }}</span> <span v-if="label" :class="labelClass">{{ label }}</span>
</component> </component>
</template> </template>

94
resources/js/Components/BaseButtons.vue
View File

@ -1,55 +1,51 @@
<script> <script>
import { h, defineComponent } from 'vue' import { h, defineComponent } from 'vue';
export default defineComponent({ export default defineComponent({
name: 'BaseButtons', name: 'BaseButtons',
props: { props: {
noWrap: Boolean, noWrap: Boolean,
type: { type: {
type: String, type: String,
default: 'justify-start' default: 'justify-start',
},
classAddon: {
type: String,
default: 'mr-3 last:mr-0 mb-3',
},
mb: {
type: String,
default: '-mb-3',
},
}, },
classAddon: { render() {
type: String, const hasSlot = this.$slots && this.$slots.default;
default: 'mr-3 last:mr-0 mb-3'
const parentClass = ['flex', 'items-center', this.type, this.noWrap ? 'flex-nowrap' : 'flex-wrap'];
if (this.mb) {
parentClass.push(this.mb);
}
return h(
'div',
{ class: parentClass },
hasSlot
? this.$slots.default().map((element) => {
if (element && element.children && typeof element.children === 'object') {
return h(
element,
{},
element.children.map((child) => {
return h(child, { class: [this.classAddon] });
}),
);
}
return h(element, { class: [this.classAddon] });
})
: null,
);
}, },
mb: { });
type: String,
default: '-mb-3'
}
},
render () {
const hasSlot = this.$slots && this.$slots.default
const parentClass = [
'flex',
'items-center',
this.type,
this.noWrap ? 'flex-nowrap' : 'flex-wrap'
]
if (this.mb) {
parentClass.push(this.mb)
}
return h(
'div',
{ class: parentClass },
hasSlot
? this.$slots.default().map(element => {
if (element && element.children && typeof element.children === 'object') {
return h(
element,
{},
element.children.map(child => {
return h(child, { class: [this.classAddon] })
}))
}
return h(element, { class: [this.classAddon] })
})
: null
)
}
})
</script> </script>

12
resources/js/Components/BaseDivider.vue
View File

@ -1,12 +1,12 @@
<script setup> <script setup>
const props = defineProps({ const props = defineProps({
navBar: Boolean navBar: Boolean,
}) });
</script> </script>
<template> <template>
<hr <hr
:class="props.navBar ? 'hidden lg:block lg:my-0.5 dark:border-slate-700' : 'my-6 -mx-6 dark:border-slate-800'" :class="props.navBar ? 'hidden lg:block lg:my-0.5 dark:border-slate-700' : 'my-6 -mx-6 dark:border-slate-800'"
class="border-t border-gray-100" class="border-t border-gray-100"
> />
</template> </template>

54
resources/js/Components/BaseIcon.vue
View File

@ -2,39 +2,31 @@
import { computed } from 'vue'; import { computed } from 'vue';
const props = defineProps({ const props = defineProps({
path: { path: {
type: String, type: String,
required: true required: true,
}, },
w: { w: {
type: String, type: String,
default: 'w-6' default: 'w-6',
}, },
h: { h: {
type: String, type: String,
default: 'h-6' default: 'h-6',
}, },
size: { size: {
type: [String, Number], type: [String, Number],
default: 16 default: 16,
} },
}) });
const spanClass = computed(() => `inline-flex justify-center items-center ${props.w} ${props.h}`) const spanClass = computed(() => `inline-flex justify-center items-center ${props.w} ${props.h}`);
</script> </script>
<template> <template>
<span :class="spanClass"> <span :class="spanClass">
<svg <svg viewBox="0 0 24 24" :width="size" :height="size" class="inline-block">
viewBox="0 0 24 24" <path fill="currentColor" :d="path" />
:width="size" </svg>
:height="size" </span>
class="inline-block"
>
<path
fill="currentColor"
:d="path"
/>
</svg>
</span>
</template> </template>

160
resources/js/Components/CardBoxClient.vue
View File

@ -1,101 +1,89 @@
<script setup> <script setup>
import { computed } from 'vue' import { computed } from 'vue';
import { mdiTrendingDown, mdiTrendingUp, mdiTrendingNeutral } from '@mdi/js' import { mdiTrendingDown, mdiTrendingUp, mdiTrendingNeutral } from '@mdi/js';
import CardBox from '@/Components/CardBox.vue' import CardBox from '@/Components/CardBox.vue';
import BaseLevel from '@/Components/BaseLevel.vue' import BaseLevel from '@/Components/BaseLevel.vue';
import PillTag from '@/Components/PillTag.vue' import PillTag from '@/Components/PillTag.vue';
import UserAvatar from '@/Components/UserAvatar.vue' import UserAvatar from '@/Components/UserAvatar.vue';
const props = defineProps({ const props = defineProps({
name: { name: {
type: String, type: String,
required: true required: true,
}, },
login: { login: {
type: String, type: String,
required: false required: false,
}, },
email: { email: {
type: String, type: String,
required: false required: false,
}, },
date: { date: {
type: String, type: String,
required: false required: false,
}, },
progress: { progress: {
type: Number, type: Number,
default: 0 default: 0,
}, },
text: { text: {
type: String, type: String,
default: null default: null,
}, },
type: { type: {
type: String, type: String,
default: null default: null,
} },
}) });
const pillType = computed(() => { const pillType = computed(() => {
if (props.type) { if (props.type) {
return props.type return props.type;
}
if (props.progress) {
if (props.progress >= 60) {
return 'success'
}
if (props.progress >= 40) {
return 'warning'
} }
return 'danger' if (props.progress) {
} if (props.progress >= 60) {
return 'success';
}
if (props.progress >= 40) {
return 'warning';
}
return 'info' return 'danger';
}) }
return 'info';
});
const pillIcon = computed(() => { const pillIcon = computed(() => {
return { return {
success: mdiTrendingUp, success: mdiTrendingUp,
warning: mdiTrendingNeutral, warning: mdiTrendingNeutral,
danger: mdiTrendingDown, danger: mdiTrendingDown,
info: mdiTrendingNeutral, info: mdiTrendingNeutral,
}[pillType.value] }[pillType.value];
}) });
const pillText = computed(() => props.text ?? `${props.progress}%`) const pillText = computed(() => props.text ?? `${props.progress}%`);
</script> </script>
<template> <template>
<CardBox <CardBox class="mb-6 last:mb-0" hoverable>
class="mb-6 last:mb-0" <BaseLevel>
hoverable <BaseLevel type="justify-start">
> <UserAvatar class="w-12 h-12 mr-6" :username="props.name" />
<BaseLevel> <div class="text-center md:text-left overflow-hidden">
<BaseLevel type="justify-start"> <h4 class="text-xl text-ellipsis">
<UserAvatar {{ name }}
class="w-12 h-12 mr-6" </h4>
:username="props.name" <p class="text-gray-500 dark:text-slate-400">
/> <!-- {{ date }} @ {{ login }} -->
<div class="text-center md:text-left overflow-hidden"> {{ email }}
<h4 class="text-xl text-ellipsis "> </p>
{{ name }} </div>
</h4> </BaseLevel>
<p class="text-gray-500 dark:text-slate-400"> <PillTag :type="pillType" :text="pillText" small :icon="pillIcon" />
<!-- {{ date }} @ {{ login }} --> </BaseLevel>
{{ email }} </CardBox>
</p>
</div>
</BaseLevel>
<PillTag
:type="pillType"
:text="pillText"
small
:icon="pillIcon"
/>
</BaseLevel>
</CardBox>
</template> </template>

9
resources/js/Components/CardBoxModal.vue
View File

@ -30,8 +30,8 @@ const props = defineProps({
}, },
deleteId: { deleteId: {
type: Number, type: Number,
default: null default: null,
} },
}); });
const emit = defineEmits(['update:modelValue', 'cancel', 'confirm']); const emit = defineEmits(['update:modelValue', 'cancel', 'confirm']);
@ -43,13 +43,12 @@ const value = computed({
// mode = cancel or confirm // mode = cancel or confirm
const confirmCancel = (mode) => { const confirmCancel = (mode) => {
value.value = false;//close value.value = false; //close
if (props.deleteId){ if (props.deleteId) {
emit(mode, props.deleteId); emit(mode, props.deleteId);
} else { } else {
emit(mode); emit(mode);
} }
}; };
const confirm = () => confirmCancel('confirm'); const confirm = () => confirmCancel('confirm');

157
resources/js/Components/CardBoxTransaction.vue
View File

@ -1,96 +1,83 @@
<script setup> <script setup>
import { computed } from 'vue' import { computed } from 'vue';
import { mdiCashMinus, mdiCashPlus, mdiReceipt, mdiCreditCardOutline } from '@mdi/js' import { mdiCashMinus, mdiCashPlus, mdiReceipt, mdiCreditCardOutline } from '@mdi/js';
import CardBox from '@/Components/CardBox.vue' import CardBox from '@/Components/CardBox.vue';
import BaseLevel from '@/Components/BaseLevel.vue' import BaseLevel from '@/Components/BaseLevel.vue';
import PillTag from '@/Components/PillTag.vue' import PillTag from '@/Components/PillTag.vue';
import IconRounded from '@/Components/IconRounded.vue' import IconRounded from '@/Components/IconRounded.vue';
const props = defineProps({ const props = defineProps({
amount: { amount: {
type: Number, type: Number,
required: true required: true,
}, },
date: { date: {
type: String, type: String,
required: true required: true,
}, },
business: { business: {
type: String, type: String,
required: true required: true,
}, },
type: { type: {
type: String, type: String,
required: true required: true,
}, },
name: { name: {
type: String, type: String,
required: true required: true,
}, },
account: { account: {
type: String, type: String,
required: true required: true,
} },
}) });
const icon = computed(() => { const icon = computed(() => {
if (props.type === 'withdrawal') { if (props.type === 'withdrawal') {
return { return {
icon: mdiCashMinus, icon: mdiCashMinus,
type: 'danger' type: 'danger',
};
} else if (props.type === 'deposit') {
return {
icon: mdiCashPlus,
type: 'success',
};
} else if (props.type === 'invoice') {
return {
icon: mdiReceipt,
type: 'warning',
};
} }
} else if (props.type === 'deposit') {
return {
icon: mdiCashPlus,
type: 'success'
}
} else if (props.type === 'invoice') {
return {
icon: mdiReceipt,
type: 'warning'
}
}
return { return {
icon: mdiCreditCardOutline, icon: mdiCreditCardOutline,
type: 'info' type: 'info',
} };
}) });
</script> </script>
<template> <template>
<CardBox <CardBox class="mb-6 last:mb-0" hoverable>
class="mb-6 last:mb-0" <BaseLevel>
hoverable <BaseLevel type="justify-start">
> <IconRounded :icon="icon.icon" :type="icon.type" class="md:mr-6" />
<BaseLevel> <div class="text-center space-y-1 md:text-left md:mr-6">
<BaseLevel type="justify-start"> <h4 class="text-xl">${{ amount }}</h4>
<IconRounded <p class="text-gray-500 dark:text-slate-400">
:icon="icon.icon" <b>{{ date }}</b> via {{ business }}
:type="icon.type" </p>
class="md:mr-6" </div>
/> </BaseLevel>
<div class="text-center space-y-1 md:text-left md:mr-6"> <div class="text-center md:text-right space-y-2">
<h4 class="text-xl"> <p class="text-sm text-gray-500">
${{ amount }} {{ name }}
</h4> </p>
<p class="text-gray-500 dark:text-slate-400"> <div>
<b>{{ date }}</b> via {{ business }} <PillTag :type="icon.type" :text="type" small />
</p> </div>
</div> </div>
</BaseLevel> </BaseLevel>
<div class="text-center md:text-right space-y-2"> </CardBox>
<p class="text-sm text-gray-500">
{{ name }}
</p>
<div>
<PillTag
:type="icon.type"
:text="type"
small
/>
</div>
</div>
</BaseLevel>
</CardBox>
</template> </template>

114
resources/js/Components/CardBoxWidget.vue
View File

@ -1,64 +1,64 @@
<script setup> <script setup>
import { mdiCog } from '@mdi/js' import { mdiCog } from '@mdi/js';
import CardBox from '@/Components/CardBox.vue' import CardBox from '@/Components/CardBox.vue';
import NumberDynamic from '@/Components/NumberDynamic.vue' import NumberDynamic from '@/Components/NumberDynamic.vue';
import BaseIcon from '@/Components/BaseIcon.vue' import BaseIcon from '@/Components/BaseIcon.vue';
import BaseLevel from '@/Components/BaseLevel.vue' import BaseLevel from '@/Components/BaseLevel.vue';
import PillTagTrend from '@/Components/PillTagTrend.vue' import PillTagTrend from '@/Components/PillTagTrend.vue';
import BaseButton from '@/Components/BaseButton.vue' import BaseButton from '@/Components/BaseButton.vue';
defineProps({ defineProps({
number: { number: {
type: Number, type: Number,
default: 0 default: 0,
}, },
icon: { icon: {
type: String, type: String,
default: null default: null,
}, },
prefix: { prefix: {
type: String, type: String,
default: null default: null,
}, },
suffix: { suffix: {
type: String, type: String,
default: null default: null,
}, },
label: { label: {
type: String, type: String,
default: null default: null,
}, },
color: { color: {
type: String, type: String,
default: null default: null,
}, },
trend: { trend: {
type: String, type: String,
default: null default: null,
}, },
trendType: { trendType: {
type: String, type: String,
default: null default: null,
} },
}) });
</script> </script>
<template> <template>
<CardBox> <CardBox>
<BaseLevel v-if="trend" class="mb-3" mobile> <BaseLevel v-if="trend" class="mb-3" mobile>
<PillTagTrend :trend="trend" :trend-type="trendType" small /> <PillTagTrend :trend="trend" :trend-type="trendType" small />
<BaseButton :icon="mdiCog" icon-w="w-4" icon-h="h-4" color="white" small /> <BaseButton :icon="mdiCog" icon-w="w-4" icon-h="h-4" color="white" small />
</BaseLevel> </BaseLevel>
<BaseLevel mobile> <BaseLevel mobile>
<div> <div>
<h3 class="text-lg leading-tight text-gray-500 dark:text-slate-400"> <h3 class="text-lg leading-tight text-gray-500 dark:text-slate-400">
{{ label }} {{ label }}
</h3> </h3>
<h1 class="text-3xl leading-tight font-semibold"> <h1 class="text-3xl leading-tight font-semibold">
<NumberDynamic :value="number" :prefix="prefix" :suffix="suffix" /> <NumberDynamic :value="number" :prefix="prefix" :suffix="suffix" />
</h1> </h1>
</div> </div>
<BaseIcon v-if="icon" :path="icon" size="48" w="" h="h-16" :class="color" /> <BaseIcon v-if="icon" :path="icon" size="48" w="" h="h-16" :class="color" />
</BaseLevel> </BaseLevel>
</CardBox> </CardBox>
</template> </template>

88
resources/js/Components/Charts/LineChart.vue
View File

@ -1,62 +1,54 @@
<script setup> <script setup>
import { ref, watch, computed, onMounted } from 'vue' import { ref, watch, computed, onMounted } from 'vue';
import { import { Chart, LineElement, PointElement, LineController, LinearScale, CategoryScale, Tooltip } from 'chart.js';
Chart,
LineElement,
PointElement,
LineController,
LinearScale,
CategoryScale,
Tooltip
} from 'chart.js'
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,
required: true required: true,
} },
}) });
const root = ref(null) const root = ref(null);
let chart let chart;
Chart.register(LineElement, PointElement, LineController, LinearScale, CategoryScale, Tooltip) Chart.register(LineElement, PointElement, LineController, LinearScale, CategoryScale, Tooltip);
onMounted(() => { onMounted(() => {
chart = new Chart(root.value, { chart = new Chart(root.value, {
type: 'line', type: 'line',
data: props.data, data: props.data,
options: { options: {
responsive: true, responsive: true,
maintainAspectRatio: false, maintainAspectRatio: false,
scales: { scales: {
y: { y: {
display: false display: false,
},
x: {
display: true,
},
},
plugins: {
legend: {
display: false,
},
},
}, },
x: { });
display: true });
}
}, const chartData = computed(() => props.data);
plugins: {
legend: { watch(chartData, (data) => {
display: false if (chart) {
} chart.data = data;
} chart.update();
} }
}) });
})
const chartData = computed(() => props.data)
watch(chartData, data => {
if (chart) {
chart.data = data
chart.update()
}
})
</script> </script>
<template> <template>
<canvas ref="root" /> <canvas ref="root" />
</template> </template>

35
resources/js/Components/FooterBar.vue
View File

@ -1,26 +1,25 @@
<script setup> <script setup>
import { computed } from 'vue' import { computed } from 'vue';
import { containerMaxW } from '@/config.js'; import { containerMaxW } from '@/config.js';
import BaseLevel from '@/Components/BaseLevel.vue' import BaseLevel from '@/Components/BaseLevel.vue';
import JustboilLogo from '@/Components/JustboilLogo.vue' import JustboilLogo from '@/Components/JustboilLogo.vue';
const year = computed(() => new Date().getFullYear()) const year = computed(() => new Date().getFullYear());
</script> </script>
<template> <template>
<footer class="py-2 px-6"> <footer class="py-2 px-6">
<BaseLevel :class="containerMaxW"> <BaseLevel :class="containerMaxW">
<div class="text-center md:text-left"> <div class="text-center md:text-left">
<b>&copy;{{ year }}, <a href="https://tethys.at/" target="_blank"> <b>&copy;{{ year }}, <a href="https://tethys.at/" target="_blank"> Tethys.at</a>.</b>
Tethys.at</a>.</b> <!-- Get more with <a href="https://tailwind-vue.justboil.me/" target="_blank" class="text-blue-600">Premium
<!-- Get more with <a href="https://tailwind-vue.justboil.me/" target="_blank" class="text-blue-600">Premium
version</a> --> version</a> -->
</div> </div>
<div class="md:py-3"> <div class="md:py-3">
<a href="https://www.tethys.at" target="_blank"> <a href="https://www.tethys.at" target="_blank">
<JustboilLogo class="w-auto h-8 md:h-6" /> <JustboilLogo class="w-auto h-8 md:h-6" />
</a> </a>
</div> </div>
</BaseLevel> </BaseLevel>
</footer> </footer>
</template> </template>

78
resources/js/Components/FormCheckRadio.vue
View File

@ -2,50 +2,42 @@
import { computed } from 'vue'; import { computed } from 'vue';
const props = defineProps({ const props = defineProps({
name: { name: {
type: String, type: String,
required: true required: true,
}, },
type: { type: {
type: String, type: String,
default: 'checkbox', default: 'checkbox',
validator: value => ['checkbox', 'radio', 'switch'].includes(value) validator: (value) => ['checkbox', 'radio', 'switch'].includes(value),
}, },
label: { label: {
type: String, type: String,
default: null default: null,
}, },
modelValue: { modelValue: {
type: [Array, String, Number, Boolean], type: [Array, String, Number, Boolean],
default: null default: null,
}, },
inputValue: { inputValue: {
type: [String, Number, Boolean], type: [String, Number, Boolean],
required: true required: true,
} },
}) });
const emit = defineEmits(['update:modelValue']) const emit = defineEmits(['update:modelValue']);
const computedValue = computed({ const computedValue = computed({
get: () => props.modelValue, get: () => props.modelValue,
set: value => { set: (value) => {
emit('update:modelValue', value) emit('update:modelValue', value);
} },
}) });
const inputType = computed(() => props.type === 'radio' ? 'radio' : 'checkbox') const inputType = computed(() => (props.type === 'radio' ? 'radio' : 'checkbox'));
</script> </script>
<template> <template>
<label <label :class="type" class="mr-6 mb-3 last:mr-0">
:class="type" <input v-model="computedValue" :type="inputType" :name="name" :value="inputValue" />
class="mr-6 mb-3 last:mr-0" <span class="check" />
> <span class="pl-2">{{ label }}</span>
<input </label>
v-model="computedValue" </template>
:type="inputType"
:name="name"
:value="inputValue"
>
<span class="check" />
<span class="pl-2">{{ label }}</span>
</label>
</template>

97
resources/js/Components/FormCheckRadioGroup.vue
View File

@ -1,57 +1,54 @@
<script setup> <script setup>
import { computed } from 'vue' import { computed } from 'vue';
import FormCheckRadio from '@/Components/FormCheckRadio.vue' import FormCheckRadio from '@/Components/FormCheckRadio.vue';
const props = defineProps({ const props = defineProps({
options: { options: {
type: Object, type: Object,
default: () => {} default: () => {},
}, },
name: { name: {
type: String, type: String,
required: true required: true,
}, },
type: { type: {
type: String, type: String,
default: 'checkbox', default: 'checkbox',
validator: value => ['checkbox', 'radio', 'switch'].includes(value) validator: (value) => ['checkbox', 'radio', 'switch'].includes(value),
}, },
componentClass: { componentClass: {
type: String, type: String,
default: null default: null,
}, },
isColumn: Boolean, isColumn: Boolean,
modelValue: { modelValue: {
type: [Array, String, Number, Boolean, Object], type: [Array, String, Number, Boolean, Object],
default: null default: null,
} },
}) });
const emit = defineEmits(['update:modelValue']) const emit = defineEmits(['update:modelValue']);
const computedValue = computed({ const computedValue = computed({
get: () => props.modelValue, get: () => props.modelValue,
set: value => { set: (value) => {
emit('update:modelValue', value) emit('update:modelValue', value);
} },
}) });
</script> </script>
<template> <template>
<div <div class="flex justify-start flex-wrap -mb-3" :class="{ 'flex-col': isColumn }">
class="flex justify-start flex-wrap -mb-3" <!-- :input-value="key" -->
:class="{ 'flex-col': isColumn }" <!-- :label="value" -->
> <!-- :input-value="value.id"
<!-- :input-value="key" -->
<!-- :label="value" -->
<!-- :input-value="value.id"
:label="value.name" --> :label="value.name" -->
<FormCheckRadio <FormCheckRadio
v-for="(value, key) in options" v-for="(value, key) in options"
:key="key" :key="key"
v-model="computedValue" v-model="computedValue"
:type="type" :type="type"
:name="name" :name="name"
:input-value="key" :input-value="key"
:label="value" :label="value"
:class="componentClass" :class="componentClass"
/> />
</div> </div>
</template> </template>

14
resources/js/Components/FormValidationErrors.vue
View File

@ -7,16 +7,16 @@ import NotificationBarInCard from '@/Components/NotificationBarInCard.vue';
// const hasErrors = computed(() => Object.keys(props.errors.value).length > 0); // const hasErrors = computed(() => Object.keys(props.errors.value).length > 0);
const props = defineProps({ const props = defineProps({
errors: Object, errors: Object,
}); });
const hasErrors = computed(() =>{ const hasErrors = computed(() => {
return props.errors != null && Object.keys(props.errors).length > 0; return props.errors != null && Object.keys(props.errors).length > 0;
}); });
</script> </script>
<template> <template>
<NotificationBarInCard v-if="hasErrors" color="danger"> <NotificationBarInCard v-if="hasErrors" color="danger">
<b>Whoops! Something went wrong.</b> <b>Whoops! Something went wrong.</b>
<span v-for="(error, key) in errors" :key="key">{{ error }}</span> <span v-for="(error, key) in errors" :key="key">{{ error }}</span>
</NotificationBarInCard> </NotificationBarInCard>
</template> </template>

17
resources/js/Components/Header.vue
View File

@ -1,6 +1,5 @@
<template> <template>
<div class="bg-slate-100 py-3 px-6 flex justify-between items-center mb-6"> <div class="bg-slate-100 py-3 px-6 flex justify-between items-center mb-6">
<div class="flex items-center space-x-6"> <div class="flex items-center space-x-6">
<h3 class="font-bold">AdonisJS InertiaJS Example</h3> <h3 class="font-bold">AdonisJS InertiaJS Example</h3>
<nav class="flex items-center text-sm"> <nav class="flex items-center text-sm">
@ -20,13 +19,13 @@ import { Link } from '@inertiajs/vue3';
// import DefaultLayout from '../Layouts/Default.vue'; // import DefaultLayout from '../Layouts/Default.vue';
export default { export default {
// layout: DefaultLayout, // layout: DefaultLayout,
props: { props: {
testing: String, testing: String,
}, },
components: { components: {
Link Link,
} },
} };
</script> </script>

48
resources/js/Components/IconRounded.vue
View File

@ -4,32 +4,32 @@ import BaseIcon from '@/Components/BaseIcon.vue';
defineProps({ defineProps({
icon: { icon: {
type: String, type: String,
required: true, required: true,
}, },
type: { type: {
type: String, type: String,
default: null, default: null,
}, },
w: { w: {
type: String, type: String,
default: 'w-12', default: 'w-12',
}, },
h: { h: {
type: String, type: String,
default: 'h-12', default: 'h-12',
}, },
bg: Boolean, bg: Boolean,
}); });
</script> </script>
<template> <template>
<BaseIcon <BaseIcon
:path="icon" :path="icon"
:w="w" :w="w"
:h="h" :h="h"
size="24" size="24"
class="rounded-full" class="rounded-full"
:class="bg ? colorsBgLight[type] : [colorsText[type], 'bg-gray-50 dark:bg-slate-800']" :class="bg ? colorsBgLight[type] : [colorsText[type], 'bg-gray-50 dark:bg-slate-800']"
/> />
</template> </template>

2
resources/js/Components/Icons/Language.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="my-svg-component"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="my-svg-component">
<path <path
fill-rule="evenodd" fill-rule="evenodd"
d="M9 2.25a.75.75 0 01.75.75v1.506a49.38 49.38 0 015.343.371.75.75 0 11-.186 1.489c-.66-.083-1.323-.151-1.99-.206a18.67 18.67 0 01-2.969 6.323c.317.384.65.753.998 1.107a.75.75 0 11-1.07 1.052A18.902 18.902 0 019 13.687a18.823 18.823 0 01-5.656 4.482.75.75 0 11-.688-1.333 17.323 17.323 0 005.396-4.353A18.72 18.72 0 015.89 8.598a.75.75 0 011.388-.568A17.21 17.21 0 009 11.224a17.17 17.17 0 002.391-5.165 48.038 48.038 0 00-8.298.307.75.75 0 01-.186-1.489 49.159 49.159 0 015.343-.371V3A.75.75 0 019 2.25zM15.75 9a.75.75 0 01.68.433l5.25 11.25a.75.75 0 01-1.36.634l-1.198-2.567h-6.744l-1.198 2.567a.75.75 0 01-1.36-.634l5.25-11.25A.75.75 0 0115.75 9zm-2.672 8.25h5.344l-2.672-5.726-2.672 5.726z" d="M9 2.25a.75.75 0 01.75.75v1.506a49.38 49.38 0 015.343.371.75.75 0 11-.186 1.489c-.66-.083-1.323-.151-1.99-.206a18.67 18.67 0 01-2.969 6.323c.317.384.65.753.998 1.107a.75.75 0 11-1.07 1.052A18.902 18.902 0 019 13.687a18.823 18.823 0 01-5.656 4.482.75.75 0 11-.688-1.333 17.323 17.323 0 005.396-4.353A18.72 18.72 0 015.89 8.598a.75.75 0 011.388-.568A17.21 17.21 0 009 11.224a17.17 17.17 0 002.391-5.165 48.038 48.038 0 00-8.298.307.75.75 0 01-.186-1.489 49.159 49.159 0 015.343-.371V3A.75.75 0 019 2.25zM15.75 9a.75.75 0 01.68.433l5.25 11.25a.75.75 0 01-1.36.634l-1.198-2.567h-6.744l-1.198 2.567a.75.75 0 01-1.36-.634l5.25-11.25A.75.75 0 0115.75 9zm-2.672 8.25h5.344l-2.672-5.726-2.672 5.726z"

3
resources/js/Components/Icons/Wizard.vue
View File

@ -21,7 +21,8 @@
</div> </div>
</div> </div>
</div> </div>
<div v-if="!isLastStep" <div
v-if="!isLastStep"
class="flex-auto border-t-2 transition duration-500 ease-in-out invisible sm:visible" class="flex-auto border-t-2 transition duration-500 ease-in-out invisible sm:visible"
:class="[isChecked ? 'border-teal-600' : 'border-gray-300']" :class="[isChecked ? 'border-teal-600' : 'border-gray-300']"
></div> ></div>

295
resources/js/Components/Map/SearchMap.vue Normal file
View File

@ -0,0 +1,295 @@
<script setup lang="ts">
import { onMounted, onUnmounted, ref, Ref, defineProps, computed } from 'vue';
import SectionMain from '@/Components/SectionMain.vue';
import { Map } from 'leaflet/src/map/index';
import { Rectangle } from 'leaflet';
import { canvas } from 'leaflet/src/layer/vector/Canvas';
import { svg } from 'leaflet/src/layer/vector/SVG';
import axios from 'axios';
import { LatLngBoundsExpression } from 'leaflet/src/geo/LatLngBounds';
// import { tileLayerWMS } from 'leaflet/src/layer/tile/TileLayer.WMS';
import { TileLayer } from 'leaflet/src/layer/tile/TileLayer';
import { Attribution } from 'leaflet/src/control/Control.Attribution';
import DrawControlComponent from '@/Components/Map/draw.component.vue';
import ZoomControlComponent from '@/Components/Map/zoom.component.vue';
import { MapService } from '@/Stores/map.service';
import { LayerGroup } from 'leaflet/src/layer/LayerGroup';
import { OpensearchDocument } from '@/Dataset';
Map.include({
// @namespace Map; @method getRenderer(layer: Path): Renderer
// Returns the instance of `Renderer` that should be used to render the given
// `Path`. It will ensure that the `renderer` options of the map and paths
// are respected, and that the renderers do exist on the map.
getRenderer: function (layer) {
// @namespace Path; @option renderer: Renderer
// Use this specific instance of `Renderer` for this path. Takes
// precedence over the map's [default renderer](#map-renderer).
var renderer = layer.options.renderer || this._getPaneRenderer(layer.options.pane) || this.options.renderer || this._renderer;
if (!renderer) {
renderer = this._renderer = this._createRenderer();
}
if (!this.hasLayer(renderer)) {
this.addLayer(renderer);
}
return renderer;
},
_getPaneRenderer: function (name) {
if (name === 'overlayPane' || name === undefined) {
return false;
}
var renderer = this._paneRenderers[name];
if (renderer === undefined) {
renderer = this._createRenderer({ pane: name });
this._paneRenderers[name] = renderer;
}
return renderer;
},
_createRenderer: function (options) {
// @namespace Map; @option preferCanvas: Boolean = false
// Whether `Path`s should be rendered on a `Canvas` renderer.
// By default, all `Path`s are rendered in a `SVG` renderer.
return (this.options.preferCanvas && canvas(options)) || svg(options);
},
});
const DEFAULT_BASE_LAYER_NAME = 'BaseLayer';
const DEFAULT_BASE_LAYER_ATTRIBUTION = '&copy; <a target="_blank" href="http://osm.org/copyright">OpenStreetMap</a> contributors';
// const OPEN_SEARCH_HOST = 'http://localhost:9200';
const OPEN_SEARCH_HOST = 'http://192.168.21.18';
let map: Map;
const props = defineProps({
dheckable: Boolean,
datasets: {
type: Array<OpensearchDocument>,
default: () => [],
},
mapId: {
type: String,
default: 'map',
},
mapOptions: {
type: Object,
default: () => ({
center: [48.208174, 16.373819],
zoom: 3,
zoomControl: false,
attributionControl: false,
}),
},
});
const items = computed({
get() {
return props.datasets;
},
// setter
set(value) {
// Note: we are using destructuring assignment syntax here.
props.datasets.length = 0;
props.datasets.push(...value);
},
});
const fitBounds: LatLngBoundsExpression = [
[46.4318173285, 9.47996951665],
[49.0390742051, 16.9796667823],
];
// const mapId = 'map';
const drawControl: Ref<DrawControlComponent | null> = ref(null);
const southWest = ref(null);
const northEast = ref(null);
const mapService = MapService();
// const coverage = {
// x_min: undefined,
// y_min: undefined,
// x_max: undefined,
// y_max: undefined,
// elevation_min: undefined,
// elevation_max: undefined,
// elevation_absolut: undefined,
// depth_min: undefined,
// depth_max: undefined,
// depth_absolut: undefined,
// time_min: undefined,
// time_max: undefined,
// time_absolut: undefined,
// };
const filterLayerGroup = new LayerGroup();
// Replace with your actual data
// const datasets: Ref<OpensearchDocument[]> = ref([]);
onMounted(() => {
initMap();
});
onUnmounted(() => {
map.off('zoomend zoomlevelschange');
});
const initMap = async () => {
// init leaflet map
map = new Map('map', props.mapOptions);
mapService.setMap(props.mapId, map);
map.scrollWheelZoom.disable();
map.fitBounds(fitBounds);
drawControl.value?.toggleDraw();
map.addLayer(filterLayerGroup);
const attributionControl = new Attribution().addTo(map);
attributionControl.setPrefix(false);
// let osmGgray = tileLayerWMS('https://ows.terrestris.de/osm-gray/service', {
// format: 'image/png',
// attribution: DEFAULT_BASE_LAYER_ATTRIBUTION,
// layers: 'OSM-WMS',
// });
let baseAt = new TileLayer('https://{s}.wien.gv.at/basemap/bmapgrau/normal/google3857/{z}/{y}/{x}.png', {
subdomains: ['maps', 'maps1', 'maps2', 'maps3', 'maps4'],
attribution: DEFAULT_BASE_LAYER_ATTRIBUTION,
});
let layerOptions = {
label: DEFAULT_BASE_LAYER_NAME,
visible: true,
layer: baseAt,
};
layerOptions.layer.addTo(map);
map.on('Draw.Event.CREATED', handleDrawEventCreated);
// // const query = {
// // query: {
// // term: {
// // id: "103"
// // }
// // }
// // };
// // to do : call extra method:
// const query = {
// // q: 'id:103'
// // q: 'author:"Iglseder, Christoph" OR title:"Datensatz"',
// // q: 'author:"Iglseder"',
// q: '*',
// _source: 'author,bbox_xmin,bbox_xmax,bbox_ymin,bbox_ymax,abstract,title',
// size: 1000
// // qf:"title^3 author^2 subject^1",
// }
// try {
// let response = await axios({
// method: 'GET',
// url: OPEN_SEARCH_HOST + '/tethys-records/_search',
// headers: { 'Content-Type': 'application/json' },
// params: query
// });
// // Loop through the hits in the response
// response.data.hits.hits.forEach(hit => {
// // Get the geo_location attribute
// // var geo_location = hit._source.geo_location;
// let xMin = hit._source.bbox_xmin;
// let xMax = hit._source.bbox_xmax;
// let yMin = hit._source.bbox_ymin;
// let yMax = hit._source.bbox_ymax;
// var bbox: LatLngBoundsExpression = [[yMin, xMin], [yMax, xMax]];
// // Parse the WKT string to get the bounding box coordinates
// // var bbox = wktToBbox(geo_location);
// // // Add the bounding box to the map as a rectangle
// new Rectangle(bbox, { color: "#ff7800", weight: 1 }).addTo(map);
// // console.log(hit._source);
// });
// } catch (error) {
// console.error(error);
// }
};
const handleDrawEventCreated = async (event) => {
filterLayerGroup.clearLayers();
items.value = [];
let layer = event.layer;
let bounds = layer.getBounds();
// coverage.x_min = bounds.getSouthWest().lng;
// coverage.y_min = bounds.getSouthWest().lat;
// coverage.x_max = bounds.getNorthEast().lng;
// coverage.y_max = bounds.getNorthEast().lat;
try {
let response = await axios({
method: 'POST',
url: OPEN_SEARCH_HOST + '/tethys-records/_search',
headers: { 'Content-Type': 'application/json' },
data: {
size: 1000,
query: {
bool: {
must: {
match_all: {},
},
filter: {
geo_shape: {
geo_location: {
// replace 'location' with your geo-point field name
shape: {
type: 'envelope',
coordinates: [
[bounds.getSouthWest().lng, bounds.getNorthEast().lat],
[bounds.getNorthEast().lng, bounds.getSouthWest().lat],
],
},
relation: 'within',
},
},
},
// _source: 'author,bbox_xmin,bbox_xmax,bbox_ymin,bbox_ymax,abstract,title',
// "size": 1000
},
},
},
});
// Loop through the hits in the response
response.data.hits.hits.forEach((hit) => {
// Get the geo_location attribute
// var geo_location = hit._source.geo_location;
let xMin = hit._source.bbox_xmin;
let xMax = hit._source.bbox_xmax;
let yMin = hit._source.bbox_ymin;
let yMax = hit._source.bbox_ymax;
var bbox: LatLngBoundsExpression = [
[yMin, xMin],
[yMax, xMax],
];
// Parse the WKT string to get the bounding box coordinates
// var bbox = wktToBbox(geo_location);
// // Add the bounding box to the map as a rectangle
let rect = new Rectangle(bbox, { color: '#ff7800', weight: 1 });
filterLayerGroup.addLayer(rect);
// add to result list
items.value.push(hit._source);
});
} catch (error) {
console.error(error);
}
};
</script>
<template>
<SectionMain>
<div id="map" class="map-container mapDesktop mt-6 mb-6 rounded-2xl py-12 px-6 text-center">
<ZoomControlComponent ref="zoomControl" :mapId="mapId"></ZoomControlComponent>
<DrawControlComponent ref="drawControl" :preserve="false" :mapId="mapId" :southWest="southWest" :northEast="northEast">
</DrawControlComponent>
</div>
</SectionMain>
<!-- </section> -->
</template>

17
resources/js/Components/Map/draw.component.vue
View File

@ -4,10 +4,13 @@
<fa-icon [icon]="faSearchLocation"></fa-icon> <fa-icon [icon]="faSearchLocation"></fa-icon>
</button> --> </button> -->
<!-- --> <!-- -->
<button ref="inputDraw" <button
ref="inputDraw"
class="inline-flex cursor-pointer justify-center items-center whitespace-nowrap focus:outline-none transition-colors duration-150 border rounded ring-blue-700 text-black border-teal-50 hover:bg-gray-200 text-sm p-1" class="inline-flex cursor-pointer justify-center items-center whitespace-nowrap focus:outline-none transition-colors duration-150 border rounded ring-blue-700 text-black border-teal-50 hover:bg-gray-200 text-sm p-1"
type="button" :class="[_enabled ? 'cursor-not-allowed bg-cyan-200' : 'bg-teal-50 is-active']" type="button"
@click.prevent="toggleDraw"> :class="[_enabled ? 'cursor-not-allowed bg-cyan-200' : 'bg-teal-50 is-active']"
@click.prevent="toggleDraw"
>
<BaseIcon v-if="mdiDrawPen" :path="mdiDrawPen" /> <BaseIcon v-if="mdiDrawPen" :path="mdiDrawPen" />
</button> </button>
</div> </div>
@ -53,15 +56,14 @@ export default class DrawControlComponent extends Vue {
metric: true, // Whether to use the metric measurement system or imperial metric: true, // Whether to use the metric measurement system or imperial
}; };
@Prop() public mapId: string; @Prop() public mapId: string;
// @Prop() public map: Map; // @Prop() public map: Map;
@Prop public southWest: LatLngBounds; @Prop public southWest: LatLngBounds;
@Prop public northEast: LatLngBounds; @Prop public northEast: LatLngBounds;
@Prop({ @Prop({
default: true default: true,
}) public preserve: boolean; })
public preserve: boolean;
mapService = MapService(); mapService = MapService();
public _enabled; public _enabled;
@ -97,7 +99,6 @@ export default class DrawControlComponent extends Vue {
// @Ref('inputDraw') private _inputDraw: HTMLElement; // @Ref('inputDraw') private _inputDraw: HTMLElement;
private addHooks() { private addHooks() {
// L.Draw.Feature.prototype.addHooks.call(this); // L.Draw.Feature.prototype.addHooks.call(this);
this._map = this.mapService.getMap(this.mapId); this._map = this.mapService.getMap(this.mapId);

213
resources/js/Components/NavBar.vue
View File

@ -1,8 +1,8 @@
<script lang="ts" setup> <script lang="ts" setup>
import { usePage, router } from '@inertiajs/vue3' import { usePage, router } from '@inertiajs/vue3';
// import { usePage } from '@inertiajs/inertia-vue3'; // import { usePage } from '@inertiajs/inertia-vue3';
// import { Inertia } from '@inertiajs/inertia'; // import { Inertia } from '@inertiajs/inertia';
import {ComputedRef} from "vue"; import { ComputedRef } from 'vue';
import { computed, ref } from 'vue'; import { computed, ref } from 'vue';
import { containerMaxW } from '@/config.js'; import { containerMaxW } from '@/config.js';
@ -10,21 +10,21 @@ import { containerMaxW } from '@/config.js';
import { StyleService } from '@/Stores/style'; import { StyleService } from '@/Stores/style';
import { LayoutService } from '@/Stores/layout'; import { LayoutService } from '@/Stores/layout';
import { import {
mdiForwardburger, mdiForwardburger,
mdiBackburger, mdiBackburger,
mdiClose, mdiClose,
mdiDotsVertical, mdiDotsVertical,
mdiMenu, mdiMenu,
// mdiClockOutline, // mdiClockOutline,
mdiCloudDownloadOutline, mdiCloudDownloadOutline,
mdiCloud, mdiCloud,
mdiCrop, mdiCrop,
mdiAccount, mdiAccount,
mdiCogOutline, mdiCogOutline,
mdiEmail, mdiEmail,
mdiLogout, mdiLogout,
mdiGithub, mdiGithub,
mdiThemeLightDark, mdiThemeLightDark,
} from '@mdi/js'; } from '@mdi/js';
import NavBarItem from '@/Components/NavBarItem.vue'; import NavBarItem from '@/Components/NavBarItem.vue';
import NavBarItemLabel from '@/Components/NavBarItemLabel.vue'; import NavBarItemLabel from '@/Components/NavBarItemLabel.vue';
@ -34,15 +34,13 @@ import UserAvatarCurrentUser from '@/Components/UserAvatarCurrentUser.vue';
import BaseIcon from '@/Components/BaseIcon.vue'; import BaseIcon from '@/Components/BaseIcon.vue';
import NavBarSearch from '@/Components/NavBarSearch.vue'; import NavBarSearch from '@/Components/NavBarSearch.vue';
import { stardust } from '@eidellev/adonis-stardust/client'; import { stardust } from '@eidellev/adonis-stardust/client';
import type User from "App/Models/User"; import type User from 'App/Models/User';
// const mainStore = MainService(); // const mainStore = MainService();
// const userName = computed(() =>mainStore.userName); // const userName = computed(() =>mainStore.userName);
const styleService = StyleService(); const styleService = StyleService();
// const props = defineProps({ // const props = defineProps({
// user: { // user: {
// type: Object, // type: Object,
// default: () => ({}), // default: () => ({}),
@ -50,13 +48,13 @@ const styleService = StyleService();
// }); // });
// const userName = computed(() => usePage().props.user.login) // const userName = computed(() => usePage().props.user.login)
const user: ComputedRef<User>= computed(() => { const user: ComputedRef<User> = computed(() => {
return usePage().props.authUser as User; return usePage().props.authUser as User;
}); });
// const userName = computed(() => props.user.login) // const userName = computed(() => props.user.login)
const toggleLightDark = () => { const toggleLightDark = () => {
styleService.setDarkMode(); styleService.setDarkMode();
}; };
const layoutStore = LayoutService(); const layoutStore = LayoutService();
@ -64,108 +62,101 @@ const layoutStore = LayoutService();
const isMenuNavBarActive = ref(false); const isMenuNavBarActive = ref(false);
const menuNavBarToggle = () => { const menuNavBarToggle = () => {
isMenuNavBarActive.value = !isMenuNavBarActive.value; isMenuNavBarActive.value = !isMenuNavBarActive.value;
}; };
const menuOpenLg = () => { const menuOpenLg = () => {
layoutStore.isAsideLgActive = true; layoutStore.isAsideLgActive = true;
}; };
// const logout = () => { // const logout = () => {
// // router.post(route('logout')) // // router.post(route('logout'))
// Inertia.get(stardust.route('app.index')); // Inertia.get(stardust.route('app.index'));
// }; // };
const logout = async() => { const logout = async () => {
// router.post(route('logout')); // router.post(route('logout'));
await router.post(stardust.route('logout')); await router.post(stardust.route('logout'));
}; };
</script> </script>
<template> <template>
<nav <nav class="top-0 left-0 right-0 fixed bg-gray-50 h-14 z-40 w-screen transition-position xl:pl-60 lg:w-auto dark:bg-slate-800">
class="top-0 left-0 right-0 fixed bg-gray-50 h-14 z-40 w-screen transition-position xl:pl-60 lg:w-auto dark:bg-slate-800" <div class="flex lg:items-stretch" :class="containerMaxW">
> <div class="flex-1 items-stretch flex h-14">
<div class="flex lg:items-stretch" :class="containerMaxW"> <NavBarItem type="flex lg:hidden" @click.prevent="layoutStore.asideMobileToggle()">
<div class="flex-1 items-stretch flex h-14"> <BaseIcon :path="layoutStore.isAsideMobileExpanded ? mdiBackburger : mdiForwardburger" size="24" />
<NavBarItem type="flex lg:hidden" @click.prevent="layoutStore.asideMobileToggle()"> </NavBarItem>
<BaseIcon <NavBarItem type="hidden lg:flex xl:hidden" @click.prevent="menuOpenLg">
:path="layoutStore.isAsideMobileExpanded ? mdiBackburger : mdiForwardburger" <BaseIcon :path="mdiMenu" size="24" />
size="24" </NavBarItem>
/> <NavBarItem>
</NavBarItem> <NavBarSearch />
<NavBarItem type="hidden lg:flex xl:hidden" @click.prevent="menuOpenLg"> </NavBarItem>
<BaseIcon :path="mdiMenu" size="24" /> </div>
</NavBarItem> <div class="flex-none items-stretch flex h-14 lg:hidden">
<NavBarItem> <NavBarItem @click.prevent="menuNavBarToggle">
<NavBarSearch /> <BaseIcon :path="isMenuNavBarActive ? mdiClose : mdiDotsVertical" size="24" />
</NavBarItem> </NavBarItem>
</div> </div>
<div class="flex-none items-stretch flex h-14 lg:hidden"> <div
<NavBarItem @click.prevent="menuNavBarToggle"> class="absolute w-screen top-14 left-0 bg-gray-50 shadow lg:w-auto lg:items-stretch lg:flex lg:grow lg:static lg:border-b-0 lg:overflow-visible lg:shadow-none dark:bg-slate-800"
<BaseIcon :path="isMenuNavBarActive ? mdiClose : mdiDotsVertical" size="24" /> :class="[isMenuNavBarActive ? 'block' : 'hidden']"
</NavBarItem> >
</div> <div class="max-h-screen-menu overflow-y-auto lg:overflow-visible lg:flex lg:items-stretch lg:justify-end lg:ml-auto">
<div <NavBarMenu>
class="absolute w-screen top-14 left-0 bg-gray-50 shadow lg:w-auto lg:items-stretch lg:flex lg:grow lg:static lg:border-b-0 lg:overflow-visible lg:shadow-none dark:bg-slate-800" <NavBarItemLabel :icon="mdiMenu" label="Help menu" />
:class="[isMenuNavBarActive ? 'block' : 'hidden']" <template #dropdown>
> <!-- <NavBarItem>
<div
class="max-h-screen-menu overflow-y-auto lg:overflow-visible lg:flex lg:items-stretch lg:justify-end lg:ml-auto"
>
<NavBarMenu>
<NavBarItemLabel :icon="mdiMenu" label="Help menu" />
<template #dropdown>
<!-- <NavBarItem>
<NavBarItemLabel :icon="mdiClockOutline" label="Item One" /> <NavBarItemLabel :icon="mdiClockOutline" label="Item One" />
</NavBarItem> --> </NavBarItem> -->
<NavBarItem href="/docs/HandbuchTethys.pdf" target="_blank"> <NavBarItem href="/docs/HandbuchTethys.pdf" target="_blank">
<NavBarItemLabel :icon="mdiCloudDownloadOutline" label="Tethys Manual" /> <NavBarItemLabel :icon="mdiCloudDownloadOutline" label="Tethys Manual" />
</NavBarItem> </NavBarItem>
<NavBarItem href="/docs/geopackage_v01.pdf" target="_blank"> <NavBarItem href="/docs/geopackage_v01.pdf" target="_blank">
<NavBarItemLabel :icon="mdiCloud" label="GeoPackage Help" /> <NavBarItemLabel :icon="mdiCloud" label="GeoPackage Help" />
</NavBarItem> </NavBarItem>
<BaseDivider nav-bar /> <BaseDivider nav-bar />
<NavBarItem> <NavBarItem>
<NavBarItemLabel :icon="mdiCrop" label="Item Last" /> <NavBarItemLabel :icon="mdiCrop" label="Item Last" />
</NavBarItem> </NavBarItem>
</template> </template>
</NavBarMenu> </NavBarMenu>
<NavBarMenu> <NavBarMenu>
<NavBarItemLabel v-bind:label="user.login"> <NavBarItemLabel v-bind:label="user.login">
<UserAvatarCurrentUser class="w-6 h-6 mr-3 inline-flex" /> <UserAvatarCurrentUser class="w-6 h-6 mr-3 inline-flex" />
</NavBarItemLabel> </NavBarItemLabel>
<template #dropdown> <template #dropdown>
<!-- <NavBarItem> --> <!-- <NavBarItem> -->
<!-- <NavBarItem route-name="admin.account.info"> --> <!-- <NavBarItem route-name="admin.account.info"> -->
<NavBarItem :route-name="'admin.account.info'" > <NavBarItem :route-name="'admin.account.info'">
<NavBarItemLabel :icon="mdiAccount" label="My Profile" /> <NavBarItemLabel :icon="mdiAccount" label="My Profile" />
</NavBarItem> </NavBarItem>
<NavBarItem :route-name="'settings'"> <NavBarItem :route-name="'settings'">
<NavBarItemLabel :icon="mdiCogOutline" label="Settings" /> <NavBarItemLabel :icon="mdiCogOutline" label="Settings" />
</NavBarItem> </NavBarItem>
<NavBarItem> <NavBarItem>
<NavBarItemLabel :icon="mdiEmail" label="Messages" /> <NavBarItemLabel :icon="mdiEmail" label="Messages" />
</NavBarItem> </NavBarItem>
<BaseDivider nav-bar /> <BaseDivider nav-bar />
<NavBarItem @click="logout"> <NavBarItem @click="logout">
<NavBarItemLabel :icon="mdiLogout" label="Log Out" /> <NavBarItemLabel :icon="mdiLogout" label="Log Out" />
</NavBarItem> </NavBarItem>
</template> </template>
</NavBarMenu> </NavBarMenu>
<NavBarItem is-desktop-icon-only @click.prevent="toggleLightDark"> <NavBarItem is-desktop-icon-only @click.prevent="toggleLightDark">
<NavBarItemLabel v-bind:icon="mdiThemeLightDark" label="Light/Dark" is-desktop-icon-only /> <NavBarItemLabel v-bind:icon="mdiThemeLightDark" label="Light/Dark" is-desktop-icon-only />
</NavBarItem> </NavBarItem>
<NavBarItem href="https://gitea.geologie.ac.at/geolba/tethys" target="_blank" is-desktop-icon-only> <NavBarItem href="https://gitea.geologie.ac.at/geolba/tethys" target="_blank" is-desktop-icon-only>
<NavBarItemLabel v-bind:icon="mdiGithub" label="GitHub" is-desktop-icon-only /> <NavBarItemLabel v-bind:icon="mdiGithub" label="GitHub" is-desktop-icon-only />
</NavBarItem> </NavBarItem>
<NavBarItem is-desktop-icon-only @click="logout"> <NavBarItem is-desktop-icon-only @click="logout">
<NavBarItemLabel v-bind:icon="mdiLogout" label="Log out" is-desktop-icon-only /> <NavBarItemLabel v-bind:icon="mdiLogout" label="Log out" is-desktop-icon-only />
</NavBarItem> </NavBarItem>
</div> </div>
</div> </div>
</div> </div>
</nav> </nav>
</template> </template>

132
resources/js/Components/NavBarItem.vue
View File

@ -1,90 +1,90 @@
<script setup> <script setup>
import { StyleService } from '@/Stores/style' import { StyleService } from '@/Stores/style';
// import { Link } from '@inertiajs/vue3' // import { Link } from '@inertiajs/vue3'
import { Link } from '@inertiajs/vue3' import { Link } from '@inertiajs/vue3';
import { computed } from 'vue' import { computed } from 'vue';
import { stardust } from '@eidellev/adonis-stardust/client'; import { stardust } from '@eidellev/adonis-stardust/client';
const props = defineProps({ const props = defineProps({
href: { href: {
type: String, type: String,
default: null default: null,
}, },
routeName: { routeName: {
type: String, type: String,
default: null default: null,
}, },
param:{ param: {
type:Number type: Number,
}, },
type: { type: {
type: String, type: String,
default: 'flex' default: 'flex',
}, },
activeColor: { activeColor: {
type: String, type: String,
default: null default: null,
}, },
isDesktopIconOnly: Boolean, isDesktopIconOnly: Boolean,
dropdown: Boolean, dropdown: Boolean,
active: Boolean active: Boolean,
}) });
const is = computed(() => { const is = computed(() => {
if (props.href) { if (props.href) {
return 'a' return 'a';
} }
if (props.routeName) { if (props.routeName) {
return Link return Link;
} }
return 'div' return 'div';
}) });
const styleStore = StyleService() const styleStore = StyleService();
const activeColor = props.activeColor ?? `${styleStore.navBarItemLabelActiveColorStyle} dark:text-slate-400` const activeColor = props.activeColor ?? `${styleStore.navBarItemLabelActiveColorStyle} dark:text-slate-400`;
const activeClass = computed( const activeClass = computed(
// () => props.routeName && route().current(props.routeName) == true ? props.activeColor : null // () => props.routeName && route().current(props.routeName) == true ? props.activeColor : null
() => props.routeName && stardust.isCurrent(props.routeName) ? props.activeColor : null () => (props.routeName && stardust.isCurrent(props.routeName) ? props.activeColor : null),
) );
// const itemRoute = computed(() => (props.routeName ? stardust.route(props.routeName): '')); // const itemRoute = computed(() => (props.routeName ? stardust.route(props.routeName): ''));
const componentClass = computed(() => { const componentClass = computed(() => {
const base = [ const base = [
props.type, props.type,
props.active props.active
? activeColor ? activeColor
: `${styleStore.navBarItemLabelStyle} dark:text-white dark:hover:text-slate-400 ${styleStore.navBarItemLabelHoverStyle}` : `${styleStore.navBarItemLabelStyle} dark:text-white dark:hover:text-slate-400 ${styleStore.navBarItemLabelHoverStyle}`,
] ];
if (props.type === 'block') { if (props.type === 'block') {
base.push('lg:flex') base.push('lg:flex');
} }
if (!props.dropdown) { if (!props.dropdown) {
base.push('py-2', 'px-3') base.push('py-2', 'px-3');
} else { } else {
base.push('p-0', 'lg:py-2', 'lg:px-3') base.push('p-0', 'lg:py-2', 'lg:px-3');
} }
if (props.isDesktopIconOnly) { if (props.isDesktopIconOnly) {
base.push('lg:w-16', 'lg:justify-center') base.push('lg:w-16', 'lg:justify-center');
} }
return base return base;
}) });
</script> </script>
<template> <template>
<component <component
:is="is" :is="is"
class="items-center grow-0 shrink-0 relative cursor-pointer" class="items-center grow-0 shrink-0 relative cursor-pointer"
:class="[componentClass, activeClass]" :class="[componentClass, activeClass]"
:href="routeName ? stardust.route(props.routeName, [props.param]) : href" :href="routeName ? stardust.route(props.routeName, [props.param]) : href"
> >
<slot /> <slot />
</component> </component>
</template> </template>

35
resources/js/Components/NavBarItemLabel.vue
View File

@ -1,28 +1,21 @@
<script setup> <script setup>
import BaseIcon from '@/Components/BaseIcon.vue' import BaseIcon from '@/Components/BaseIcon.vue';
defineProps({ defineProps({
icon: { icon: {
type: String, type: String,
default: null default: null,
}, },
label: { label: {
type: String, type: String,
required: true required: true,
}, },
isDesktopIconOnly: Boolean isDesktopIconOnly: Boolean,
}) });
</script> </script>
<template> <template>
<slot /> <slot />
<BaseIcon <BaseIcon v-if="icon" :path="icon" class="transition-colors" />
v-if="icon" <span class="px-2 transition-colors" :class="{ 'lg:hidden': isDesktopIconOnly && icon }">{{ label }}</span>
:path="icon"
class="transition-colors"
/>
<span
class="px-2 transition-colors"
:class="{ 'lg:hidden':isDesktopIconOnly && icon }"
>{{ label }}</span>
</template> </template>

81
resources/js/Components/NavBarMenu.vue
View File

@ -1,62 +1,51 @@
<script setup> <script setup>
import { StyleService } from '@/Stores/style' import { StyleService } from '@/Stores/style';
import { computed, ref, onMounted, onBeforeUnmount } from 'vue' import { computed, ref, onMounted, onBeforeUnmount } from 'vue';
import { mdiChevronUp, mdiChevronDown } from '@mdi/js' import { mdiChevronUp, mdiChevronDown } from '@mdi/js';
import NavBarItem from '@/Components/NavBarItem.vue' import NavBarItem from '@/Components/NavBarItem.vue';
import BaseIcon from '@/Components/BaseIcon.vue' import BaseIcon from '@/Components/BaseIcon.vue';
const styleStore = StyleService() const styleStore = StyleService();
const isDropdownActive = ref(false) const isDropdownActive = ref(false);
const toggleDropdownIcon = computed(() => isDropdownActive.value ? mdiChevronUp : mdiChevronDown) const toggleDropdownIcon = computed(() => (isDropdownActive.value ? mdiChevronUp : mdiChevronDown));
const toggle = () => { const toggle = () => {
isDropdownActive.value = !isDropdownActive.value isDropdownActive.value = !isDropdownActive.value;
} };
const root = ref(null) const root = ref(null);
const forceClose = event => { const forceClose = (event) => {
if (!root.value.$el.contains(event.target)) { if (!root.value.$el.contains(event.target)) {
isDropdownActive.value = false isDropdownActive.value = false;
} }
} };
onMounted(() => { onMounted(() => {
window.addEventListener('click', forceClose) window.addEventListener('click', forceClose);
}) });
onBeforeUnmount(() => { onBeforeUnmount(() => {
window.removeEventListener('click', forceClose) window.removeEventListener('click', forceClose);
}) });
</script> </script>
<template> <template>
<NavBarItem <NavBarItem ref="root" type="block" :active="isDropdownActive" dropdown @click="toggle">
ref="root" <a
type="block" class="flex items-center py-2 px-3 dark:bg-slate-800 lg:bg-transparent lg:dark:bg-transparent"
:active="isDropdownActive" :class="styleStore.navBarMenuListUpperLabelStyle"
dropdown >
@click="toggle" <slot />
> <BaseIcon :path="toggleDropdownIcon" class="hidden lg:inline-flex transition-colors" />
<a </a>
class="flex items-center py-2 px-3 dark:bg-slate-800 lg:bg-transparent lg:dark:bg-transparent" <div
:class="styleStore.navBarMenuListUpperLabelStyle" class="-mx-px text-sm border-b border-gray-100 lg:border lg:bg-white lg:absolute lg:top-full lg:left-0 lg:min-w-full lg:z-20 lg:rounded-b lg:dark:bg-slate-800 dark:border-slate-700"
> :class="{ 'lg:hidden': !isDropdownActive }"
<slot /> >
<BaseIcon <slot name="dropdown" />
:path="toggleDropdownIcon" </div>
class="hidden lg:inline-flex transition-colors" </NavBarItem>
/>
</a>
<div
class="-mx-px text-sm border-b border-gray-100 lg:border lg:bg-white lg:absolute
lg:top-full lg:left-0 lg:min-w-full lg:z-20 lg:rounded-b lg:dark:bg-slate-800
dark:border-slate-700"
:class="{'lg:hidden':!isDropdownActive}"
>
<slot name="dropdown" />
</div>
</NavBarItem>
</template> </template>

8
resources/js/Components/NavBarSearch.vue
View File

@ -3,11 +3,5 @@ import FormControl from '@/Components/FormControl.vue';
</script> </script>
<template> <template>
<FormControl <FormControl ref="root" placeholder="Search (ctrl+k)" ctrl-k-focus transparent borderless />
ref="root"
placeholder="Search (ctrl+k)"
ctrl-k-focus
transparent
borderless
/>
</template> </template>

87
resources/js/Components/NotificationBar.vue
View File

@ -1,68 +1,45 @@
<script setup> <script setup>
import { ref, computed, useSlots } from 'vue' import { ref, computed, useSlots } from 'vue';
import { mdiClose } from '@mdi/js' import { mdiClose } from '@mdi/js';
import { colorsBgLight, colorsOutline } from '@/colors.js' import { colorsBgLight, colorsOutline } from '@/colors.js';
import BaseLevel from '@/Components/BaseLevel.vue' import BaseLevel from '@/Components/BaseLevel.vue';
import BaseIcon from '@/Components/BaseIcon.vue' import BaseIcon from '@/Components/BaseIcon.vue';
import BaseButton from '@/Components/BaseButton.vue' import BaseButton from '@/Components/BaseButton.vue';
const props = defineProps({ const props = defineProps({
icon: { icon: {
type: String, type: String,
default: null default: null,
}, },
outline: Boolean, outline: Boolean,
color: { color: {
type: String, type: String,
required: true required: true,
} },
}) });
const componentClass = computed(() => props.outline const componentClass = computed(() => (props.outline ? colorsOutline[props.color] : colorsBgLight[props.color]));
? colorsOutline[props.color]
: colorsBgLight[props.color]
)
const isDismissed = ref(false) const isDismissed = ref(false);
const dismiss = () => { const dismiss = () => {
isDismissed.value = true isDismissed.value = true;
} };
const slots = useSlots() const slots = useSlots();
const hasRightSlot = computed(() => slots.right) const hasRightSlot = computed(() => slots.right);
</script> </script>
<template> <template>
<div <div v-if="!isDismissed" :class="componentClass" class="px-3 py-6 md:py-3 mb-6 last:mb-0 border rounded transition-colors duration-150">
v-if="!isDismissed" <BaseLevel>
:class="componentClass" <div class="flex flex-col md:flex-row items-center">
class="px-3 py-6 md:py-3 mb-6 last:mb-0 border rounded transition-colors duration-150" <BaseIcon v-if="icon" :path="icon" w="w-10 md:w-5" h="h-10 md:h-5" size="24" class="md:mr-2" />
> <span class="text-center md:text-left"><slot /></span>
<BaseLevel> </div>
<div class="flex flex-col md:flex-row items-center"> <slot v-if="hasRightSlot" name="right" />
<BaseIcon <BaseButton v-else :icon="mdiClose" :outline="outline" small @click="dismiss" />
v-if="icon" </BaseLevel>
:path="icon" </div>
w="w-10 md:w-5"
h="h-10 md:h-5"
size="24"
class="md:mr-2"
/>
<span class="text-center md:text-left"><slot /></span>
</div>
<slot
v-if="hasRightSlot"
name="right"
/>
<BaseButton
v-else
:icon="mdiClose"
:outline="outline"
small
@click="dismiss"
/>
</BaseLevel>
</div>
</template> </template>

27
resources/js/Components/NotificationBarInCard.vue
View File

@ -2,23 +2,20 @@
import { colorsBgLight } from '@/colors.js'; import { colorsBgLight } from '@/colors.js';
defineProps({ defineProps({
color: { color: {
type: String, type: String,
required: true, required: true,
}, },
isPlacedWithHeader: { isPlacedWithHeader: {
type: Boolean, type: Boolean,
}, },
}); });
</script> </script>
<template> <template>
<div class="flex flex-col mb-6 -mt-6 -mr-6 -ml-6 animate-fade-in"> <div class="flex flex-col mb-6 -mt-6 -mr-6 -ml-6 animate-fade-in">
<div <div :class="[colorsBgLight[color], { 'rounded-t-xl': !isPlacedWithHeader }]" class="flex flex-col p-6 transition-colors">
:class="[colorsBgLight[color], { 'rounded-t-xl': !isPlacedWithHeader }]" <slot />
class="flex flex-col p-6 transition-colors" </div>
> </div>
<slot />
</div>
</div>
</template> </template>

84
resources/js/Components/NumberDynamic.vue
View File

@ -1,63 +1,61 @@
<script setup> <script setup>
import { computed, ref, watch, onMounted } from 'vue' import { computed, ref, watch, onMounted } from 'vue';
import numeral from 'numeral' import numeral from 'numeral';
const props = defineProps({ const props = defineProps({
prefix: { prefix: {
type: String, type: String,
default: null default: null,
}, },
suffix: { suffix: {
type: String, type: String,
default: null default: null,
}, },
value: { value: {
type: Number, type: Number,
default: 0 default: 0,
}, },
duration: { duration: {
type: Number, type: Number,
default: 500 default: 500,
} },
}) });
const newValue = ref(0) const newValue = ref(0);
const newValueFormatted = computed( const newValueFormatted = computed(() => (newValue.value < 1000 ? newValue.value : numeral(newValue.value).format('0,0')));
() => newValue.value < 1000 ? newValue.value : numeral(newValue.value).format('0,0')
)
const value = computed(() => props.value) const value = computed(() => props.value);
const grow = m => { const grow = (m) => {
const v = Math.ceil(newValue.value + m) const v = Math.ceil(newValue.value + m);
if (v > value.value) { if (v > value.value) {
newValue.value = value.value newValue.value = value.value;
return false return false;
} }
newValue.value = v newValue.value = v;
setTimeout(() => { setTimeout(() => {
grow(m) grow(m);
}, 25) }, 25);
} };
const growInit = () => { const growInit = () => {
newValue.value = 0 newValue.value = 0;
grow(props.value / (props.duration / 25)) grow(props.value / (props.duration / 25));
} };
watch(value, () => { watch(value, () => {
growInit() growInit();
}) });
onMounted(() => { onMounted(() => {
growInit() growInit();
}) });
</script> </script>
<template> <template>
<div>{{ prefix }}{{ newValueFormatted }}{{ suffix }}</div> <div>{{ prefix }}{{ newValueFormatted }}{{ suffix }}</div>
</template> </template>

56
resources/js/Components/OverlayLayer.vue
View File

@ -2,32 +2,44 @@
import { StyleService } from '@/Stores/style'; import { StyleService } from '@/Stores/style';
defineProps({ defineProps({
zIndex: { zIndex: {
type: String, type: String,
default: 'z-50' default: 'z-50',
} },
}) });
const emit = defineEmits(['overlay-click']) const emit = defineEmits(['overlay-click']);
const overlayClick = event => { const overlayClick = (event) => {
emit('overlay-click', event) emit('overlay-click', event);
} };
const styleStore = StyleService() const styleStore = StyleService();
</script> </script>
<template> <template>
<div class="flex items-center flex-col justify-center overflow-hidden fixed inset-0" :class="zIndex"> <div class="flex items-center flex-col justify-center overflow-hidden fixed inset-0" :class="zIndex">
<transition enter-active-class="transition duration-150 ease-in" enter-from-class="opacity-0" <transition
enter-to-class="opacity-100" leave-active-class="transition duration-150 ease-in" leave-from-class="opacity-100" enter-active-class="transition duration-150 ease-in"
leave-to-class="opacity-0"> enter-from-class="opacity-0"
<div class="absolute inset-0 bg-gradient-to-tr opacity-90 dark:from-gray-700 dark:via-gray-900 dark:to-gray-700" enter-to-class="opacity-100"
:class="styleStore.overlayStyle" @click="overlayClick" /> leave-active-class="transition duration-150 ease-in"
</transition> leave-from-class="opacity-100"
<transition enter-active-class="transition duration-100 ease-out" enter-from-class="transform scale-95 opacity-0" leave-to-class="opacity-0"
enter-to-class="transform scale-100 opacity-100" leave-active-class="animate-fade-out"> >
<slot /> <div
</transition> class="absolute inset-0 bg-gradient-to-tr opacity-90 dark:from-gray-700 dark:via-gray-900 dark:to-gray-700"
</div> :class="styleStore.overlayStyle"
@click="overlayClick"
/>
</transition>
<transition
enter-active-class="transition duration-100 ease-out"
enter-from-class="transform scale-95 opacity-0"
enter-to-class="transform scale-100 opacity-100"
leave-active-class="animate-fade-out"
>
<slot />
</transition>
</div>
</template> </template>

71
resources/js/Components/PillTagTrend.vue
View File

@ -1,53 +1,48 @@
<script setup> <script setup>
import { computed } from 'vue' import { computed } from 'vue';
import { mdiChevronUp, mdiChevronDown, mdiAlertCircleOutline } from '@mdi/js' import { mdiChevronUp, mdiChevronDown, mdiAlertCircleOutline } from '@mdi/js';
import PillTag from '@/Components/PillTag.vue' import PillTag from '@/Components/PillTag.vue';
const props = defineProps({ const props = defineProps({
trend: { trend: {
type: String, type: String,
required: true required: true,
}, },
trendType: { trendType: {
type: String, type: String,
default: null default: null,
}, },
small: Boolean small: Boolean,
}) });
const trendStyle = computed(() => { const trendStyle = computed(() => {
if (props.trendType === 'up') { if (props.trendType === 'up') {
return { return {
icon: mdiChevronUp, icon: mdiChevronUp,
style: 'success' style: 'success',
};
} }
}
if (props.trendType === 'down') { if (props.trendType === 'down') {
return { return {
icon: mdiChevronDown, icon: mdiChevronDown,
style: 'danger' style: 'danger',
};
} }
}
if (props.trendType === 'alert') { if (props.trendType === 'alert') {
return { return {
icon: mdiAlertCircleOutline, icon: mdiAlertCircleOutline,
style: 'warning' style: 'warning',
};
} }
}
return { return {
style: 'info' style: 'info',
} };
}) });
</script> </script>
<template> <template>
<PillTag <PillTag :text="trend" :type="trendStyle.style" :icon="trendStyle.icon" :small="small" />
:text="trend"
:type="trendStyle.style"
:icon="trendStyle.icon"
:small="small"
/>
</template> </template>

7
resources/js/Components/ResponsiveNavLink.vue
View File

@ -4,9 +4,10 @@ import { Link } from '@inertiajs/vue3';
const props = defineProps(['href', 'active']); const props = defineProps(['href', 'active']);
const classes = computed(() => props.active const classes = computed(() =>
? 'block pl-3 pr-4 py-2 border-l-4 border-indigo-400 text-base font-medium text-indigo-700 bg-indigo-50 focus:outline-none focus:text-indigo-800 focus:bg-indigo-100 focus:border-indigo-700 transition duration-150 ease-in-out' props.active
: 'block pl-3 pr-4 py-2 border-l-4 border-transparent text-base font-medium text-gray-600 hover:text-gray-800 hover:bg-gray-50 hover:border-gray-300 focus:outline-none focus:text-gray-800 focus:bg-gray-50 focus:border-gray-300 transition duration-150 ease-in-out' ? 'block pl-3 pr-4 py-2 border-l-4 border-indigo-400 text-base font-medium text-indigo-700 bg-indigo-50 focus:outline-none focus:text-indigo-800 focus:bg-indigo-100 focus:border-indigo-700 transition duration-150 ease-in-out'
: 'block pl-3 pr-4 py-2 border-l-4 border-transparent text-base font-medium text-gray-600 hover:text-gray-800 hover:bg-gray-50 hover:border-gray-300 focus:outline-none focus:text-gray-800 focus:bg-gray-50 focus:border-gray-300 transition duration-150 ease-in-out',
); );
</script> </script>

9
resources/js/Components/SearchAutocomplete.vue
View File

@ -52,10 +52,10 @@
:key="i" :key="i"
@click.prevent="setResult(result)" @click.prevent="setResult(result)"
:ref=" :ref="
(el: HTMLLIElement) => { (el: HTMLLIElement) => {
ul[i] = el; ul[i] = el;
} }
" "
> >
<svg class="absolute w-4 h-4 left-2 top-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"> <svg class="absolute w-4 h-4 left-2 top-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
<path <path
@ -167,7 +167,6 @@ watch(search, async () => {
await onChange(); await onChange();
}); });
// function onChange() { // function onChange() {
// if (!props.source || !data.search) { // if (!props.source || !data.search) {
// return false; // return false;

18
resources/js/Components/SectionBannerStarOnGitea.vue
View File

@ -4,16 +4,10 @@ import BaseButton from '@/Components/BaseButton.vue';
import SectionBanner from '@/Components/SectionBanner.vue'; import SectionBanner from '@/Components/SectionBanner.vue';
</script> </script>
<template> <template>
<SectionBanner bg="greenBlue"> <SectionBanner bg="greenBlue">
<h1 class="text-3xl text-white mb-6">Like the project? Please star on <b>Gitea</b>!</h1> <h1 class="text-3xl text-white mb-6">Like the project? Please star on <b>Gitea</b>!</h1>
<div> <div>
<BaseButton <BaseButton href="https://gitea.geologie.ac.at/geolba/tethys" :icon="mdiGithub" label="Gitea" target="_blank" rounded-full />
href="https://gitea.geologie.ac.at/geolba/tethys" </div>
:icon="mdiGithub" </SectionBanner>
label="Gitea"
target="_blank"
rounded-full
/>
</div>
</SectionBanner>
</template> </template>

27
resources/js/Components/SectionTitle.vue
View File

@ -1,22 +1,19 @@
<script setup> <script setup>
defineProps({ defineProps({
custom: Boolean, custom: Boolean,
first: Boolean, first: Boolean,
last: Boolean last: Boolean,
}) });
</script> </script>
<template> <template>
<section <section
class="py-24 px-6 lg:px-0 lg:max-w-2xl lg:mx-auto text-center" class="py-24 px-6 lg:px-0 lg:max-w-2xl lg:mx-auto text-center"
:class="{ '-mb-6':first, '-mt-6':last, '-my-6':!first && !last }" :class="{ '-mb-6': first, '-mt-6': last, '-my-6': !first && !last }"
>
<slot v-if="custom" />
<h1
v-else
class="text-2xl text-gray-500 dark:text-slate-400"
> >
<slot /> <slot v-if="custom" />
</h1> <h1 v-else class="text-2xl text-gray-500 dark:text-slate-400">
</section> <slot />
</h1>
</section>
</template> </template>

75
resources/js/Components/SectionTitleLineWithButton.vue
View File

@ -1,56 +1,35 @@
<script setup> <script setup>
import { mdiCog } from '@mdi/js' import { mdiCog } from '@mdi/js';
import { useSlots, computed } from 'vue' import { useSlots, computed } from 'vue';
import BaseIcon from '@/Components/BaseIcon.vue' import BaseIcon from '@/Components/BaseIcon.vue';
import BaseButton from '@/Components/BaseButton.vue' import BaseButton from '@/Components/BaseButton.vue';
import IconRounded from '@/Components/IconRounded.vue' import IconRounded from '@/Components/IconRounded.vue';
defineProps({ defineProps({
icon: { icon: {
type: String, type: String,
default: null default: null,
}, },
title: { title: {
type: String, type: String,
required: true required: true,
}, },
main: Boolean main: Boolean,
}) });
const hasSlot = computed(() => useSlots().default) const hasSlot = computed(() => useSlots().default);
</script> </script>
<template> <template>
<section <section :class="{ 'pt-6': !main }" class="mb-6 flex items-center justify-between">
:class="{'pt-6':!main}" <div class="flex items-center justify-start">
class="mb-6 flex items-center justify-between" <IconRounded v-if="icon && main" :icon="icon" type="light" class="mr-3" bg />
> <BaseIcon v-else-if="icon" :path="icon" class="mr-2" size="20" />
<div class="flex items-center justify-start"> <h1 :class="main ? 'text-3xl' : 'text-2xl'" class="leading-tight">
<IconRounded {{ title }}
v-if="icon && main" </h1>
:icon="icon" </div>
type="light" <slot v-if="hasSlot" />
class="mr-3" <BaseButton v-else :icon="mdiCog" small />
bg </section>
/>
<BaseIcon
v-else-if="icon"
:path="icon"
class="mr-2"
size="20"
/>
<h1
:class="main ? 'text-3xl' : 'text-2xl'"
class="leading-tight"
>
{{ title }}
</h1>
</div>
<slot v-if="hasSlot" />
<BaseButton
v-else
:icon="mdiCog"
small
/>
</section>
</template> </template>

40
resources/js/Components/TableCheckboxCell.vue
View File

@ -1,33 +1,27 @@
<script setup> <script setup>
import { ref, watch } from 'vue' import { ref, watch } from 'vue';
defineProps({ defineProps({
type: { type: {
type: String, type: String,
default: 'td' default: 'td',
} },
}) });
const emit = defineEmits(['checked']) const emit = defineEmits(['checked']);
const checked = ref(false) const checked = ref(false);
watch(checked, newVal => { watch(checked, (newVal) => {
emit('checked', newVal) emit('checked', newVal);
}) });
</script> </script>
<template> <template>
<component <component :is="type" class="lg:w-1">
:is="type" <label class="checkbox">
class="lg:w-1" <input v-model="checked" type="checkbox" />
> <span class="check" />
<label class="checkbox"> </label>
<input </component>
v-model="checked"
type="checkbox"
>
<span class="check" />
</label>
</component>
</template> </template>

44
resources/js/Components/TableKeywords.vue
View File

@ -120,8 +120,7 @@ const removeItem = (key) => {
<UserAvatar :username="client.value" class="w-24 h-24 mx-auto lg:w-6 lg:h-6" /> <UserAvatar :username="client.value" class="w-24 h-24 mx-auto lg:w-6 lg:h-6" />
</td> --> </td> -->
<td data-label="Type" scope="row"> <td data-label="Type" scope="row">
<FormControl required v-model="item.type" :type="'select'" placeholder="[Enter Language]" <FormControl required v-model="item.type" :type="'select'" placeholder="[Enter Language]" :options="props.subjectTypes">
:options="props.subjectTypes">
<div class="text-red-400 text-sm" v-if="errors[`subjects.${index}.type`]"> <div class="text-red-400 text-sm" v-if="errors[`subjects.${index}.type`]">
{{ errors[`subjects.${index}.type`].join(', ') }} {{ errors[`subjects.${index}.type`].join(', ') }}
</div> </div>
@ -129,17 +128,21 @@ const removeItem = (key) => {
</td> </td>
<td data-label="Value" scope="row"> <td data-label="Value" scope="row">
<SearchCategoryAutocomplete v-if="item.type !== 'uncontrolled'" v-model="item.value" @subject="(language) => { <SearchCategoryAutocomplete
item.language = language; v-if="item.type !== 'uncontrolled'"
} v-model="item.value"
"> @subject="
(language) => {
item.language = language;
}
"
>
<div class="text-red-400 text-sm" v-if="errors[`subjects.${index}.value`]"> <div class="text-red-400 text-sm" v-if="errors[`subjects.${index}.value`]">
{{ errors[`subjects.${index}.value`].join(', ') }} {{ errors[`subjects.${index}.value`].join(', ') }}
</div> </div>
</SearchCategoryAutocomplete> </SearchCategoryAutocomplete>
<FormControl v-else required v-model="item.value" type="text" placeholder="[enter keyword value]" <FormControl v-else required v-model="item.value" type="text" placeholder="[enter keyword value]" :borderless="true">
:borderless="true">
<div class="text-red-400 text-sm" v-if="errors[`subjects.${index}.value`]"> <div class="text-red-400 text-sm" v-if="errors[`subjects.${index}.value`]">
{{ errors[`subjects.${index}.value`].join(', ') }} {{ errors[`subjects.${index}.value`].join(', ') }}
</div> </div>
@ -147,8 +150,14 @@ const removeItem = (key) => {
</td> </td>
<td data-label="Language" scope="row"> <td data-label="Language" scope="row">
<FormControl required v-model="item.language" :type="'select'" placeholder="[Enter Lang]" <FormControl
:options="{ de: 'de', en: 'en' }" :is-read-only="item.type != 'uncontrolled'"> required
v-model="item.language"
:type="'select'"
placeholder="[Enter Lang]"
:options="{ de: 'de', en: 'en' }"
:is-read-only="item.type != 'uncontrolled'"
>
<div class="text-red-400 text-sm" v-if="errors[`subjects.${index}.language`]"> <div class="text-red-400 text-sm" v-if="errors[`subjects.${index}.language`]">
{{ errors[`subjects.${index}.language`].join(', ') }} {{ errors[`subjects.${index}.language`].join(', ') }}
</div> </div>
@ -157,8 +166,7 @@ const removeItem = (key) => {
<td class="before:hidden lg:w-1 whitespace-nowrap" scope="row"> <td class="before:hidden lg:w-1 whitespace-nowrap" scope="row">
<BaseButtons type="justify-start lg:justify-end" no-wrap> <BaseButtons type="justify-start lg:justify-end" no-wrap>
<!-- <BaseButton color="info" :icon="mdiEye" small @click="isModalActive = true" /> --> <!-- <BaseButton color="info" :icon="mdiEye" small @click="isModalActive = true" /> -->
<BaseButton v-if="index > 2" color="danger" :icon="mdiTrashCan" small <BaseButton v-if="index > 2" color="danger" :icon="mdiTrashCan" small @click.prevent="removeItem(index)" />
@click.prevent="removeItem(index)" />
</BaseButtons> </BaseButtons>
</td> </td>
</tr> </tr>
@ -169,8 +177,15 @@ const removeItem = (key) => {
<div class="p-3 lg:px-6 border-t border-gray-100 dark:border-slate-800"> <div class="p-3 lg:px-6 border-t border-gray-100 dark:border-slate-800">
<BaseLevel> <BaseLevel>
<BaseButtons> <BaseButtons>
<BaseButton v-for="page in pagesList" :key="page" :active="page === currentPage" :label="page + 1" small <BaseButton
:outline="styleService.darkMode" @click="currentPage = page" /> v-for="page in pagesList"
:key="page"
:active="page === currentPage"
:label="page + 1"
small
:outline="styleService.darkMode"
@click="currentPage = page"
/>
</BaseButtons> </BaseButtons>
<small>Page {{ currentPageHuman }} of {{ numPages }}</small> <small>Page {{ currentPageHuman }} of {{ numPages }}</small>
</BaseLevel> </BaseLevel>
@ -182,7 +197,6 @@ const removeItem = (key) => {
</template> </template>
<style scoped> <style scoped>
/* tr:nth-child(even) { /* tr:nth-child(even) {
background: gray; background: gray;
} }

15
resources/js/Components/TablePersons.vue
View File

@ -169,10 +169,17 @@ const removeAuthor = (key) => {
{{ option }} {{ option }}
</option> </option>
</select> --> </select> -->
<FormControl required v-model="element.pivot_contributor_type" type="select" <FormControl
:options="contributortypes" placeholder="[relation type]"> required
<div class="text-red-400 text-sm" v-model="element.pivot_contributor_type"
v-if="errors && Array.isArray(errors[`contributors.${index}.pivot_contributor_type`])"> type="select"
:options="contributortypes"
placeholder="[relation type]"
>
<div
class="text-red-400 text-sm"
v-if="errors && Array.isArray(errors[`contributors.${index}.pivot_contributor_type`])"
>
{{ errors[`contributors.${index}.pivot_contributor_type`].join(', ') }} {{ errors[`contributors.${index}.pivot_contributor_type`].join(', ') }}
</div> </div>
</FormControl> </FormControl>

188
resources/js/Components/TableSampleClients.vue
View File

@ -11,7 +11,7 @@ import BaseButton from '@/Components/BaseButton.vue';
import UserAvatar from '@/Components/UserAvatar.vue'; import UserAvatar from '@/Components/UserAvatar.vue';
defineProps({ defineProps({
checkable: Boolean, checkable: Boolean,
}); });
const styleService = StyleService(); const styleService = StyleService();
@ -24,117 +24,123 @@ const perPage = ref(5);
const currentPage = ref(0); const currentPage = ref(0);
const checkedRows = ref([]); const checkedRows = ref([]);
const itemsPaginated = computed(() => const itemsPaginated = computed(() => items.value.slice(perPage.value * currentPage.value, perPage.value * (currentPage.value + 1)));
items.value.slice(perPage.value * currentPage.value, perPage.value * (currentPage.value + 1))
);
const numPages = computed(() => Math.ceil(items.value.length / perPage.value)); const numPages = computed(() => Math.ceil(items.value.length / perPage.value));
const currentPageHuman = computed(() => currentPage.value + 1); const currentPageHuman = computed(() => currentPage.value + 1);
const pagesList = computed(() => { const pagesList = computed(() => {
const pagesList = []; const pagesList = [];
for (let i = 0; i < numPages.value; i++) { for (let i = 0; i < numPages.value; i++) {
pagesList.push(i); pagesList.push(i);
} }
return pagesList; return pagesList;
}); });
const remove = (arr, cb) => { const remove = (arr, cb) => {
const newArr = []; const newArr = [];
arr.forEach((item) => { arr.forEach((item) => {
if (!cb(item)) { if (!cb(item)) {
newArr.push(item); newArr.push(item);
} }
}); });
return newArr; return newArr;
}; };
const checked = (isChecked, client) => { const checked = (isChecked, client) => {
if (isChecked) { if (isChecked) {
checkedRows.value.push(client); checkedRows.value.push(client);
} else { } else {
checkedRows.value = remove(checkedRows.value, (row) => row.id === client.id); checkedRows.value = remove(checkedRows.value, (row) => row.id === client.id);
} }
}; };
</script> </script>
<template> <template>
<CardBoxModal v-model="isModalActive" title="Sample modal"> <CardBoxModal v-model="isModalActive" title="Sample modal">
<p>Lorem ipsum dolor sit amet <b>adipiscing elit</b></p> <p>Lorem ipsum dolor sit amet <b>adipiscing elit</b></p>
<p>This is sample modal</p> <p>This is sample modal</p>
</CardBoxModal> </CardBoxModal>
<CardBoxModal v-model="isModalDangerActive" large-title="Please confirm" button="danger" has-cancel> <CardBoxModal v-model="isModalDangerActive" large-title="Please confirm" button="danger" has-cancel>
<p>Lorem ipsum dolor sit amet <b>adipiscing elit</b></p> <p>Lorem ipsum dolor sit amet <b>adipiscing elit</b></p>
<p>This is sample modal</p> <p>This is sample modal</p>
</CardBoxModal> </CardBoxModal>
<div v-if="checkedRows.length" class="p-3 bg-gray-100/50 dark:bg-slate-800"> <div v-if="checkedRows.length" class="p-3 bg-gray-100/50 dark:bg-slate-800">
<span v-for="checkedRow in checkedRows" :key="checkedRow.id" <span
class="inline-block px-2 py-1 rounded-sm mr-2 text-sm bg-gray-100 dark:bg-slate-700"> v-for="checkedRow in checkedRows"
{{ checkedRow.name }} :key="checkedRow.id"
</span> class="inline-block px-2 py-1 rounded-sm mr-2 text-sm bg-gray-100 dark:bg-slate-700"
</div> >
{{ checkedRow.name }}
</span>
</div>
<table> <table>
<thead> <thead>
<tr> <tr>
<th v-if="checkable" /> <th v-if="checkable" />
<th /> <th />
<th>Name</th> <th>Name</th>
<th>Email</th> <th>Email</th>
<th>City</th> <th>City</th>
<th>Progress</th> <th>Progress</th>
<th>Created</th> <th>Created</th>
<th /> <th />
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr v-for="client in itemsPaginated" :key="client.id"> <tr v-for="client in itemsPaginated" :key="client.id">
<TableCheckboxCell v-if="checkable" @checked="checked($event, client)" /> <TableCheckboxCell v-if="checkable" @checked="checked($event, client)" />
<td class="border-b-0 lg:w-6 before:hidden"> <td class="border-b-0 lg:w-6 before:hidden">
<UserAvatar :username="client.name" class="w-24 h-24 mx-auto lg:w-6 lg:h-6" /> <UserAvatar :username="client.name" class="w-24 h-24 mx-auto lg:w-6 lg:h-6" />
</td> </td>
<td data-label="Name"> <td data-label="Name">
{{ client.name }} {{ client.name }}
</td> </td>
<td data-label="Email"> <td data-label="Email">
{{ client.email }} {{ client.email }}
</td> </td>
<td data-label="City"> <td data-label="City">
{{ client.city }} {{ client.city }}
</td> </td>
<td data-label="Progress" class="lg:w-32"> <td data-label="Progress" class="lg:w-32">
<progress class="flex w-2/5 self-center lg:w-full" max="100" v-bind:value="client.progress"> <progress class="flex w-2/5 self-center lg:w-full" max="100" v-bind:value="client.progress">
{{ client.progress }} {{ client.progress }}
</progress> </progress>
</td> </td>
<td data-label="Created" class="lg:w-1 whitespace-nowrap"> <td data-label="Created" class="lg:w-1 whitespace-nowrap">
<small class="text-gray-500 dark:text-slate-400" :title="client.created">{{ <small class="text-gray-500 dark:text-slate-400" :title="client.created">{{ client.created }}</small>
client.created </td>
}}</small> <td class="before:hidden lg:w-1 whitespace-nowrap">
</td> <BaseButtons type="justify-start lg:justify-end" no-wrap>
<td class="before:hidden lg:w-1 whitespace-nowrap"> <BaseButton color="info" :icon="mdiEye" small @click="isModalActive = true" />
<BaseButtons type="justify-start lg:justify-end" no-wrap> <BaseButton color="danger" :icon="mdiTrashCan" small @click="isModalDangerActive = true" />
<BaseButton color="info" :icon="mdiEye" small @click="isModalActive = true" /> </BaseButtons>
<BaseButton color="danger" :icon="mdiTrashCan" small @click="isModalDangerActive = true" /> </td>
</BaseButtons> </tr>
</td> </tbody>
</tr> </table>
</tbody> <div class="p-3 lg:px-6 border-t border-gray-100 dark:border-slate-800">
</table> <BaseLevel>
<div class="p-3 lg:px-6 border-t border-gray-100 dark:border-slate-800"> <BaseButtons>
<BaseLevel> <BaseButton
<BaseButtons> v-for="page in pagesList"
<BaseButton v-for="page in pagesList" :key="page" :active="page === currentPage" :label="page + 1" small :key="page"
:outline="styleService.darkMode" @click="currentPage = page" /> :active="page === currentPage"
</BaseButtons> :label="page + 1"
<small>Page {{ currentPageHuman }} of {{ numPages }}</small> small
</BaseLevel> :outline="styleService.darkMode"
</div> @click="currentPage = page"
/>
</BaseButtons>
<small>Page {{ currentPageHuman }} of {{ numPages }}</small>
</BaseLevel>
</div>
</template> </template>

44
resources/js/Components/UserAvatar.vue
View File

@ -2,40 +2,36 @@
import { computed } from 'vue'; import { computed } from 'vue';
const props = defineProps({ const props = defineProps({
username: { username: {
type: String, type: String,
required: true, required: true,
}, },
avatar: { avatar: {
type: String, type: String,
default: null, default: null,
}, },
api: { api: {
type: String, type: String,
default: 'avataaars', default: 'avataaars',
}, },
}); });
const avatar = computed( const avatar = computed(
// () => props.avatar ?? `https://avatars.dicebear.com/api/${props.api}/${props.username?.replace(/[^a-z0-9]+/i, '-')}.svg` // () => props.avatar ?? `https://avatars.dicebear.com/api/${props.api}/${props.username?.replace(/[^a-z0-9]+/i, '-')}.svg`
() => props.avatar ?? `https://avatars.dicebear.com/api/initials/${props.username}.svg` () => props.avatar ?? `https://avatars.dicebear.com/api/initials/${props.username}.svg`,
// () => { // () => {
// return props.avatar ?? `https://www.gravatar.com/avatar/${props.username}?s=50`; // return props.avatar ?? `https://www.gravatar.com/avatar/${props.username}?s=50`;
// } // }
); );
const username = computed(() => props.username); const username = computed(() => props.username);
</script> </script>
<template> <template>
<div> <div>
<img <img :src="avatar" :alt="username" class="rounded-full block h-auto w-full max-w-full bg-gray-100 dark:bg-slate-800" />
:src="avatar" </div>
:alt="username"
class="rounded-full block h-auto w-full max-w-full bg-gray-100 dark:bg-slate-800"
/>
</div>
</template> </template>

10
resources/js/Components/unused/ApplicationLogo.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<svg viewBox="0 0 316 316" xmlns="http://www.w3.org/2000/svg"> <svg viewBox="0 0 316 316" xmlns="http://www.w3.org/2000/svg">
<path <path
d="M305.8 81.125C305.77 80.995 305.69 80.885 305.65 80.755C305.56 80.525 305.49 80.285 305.37 80.075C305.29 79.935 305.17 79.815 305.07 79.685C304.94 79.515 304.83 79.325 304.68 79.175C304.55 79.045 304.39 78.955 304.25 78.845C304.09 78.715 303.95 78.575 303.77 78.475L251.32 48.275C249.97 47.495 248.31 47.495 246.96 48.275L194.51 78.475C194.33 78.575 194.19 78.725 194.03 78.845C193.89 78.955 193.73 79.045 193.6 79.175C193.45 79.325 193.34 79.515 193.21 79.685C193.11 79.815 192.99 79.935 192.91 80.075C192.79 80.285 192.71 80.525 192.63 80.755C192.58 80.875 192.51 80.995 192.48 81.125C192.38 81.495 192.33 81.875 192.33 82.265V139.625L148.62 164.795V52.575C148.62 52.185 148.57 51.805 148.47 51.435C148.44 51.305 148.36 51.195 148.32 51.065C148.23 50.835 148.16 50.595 148.04 50.385C147.96 50.245 147.84 50.125 147.74 49.995C147.61 49.825 147.5 49.635 147.35 49.485C147.22 49.355 147.06 49.265 146.92 49.155C146.76 49.025 146.62 48.885 146.44 48.785L93.99 18.585C92.64 17.805 90.98 17.805 89.63 18.585L37.18 48.785C37 48.885 36.86 49.035 36.7 49.155C36.56 49.265 36.4 49.355 36.27 49.485C36.12 49.635 36.01 49.825 35.88 49.995C35.78 50.125 35.66 50.245 35.58 50.385C35.46 50.595 35.38 50.835 35.3 51.065C35.25 51.185 35.18 51.305 35.15 51.435C35.05 51.805 35 52.185 35 52.575V232.235C35 233.795 35.84 235.245 37.19 236.025L142.1 296.425C142.33 296.555 142.58 296.635 142.82 296.725C142.93 296.765 143.04 296.835 143.16 296.865C143.53 296.965 143.9 297.015 144.28 297.015C144.66 297.015 145.03 296.965 145.4 296.865C145.5 296.835 145.59 296.775 145.69 296.745C145.95 296.655 146.21 296.565 146.45 296.435L251.36 236.035C252.72 235.255 253.55 233.815 253.55 232.245V174.885L303.81 145.945C305.17 145.165 306 143.725 306 142.155V82.265C305.95 81.875 305.89 81.495 305.8 81.125ZM144.2 227.205L100.57 202.515L146.39 176.135L196.66 147.195L240.33 172.335L208.29 190.625L144.2 227.205ZM244.75 114.995V164.795L226.39 154.225L201.03 139.625V89.825L219.39 100.395L244.75 114.995ZM249.12 57.105L292.81 82.265L249.12 107.425L205.43 82.265L249.12 57.105ZM114.49 184.425L96.13 194.995V85.305L121.49 70.705L139.85 60.135V169.815L114.49 184.425ZM91.76 27.425L135.45 52.585L91.76 77.745L48.07 52.585L91.76 27.425ZM43.67 60.135L62.03 70.705L87.39 85.305V202.545V202.555V202.565C87.39 202.735 87.44 202.895 87.46 203.055C87.49 203.265 87.49 203.485 87.55 203.695V203.705C87.6 203.875 87.69 204.035 87.76 204.195C87.84 204.375 87.89 204.575 87.99 204.745C87.99 204.745 87.99 204.755 88 204.755C88.09 204.905 88.22 205.035 88.33 205.175C88.45 205.335 88.55 205.495 88.69 205.635L88.7 205.645C88.82 205.765 88.98 205.855 89.12 205.965C89.28 206.085 89.42 206.225 89.59 206.325C89.6 206.325 89.6 206.325 89.61 206.335C89.62 206.335 89.62 206.345 89.63 206.345L139.87 234.775V285.065L43.67 229.705V60.135ZM244.75 229.705L148.58 285.075V234.775L219.8 194.115L244.75 179.875V229.705ZM297.2 139.625L253.49 164.795V114.995L278.85 100.395L297.21 89.825V139.625H297.2Z" d="M305.8 81.125C305.77 80.995 305.69 80.885 305.65 80.755C305.56 80.525 305.49 80.285 305.37 80.075C305.29 79.935 305.17 79.815 305.07 79.685C304.94 79.515 304.83 79.325 304.68 79.175C304.55 79.045 304.39 78.955 304.25 78.845C304.09 78.715 303.95 78.575 303.77 78.475L251.32 48.275C249.97 47.495 248.31 47.495 246.96 48.275L194.51 78.475C194.33 78.575 194.19 78.725 194.03 78.845C193.89 78.955 193.73 79.045 193.6 79.175C193.45 79.325 193.34 79.515 193.21 79.685C193.11 79.815 192.99 79.935 192.91 80.075C192.79 80.285 192.71 80.525 192.63 80.755C192.58 80.875 192.51 80.995 192.48 81.125C192.38 81.495 192.33 81.875 192.33 82.265V139.625L148.62 164.795V52.575C148.62 52.185 148.57 51.805 148.47 51.435C148.44 51.305 148.36 51.195 148.32 51.065C148.23 50.835 148.16 50.595 148.04 50.385C147.96 50.245 147.84 50.125 147.74 49.995C147.61 49.825 147.5 49.635 147.35 49.485C147.22 49.355 147.06 49.265 146.92 49.155C146.76 49.025 146.62 48.885 146.44 48.785L93.99 18.585C92.64 17.805 90.98 17.805 89.63 18.585L37.18 48.785C37 48.885 36.86 49.035 36.7 49.155C36.56 49.265 36.4 49.355 36.27 49.485C36.12 49.635 36.01 49.825 35.88 49.995C35.78 50.125 35.66 50.245 35.58 50.385C35.46 50.595 35.38 50.835 35.3 51.065C35.25 51.185 35.18 51.305 35.15 51.435C35.05 51.805 35 52.185 35 52.575V232.235C35 233.795 35.84 235.245 37.19 236.025L142.1 296.425C142.33 296.555 142.58 296.635 142.82 296.725C142.93 296.765 143.04 296.835 143.16 296.865C143.53 296.965 143.9 297.015 144.28 297.015C144.66 297.015 145.03 296.965 145.4 296.865C145.5 296.835 145.59 296.775 145.69 296.745C145.95 296.655 146.21 296.565 146.45 296.435L251.36 236.035C252.72 235.255 253.55 233.815 253.55 232.245V174.885L303.81 145.945C305.17 145.165 306 143.725 306 142.155V82.265C305.95 81.875 305.89 81.495 305.8 81.125ZM144.2 227.205L100.57 202.515L146.39 176.135L196.66 147.195L240.33 172.335L208.29 190.625L144.2 227.205ZM244.75 114.995V164.795L226.39 154.225L201.03 139.625V89.825L219.39 100.395L244.75 114.995ZM249.12 57.105L292.81 82.265L249.12 107.425L205.43 82.265L249.12 57.105ZM114.49 184.425L96.13 194.995V85.305L121.49 70.705L139.85 60.135V169.815L114.49 184.425ZM91.76 27.425L135.45 52.585L91.76 77.745L48.07 52.585L91.76 27.425ZM43.67 60.135L62.03 70.705L87.39 85.305V202.545V202.555V202.565C87.39 202.735 87.44 202.895 87.46 203.055C87.49 203.265 87.49 203.485 87.55 203.695V203.705C87.6 203.875 87.69 204.035 87.76 204.195C87.84 204.375 87.89 204.575 87.99 204.745C87.99 204.745 87.99 204.755 88 204.755C88.09 204.905 88.22 205.035 88.33 205.175C88.45 205.335 88.55 205.495 88.69 205.635L88.7 205.645C88.82 205.765 88.98 205.855 89.12 205.965C89.28 206.085 89.42 206.225 89.59 206.325C89.6 206.325 89.6 206.325 89.61 206.335C89.62 206.335 89.62 206.345 89.63 206.345L139.87 234.775V285.065L43.67 229.705V60.135ZM244.75 229.705L148.58 285.075V234.775L219.8 194.115L244.75 179.875V229.705ZM297.2 139.625L253.49 164.795V114.995L278.85 100.395L297.21 89.825V139.625H297.2Z"
/> />
</svg> </svg>
</template> </template>

7
resources/js/Components/unused/Input.vue
View File

@ -15,5 +15,10 @@ onMounted(() => {
</script> </script>
<template> <template>
<input class="border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm" :value="modelValue" @input="$emit('update:modelValue', $event.target.value)" ref="input"> <input
class="border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm"
:value="modelValue"
@input="$emit('update:modelValue', $event.target.value)"
ref="input"
/>
</template> </template>

2
resources/js/Dataset.ts
View File

@ -135,4 +135,4 @@ export interface Identifier {
type: string; //'doi' type: string; //'doi'
updated_at: string; //'2023-03-09T09:48:28.000Z' updated_at: string; //'2023-03-09T09:48:28.000Z'
value: string; //'10.24341/tethys.209' value: string; //'10.24341/tethys.209'
} }

12
resources/js/Layouts/LayoutGuest.vue
View File

@ -4,10 +4,10 @@ const styleService = StyleService();
</script> </script>
<template> <template>
<!-- dark; true or false from pinia service --> <!-- dark; true or false from pinia service -->
<div :class="{ dark: styleService.darkMode }"> <div :class="{ dark: styleService.darkMode }">
<div class="bg-gray-50 dark:bg-slate-800 dark:text-slate-100"> <div class="bg-gray-50 dark:bg-slate-800 dark:text-slate-100">
<slot /> <slot />
</div> </div>
</div> </div>
</template> </template>

161
resources/js/Pages/Admin/Role/Create.vue
View File

@ -1,34 +1,30 @@
<script setup> <script setup>
import { Head, Link, useForm, router } from "@inertiajs/vue3" import { Head, Link, useForm, router } from '@inertiajs/vue3';
import { import { mdiAccountKey, mdiArrowLeftBoldOutline, mdiAccount, mdiNoteText, mdiFormTextarea } from '@mdi/js';
mdiAccountKey, import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
mdiArrowLeftBoldOutline, import SectionMain from '@/Components/SectionMain.vue';
mdiAccount, mdiNoteText, mdiFormTextarea import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
} from "@mdi/js" import CardBox from '@/Components/CardBox.vue';
import LayoutAuthenticated from "@/Layouts/LayoutAuthenticated.vue" import FormField from '@/Components/FormField.vue';
import SectionMain from "@/Components/SectionMain.vue" import FormControl from '@/Components/FormControl.vue';
import SectionTitleLineWithButton from "@/Components/SectionTitleLineWithButton.vue" import FormCheckRadioGroup from '@/Components/FormCheckRadioGroup.vue';
import CardBox from "@/Components/CardBox.vue" import BaseDivider from '@/Components/BaseDivider.vue';
import FormField from '@/Components/FormField.vue' import BaseButton from '@/Components/BaseButton.vue';
import FormControl from '@/Components/FormControl.vue' import BaseButtons from '@/Components/BaseButtons.vue';
import FormCheckRadioGroup from '@/Components/FormCheckRadioGroup.vue'
import BaseDivider from '@/Components/BaseDivider.vue'
import BaseButton from '@/Components/BaseButton.vue'
import BaseButtons from '@/Components/BaseButtons.vue'
import { stardust } from '@eidellev/adonis-stardust/client'; import { stardust } from '@eidellev/adonis-stardust/client';
const props = defineProps({ const props = defineProps({
permissions: { permissions: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
}); });
const form = useForm({ const form = useForm({
name: '', name: '',
display_name: '', display_name: '',
description: '', description: '',
permissions: [] permissions: [],
}); });
const submit = async () => { const submit = async () => {
@ -37,58 +33,77 @@ const submit = async () => {
</script> </script>
<template> <template>
<LayoutAuthenticated> <LayoutAuthenticated>
<Head title="Add role" />
<SectionMain>
<SectionTitleLineWithButton :icon="mdiAccountKey" title="Add role" main>
<BaseButton
:route-name="stardust.route('role.index')"
:icon="mdiArrowLeftBoldOutline"
label="Back"
color="white"
rounded-full
small
/>
</SectionTitleLineWithButton>
<!-- <CardBox form @submit.prevent="form.post(stardust.route('role.store'))"> -->
<CardBox form @submit.prevent="submit()">
<FormField label="Name" help="Required. Role name" :class="{ 'text-red-400': form.errors.name }">
<FormControl v-model="form.name" type="text" placeholder="Enter Name" required :error="form.errors.name">
<div class="text-red-400 text-sm" v-if="form.errors.name">
{{ form.errors.name }}
</div>
</FormControl>
</FormField>
<Head title="Add role" /> <FormField label="Display Name" help="Optional. Display name" :class="{ 'text-red-400': form.errors.display_name }">
<SectionMain> <FormControl v-model="form.display_name" name="display_name" :error="form.errors.display_name">
<SectionTitleLineWithButton :icon="mdiAccountKey" title="Add role" main> <div class="text-red-400 text-sm" v-if="form.errors.display_name">
<BaseButton :route-name="stardust.route('role.index')" :icon="mdiArrowLeftBoldOutline" label="Back" color="white" {{ form.errors.display_name }}
rounded-full small /> </div>
</SectionTitleLineWithButton> </FormControl>
<!-- <CardBox form @submit.prevent="form.post(stardust.route('role.store'))"> --> </FormField>
<CardBox form @submit.prevent="submit()">
<FormField label="Name" help="Required. Role name" :class="{ 'text-red-400': form.errors.name }"> <FormField
<FormControl v-model="form.name" type="text" placeholder="Enter Name" required :error="form.errors.name"> label="Description"
<div class="text-red-400 text-sm" v-if="form.errors.name"> help="Optional. Description of new role"
{{ form.errors.name }} :class="{ 'text-red-400': form.errors.description }"
</div> >
</FormControl> <FormControl
</FormField> v-model="form.description"
v-bind:icon="mdiFormTextarea"
name="display_name"
:type="'textarea'"
:error="form.errors.description"
>
<div class="text-red-400 text-sm" v-if="form.errors.description">
{{ form.errors.description }}
</div>
</FormControl>
</FormField>
<FormField label="Display Name" help="Optional. Display name" :class="{ 'text-red-400': form.errors.display_name }"> <BaseDivider />
<FormControl v-model="form.display_name" name="display_name" :error="form.errors.display_name">
<div class="text-red-400 text-sm" v-if="form.errors.display_name">
{{ form.errors.display_name }}
</div>
</FormControl>
</FormField>
<FormField label="Description" help="Optional. Description of new role" :class="{ 'text-red-400': form.errors.description }"> <FormField label="Permissions" wrap-body>
<FormControl v-model="form.description" v-bind:icon="mdiFormTextarea" name="display_name" :type="'textarea'" :error="form.errors.description"> <FormCheckRadioGroup v-model="form.permissions" name="permissions" is-column :options="props.permissions" />
<div class="text-red-400 text-sm" v-if="form.errors.description"> </FormField>
{{ form.errors.description }} <div class="text-red-400 text-sm" v-if="form.errors.permissions && Array.isArray(form.errors.permissions)">
</div> <!-- {{ errors.password_confirmation }} -->
</FormControl> {{ form.errors.permissions.join(', ') }}
</FormField> </div>
<BaseDivider /> <template #footer>
<BaseButtons>
<FormField label="Permissions" wrap-body> <BaseButton
<FormCheckRadioGroup v-model="form.permissions" name="permissions" is-column :options="props.permissions" /> type="submit"
</FormField> color="info"
<div class="text-red-400 text-sm" v-if="form.errors.permissions && Array.isArray(form.errors.permissions)"> label="Submit"
<!-- {{ errors.password_confirmation }} --> :class="{ 'opacity-25': form.processing }"
{{ form.errors.permissions.join(', ') }} :disabled="form.processing"
</div> />
</BaseButtons>
<template #footer> </template>
<BaseButtons> </CardBox>
<BaseButton type="submit" color="info" label="Submit" :class="{ 'opacity-25': form.processing }" </SectionMain>
:disabled="form.processing" /> </LayoutAuthenticated>
</BaseButtons>
</template>
</CardBox>
</SectionMain>
</LayoutAuthenticated>
</template> </template>

159
resources/js/Pages/Admin/Role/Edit.vue
View File

@ -1,43 +1,39 @@
<script setup> <script setup>
import { Head, Link, useForm } from "@inertiajs/vue3" import { Head, Link, useForm } from '@inertiajs/vue3';
import { import { mdiAccountKey, mdiArrowLeftBoldOutline, mdiFormTextarea } from '@mdi/js';
mdiAccountKey, import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
mdiArrowLeftBoldOutline, import SectionMain from '@/Components/SectionMain.vue';
mdiFormTextarea import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
} from "@mdi/js" import CardBox from '@/Components/CardBox.vue';
import LayoutAuthenticated from "@/Layouts/LayoutAuthenticated.vue" import FormField from '@/Components/FormField.vue';
import SectionMain from "@/Components/SectionMain.vue" import FormControl from '@/Components/FormControl.vue';
import SectionTitleLineWithButton from "@/Components/SectionTitleLineWithButton.vue" import FormCheckRadioGroup from '@/Components/FormCheckRadioGroup.vue';
import CardBox from "@/Components/CardBox.vue" import BaseDivider from '@/Components/BaseDivider.vue';
import FormField from '@/Components/FormField.vue' import BaseButton from '@/Components/BaseButton.vue';
import FormControl from '@/Components/FormControl.vue' import BaseButtons from '@/Components/BaseButtons.vue';
import FormCheckRadioGroup from '@/Components/FormCheckRadioGroup.vue'
import BaseDivider from '@/Components/BaseDivider.vue'
import BaseButton from '@/Components/BaseButton.vue'
import BaseButtons from '@/Components/BaseButtons.vue'
import { stardust } from '@eidellev/adonis-stardust/client'; import { stardust } from '@eidellev/adonis-stardust/client';
const props = defineProps({ const props = defineProps({
role: { role: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
permissions: { permissions: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
roleHasPermissions: { roleHasPermissions: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
} },
}) });
const form = useForm({ const form = useForm({
_method: 'put', _method: 'put',
name: props.role.name, name: props.role.name,
description: props.role.description, description: props.role.description,
permissions: props.roleHasPermissions permissions: props.roleHasPermissions,
}) });
const submit = async () => { const submit = async () => {
// await Inertia.post(stardust.route('user.store'), form); // await Inertia.post(stardust.route('user.store'), form);
@ -46,46 +42,65 @@ const submit = async () => {
</script> </script>
<template> <template>
<LayoutAuthenticated> <LayoutAuthenticated>
<Head title="Update role" />
<SectionMain>
<SectionTitleLineWithButton :icon="mdiAccountKey" title="Update role" main>
<BaseButton
:route-name="stardust.route('role.index')"
:icon="mdiArrowLeftBoldOutline"
label="Back"
color="white"
rounded-full
small
/>
</SectionTitleLineWithButton>
<!-- <CardBox form @submit.prevent="form.put(stardust.route('role.update', [props.role.id]))"> -->
<CardBox form @submit.prevent="submit()">
<FormField label="Name" :class="{ 'text-red-400': form.errors.name }">
<FormControl v-model="form.name" type="text" placeholder="Enter Name" required :error="form.errors.name">
<div class="text-red-400 text-sm" v-if="form.errors.name">
{{ form.errors.name }}
</div>
</FormControl>
</FormField>
<Head title="Update role" /> <FormField
<SectionMain> label="Description"
<SectionTitleLineWithButton :icon="mdiAccountKey" title="Update role" main> help="Optional. Description of new role"
<BaseButton :route-name="stardust.route('role.index')" :icon="mdiArrowLeftBoldOutline" label="Back" color="white" :class="{ 'text-red-400': form.errors.description }"
rounded-full small /> >
</SectionTitleLineWithButton> <FormControl
<!-- <CardBox form @submit.prevent="form.put(stardust.route('role.update', [props.role.id]))"> --> v-model="form.description"
<CardBox form @submit.prevent="submit()"> v-bind:icon="mdiFormTextarea"
name="display_name"
<FormField label="Name" :class="{ 'text-red-400': form.errors.name }"> :type="'textarea'"
<FormControl v-model="form.name" type="text" placeholder="Enter Name" required :error="form.errors.name"> :error="form.errors.description"
<div class="text-red-400 text-sm" v-if="form.errors.name"> >
{{ form.errors.name }} <div class="text-red-400 text-sm" v-if="form.errors.description">
</div> {{ form.errors.description }}
</FormControl> </div>
</FormField> </FormControl>
</FormField>
<FormField label="Description" help="Optional. Description of new role" :class="{ 'text-red-400': form.errors.description }"> <BaseDivider />
<FormControl v-model="form.description" v-bind:icon="mdiFormTextarea" name="display_name" :type="'textarea'" :error="form.errors.description">
<div class="text-red-400 text-sm" v-if="form.errors.description">
{{ form.errors.description }}
</div>
</FormControl>
</FormField>
<BaseDivider /> <FormField label="Permissions" wrap-body>
<FormCheckRadioGroup v-model="form.permissions" name="permissions" is-column :options="props.permissions" />
</FormField>
<FormField label="Permissions" wrap-body> <template #footer>
<FormCheckRadioGroup v-model="form.permissions" name="permissions" is-column :options="props.permissions" /> <BaseButtons>
</FormField> <BaseButton
type="submit"
<template #footer> color="info"
<BaseButtons> label="Submit"
<BaseButton type="submit" color="info" label="Submit" :class="{ 'opacity-25': form.processing }" :class="{ 'opacity-25': form.processing }"
:disabled="form.processing" /> :disabled="form.processing"
</BaseButtons> />
</template> </BaseButtons>
</CardBox> </template>
</SectionMain> </CardBox>
</LayoutAuthenticated> </SectionMain>
</LayoutAuthenticated>
</template> </template>

131
resources/js/Pages/Admin/Role/Show.vue
View File

@ -1,79 +1,68 @@
<script setup> <script setup>
import { Head, Link, useForm } from "@inertiajs/vue3" import { Head, Link, useForm } from '@inertiajs/vue3';
import { import { mdiAccountKey, mdiArrowLeftBoldOutline } from '@mdi/js';
mdiAccountKey, import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
mdiArrowLeftBoldOutline, import SectionMain from '@/Components/SectionMain.vue';
} from "@mdi/js" import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
import LayoutAuthenticated from "@/Layouts/LayoutAuthenticated.vue" import CardBox from '@/Components/CardBox.vue';
import SectionMain from "@/Components/SectionMain.vue" import BaseButton from '@/Components/BaseButton.vue';
import SectionTitleLineWithButton from "@/Components/SectionTitleLineWithButton.vue"
import CardBox from "@/Components/CardBox.vue"
import BaseButton from "@/Components/BaseButton.vue"
import { stardust } from '@eidellev/adonis-stardust/client'; import { stardust } from '@eidellev/adonis-stardust/client';
const props = defineProps({ const props = defineProps({
role: { role: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
permissions: { permissions: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
roleHasPermissions: { roleHasPermissions: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
} },
}) });
</script> </script>
<template> <template>
<LayoutAuthenticated> <LayoutAuthenticated>
<Head title="View role" />
<Head title="View role" /> <SectionMain>
<SectionMain> <SectionTitleLineWithButton :icon="mdiAccountKey" title="View role" main>
<SectionTitleLineWithButton :icon="mdiAccountKey" title="View role" main> <BaseButton
<BaseButton :route-name="stardust.route('role.index')" :icon="mdiArrowLeftBoldOutline" label="Back" color="white" :route-name="stardust.route('role.index')"
rounded-full small /> :icon="mdiArrowLeftBoldOutline"
</SectionTitleLineWithButton> label="Back"
<CardBox class="mb-6"> color="white"
<table> rounded-full
<tbody> small
<tr> />
<td class="p-4 pl-8 text-slate-500 dark:text-slate-400 hidden lg:block"> </SectionTitleLineWithButton>
Name <CardBox class="mb-6">
</td> <table>
<td data-label="Name"> <tbody>
{{ role.name }} <tr>
</td> <td class="p-4 pl-8 text-slate-500 dark:text-slate-400 hidden lg:block">Name</td>
</tr> <td data-label="Name">
<tr> {{ role.name }}
<td class="p-4 pl-8 text-slate-500 dark:text-slate-400 hidden lg:block"> </td>
Name </tr>
</td> <tr>
<td data-label="Description"> <td class="p-4 pl-8 text-slate-500 dark:text-slate-400 hidden lg:block">Name</td>
{{ role.description }} <td data-label="Description">
</td> {{ role.description }}
</tr> </td>
<tr> </tr>
<td class=" <tr>
p-4 <td class="p-4 pl-8 text-slate-500 dark:text-slate-400 hidden lg:block">Created</td>
pl-8 <td data-label="Created">
text-slate-500 <!-- {{ new Date(role.created_at).toLocaleString() }} -->
dark:text-slate-400 {{ role.created_at }}
hidden </td>
lg:block </tr>
"> </tbody>
Created </table>
</td> </CardBox>
<td data-label="Created"> </SectionMain>
<!-- {{ new Date(role.created_at).toLocaleString() }} --> </LayoutAuthenticated>
{{ role.created_at }}
</td>
</tr>
</tbody>
</table>
</CardBox>
</SectionMain>
</LayoutAuthenticated>
</template> </template>

37
resources/js/Pages/Admin/User/Create.vue
View File

@ -40,12 +40,17 @@ const submit = async () => {
<template> <template>
<LayoutAuthenticated> <LayoutAuthenticated>
<Head title="Add user" /> <Head title="Add user" />
<SectionMain> <SectionMain>
<SectionTitleLineWithButton :icon="mdiAccountKey" title="Add user" main> <SectionTitleLineWithButton :icon="mdiAccountKey" title="Add user" main>
<BaseButton :route-name="stardust.route('user.index')" :icon="mdiArrowLeftBoldOutline" label="Back" <BaseButton
color="modern" rounded-full small /> :route-name="stardust.route('user.index')"
:icon="mdiArrowLeftBoldOutline"
label="Back"
color="modern"
rounded-full
small
/>
</SectionTitleLineWithButton> </SectionTitleLineWithButton>
<!-- @submit.prevent="form.post(stardust.route('user.store'))" --> <!-- @submit.prevent="form.post(stardust.route('user.store'))" -->
<CardBox form @submit.prevent="submit()"> <CardBox form @submit.prevent="submit()">
@ -68,8 +73,7 @@ const submit = async () => {
</FormField> </FormField>
<FormField label="Password" :class="{ 'text-red-400': errors.password }"> <FormField label="Password" :class="{ 'text-red-400': errors.password }">
<FormControl v-model="form.password" type="password" placeholder="Enter Password" <FormControl v-model="form.password" type="password" placeholder="Enter Password" :errors="errors.password">
:errors="errors.password">
<div class="text-red-400 text-sm" v-if="errors.password && Array.isArray(errors.password)"> <div class="text-red-400 text-sm" v-if="errors.password && Array.isArray(errors.password)">
<!-- {{ errors.password }} --> <!-- {{ errors.password }} -->
{{ errors.password.join(', ') }} {{ errors.password.join(', ') }}
@ -78,10 +82,16 @@ const submit = async () => {
</FormField> </FormField>
<FormField label="Password Confirmation" :class="{ 'text-red-400': errors.password_confirmation }"> <FormField label="Password Confirmation" :class="{ 'text-red-400': errors.password_confirmation }">
<FormControl v-model="form.password_confirmation" type="password" <FormControl
placeholder="Enter Password Confirmation" :errors="errors.password"> v-model="form.password_confirmation"
<div class="text-red-400 text-sm" type="password"
v-if="errors.password_confirmation && Array.isArray(errors.password_confirmation)"> placeholder="Enter Password Confirmation"
:errors="errors.password"
>
<div
class="text-red-400 text-sm"
v-if="errors.password_confirmation && Array.isArray(errors.password_confirmation)"
>
<!-- {{ errors.password_confirmation }} --> <!-- {{ errors.password_confirmation }} -->
{{ errors.password_confirmation.join(', ') }} {{ errors.password_confirmation.join(', ') }}
</div> </div>
@ -100,8 +110,13 @@ const submit = async () => {
<template #footer> <template #footer>
<BaseButtons> <BaseButtons>
<BaseButton type="submit" color="info" label="Submit" :class="{ 'opacity-25': form.processing }" <BaseButton
:disabled="form.processing" /> type="submit"
color="info"
label="Submit"
:class="{ 'opacity-25': form.processing }"
:disabled="form.processing"
/>
</BaseButtons> </BaseButtons>
</template> </template>
</CardBox> </CardBox>

205
resources/js/Pages/Admin/User/Edit.vue
View File

@ -1,49 +1,46 @@
<script setup lang="ts"> <script setup lang="ts">
import { Head, useForm, router } from "@inertiajs/vue3" import { Head, useForm, router } from '@inertiajs/vue3';
import { import { mdiAccountKey, mdiArrowLeftBoldOutline } from '@mdi/js';
mdiAccountKey, import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
mdiArrowLeftBoldOutline import SectionMain from '@/Components/SectionMain.vue';
} from "@mdi/js" import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
import LayoutAuthenticated from "@/Layouts/LayoutAuthenticated.vue" import CardBox from '@/Components/CardBox.vue';
import SectionMain from "@/Components/SectionMain.vue" import FormField from '@/Components/FormField.vue';
import SectionTitleLineWithButton from "@/Components/SectionTitleLineWithButton.vue" import FormControl from '@/Components/FormControl.vue';
import CardBox from "@/Components/CardBox.vue" import FormCheckRadioGroup from '@/Components/FormCheckRadioGroup.vue';
import FormField from '@/Components/FormField.vue' import BaseDivider from '@/Components/BaseDivider.vue';
import FormControl from '@/Components/FormControl.vue' import BaseButton from '@/Components/BaseButton.vue';
import FormCheckRadioGroup from '@/Components/FormCheckRadioGroup.vue' import BaseButtons from '@/Components/BaseButtons.vue';
import BaseDivider from '@/Components/BaseDivider.vue'
import BaseButton from '@/Components/BaseButton.vue'
import BaseButtons from '@/Components/BaseButtons.vue'
import { stardust } from '@eidellev/adonis-stardust/client'; import { stardust } from '@eidellev/adonis-stardust/client';
// import { Inertia } from '@inertiajs/inertia'; // import { Inertia } from '@inertiajs/inertia';
const props = defineProps({ const props = defineProps({
user: { user: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
roles: { roles: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
userHasRoles: { userHasRoles: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
errors: { errors: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
}) });
const form = useForm({ const form = useForm({
_method: 'put', _method: 'put',
login: props.user.login, login: props.user.login,
email: props.user.email, email: props.user.email,
password: '', password: '',
password_confirmation: '', password_confirmation: '',
roles: props.userHasRoles, // fill actual user roles from db roles: props.userHasRoles, // fill actual user roles from db
}) });
const submit = async () => { const submit = async () => {
// await Inertia.post(stardust.route('user.store'), form); // await Inertia.post(stardust.route('user.store'), form);
@ -52,67 +49,83 @@ const submit = async () => {
</script> </script>
<template> <template>
<LayoutAuthenticated> <LayoutAuthenticated>
<Head title="Update user" />
<SectionMain>
<SectionTitleLineWithButton :icon="mdiAccountKey" title="Update user" main>
<BaseButton
:route-name="stardust.route('user.index')"
:icon="mdiArrowLeftBoldOutline"
label="Back"
color="white"
rounded-full
small
/>
</SectionTitleLineWithButton>
<!-- <CardBox form @submit.prevent="form.put(stardust.route('user.update', [props.user.id]))"> -->
<CardBox form @submit.prevent="submit()">
<FormField label="Enter Login" :class="{ 'text-red-400': errors.name }">
<FormControl v-model="form.login" type="text" placeholder="Name" :errors="errors.login">
<div class="text-red-400 text-sm" v-if="errors.login">
{{ errors.login }}
</div>
</FormControl>
</FormField>
<Head title="Update user" /> <FormField label="Enter Email" :class="{ 'text-red-400': errors.email }">
<SectionMain> <FormControl v-model="form.email" type="text" placeholder="Email" :errors="errors.email">
<SectionTitleLineWithButton :icon="mdiAccountKey" title="Update user" main> <div class="text-red-400 text-sm" v-if="errors.email && Array.isArray(errors.email)">
<BaseButton :route-name="stardust.route('user.index')" :icon="mdiArrowLeftBoldOutline" label="Back" {{ errors.email.join(', ') }}
color="white" rounded-full small /> </div>
</SectionTitleLineWithButton> </FormControl>
<!-- <CardBox form @submit.prevent="form.put(stardust.route('user.update', [props.user.id]))"> --> </FormField>
<CardBox form @submit.prevent="submit()">
<FormField label="Enter Login" :class="{ 'text-red-400': errors.name }"> <FormField label="Password" :class="{ 'text-red-400': errors.password }">
<FormControl v-model="form.login" type="text" placeholder="Name" :errors="errors.login"> <FormControl v-model="form.password" type="password" placeholder="Enter Password" :errors="errors.password">
<div class="text-red-400 text-sm" v-if="errors.login"> <div class="text-red-400 text-sm" v-if="errors.password">
{{ errors.login }} {{ errors.password }}
</div> </div>
</FormControl> </FormControl>
</FormField> </FormField>
<FormField label="Enter Email" :class="{ 'text-red-400': errors.email }"> <FormField label="Password Confirmation" :class="{ 'text-red-400': errors.password_confirmation }">
<FormControl v-model="form.email" type="text" placeholder="Email" :errors="errors.email"> <FormControl
<div class="text-red-400 text-sm" v-if="errors.email && Array.isArray(errors.email)"> v-model="form.password_confirmation"
{{ errors.email.join(', ') }} type="password"
</div> placeholder="Enter Password Confirmation"
</FormControl> :errors="errors.password"
</FormField> >
<div
class="text-red-400 text-sm"
v-if="errors.password_confirmation && Array.isArray(errors.password_confirmation)"
>
{{ errors.password_confirmation.join(', ') }}
</div>
</FormControl>
</FormField>
<FormField label="Password" :class="{ 'text-red-400': errors.password }"> <BaseDivider />
<FormControl v-model="form.password" type="password" placeholder="Enter Password" :errors="errors.password">
<div class="text-red-400 text-sm" v-if="errors.password">
{{ errors.password }}
</div>
</FormControl>
</FormField>
<FormField label="Password Confirmation" :class="{ 'text-red-400': errors.password_confirmation }"> <FormField label="Roles" wrap-body :class="{ 'text-red-400': errors.roles }">
<FormControl v-model="form.password_confirmation" type="password" placeholder="Enter Password Confirmation" <FormCheckRadioGroup v-model="form.roles" name="roles" is-column :options="props.roles" />
:errors="errors.password"> </FormField>
<div class="text-red-400 text-sm" v-if="errors.password_confirmation && Array.isArray(errors.password_confirmation)"> <div class="text-red-400 text-sm" v-if="errors.roles && Array.isArray(errors.roles)">
{{ errors.password_confirmation.join(', ') }} <!-- {{ errors.password_confirmation }} -->
</div> {{ errors.roles.join(', ') }}
</FormControl> </div>
</FormField>
<BaseDivider /> <template #footer>
<BaseButtons>
<FormField label="Roles" wrap-body :class="{ 'text-red-400': errors.roles }"> <BaseButton
<FormCheckRadioGroup v-model="form.roles" name="roles" is-column :options="props.roles" /> type="submit"
</FormField> color="info"
<div class="text-red-400 text-sm" v-if="errors.roles && Array.isArray(errors.roles)"> label="Submit"
<!-- {{ errors.password_confirmation }} --> :class="{ 'opacity-25': form.processing }"
{{ errors.roles.join(', ') }} :disabled="form.processing"
</div> />
</BaseButtons>
<template #footer> </template>
<BaseButtons> </CardBox>
<BaseButton type="submit" color="info" label="Submit" :class="{ 'opacity-25': form.processing }" </SectionMain>
:disabled="form.processing" /> </LayoutAuthenticated>
</BaseButtons>
</template>
</CardBox>
</SectionMain>
</LayoutAuthenticated>
</template> </template>

64
resources/js/Pages/Admin/User/Index.vue
View File

@ -2,13 +2,7 @@
// import { Head, Link, useForm, usePage } from '@inertiajs/inertia-vue3'; // import { Head, Link, useForm, usePage } from '@inertiajs/inertia-vue3';
import { Head, Link, useForm, usePage } from '@inertiajs/vue3'; import { Head, Link, useForm, usePage } from '@inertiajs/vue3';
import { ComputedRef } from 'vue'; import { ComputedRef } from 'vue';
import { import { mdiAccountKey, mdiPlus, mdiSquareEditOutline, mdiTrashCan, mdiAlertBoxOutline } from '@mdi/js';
mdiAccountKey,
mdiPlus,
mdiSquareEditOutline,
mdiTrashCan,
mdiAlertBoxOutline,
} from '@mdi/js';
import { computed } from 'vue'; import { computed } from 'vue';
import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue'; import LayoutAuthenticated from '@/Layouts/LayoutAuthenticated.vue';
import SectionMain from '@/Components/SectionMain.vue'; import SectionMain from '@/Components/SectionMain.vue';
@ -59,22 +53,26 @@ const formDelete = useForm({});
// async function destroy(id) { // async function destroy(id) {
const destroy = async (id) => { const destroy = async (id) => {
if (confirm('Are you sure you want to delete?')) { if (confirm('Are you sure you want to delete?')) {
await formDelete.delete(stardust.route('user.destroy', [id])); await formDelete.delete(stardust.route('user.destroy', [id]));
} }
} };
</script> </script>
<template> <template>
<LayoutAuthenticated> <LayoutAuthenticated>
<Head title="Users" /> <Head title="Users" />
<SectionMain> <SectionMain>
<SectionTitleLineWithButton :icon="mdiAccountKey" title="Tethys Users" main> <SectionTitleLineWithButton :icon="mdiAccountKey" title="Tethys Users" main>
<BaseButton v-if="can.create" :route-name="stardust.route('user.create')" :icon="mdiPlus" label="Add" <BaseButton
color="modern" rounded-full small /> v-if="can.create"
:route-name="stardust.route('user.create')"
:icon="mdiPlus"
label="Add"
color="modern"
rounded-full
small
/>
</SectionTitleLineWithButton> </SectionTitleLineWithButton>
<!-- <label>{{ form.search }}</label> --> <!-- <label>{{ form.search }}</label> -->
<NotificationBar v-if="flash.message" color="success" :icon="mdiAlertBoxOutline"> <NotificationBar v-if="flash.message" color="success" :icon="mdiAlertBoxOutline">
@ -85,11 +83,13 @@ const destroy = async (id) => {
<form @submit.prevent="form.get(stardust.route('user.index'))"> <form @submit.prevent="form.get(stardust.route('user.index'))">
<div class="py-2 flex"> <div class="py-2 flex">
<div class="flex pl-4"> <div class="flex pl-4">
<input type="search" v-model="form.search" <input
type="search"
v-model="form.search"
class="rounded-md shadow-sm border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50" class="rounded-md shadow-sm border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50"
placeholder="Search" /> placeholder="Search"
<BaseButton label="Search" type="submit" color="modern" />
class="ml-4 inline-flex items-center px-4 py-2" /> <BaseButton label="Search" type="submit" color="modern" class="ml-4 inline-flex items-center px-4 py-2" />
</div> </div>
</div> </div>
</form> </form>
@ -112,9 +112,11 @@ const destroy = async (id) => {
<tbody> <tbody>
<tr v-for="user in users.data" :key="user.id"> <tr v-for="user in users.data" :key="user.id">
<td data-label="Login"> <td data-label="Login">
<Link v-bind:href="stardust.route('user.show', [user.id])" <Link
class="no-underline hover:underline text-cyan-600 dark:text-cyan-400"> v-bind:href="stardust.route('user.show', [user.id])"
{{ user.login }} class="no-underline hover:underline text-cyan-600 dark:text-cyan-400"
>
{{ user.login }}
</Link> </Link>
<!-- {{ user.id }} --> <!-- {{ user.id }} -->
</td> </td>
@ -124,19 +126,13 @@ const destroy = async (id) => {
<td v-if="can.edit || can.delete" class="before:hidden lg:w-1 whitespace-nowrap"> <td v-if="can.edit || can.delete" class="before:hidden lg:w-1 whitespace-nowrap">
<BaseButtons type="justify-start lg:justify-end" no-wrap> <BaseButtons type="justify-start lg:justify-end" no-wrap>
<BaseButton <BaseButton
v-if="can.edit" v-if="can.edit"
:route-name="stardust.route('user.edit', [user.id])" :route-name="stardust.route('user.edit', [user.id])"
color="info" color="info"
:icon="mdiSquareEditOutline" :icon="mdiSquareEditOutline"
small small
/> />
<BaseButton <BaseButton v-if="can.delete" color="danger" :icon="mdiTrashCan" small @click="destroy(user.id)" />
v-if="can.delete"
color="danger"
:icon="mdiTrashCan"
small
@click="destroy(user.id)"
/>
</BaseButtons> </BaseButtons>
</td> </td>
</tr> </tr>

6
resources/js/Pages/Admin/User/Show.vue
View File

@ -10,9 +10,9 @@ import { stardust } from '@eidellev/adonis-stardust/client';
defineProps({ defineProps({
user: { user: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),
}, },
roles: { roles: {
type: Object, type: Object,
default: () => ({}), default: () => ({}),

70
resources/js/Pages/App.vue
View File

@ -1,19 +1,19 @@
<template> <template>
<div> <div>
<Link href="/app/login">Login</Link> <Link href="/app/login">Login</Link>
<h1 class="text-red-500">Welcome, {{ testing }}</h1> <h1 class="text-red-500">Welcome, {{ testing }}</h1>
<!-- <n-button>Testing</n-button> <!-- <n-button>Testing</n-button>
<n-input v-bind:value="testing"></n-input> --> <n-input v-bind:value="testing"></n-input> -->
<div class="features"> <div class="features">
<ul> <ul>
<li v-for="user in users"> <li v-for="user in users">
<span>{{ user.login }}</span> <span>{{ user.login }}</span>
<span>{{ user.email }}</span> <span>{{ user.email }}</span>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
</template> </template>
<!-- <script> <!-- <script>
@ -52,36 +52,36 @@ export default {
} }
</script> --> </script> -->
<script lang ="ts"> <script lang="ts">
import { Component, Vue, Prop } from 'vue-facing-decorator'; import { Component, Vue, Prop } from 'vue-facing-decorator';
import type User from "App/Models/User"; import type User from 'App/Models/User';
import { Link } from '@inertiajs/vue3'; import { Link } from '@inertiajs/vue3';
import DefaultLayout from '@/Layouts/Default.vue'; import DefaultLayout from '@/Layouts/Default.vue';
// import { NInput, NButton } from 'naive-ui'; // import { NInput, NButton } from 'naive-ui';
@Component({ @Component({
options: { options: {
layout: DefaultLayout, layout: DefaultLayout,
}, },
name: 'AppComponent', name: 'AppComponent',
components: { components: {
Link, Link,
// NInput, // NInput,
// NButton, // NButton,
}, },
}) })
export default class AppComponent extends Vue { export default class AppComponent extends Vue {
// Component Property // Component Property
@Prop({ @Prop({
type: String, type: String,
default: () => (""), default: () => '',
}) })
testing: string; testing: string;
@Prop({ @Prop({
type: Array, type: Array,
default: () => ([]), default: () => [],
}) })
users: Array<User>; users: Array<User>;
} }
</script> </script>

24
resources/js/Pages/Auth/Login.vue
View File

@ -32,12 +32,11 @@ import FormControl from '@/Components/FormControl.vue';
<template> <template>
<LayoutGuest> <LayoutGuest>
<Head title="Login" /> <Head title="Login" />
<SectionFullScreen v-slot="{ cardClass }"> <SectionFullScreen v-slot="{ cardClass }">
<a class="text-2xl font-semibold flex justify-center items-center mb-8 lg:mb-10"> <a class="text-2xl font-semibold flex justify-center items-center mb-8 lg:mb-10">
<img src="/logo.svg" class="h-10 mr-4" alt="Windster Logo"> <img src="/logo.svg" class="h-10 mr-4" alt="Windster Logo" />
<!-- <span class="self-center text-2xl font-bold whitespace-nowrap">Tethys</span> --> <!-- <span class="self-center text-2xl font-bold whitespace-nowrap">Tethys</span> -->
</a> </a>
<!-- Card --> <!-- Card -->
@ -49,13 +48,18 @@ import FormControl from '@/Components/FormControl.vue';
</NotificationBarInCard> </NotificationBarInCard>
<FormField label="Email" label-for="email" help="Please enter your email"> <FormField label="Email" label-for="email" help="Please enter your email">
<FormControl v-model="form.email" :icon="mdiAccount" id="email" autocomplete="email" type="email" <FormControl v-model="form.email" :icon="mdiAccount" id="email" autocomplete="email" type="email" required />
required />
</FormField> </FormField>
<FormField label="Password" label-for="password" help="Please enter your password"> <FormField label="Password" label-for="password" help="Please enter your password">
<FormControl v-model="form.password" :icon="mdiAsterisk" type="password" id="password" <FormControl
autocomplete="current-password" required /> v-model="form.password"
:icon="mdiAsterisk"
type="password"
id="password"
autocomplete="current-password"
required
/>
</FormField> </FormField>
<FormCheckRadioGroup v-model="form.remember" name="remember" :options="{ remember: 'Remember' }" /> <FormCheckRadioGroup v-model="form.remember" name="remember" :options="{ remember: 'Remember' }" />
@ -78,8 +82,12 @@ import FormControl from '@/Components/FormControl.vue';
<BaseButtons> <BaseButtons>
<!-- <BaseButton type="submit" color="info" label="Login" :class="{ 'opacity-25': form.processing }" <!-- <BaseButton type="submit" color="info" label="Login" :class="{ 'opacity-25': form.processing }"
v-bind:disabled="form.processing" /> --> v-bind:disabled="form.processing" /> -->
<button type="submit" v-bind:disabled="form.processing" :class="{ 'opacity-25': form.processing }" <button
class="text-white bg-cyan-600 hover:bg-cyan-700 focus:ring-4 focus:ring-cyan-200 font-medium rounded-lg text-base px-5 py-3 w-full sm:w-auto text-center"> type="submit"
v-bind:disabled="form.processing"
:class="{ 'opacity-25': form.processing }"
class="text-white bg-cyan-600 hover:bg-cyan-700 focus:ring-4 focus:ring-cyan-200 font-medium rounded-lg text-base px-5 py-3 w-full sm:w-auto text-center"
>
Login to your account Login to your account
</button> </button>
<!-- <BaseButton v-if="canResetPassword" :route-name="route('password.request')" color="info" outline <!-- <BaseButton v-if="canResetPassword" :route-name="route('password.request')" color="info" outline

64
resources/js/Pages/Auth/Register.vue
View File

@ -1,18 +1,18 @@
<template> <template>
<div> <div>
<!-- <Link href="/app">Home</Link> <!-- <Link href="/app">Home</Link>
<br /> --> <br /> -->
<h1>Register</h1> <h1>Register</h1>
<form @submit.prevent="submit()" class="max-w-sm"> <form @submit.prevent="submit()" class="max-w-sm">
<!-- <form @submit.prevent="form.post('/app/register')" class="max-w-sm"> --> <!-- <form @submit.prevent="form.post('/app/register')" class="max-w-sm"> -->
<!-- <n-input type="email" v-model:value="form.email" placeholder="email" class="mb-3" /> <!-- <n-input type="email" v-model:value="form.email" placeholder="email" class="mb-3" />
<n-input type="password" v-model:value="form.password" placeholder="Password" class="mb-3" /> --> <n-input type="password" v-model:value="form.password" placeholder="Password" class="mb-3" /> -->
<form-input v-bind:label="'Emai22l'" v-bind:type="'email'" v-model="form.email" /> <form-input v-bind:label="'Emai22l'" v-bind:type="'email'" v-model="form.email" />
<form-input v-bind:label="'Password'" v-bind:type="'password'" v-model="form.password" /> <form-input v-bind:label="'Password'" v-bind:type="'password'" v-model="form.password" />
<!-- <n-button attr-type="submit"> Register </n-button> --> <!-- <n-button attr-type="submit"> Register </n-button> -->
</form> </form>
</div> </div>
</template> </template>
<script> <script>
@ -23,33 +23,33 @@ import { useForm } from '@inertiajs/vue3';
import { Inertia } from '@inertiajs/inertia'; import { Inertia } from '@inertiajs/inertia';
// import { NButton, NInput } from 'naive-ui'; // import { NButton, NInput } from 'naive-ui';
// import { useForm } from '@inertiajs/inertia-vue3' // import { useForm } from '@inertiajs/inertia-vue3'
import FormInput from '@/Components/FormInput.vue' import FormInput from '@/Components/FormInput.vue';
export default { export default {
layout: AuthLayout, layout: AuthLayout,
components: { components: {
NButton, NButton,
// NInput, // NInput,
FormInput FormInput,
}, },
setup() { setup() {
// const form = useForm({ // const form = useForm({
// email: '', // email: '',
// password: '' // password: ''
// }); // });
const form = reactive({ const form = reactive({
email: null, email: null,
password: null, password: null,
}); });
const submit = async () => { const submit = async () => {
await Inertia.post('/app/register', form); await Inertia.post('/app/register', form);
}; };
return { form, submit }; return { form, submit };
}, },
}; };
</script> </script>

194
resources/js/Pages/Dashboard.vue
View File

@ -4,14 +4,14 @@ import { computed, ref, onMounted } from 'vue';
import { MainService } from '@/Stores/main'; import { MainService } from '@/Stores/main';
// import { Inertia } from '@inertiajs/inertia'; // import { Inertia } from '@inertiajs/inertia';
import { import {
mdiAccountMultiple, mdiAccountMultiple,
mdiDatabaseOutline, mdiDatabaseOutline,
mdiChartTimelineVariant, mdiChartTimelineVariant,
mdiFinance, mdiFinance,
mdiMonitorCellphone, mdiMonitorCellphone,
mdiReload, mdiReload,
mdiGithub, mdiGithub,
mdiChartPie, mdiChartPie,
} from '@mdi/js'; } from '@mdi/js';
// import { containerMaxW } from '@/config.js'; // "xl:max-w-6xl xl:mx-auto" // import { containerMaxW } from '@/config.js'; // "xl:max-w-6xl xl:mx-auto"
import * as chartConfig from '@/Components/Charts/chart.config.js'; import * as chartConfig from '@/Components/Charts/chart.config.js';
@ -29,10 +29,10 @@ import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.
import SectionBannerStarOnGitHub from '@/Components/SectionBannerStarOnGitea.vue'; import SectionBannerStarOnGitHub from '@/Components/SectionBannerStarOnGitea.vue';
const chartData = ref(); const chartData = ref();
const fillChartData = () => { const fillChartData = () => {
chartData.value = chartConfig.sampleChartData(); chartData.value = chartConfig.sampleChartData();
}; };
onMounted(() => { onMounted(() => {
fillChartData(); fillChartData();
}); });
const mainService = MainService(); const mainService = MainService();
/* Fetch sample data */ /* Fetch sample data */
@ -57,88 +57,114 @@ const datasets = computed(() => mainService.datasets);
</script> </script>
<template> <template>
<LayoutAuthenticated> <LayoutAuthenticated>
<Head title="Dashboard" />
<Head title="Dashboard" /> <!-- <section class="p-6" v-bind:class="containerMaxW"> -->
<SectionMain>
<SectionTitleLineWithButton v-bind:icon="mdiChartTimelineVariant" title="Overview" main>
<BaseButton
href="https://gitea.geologie.ac.at/geolba/tethys"
target="_blank"
:icon="mdiGithub"
label="Star on Gitea"
color="contrast"
rounded-full
small
/>
</SectionTitleLineWithButton>
<!-- <section class="p-6" v-bind:class="containerMaxW"> --> <div class="grid grid-cols-1 gap-6 lg:grid-cols-3 mb-6">
<SectionMain> <CardBoxWidget
<SectionTitleLineWithButton v-bind:icon="mdiChartTimelineVariant" title="Overview" main> trend="12%"
<BaseButton href="https://gitea.geologie.ac.at/geolba/tethys" target="_blank" :icon="mdiGithub" trend-type="up"
label="Star on Gitea" color="contrast" rounded-full small /> color="text-emerald-500"
</SectionTitleLineWithButton> :icon="mdiAccountMultiple"
:number="authors.length"
<div class="grid grid-cols-1 gap-6 lg:grid-cols-3 mb-6"> label="Authors"
<CardBoxWidget trend="12%" trend-type="up" color="text-emerald-500" :icon="mdiAccountMultiple" />
:number="authors.length" label="Authors" /> <CardBoxWidget
<CardBoxWidget trend="193" trend-type="info" color="text-blue-500" :icon="mdiDatabaseOutline" trend="193"
:number="datasets.length" label="Publications" /> trend-type="info"
<!-- <CardBoxWidget trend="193" trend-type="info" color="text-blue-500" :icon="mdiCartOutline" :number="datasets.length" color="text-blue-500"
:icon="mdiDatabaseOutline"
:number="datasets.length"
label="Publications"
/>
<!-- <CardBoxWidget trend="193" trend-type="info" color="text-blue-500" :icon="mdiCartOutline" :number="datasets.length"
prefix="$" label="Publications" /> --> prefix="$" label="Publications" /> -->
<CardBoxWidget trend="Overflow" trend-type="alert" color="text-red-500" :icon="mdiChartTimelineVariant" <CardBoxWidget
:number="256" suffix="%" label="Performance" /> trend="Overflow"
</div> trend-type="alert"
color="text-red-500"
:icon="mdiChartTimelineVariant"
:number="256"
suffix="%"
label="Performance"
/>
</div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-6"> <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-6">
<div class="flex flex-col justify-between"> <div class="flex flex-col justify-between">
<CardBoxClient v-for="client in authorBarItems" :key="client.id" :name="client.name" <CardBoxClient
:email="client.email" :date="client.created_at" :text="client.datasetCount" /> v-for="client in authorBarItems"
</div> :key="client.id"
<div class="flex flex-col justify-between"> :name="client.name"
<CardBoxTransaction v-for="(transaction, index) in transactionBarItems" :key="index" :email="client.email"
:amount="transaction.amount" :date="transaction.date" :business="transaction.business" :date="client.created_at"
:type="transaction.type" :name="transaction.name" :account="transaction.account" /> :text="client.datasetCount"
</div> />
</div> </div>
<div class="flex flex-col justify-between">
<CardBoxTransaction
v-for="(transaction, index) in transactionBarItems"
:key="index"
:amount="transaction.amount"
:date="transaction.date"
:business="transaction.business"
:type="transaction.type"
:name="transaction.name"
:account="transaction.account"
/>
</div>
</div>
<SectionBannerStarOnGitHub /> <SectionBannerStarOnGitHub />
<SectionTitleLineWithButton :icon="mdiChartPie" title="Trends overview (to do publications per year)" /> <SectionTitleLineWithButton :icon="mdiChartPie" title="Trends overview (to do publications per year)" />
<CardBox title="Performance" :icon="mdiFinance" :header-icon="mdiReload" class="mb-6" <CardBox title="Performance" :icon="mdiFinance" :header-icon="mdiReload" class="mb-6" @header-icon-click="fillChartData">
@header-icon-click="fillChartData"> <div v-if="chartData">
<div v-if="chartData"> <line-chart :data="chartData" class="h-96" />
<line-chart :data="chartData" class="h-96" /> </div>
</div> </CardBox>
</CardBox>
<SectionTitleLineWithButton :icon="mdiAccountMultiple" title="Submitters (to do)" /> <SectionTitleLineWithButton :icon="mdiAccountMultiple" title="Submitters (to do)" />
<NotificationBar color="info" :icon="mdiMonitorCellphone"> <NotificationBar color="info" :icon="mdiMonitorCellphone"> <b>Responsive table.</b> Collapses on mobile </NotificationBar>
<b>Responsive table.</b> Collapses on mobile
</NotificationBar>
<CardBox :icon="mdiMonitorCellphone" title="Responsive table" has-table> <CardBox :icon="mdiMonitorCellphone" title="Responsive table" has-table>
<TableSampleClients /> <TableSampleClients />
</CardBox> </CardBox>
<CardBox> <CardBox>
<p class="mb-3 text-gray-500 dark:text-gray-400"> <p class="mb-3 text-gray-500 dark:text-gray-400">
Discover the power of Tethys, the cutting-edge web backend solution that revolutionizes the way you Discover the power of Tethys, the cutting-edge web backend solution that revolutionizes the way you handle research
handle data. At the heart of Tethys lies our meticulously developed research data repository, which leverages state-of-the-art
research data. At the heart of Tethys lies our meticulously developed research data repository, which CI/CD techniques to deliver a seamless and efficient experience.
leverages state-of-the-art CI/CD techniques to deliver a seamless and efficient experience. </p>
</p> <p class="mb-3 text-gray-500 dark:text-gray-400">
<p class="mb-3 text-gray-500 dark:text-gray-400"> CI/CD, or Continuous Integration and Continuous Deployment, is a modern software development approach that ensures your
CI/CD, or Continuous Integration and Continuous Deployment, is a modern software development approach code undergoes automated testing, continuous integration, and frequent deployment. By embracing CI/CD techniques, we
that ensure that every code change in our research data repository is thoroughly validated, enhancing reliability and
ensures your code undergoes automated testing, continuous integration, and frequent deployment. By accelerating development cycles.
embracing </p>
CI/CD techniques, we ensure that every code change in our research data repository is thoroughly <p class="mb-3 text-gray-500 dark:text-gray-400">
validated, With Tethys, you can say goodbye to the complexities of manual deployments and embrace a streamlined process that
enhancing reliability and accelerating development cycles. eliminates errors and minimizes downtime. Our CI/CD pipeline automatically verifies each code commit, runs comprehensive
</p> tests, and deploys the repository seamlessly, ensuring that your research data is always up-to-date and accessible.
<p class="mb-3 text-gray-500 dark:text-gray-400"> </p>
With Tethys, you can say goodbye to the complexities of manual deployments and embrace a streamlined </CardBox>
process </SectionMain>
that eliminates errors and minimizes downtime. Our CI/CD pipeline automatically verifies each code <!-- </section> -->
commit, </LayoutAuthenticated>
runs comprehensive tests, and deploys the repository seamlessly, ensuring that your research data is
always
up-to-date and accessible.
</p>
</CardBox>
</SectionMain>
<!-- </section> -->
</LayoutAuthenticated>
</template> </template>

357
resources/js/Pages/Map.vue
View File

@ -1,312 +1,103 @@
<script setup lang="ts"> <script setup lang="ts">
import { Head } from '@inertiajs/vue3'; import { Head } from '@inertiajs/vue3';
import { onMounted, onUnmounted, ref, Ref } from 'vue'; import { ref, Ref } from 'vue';
// import { MainService } from '@/Stores/main';; import { mdiChartTimelineVariant } from '@mdi/js';
import {
mdiChartTimelineVariant
} from '@mdi/js';
import LayoutGuest from '@/Layouts/LayoutGuest.vue'; import LayoutGuest from '@/Layouts/LayoutGuest.vue';
import SectionMain from '@/Components/SectionMain.vue'; import SectionMain from '@/Components/SectionMain.vue';
// import CardBox from '@/Components/CardBox.vue';
import BaseButton from '@/Components/BaseButton.vue'; import BaseButton from '@/Components/BaseButton.vue';
import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue'; import SectionTitleLineWithButton from '@/Components/SectionTitleLineWithButton.vue';
// import SectionBannerStarOnGitHub from '@/Components/SectionBannerStarOnGitea.vue';
import { Map } from 'leaflet/src/map/index';
import { Rectangle } from 'leaflet';
import { canvas } from 'leaflet/src/layer/vector/Canvas';
import { svg } from 'leaflet/src/layer/vector/SVG';
import { MapOptions } from '@/Components/Map/MapOptions'; import { MapOptions } from '@/Components/Map/MapOptions';
import axios from 'axios';
import { LatLngBoundsExpression } from 'leaflet/src/geo/LatLngBounds';
import { tileLayerWMS } from 'leaflet/src/layer/tile/TileLayer.WMS';
import { Attribution } from 'leaflet/src/control/Control.Attribution';
import { stardust } from '@eidellev/adonis-stardust/client'; import { stardust } from '@eidellev/adonis-stardust/client';
import DrawControlComponent from '@/Components/Map/draw.component.vue'; import SearchMap from '@/Components/Map/SearchMap.vue';
import { MapService } from '@/Stores/map.service';
import { LayerGroup } from 'leaflet/src/layer/LayerGroup'
import { OpensearchDocument } from '@/Dataset'; import { OpensearchDocument } from '@/Dataset';
Map.include({ // const fitBounds: LatLngBoundsExpression = [
// @namespace Map; @method getRenderer(layer: Path): Renderer // [46.4318173285, 9.47996951665],
// Returns the instance of `Renderer` that should be used to render the given // [49.0390742051, 16.9796667823],
// `Path`. It will ensure that the `renderer` options of the map and paths // ];
// are respected, and that the renderers do exist on the map.
getRenderer: function (layer) {
// @namespace Path; @option renderer: Renderer
// Use this specific instance of `Renderer` for this path. Takes
// precedence over the map's [default renderer](#map-renderer).
var renderer = layer.options.renderer || this._getPaneRenderer(layer.options.pane) || this.options.renderer || this._renderer;
if (!renderer) { // const mapId = 'map';
renderer = this._renderer = this._createRenderer();
}
if (!this.hasLayer(renderer)) { // const coverage = {
this.addLayer(renderer); // x_min: undefined,
} // y_min: undefined,
return renderer; // x_max: undefined,
}, // y_max: undefined,
// elevation_min: undefined,
// elevation_max: undefined,
// elevation_absolut: undefined,
// depth_min: undefined,
// depth_max: undefined,
// depth_absolut: undefined,
// time_min: undefined,
// time_max: undefined,
// time_absolut: undefined,
// };
_getPaneRenderer: function (name) {
if (name === 'overlayPane' || name === undefined) {
return false;
}
var renderer = this._paneRenderers[name];
if (renderer === undefined) {
renderer = this._createRenderer({ pane: name });
this._paneRenderers[name] = renderer;
}
return renderer;
},
_createRenderer: function (options) {
// @namespace Map; @option preferCanvas: Boolean = false
// Whether `Path`s should be rendered on a `Canvas` renderer.
// By default, all `Path`s are rendered in a `SVG` renderer.
return (this.options.preferCanvas && canvas(options)) || svg(options);
},
});
const DEFAULT_BASE_LAYER_NAME = 'BaseLayer';
const DEFAULT_BASE_LAYER_ATTRIBUTION = '&copy; <a target="_blank" href="http://osm.org/copyright">OpenStreetMap</a> contributors';
const OPEN_SEARCH_HOST = 'http://192.168.21.18';
let map: Map;
const fitBounds: LatLngBoundsExpression = [
[46.4318173285, 9.47996951665],
[49.0390742051, 16.9796667823],
];
const mapId = 'map';
const draw: Ref<DrawControlComponent | null> = ref(null);
const southWest = ref(null);
const northEast = ref(null);
const mapService = MapService();
const coverage = {
x_min: undefined,
y_min: undefined,
x_max: undefined,
y_max: undefined,
elevation_min: undefined,
elevation_max: undefined,
elevation_absolut: undefined,
depth_min: undefined,
depth_max: undefined,
depth_absolut: undefined,
time_min: undefined,
time_max: undefined,
time_absolut: undefined,
};
const filterLayerGroup = new LayerGroup();
// Replace with your actual data // Replace with your actual data
const datasets: Ref<OpensearchDocument[]> = ref([]); const datasets: Ref<OpensearchDocument[]> = ref([]);
const openAccessLicences: Array<string> = ['CC-BY-4.0', 'CC-BY-SA-4.0'];
onMounted(() => {
initMap();
});
onUnmounted(() => {
map.off('zoomend zoomlevelschange');
});
const mapOptions: MapOptions = { const mapOptions: MapOptions = {
center: [48.208174, 16.373819], center: [48.208174, 16.373819],
zoom: 3, zoom: 3,
zoomControl: false, zoomControl: false,
attributionControl: false, attributionControl: false,
};
const initMap = async () => {
// init leaflet map
map = new Map('map', mapOptions);
mapService.setMap(mapId, map);
map.scrollWheelZoom.disable();
map.fitBounds(fitBounds);
draw.value?.toggleDraw();
map.addLayer(filterLayerGroup);
const attributionControl = new Attribution().addTo(map);
attributionControl.setPrefix(false);
let osmGgray = tileLayerWMS('https://ows.terrestris.de/osm-gray/service', {
format: 'image/png',
attribution: DEFAULT_BASE_LAYER_ATTRIBUTION,
layers: 'OSM-WMS',
});
let layerOptions = {
label: DEFAULT_BASE_LAYER_NAME,
visible: true,
layer: osmGgray,
};
layerOptions.layer.addTo(map);
map.on('Draw.Event.CREATED', handleDrawEventCreated);
// // const query = {
// // query: {
// // term: {
// // id: "103"
// // }
// // }
// // };
// // to do : call extra method:
// const query = {
// // q: 'id:103'
// // q: 'author:"Iglseder, Christoph" OR title:"Datensatz"',
// // q: 'author:"Iglseder"',
// q: '*',
// _source: 'author,bbox_xmin,bbox_xmax,bbox_ymin,bbox_ymax,abstract,title',
// size: 1000
// // qf:"title^3 author^2 subject^1",
// }
// try {
// let response = await axios({
// method: 'GET',
// url: OPEN_SEARCH_HOST + '/tethys-records/_search',
// headers: { 'Content-Type': 'application/json' },
// params: query
// });
// // Loop through the hits in the response
// response.data.hits.hits.forEach(hit => {
// // Get the geo_location attribute
// // var geo_location = hit._source.geo_location;
// let xMin = hit._source.bbox_xmin;
// let xMax = hit._source.bbox_xmax;
// let yMin = hit._source.bbox_ymin;
// let yMax = hit._source.bbox_ymax;
// var bbox: LatLngBoundsExpression = [[yMin, xMin], [yMax, xMax]];
// // Parse the WKT string to get the bounding box coordinates
// // var bbox = wktToBbox(geo_location);
// // // Add the bounding box to the map as a rectangle
// new Rectangle(bbox, { color: "#ff7800", weight: 1 }).addTo(map);
// // console.log(hit._source);
// });
// } catch (error) {
// console.error(error);
// }
};
const handleDrawEventCreated = async (event) => {
filterLayerGroup.clearLayers();
datasets.value = [];
let layer = event.layer;
let bounds = layer.getBounds();
// coverage.x_min = bounds.getSouthWest().lng;
// coverage.y_min = bounds.getSouthWest().lat;
// coverage.x_max = bounds.getNorthEast().lng;
// coverage.y_max = bounds.getNorthEast().lat;
try {
let response = await axios({
method: 'POST',
url: OPEN_SEARCH_HOST + '/tethys-records/_search',
headers: { 'Content-Type': 'application/json' },
data: {
"size": 1000,
"query": {
"bool": {
"must": {
"match_all": {}
},
"filter": {
"geo_bounding_box": {
"geo_location": { // replace 'location' with your geo-point field name
"top_left": {
"lat": bounds.getNorthEast().lat,
"lon": bounds.getSouthWest().lng
},
"bottom_right": {
"lat": bounds.getSouthWest().lat,
"lon": bounds.getNorthEast().lng
}
}
}
}
}
// _source: 'author,bbox_xmin,bbox_xmax,bbox_ymin,bbox_ymax,abstract,title',
// "size": 1000
}
}
});
// Loop through the hits in the response
response.data.hits.hits.forEach(hit => {
// Get the geo_location attribute
// var geo_location = hit._source.geo_location;
let xMin = hit._source.bbox_xmin;
let xMax = hit._source.bbox_xmax;
let yMin = hit._source.bbox_ymin;
let yMax = hit._source.bbox_ymax;
var bbox: LatLngBoundsExpression = [[yMin, xMin], [yMax, xMax]];
// Parse the WKT string to get the bounding box coordinates
// var bbox = wktToBbox(geo_location);
// // Add the bounding box to the map as a rectangle
let rect = new Rectangle(bbox, { color: "#ff7800", weight: 1 });
filterLayerGroup.addLayer(rect);
datasets.value.push(hit._source);
});
} catch (error) {
console.error(error);
}
}; };
</script> </script>
<template> <template>
<LayoutGuest> <LayoutGuest>
<Head title="Map" />
<Head title="Map" /> <!-- <section class="p-6" v-bind:class="containerMaxW"> -->
<SectionMain>
<!-- <section class="p-6" v-bind:class="containerMaxW"> --> <SectionTitleLineWithButton v-bind:icon="mdiChartTimelineVariant" title="Tethys Map" main>
<SectionMain> <!-- <BaseButton href="https://gitea.geologie.ac.at/geolba/tethys" target="_blank" :icon="mdiGithub"
<SectionTitleLineWithButton v-bind:icon="mdiChartTimelineVariant" title="Tethys Map" main>
<!-- <BaseButton href="https://gitea.geologie.ac.at/geolba/tethys" target="_blank" :icon="mdiGithub"
label="Star on Gitea" color="contrast" rounded-full small /> --> label="Star on Gitea" color="contrast" rounded-full small /> -->
<BaseButton :route-name="stardust.route('app.login.show')" label="Login" color="white" rounded-full small /> <BaseButton :route-name="stardust.route('app.login.show')" label="Login" color="white" rounded-full small />
</SectionTitleLineWithButton> </SectionTitleLineWithButton>
<!-- <SectionBannerStarOnGitea /> -->
<!-- <SectionBannerStarOnGitHub /> --> <!-- <CardBox> -->
<!-- <div id="map" class="map-container mapDesktop mt-6 mb-6 rounded-2xl py-12 px-6 text-center">
<!-- <CardBox> -->
<div id="map" class="map-container mapDesktop mt-6 mb-6 rounded-2xl py-12 px-6 text-center">
<DrawControlComponent ref="draw" :preserve="false" :mapId="mapId" :southWest="southWest" <DrawControlComponent ref="draw" :preserve="false" :mapId="mapId" :southWest="southWest"
:northEast="northEast"> :northEast="northEast">
</DrawControlComponent> </DrawControlComponent>
</div> </div> -->
<SearchMap :datasets="datasets" :map-options="mapOptions"></SearchMap>
<div d="search-result-list-wrapper" class="flex flex-wrap col-span-24"> <div d="search-result-list-wrapper" class="flex flex-wrap col-span-24 h-full">
<div v-for="dataset in datasets" :key="dataset.id" class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 p-4"> <div v-for="dataset in datasets" :key="dataset.id" class="w-full sm:w-1/2 md:w-1/3 lg:w-1/4 p-4">
<div class="bg-white rounded shadow p-6"> <div class="bg-white rounded shadow p-6">
<h2 class="text-xl font-bold mb-2">{{ dataset.title_output }}</h2> <h3 class="text-lg leading-tight text-gray-500 dark:text-slate-400">
<p class="text-gray-700 mb-2">{{ dataset.abstract_output }}</p> {{ dataset.title_output }}
<div class="text-sm text-gray-600"> </h3>
<div v-for="author in dataset.author" :key="author" class="mb-1">{{ author }}</div> <!-- <h2 class="text-xl font-bold mb-2">{{ dataset.title_output }}</h2> -->
</div> <p class="text-gray-700 mb-2">{{ dataset.abstract_output }}</p>
<div class="mt-4"> <div class="text-sm text-gray-600">
<span <div v-for="author in dataset.author" :key="author" class="mb-1">{{ author }}</div>
class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">{{ </div>
dataset.year }}</span> <div class="mt-4">
<span <span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">
class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">{{ {{ dataset.year }}
dataset.language }}</span> </span>
</div> <span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 mb-2">
</div> {{ dataset.language }}
</div> </span>
</div> </div>
<p>
</SectionMain> <span class="label"><i class="fas fa-file"></i> {{ dataset.doctype }}</span>
<!-- </section> --> <!-- <span>Licence: {{ document.licence }}</span> -->
</LayoutGuest></template> <span v-if="openAccessLicences.includes(dataset.licence)" class="label titlecase"
><i class="fas fa-lock-open"></i> Open Access</span
>
</p>
</div>
</div>
</div>
</SectionMain>
<!-- </section> -->
</LayoutGuest>
</template>

47
resources/js/Pages/register-view/register-view-component.vue
View File

@ -1,31 +1,30 @@
<template> <template>
<div> <div>
<!-- <Link href="/app">Home</Link> <!-- <Link href="/app">Home</Link>
<br /> --> <br /> -->
<h1>Register</h1> <h1>Register</h1>
<form v-on:submit.prevent="submit()" class="max-w-sm"> <form v-on:submit.prevent="submit()" class="max-w-sm">
<!-- <form @submit.prevent="form.post('/app/register')" class="max-w-sm"> --> <!-- <form @submit.prevent="form.post('/app/register')" class="max-w-sm"> -->
<!-- <n-input type="email" v-model:value="form.email" placeholder="email" class="mb-3" /> --> <!-- <n-input type="email" v-model:value="form.email" placeholder="email" class="mb-3" /> -->
<!-- <n-input type="password" v-model:value="form.password" placeholder="Password" class="mb-3" /> --> <!-- <n-input type="password" v-model:value="form.password" placeholder="Password" class="mb-3" /> -->
<!-- <n-input v-bind:label="'Emai22l'" v-model:value="form.email" /> <!-- <n-input v-bind:label="'Emai22l'" v-model:value="form.email" />
<n-input v-bind:label="'Password'" v-bind:type="'password'" v-model:value="form.password" /> --> <n-input v-bind:label="'Password'" v-bind:type="'password'" v-model:value="form.password" /> -->
<!-- <form-input v-bind:label="'Password'" v-bind:type="'password'" v-model="form.password" /> --> <!-- <form-input v-bind:label="'Password'" v-bind:type="'password'" v-model="form.password" /> -->
<form-input v-bind:label="'Emai22l'" v-bind:type="'email'" v-model="form.email" :errors="errors.email" /> <form-input v-bind:label="'Emai22l'" v-bind:type="'email'" v-model="form.email" :errors="errors.email" />
<form-input v-bind:label="'Password'" v-bind:type="'password'" v-model="form.password" :errors="errors.password"/> <form-input v-bind:label="'Password'" v-bind:type="'password'" v-model="form.password" :errors="errors.password" />
<n-button attr-type="submit"> Register </n-button> <n-button attr-type="submit"> Register </n-button>
</form> </form>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import RegisterViewComponent from "@/Pages/register-view/register-view-component"; import RegisterViewComponent from '@/Pages/register-view/register-view-component';
// import RegisterViewComponent from "./register-view-component"; // import RegisterViewComponent from "./register-view-component";
// const test = RegisterViewComponent; // const test = RegisterViewComponent;
export default RegisterViewComponent; export default RegisterViewComponent;
// import { Component, Vue, Prop } from "vue-facing-decorator"; // import { Component, Vue, Prop } from "vue-facing-decorator";
// import AuthLayout from '@/Layouts/Auth.vue'; // import AuthLayout from '@/Layouts/Auth.vue';
// // import { reactive } from 'vue'; // // import { reactive } from 'vue';
@ -34,8 +33,6 @@ export default RegisterViewComponent;
// import FormInput from '@/Components/FormInput.vue';// @/Components/FormInput.vue' // import FormInput from '@/Components/FormInput.vue';// @/Components/FormInput.vue'
// // import { defineComponent } from 'vue'; // // import { defineComponent } from 'vue';
// export default { // export default {
// layout: AuthLayout, // layout: AuthLayout,
@ -95,15 +92,15 @@ export default RegisterViewComponent;
// }, // },
// name: "RegisterViewComponent", // name: "RegisterViewComponent",
// components: { // components: {
// NButton, // NButton,
// FormInput // FormInput
// }, // },
// }) // })
// export default class RegisterViewComponent extends Vue { // export default class RegisterViewComponent extends Vue {
// @Prop() // @Prop()
// type!: string; // type!: string;
// public form = { // public form = {
// email: null, // email: null,
// password: null, // password: null,
@ -115,14 +112,14 @@ export default RegisterViewComponent;
// await Inertia.post('/app/register', this.form); // await Inertia.post('/app/register', this.form);
// } // }
// } // }
// </script> //
</script>
<!-- <style scoped> <!-- <style scoped>
.greeting { .greeting {
color: red; color: red;
font-weight: bold; font-weight: bold;
} }
</style> --> </style> -->

116
tsconfig.json
View File

@ -1,67 +1,55 @@
{ {
"extends": "adonis-preset-ts/tsconfig.json", "extends": "adonis-preset-ts/tsconfig.json",
"include": [ "include": [
// "**/*", // "**/*",
"**/*", "**/*"
// "./resources/js/**/*" // "./resources/js/**/*"
// "./resources/js/**/*.vue", // "./resources/js/**/*.vue",
// "./resources/js/**/*.ts", // "./resources/js/**/*.ts",
// "./resources/js/**/*.vue", // "./resources/js/**/*.vue",
], ],
"exclude": [ "exclude": [
"node_modules", "node_modules",
"build", "build",
"public" "public"
// "src/**/js/*.js" // "src/**/js/*.js"
], ],
"compilerOptions": { "compilerOptions": {
"allowJs": true, "allowJs": true,
"outDir": "build", "outDir": "build",
"rootDir": "./", "rootDir": "./",
"sourceMap": true, "sourceMap": true,
// "moduleResolution": "node", //neu // "moduleResolution": "node", //neu
"experimentalDecorators": true, //neu "experimentalDecorators": true, //neu
"strictPropertyInitialization": false, //neu "strictPropertyInitialization": false, //neu
// Target latest language version 'esnext' of ECMAScript or minimal 'es6'. // Target latest language version 'esnext' of ECMAScript or minimal 'es6'.
"target": "esnext", //neu "target": "esnext", //neu
//what module code is generated //what module code is generated
// "module": "NodeNext", //neu // "module": "NodeNext", //neu
"skipLibCheck": true, //neu "skipLibCheck": true, //neu
"esModuleInterop": true, //neu "esModuleInterop": true, //neu
"allowSyntheticDefaultImports": true, //neu, "allowSyntheticDefaultImports": true, //neu,
"paths": { "paths": {
"App/*": [ "App/*": ["./app/*"],
"./app/*" "Config/*": ["./config/*"],
], "Contracts/*": ["./contracts/*"],
"Config/*": [ "Database/*": ["./database/*"],
"./config/*" // "@/*": ["./resources/js/"],
], "@/*": ["./resources/js/*"]
"Contracts/*": [ // "vue$": ["vue/dist/vue.runtime.esm-bundler.js"],
"./contracts/*" },
], "types": [
"Database/*": [ "@adonisjs/core",
"./database/*" "@adonisjs/repl",
], "@adonisjs/session",
// "@/*": ["./resources/js/"], "@adonisjs/view",
"@/*": [ "@adonisjs/shield",
"./resources/js/*" "@japa/preset-adonis/build/adonis-typings",
] "@eidellev/inertia-adonisjs",
// "vue$": ["vue/dist/vue.runtime.esm-bundler.js"], "naive-ui/volar",
"@adonisjs/lucid",
"@adonisjs/auth"
]
}, },
"types": [ "files": ["index.d.ts"]
"@adonisjs/core",
"@adonisjs/repl",
"@adonisjs/session",
"@adonisjs/view",
"@adonisjs/shield",
"@japa/preset-adonis/build/adonis-typings",
"@eidellev/inertia-adonisjs",
"naive-ui/volar",
"@adonisjs/lucid",
"@adonisjs/auth"
]
},
"files": [
"index.d.ts"
]
} }

10
tsconfig.vue.json
View File

@ -2,13 +2,13 @@
// tsconfig.vue.json // tsconfig.vue.json
"extends": "@vue/tsconfig/tsconfig.json", "extends": "@vue/tsconfig/tsconfig.json",
"include": ["./resources/js/**/*"], "include": ["./resources/js/**/*"],
"compilerOptions": { "compilerOptions": {
// "module": "commonjs", //for tehys.api...alos nodenext // "module": "commonjs", //for tehys.api...alos nodenext
// Process & infer types from .js files. // Process & infer types from .js files.
"allowJs": true, "allowJs": true,
//javascript language version: Target latest version 'esnext' of ECMAScript or minimal 'es6'. //javascript language version: Target latest version 'esnext' of ECMAScript or minimal 'es6'.
"target": "ESNext", //neu "target": "ESNext", //neu
// //what module code is generated // //what module code is generated
"module": "ESNext", //neu "module": "ESNext", //neu
"experimentalDecorators": true, //neu "experimentalDecorators": true, //neu