diff --git a/assets/components.d.ts b/assets/components.d.ts index 644350ae..8edd16d3 100644 --- a/assets/components.d.ts +++ b/assets/components.d.ts @@ -13,6 +13,7 @@ declare module '@vue/runtime-core' { ComplexLogItem: typeof import('./components/LogViewer/ComplexLogItem.vue')['default'] ContainerStat: typeof import('./components/LogViewer/ContainerStat.vue')['default'] ContainerTitle: typeof import('./components/LogViewer/ContainerTitle.vue')['default'] + CpuSparkline: typeof import('./components/StatSparkline.vue')['default'] DockerEventLogItem: typeof import('./components/LogViewer/DockerEventLogItem.vue')['default'] DropdownMenu: typeof import('./components/DropdownMenu.vue')['default'] FieldList: typeof import('./components/LogViewer/FieldList.vue')['default'] diff --git a/assets/components/LogViewer/ContainerStat.vue b/assets/components/LogViewer/ContainerStat.vue index f0799cc4..1aaeea43 100644 --- a/assets/components/LogViewer/ContainerStat.vue +++ b/assets/components/LogViewer/ContainerStat.vue @@ -3,23 +3,27 @@
{{ container.state }}
-
-
+
+
- mem - - {{ formatBytes(container.stat.memoryUsage) }} - -
-
-
-
+
+ mem + + {{ formatBytes(container.stat.memoryUsage) }} + +
+
+ +
+
- load - {{ container.stat.cpu }}% +
+ load + {{ container.stat.cpu }}% +
@@ -53,4 +57,23 @@ const memoryData = computedWithControl( content: " "; } } + +.has-border { + border: 1px solid var(--primary-color); + border-radius: 3px; + padding: 1px 1px 0 1px; + display: flex; + overflow: hidden; + padding-top: 0.25em; +} + +.has-background-body-color { + background-color: var(--body-background-color); +} + +.is-top-left { + position: absolute; + top: 0; + left: 0.75em; +} diff --git a/assets/components/LogViewer/StatSparkline.vue b/assets/components/LogViewer/StatSparkline.vue index a84563e7..ba8e5acc 100644 --- a/assets/components/LogViewer/StatSparkline.vue +++ b/assets/components/LogViewer/StatSparkline.vue @@ -1,54 +1,35 @@ diff --git a/assets/types/Point.d.ts b/assets/types/Point.d.ts new file mode 100644 index 00000000..4e7e0738 --- /dev/null +++ b/assets/types/Point.d.ts @@ -0,0 +1 @@ +type Point = { x: number; y: number }; diff --git a/package.json b/package.json index b579c809..42538866 100644 --- a/package.json +++ b/package.json @@ -60,7 +60,7 @@ "@types/d3-shape": "^3.1.0", "@types/d3-transition": "^3.0.2", "@types/lodash.debounce": "^4.0.7", - "@types/node": "^18.8.4", + "@types/node": "^18.8.5", "@types/semver": "^7.3.12", "@vitejs/plugin-vue": "3.1.2", "@vue/compiler-sfc": "^3.2.40", @@ -80,11 +80,11 @@ "unplugin-auto-import": "^0.11.2", "unplugin-icons": "^0.14.11", "unplugin-vue-components": "^0.22.8", - "vite": "3.1.7", + "vite": "3.1.8", "vite-plugin-pages": "^0.26.0", "vite-plugin-vue-layouts": "^0.7.0", "vitest": "^0.24.1", - "vue-tsc": "^1.0.3" + "vue-tsc": "^1.0.7" }, "lint-staged": { "*.{js,vue,css}": [ diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 44c91691..c17d351d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -17,7 +17,7 @@ specifiers: '@types/d3-shape': ^3.1.0 '@types/d3-transition': ^3.0.2 '@types/lodash.debounce': ^4.0.7 - '@types/node': ^18.8.4 + '@types/node': ^18.8.5 '@types/semver': ^7.3.12 '@vitejs/plugin-vue': 3.1.2 '@vue/compiler-sfc': ^3.2.40 @@ -54,14 +54,14 @@ specifiers: unplugin-auto-import: ^0.11.2 unplugin-icons: ^0.14.11 unplugin-vue-components: ^0.22.8 - vite: 3.1.7 + vite: 3.1.8 vite-plugin-pages: ^0.26.0 vite-plugin-vue-layouts: ^0.7.0 vitest: ^0.24.1 vue: ^3.2.40 vue-i18n: ^9.2.2 vue-router: ^4.1.5 - vue-tsc: ^1.0.3 + vue-tsc: ^1.0.7 dependencies: '@iconify-json/carbon': 1.1.8 @@ -93,7 +93,7 @@ dependencies: vue-router: 4.1.5_vue@3.2.40 devDependencies: - '@intlify/vite-plugin-vue-i18n': 6.0.3_vite@3.1.7+vue-i18n@9.2.2 + '@intlify/vite-plugin-vue-i18n': 6.0.3_vite@3.1.8+vue-i18n@9.2.2 '@pinia/testing': 0.0.14_pinia@2.0.23+vue@3.2.40 '@types/d3-array': 3.0.3 '@types/d3-ease': 3.0.0 @@ -102,9 +102,9 @@ devDependencies: '@types/d3-shape': 3.1.0 '@types/d3-transition': 3.0.2 '@types/lodash.debounce': 4.0.7 - '@types/node': 18.8.4 + '@types/node': 18.8.5 '@types/semver': 7.3.12 - '@vitejs/plugin-vue': 3.1.2_vite@3.1.7+vue@3.2.40 + '@vitejs/plugin-vue': 3.1.2_vite@3.1.8+vue@3.2.40 '@vue/compiler-sfc': 3.2.40 '@vue/test-utils': 2.1.0_vue@3.2.40 c8: 7.12.0 @@ -117,16 +117,16 @@ devDependencies: prettier: 2.7.1 release-it: 15.5.0 sass: 1.55.0 - ts-node: 10.9.1_xkk4lltwku4cysulzbqoieownu + ts-node: 10.9.1_ptpocrdt7oaz4ni5mlvucph5pa typescript: 4.8.4 - unplugin-auto-import: 0.11.2_vb2jqpr6hhfyvqmjqgk4cfapu4 + unplugin-auto-import: 0.11.2_xprgaq42dappzfhggpxgvdf43y unplugin-icons: 0.14.11_@vue+compiler-sfc@3.2.40 unplugin-vue-components: 0.22.8_vue@3.2.40 - vite: 3.1.7_sass@1.55.0 - vite-plugin-pages: 0.26.0_ljcqrq5egzfzffbiweyi3hy2ua - vite-plugin-vue-layouts: 0.7.0_d7owwgkmo6iqlcv7qgzubrtxem + vite: 3.1.8_sass@1.55.0 + vite-plugin-pages: 0.26.0_3wx2cuqoomdy5nuogdesbbnqtu + vite-plugin-vue-layouts: 0.7.0_ilgc2hbueo5jnriamewoy7jlua vitest: 0.24.1_jsdom@20.0.1+sass@1.55.0 - vue-tsc: 1.0.3_typescript@4.8.4 + vue-tsc: 1.0.7_typescript@4.8.4 packages: @@ -322,7 +322,7 @@ packages: engines: {node: '>= 14'} dev: true - /@intlify/vite-plugin-vue-i18n/6.0.3_vite@3.1.7+vue-i18n@9.2.2: + /@intlify/vite-plugin-vue-i18n/6.0.3_vite@3.1.8+vue-i18n@9.2.2: resolution: {integrity: sha512-6SgNzPAOCR90wvt368lKzi7f/5ZEWJn22UCGvhFsP3XvKqlF3cVzojahgQ6o+LTdCkExeM6wPgd+haFf28E9VQ==} engines: {node: '>= 14.6'} peerDependencies: @@ -343,7 +343,7 @@ packages: debug: 4.3.4 fast-glob: 3.2.12 source-map: 0.6.1 - vite: 3.1.7_sass@1.55.0 + vite: 3.1.8_sass@1.55.0 vue-i18n: 9.2.2_vue@3.2.40 transitivePeerDependencies: - supports-color @@ -684,8 +684,8 @@ packages: resolution: {integrity: sha512-iiUgKzV9AuaEkZqkOLDIvlQiL6ltuZd9tGcW3gwpnX8JbuiuhFlEGmmFXEXkN50Cvq7Os88IY2v0dkDqXYWVgA==} dev: true - /@types/node/18.8.4: - resolution: {integrity: sha512-WdlVphvfR/GJCLEMbNA8lJ0lhFNBj4SW3O+O5/cEGw9oYrv0al9zTwuQsq+myDUXgNx2jgBynoVgZ2MMJ6pbow==} + /@types/node/18.8.5: + resolution: {integrity: sha512-Bq7G3AErwe5A/Zki5fdD3O6+0zDChhg671NfPjtIcbtzDNZTv4NPKMRFr7gtYPG7y+B8uTiNK4Ngd9T0FTar6Q==} dev: true /@types/parse-json/4.0.0: @@ -699,55 +699,55 @@ packages: /@types/web-bluetooth/0.0.15: resolution: {integrity: sha512-w7hEHXnPMEZ+4nGKl/KDRVpxkwYxYExuHOYXyzIzCDzEZ9ZCGMAewulr9IqJu2LR4N37fcnb1XVeuZ09qgOxhA==} - /@vitejs/plugin-vue/3.1.2_vite@3.1.7+vue@3.2.40: + /@vitejs/plugin-vue/3.1.2_vite@3.1.8+vue@3.2.40: resolution: {integrity: sha512-3zxKNlvA3oNaKDYX0NBclgxTQ1xaFdL7PzwF6zj9tGFziKwmBa3Q/6XcJQxudlT81WxDjEhHmevvIC4Orc1LhQ==} engines: {node: ^14.18.0 || >=16.0.0} peerDependencies: vite: ^3.0.0 vue: ^3.2.25 dependencies: - vite: 3.1.7_sass@1.55.0 + vite: 3.1.8_sass@1.55.0 vue: 3.2.40 dev: true - /@volar/language-core/1.0.3: - resolution: {integrity: sha512-eJ3iubJ1EvPTsp+rKoSUQ3EBGsEzblOQG6OVI9EzXIuwNayIqCnNSv9r0rvnYznX7i5F8gpo0Js9nKoAvwfhpQ==} + /@volar/language-core/1.0.7: + resolution: {integrity: sha512-T3iJ7Ej5Ywrsn1nEfvOQ98LdFZu3TtoXD8UELHto/u5QyQk4U2GfPl+0ZjuS39ZPocU9l/5CMhrxHsgv/hFWVA==} dependencies: - '@volar/source-map': 1.0.3 + '@volar/source-map': 1.0.7 '@vue/reactivity': 3.2.40 muggle-string: 0.1.0 dev: true - /@volar/source-map/1.0.3: - resolution: {integrity: sha512-iEbjU95e8iZ3fV9NHU/wDWRSwSE5aNGpkG9mgIXPkfCmbEH+nEHGkycvapT551BDtIcyU386XzqL4DQbOyPzew==} + /@volar/source-map/1.0.7: + resolution: {integrity: sha512-58xtTXbriaBoGHl5epE5kYI0Pk81yGmM3Mb/5TEUEzA16dGovXiwtEGce2xCgo0ps42OInFvFuaRv3SvM0k6mg==} dependencies: muggle-string: 0.1.0 dev: true - /@volar/typescript/1.0.3: - resolution: {integrity: sha512-OevIxAbdgfVxwWYI6ht5tmt8GqBBVQWPWn/51MNlqu5fVltFGRkOBmv3hwuvLn5N05pj2GpbkaaLZSjpj4iT9w==} + /@volar/typescript/1.0.7: + resolution: {integrity: sha512-VH3dMxTqkdUqjmdVwIytBjppH5iy18qK9peb3E9CNbvzf/+b3TpdX0zoyglaKmC5IeHG68KHXK2yps734yZ4nQ==} dependencies: - '@volar/language-core': 1.0.3 + '@volar/language-core': 1.0.7 dev: true - /@volar/vue-language-core/1.0.3: - resolution: {integrity: sha512-XryQVvtFB5/rOkEZin5jZgUy0E84p+Ky70z+4B7Bvw/9HjS3TLKAIkm9W0duV7coG9RFVRqeiVnPyaaqSA0waA==} + /@volar/vue-language-core/1.0.7: + resolution: {integrity: sha512-5InGpRLu5FGeUkVNr1LvQfvThdSsyzIwvsYqYSGLj6VNmS7rzLacoKjZlTwz68/976aU3zjdgx94PoNl5n/SqA==} dependencies: - '@volar/language-core': 1.0.3 - '@volar/source-map': 1.0.3 + '@volar/language-core': 1.0.7 + '@volar/source-map': 1.0.7 '@vue/compiler-dom': 3.2.40 '@vue/compiler-sfc': 3.2.40 '@vue/reactivity': 3.2.40 '@vue/shared': 3.2.40 minimatch: 5.1.0 - vue-template-compiler: 2.7.10 + vue-template-compiler: 2.7.12 dev: true - /@volar/vue-typescript/1.0.3: - resolution: {integrity: sha512-zugZ5vni+l5w5z8Q5iEWysU/HkX38krW4+QTKwgQstaRVUQS0UHlX4Ug9vOfPGWEextIx0Z/7JsUvPATTNbfbg==} + /@volar/vue-typescript/1.0.7: + resolution: {integrity: sha512-SZlUJfMh/9NOIfpYtSVcIAbJVEzEiH2qWBIYHPooMXC02qey56Tg6J2eMhIoKWIuZH0VRRbX8IgFHevSQzzGOw==} dependencies: - '@volar/typescript': 1.0.3 - '@volar/vue-language-core': 1.0.3 + '@volar/typescript': 1.0.7 + '@volar/vue-language-core': 1.0.7 dev: true /@vue/compiler-core/3.2.40: @@ -3920,6 +3920,15 @@ packages: picocolors: 1.0.0 source-map-js: 1.0.2 + /postcss/8.4.18: + resolution: {integrity: sha512-Wi8mWhncLJm11GATDaQKobXSNEYGUHeQLiQqDFG1qQ5UTDPTEvKw0Xt5NsTpktGTwLps3ByrWsBrG0rB8YQ9oA==} + engines: {node: ^10 || ^12 || >=14} + dependencies: + nanoid: 3.3.4 + picocolors: 1.0.0 + source-map-js: 1.0.2 + dev: true + /prelude-ls/1.1.2: resolution: {integrity: sha512-ESF23V4SKG6lVSGZgYNpbsiaAkdab6ZgOxe52p7+Kid3W3u3bxR4Vfd/o21dmN7jSt0IwgZ4v5MUd26FEtXE9w==} engines: {node: '>= 0.8.0'} @@ -4656,7 +4665,7 @@ packages: punycode: 2.1.1 dev: true - /ts-node/10.9.1_xkk4lltwku4cysulzbqoieownu: + /ts-node/10.9.1_ptpocrdt7oaz4ni5mlvucph5pa: resolution: {integrity: sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==} hasBin: true peerDependencies: @@ -4675,7 +4684,7 @@ packages: '@tsconfig/node12': 1.0.11 '@tsconfig/node14': 1.0.3 '@tsconfig/node16': 1.0.3 - '@types/node': 18.8.4 + '@types/node': 18.8.5 acorn: 8.7.1 acorn-walk: 8.2.0 arg: 4.1.3 @@ -4742,7 +4751,7 @@ packages: which-boxed-primitive: 1.0.2 dev: true - /unimport/0.6.7_vite@3.1.7: + /unimport/0.6.7_vite@3.1.8: resolution: {integrity: sha512-EMoVqDjswHkU+nD098QYHXH7Mkw7KwGDQAyeRF2lgairJnuO+wpkhIcmCqrD1OPJmsjkTbJ2tW6Ap8St0PuWZA==} dependencies: '@rollup/pluginutils': 4.2.1 @@ -4754,7 +4763,7 @@ packages: pathe: 0.3.5 scule: 0.3.2 strip-literal: 0.4.2 - unplugin: 0.9.3_vite@3.1.7 + unplugin: 0.9.3_vite@3.1.8 transitivePeerDependencies: - esbuild - rollup @@ -4788,7 +4797,7 @@ packages: engines: {node: '>= 0.8'} dev: true - /unplugin-auto-import/0.11.2_vb2jqpr6hhfyvqmjqgk4cfapu4: + /unplugin-auto-import/0.11.2_xprgaq42dappzfhggpxgvdf43y: resolution: {integrity: sha512-1+VwBfn9dtiYv9SQLKP1AvZolUbK9xTVeAT+iOcEk4EHSFUlmIqBVLEKI76cifSQTLOJ3rZyPrEgptf3SZNLlQ==} engines: {node: '>=14'} peerDependencies: @@ -4802,8 +4811,8 @@ packages: '@vueuse/core': 9.3.0_vue@3.2.40 local-pkg: 0.4.2 magic-string: 0.26.2 - unimport: 0.6.7_vite@3.1.7 - unplugin: 0.9.3_vite@3.1.7 + unimport: 0.6.7_vite@3.1.8 + unplugin: 0.9.3_vite@3.1.8 transitivePeerDependencies: - esbuild - rollup @@ -4865,7 +4874,7 @@ packages: - supports-color dev: true - /unplugin/0.9.3_vite@3.1.7: + /unplugin/0.9.3_vite@3.1.8: resolution: {integrity: sha512-GWXxizZG+tobNs8fuGTCeilerkkfZTZax2iivuE4pxLaF9wTnPJHOq8tbLKDb5ohVb+2BXNjrU9xx59yWTUnuw==} peerDependencies: esbuild: '>=0.13' @@ -4884,7 +4893,7 @@ packages: dependencies: acorn: 8.8.0 chokidar: 3.5.3 - vite: 3.1.7_sass@1.55.0 + vite: 3.1.8_sass@1.55.0 webpack-sources: 3.2.3 webpack-virtual-modules: 0.4.4 dev: true @@ -4954,7 +4963,7 @@ packages: spdx-expression-parse: 3.0.1 dev: true - /vite-plugin-pages/0.26.0_ljcqrq5egzfzffbiweyi3hy2ua: + /vite-plugin-pages/0.26.0_3wx2cuqoomdy5nuogdesbbnqtu: resolution: {integrity: sha512-yJZvwHEt7puYIf19S89IvkDsWPjWleSied4H8hmdW6i8buCA93z1UAU1ipW1d8fNKrC4FzXsUHHbPm6+kl1p9w==} peerDependencies: '@vue/compiler-sfc': ^2.7.0 || ^3.0.0 @@ -4972,13 +4981,13 @@ packages: json5: 2.2.1 local-pkg: 0.4.2 picocolors: 1.0.0 - vite: 3.1.7_sass@1.55.0 + vite: 3.1.8_sass@1.55.0 yaml: 2.1.1 transitivePeerDependencies: - supports-color dev: true - /vite-plugin-vue-layouts/0.7.0_d7owwgkmo6iqlcv7qgzubrtxem: + /vite-plugin-vue-layouts/0.7.0_ilgc2hbueo5jnriamewoy7jlua: resolution: {integrity: sha512-k5XDmRNFo4M/GmUjhbRXj2WmJiFcGoVI8l/uZ72RHyRDQr4wE/6Zq/KFq0lqXomWQxTSzakQRUswzNwtvZLE8A==} peerDependencies: vite: ^2.5.0 || ^3.0.0-0 @@ -4988,15 +4997,15 @@ packages: '@vue/compiler-sfc': 3.2.40 debug: 4.3.4 fast-glob: 3.2.11 - vite: 3.1.7_sass@1.55.0 + vite: 3.1.8_sass@1.55.0 vue: 3.2.40 vue-router: 4.1.5_vue@3.2.40 transitivePeerDependencies: - supports-color dev: true - /vite/3.1.7_sass@1.55.0: - resolution: {integrity: sha512-5vCAmU4S8lyVdFCInu9M54f/g8qbOMakVw5xJ4pjoaDy5wgy9sLLZkGdSLN52dlsBqh0tBqxjaqqa8LgPqwRAA==} + /vite/3.1.8_sass@1.55.0: + resolution: {integrity: sha512-m7jJe3nufUbuOfotkntGFupinL/fmuTNuQmiVE7cH2IZMuf4UbfbGYMUT3jVWgGYuRVLY9j8NnrRqgw5rr5QTg==} engines: {node: ^14.18.0 || >=16.0.0} hasBin: true peerDependencies: @@ -5015,7 +5024,7 @@ packages: optional: true dependencies: esbuild: 0.15.10 - postcss: 8.4.17 + postcss: 8.4.18 resolve: 1.22.1 rollup: 2.78.1 sass: 1.55.0 @@ -5047,7 +5056,7 @@ packages: dependencies: '@types/chai': 4.3.3 '@types/chai-subset': 1.3.3 - '@types/node': 18.8.4 + '@types/node': 18.8.5 chai: 4.3.6 debug: 4.3.4 jsdom: 20.0.1 @@ -5056,7 +5065,7 @@ packages: tinybench: 2.3.0 tinypool: 0.3.0 tinyspy: 1.0.2 - vite: 3.1.7_sass@1.55.0 + vite: 3.1.8_sass@1.55.0 transitivePeerDependencies: - less - sass @@ -5123,21 +5132,21 @@ packages: '@vue/devtools-api': 6.2.1 vue: 3.2.40 - /vue-template-compiler/2.7.10: - resolution: {integrity: sha512-QO+8R9YRq1Gudm8ZMdo/lImZLJVUIAM8c07Vp84ojdDAf8HmPJc7XB556PcXV218k2AkKznsRz6xB5uOjAC4EQ==} + /vue-template-compiler/2.7.12: + resolution: {integrity: sha512-6rhJAuo2vRzJMs8X/pd9yqtsJmnPEnv4E0cb9KCu0sfGhoDt8roCCa/6qbrvpc1b38zYgdmY/xrk4qfNWZIjwA==} dependencies: de-indent: 1.0.2 he: 1.2.0 dev: true - /vue-tsc/1.0.3_typescript@4.8.4: - resolution: {integrity: sha512-Si6PANEATxaGhJ51bUnRbT+5MIYwvjdPBwuCKSky+YD5oWDhE4uMqfpOPnP2oSMB52trtU0faIRVcP4YSF3LJA==} + /vue-tsc/1.0.7_typescript@4.8.4: + resolution: {integrity: sha512-PaeWgISdXsPnV3a1NKfiAZb0iyvgLroxKzjPj1itoR5ZH0UOeVZBbDxpH7VPxAt6tCxiAoAIIisDs1QQrsSu3w==} hasBin: true peerDependencies: typescript: '*' dependencies: - '@volar/vue-language-core': 1.0.3 - '@volar/vue-typescript': 1.0.3 + '@volar/vue-language-core': 1.0.7 + '@volar/vue-typescript': 1.0.7 typescript: 4.8.4 dev: true