dialog调整

This commit is contained in:
fan 2024-04-19 20:38:01 +08:00
parent e5336ed74e
commit eaf84b5fe6

View File

@ -16,47 +16,50 @@
}" }"
style="max-width: 2000px" style="max-width: 2000px"
> >
<q-scroll-area <!-- <q-scroll-area
v-if="props.height"
id="draggable-dialog-scroll" id="draggable-dialog-scroll"
:style="`width: ${props.width}px;height: ${props.height}px`" :style="`width: ${props.width}px;height: ${props.height}px`"
style="max-height: 90vh" style="max-height: 90vh"
> > -->
<div style="position: sticky; top: 0px; z-index: 9"> <div style="position: sticky; top: 0px; z-index: 9">
<q-bar <q-bar
ref="headerRef" ref="headerRef"
class="non-selectable q-gutter-l" class="non-selectable q-gutter-l"
style=" style="
cursor: move; cursor: move;
border-top-right-radius: 0; border-top-right-radius: 0;
border-top-left-radius: 0; border-top-left-radius: 0;
" "
:style="`height: ${props.titleHeight}px;background: ${props.titleColor}`" :style="`height: ${props.titleHeight}px;background: ${props.titleColor}`"
>
<div
:style="`height: 100%; line-height: ${props.titleHeight}px; color:${props.fontColor};font-size: ${props.fontSize}px;`"
>
{{ props.title }}
</div>
<q-space />
<div style="margin-right: 10px">
<slot name="titleButton"></slot>
</div>
<q-btn dense flat icon="sym_o_close" v-close-popup></q-btn>
</q-bar>
</div>
<slot></slot>
<div :style="`width: ${props.width}px`">
<slot name="footer"></slot>
</div>
<div
:style="`width: ${props.width}px`"
style="position: sticky; bottom: 0px"
> >
<slot name="sticky-footer"></slot> <div
</div> :style="`height: 100%; line-height: ${props.titleHeight}px; color:${props.fontColor};font-size: ${props.fontSize}px;`"
>
{{ props.title }}
</div>
<q-space />
<div style="margin-right: 10px">
<slot name="titleButton"></slot>
</div>
<q-btn dense flat icon="sym_o_close" v-close-popup></q-btn>
</q-bar>
</div>
<q-scroll-area
v-if="props.height"
id="draggable-dialog-scroll"
:style="`width: ${props.width}px;height: ${props.height}px`"
style="max-height: calc(90vh - 100px)"
>
<slot></slot>
</q-scroll-area> </q-scroll-area>
<slot name="footer"></slot>
<div
:style="`width: ${props.width}px`"
style="position: sticky; bottom: 0px"
>
<slot name="sticky-footer"></slot>
</div>
</q-card> </q-card>
</q-dialog> </q-dialog>
</template> </template>