feat: nuxt ui setup

This commit is contained in:
Pihkaal
2025-11-05 16:14:59 +01:00
parent 1b06b9d323
commit d2c8591ddb
11 changed files with 2090 additions and 121 deletions

3
.gitignore vendored
View File

@@ -1,3 +1,6 @@
auto-imports.d.ts
components.d.ts
# Logs # Logs
logs logs
*.log *.log

View File

@@ -1,13 +1,13 @@
<!DOCTYPE html> <!doctype html>
<html lang=""> <html lang="">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite App</title> <title>Vite App</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app" class="isolate"></div>
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/main.ts"></script>
</body> </body>
</html> </html>

View File

@@ -21,9 +21,13 @@
"format": "prettier --write src/" "format": "prettier --write src/"
}, },
"dependencies": { "dependencies": {
"@nuxt/ui": "^4.1.0",
"@unhead/vue": "^2.0.19",
"pinia": "^3.0.3", "pinia": "^3.0.3",
"tailwindcss": "^4.1.16",
"ts-ics": "^2.4.0", "ts-ics": "^2.4.0",
"vue": "^3.5.22" "vue": "^3.5.22",
"vue-router": "^4.6.3"
}, },
"devDependencies": { "devDependencies": {
"@playwright/test": "^1.56.1", "@playwright/test": "^1.56.1",

2085
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

View File

@@ -1,2 +1,3 @@
onlyBuiltDependencies: onlyBuiltDependencies:
- esbuild - esbuild
- vue-demi

View File

@@ -25,80 +25,15 @@ const downloadCalendar = async () => {
</script> </script>
<template> <template>
<div class="app"> <UApp>
<h1>Gestime APHP Export</h1> <div class="app">
<h1>Gestime APHP Export</h1>
<div class="query-section"> <UButton
<button @click="downloadCalendar">Download calendar</button> loading-auto
label="Download calendar"
@click="downloadCalendar"
/>
</div> </div>
</div> </UApp>
</template> </template>
<style scoped>
.app {
padding: 16px;
min-width: 400px;
max-width: 600px;
}
h1 {
font-size: 20px;
margin-bottom: 16px;
}
.query-section {
margin-bottom: 24px;
}
button {
background-color: #4caf50;
color: white;
padding: 10px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
margin-right: 8px;
}
button:hover:not(:disabled) {
background-color: #45a049;
}
button:disabled {
background-color: #cccccc;
cursor: not-allowed;
}
.url-info {
margin-top: 12px;
padding: 8px;
background-color: #f0f0f0;
border-radius: 4px;
font-size: 12px;
word-break: break-all;
}
.result {
margin-top: 12px;
padding: 12px;
background-color: #f9f9f9;
border: 1px solid #ddd;
border-radius: 4px;
max-height: 300px;
overflow-y: auto;
}
.result pre {
margin: 0;
font-size: 12px;
white-space: pre-wrap;
word-break: break-word;
}
hr {
margin: 24px 0;
border: none;
border-top: 1px solid #ddd;
}
</style>

2
src/assets/main.css Normal file
View File

@@ -0,0 +1,2 @@
@import "tailwindcss";
@import "@nuxt/ui";

View File

@@ -1,9 +1,13 @@
import "./assets/main.css";
import { createApp } from "vue"; import { createApp } from "vue";
import { createPinia } from "pinia"; import { createPinia } from "pinia";
import ui from "@nuxt/ui/vue-plugin";
import App from "./App.vue"; import App from "./App.vue";
const app = createApp(App); const app = createApp(App);
app.use(createPinia()); app.use(createPinia());
app.use(ui);
app.mount("#app"); app.mount("#app");

View File

@@ -1,6 +1,12 @@
{ {
"extends": "@vue/tsconfig/tsconfig.dom.json", "extends": "@vue/tsconfig/tsconfig.dom.json",
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"], "include": [
"env.d.ts",
"src/**/*",
"src/**/*.vue",
"auto-imports.d.ts",
"components.d.ts"
],
"exclude": ["src/**/__tests__/*"], "exclude": ["src/**/__tests__/*"],
"compilerOptions": { "compilerOptions": {
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo", "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",

View File

@@ -12,6 +12,10 @@
"module": "ESNext", "module": "ESNext",
"moduleResolution": "Bundler", "moduleResolution": "Bundler",
"types": ["node"] "types": ["node"],
"paths": {
"#build/ui": ["./node_modules/.nuxt-ui/ui"]
}
} }
} }

View File

@@ -3,9 +3,10 @@ import { fileURLToPath, URL } from "node:url";
import { defineConfig } from "vite"; import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue"; import vue from "@vitejs/plugin-vue";
import vueDevTools from "vite-plugin-vue-devtools"; import vueDevTools from "vite-plugin-vue-devtools";
import ui from "@nuxt/ui/vite";
export default defineConfig({ export default defineConfig({
plugins: [vue(), vueDevTools()], plugins: [vue(), vueDevTools(), ui()],
resolve: { resolve: {
alias: { alias: {
"@": fileURLToPath(new URL("./src", import.meta.url)), "@": fileURLToPath(new URL("./src", import.meta.url)),