rak/dex-ui-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: rak:master
Branches Tags
rak:master rak:open-api
..
compare: rak:4ccbf959f828468238947932149231aa13384f85
Branches Tags
rak:master rak:open-api

2 Commits
master ... 4ccbf959f8

Author SHA1 Message Date
Katarina
4ccbf959f8 Amend backend port in nginx 2025-07-17 13:00:20 +02:00
Katarina
80e2924e30 Update OpenAPI 
Add ImportModal
Add local proxy setting
 2025-07-17 13:00:06 +02:00
63 changed files with 257 additions and 627 deletions
Expand all files Collapse all files

20
docker/docker-compose.yml
View File

@@ -7,16 +7,16 @@ services:
depends_on: depends_on:
- db - db
environment: environment:
QUARKUS_DATASOURCE_JDBC_URL: QUARKUS_DATASOURCE_JDBC_URL: jdbc:postgresql://db:5432/dex
QUARKUS_DATASOURCE_USERNAME: QUARKUS_DATASOURCE_USERNAME: dex
QUARKUS_DATASOURCE_PASSWORD: QUARKUS_DATASOURCE_PASSWORD: dex
QUARKUS_OIDC_AUTH_SERVER_URL: QUARKUS_OIDC_AUTH_SERVER_URL: https://auth.smoothbrain.win/application/o/dex-be/
QUARKUS_OIDC_CLIENT_ID: QUARKUS_OIDC_CLIENT_ID: wUSuMpZlbop44mij54Mshxuf4CMuXdR9h1Jv9Ixc
QUARKUS_OIDC_CREDENTIALS_SECRET: QUARKUS_OIDC_CREDENTIALS_SECRET: CY8i3LM5mqHRUKAie6EscEi8fteiehYgy0FC2HtY79U1TxhRcCde9FfFB3m05DYvOTqI4xufRmspI5N5uqzgXkAljoe7BTjXw1Hhgxz0e5KH0K1jADhpO5a4lczoifjl
QUARKUS_OIDC_TOKEN_AUDIENCE: QUARKUS_OIDC_TOKEN_AUDIENCE: K202NAqkgfjceLZr28gAVQgJDc6RjZfdrE1jNx0K,wUSuMpZlbop44mij54Mshxuf4CMuXdR9h1Jv9Ixc
QUARKUS_OIDC_TOKEN_ISSUER: QUARKUS_OIDC_TOKEN_ISSUER: https://auth.smoothbrain.win/application/o/dex/
QUARKUS_HTTP_INSECURE_REQUESTS: enabled QUARKUS_HTTP_INSECURE_REQUESTS: enabled
DEX_FILE_PATH: DEX_FILE_PATH: /data/files
networks: networks:
- dex - dex
@@ -25,7 +25,7 @@ services:
context: .. context: ..
dockerfile: docker/Dockerfile dockerfile: docker/Dockerfile
ports: ports:
- "80:80" - "7070:7070"
depends_on: depends_on:
- be - be
environment: environment:

14
docker/entrypoint.sh
View File

@@ -1,13 +1,15 @@
#!/bin/sh #!/bin/sh
set -e set -e
: "${API_HOST:=http://localhost}"
: "${API_PORT:=7070}"
# Create runtime config file in writable location # Create runtime config file in writable location
#cat > /runtime-config/config.js <<EOF cat > /runtime-config/config.js <<EOF
#window.__APP_CONFIG__ = { window.__APP_CONFIG__ = {
# API_HOST: "${API_HOST}", API_HOST: "${API_HOST}",
# API_PORT: "${API_PORT}" API_PORT: "${API_PORT}"
#}; };
#EOF EOF
# Generate nginx config from template (if using) # Generate nginx config from template (if using)
if [ -f "/etc/nginx/templates/nginx.conf.template" ]; then if [ -f "/etc/nginx/templates/nginx.conf.template" ]; then

1
index.html
View File

@@ -1,6 +1,7 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<script src="/config.js"></script>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />

31
nginx.conf.template
View File

@@ -32,7 +32,7 @@ http {
} }
server { server {
listen 80; listen 7070;
server_name localhost; server_name localhost;
root /usr/share/nginx/html; root /usr/share/nginx/html;
index index.html; index index.html;
@@ -57,21 +57,22 @@ http {
} }
location /api/ { location /api/ {
# Proxy to Quarkus proxy_pass http://backend:8080/;
proxy_pass http://backend;
proxy_http_version 1.1;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
# Relay CORS headers from the backend # Headers for both simple and preflight requests
proxy_pass_header Access-Control-Allow-Origin; add_header 'Access-Control-Allow-Origin' '$http_origin' always;
proxy_pass_header Access-Control-Allow-Methods; add_header 'Access-Control-Allow-Credentials' 'true' always;
proxy_pass_header Access-Control-Allow-Headers; add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS' always;
proxy_pass_header Access-Control-Allow-Credentials; add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type' always;
add_header 'Access-Control-Expose-Headers' 'Authorization' always;
# Handle OPTIONS directly
if ($request_method = 'OPTIONS') {
add_header 'Access-Control-Max-Age' 1728000;
add_header 'Content-Type' 'text/plain; charset=UTF-8';
add_header 'Content-Length' 0;
return 204;
}
} }
# Cache static assets # Cache static assets

2
package-lock.json generated
View File

@@ -1,6 +1,6 @@
{ {
"name": "dex-ui-vue", "name": "dex-ui-vue",
"version": "0.0.14", "version": "0.0.7",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {

2
package.json
View File

@@ -1,7 +1,7 @@
{ {
"name": "dex-ui-vue", "name": "dex-ui-vue",
"private": true, "private": true,
"version": "0.0.14", "version": "0.0.7",
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",

20
src/App.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<div class="flex flex-col size-full"> <div class="flex flex-col size-dvh">
<!-- Navigator here --> <!-- Navigator here -->
<Menubar <Menubar
:model="items" :model="items"
@@ -32,13 +32,14 @@
</div> </div>
</template> </template>
</Menubar> </Menubar>
<main class="app-main w-full pt-[60px]"> <main class="app-main pt-[60px]">
<Toast/> <Toast/>
<RouterView/> <RouterView/>
<ImportModal
:visible="importModalVisibility"
@update:visible="importModalVisibility = false"
/>
</main> </main>
<footer class="fixed bottom-0 right-0">
v{{ version }}
</footer>
</div> </div>
</template> </template>
@@ -47,11 +48,11 @@ import {ref} from "vue";
import {useRouter} from "vue-router"; import {useRouter} from "vue-router";
import Toast from 'primevue/toast'; import Toast from 'primevue/toast';
import {useAuthStore} from "./stores/auth.ts"; import {useAuthStore} from "./stores/auth.ts";
// noinspection ES6UnusedImports Used in template import ImportModal from "@/components/ImportModal.vue";
import { version } from '../package.json'
const authStore = useAuthStore(); const authStore = useAuthStore();
const router = useRouter(); const router = useRouter();
const importModalVisibility = ref(false);
const items = ref([ const items = ref([
{ {
@@ -88,6 +89,11 @@ const items = ref([
command: () => { command: () => {
router.push('/jobs'); router.push('/jobs');
} }
},
{
label: 'Import Set',
icon: 'pi pi-mobile',
command: () => importModalVisibility.value = true
} }
]); ]);
</script> </script>

2
src/api/openapi/api.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/base.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/common.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/configuration.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/index.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/attribute.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/card-page-search-request.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/card-print.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/card-type.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/card-upstream-fetch-request.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/card.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/deck-create-request.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/deck.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/job-dto.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/job-status.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/job-type.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/link-arrow.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/monster-card-sub-type.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/monster-card-type.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/monster-card.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/monster-type.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/page-card-dto.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/page-card-print-dto.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/page-deck-dto.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/page-job-dto.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/page-set-dto.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/page.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/region-code-alias.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/region.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/regional-set.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/set-dto.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/spell-card-type.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/spell-card.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/trap-card-type.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/model/trap-card.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/service/card-print-service.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/service/card-service.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/service/deck-service.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/service/job-service.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

2
src/api/openapi/service/set-service.ts
View File

@@ -4,7 +4,7 @@
* dex API * dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator) * No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
* *
* The version of the OpenAPI document: 0.0.6 * The version of the OpenAPI document: 0.0.5
* *
* *
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech). * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).

9
src/auth/oidcConfig.ts
View File

@@ -1,16 +1,13 @@
import type {UserManagerSettings} from "oidc-client-ts"; import type {UserManagerSettings} from "oidc-client-ts";
const redirectUri = import.meta.env.PROD
? "https://dex.smoothbrain.win"
: "http://localhost:5173";
export const oidcConfig : UserManagerSettings = { export const oidcConfig : UserManagerSettings = {
authority: 'https://auth.smoothbrain.win/application/o/dex/', authority: 'https://auth.smoothbrain.win/application/o/dex/',
client_id: 'K202NAqkgfjceLZr28gAVQgJDc6RjZfdrE1jNx0K', client_id: 'K202NAqkgfjceLZr28gAVQgJDc6RjZfdrE1jNx0K',
redirect_uri: `${redirectUri}/callback`, redirect_uri: 'http://localhost:5173/callback',
response_type: 'code', response_type: 'code',
scope: 'openid profile email', scope: 'openid profile email',
post_logout_redirect_uri: redirectUri, post_logout_redirect_uri: 'http://localhost:5173', // Homepage URL
// automaticSilentRenew: true,
loadUserInfo: true, loadUserInfo: true,
automaticSilentRenew: true, automaticSilentRenew: true,
extraQueryParams: { extraQueryParams: {

8
src/components.d.ts vendored
View File

@@ -11,26 +11,21 @@ declare module 'vue' {
Avatar: typeof import('primevue/avatar')['default'] Avatar: typeof import('primevue/avatar')['default']
Badge: typeof import('primevue/badge')['default'] Badge: typeof import('primevue/badge')['default']
Button: typeof import('primevue/button')['default'] Button: typeof import('primevue/button')['default']
Card: typeof import('primevue/card')['default']
CardAttributes: typeof import('./components/CardAttributes.vue')['default']
CardFilterPanel: typeof import('./components/CardFilterPanel.vue')['default'] CardFilterPanel: typeof import('./components/CardFilterPanel.vue')['default']
CardListComponent: typeof import('./components/CardListComponent.vue')['default'] CardListComponent: typeof import('./components/CardListComponent.vue')['default']
CardListExpansion: typeof import('./components/CardListExpansion.vue')['default'] CardListExpansion: typeof import('./components/CardListExpansion.vue')['default']
CardSetImportModal: typeof import('./components/CardSetImportModal.vue')['default']
CardTable: typeof import('./components/CardTable.vue')['default'] CardTable: typeof import('./components/CardTable.vue')['default']
Carousel: typeof import('primevue/carousel')['default'] Carousel: typeof import('primevue/carousel')['default']
Column: typeof import('primevue/column')['default'] Column: typeof import('primevue/column')['default']
CustomTag: typeof import('./components/CustomTag.vue')['default'] CustomTag: typeof import('./components/CustomTag.vue')['default']
DataTable: typeof import('primevue/datatable')['default'] DataTable: typeof import('primevue/datatable')['default']
DataView: typeof import('primevue/dataview')['default']
Dialog: typeof import('primevue/dialog')['default'] Dialog: typeof import('primevue/dialog')['default']
Divider: typeof import('primevue/divider')['default'] Divider: typeof import('primevue/divider')['default']
DynamicAsset: typeof import('./components/DynamicAsset.vue')['default'] DynamicAsset: typeof import('./components/DynamicAsset.vue')['default']
Fieldset: typeof import('primevue/fieldset')['default'] Fieldset: typeof import('primevue/fieldset')['default']
FloatLabel: typeof import('primevue/floatlabel')['default'] FloatLabel: typeof import('primevue/floatlabel')['default']
Image: typeof import('primevue/image')['default'] Image: typeof import('primevue/image')['default']
InputGroup: typeof import('primevue/inputgroup')['default'] ImportModal: typeof import('./components/ImportModal.vue')['default']
InputGroupAddon: typeof import('primevue/inputgroupaddon')['default']
InputNumber: typeof import('primevue/inputnumber')['default'] InputNumber: typeof import('primevue/inputnumber')['default']
InputText: typeof import('primevue/inputtext')['default'] InputText: typeof import('primevue/inputtext')['default']
LinkArrowsComponent: typeof import('./components/LinkArrowsComponent.vue')['default'] LinkArrowsComponent: typeof import('./components/LinkArrowsComponent.vue')['default']
@@ -46,6 +41,5 @@ declare module 'vue' {
SplitButton: typeof import('primevue/splitbutton')['default'] SplitButton: typeof import('primevue/splitbutton')['default']
Tag: typeof import('primevue/tag')['default'] Tag: typeof import('primevue/tag')['default']
Textarea: typeof import('primevue/textarea')['default'] Textarea: typeof import('primevue/textarea')['default']
TreeTable: typeof import('primevue/treetable')['default']
} }
} }

56
src/components/CardAttributes.vue
View File

@@ -1,56 +0,0 @@
<template>
<div class="flex flex-wrap gap-4 justify-center">
<Tag
:value="card.cardType"
:severity="getCardSeverity(card.cardType)"
/>
<template v-if="isMonsterCard(card)">
<Tag
v-if="card.isPendulum"
value="PENDULUM"
:severity="getSeverityFromMonsterCardType(card.type)"
/>
<Tag
:value="card.type"
:severity="getSeverityFromMonsterCardType(card.type)"
/>
<Tag
v-for="subType in card.subTypes"
:value="subType"
severity="secondary"
/>
</template>
<template v-if="isSpellCard(card)">
<Tag
:value="card.type"
:severity="getSeverityFromSpellCardType(card.type)"
/>
</template>
<template v-if="isTrapCard(card)">
<Tag
:value="card.type"
:severity="getSeverityFromTrapCardType(card.type)"
/>
</template>
</div>
</template><
<script setup lang="ts">
import type {Ref} from "vue";
import type {Card} from "@/api/openapi";
import {
getCardSeverity,
getSeverityFromMonsterCardType, getSeverityFromSpellCardType, getSeverityFromTrapCardType,
isMonsterCard,
isSpellCard,
isTrapCard
} from "@/util/card-type-util.ts";
const card: Ref<Card> = defineModel({
required: true
})
</script>
<style scoped>
</style>>`

2
src/components/CardFilterPanel.vue
View File

@@ -2,8 +2,10 @@
<Panel> <Panel>
<ScrollPanel <ScrollPanel
class="w-full"
style="height: 800px" style="height: 800px"
> >
<FloatLabel variant="on" class="my-2"> <FloatLabel variant="on" class="my-2">
<InputText <InputText
fluid fluid

57
src/components/CardSetImportModal.vue → src/components/ImportModal.vue
View File

@@ -1,74 +1,83 @@
<template> <template>
<Dialog <Dialog
v-model:visible="visible"
@update:visible="$emit('update:visible', visible)"
modal modal
header="Edit Profile"
:style="{ width: '25rem' }"
:draggable="false" :draggable="false"
:dismissable-mask="true"
:visible="visible"
@update:visible="emit('update:visible', $event)"
> >
<template #header> <template #header>
<div class="inline-flex items-center justify-center gap-2"> <div class="inline-flex items-center justify-center gap-2">
<span class="font-bold whitespace-nowrap">Import Set</span> <span class="font-bold whitespace-nowrap">Import Set</span>
</div> </div>
</template> </template>
<span class="text-surface-500 dark:text-surface-400 block mb-8">Import a Set by its name</span>
<div class="flex items-center gap-4 mb-4"> <div class="flex items-center gap-4 mb-4">
<label for="setName" class="font-semibold w-24">Set Name</label> <label for="setName" class="font-semibold w-24">Set Name</label>
<InputText id="setName" class="flex-auto" autocomplete="off" v-model="cardSetName"/> <InputText id="setName" v-model="cardSetName" class="flex-auto" autocomplete="off" />
</div> </div>
<template #footer> <template #footer>
<Button label="Cancel" text severity="secondary" @click="visible = false"/> <Button label="Cancel" text severity="secondary" @click="visible = false" autofocus />
<Button label="Import" outlined severity="secondary" @click="importSet(cardSetName)"/> <Button
label="Import"
:disabled="!cardSetName"
outlined
severity="primary"
@click="startSetScrapeJob(cardSetName)"
autofocus
/>
</template> </template>
</Dialog> </Dialog>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import {inject, ref, type Ref, watch} from "vue"; import {inject, ref, type Ref, watch} from "vue";
import {SetService} from "@/api/openapi";
import {SetServiceKey} from "@/main.ts"; import {SetServiceKey} from "@/main.ts";
import {SetService} from "@/api/openapi";
import {useToast} from "primevue"; import {useToast} from "primevue";
const toast = useToast();
const emit = defineEmits(['update:visible']) const emit = defineEmits(['update:visible'])
const toast = useToast();
const loading: Ref<boolean> = ref(false);
const visible: Ref<boolean> = defineModel("visible", { const visible: Ref<boolean> = defineModel("visible", {
required: true required: true
}) })
const setService: SetService = inject(SetServiceKey) as SetService; const cardSetName: Ref<string | null> = ref(null)
const cardSetName: Ref<string | null> = ref(null);
const importSet = async(name: string | null) => { const setService: SetService = inject(SetServiceKey) as SetService
const startSetScrapeJob = async (name: string | null) => {
if (!name) { if (!name) {
toast.add({
severity: "warn",
summary: `Name of Set is required to import`,
})
return; return;
} }
loading.value = true;
try { try {
await setService.scrapeSetByName({ await setService.scrapeSetByName({
name: name, name: name
}); })
toast.add({ toast.add({
severity: "info", severity: "info",
summary: `Import Job for Set '${cardSetName.value}' was started successfully`, detail: `Import Job for '${cardSetName}' has been started'`
}) })
} catch (ex: unknown) { } catch (e) {
toast.add({ toast.add({
severity: "error", severity: "error",
summary: `Error occurred trying to import Set '${cardSetName.value}'`, detail: "Error occurred trying to import CardSet - see logs for details"
}) })
} finally { } finally {
cardSetName.value = null; loading.value = false;
visible.value = false visible.value = false;
emit('update:visible', visible)
} }
} }
watch(visible, () => { watch(visible, (newValue: boolean) => {
if (!newValue) {
cardSetName.value = null; cardSetName.value = null;
}
}) })
</script> </script>

18
src/main.ts
View File

@@ -26,9 +26,8 @@ import {useAuthStore} from "./stores/auth.ts";
import SetsView from "./views/set/SetsView.vue"; import SetsView from "./views/set/SetsView.vue";
import JobsView from "./views/JobsView.vue"; import JobsView from "./views/JobsView.vue";
import {definePreset} from "@primeuix/themes"; import {definePreset} from "@primeuix/themes";
import {getConfig, initConfig} from "@/util/config.ts"; import {getApiUrl, getConfig, initConfig} from "@/util/config.ts";
import axios from "axios"; import axios from "axios";
import CreateDeckView from "@/views/deck/CreateDeckView.vue";
// Initialize configuration from window object // Initialize configuration from window object
initConfig((window as any).__APP_CONFIG__ || {}) initConfig((window as any).__APP_CONFIG__ || {})
@@ -114,8 +113,7 @@ const routes: RouteRecordRaw[] = [
{path: '/', component: HomeView}, {path: '/', component: HomeView},
{path: '/cards', component: CardsView, meta: {requiresAuth: false}}, {path: '/cards', component: CardsView, meta: {requiresAuth: false}},
{path: '/cards/:id', component: CardView, meta: {requiresAuth: true}}, {path: '/cards/:id', component: CardView, meta: {requiresAuth: true}},
{path: '/decks', component: DecksView, meta: {requiresAuth: false}}, {path: '/decks', component: DecksView, meta: {requiresAuth: true}},
{path: '/decks/create', component: CreateDeckView, meta: {requiresAuth: true}},
{path: '/decks/:id', component: DeckView, meta: {requiresAuth: true}}, {path: '/decks/:id', component: DeckView, meta: {requiresAuth: true}},
{path: '/sets', component: SetsView}, {path: '/sets', component: SetsView},
{path: '/sets/:id', component: DeckView, meta: {requiresAuth: true}}, {path: '/sets/:id', component: DeckView, meta: {requiresAuth: true}},
@@ -136,18 +134,19 @@ router.beforeEach(async (to) => {
return false; return false;
} }
} }
return true;
}) })
app.use(router); app.use(router);
app.use(ToastService) app.use(ToastService)
const apiUrl = import.meta.env.PROD let apiUrl: string | undefined
? "/"
: `http://${getConfig().API_HOST}:${getConfig().API_PORT}`; const devProxy = import.meta.env.DEV && !import.meta.env.VITE_API_HOST && !import.meta.env.VITE_API_PORT
? ''
: `http://${getApiUrl()}`
const axiosInstance = axios.create({ const axiosInstance = axios.create({
baseURL: apiUrl, baseURL: devProxy,
headers: { headers: {
'Content-Type': 'application/json' 'Content-Type': 'application/json'
} }
@@ -172,6 +171,7 @@ axiosInstance.interceptors.response.use(
} }
) )
console.log(apiUrl)
const deckService: DeckService = new DeckService(undefined, undefined, axiosInstance) const deckService: DeckService = new DeckService(undefined, undefined, axiosInstance)
const cardService: CardService = new CardService(undefined, undefined, axiosInstance) const cardService: CardService = new CardService(undefined, undefined, axiosInstance)
const setService: SetService = new SetService(undefined, undefined, axiosInstance) const setService: SetService = new SetService(undefined, undefined, axiosInstance)

1
src/style.css
View File

@@ -5,7 +5,6 @@
body { body {
font-family: system-ui, Avenir, Helvetica, Arial, sans-serif; font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
font-size: 14px; font-size: 14px;
width: 100%;
font-synthesis: none; font-synthesis: none;
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;

8
src/util/card-type-util.ts
View File

@@ -24,14 +24,6 @@ export const isMonsterCard = (card: Card): card is MonsterCard => {
return card.cardType === "MONSTER" return card.cardType === "MONSTER"
} }
export const isSpellCard = (card: Card): card is SpellCard => {
return card.cardType === "SPELL"
}
export const isTrapCard = (card: Card): card is TrapCard => {
return card.cardType === "TRAP"
}
export const getMonsterCardType = (monsterCard: MonsterCard) => { export const getMonsterCardType = (monsterCard: MonsterCard) => {
return `${monsterCard.type} MONSTER ` return `${monsterCard.type} MONSTER `
} }

7
src/util/config.ts
View File

@@ -18,3 +18,10 @@ export function initConfig(config: Partial<AppConfig>) {
export function getConfig(): AppConfig { export function getConfig(): AppConfig {
return runtimeConfig; return runtimeConfig;
} }
export function getApiUrl() {
if (!runtimeConfig.API_HOST) {
return null;
}
return `${runtimeConfig.API_HOST}:${runtimeConfig.API_PORT}`;
}

2
src/views/Callback.vue
View File

@@ -16,7 +16,7 @@ onMounted(async () => {
await router.push('/'); // Redirect to home after login await router.push('/'); // Redirect to home after login
} catch (error) { } catch (error) {
console.error('Login callback error:', error); console.error('Login callback error:', error);
await router.push('/'); // Handle errors await router.push('/error'); // Handle errors
} }
}); });
</script> </script>

2
src/views/JobsView.vue
View File

@@ -30,7 +30,7 @@
<script setup lang="ts"> <script setup lang="ts">
import {type JobDto, JobService, JobType} from "@/api/openapi"; import {type JobDto, JobService, JobType} from "../api/openapi";
import {inject, onMounted, type Ref, ref} from "vue"; import {inject, onMounted, type Ref, ref} from "vue";
import {JobServiceKey} from "../main.ts"; import {JobServiceKey} from "../main.ts";

56
src/views/card/CardsView.vue
View File

@@ -1,7 +1,9 @@
<template> <template>
<div class="flex"> <div class="flex w-full min-h-content">
<Panel class="w-[50%] m-4"> <Panel class="w-full m-4">
<DataTable <DataTable
class="my-4 ml-4 w-full"
tableStyle="min-width: 50rem"
dataKey="id" dataKey="id"
paginator paginator
lazy lazy
@@ -42,21 +44,33 @@
<!-- <Avatar image="https://upload.wikimedia.org/wikipedia/en/2/2b/Yugioh_Card_Back.jpg" class="mr-2" size="xlarge" shape="circle" />--> <!-- <Avatar image="https://upload.wikimedia.org/wikipedia/en/2/2b/Yugioh_Card_Back.jpg" class="mr-2" size="xlarge" shape="circle" />-->
</template> </template>
</Column> </Column>
<Column header="Name"> <Column field="name" header="Name">
<template #body="slotProps"> <template #body="slotProps">
<div class="w-[50%]"> <p class="font-bold">
<p class="font-bold text-center">
{{slotProps.data.name}} {{slotProps.data.name}}
</p> </p>
<p class="text-muted-color text-center" v-if="isMonsterCard(slotProps.data)">
{{ slotProps.data.monsterType}}
</p>
</div>
</template> </template>
</Column> </Column>
<Column header="Attributes" class="w-[20%]"> <Column header="Card Type" filter>
<template #body="slotProps"> <template #body="slotProps">
<CardAttributes v-model="slotProps.data"/> <Tag
:value="slotProps.data.cardType"
:severity="getCardSeverity(slotProps.data.cardType)"
></Tag>
</template>
</Column>
<Column header="Type">
<template #body="slotProps">
<Tag
v-if="slotProps.data.type !== 'FUSION'"
:value="slotProps.data.type"
:severity="getCardTypeSeverity(slotProps.data)"
/>
<CustomTag
v-else
color="purple"
:value="slotProps.data.type"
/>
</template> </template>
</Column> </Column>
<template #expansion="slotProps"> <template #expansion="slotProps">
@@ -67,17 +81,17 @@
<CardFilterPanel <CardFilterPanel
v-model="filters" v-model="filters"
class="fixed right-0 w-content m-4 h-content" class="fixed right-0 w-[42%] m-4"
/> />
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import CardFilterPanel from "@/components/CardFilterPanel.vue"; import CardFilterPanel from "../../components/CardFilterPanel.vue";
import {isMonsterCard} from "@/util/card-type-util.ts"; import {getCardTypeSeverity, getCardSeverity} from "../../util/card-type-util.ts";
import {type Card, CardService, type CardServiceGetCardPageRequest} from "@/api/openapi"; import {type Card, CardService, type CardServiceGetCardPageRequest} from "../../api/openapi";
import {inject, onMounted, ref, type Ref, watch} from "vue"; import {inject, onMounted, ref, type Ref, watch} from "vue";
import {CardServiceKey} from "@/main.ts"; import {CardServiceKey} from "../../main.ts";
import type { import type {
DataTableFilterEvent, DataTableFilterEvent,
DataTablePageEvent, DataTablePageEvent,
@@ -85,7 +99,7 @@ import type {
DataTableSortEvent DataTableSortEvent
} from "primevue"; } from "primevue";
import {useDebounceFn} from "@vueuse/core"; import {useDebounceFn} from "@vueuse/core";
import type {MutableCardRequest} from "@/api/mutableTypes.ts"; import type {MutableCardRequest} from "../../api/mutableTypes.ts";
const cardService: CardService = inject(CardServiceKey) as CardService; const cardService: CardService = inject(CardServiceKey) as CardService;
@@ -129,7 +143,7 @@ const filters: Ref<MutableCardRequest> = ref({
pageCount: 10 pageCount: 10
}) })
const getCardPage = async (filters: CardServiceGetCardPageRequest): Promise<void> => { const getGetCardPage = async (filters: CardServiceGetCardPageRequest): Promise<void> => {
loading.value = true; loading.value = true;
const cardPage = (await cardService.getCardPage(filters)).data const cardPage = (await cardService.getCardPage(filters)).data
@@ -142,7 +156,7 @@ const getCardPage = async (filters: CardServiceGetCardPageRequest): Promise<void
const handlePaging = async (e: DataTablePageEvent) => { const handlePaging = async (e: DataTablePageEvent) => {
filters.value.page = e.page; filters.value.page = e.page;
filters.value.pageSize = e.rows filters.value.pageSize = e.rows
await getCardPage(filters.value) await getGetCardPage(filters.value)
} }
const handleSorting = (_: DataTableSortEvent) => { const handleSorting = (_: DataTableSortEvent) => {
@@ -158,13 +172,13 @@ const handleRowSelect = (e: DataTableRowSelectEvent) => {
console.log(JSON.stringify(e.data)) console.log(JSON.stringify(e.data))
} }
const debouncedGetCardPage = useDebounceFn(getCardPage, 150) const debouncedGetCardPage = useDebounceFn(getGetCardPage, 150)
watch(filters, async (newFiltersValue) => { watch(filters, async (newFiltersValue) => {
await debouncedGetCardPage(newFiltersValue) await debouncedGetCardPage(newFiltersValue)
}) })
onMounted(async () => { onMounted(async () => {
await getCardPage(filters.value) await getGetCardPage(filters.value)
}) })
</script> </script>

283
src/views/deck/CreateDeckView.vue
View File

@@ -1,283 +0,0 @@
<template>
<div class="flex gap-4 m-4">
<div class="flex flex-col gap-4 min-w-[40%]">
<Panel
header="Main Deck"
class="bg-primary-950 min-h-60"
@dragover.prevent
@drop="onDropToMainDeck"
>
<DataView
:value="mainDeck"
:pt="{
content: {
class: 'bg-inherit'
}
}"
>
<template #list="slotProps">
<div class="flex flex-col">
<div v-for="(card, index) in slotProps.items" :key="index">
<Card
:draggable="true"
class="text-lg font-medium mt-2"
@dragstart="onDragStart(card, 'deck')"
>
<template #content>
{{ card.name }}
<Button @click="removeFromDeck(card)">Remove</Button>
</template>
</Card>
</div>
</div>
</template>
<template #empty>
Nope
</template>
</DataView>
</Panel>
<Panel
header="Extra Deck"
class="bg-indigo-950 min-h-60"
@dragover.prevent
@drop="onDropToExtraDeck"
>
<DataTable
:value="extraDeck"
:pt="{
emptyMessage: {
class: 'bg-indigo-950'
},
column: {
headerCell: {
class: 'bg-indigo-950 text-center'
},
columnHeaderContent: {
class: 'justify-center'
}
},
bodyRow: {
class: 'bg-indigo-950 justify-center'
}
}"
>
<Column field="name" header="Card"/>
<Column header="Quantity" class="w-46">
<template #body>
<InputGroup class="w-full">
<InputGroupAddon>
<Button icon="pi pi-minus" severity="primary"/>
</InputGroupAddon>
<InputNumber :model-value="1"/>
<InputGroupAddon>
<Button icon="pi pi-plus" severity="primary"/>
</InputGroupAddon>
</InputGroup>
</template>
</Column>
<template #empty>
<div>
drag cards here senpai
</div>
</template>
</DataTable>
</Panel>
<Panel
header="Side Deck"
class="bg-slate-800 min-h-50"
@dragover.prevent
@drop="onDropToSideDeck"
>
<DataView
:value="sideDeck"
:pt="{
content: {
class: 'bg-inherit'
}
}"
>
<template #list="slotProps">
<div class="flex flex-col">
<div v-for="(card, index) in slotProps.items" :key="index" class="flex flex-wrap">
<Card
:draggable="true"
class="text-lg font-medium mt-2 w-full"
@dragstart="onDragStart(card, 'deck')"
>
<template #content>
<div class="flex justify-between items-center gap-4">
<p>
{{ card.name }}
</p>
<InputGroup class="w-36">
<InputGroupAddon>
<Button icon="pi pi-minus" severity="primary"/>
</InputGroupAddon>
<InputNumber :model-value="1"/>
<InputGroupAddon>
<Button icon="pi pi-plus" severity="primary"/>
</InputGroupAddon>
</InputGroup>
</div>
</template>
</Card>
</div>
</div>
</template>
<template #empty>
Nope
</template>
</DataView>
</Panel>
</div>
<Panel
header="Available Cards"
class="w-[50%] fixed right-0"
@dragover.prevent
@drop="onDropToPool"
>
<DataView :value="availableCards">
<template #list="slotProps">
<div class="flex flex-col">
<div v-for="(card, index) in slotProps.items" :key="index">
<Card
:draggable="true"
class="text-lg font-medium mt-2"
@dragstart="onDragStart(card, 'pool')"
>
<template #content>
{{ card.name }}
</template>
</Card>
</div>
</div>
</template>
</DataView>
</Panel>
</div>
</template>
<script setup lang="ts">
import {inject, onMounted, ref, type Ref} from "vue";
import {SetServiceKey} from "@/main.ts";
import {type Card, type SetDto, SetService} from "@/api/openapi";
const setService = inject(SetServiceKey) as SetService
const loading: Ref<boolean> = ref(false);
const decks: Ref<SetDto[]> = ref([]);
const page: Ref<number> = ref(0);
const pageSize: Ref<number> = ref(20);
const pageCount: Ref<number> = ref(0);
const totalRecords: Ref<number> = ref(0);
const getSetPage = async (page: number, pageSize: number): Promise<void> => {
loading.value = true;
const deckPage = (await setService.getCardSetPage({
page: page,
pageSize: pageSize
})).data
decks.value = deckPage.content
pageCount.value = deckPage.totalPages!!
totalRecords.value = deckPage.totalRecords!!
loading.value = false;
}
onMounted(async () => {
await getSetPage(
page.value,
pageSize.value
)
})
// ----
// Initial card pool
const mainDeck: Ref<Card[]> = ref([])
const extraDeck: Ref<Card[]> = ref([])
const sideDeck: Ref<Card[]> = ref([])
const availableCards = ref([
{id: 1, name: 'Blue-Eyes White Dragon'},
{id: 2, name: 'Dark Magician'},
{id: 3, name: 'Red-Eyes Black Dragon'},
// ... more cards
])
// User's deck
// Track the dragged card and its origin
let draggedCard: Ref<Card | null> = ref(null)
let originPool: Ref<string | null> = ref(null)
function onDragStart(card: Card, from: string) {
draggedCard.value = card
originPool.value = from
}
function onDropToMainDeck() {
if (originPool.value === 'pool') {
// Prevent duplicates
if (draggedCard.value && !mainDeck.value.find(card => card.id === draggedCard.value?.id)) {
mainDeck.value.push(draggedCard.value)
}
} else if (originPool.value === 'deck') {
// Handle reordering within deck if desired
// For simplicity, no-op
}
resetDrag()
}
function onDropToExtraDeck() {
if (originPool.value === 'pool') {
// Prevent duplicates
if (draggedCard.value && !mainDeck.value.find(card => card.id === draggedCard.value?.id)) {
extraDeck.value.push(draggedCard.value)
}
} else if (originPool.value === 'deck') {
// Handle reordering within deck if desired
// For simplicity, no-op
}
resetDrag()
}
function onDropToSideDeck() {
if (originPool.value === 'pool') {
// Prevent duplicates
if (draggedCard.value && !mainDeck.value.find(card => card.id === draggedCard.value?.id)) {
sideDeck.value.push(draggedCard.value)
}
} else if (originPool.value === 'deck') {
// Handle reordering within deck if desired
// For simplicity, no-op
}
resetDrag()
}
function onDropToPool() {
if (originPool.value === 'deck') {
// Remove from deck and return to pool
mainDeck.value = mainDeck.value.filter(c => c.id !== draggedCard.value?.id)
}
resetDrag()
}
function removeFromDeck(cardToRemove: Card) {
mainDeck.value = mainDeck.value.filter(card => card.id !== cardToRemove.id)
}
function resetDrag() {
draggedCard.value = null
originPool.value = null
}
</script>
<style scoped>
</style>

148
src/views/deck/DecksView.vue
View File

@@ -1,123 +1,73 @@
<template> <template>
<DataView :value="decks" :layout="layout"> <div class="card">
<template #header> <Carousel :value="decks" :numVisible="3" :numScroll="3">
<div class="flex justify-end gap-4"> <template #item="slotProps">
<SelectButton v-model="layout" :options="layoutOptions" :allowEmpty="false"> <div class="border border-surface-200 dark:border-surface-700 rounded m-2 p-4 w-96 h-auto">
<template #option="{ option }"> <div class="mb-4">
<i :class="[option === 'list' ? 'pi pi-bars' : 'pi pi-table']" />
</template>
</SelectButton>
<Button type="button" size="small" label="Build" icon="pi pi-plus" @click="router.push('/decks/create')"/>
</div>
</template>
<template #list="slotProps">
<div class="flex flex-col">
<div v-for="(item, index) in slotProps.items" :key="index">
<div class="flex flex-col sm:flex-row sm:items-center p-6 gap-4" :class="{ 'border-t border-surface-200 dark:border-surface-700': index !== 0 }">
<div class="md:w-40 relative">
<img class="block xl:block mx-auto rounded w-full" src="https://m.media-amazon.com/images/I/81H7zpRNyRL.jpg" alt="peepee poopoo" />
</div>
<div class="flex flex-col md:flex-row justify-between md:items-center flex-1 gap-6">
<div class="flex flex-row md:flex-col justify-between items-start gap-2">
<div>
<span class="font-medium text-surface-500 dark:text-surface-400 text-sm">{{ item.category }}</span>
<div class="text-lg font-medium mt-2">{{ item.name }}</div>
</div>
<div class="bg-surface-100 p-1" style="border-radius: 30px">
<div class="bg-surface-0 flex items-center gap-2 justify-center py-1 px-2" style="border-radius: 30px; box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.04), 0px 1px 2px 0px rgba(0, 0, 0, 0.06)">
<span class="text-surface-900 font-medium text-sm">{{ item.rating }}</span>
<i class="pi pi-star-fill text-yellow-500"></i>
</div>
</div>
</div>
<div class="flex flex-col md:items-end gap-8">
<span class="text-xl font-semibold">${{ item.price }}</span>
<div class="flex flex-row-reverse md:flex-row gap-2">
<Button icon="pi pi-heart" outlined></Button>
<Button icon="pi pi-shopping-cart" label="Buy Now" :disabled="item.inventoryStatus === 'OUTOFSTOCK'" class="flex-auto md:flex-initial whitespace-nowrap"></Button>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<template #grid="slotProps">
<div class="grid grid-cols-12 gap-4">
<div v-for="(deck, index) in slotProps.items" :key="index" class="col-span-12 sm:col-span-6 md:col-span-4 xl:col-span-6 p-2">
<div class="p-6 border border-surface-200 dark:border-surface-700 bg-surface-0 dark:bg-surface-900 rounded flex flex-col">
<div class="bg-surface-50 flex justify-center rounded p-4">
<div class="relative mx-auto"> <div class="relative mx-auto">
<img class="rounded w-full" :src="`https://primefaces.org/cdn/primevue/images/product/${deck.image}`" :alt="deck.name" style="max-width: 300px"/> <img
</div> :src="'https://upload.wikimedia.org/wikipedia/en/2/2b/Yugioh_Card_Back.jpg?20201122212343'"
</div> class="w-full rounded"
<div class="pt-6"> alt="Deck"
<div class="flex flex-row justify-between items-start gap-2"> />
<div>
<span class="font-medium text-surface-500 dark:text-surface-400 text-sm">[ARCHETYPE]</span>
<div class="text-lg font-medium mt-1">{{ deck.name }}</div>
</div>
<div class="bg-surface-100 p-1" style="border-radius: 30px">
<div class="bg-surface-0 flex items-center gap-2 justify-center py-1 px-2" style="border-radius: 30px; box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.04), 0px 1px 2px 0px rgba(0, 0, 0, 0.06)">
<span class="text-surface-900 font-medium text-sm">5</span>
<i class="pi pi-star-fill text-yellow-500"></i>
</div>
</div>
</div>
<div class="flex flex-col gap-6 mt-6">
<span class="text-2xl font-semibold">50€</span>
<div class="flex gap-2">
<Button icon="pi pi-shopping-cart" label="Buy Now" class="flex-auto whitespace-nowrap"></Button>
<Button icon="pi pi-heart" outlined></Button>
</div>
</div> </div>
</div> </div>
<div class="flex justify-between ">
<p class="font-bold">
{{ slotProps.data.name }}
</p>
<Tag
value="[ARCHETYPE]"
/>
</div> </div>
<div class="flex justify- items-center">
<SplitButton
label="View"
:model="deckMenuItems"
@click="viewDeck(slotProps.data.id)"
/>
</div> </div>
</div> </div>
</template> </template>
</DataView> </Carousel>
</div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import {type Deck, DeckService} from "@/api/openapi";
import {type Deck, DeckService} from "../../api/openapi";
import {DeckServiceKey} from "../../main.ts";
import {inject, onMounted, ref, type Ref} from "vue"; import {inject, onMounted, ref, type Ref} from "vue";
import {DeckServiceKey} from "@/main.ts"; import {useToast} from "primevue";
import {useRouter} from "vue-router"; import {useRouter} from "vue-router";
const toast = useToast();
const router = useRouter(); const router = useRouter();
const layout: Ref<"grid" | "list"> = ref('grid');
const layoutOptions: Ref<string[]> = ref(['list', 'grid']);
const loading: Ref<boolean> = ref(false);
const deckService: DeckService = inject(DeckServiceKey) as DeckService; const deckService: DeckService = inject(DeckServiceKey) as DeckService;
const decks: Ref<Deck[]> = ref([]); const decks: Ref<Deck[]> = ref([])
const page: Ref<number> = ref(0); const deckMenuItems = [
const pageSize: Ref<number> = ref(20); {
const pageCount: Ref<number> = ref(0); label: 'Edit',
const totalRecords: Ref<number> = ref(0); command: () => {
toast.add({
severity: 'info',
summary: 'Not Implemented',
detail: 'Deck Editing isn\'t implemented yet',
life: 3000
});
}
},
]
const getDeckPage = async (page: number, pageSize: number): Promise<void> => { const viewDeck = (deckId: number) => {
loading.value = true; router.push(`/decks/${deckId}`);
const deckPage = (await deckService.getDecks({
page: page,
pageSize: pageSize
})).data
decks.value = deckPage.content
pageCount.value = deckPage.totalPages!!
totalRecords.value = deckPage.totalRecords!!
loading.value = false;
} }
onMounted(async () => { onMounted(async () => {
await getDeckPage( const decksResponse = await deckService.getDecks()
page.value,
pageSize.value decks.value = decksResponse.data.content
)
}) })
</script> </script>

30
src/views/set/SetsView.vue
View File

@@ -1,8 +1,4 @@
<template> <template>
<CardSetImportModal
:visible="importModalVisible"
@update:visible="args => importModalVisible = args"
/>
<DataTable <DataTable
tableStyle="min-width: 50rem" tableStyle="min-width: 50rem"
dataKey="id" dataKey="id"
@@ -20,11 +16,6 @@
@page="handlePaging" @page="handlePaging"
@sort="handleSorting" @sort="handleSorting"
> >
<template #header>
<div class="flex justify-end">
<Button type="button" size="small" label="Import" icon="pi pi-download" @click="importModalVisible = true"/>
</div>
</template>
<Column header="Image"> <Column header="Image">
<template #body> <template #body>
<Image alt="Image" preview class="h-64"> <Image alt="Image" preview class="h-64">
@@ -33,9 +24,7 @@
</template> </template>
<template #image> <template #image>
<div class="overflow-hidden"> <div class="overflow-hidden">
<img <img src="https://comicbook.com/wp-content/uploads/sites/4/2024/11/YuGiOh-Early-Days-Collection.png?resize=2000,1125" alt="image" width="650" height="650"/>
src="https://comicbook.com/wp-content/uploads/sites/4/2024/11/YuGiOh-Early-Days-Collection.png?resize=2000,1125"
alt="image" width="650" height="650"/>
</div> </div>
</template> </template>
<template #preview="slotProps"> <template #preview="slotProps">
@@ -57,8 +46,8 @@
</template> </template>
</Column> </Column>
<Column header="No. of Regional Sets"> <Column header="No. of Regional Sets">
<template #body> <template #body="slotProps">
N/A {{ slotProps.data.regionalSets.length }}
</template> </template>
</Column> </Column>
<template #footer> In total there are {{ sets ? sets.length : 0 }} Card Sets </template> <template #footer> In total there are {{ sets ? sets.length : 0 }} Card Sets </template>
@@ -66,12 +55,11 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import {type SetDto, SetService} from "@/api/openapi"; import {type SetDto, SetService} from "../../api/openapi";
import {inject, onMounted, ref, type Ref} from "vue"; import {inject, onMounted, ref, type Ref} from "vue";
import {SetServiceKey} from "@/main.ts"; import {SetServiceKey} from "../../main.ts";
import type {DataTablePageEvent, DataTableSortEvent} from "primevue"; import type {DataTablePageEvent, DataTableSortEvent} from "primevue";
const importModalVisible: Ref<boolean> = ref(false);
const setService: SetService = inject(SetServiceKey) as SetService; const setService: SetService = inject(SetServiceKey) as SetService;
const loading: Ref<boolean> = ref(true); const loading: Ref<boolean> = ref(true);
const sets: Ref<SetDto[]> = ref([]) const sets: Ref<SetDto[]> = ref([])
@@ -84,16 +72,16 @@ const first = ref(0);
const fetchCardSetPage = async (page: number, pageSize: number): Promise<void> => { const fetchCardSetPage = async (page: number, pageSize: number): Promise<void> => {
loading.value = true; loading.value = true;
const setPage = (await setService.getCardSetPage({ const cardPage = (await setService.getCardSetPage({
name: null, name: null,
page: page, page: page,
pageSize: pageSize pageSize: pageSize
} }
)).data )).data
sets.value = setPage.content sets.value = cardPage.content
pageCount.value = setPage.totalPages!! pageCount.value = cardPage.totalPages!!
totalRecords.value = setPage.totalRecords!! totalRecords.value = cardPage.totalRecords!!
loading.value = false; loading.value = false;
} }

7
vite.config.ts
View File

@@ -24,6 +24,13 @@ export default defineConfig({
'@': path.resolve(__dirname, './src'), '@': path.resolve(__dirname, './src'),
} }
}, },
proxy: {
'/api': {
target: 'http://localhost:8080',
changeOrigin: true,
secure: false,
}
},
build: { build: {
// @ts-ignore // @ts-ignore
assetsInclude: [ assetsInclude: [