From a02bdb4cbe5a6cca4f2520d530022df8d45de22e Mon Sep 17 00:00:00 2001 From: igor Date: Thu, 15 May 2025 10:16:53 +0200 Subject: [PATCH] pridane rychle pridanie tasku, pridana kniznica Mitt pre globalne events --- webapp/package-lock.json | 7 ++++ webapp/package.json | 1 + webapp/src/App.vue | 57 ++++++++++++++++++++++++++++++--- webapp/src/assets/css/style.css | 55 +++++++++++++++++++++++++++++-- webapp/src/events.js | 5 +++ webapp/src/views/Dashboard.vue | 8 +++++ 6 files changed, 126 insertions(+), 7 deletions(-) create mode 100644 webapp/src/events.js diff --git a/webapp/package-lock.json b/webapp/package-lock.json index 38d9388..43892fc 100644 --- a/webapp/package-lock.json +++ b/webapp/package-lock.json @@ -12,6 +12,7 @@ "@fortawesome/fontawesome-svg-core": "^6.7.2", "@fortawesome/free-solid-svg-icons": "^6.7.2", "@fortawesome/vue-fontawesome": "^3.0.8", + "mitt": "^3.0.1", "vue": "^3.5.13", "vue-router": "^4.5.0", "vuedraggable": "^4.1.0" @@ -1275,6 +1276,12 @@ "@jridgewell/sourcemap-codec": "^1.5.0" } }, + "node_modules/mitt": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz", + "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==", + "license": "MIT" + }, "node_modules/nanoid": { "version": "3.3.11", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz", diff --git a/webapp/package.json b/webapp/package.json index 391158d..6641b9b 100644 --- a/webapp/package.json +++ b/webapp/package.json @@ -13,6 +13,7 @@ "@fortawesome/fontawesome-svg-core": "^6.7.2", "@fortawesome/free-solid-svg-icons": "^6.7.2", "@fortawesome/vue-fontawesome": "^3.0.8", + "mitt": "^3.0.1", "vue": "^3.5.13", "vue-router": "^4.5.0", "vuedraggable": "^4.1.0" diff --git a/webapp/src/App.vue b/webapp/src/App.vue index a7b9d2b..3368ae1 100644 --- a/webapp/src/App.vue +++ b/webapp/src/App.vue @@ -8,13 +8,60 @@

Bug Report

+
+ + +
- Pridať bug - Zoznam reportov - Archív - API - O aplikácii + Pridať + bug + Zoznam + reportov + + Archív + API + O + aplikácii
+ + diff --git a/webapp/src/assets/css/style.css b/webapp/src/assets/css/style.css index 9b8468f..7a21471 100644 --- a/webapp/src/assets/css/style.css +++ b/webapp/src/assets/css/style.css @@ -131,30 +131,76 @@ button:focus-visible, flex-direction: row; align-items: center; } +#header .short-bug { + display: flex; + flex-direction: row; + flex-grow: 2; + /* border: 1px red solid; */ + padding: 0px 20px; + align-items: center; + justify-content: center +} +#header .short-bug input { + width: 80%; + padding: 5px; + border: 1px solid #ccc; + border-radius: 3px; + background-color: var(--color-bg2); + color: var(--color-text0); +} #header .menu { display: flex; flex-direction: row; } #header .menu a, -#header .menu a:visited { +#header .menu a:visited, +#header button { border: 1px solid var(--color-text0); padding: 5px 10px; border-radius: 5px; margin-left: 20px; transition: all 0.3s; } -#header .menu a:hover { +#header .menu a:hover, +#header button:hover { color: var(--color-text1); background-color: var(--color-bg1); } +#header .short-bug button { + margin: 0px; + + /* height: 30px; */ +} #header h1 { display: inline-block; } +@media (max-width: 1400px) { + #header { + flex-wrap: wrap; + } + #header .short-bug { + width: 50%; + padding: 0px; + align-items: end; + justify-content: flex-end; + } + #header .menu { + width: 100%; + align-items: end; + justify-content: flex-end; + padding-top: 20px; + } +} @media (max-width: 900px) { #header { flex-direction: column; align-items: center; } + #header .short-bug { + width: 100%; + align-items: center; + justify-content: center + } #header .menu { flex-wrap: wrap; justify-content: center; @@ -163,6 +209,11 @@ button:focus-visible, margin: 5px; } } +@media (max-width: 600px) { + #header .short-bug { + flex-direction: column; + } +} /* ---------------------------------------------------- 03 - DASHBOARD diff --git a/webapp/src/events.js b/webapp/src/events.js new file mode 100644 index 0000000..2b60227 --- /dev/null +++ b/webapp/src/events.js @@ -0,0 +1,5 @@ +import mitt from "mitt"; + +const events = mitt(); + +export default events; diff --git a/webapp/src/views/Dashboard.vue b/webapp/src/views/Dashboard.vue index b88579f..e3b64f0 100644 --- a/webapp/src/views/Dashboard.vue +++ b/webapp/src/views/Dashboard.vue @@ -141,6 +141,7 @@ import ReportBox from "../components/ReportBox.vue"; import draggable from "vuedraggable"; import { backend } from "../backend"; import FullScreenLoader from "../components/FullScreenLoader.vue"; +import events from "../events"; export default { components: { @@ -231,6 +232,13 @@ export default { }, mounted() { this.loadData(); + events.on("reports-changed", () => { + console.log("Dashoboard reports-changed"); + this.loadData(false); + }); }, + unmounted() { + events.off("reports-changed"); + } };