diff --git a/index.html b/index.html index 6c78738..72f89e9 100644 --- a/index.html +++ b/index.html @@ -1,13 +1,13 @@ - + Executive Information System - -
+ +
\ No newline at end of file diff --git a/package-lock.json b/package-lock.json index e39a7f2..dfed7fb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,7 +8,7 @@ "name": "eis", "version": "0.0.1", "dependencies": { - "@apollo/client": "^3.8.7", + "@apollo/client": "^3.8.8", "@headlessui/tailwindcss": "^0.2.0", "@headlessui/vue": "^1.7.16", "@heroicons/vue": "^2.0.18", @@ -16,6 +16,7 @@ "@phosphor-icons/vue": "^2.1.6", "@types/qs": "^6.9.9", "@types/uuid": "^9.0.2", + "@vue/apollo-option": "^4.0.0-beta.12", "devextreme": "23.1.5", "devextreme-vue": "23.1.5", "dotenv": "^16.3.1", @@ -98,17 +99,16 @@ } }, "node_modules/@apollo/client": { - "version": "3.8.7", - "resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.8.7.tgz", - "integrity": "sha512-DnQtFkQrCyxHTSa9gR84YRLmU/al6HeXcLZazVe+VxKBmx/Hj4rV8xWtzfWYX5ijartsqDR7SJgV037MATEecA==", + "version": "3.8.8", + "resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.8.8.tgz", + "integrity": "sha512-omjd9ryGDkadZrKW6l5ktUAdS4SNaFOccYQ4ZST0HLW83y8kQaSZOCTNlpkoBUK8cv6qP8+AxOKwLm2ho8qQ+Q==", "dependencies": { "@graphql-typed-document-node/core": "^3.1.1", - "@wry/context": "^0.7.3", "@wry/equality": "^0.5.6", - "@wry/trie": "^0.4.3", + "@wry/trie": "^0.5.0", "graphql-tag": "^2.12.6", "hoist-non-react-statics": "^3.3.2", - "optimism": "^0.17.5", + "optimism": "^0.18.0", "prop-types": "^15.7.2", "response-iterator": "^0.2.6", "symbol-observable": "^4.0.0", @@ -2013,6 +2013,18 @@ "@volar/language-core": "1.10.3" } }, + "node_modules/@vue/apollo-option": { + "version": "4.0.0-beta.12", + "resolved": "https://registry.npmjs.org/@vue/apollo-option/-/apollo-option-4.0.0-beta.12.tgz", + "integrity": "sha512-QgfLG1mRsLxRUpiwuOXJgvWt1UziiHu62zQaC3TnPWNmblTvWiEIl/FrqaJ3BbVC/kEu8dvLdvqic0zC/VA3Ww==", + "dependencies": { + "throttle-debounce": "^5.0.0" + }, + "peerDependencies": { + "@apollo/client": "^3.2.1", + "vue": "^3.1.0" + } + }, "node_modules/@vue/babel-helper-vue-transform-on": { "version": "1.1.5", "resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.1.5.tgz", @@ -2350,6 +2362,22 @@ } } }, + "node_modules/@wry/caches": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@wry/caches/-/caches-1.0.1.tgz", + "integrity": "sha512-bXuaUNLVVkD20wcGBWRyo7j9N3TxePEWFZj2Y+r9OoUzfqmavM84+mFykRicNsBqatba5JLay1t48wxaXaWnlA==", + "dependencies": { + "tslib": "^2.3.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/@wry/caches/node_modules/tslib": { + "version": "2.6.2", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", + "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" + }, "node_modules/@wry/context": { "version": "0.7.4", "resolved": "https://registry.npmjs.org/@wry/context/-/context-0.7.4.tgz", @@ -2383,9 +2411,9 @@ "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" }, "node_modules/@wry/trie": { - "version": "0.4.3", - "resolved": "https://registry.npmjs.org/@wry/trie/-/trie-0.4.3.tgz", - "integrity": "sha512-I6bHwH0fSf6RqQcnnXLJKhkSXG45MFral3GxPaY4uAl0LYDZM+YDVDAiU9bYwjTuysy1S0IeecWtmq1SZA3M1w==", + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/@wry/trie/-/trie-0.5.0.tgz", + "integrity": "sha512-FNoYzHawTMk/6KMQoEG5O4PuioX19UbwdQKF44yw0nLfOypfQdjtfZzo/UIJWAJ23sNIFbD1Ug9lbaDGMwbqQA==", "dependencies": { "tslib": "^2.3.0" }, @@ -6988,15 +7016,27 @@ } }, "node_modules/optimism": { - "version": "0.17.5", - "resolved": "https://registry.npmjs.org/optimism/-/optimism-0.17.5.tgz", - "integrity": "sha512-TEcp8ZwK1RczmvMnvktxHSF2tKgMWjJ71xEFGX5ApLh67VsMSTy1ZUlipJw8W+KaqgOmQ+4pqwkeivY89j+4Vw==", + "version": "0.18.0", + "resolved": "https://registry.npmjs.org/optimism/-/optimism-0.18.0.tgz", + "integrity": "sha512-tGn8+REwLRNFnb9WmcY5IfpOqeX2kpaYJ1s6Ae3mn12AeydLkR3j+jSCmVQFoXqU8D41PAJ1RG1rCRNWmNZVmQ==", "dependencies": { + "@wry/caches": "^1.0.0", "@wry/context": "^0.7.0", "@wry/trie": "^0.4.3", "tslib": "^2.3.0" } }, + "node_modules/optimism/node_modules/@wry/trie": { + "version": "0.4.3", + "resolved": "https://registry.npmjs.org/@wry/trie/-/trie-0.4.3.tgz", + "integrity": "sha512-I6bHwH0fSf6RqQcnnXLJKhkSXG45MFral3GxPaY4uAl0LYDZM+YDVDAiU9bYwjTuysy1S0IeecWtmq1SZA3M1w==", + "dependencies": { + "tslib": "^2.3.0" + }, + "engines": { + "node": ">=8" + } + }, "node_modules/optimism/node_modules/tslib": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", @@ -8732,6 +8772,14 @@ "node": ">=0.8" } }, + "node_modules/throttle-debounce": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-5.0.0.tgz", + "integrity": "sha512-2iQTSgkkc1Zyk0MeVrt/3BvuOXYPl/R8Z0U2xxo9rjwNciaHDG3R+Lm6dh4EeUci49DanvBnuqI6jshoQQRGEg==", + "engines": { + "node": ">=12.22" + } + }, "node_modules/tinybench": { "version": "2.5.1", "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.5.1.tgz", @@ -9933,17 +9981,16 @@ } }, "@apollo/client": { - "version": "3.8.7", - "resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.8.7.tgz", - "integrity": "sha512-DnQtFkQrCyxHTSa9gR84YRLmU/al6HeXcLZazVe+VxKBmx/Hj4rV8xWtzfWYX5ijartsqDR7SJgV037MATEecA==", + "version": "3.8.8", + "resolved": "https://registry.npmjs.org/@apollo/client/-/client-3.8.8.tgz", + "integrity": "sha512-omjd9ryGDkadZrKW6l5ktUAdS4SNaFOccYQ4ZST0HLW83y8kQaSZOCTNlpkoBUK8cv6qP8+AxOKwLm2ho8qQ+Q==", "requires": { "@graphql-typed-document-node/core": "^3.1.1", - "@wry/context": "^0.7.3", "@wry/equality": "^0.5.6", - "@wry/trie": "^0.4.3", + "@wry/trie": "^0.5.0", "graphql-tag": "^2.12.6", "hoist-non-react-statics": "^3.3.2", - "optimism": "^0.17.5", + "optimism": "^0.18.0", "prop-types": "^15.7.2", "response-iterator": "^0.2.6", "symbol-observable": "^4.0.0", @@ -11263,6 +11310,14 @@ "@volar/language-core": "1.10.3" } }, + "@vue/apollo-option": { + "version": "4.0.0-beta.12", + "resolved": "https://registry.npmjs.org/@vue/apollo-option/-/apollo-option-4.0.0-beta.12.tgz", + "integrity": "sha512-QgfLG1mRsLxRUpiwuOXJgvWt1UziiHu62zQaC3TnPWNmblTvWiEIl/FrqaJ3BbVC/kEu8dvLdvqic0zC/VA3Ww==", + "requires": { + "throttle-debounce": "^5.0.0" + } + }, "@vue/babel-helper-vue-transform-on": { "version": "1.1.5", "resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.1.5.tgz", @@ -11513,6 +11568,21 @@ } } }, + "@wry/caches": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@wry/caches/-/caches-1.0.1.tgz", + "integrity": "sha512-bXuaUNLVVkD20wcGBWRyo7j9N3TxePEWFZj2Y+r9OoUzfqmavM84+mFykRicNsBqatba5JLay1t48wxaXaWnlA==", + "requires": { + "tslib": "^2.3.0" + }, + "dependencies": { + "tslib": { + "version": "2.6.2", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", + "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" + } + } + }, "@wry/context": { "version": "0.7.4", "resolved": "https://registry.npmjs.org/@wry/context/-/context-0.7.4.tgz", @@ -11544,9 +11614,9 @@ } }, "@wry/trie": { - "version": "0.4.3", - "resolved": "https://registry.npmjs.org/@wry/trie/-/trie-0.4.3.tgz", - "integrity": "sha512-I6bHwH0fSf6RqQcnnXLJKhkSXG45MFral3GxPaY4uAl0LYDZM+YDVDAiU9bYwjTuysy1S0IeecWtmq1SZA3M1w==", + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/@wry/trie/-/trie-0.5.0.tgz", + "integrity": "sha512-FNoYzHawTMk/6KMQoEG5O4PuioX19UbwdQKF44yw0nLfOypfQdjtfZzo/UIJWAJ23sNIFbD1Ug9lbaDGMwbqQA==", "requires": { "tslib": "^2.3.0" }, @@ -15029,15 +15099,24 @@ "integrity": "sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q==" }, "optimism": { - "version": "0.17.5", - "resolved": "https://registry.npmjs.org/optimism/-/optimism-0.17.5.tgz", - "integrity": "sha512-TEcp8ZwK1RczmvMnvktxHSF2tKgMWjJ71xEFGX5ApLh67VsMSTy1ZUlipJw8W+KaqgOmQ+4pqwkeivY89j+4Vw==", + "version": "0.18.0", + "resolved": "https://registry.npmjs.org/optimism/-/optimism-0.18.0.tgz", + "integrity": "sha512-tGn8+REwLRNFnb9WmcY5IfpOqeX2kpaYJ1s6Ae3mn12AeydLkR3j+jSCmVQFoXqU8D41PAJ1RG1rCRNWmNZVmQ==", "requires": { + "@wry/caches": "^1.0.0", "@wry/context": "^0.7.0", "@wry/trie": "^0.4.3", "tslib": "^2.3.0" }, "dependencies": { + "@wry/trie": { + "version": "0.4.3", + "resolved": "https://registry.npmjs.org/@wry/trie/-/trie-0.4.3.tgz", + "integrity": "sha512-I6bHwH0fSf6RqQcnnXLJKhkSXG45MFral3GxPaY4uAl0LYDZM+YDVDAiU9bYwjTuysy1S0IeecWtmq1SZA3M1w==", + "requires": { + "tslib": "^2.3.0" + } + }, "tslib": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", @@ -16316,6 +16395,11 @@ "thenify": ">= 3.1.0 < 4" } }, + "throttle-debounce": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-5.0.0.tgz", + "integrity": "sha512-2iQTSgkkc1Zyk0MeVrt/3BvuOXYPl/R8Z0U2xxo9rjwNciaHDG3R+Lm6dh4EeUci49DanvBnuqI6jshoQQRGEg==" + }, "tinybench": { "version": "2.5.1", "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.5.1.tgz", diff --git a/package.json b/package.json index d63d075..bef3368 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,7 @@ "prepare": "tw-patch install" }, "dependencies": { - "@apollo/client": "^3.8.7", + "@apollo/client": "^3.8.8", "@headlessui/tailwindcss": "^0.2.0", "@headlessui/vue": "^1.7.16", "@heroicons/vue": "^2.0.18", @@ -23,6 +23,7 @@ "@phosphor-icons/vue": "^2.1.6", "@types/qs": "^6.9.9", "@types/uuid": "^9.0.2", + "@vue/apollo-option": "^4.0.0-beta.12", "devextreme": "23.1.5", "devextreme-vue": "23.1.5", "dotenv": "^16.3.1", @@ -70,4 +71,4 @@ "vitest": "^0.34.6", "vue-tsc": "^1.6.5" } -} \ No newline at end of file +} diff --git a/src/assets/css/style.css b/src/assets/css/style.css index f44992a..04eb334 100644 --- a/src/assets/css/style.css +++ b/src/assets/css/style.css @@ -705,6 +705,20 @@ select { --tw-backdrop-sepia: ; } +html { + height: 100%; + --tw-bg-opacity: 1; + background-color: rgb(243 247 249 / var(--tw-bg-opacity)); +} + +body { + height: 100%; +} + +#app { + height: 100%; +} + /* NavBar */ .menu-item { @@ -1095,10 +1109,6 @@ select { margin-top: 1.5rem; } -.mt-8 { - margin-top: 2rem; -} - .line-clamp-1 { overflow: hidden; display: -webkit-box; @@ -1178,6 +1188,10 @@ select { height: 2.7rem; } +.h-\[56px\] { + height: 56px; +} + .h-\[66px\] { height: 66px; } @@ -1203,10 +1217,6 @@ select { height: 80vh; } -.h-\[56px\] { - height: 56px; -} - .max-h-0 { max-height: 0px; } @@ -1231,10 +1241,6 @@ select { min-height: 100vh; } -.min-h-\[56px\] { - min-height: 56px; -} - .w-0 { width: 0px; } @@ -1287,6 +1293,10 @@ select { width: 2.25rem; } +.w-\[170px\] { + width: 170px; +} + .w-\[2\.7rem\] { width: 2.7rem; } @@ -1303,10 +1313,6 @@ select { width: 100%; } -.w-\[170px\] { - width: 170px; -} - .max-w-2xl { max-width: 42rem; } @@ -1468,10 +1474,6 @@ select { place-items: center; } -.content-start { - align-content: flex-start; -} - .items-start { align-items: flex-start; } @@ -1554,6 +1556,12 @@ select { margin-bottom: calc(0.25rem * var(--tw-space-y-reverse)); } +.space-y-2 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0.5rem * var(--tw-space-y-reverse)); +} + .space-y-3 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse))); @@ -1566,12 +1574,6 @@ select { margin-bottom: calc(1rem * var(--tw-space-y-reverse)); } -.space-y-2 > :not([hidden]) ~ :not([hidden]) { - --tw-space-y-reverse: 0; - margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse))); - margin-bottom: calc(0.5rem * var(--tw-space-y-reverse)); -} - .divide-y > :not([hidden]) ~ :not([hidden]) { --tw-divide-y-reverse: 0; border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); @@ -2601,11 +2603,6 @@ select { background-color: rgb(255 255 0 / var(--tw-bg-opacity)); } -.hover\:text-gray-500:hover { - --tw-text-opacity: 1; - color: rgb(107 114 128 / var(--tw-text-opacity)); -} - .hover\:text-primary-500:hover { --tw-text-opacity: 1; color: rgb(3 91 113 / var(--tw-text-opacity)); @@ -2695,14 +2692,14 @@ select { --tw-ring-opacity: 0.1; } -.focus\:ring-offset-2:focus { - --tw-ring-offset-width: 2px; -} - .focus\:ring-offset-0:focus { --tw-ring-offset-width: 0px; } +.focus\:ring-offset-2:focus { + --tw-ring-offset-width: 2px; +} + .focus-visible\:outline:focus-visible { outline-style: solid; } diff --git a/src/assets/css/tailwind.css b/src/assets/css/tailwind.css index cb1564b..ef012dc 100644 --- a/src/assets/css/tailwind.css +++ b/src/assets/css/tailwind.css @@ -3,6 +3,15 @@ @tailwind utilities; @layer components { + html { + @apply h-full bg-layout; + } + body { + @apply h-full; + } + #app { + @apply h-full; + } /* NavBar */ .menu-item { @apply w-full text-left block px-4 py-3 text-base text-gray-800; diff --git a/src/main.ts b/src/main.ts index c8f6e48..642dd9d 100644 --- a/src/main.ts +++ b/src/main.ts @@ -3,11 +3,18 @@ import '@lottiefiles/lottie-player' import '@/assets/css/main.css' import { createApp } from 'vue' import { createPinia } from 'pinia' +import { createApolloProvider } from '@vue/apollo-option' +import { apolloClient } from './utils/graphql' import App from './App.vue' import router from './router' const app = createApp(App) +const apolloProvider = createApolloProvider({ + defaultClient: apolloClient, +}); + app.use(createPinia()) +app.use(apolloProvider) app.use(router) app.mount('#app') diff --git a/src/stores/queries.ts b/src/stores/queries.ts new file mode 100644 index 0000000..6c46a26 --- /dev/null +++ b/src/stores/queries.ts @@ -0,0 +1,21 @@ +import { ref, computed } from 'vue' +import { defineStore } from 'pinia' +import gql from 'graphql-tag' +import { useQuery } from '@apollo/client' + +export const useQueryStore = defineStore('query', () => { + const getUser = useQuery(gql` + query getUsers { + users { + id + firstname + lastname + email + } + } + `) + + return { + getUser, + } +}) \ No newline at end of file diff --git a/vite.config.ts b/vite.config.ts index 45f8d2c..125d649 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -16,7 +16,7 @@ export default defineConfig({ } }), vueJsx(), - utwm({}), + // process.env.NODE_ENV === 'production' && utwm({}) ], resolve: { alias: {