|
|
@ -1,40 +1,23 @@ |
|
|
|
<template> |
|
|
|
<Teleport> |
|
|
|
<Transition name="fade"> |
|
|
|
<div |
|
|
|
:class="['mask-layer', { 'none-mask': noneMask }]" |
|
|
|
v-if="modelVisible" |
|
|
|
> |
|
|
|
<BackgroundClip |
|
|
|
class="dialog" |
|
|
|
<div :class="['mask-layer', { 'none-mask': noneMask }]" v-if="modelVisible"> |
|
|
|
<BackgroundClip class="dialog" |
|
|
|
clipPath="polygon(calc(100% - var(--clip-width)) 0, 100% var(--clip-width), 100% 100%, var(--clip-width) 100%, 0 calc(100% - var(--clip-width)), 0 0)" |
|
|
|
borderColor="linear-gradient(180deg, rgba(78, 174, 204, .9), rgba(78, 174, 204, 0))" |
|
|
|
bgColor="linear-gradient(180deg, rgba(14, 69, 92, 0.9) 0%, rgba(20, 89, 119, 0.9) 100%)" |
|
|
|
ref="DialogContentRef" |
|
|
|
:width="width" |
|
|
|
:top="top" |
|
|
|
> |
|
|
|
ref="DialogContentRef" :width="width" :top="top"> |
|
|
|
<div class="dialog-title"> |
|
|
|
<img |
|
|
|
class="title-icon" |
|
|
|
src="@screen/images/dialog/title-icon.svg" |
|
|
|
/> |
|
|
|
<img class="title-icon" src="@screen/images/dialog/title-icon.svg" /> |
|
|
|
<span>{{ title }}</span> |
|
|
|
<img |
|
|
|
class="icon-close" |
|
|
|
@click.stop="modelVisible = false" |
|
|
|
src="@screen/images/dialog/icon-close.svg" |
|
|
|
/> |
|
|
|
<img class="icon-close" @click.stop="modelVisible = false" src="@screen/images/dialog/icon-close.svg" /> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="dialog-content"> |
|
|
|
<slot /> |
|
|
|
</div> |
|
|
|
|
|
|
|
<img |
|
|
|
class="bottom-right" |
|
|
|
src="@screen/images/dialog/right-bottom.svg" |
|
|
|
/> |
|
|
|
<img class="bottom-right" src="@screen/images/dialog/right-bottom.svg" /> |
|
|
|
|
|
|
|
<div class="footer" v-if="$slots.footer"> |
|
|
|
<slot name="footer"></slot> |
|
|
@ -130,7 +113,7 @@ export default { |
|
|
|
height: 100%; |
|
|
|
background: rgba(0, 0, 0, 0.36); |
|
|
|
border-radius: 0px 0px 0px 0px; |
|
|
|
z-index: 100; |
|
|
|
z-index: 1100; |
|
|
|
// display: flex; |
|
|
|
// align-items: center; |
|
|
|
// justify-content: center; |
|
|
@ -224,7 +207,7 @@ export default { |
|
|
|
padding: 0 27px; |
|
|
|
|
|
|
|
::v-deep { |
|
|
|
> div { |
|
|
|
>div { |
|
|
|
min-width: 96px; |
|
|
|
} |
|
|
|
} |
|
|
|