Compare commits

..

21 Commits

Author SHA1 Message Date
3737ceb33a Bump version 2025-07-19 16:41:23 +02:00
5ae114aeb1 Add CreateDeckView
Amend CSS
Correct auth callback
2025-07-19 16:41:08 +02:00
0f30cdf8bb Bump version 2025-07-19 15:11:24 +02:00
a7905e4158 Add version footer 2025-07-19 15:11:17 +02:00
5c9c0cde60 Amend redirect URI 2025-07-17 17:52:24 +02:00
7713c8e4ae Add CardSetImportModal 2025-07-17 17:48:44 +02:00
9450d560c4 Update OpenAPI 2025-07-17 17:48:35 +02:00
fcd1e4c888 Bump version 2025-07-17 17:14:46 +02:00
47c468bab6 Correct callback 2025-07-17 17:14:34 +02:00
1f0b08c122 Add debug logging 2025-07-17 15:03:38 +02:00
e6ccae9af3 Amend API URL 2025-07-17 14:36:17 +02:00
b3e4f76b18 Amend API URL 2025-07-17 14:29:10 +02:00
bff0b35c5f Bump version 2025-07-17 13:56:01 +02:00
bdeaa34851 Correct nginx proxy 2025-07-17 13:55:44 +02:00
7c2c6834c2 Amend API base URL 2025-07-17 13:37:16 +02:00
7dc4c9192b Amend API base URL 2025-07-17 13:36:56 +02:00
e895602aa4 Amend port 2025-07-17 13:12:10 +02:00
9c743ed514 Update OpenAPI, amend TS issues 2025-07-17 13:11:20 +02:00
520f59a0ca Amend .gitignore 2025-07-15 20:57:52 +02:00
ad8772d112 Amend env var stubs 2025-07-15 20:57:21 +02:00
c06b75ab96 Add Compose YML 2025-07-15 20:57:05 +02:00
64 changed files with 841 additions and 318 deletions

1
.gitignore vendored
View File

@@ -6,6 +6,7 @@ yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
docker/docker-compose.yml
node_modules
dist

48
docker/docker-compose.yml Normal file
View File

@@ -0,0 +1,48 @@
services:
be:
image: gitea.smoothbrain.win/rak/dex:latest
ports:
- "8080:8080"
depends_on:
- db
environment:
QUARKUS_DATASOURCE_JDBC_URL:
QUARKUS_DATASOURCE_USERNAME:
QUARKUS_DATASOURCE_PASSWORD:
QUARKUS_OIDC_AUTH_SERVER_URL:
QUARKUS_OIDC_CLIENT_ID:
QUARKUS_OIDC_CREDENTIALS_SECRET:
QUARKUS_OIDC_TOKEN_AUDIENCE:
QUARKUS_OIDC_TOKEN_ISSUER:
QUARKUS_HTTP_INSECURE_REQUESTS: enabled
DEX_FILE_PATH:
networks:
- dex
frontend:
build:
context: ..
dockerfile: docker/Dockerfile
ports:
- "80:80"
depends_on:
- be
environment:
API_HOST: be
API_PORT: 8080
networks:
- dex
db:
image: postgres
restart: always
environment:
POSTGRES_PASSWORD: dex
POSTGRES_DB: dex
POSTGRES_USER: dex
networks:
- dex
networks:
dex:

View File

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

View File

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

View File

@@ -28,11 +28,11 @@ http {
resolver 127.0.0.11 valid=10s ipv6=off;
upstream backend {
server ${API_HOST}:${API_PORT};
server ${API_HOST}:8080;
}
server {
listen 7070;
listen 80;
server_name localhost;
root /usr/share/nginx/html;
index index.html;
@@ -56,7 +56,7 @@ http {
access_log off;
}
location ^~ /api/ {
location /api/ {
# Proxy to Quarkus
proxy_pass http://backend;
proxy_http_version 1.1;

2
package-lock.json generated
View File

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

View File

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

View File

@@ -1,5 +1,5 @@
<template>
<div class="flex flex-col size-dvh">
<div class="flex flex-col size-full">
<!-- Navigator here -->
<Menubar
:model="items"
@@ -32,10 +32,13 @@
</div>
</template>
</Menubar>
<main class="app-main pt-[60px]">
<main class="app-main w-full pt-[60px]">
<Toast/>
<RouterView/>
</main>
<footer class="fixed bottom-0 right-0">
v{{ version }}
</footer>
</div>
</template>
@@ -44,6 +47,8 @@ import {ref} from "vue";
import {useRouter} from "vue-router";
import Toast from 'primevue/toast';
import {useAuthStore} from "./stores/auth.ts";
// noinspection ES6UnusedImports Used in template
import { version } from '../package.json'
const authStore = useAuthStore();
const router = useRouter();

View File

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

View File

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

View File

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

View File

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

View File

@@ -6,8 +6,8 @@ All URIs are relative to *http://localhost*
|------------- | ------------- | -------------|
|[**apiSetsNameGet**](#apisetsnameget) | **GET** /api/sets/{name} | Find Set By Name|
|[**apiSetsNameNewGet**](#apisetsnamenewget) | **GET** /api/sets/{name}/new | Fetch And Persist From Upstream|
|[**apiSetsNameScrapeGet**](#apisetsnamescrapeget) | **GET** /api/sets/{name}/scrape | Scrape And Persist From Upstream|
|[**getCardSetPage**](#getcardsetpage) | **GET** /api/sets | Get a page of Card Sets with optional name query parameter|
|[**scrapeSetByName**](#scrapesetbyname) | **GET** /api/sets/{name}/scrape | Scrape a CardSet via name query parameter|
# **apiSetsNameGet**
> SetDto apiSetsNameGet()
@@ -102,56 +102,6 @@ No authorization required
- **Accept**: application/json
### HTTP response details
| Status code | Description | Response headers |
|-------------|-------------|------------------|
|**200** | Set retrieved | - |
[[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)
# **apiSetsNameScrapeGet**
> apiSetsNameScrapeGet()
### Example
```typescript
import {
SetService,
Configuration
} from './api';
const configuration = new Configuration();
const apiInstance = new SetService(configuration);
let name: string; // (default to undefined)
const { status, data } = await apiInstance.apiSetsNameScrapeGet(
name
);
```
### Parameters
|Name | Type | Description | Notes|
|------------- | ------------- | ------------- | -------------|
| **name** | [**string**] | | defaults to undefined|
### Return type
void (empty response body)
### Authorization
No authorization required
### HTTP request headers
- **Content-Type**: Not defined
- **Accept**: Not defined
### HTTP response details
| Status code | Description | Response headers |
|-------------|-------------|------------------|
@@ -215,3 +165,53 @@ No authorization required
[[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)
# **scrapeSetByName**
> scrapeSetByName()
### Example
```typescript
import {
SetService,
Configuration
} from './api';
const configuration = new Configuration();
const apiInstance = new SetService(configuration);
let name: string; // (default to undefined)
const { status, data } = await apiInstance.scrapeSetByName(
name
);
```
### Parameters
|Name | Type | Description | Notes|
|------------- | ------------- | ------------- | -------------|
| **name** | [**string**] | | defaults to undefined|
### Return type
void (empty response body)
### Authorization
No authorization required
### HTTP request headers
- **Content-Type**: Not defined
- **Accept**: Not defined
### HTTP response details
| Status code | Description | Response headers |
|-------------|-------------|------------------|
|**200** | Set retrieved | - |
[[Back to top]](#) [[Back to API list]](../README.md#documentation-for-api-endpoints) [[Back to Model list]](../README.md#documentation-for-models) [[Back to README]](../README.md)

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

@@ -4,7 +4,7 @@
* dex API
* No description provided (generated by Openapi Generator https://github.com/openapitools/openapi-generator)
*
* The version of the OpenAPI document: 0.0.1
* The version of the OpenAPI document: 0.0.6
*
*
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
@@ -90,40 +90,6 @@ export const SetServiceAxiosParamCreator = function (configuration?: Configurati
setSearchParams(localVarUrlObj, localVarQueryParameter);
let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
return {
url: toPathString(localVarUrlObj),
options: localVarRequestOptions,
};
},
/**
*
* @summary Scrape And Persist From Upstream
* @param {string} name
* @param {*} [options] Override http request option.
* @throws {RequiredError}
*/
apiSetsNameScrapeGet: async (name: string, options: RawAxiosRequestConfig = {}): Promise<RequestArgs> => {
// verify required parameter 'name' is not null or undefined
assertParamExists('apiSetsNameScrapeGet', 'name', name)
const localVarPath = `/api/sets/{name}/scrape`
.replace(`{${"name"}}`, encodeURIComponent(String(name)));
// use dummy base URL string because the URL constructor only accepts absolute URLs.
const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
let baseOptions;
if (configuration) {
baseOptions = configuration.baseOptions;
}
const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
const localVarHeaderParameter = {} as any;
const localVarQueryParameter = {} as any;
setSearchParams(localVarUrlObj, localVarQueryParameter);
let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
@@ -169,6 +135,40 @@ export const SetServiceAxiosParamCreator = function (configuration?: Configurati
setSearchParams(localVarUrlObj, localVarQueryParameter);
let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
return {
url: toPathString(localVarUrlObj),
options: localVarRequestOptions,
};
},
/**
*
* @summary Scrape a CardSet via name query parameter
* @param {string} name
* @param {*} [options] Override http request option.
* @throws {RequiredError}
*/
scrapeSetByName: async (name: string, options: RawAxiosRequestConfig = {}): Promise<RequestArgs> => {
// verify required parameter 'name' is not null or undefined
assertParamExists('scrapeSetByName', 'name', name)
const localVarPath = `/api/sets/{name}/scrape`
.replace(`{${"name"}}`, encodeURIComponent(String(name)));
// use dummy base URL string because the URL constructor only accepts absolute URLs.
const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
let baseOptions;
if (configuration) {
baseOptions = configuration.baseOptions;
}
const localVarRequestOptions = { method: 'GET', ...baseOptions, ...options};
const localVarHeaderParameter = {} as any;
const localVarQueryParameter = {} as any;
setSearchParams(localVarUrlObj, localVarQueryParameter);
let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
@@ -214,19 +214,6 @@ export const SetServiceFp = function(configuration?: Configuration) {
const localVarOperationServerBasePath = operationServerMap['SetService.apiSetsNameNewGet']?.[localVarOperationServerIndex]?.url;
return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, localVarOperationServerBasePath || basePath);
},
/**
*
* @summary Scrape And Persist From Upstream
* @param {string} name
* @param {*} [options] Override http request option.
* @throws {RequiredError}
*/
async apiSetsNameScrapeGet(name: string, options?: RawAxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
const localVarAxiosArgs = await localVarAxiosParamCreator.apiSetsNameScrapeGet(name, options);
const localVarOperationServerIndex = configuration?.serverIndex ?? 0;
const localVarOperationServerBasePath = operationServerMap['SetService.apiSetsNameScrapeGet']?.[localVarOperationServerIndex]?.url;
return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, localVarOperationServerBasePath || basePath);
},
/**
*
* @summary Get a page of Card Sets with optional name query parameter
@@ -242,6 +229,19 @@ export const SetServiceFp = function(configuration?: Configuration) {
const localVarOperationServerBasePath = operationServerMap['SetService.getCardSetPage']?.[localVarOperationServerIndex]?.url;
return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, localVarOperationServerBasePath || basePath);
},
/**
*
* @summary Scrape a CardSet via name query parameter
* @param {string} name
* @param {*} [options] Override http request option.
* @throws {RequiredError}
*/
async scrapeSetByName(name: string, options?: RawAxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<void>> {
const localVarAxiosArgs = await localVarAxiosParamCreator.scrapeSetByName(name, options);
const localVarOperationServerIndex = configuration?.serverIndex ?? 0;
const localVarOperationServerBasePath = operationServerMap['SetService.scrapeSetByName']?.[localVarOperationServerIndex]?.url;
return (axios, basePath) => createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration)(axios, localVarOperationServerBasePath || basePath);
},
}
};
@@ -272,16 +272,6 @@ export const SetServiceFactory = function (configuration?: Configuration, basePa
apiSetsNameNewGet(requestParameters: SetServiceApiSetsNameNewGetRequest, options?: RawAxiosRequestConfig): AxiosPromise<Array<SetDto>> {
return localVarFp.apiSetsNameNewGet(requestParameters.name, options).then((request) => request(axios, basePath));
},
/**
*
* @summary Scrape And Persist From Upstream
* @param {SetServiceApiSetsNameScrapeGetRequest} requestParameters Request parameters.
* @param {*} [options] Override http request option.
* @throws {RequiredError}
*/
apiSetsNameScrapeGet(requestParameters: SetServiceApiSetsNameScrapeGetRequest, options?: RawAxiosRequestConfig): AxiosPromise<void> {
return localVarFp.apiSetsNameScrapeGet(requestParameters.name, options).then((request) => request(axios, basePath));
},
/**
*
* @summary Get a page of Card Sets with optional name query parameter
@@ -292,6 +282,16 @@ export const SetServiceFactory = function (configuration?: Configuration, basePa
getCardSetPage(requestParameters: SetServiceGetCardSetPageRequest = {}, options?: RawAxiosRequestConfig): AxiosPromise<PageSetDto> {
return localVarFp.getCardSetPage(requestParameters.name, requestParameters.page, requestParameters.pageSize, options).then((request) => request(axios, basePath));
},
/**
*
* @summary Scrape a CardSet via name query parameter
* @param {SetServiceScrapeSetByNameRequest} requestParameters Request parameters.
* @param {*} [options] Override http request option.
* @throws {RequiredError}
*/
scrapeSetByName(requestParameters: SetServiceScrapeSetByNameRequest, options?: RawAxiosRequestConfig): AxiosPromise<void> {
return localVarFp.scrapeSetByName(requestParameters.name, options).then((request) => request(axios, basePath));
},
};
};
@@ -323,20 +323,6 @@ export interface SetServiceApiSetsNameNewGetRequest {
readonly name: string
}
/**
* Request parameters for apiSetsNameScrapeGet operation in SetService.
* @export
* @interface SetServiceApiSetsNameScrapeGetRequest
*/
export interface SetServiceApiSetsNameScrapeGetRequest {
/**
*
* @type {string}
* @memberof SetServiceApiSetsNameScrapeGet
*/
readonly name: string
}
/**
* Request parameters for getCardSetPage operation in SetService.
* @export
@@ -365,6 +351,20 @@ export interface SetServiceGetCardSetPageRequest {
readonly pageSize?: number
}
/**
* Request parameters for scrapeSetByName operation in SetService.
* @export
* @interface SetServiceScrapeSetByNameRequest
*/
export interface SetServiceScrapeSetByNameRequest {
/**
*
* @type {string}
* @memberof SetServiceScrapeSetByName
*/
readonly name: string
}
/**
* SetService - object-oriented interface
* @export
@@ -396,18 +396,6 @@ export class SetService extends BaseAPI {
return SetServiceFp(this.configuration).apiSetsNameNewGet(requestParameters.name, options).then((request) => request(this.axios, this.basePath));
}
/**
*
* @summary Scrape And Persist From Upstream
* @param {SetServiceApiSetsNameScrapeGetRequest} requestParameters Request parameters.
* @param {*} [options] Override http request option.
* @throws {RequiredError}
* @memberof SetService
*/
public apiSetsNameScrapeGet(requestParameters: SetServiceApiSetsNameScrapeGetRequest, options?: RawAxiosRequestConfig) {
return SetServiceFp(this.configuration).apiSetsNameScrapeGet(requestParameters.name, options).then((request) => request(this.axios, this.basePath));
}
/**
*
* @summary Get a page of Card Sets with optional name query parameter
@@ -419,5 +407,17 @@ export class SetService extends BaseAPI {
public getCardSetPage(requestParameters: SetServiceGetCardSetPageRequest = {}, options?: RawAxiosRequestConfig) {
return SetServiceFp(this.configuration).getCardSetPage(requestParameters.name, requestParameters.page, requestParameters.pageSize, options).then((request) => request(this.axios, this.basePath));
}
/**
*
* @summary Scrape a CardSet via name query parameter
* @param {SetServiceScrapeSetByNameRequest} requestParameters Request parameters.
* @param {*} [options] Override http request option.
* @throws {RequiredError}
* @memberof SetService
*/
public scrapeSetByName(requestParameters: SetServiceScrapeSetByNameRequest, options?: RawAxiosRequestConfig) {
return SetServiceFp(this.configuration).scrapeSetByName(requestParameters.name, options).then((request) => request(this.axios, this.basePath));
}
}

View File

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

8
src/components.d.ts vendored
View File

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

View File

@@ -0,0 +1,56 @@
<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>>`

View File

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

View File

@@ -0,0 +1,77 @@
<template>
<Dialog
modal
:draggable="false"
:dismissable-mask="true"
:visible="visible"
@update:visible="emit('update:visible', $event)"
>
<template #header>
<div class="inline-flex items-center justify-center gap-2">
<span class="font-bold whitespace-nowrap">Import Set</span>
</div>
</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">
<label for="setName" class="font-semibold w-24">Set Name</label>
<InputText id="setName" class="flex-auto" autocomplete="off" v-model="cardSetName"/>
</div>
<template #footer>
<Button label="Cancel" text severity="secondary" @click="visible = false"/>
<Button label="Import" outlined severity="secondary" @click="importSet(cardSetName)"/>
</template>
</Dialog>
</template>
<script setup lang="ts">
import {inject, ref, type Ref, watch} from "vue";
import {SetService} from "@/api/openapi";
import {SetServiceKey} from "@/main.ts";
import {useToast} from "primevue";
const toast = useToast();
const emit = defineEmits(['update:visible'])
const visible: Ref<boolean> = defineModel("visible", {
required: true
})
const setService: SetService = inject(SetServiceKey) as SetService;
const cardSetName: Ref<string | null> = ref(null);
const importSet = async(name: string | null) => {
if (!name) {
toast.add({
severity: "warn",
summary: `Name of Set is required to import`,
})
return;
}
try {
await setService.scrapeSetByName({
name: name,
});
toast.add({
severity: "info",
summary: `Import Job for Set '${cardSetName.value}' was started successfully`,
})
} catch (ex: unknown) {
toast.add({
severity: "error",
summary: `Error occurred trying to import Set '${cardSetName.value}'`,
})
} finally {
cardSetName.value = null;
visible.value = false
}
}
watch(visible, () => {
cardSetName.value = null;
})
</script>
<style scoped>
</style>

View File

@@ -26,8 +26,9 @@ import {useAuthStore} from "./stores/auth.ts";
import SetsView from "./views/set/SetsView.vue";
import JobsView from "./views/JobsView.vue";
import {definePreset} from "@primeuix/themes";
import {getApiUrl, initConfig} from "@/util/config.ts";
import {getConfig, initConfig} from "@/util/config.ts";
import axios from "axios";
import CreateDeckView from "@/views/deck/CreateDeckView.vue";
// Initialize configuration from window object
initConfig((window as any).__APP_CONFIG__ || {})
@@ -113,7 +114,8 @@ const routes: RouteRecordRaw[] = [
{path: '/', component: HomeView},
{path: '/cards', component: CardsView, meta: {requiresAuth: false}},
{path: '/cards/:id', component: CardView, meta: {requiresAuth: true}},
{path: '/decks', component: DecksView, meta: {requiresAuth: true}},
{path: '/decks', component: DecksView, meta: {requiresAuth: false}},
{path: '/decks/create', component: CreateDeckView, meta: {requiresAuth: true}},
{path: '/decks/:id', component: DeckView, meta: {requiresAuth: true}},
{path: '/sets', component: SetsView},
{path: '/sets/:id', component: DeckView, meta: {requiresAuth: true}},
@@ -134,18 +136,15 @@ router.beforeEach(async (to) => {
return false;
}
}
return true;
})
app.use(router);
app.use(ToastService)
let apiUrl = getApiUrl();
if (!apiUrl) {
apiUrl = `http://${apiUrl}`
} else {
apiUrl = ''
}
const apiUrl = import.meta.env.PROD
? "/"
: `http://${getConfig().API_HOST}:${getConfig().API_PORT}`;
const axiosInstance = axios.create({
baseURL: apiUrl,

View File

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

View File

@@ -24,6 +24,14 @@ export const isMonsterCard = (card: Card): card is MonsterCard => {
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) => {
return `${monsterCard.type} MONSTER `
}

View File

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

View File

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

View File

@@ -30,7 +30,7 @@
<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 {JobServiceKey} from "../main.ts";

View File

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

View File

@@ -0,0 +1,283 @@
<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>

View File

@@ -1,73 +1,123 @@
<template>
<div class="card">
<Carousel :value="decks" :numVisible="3" :numScroll="3">
<template #item="slotProps">
<div class="border border-surface-200 dark:border-surface-700 rounded m-2 p-4 w-96 h-auto">
<div class="mb-4">
<div class="relative mx-auto">
<img
:src="'https://upload.wikimedia.org/wikipedia/en/2/2b/Yugioh_Card_Back.jpg?20201122212343'"
class="w-full rounded"
alt="Deck"
/>
<DataView :value="decks" :layout="layout">
<template #header>
<div class="flex justify-end gap-4">
<SelectButton v-model="layout" :options="layoutOptions" :allowEmpty="false">
<template #option="{ option }">
<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 class="flex justify-between ">
<p class="font-bold">
{{ slotProps.data.name }}
</p>
<Tag
value="[ARCHETYPE]"
/>
</div>
<div class="flex justify- items-center">
<SplitButton
label="View"
:model="deckMenuItems"
@click="viewDeck(slotProps.data.id)"
/>
</div>
</div>
</template>
</Carousel>
<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">
<img class="rounded w-full" :src="`https://primefaces.org/cdn/primevue/images/product/${deck.image}`" :alt="deck.name" style="max-width: 300px"/>
</div>
</div>
<div class="pt-6">
<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>
</template>
</DataView>
</template>
<script setup lang="ts">
import {type Deck, DeckService} from "../../api/openapi";
import {DeckServiceKey} from "../../main.ts";
import {type Deck, DeckService} from "@/api/openapi";
import {inject, onMounted, ref, type Ref} from "vue";
import {useToast} from "primevue";
import {DeckServiceKey} from "@/main.ts";
import {useRouter} from "vue-router";
const toast = useToast();
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 decks: Ref<Deck[]> = ref([])
const decks: Ref<Deck[]> = ref([]);
const deckMenuItems = [
{
label: 'Edit',
command: () => {
toast.add({
severity: 'info',
summary: 'Not Implemented',
detail: 'Deck Editing isn\'t implemented yet',
life: 3000
});
}
},
]
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 viewDeck = (deckId: number) => {
router.push(`/decks/${deckId}`);
const getDeckPage = async (page: number, pageSize: number): Promise<void> => {
loading.value = true;
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() => {
const decksResponse = await deckService.getDecks()
decks.value = decksResponse.data.content
await getDeckPage(
page.value,
pageSize.value
)
})
</script>

View File

@@ -1,4 +1,8 @@
<template>
<CardSetImportModal
:visible="importModalVisible"
@update:visible="args => importModalVisible = args"
/>
<DataTable
tableStyle="min-width: 50rem"
dataKey="id"
@@ -16,6 +20,11 @@
@page="handlePaging"
@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">
<template #body>
<Image alt="Image" preview class="h-64">
@@ -24,7 +33,9 @@
</template>
<template #image>
<div class="overflow-hidden">
<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"/>
<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"/>
</div>
</template>
<template #preview="slotProps">
@@ -46,8 +57,8 @@
</template>
</Column>
<Column header="No. of Regional Sets">
<template #body="slotProps">
{{ slotProps.data.regionalSets.length }}
<template #body>
N/A
</template>
</Column>
<template #footer> In total there are {{ sets ? sets.length : 0 }} Card Sets</template>
@@ -55,11 +66,12 @@
</template>
<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 {SetServiceKey} from "../../main.ts";
import {SetServiceKey} from "@/main.ts";
import type {DataTablePageEvent, DataTableSortEvent} from "primevue";
const importModalVisible: Ref<boolean> = ref(false);
const setService: SetService = inject(SetServiceKey) as SetService;
const loading: Ref<boolean> = ref(true);
const sets: Ref<SetDto[]> = ref([])
@@ -72,16 +84,16 @@ const first = ref(0);
const fetchCardSetPage = async (page: number, pageSize: number): Promise<void> => {
loading.value = true;
const cardPage = (await setService.getCardSetPage({
const setPage = (await setService.getCardSetPage({
name: null,
page: page,
pageSize: pageSize
}
)).data
sets.value = cardPage.content
pageCount.value = cardPage.totalPages!!
totalRecords.value = cardPage.totalRecords!!
sets.value = setPage.content
pageCount.value = setPage.totalPages!!
totalRecords.value = setPage.totalRecords!!
loading.value = false;
}