mirrors/it-tools
1
0
Fork 0
mirror of https://github.com/CorentinTh/it-tools.git synced 2025-04-20 06:55:06 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

refactor(ui): better ui demo preview menu (#664)

Browse source
This commit is contained in:
Corentin THOMASSET 2023-10-31 18:49:36 +01:00 • committed by GitHub
parent 99b1eb944d
commit 015c673e09
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 12 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

5
components.d.ts vendored
View file

@ -92,7 +92,6 @@ declare module '@vue/runtime-core' {
IconMdiDownload: typeof import('~icons/mdi/download')['default'] IconMdiDownload: typeof import('~icons/mdi/download')['default']
IconMdiEye: typeof import('~icons/mdi/eye')['default'] IconMdiEye: typeof import('~icons/mdi/eye')['default']
IconMdiEyeOff: typeof import('~icons/mdi/eye-off')['default'] IconMdiEyeOff: typeof import('~icons/mdi/eye-off')['default']
IconMdiFavoriteFilled: typeof import('~icons/mdi/favorite-filled')['default']
IconMdiHeart: typeof import('~icons/mdi/heart')['default'] IconMdiHeart: typeof import('~icons/mdi/heart')['default']
IconMdiPause: typeof import('~icons/mdi/pause')['default'] IconMdiPause: typeof import('~icons/mdi/pause')['default']
IconMdiPlay: typeof import('~icons/mdi/play')['default'] IconMdiPlay: typeof import('~icons/mdi/play')['default']
@ -151,8 +150,6 @@ declare module '@vue/runtime-core' {
NLayout: typeof import('naive-ui')['NLayout'] NLayout: typeof import('naive-ui')['NLayout']
NLayoutSider: typeof import('naive-ui')['NLayoutSider'] NLayoutSider: typeof import('naive-ui')['NLayoutSider']
NMenu: typeof import('naive-ui')['NMenu'] NMenu: typeof import('naive-ui')['NMenu']
NP: typeof import('naive-ui')['NP']
NPageHeader: typeof import('naive-ui')['NPageHeader']
NProgress: typeof import('naive-ui')['NProgress'] NProgress: typeof import('naive-ui')['NProgress']
NScrollbar: typeof import('naive-ui')['NScrollbar'] NScrollbar: typeof import('naive-ui')['NScrollbar']
NSlider: typeof import('naive-ui')['NSlider'] NSlider: typeof import('naive-ui')['NSlider']
@ -160,7 +157,6 @@ declare module '@vue/runtime-core' {
NSwitch: typeof import('naive-ui')['NSwitch'] NSwitch: typeof import('naive-ui')['NSwitch']
NTable: typeof import('naive-ui')['NTable'] NTable: typeof import('naive-ui')['NTable']
NTag: typeof import('naive-ui')['NTag'] NTag: typeof import('naive-ui')['NTag']
NTooltip: typeof import('naive-ui')['NTooltip']
NUpload: typeof import('naive-ui')['NUpload'] NUpload: typeof import('naive-ui')['NUpload']
NUploadDragger: typeof import('naive-ui')['NUploadDragger'] NUploadDragger: typeof import('naive-ui')['NUploadDragger']
OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default'] OtpCodeGeneratorAndValidator: typeof import('./src/tools/otp-code-generator-and-validator/otp-code-generator-and-validator.vue')['default']
@ -192,7 +188,6 @@ declare module '@vue/runtime-core' {
'Tool.layout': typeof import('./src/layouts/tool.layout.vue')['default'] 'Tool.layout': typeof import('./src/layouts/tool.layout.vue')['default']
ToolCard: typeof import('./src/components/ToolCard.vue')['default'] ToolCard: typeof import('./src/components/ToolCard.vue')['default']
UlidGenerator: typeof import('./src/tools/ulid-generator/ulid-generator.vue')['default'] UlidGenerator: typeof import('./src/tools/ulid-generator/ulid-generator.vue')['default']
Unnamed: typeof import('./src/ui/unnamed/unnamed.vue')['default']
UrlEncoder: typeof import('./src/tools/url-encoder/url-encoder.vue')['default'] UrlEncoder: typeof import('./src/tools/url-encoder/url-encoder.vue')['default']
UrlParser: typeof import('./src/tools/url-parser/url-parser.vue')['default'] UrlParser: typeof import('./src/tools/url-parser/url-parser.vue')['default']
UserAgentParser: typeof import('./src/tools/user-agent-parser/user-agent-parser.vue')['default'] UserAgentParser: typeof import('./src/tools/user-agent-parser/user-agent-parser.vue')['default']

8
src/ui/demo/demo-home.page.vue
View file

@ -4,10 +4,8 @@ import { demoRoutes } from './demo.routes';
<template> <template>
<div grid grid-cols-5 gap-2> <div grid grid-cols-5 gap-2>
<c-card v-for="{ name } of demoRoutes" :key="name" :title="String(name)"> <c-button v-for="{ name } of demoRoutes" :key="name" :to="{ name }">
<c-button :to="{ name }"> {{ name }}
{{ name }} </c-button>
</c-button>
</c-card>
</div> </div>
</template> </template>

3
src/ui/demo/demo-wrapper.vue
View file

@ -12,7 +12,7 @@ const componentName = computed(() => _.startCase(String(route.name).replace(/^c-
<h1>c-lib components</h1> <h1>c-lib components</h1>
<div flex> <div flex>
<div w-30 b-r b-gray b-op-10 b-r-solid pr-4> <div w-200px b-r b-gray b-op-10 b-r-solid pr-4>
<c-button <c-button
v-for="{ name } of demoRoutes" v-for="{ name } of demoRoutes"
:key="name" :key="name"
@ -20,6 +20,7 @@ const componentName = computed(() => _.startCase(String(route.name).replace(/^c-
:to="{ name }" :to="{ name }"
w-full w-full
important:justify-start important:justify-start
important:text-left
:type="route.name === name ? 'primary' : 'default'" :type="route.name === name ? 'primary' : 'default'"
> >
{{ name }} {{ name }}

14
src/ui/demo/demo.routes.ts
View file

@ -1,16 +1,16 @@
import type { RouteRecordRaw } from 'vue-router'; import type { RouteRecordRaw } from 'vue-router';
import DemoHome from './demo-home.page.vue'; import DemoHome from './demo-home.page.vue';
const demoPages = import.meta.glob('../*/*.demo.vue'); const demoPages = import.meta.glob('../*/*.demo.vue', { eager: true });
export const demoRoutes = Object.keys(demoPages).map((path) => { export const demoRoutes = Object.keys(demoPages).map((demoComponentPath) => {
const [, , fileName] = path.split('/'); const [, , fileName] = demoComponentPath.split('/');
const name = fileName.split('.').shift(); const demoComponentName = fileName.split('.').shift();
return { return {
path: name, path: demoComponentName,
name, name: demoComponentName,
component: () => import(/* @vite-ignore */ path), component: () => import(/* @vite-ignore */ demoComponentPath),
} as RouteRecordRaw; } as RouteRecordRaw;
}); });