joylink/rts-sim-testing-client
6
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

dialog调整

Browse Source
This commit is contained in:
fan 2024-04-19 20:38:01 +08:00
parent e5336ed74e
commit eaf84b5fe6
1 changed files with 39 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
src/components/common/DraggableDialog.vue
View File

@ -16,47 +16,50 @@
}"
style="max-width: 2000px"
>
<q-scroll-area
<!-- <q-scroll-area
v-if="props.height"
id="draggable-dialog-scroll"
:style="`width: ${props.width}px;height: ${props.height}px`"
style="max-height: 90vh"
>
<div style="position: sticky; top: 0px; z-index: 9">
<q-bar
ref="headerRef"
class="non-selectable q-gutter-l"
style="
cursor: move;
border-top-right-radius: 0;
border-top-left-radius: 0;
"
: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"
> -->
<div style="position: sticky; top: 0px; z-index: 9">
<q-bar
ref="headerRef"
class="non-selectable q-gutter-l"
style="
cursor: move;
border-top-right-radius: 0;
border-top-left-radius: 0;
"
:style="`height: ${props.titleHeight}px;background: ${props.titleColor}`"
>
<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>
<slot name="footer"></slot>
<div
:style="`width: ${props.width}px`"
style="position: sticky; bottom: 0px"
>
<slot name="sticky-footer"></slot>
</div>
</q-card>
</q-dialog>
</template>