diff --git a/packages/devui-vue/devui/data-grid/src/composables/use-data-grid.ts b/packages/devui-vue/devui/data-grid/src/composables/use-data-grid.ts index 882bb7c559..6e45f84fba 100644 --- a/packages/devui-vue/devui/data-grid/src/composables/use-data-grid.ts +++ b/packages/devui-vue/devui/data-grid/src/composables/use-data-grid.ts @@ -245,7 +245,7 @@ export function useDataGrid(props: DataGridProps, ctx: SetupContext) { scrollRef.value?.addEventListener('scroll', onScroll); if (typeof window !== 'undefined' && scrollRef.value) { resizeObserver = new ResizeObserver(() => { - if (scrollRef.value) { + if (scrollRef.value && sliceColumns.value.length) { let distance = 0; initOriginColumnData(); distance = scrollRef.value!.scrollLeft; diff --git a/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts b/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts index a8ca947dd7..72b8925632 100644 --- a/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts +++ b/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts @@ -310,7 +310,6 @@ export function useEditorMd(props: EditorMdProps, ctx: SetupContext) { editorIns.setSize('auto', '100%'); refreshEditorCursor(); - editorIns.setCursor(editorIns.lineCount(), 0); ctx.emit('afterEditorInit', editorIns); editorIns.on('change', onChange); editorIns.on('scroll', onScroll); diff --git a/packages/devui-vue/devui/form/src/components/form-control/form-control.tsx b/packages/devui-vue/devui/form/src/components/form-control/form-control.tsx index 6bed3c571a..68d076dd80 100644 --- a/packages/devui-vue/devui/form/src/components/form-control/form-control.tsx +++ b/packages/devui-vue/devui/form/src/components/form-control/form-control.tsx @@ -16,7 +16,6 @@ export default defineComponent({ const formControl = ref(); const popoverRef = ref(); const ns = useNamespace('form'); - const showPopoverClick = ref(true); const { controlClasses, controlContainerClasses, labelData } = useFormControl(props); const { feedbackStatus, showFeedback, showPopover, showMessage, errorMessage, popPosition } = useFormControlValidate(); @@ -30,36 +29,12 @@ export default defineComponent({ return undefined; }); - const onDocumentClick = (e: Event) => { - const composedPath = e.composedPath(); - if (composedPath.includes(popoverRef.value.triggerEl)) { - showPopoverClick.value = true; - } else { - showPopoverClick.value = false; - } - }; - - watch(showPopover, (val) => { - if (val) { - setTimeout(() => { - document.addEventListener('click', onDocumentClick); - }); - } else { - showPopoverClick.value = true; - document.removeEventListener('click', onDocumentClick); - } - }); - - onUnmounted(() => { - document.removeEventListener('click', onDocumentClick); - }); - return () => (
; diff --git a/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts b/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts index 75218258a2..69403c4424 100644 --- a/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts +++ b/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts @@ -12,7 +12,7 @@ import { FormRuleItem, UseFormItemValidate, MessageType, - UseFormItemRule + UseFormItemRule, } from './form-item-types'; import { useNamespace } from '@devui/shared/utils'; @@ -141,7 +141,9 @@ export function useFormItemValidate(props: FormItemProps, _rules: ComputedRef { diff --git a/packages/devui-vue/devui/modal/src/components/modal-icons.tsx b/packages/devui-vue/devui/modal/src/components/modal-icons.tsx index 0718310ba2..fbc30fd4f4 100644 --- a/packages/devui-vue/devui/modal/src/components/modal-icons.tsx +++ b/packages/devui-vue/devui/modal/src/components/modal-icons.tsx @@ -1,19 +1,20 @@ export function CloseIcon(): JSX.Element { - return ( - - - - - - ); + return ( + + + + + + + + + ); } diff --git a/packages/devui-vue/devui/search/src/composables/use-search-class.ts b/packages/devui-vue/devui/search/src/composables/use-search-class.ts index e662e94dcb..4233b43f10 100644 --- a/packages/devui-vue/devui/search/src/composables/use-search-class.ts +++ b/packages/devui-vue/devui/search/src/composables/use-search-class.ts @@ -24,12 +24,13 @@ export const useSearchClass = (props: SearchProps, isFocus: Ref): UseSe [ns.m('focus')]: isFocus.value, [ns.m('disabled')]: props.disabled, [ns.m('no-border')]: props.noBorder, + [ns.m('glow-style')]: props.showGlowStyle, [ns.m(searchSize.value)]: !!searchSize.value, [ns.m(props.iconPosition)]: ICON_POSITION[props.iconPosition], })); return { rootClass, - searchSize + searchSize, }; }; diff --git a/packages/devui-vue/devui/search/src/search-types.ts b/packages/devui-vue/devui/search/src/search-types.ts index 75ca6e7b42..afa4a8236f 100644 --- a/packages/devui-vue/devui/search/src/search-types.ts +++ b/packages/devui-vue/devui/search/src/search-types.ts @@ -5,7 +5,7 @@ export type IconPosition = 'right' | 'left'; export const searchProps = { size: { - type: String as PropType + type: String as PropType, }, placeholder: { type: String, @@ -51,6 +51,10 @@ export const searchProps = { type: Function as PropType<(v: string) => void>, default: undefined, }, + showGlowStyle: { + type: Boolean, + default: true, + }, } as const; export type SearchProps = ExtractPropTypes; diff --git a/packages/devui-vue/devui/search/src/search.scss b/packages/devui-vue/devui/search/src/search.scss index 7467f35a89..ec6950ccdf 100644 --- a/packages/devui-vue/devui/search/src/search.scss +++ b/packages/devui-vue/devui/search/src/search.scss @@ -4,9 +4,11 @@ .#{$devui-prefix}-search { position: relative; + border-radius: $devui-border-radius; + transition: border-color 0.3s $devui-animation-ease-in-out-smooth, box-shadow $devui-animation-duration-base $devui-animation-ease-in; @include flex; - &:not(.#{$devui-prefix}-search--error):not(.#{$devui-prefix}-search--disabled):not(.#{$devui-prefix}-search--focus):hover { + &:not(.#{$devui-prefix}-search--error):not(.#{$devui-prefix}-search--disabled):not(.#{$devui-prefix}-search--focus):not(.#{$devui-prefix}-search--glow-style):hover { .#{$devui-prefix}-input { border-color: $devui-form-control-line-hover; } @@ -99,6 +101,15 @@ top: 0; } + &--glow-style { + &:not(.#{$devui-prefix}-search--disabled) { + &:hover, + &.#{$devui-prefix}-search--focus { + box-shadow: 0 0 0 4px $devui-form-control-interactive-outline; + } + } + } + &--sm { .#{$devui-prefix}-input { height: $devui-size-sm; diff --git a/packages/devui-vue/devui/search/src/search.tsx b/packages/devui-vue/devui/search/src/search.tsx index 3b6570ae86..e2ce9d259e 100644 --- a/packages/devui-vue/devui/search/src/search.tsx +++ b/packages/devui-vue/devui/search/src/search.tsx @@ -46,6 +46,7 @@ export default defineComponent({ maxlength: props.maxLength, modelValue: keywords.value, placeholder: props.placeholder || t('placeholder'), + showGlowStyle: false, onKeydown: onInputKeydown, 'onUpdate:modelValue': onInputUpdate, onFocus: onFocus, diff --git a/packages/devui-vue/docs/components/search/index.md b/packages/devui-vue/docs/components/search/index.md index 290bdd40ff..d2fa04a88e 100644 --- a/packages/devui-vue/docs/components/search/index.md +++ b/packages/devui-vue/docs/components/search/index.md @@ -107,6 +107,7 @@ export default defineComponent({ | icon-position | [IconPositionType](#iconpositiontype) | 'right' | 可选，搜索图标位置 | [搜索图标左置](#搜索图标左置) | | no-border | `boolean` | false | 可选，是否显示边框 | [无边框](#无边框) | | css-class | `string` | '' | 可选，支持传入类名到输入框上 | [双向绑定](#双向绑定) | +|show-glow-style|`boolean`|true|可选，是否显示悬浮发光效果|| ### Search 事件 @@ -123,6 +124,7 @@ type SearchSizeType = 'sm' | 'md' | 'lg'; ``` #### IconPositionType + ```ts type IconPositionType = 'right' | 'left'; ``` diff --git a/packages/devui-vue/package.json b/packages/devui-vue/package.json index baa7a95a07..7332cc4771 100644 --- a/packages/devui-vue/package.json +++ b/packages/devui-vue/package.json @@ -1,6 +1,6 @@ { "name": "vue-devui", - "version": "1.6.9", + "version": "1.6.10", "license": "MIT", "description": "DevUI components based on Vite and Vue3", "keywords": [