bichangxiong/ruoyi-plus-vben5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: reorganize the icons and reduce the volume

Browse Source
This commit is contained in:
vince
2024-07-17 22:25:27 +08:00
parent cb161eab89
commit 910a3553ac
54 changed files with 341 additions and 404 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/@core/ui-kit/shadcn-ui/src/components/back-top/back-top.vue
View File

@@ -3,7 +3,7 @@ import type { BacktopProps } from './backtop';
import { computed } from 'vue';
import { IcRoundArrowUpward } from '@vben-core/icons';
import { ArrowUpToLine } from '@vben-core/icons';
import { VbenButton } from '../button';
import { useBackTop } from './use-backtop';
@@ -37,7 +37,7 @@ const { handleClick, visible } = useBackTop(props);
variant="icon"
@click="handleClick"
>
<IcRoundArrowUpward />
<ArrowUpToLine class="size-4" />
</VbenButton>
</transition>
</template>

4
packages/@core/ui-kit/shadcn-ui/src/components/breadcrumb/breadcrumb.vue
View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { IBreadcrumb } from './interface';
import { IcRoundKeyboardArrowDown } from '@vben-core/icons';
import { ChevronDown } from '@vben-core/icons';
import {
Breadcrumb,
BreadcrumbItem,
@@ -56,7 +56,7 @@ function handleClick(path?: string) {
class="size-5"
/>
{{ item.title }}
<IcRoundKeyboardArrowDown class="size-5" />
<ChevronDown class="size-4" />
</DropdownMenuTrigger>
<DropdownMenuContent align="start">
<template

6
packages/@core/ui-kit/shadcn-ui/src/components/button/button.vue
View File

@@ -2,7 +2,7 @@
import type { HTMLAttributes } from 'vue';
import { computed } from 'vue';
import { MdiLoading } from '@vben-core/icons';
import { LoaderCircle } from '@vben-core/icons';
import {
type ButtonVariants,
buttonVariants,
@@ -40,9 +40,9 @@ const isDisabled = computed(() => {
:class="cn(buttonVariants({ variant, size }), props.class)"
:disabled="isDisabled"
>
<MdiLoading
<LoaderCircle
v-if="loading"
class="text-md mr-2 flex-shrink-0 animate-spin"
class="text-md mr-2 size-4 flex-shrink-0 animate-spin"
/>
<slot></slot>
</Primitive>

2
packages/@core/ui-kit/shadcn-ui/src/components/context-menu/context-menu.vue
View File

@@ -81,7 +81,7 @@ function handleClick(menu: IContextMenuItem) {
<component
:is="menu.icon"
v-if="menu.icon"
class="mr-1 w-6 text-lg"
class="mr-2 size-4 text-lg"
/>
{{ menu.text }}

6
packages/@core/ui-kit/shadcn-ui/src/components/full-screen/full-screen.vue
View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { IcRoundFullscreen, IcRoundFullscreenExit } from '@vben-core/icons';
import { Maximize, Minimize } from '@vben-core/icons';
import { useFullscreen } from '@vueuse/core';
@@ -22,7 +22,7 @@ isFullscreen.value = !!(
</script>
<template>
<VbenIconButton @click="toggle">
<IcRoundFullscreenExit v-if="isFullscreen" class="size-6" />
<IcRoundFullscreen v-else class="size-6" />
<Minimize v-if="isFullscreen" class="size-4" />
<Maximize v-else class="size-4" />
</VbenIconButton>
</template>

7
packages/@core/ui-kit/shadcn-ui/src/components/icon/icon.vue
View File

@@ -2,12 +2,12 @@
import { type Component, computed } from 'vue';
import { Icon, IconDefault } from '@vben-core/icons';
import { isHttpUrl, isObject, isString } from '@vben-core/toolkit';
import { isFunction, isHttpUrl, isObject, isString } from '@vben-core/toolkit';
const props = defineProps<{
// 没有是否显示默认图标
fallback?: boolean;
icon?: Component | string;
icon?: Component | Function | string;
}>();
const isRemoteIcon = computed(() => {
@@ -15,7 +15,8 @@ const isRemoteIcon = computed(() => {
});
const isComponent = computed(() => {
return !isString(props.icon) && isObject(props.icon);
const { icon } = props;
return !isString(icon) && (isObject(icon) || isFunction(icon));
});
</script>

6
packages/@core/ui-kit/shadcn-ui/src/components/input-password/input-password.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts">
import { ref, useSlots } from 'vue';
import { IcOutlineVisibility, IcOutlineVisibilityOff } from '@vben-core/icons';
import { Eye, EyeOff } from '@vben-core/icons';
import {
type InputProps,
VbenInput,
@@ -48,8 +48,8 @@ const show = ref(false);
class="hover:text-foreground text-foreground/60 absolute inset-y-0 right-0 top-3 flex cursor-pointer pr-3 text-lg leading-5"
@click="show = !show"
>
<IcOutlineVisibility v-if="show" />
<IcOutlineVisibilityOff v-else />
<Eye v-if="show" class="size-4" />
<EyeOff v-else class="size-4" />
</div>
</form>
</template>

4
packages/@core/ui-kit/shadcn-ui/src/components/scrollbar/scrollbar.vue
View File

@@ -42,7 +42,7 @@ function handleScroll(event: Event) {
<div
v-if="shadow"
:class="{
'opacity-100': !isAtTop,
'border-border border-t opacity-100': !isAtTop,
}"
class="scrollbar-top-shadow pointer-events-none absolute top-0 z-10 h-12 w-full opacity-0 transition-opacity duration-300 ease-in-out will-change-[opacity]"
></div>
@@ -50,7 +50,7 @@ function handleScroll(event: Event) {
<div
v-if="shadow"
:class="{
'opacity-100': !isAtTop && !isAtBottom,
'border-border border-b opacity-100': !isAtTop && !isAtBottom,
}"
class="scrollbar-bottom-shadow pointer-events-none absolute bottom-0 z-10 h-12 w-full opacity-0 transition-opacity duration-300 ease-in-out will-change-[opacity]"
></div>

6
packages/@core/ui-kit/shadcn-ui/src/components/sheet/sheet.vue
View File

@@ -17,7 +17,7 @@ import {
SheetTrigger,
} from '@vben-core/shadcn-ui/components/ui/sheet';
import { Cross2Icon } from '@radix-icons/vue';
import { X } from 'lucide-vue-next';
interface Props {
cancelText?: string;
@@ -87,12 +87,12 @@ function handlerSubmit() {
class="data-[state=open]:bg-secondary cursor-pointer rounded-full opacity-80 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none"
>
<VbenIconButton>
<Cross2Icon class="size-4" />
<X class="size-4" />
</VbenIconButton>
</SheetClose>
</SheetHeader>
<div class="h-full pb-16">
<VbenScrollbar class="h-full">
<VbenScrollbar class="h-full" shadow>
<slot></slot>
</VbenScrollbar>
</div>