fix: 修复管理端前端 lint 与构建问题
- 收敛 easyflow-ui-admin 的 lint、格式和类型问题 - 修正 demo 页面与管理端前端构建失败点 - 验证 pnpm lint 与 pnpm build 均已通过
This commit is contained in:
@@ -1,12 +1,12 @@
|
||||
<script setup lang="ts">
|
||||
import type {TabDefinition} from '@easyflow-core/typings';
|
||||
import type { TabDefinition } from '@easyflow-core/typings';
|
||||
|
||||
import type {TabConfig, TabsProps} from '../../types';
|
||||
import type { TabConfig, TabsProps } from '../../types';
|
||||
|
||||
import {computed, ref} from 'vue';
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
import {Pin, X} from '@easyflow-core/icons';
|
||||
import {EasyFlowContextMenu, EasyFlowIcon} from '@easyflow-core/shadcn-ui';
|
||||
import { Pin, X } from '@easyflow-core/icons';
|
||||
import { EasyFlowContextMenu, EasyFlowIcon } from '@easyflow-core/shadcn-ui';
|
||||
|
||||
interface Props extends TabsProps {}
|
||||
|
||||
@@ -167,10 +167,10 @@ function onMouseDown(e: MouseEvent, tab: TabConfig) {
|
||||
inset: 1px -5px -1px;
|
||||
content: '';
|
||||
background: hsl(var(--background));
|
||||
border-top: 2px solid hsl(var(--primary) / 38%);
|
||||
border-right: 1px solid hsl(var(--primary) / 16%);
|
||||
border-left: 1px solid hsl(var(--primary) / 16%);
|
||||
border-radius: 15px 15px 0 0;
|
||||
border-top: 2px solid hsl(var(--primary) / 0.38);
|
||||
border-right: 1px solid hsl(var(--primary) / 0.16);
|
||||
border-left: 1px solid hsl(var(--primary) / 0.16);
|
||||
}
|
||||
|
||||
&__background-content.is-active::after {
|
||||
|
||||
@@ -38,7 +38,7 @@ const typeWithClass = computed(() => {
|
||||
},
|
||||
plain: {
|
||||
content:
|
||||
"h-[calc(100%-8px)] rounded-2xl border border-transparent bg-transparent transition-all duration-150 [&.is-active]:bg-[hsl(var(--glass-tint))/0.72] [&.is-active]:shadow-[0_16px_28px_-24px_hsl(var(--foreground)/0.34)] [&:not(.is-active)]:hover:bg-[hsl(var(--nav-item-hover))/0.9]",
|
||||
'h-[calc(100%-8px)] rounded-2xl border border-transparent bg-transparent transition-all duration-150 [&.is-active]:bg-[hsl(var(--glass-tint))/0.72] [&.is-active]:shadow-[0_16px_28px_-24px_hsl(var(--foreground)/0.34)] [&:not(.is-active)]:hover:bg-[hsl(var(--nav-item-hover))/0.9]',
|
||||
},
|
||||
};
|
||||
|
||||
@@ -136,7 +136,9 @@ function onMouseDown(e: MouseEvent, tab: TabConfig) {
|
||||
fallback
|
||||
/>
|
||||
|
||||
<span class="flex-1 overflow-hidden whitespace-nowrap text-[13px]">
|
||||
<span
|
||||
class="flex-1 overflow-hidden whitespace-nowrap text-[13px]"
|
||||
>
|
||||
{{ tab.title }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -10,7 +10,7 @@ defineProps<DropdownMenuProps>();
|
||||
<template>
|
||||
<EasyFlowDropdownMenu :menus="menus" :modal="false">
|
||||
<div
|
||||
class="flex-center mr-1 h-8 w-8 cursor-pointer rounded-2xl border border-transparent bg-[hsl(var(--glass-tint))/0.52] text-[hsl(var(--nav-item-muted-foreground))] shadow-[0_10px_24px_-24px_hsl(var(--foreground)/0.3)] backdrop-blur-xl transition-[background-color,color,transform] hover:-translate-y-0.5 hover:bg-[hsl(var(--surface-contrast-soft))/0.92] hover:text-foreground"
|
||||
class="flex-center hover:text-foreground mr-1 h-8 w-8 cursor-pointer rounded-2xl border border-transparent bg-[hsl(var(--glass-tint))/0.52] text-[hsl(var(--nav-item-muted-foreground))] shadow-[0_10px_24px_-24px_hsl(var(--foreground)/0.3)] backdrop-blur-xl transition-[background-color,color,transform] hover:-translate-y-0.5 hover:bg-[hsl(var(--surface-contrast-soft))/0.92]"
|
||||
>
|
||||
<ChevronDown class="size-4" />
|
||||
</div>
|
||||
|
||||
@@ -10,7 +10,7 @@ function toggleScreen() {
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="flex-center h-8 w-8 cursor-pointer rounded-2xl border border-transparent bg-[hsl(var(--glass-tint))/0.52] text-[hsl(var(--nav-item-muted-foreground))] shadow-[0_10px_24px_-24px_hsl(var(--foreground)/0.3)] backdrop-blur-xl transition-[background-color,color,transform] hover:-translate-y-0.5 hover:bg-[hsl(var(--surface-contrast-soft))/0.92] hover:text-foreground"
|
||||
class="flex-center hover:text-foreground h-8 w-8 cursor-pointer rounded-2xl border border-transparent bg-[hsl(var(--glass-tint))/0.52] text-[hsl(var(--nav-item-muted-foreground))] shadow-[0_10px_24px_-24px_hsl(var(--foreground)/0.3)] backdrop-blur-xl transition-[background-color,color,transform] hover:-translate-y-0.5 hover:bg-[hsl(var(--surface-contrast-soft))/0.92]"
|
||||
@click="toggleScreen"
|
||||
>
|
||||
<Minimize2 v-if="screen" class="size-4" />
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
<script setup lang="ts">
|
||||
import type {TabsEmits, TabsProps} from './types';
|
||||
import type { TabsEmits, TabsProps } from './types';
|
||||
|
||||
import {useForwardPropsEmits} from '@easyflow-core/composables';
|
||||
import {ChevronLeft, ChevronRight} from '@easyflow-core/icons';
|
||||
import {EasyFlowScrollbar} from '@easyflow-core/shadcn-ui';
|
||||
import { useForwardPropsEmits } from '@easyflow-core/composables';
|
||||
import { ChevronLeft, ChevronRight } from '@easyflow-core/icons';
|
||||
import { EasyFlowScrollbar } from '@easyflow-core/shadcn-ui';
|
||||
|
||||
import {Tabs, TabsChrome} from './components';
|
||||
import {useTabsDrag} from './use-tabs-drag';
|
||||
import {useTabsViewScroll} from './use-tabs-view-scroll';
|
||||
import { Tabs, TabsChrome } from './components';
|
||||
import { useTabsDrag } from './use-tabs-drag';
|
||||
import { useTabsViewScroll } from './use-tabs-view-scroll';
|
||||
|
||||
interface Props extends TabsProps {}
|
||||
|
||||
@@ -53,7 +53,8 @@ useTabsDrag(props, emit);
|
||||
<span
|
||||
v-show="showScrollButton"
|
||||
:class="{
|
||||
'cursor-pointer text-[hsl(var(--nav-item-muted-foreground))] hover:bg-[hsl(var(--surface-contrast-soft))] hover:text-foreground': !scrollIsAtLeft,
|
||||
'hover:text-foreground cursor-pointer text-[hsl(var(--nav-item-muted-foreground))] hover:bg-[hsl(var(--surface-contrast-soft))]':
|
||||
!scrollIsAtLeft,
|
||||
'pointer-events-none opacity-30': scrollIsAtLeft,
|
||||
}"
|
||||
class="mx-1 my-1 flex items-center rounded-2xl border border-transparent bg-[hsl(var(--glass-tint))/0.18] px-2 shadow-none backdrop-blur-xl transition-[background-color,color,transform]"
|
||||
@@ -94,7 +95,8 @@ useTabsDrag(props, emit);
|
||||
<span
|
||||
v-show="showScrollButton"
|
||||
:class="{
|
||||
'cursor-pointer text-[hsl(var(--nav-item-muted-foreground))] hover:bg-[hsl(var(--surface-contrast-soft))] hover:text-foreground': !scrollIsAtRight,
|
||||
'hover:text-foreground cursor-pointer text-[hsl(var(--nav-item-muted-foreground))] hover:bg-[hsl(var(--surface-contrast-soft))]':
|
||||
!scrollIsAtRight,
|
||||
'pointer-events-none opacity-30': scrollIsAtRight,
|
||||
}"
|
||||
class="mx-1 my-1 flex items-center rounded-2xl border border-transparent bg-[hsl(var(--glass-tint))/0.18] px-2 shadow-none backdrop-blur-xl transition-[background-color,color,transform]"
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import type { TabsProps } from './types';
|
||||
|
||||
import type { ComponentPublicInstance } from 'vue';
|
||||
|
||||
import type { TabsProps } from './types';
|
||||
|
||||
import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
|
||||
|
||||
import { useDebounceFn } from '@vueuse/core';
|
||||
@@ -13,7 +13,7 @@ export function useTabsViewScroll(props: TabsProps) {
|
||||
let resizeObserver: null | ResizeObserver = null;
|
||||
let mutationObserver: MutationObserver | null = null;
|
||||
let tabItemCount = 0;
|
||||
const scrollbarRef = ref<ScrollbarInstance | null>(null);
|
||||
const scrollbarRef = ref<null | ScrollbarInstance>(null);
|
||||
const scrollViewportEl = ref<DomElement>(null);
|
||||
const showScrollButton = ref(false);
|
||||
const scrollIsAtLeft = ref(true);
|
||||
|
||||
Reference in New Issue
Block a user