From 85289069ba30d69cfe31235872bc5f1f9bb87a75 Mon Sep 17 00:00:00 2001 From: Julian Krauser Date: Sun, 6 Oct 2024 12:02:39 +0200 Subject: [PATCH] calendar base component --- package-lock.json | 55 ++++++++++- package.json | 4 + src/main.css | 9 +- src/router/index.ts | 2 +- src/views/admin/club/calendar/Calendar.vue | 103 +++++++++++++++++++++ 5 files changed, 170 insertions(+), 3 deletions(-) create mode 100644 src/views/admin/club/calendar/Calendar.vue diff --git a/package-lock.json b/package-lock.json index 1d9dc45..760158b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,9 +9,12 @@ "version": "0.0.2", "license": "GPL-3.0-only", "dependencies": { + "@fullcalendar/core": "^6.1.15", + "@fullcalendar/daygrid": "^6.1.15", + "@fullcalendar/interaction": "^6.1.15", + "@fullcalendar/vue3": "^6.1.15", "@headlessui/vue": "^1.7.13", "@heroicons/vue": "^2.1.5", - "@types/lodash.isequal": "^4.5.8", "axios": "^0.26.1", "jwt-decode": "^4.0.0", "lodash.clonedeep": "^4.5.0", @@ -31,6 +34,7 @@ "@tsconfig/node20": "^20.1.4", "@types/eslint": "~9.6.0", "@types/lodash.clonedeep": "^4.5.9", + "@types/lodash.isequal": "^4.5.8", "@types/node": "^20.14.5", "@types/nprogress": "^0.2.0", "@types/qrcode": "^1.5.5", @@ -2409,6 +2413,43 @@ "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } }, + "node_modules/@fullcalendar/core": { + "version": "6.1.15", + "resolved": "https://registry.npmjs.org/@fullcalendar/core/-/core-6.1.15.tgz", + "integrity": "sha512-BuX7o6ALpLb84cMw1FCB9/cSgF4JbVO894cjJZ6kP74jzbUZNjtwffwRdA+Id8rrLjT30d/7TrkW90k4zbXB5Q==", + "license": "MIT", + "dependencies": { + "preact": "~10.12.1" + } + }, + "node_modules/@fullcalendar/daygrid": { + "version": "6.1.15", + "resolved": "https://registry.npmjs.org/@fullcalendar/daygrid/-/daygrid-6.1.15.tgz", + "integrity": "sha512-j8tL0HhfiVsdtOCLfzK2J0RtSkiad3BYYemwQKq512cx6btz6ZZ2RNc/hVnIxluuWFyvx5sXZwoeTJsFSFTEFA==", + "license": "MIT", + "peerDependencies": { + "@fullcalendar/core": "~6.1.15" + } + }, + "node_modules/@fullcalendar/interaction": { + "version": "6.1.15", + "resolved": "https://registry.npmjs.org/@fullcalendar/interaction/-/interaction-6.1.15.tgz", + "integrity": "sha512-DOTSkofizM7QItjgu7W68TvKKvN9PSEEvDJceyMbQDvlXHa7pm/WAVtAc6xSDZ9xmB1QramYoWGLHkCYbTW1rQ==", + "license": "MIT", + "peerDependencies": { + "@fullcalendar/core": "~6.1.15" + } + }, + "node_modules/@fullcalendar/vue3": { + "version": "6.1.15", + "resolved": "https://registry.npmjs.org/@fullcalendar/vue3/-/vue3-6.1.15.tgz", + "integrity": "sha512-ctfTICGrNEIj7gmLHQcUYe0WzDTSW5Vd9hyOnVChxPU75AZU9WqdDMkHwJYnfNxNhT6QQuiMHq/qsRRd5zQwOw==", + "license": "MIT", + "peerDependencies": { + "@fullcalendar/core": "~6.1.15", + "vue": "^3.0.11" + } + }, "node_modules/@headlessui/vue": { "version": "1.7.22", "resolved": "https://registry.npmjs.org/@headlessui/vue/-/vue-1.7.22.tgz", @@ -3070,6 +3111,7 @@ "version": "4.17.7", "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.7.tgz", "integrity": "sha512-8wTvZawATi/lsmNu10/j2hk1KEP0IvjubqPE3cu1Xz7xfXXt5oCq3SNUz4fMIP4XGF9Ky+Ue2tBA3hcS7LSBlA==", + "dev": true, "license": "MIT" }, "node_modules/@types/lodash.clonedeep": { @@ -3086,6 +3128,7 @@ "version": "4.5.8", "resolved": "https://registry.npmjs.org/@types/lodash.isequal/-/lodash.isequal-4.5.8.tgz", "integrity": "sha512-uput6pg4E/tj2LGxCZo9+y27JNyB2OZuuI/T5F+ylVDYuqICLG2/ktjxx0v6GvVntAf8TvEzeQLcV0ffRirXuA==", + "dev": true, "license": "MIT", "dependencies": { "@types/lodash": "*" @@ -7492,6 +7535,16 @@ "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", "dev": true }, + "node_modules/preact": { + "version": "10.12.1", + "resolved": "https://registry.npmjs.org/preact/-/preact-10.12.1.tgz", + "integrity": "sha512-l8386ixSsBdbreOAkqtrwqHwdvR35ID8c3rKPa8lCWuO86dBi32QWHV4vfsZK1utLLFMvw+Z5Ad4XLkZzchscg==", + "license": "MIT", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/preact" + } + }, "node_modules/prebuild-install": { "version": "7.1.2", "resolved": "https://registry.npmjs.org/prebuild-install/-/prebuild-install-7.1.2.tgz", diff --git a/package.json b/package.json index 275162d..15ddae3 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,10 @@ "author": "JK Effects", "license": "GPL-3.0-only", "dependencies": { + "@fullcalendar/core": "^6.1.15", + "@fullcalendar/daygrid": "^6.1.15", + "@fullcalendar/interaction": "^6.1.15", + "@fullcalendar/vue3": "^6.1.15", "@headlessui/vue": "^1.7.13", "@heroicons/vue": "^2.1.5", "axios": "^0.26.1", diff --git a/src/main.css b/src/main.css index 3d54f9b..ffe238b 100644 --- a/src/main.css +++ b/src/main.css @@ -56,7 +56,7 @@ body { @apply w-full h-full overflow-hidden flex flex-col; } -button:not([headlessui]), +button:not([headlessui]):not([class*="fc"]), a[button]:not([headlessui]) { @apply relative box-border h-10 w-full flex justify-center py-2 px-4 text-sm font-medium rounded-md focus:outline-none focus:ring-0; } @@ -91,3 +91,10 @@ input[disabled], textarea[disabled] { @apply opacity-75 pointer-events-none; } + +.fc-button-primary { + @apply !bg-primary !border-primary !outline-none !ring-0 hover:!bg-red-700 hover:!border-red-700; +} +.fc-button-active { + @apply !bg-red-500 !border-red-500; +} diff --git a/src/router/index.ts b/src/router/index.ts index 25dbd9d..5d1eeff 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -135,7 +135,7 @@ const router = createRouter({ { path: "calendar", name: "admin-club-calendar", - component: () => import("@/views/admin/members/Overview.vue"), + component: () => import("@/views/admin/club/calendar/Calendar.vue"), meta: { type: "read", section: "club", module: "calendar" }, beforeEnter: [abilityAndNavUpdate], }, diff --git a/src/views/admin/club/calendar/Calendar.vue b/src/views/admin/club/calendar/Calendar.vue new file mode 100644 index 0000000..6994004 --- /dev/null +++ b/src/views/admin/club/calendar/Calendar.vue @@ -0,0 +1,103 @@ + + + + +