fm453/kinit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf：Dialog 组件增加top，width默认值，将maxHeight改为height

Browse Source
This commit is contained in:
ktianc 2023-07-05 09:36:18 +08:00
parent ee3b2f448e
commit 8c57536513
3 changed files with 11 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
kinit-admin/src/components/Dialog/src/Dialog.vue
View File

@ -9,12 +9,14 @@ const slots = useSlots()
const props = defineProps({ const props = defineProps({
modelValue: propTypes.bool.def(false), modelValue: propTypes.bool.def(false),
title: propTypes.string.def('Dialog'), title: propTypes.string.def('Dialog'),
top: propTypes.string.def('8vh'),
fullscreen: propTypes.bool.def(true), fullscreen: propTypes.bool.def(true),
maxHeight: propTypes.oneOfType([String, Number]).def('500px') height: propTypes.oneOfType([String, Number]).def('500px'),
width: propTypes.oneOfType([String, Number]).def('700px')
}) })
const getBindValue = computed(() => { const getBindValue = computed(() => {
const delArr: string[] = ['fullscreen', 'title', 'maxHeight'] const delArr: string[] = ['fullscreen', 'title', 'height', 'top', 'width']
const attrs = useAttrs() const attrs = useAttrs()
const obj = { ...attrs, ...props } const obj = { ...attrs, ...props }
for (const key in obj) { for (const key in obj) {
@ -31,7 +33,7 @@ const toggleFull = () => {
isFullscreen.value = !unref(isFullscreen) isFullscreen.value = !unref(isFullscreen)
} }
const dialogHeight = ref(isNumber(props.maxHeight) ? `${props.maxHeight}px` : props.maxHeight) const dialogHeight = ref(isNumber(props.height) ? `${props.height}px` : props.height)
watch( watch(
() => isFullscreen.value, () => isFullscreen.value,
@ -41,7 +43,7 @@ watch(
const windowHeight = document.documentElement.offsetHeight const windowHeight = document.documentElement.offsetHeight
dialogHeight.value = `${windowHeight - 55 - 60 - (slots.footer ? 63 : 0)}px` dialogHeight.value = `${windowHeight - 55 - 60 - (slots.footer ? 63 : 0)}px`
} else { } else {
dialogHeight.value = isNumber(props.maxHeight) ? `${props.maxHeight}px` : props.maxHeight dialogHeight.value = isNumber(props.height) ? `${props.height}px` : props.height
} }
}, },
{ {
@ -64,6 +66,8 @@ const dialogStyle = computed(() => {
lock-scroll lock-scroll
draggable draggable
:close-on-click-modal="false" :close-on-click-modal="false"
:top="top"
:width="width"
> >
<template #header> <template #header>
<div class="flex justify-between"> <div class="flex justify-between">

2
kinit-admin/src/views/vadmin/auth/role/index.vue
View File

@ -196,7 +196,7 @@ watch(
</template> </template>
</Table> </Table>
<Dialog v-model="dialogVisible" :title="dialogTitle" width="700px" maxHeight="600px"> <Dialog v-model="dialogVisible" :title="dialogTitle" width="700px" height="600px">
<Write <Write
ref="writeRef" ref="writeRef"
:current-row="tableObject.currentRow" :current-row="tableObject.currentRow"

9
kinit-admin/src/views/vadmin/auth/user/index.vue
View File

@ -367,12 +367,7 @@ const handleCommand = (command: string) => {
</template> </template>
</Dialog> </Dialog>
<Dialog <Dialog v-model="importDialogVisible" :title="importDialogTitle" width="750px" height="550px">
v-model="importDialogVisible"
:title="importDialogTitle"
width="750px"
maxHeight="550px"
>
<Import @get-list="getList" /> <Import @get-list="getList" />
</Dialog> </Dialog>
@ -380,7 +375,7 @@ const handleCommand = (command: string) => {
v-model="passwordDialogVisible" v-model="passwordDialogVisible"
:title="passwordDialogTitle" :title="passwordDialogTitle"
width="1000px" width="1000px"
maxHeight="550px" height="550px"
> >
<PasswordSendSMS <PasswordSendSMS
v-if="passwordDialogType === 'sms'" v-if="passwordDialogType === 'sms'"