diff --git a/src/components/Modal/src/BasicModal.vue b/src/components/Modal/src/BasicModal.vue
index 1321115..e8ec42f 100644
--- a/src/components/Modal/src/BasicModal.vue
+++ b/src/components/Modal/src/BasicModal.vue
@@ -17,9 +17,9 @@ import { useDesign } from '@/hooks/web/useDesign'
defineOptions({ name: 'BasicModal', inheritAttrs: false })
const props = defineProps(basicProps)
-const emit = defineEmits(['visible-change', 'height-change', 'cancel', 'ok', 'register', 'update:visible'])
+const emit = defineEmits(['open-change', 'height-change', 'cancel', 'ok', 'register', 'update:open'])
const attrs = useAttrs()
-const visibleRef = ref(false)
+const openRef = ref(false)
const propsRef = ref
| null>(null)
const modalWrapperRef = ref(null)
const { prefixCls } = useDesign('basic-modal')
@@ -28,7 +28,7 @@ const { prefixCls } = useDesign('basic-modal')
const extHeightRef = ref(0)
const modalMethods: ModalMethods = {
setModalProps,
- emitVisible: undefined,
+ emitOpen: undefined,
redoModalHeight: () => {
nextTick(() => {
if (unref(modalWrapperRef)) {
@@ -60,7 +60,7 @@ const { handleFullScreen, getWrapClassName, fullScreenRef } = useFullScreen({
const getProps = computed((): Recordable => {
const opt = {
...unref(getMergeProps),
- visible: unref(visibleRef),
+ open: unref(openRef),
okButtonProps: undefined,
cancelButtonProps: undefined,
title: undefined,
@@ -75,7 +75,7 @@ const getBindValue = computed((): Recordable => {
const attr = {
...attrs,
...unref(getMergeProps),
- visible: unref(visibleRef),
+ open: unref(openRef),
}
attr.wrapClassName = `${attr?.wrapClassName || ''} ${unref(getWrapClassName)}`
if (unref(fullScreenRef))
@@ -91,16 +91,16 @@ const getWrapperHeight = computed(() => {
})
watchEffect(() => {
- visibleRef.value = !!props.visible
+ openRef.value = !!props.open
fullScreenRef.value = !!props.defaultFullscreen
})
watch(
- () => unref(visibleRef),
+ () => unref(openRef),
(v) => {
- emit('visible-change', v)
- emit('update:visible', v)
- instance && modalMethods.emitVisible?.(v, instance.uid)
+ emit('open-change', v)
+ emit('update:open', v)
+ instance && modalMethods.emitOpen?.(v, instance.uid)
nextTick(() => {
if (props.scrollTop && v && unref(modalWrapperRef)) {
;(unref(modalWrapperRef) as any).scrollTop()
@@ -120,11 +120,11 @@ async function handleCancel(e: Event) {
return
if (props.closeFunc && isFunction(props.closeFunc)) {
const isClose: boolean = await props.closeFunc()
- visibleRef.value = !isClose
+ openRef.value = !isClose
return
}
- visibleRef.value = false
+ openRef.value = false
emit('cancel', e)
}
@@ -134,8 +134,8 @@ async function handleCancel(e: Event) {
function setModalProps(props: Partial): void {
// Keep the last setModalProps
propsRef.value = deepMerge(unref(propsRef) || ({} as any), props)
- if (Reflect.has(props, 'visible'))
- visibleRef.value = !!props.visible
+ if (Reflect.has(props, 'open'))
+ openRef.value = !!props.open
if (Reflect.has(props, 'defaultFullscreen'))
fullScreenRef.value = !!props.defaultFullscreen
@@ -193,9 +193,9 @@ function handleTitleDbClick(e) {
:loading-tip="getProps.loadingTip"
:min-height="getProps.minHeight"
:height="getWrapperHeight"
- :visible="visibleRef"
+ :open="openRef"
:modal-footer-height="footer !== undefined && !footer ? 0 : undefined"
- v-bind="omit(getProps.wrapperProps, 'visible', 'height', 'modalFooterHeight')"
+ v-bind="omit(getProps.wrapperProps, 'open', 'height', 'modalFooterHeight')"
@ext-height="handleExtHeight"
@height-change="handleHeightChange"
>
diff --git a/src/components/Modal/src/components/Modal.tsx b/src/components/Modal/src/components/Modal.tsx
index 3f39639..aeb4844 100644
--- a/src/components/Modal/src/components/Modal.tsx
+++ b/src/components/Modal/src/components/Modal.tsx
@@ -11,10 +11,10 @@ export default defineComponent({
props: basicProps,
emits: ['cancel'],
setup(props, { slots, emit }) {
- const { visible, draggable, destroyOnClose } = toRefs(props)
+ const { open, draggable, destroyOnClose } = toRefs(props)
const attrs = useAttrs()
useModalDragMove({
- visible,
+ open,
destroyOnClose,
draggable,
})
diff --git a/src/components/Modal/src/components/ModalWrapper.vue b/src/components/Modal/src/components/ModalWrapper.vue
index f4b587b..90e299a 100644
--- a/src/components/Modal/src/components/ModalWrapper.vue
+++ b/src/components/Modal/src/components/ModalWrapper.vue
@@ -16,7 +16,7 @@ const props = defineProps({
minHeight: { type: Number, default: 200 },
height: { type: Number },
footerOffset: { type: Number, default: 0 },
- visible: { type: Boolean },
+ open: { type: Boolean },
fullScreen: { type: Boolean },
loadingTip: { type: String },
})
@@ -89,8 +89,8 @@ async function scrollTop() {
async function setModalHeight() {
// 解决在弹窗关闭的时候监听还存在,导致再次打开弹窗没有高度
- // 加上这个,就必须在使用的时候传递父级的visible
- if (!props.visible)
+ // 加上这个,就必须在使用的时候传递父级的open
+ if (!props.open)
return
const wrapperRefDom = unref(wrapperRef)
if (!wrapperRefDom)
diff --git a/src/components/Modal/src/hooks/useModal.ts b/src/components/Modal/src/hooks/useModal.ts
index 0bd479a..a510ccb 100644
--- a/src/components/Modal/src/hooks/useModal.ts
+++ b/src/components/Modal/src/hooks/useModal.ts
@@ -8,7 +8,7 @@ import { error } from '@/utils/log'
const dataTransfer = reactive({})
-const visibleData = reactive<{ [key: number]: boolean }>({})
+const openData = reactive<{ [key: number]: boolean }>({})
/**
* @description: Applicable to independent modal and call outside
@@ -34,8 +34,8 @@ export function useModal(): UseModalReturnType {
modal.value = modalMethod
loaded.value = true
- modalMethod.emitVisible = (visible: boolean, uid: number) => {
- visibleData[uid] = visible
+ modalMethod.emitOpen = (open: boolean, uid: number) => {
+ openData[uid] = open
}
}
@@ -52,17 +52,17 @@ export function useModal(): UseModalReturnType {
getInstance()?.setModalProps(props)
},
- getVisible: computed((): boolean => {
- return visibleData[~~unref(uid)]
+ getOpen: computed((): boolean => {
+ return openData[~~unref(uid)]
}),
redoModalHeight: () => {
getInstance()?.redoModalHeight?.()
},
- openModal: (visible = true, data?: T, openOnSet = true): void => {
+ openModal: (open = true, data?: T, openOnSet = true): void => {
getInstance()?.setModalProps({
- visible,
+ open,
})
if (!data)
@@ -79,7 +79,7 @@ export function useModal(): UseModalReturnType {
},
closeModal: () => {
- getInstance()?.setModalProps({ visible: false })
+ getInstance()?.setModalProps({ open: false })
},
}
return [register, methods]
@@ -125,8 +125,8 @@ export function useModalInner(callbackFn?: Fn): UseModalInnerReturnType {
changeLoading: (loading = true) => {
getInstance()?.setModalProps({ loading })
},
- getVisible: computed((): boolean => {
- return visibleData[~~unref(uidRef)]
+ getOpen: computed((): boolean => {
+ return openData[~~unref(uidRef)]
}),
changeOkLoading: (loading = true) => {
@@ -134,7 +134,7 @@ export function useModalInner(callbackFn?: Fn): UseModalInnerReturnType {
},
closeModal: () => {
- getInstance()?.setModalProps({ visible: false })
+ getInstance()?.setModalProps({ open: false })
},
setModalProps: (props: Partial) => {
diff --git a/src/components/Modal/src/hooks/useModalDrag.ts b/src/components/Modal/src/hooks/useModalDrag.ts
index cf0898a..8b573c7 100644
--- a/src/components/Modal/src/hooks/useModalDrag.ts
+++ b/src/components/Modal/src/hooks/useModalDrag.ts
@@ -5,7 +5,7 @@ import { useTimeoutFn } from '@vueuse/core'
export interface UseModalDragMoveContext {
draggable: Ref
destroyOnClose: Ref | undefined
- visible: Ref
+ open: Ref
}
export function useModalDragMove(context: UseModalDragMoveContext) {
@@ -100,7 +100,7 @@ export function useModalDragMove(context: UseModalDragMoveContext) {
}
watchEffect(() => {
- if (!unref(context.visible) || !unref(context.draggable))
+ if (!unref(context.open) || !unref(context.draggable))
return
useTimeoutFn(() => {
diff --git a/src/components/Modal/src/props.ts b/src/components/Modal/src/props.ts
index 075e039..901a407 100644
--- a/src/components/Modal/src/props.ts
+++ b/src/components/Modal/src/props.ts
@@ -6,7 +6,7 @@ import { useI18n } from '@/hooks/web/useI18n'
const { t } = useI18n()
export const modalProps = {
- visible: { type: Boolean },
+ open: { type: Boolean },
scrollTop: { type: Boolean, default: true },
height: { type: Number },
minHeight: { type: Number },
@@ -73,7 +73,7 @@ export const basicProps = Object.assign({}, modalProps, {
title: { type: String },
- visible: { type: Boolean },
+ open: { type: Boolean },
width: { type: [String, Number] as PropType, default: '40%' },
diff --git a/src/components/Modal/src/typing.ts b/src/components/Modal/src/typing.ts
index 3db6318..175222f 100644
--- a/src/components/Modal/src/typing.ts
+++ b/src/components/Modal/src/typing.ts
@@ -6,7 +6,7 @@ import type { CSSProperties, ComputedRef, VNodeChild } from 'vue'
*/
export interface ModalMethods {
setModalProps: (props: Partial) => void
- emitVisible?: (visible: boolean, uid: number) => void
+ emitOpen?: (open: boolean, uid: number) => void
redoModalHeight?: () => void
}
@@ -15,7 +15,7 @@ export type RegisterFn = (modalMethods: ModalMethods, uuid?: string) => void
export interface ReturnMethods extends ModalMethods {
openModal: (props?: boolean, data?: T, openOnSet?: boolean) => void
closeModal: () => void
- getVisible?: ComputedRef
+ getOpen?: ComputedRef
}
export type UseModalReturnType = [RegisterFn, ReturnMethods]
@@ -24,7 +24,7 @@ export interface ReturnInnerMethods extends ModalMethods {
closeModal: () => void
changeLoading: (loading: boolean) => void
changeOkLoading: (loading: boolean) => void
- getVisible?: ComputedRef
+ getOpen?: ComputedRef
redoModalHeight: () => void
}
@@ -41,7 +41,7 @@ export interface ModalProps {
// 是否可以进行全屏
canFullscreen?: boolean
defaultFullscreen?: boolean
- visible?: boolean
+ open?: boolean
// 温馨提醒信息
helpMessage: string | string[]
@@ -204,7 +204,7 @@ export interface ModalWrapperProps {
modalFooterHeight: number
minHeight: number
height: number
- visible: boolean
+ open: boolean
fullScreen: boolean
useWrapper: boolean
}
diff --git a/src/components/Preview/src/Preview.vue b/src/components/Preview/src/Preview.vue
index 7ed9af3..6c5d0e6 100644
--- a/src/components/Preview/src/Preview.vue
+++ b/src/components/Preview/src/Preview.vue
@@ -15,8 +15,8 @@ interface ImageProps {
preview?:
| boolean
| {
- visible?: boolean
- onVisibleChange?: (visible: boolean, prevVisible: boolean) => void
+ open?: boolean
+ onOpenChange?: (open: boolean, prevOpen: boolean) => void
getContainer: string | HTMLElement | (() => HTMLElement)
}
}
diff --git a/src/components/Preview/src/typing.ts b/src/components/Preview/src/typing.ts
index 3e690e6..882e144 100644
--- a/src/components/Preview/src/typing.ts
+++ b/src/components/Preview/src/typing.ts
@@ -46,8 +46,8 @@ export interface ImageProps {
preview?:
| boolean
| {
- visible?: boolean
- onVisibleChange?: (visible: boolean, prevVisible: boolean) => void
+ open?: boolean
+ onOpenChange?: (open: boolean, prevOpen: boolean) => void
getContainer: string | HTMLElement | (() => HTMLElement)
}
}
diff --git a/src/components/SimpleMenu/src/components/SubMenuItem.vue b/src/components/SimpleMenu/src/components/SubMenuItem.vue
index ebe2917..829b343 100644
--- a/src/components/SimpleMenu/src/components/SubMenuItem.vue
+++ b/src/components/SimpleMenu/src/components/SubMenuItem.vue
@@ -218,8 +218,8 @@ onBeforeMount(() => {
})
})
-function handleVisibleChange(visible: boolean) {
- state.opened = visible
+function handleOpenChange(open: boolean) {
+ state.opened = open
}
// provide
@@ -254,10 +254,10 @@ provide(`subMenu:${instance?.uid}`, {
v-else
placement="right"
:overlay-class-name="`${prefixCls}-menu-popover`"
- :visible="getIsOpend"
+ :open="getIsOpend"
:overlay-style="getOverlayStyle"
:align="{ offset: [0, 0] }"
- @visible-change="handleVisibleChange"
+ @open-change="handleOpenChange"
>
{
const Comp = componentMap.get(component) as typeof defineComponent
@@ -26,7 +26,7 @@ export const CellComponent: FunctionalComponent = (
Popover,
{
overlayClassName: 'edit-cell-rule-popover',
- visible: !!popoverVisible,
+ open: !!popoverOpen,
...(getPopupContainer ? { getPopupContainer } : {}),
},
{
diff --git a/src/components/Table/src/components/editable/EditableCell.vue b/src/components/Table/src/components/editable/EditableCell.vue
index 10c84a0..1bf72ea 100644
--- a/src/components/Table/src/components/editable/EditableCell.vue
+++ b/src/components/Table/src/components/editable/EditableCell.vue
@@ -42,7 +42,7 @@ export default defineComponent({
const table = useTableContext()
const isEdit = ref(false)
const elRef = ref()
- const ruleVisible = ref(false)
+ const ruleOpen = ref(false)
const ruleMessage = ref('')
const optionsRef = ref
([])
const currentValueRef = ref(props.value)
@@ -54,8 +54,8 @@ export default defineComponent({
const getComponent = computed(() => props.column?.editComponent || 'Input')
const getRule = computed(() => props.column?.editRule)
- const getRuleVisible = computed(() => {
- return unref(ruleMessage) && unref(ruleVisible)
+ const getRuleOpen = computed(() => {
+ return unref(ruleMessage) && unref(ruleOpen)
})
const getIsCheckComp = computed(() => {
@@ -211,7 +211,7 @@ export default defineComponent({
if (editRule) {
if (isBoolean(editRule) && !currentValue && !isNumber(currentValue)) {
- ruleVisible.value = true
+ ruleOpen.value = true
const component = unref(getComponent)
ruleMessage.value = createPlaceholderMessage(component)
return false
@@ -220,7 +220,7 @@ export default defineComponent({
const res = await editRule(currentValue, record as Recordable)
if (res) {
ruleMessage.value = res
- ruleVisible.value = true
+ ruleOpen.value = true
return false
}
else {
@@ -383,7 +383,7 @@ export default defineComponent({
getRule,
onClickOutside,
ruleMessage,
- getRuleVisible,
+ getRuleOpen,
getComponentProps,
handleOptionsChange,
getWrapperStyle,
@@ -422,7 +422,7 @@ export default defineComponent({
{...this.getComponentProps}
component={this.getComponent}
style={this.getWrapperStyle}
- popoverVisible={this.getRuleVisible}
+ popoverOpen={this.getRuleOpen}
rule={this.getRule}
ruleMessage={this.ruleMessage}
class={this.getWrapperClass}
diff --git a/src/components/Table/src/components/settings/ColumnSetting.vue b/src/components/Table/src/components/settings/ColumnSetting.vue
index 95e1511..74460d6 100644
--- a/src/components/Table/src/components/settings/ColumnSetting.vue
+++ b/src/components/Table/src/components/settings/ColumnSetting.vue
@@ -135,7 +135,7 @@ async function init(isReset = false) {
// 是否列展示全选
state.checkAll = checkList.length === columns.length
inited = false
- handleVisibleChange()
+ handleOpenChange()
state.checkedList = checkList
}
@@ -190,7 +190,7 @@ function reset() {
}
// Open the pop-up window for drag and drop initialization
-function handleVisibleChange() {
+function handleOpenChange() {
if (inited)
return
nextTick(() => {
@@ -277,9 +277,9 @@ function setColumns(columns: BasicColumn[] | string[]) {
isSetColumnsFromThis = true
table.setColumns(columns)
const data: ColumnChangeParam[] = unref(plainSortOptions).map((col) => {
- const visible
+ const open
= columns.findIndex((c: BasicColumn | string) => c === col.value || (typeof c !== 'string' && c.dataIndex === col.value)) !== -1
- return { dataIndex: col.value, fixed: col.fixed, visible }
+ return { dataIndex: col.value, fixed: col.fixed, open }
})
emit('columns-change', data)
@@ -307,7 +307,7 @@ function updateSortOption(column: BasicColumn) {
trigger="click"
:overlay-class-name="`${prefixCls}__cloumn-list`"
:get-popup-container="getPopupContainer"
- @visible-change="handleVisibleChange"
+ @open-change="handleOpenChange"
>
diff --git a/src/components/Table/src/types/column.ts b/src/components/Table/src/types/column.ts
index db067d2..e6e5877 100644
--- a/src/components/Table/src/types/column.ts
+++ b/src/components/Table/src/types/column.ts
@@ -22,7 +22,7 @@ export interface FilterDropdownProps {
clearFilters?: () => void
filters?: ColumnFilterItem[]
getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement
- visible?: boolean
+ open?: boolean
}
export declare type CustomRenderFunction = (record: RecordProps) => VNodeChild | JSX.Element
@@ -74,10 +74,10 @@ export interface ColumnProps {
filterDropdown?: VNodeChild | JSX.Element | ((props: FilterDropdownProps) => VNodeChild | JSX.Element)
/**
- * Whether filterDropdown is visible
+ * Whether filterDropdown is open
* @type boolean
*/
- filterDropdownVisible?: boolean
+ filterDropdownOpen?: boolean
/**
* Whether the dataSource is filtered
@@ -181,10 +181,10 @@ export interface ColumnProps {
onFilter?: (value: any, record: T) => boolean
/**
- * Callback executed when filterDropdownVisible is changed, Use as a filterDropdownVisible event when using template or jsx
+ * Callback executed when filterDropdownOpen is changed, Use as a filterDropdownOpen event when using template or jsx
* @type Function
*/
- onFilterDropdownVisibleChange?: (visible: boolean) => void
+ onFilterDropdownOpenChange?: (open: boolean) => void
/**
* When using columns, you can setting this property to configure the properties that support the slot,
diff --git a/src/components/Table/src/types/table.ts b/src/components/Table/src/types/table.ts
index bdb8628..c70926c 100644
--- a/src/components/Table/src/types/table.ts
+++ b/src/components/Table/src/types/table.ts
@@ -455,7 +455,7 @@ export interface BasicColumn extends ColumnProps {
export interface ColumnChangeParam {
dataIndex: string
fixed: boolean | 'left' | 'right' | undefined
- visible: boolean
+ open: boolean
}
export interface InnerHandlers {
diff --git a/src/layouts/default/sider/index.vue b/src/layouts/default/sider/index.vue
index 06ef8c4..60622f2 100644
--- a/src/layouts/default/sider/index.vue
+++ b/src/layouts/default/sider/index.vue
@@ -27,7 +27,7 @@ function handleClose() {
:class="prefixCls"
:width="getMenuWidth"
:get-container="null"
- :visible="!getCollapsed"
+ :open="!getCollapsed"
@close="handleClose"
>