4 changed files with 94 additions and 16 deletions
@ -0,0 +1,53 @@
|
||||
<template> |
||||
<el-dialog |
||||
:show-close="false" |
||||
width="90vw" |
||||
top="2vh" |
||||
class="dialog-header-nopadding dialog-body-nopadding" |
||||
style="--el-dialog-padding-primary: 10px; margin-bottom: 0" |
||||
:lock-scroll="false" |
||||
:close-on-press-escape="false" |
||||
ref="dialogRef" |
||||
> |
||||
<template #header="{ close }"> |
||||
<header class="dialog-header"> |
||||
<el-button link circle size="large" @click="close" class="close-btn"> |
||||
<template #icon> |
||||
<icon name="el-icon-close" :size="26" :color="'#fff'" /> |
||||
</template> |
||||
</el-button> |
||||
</header> |
||||
</template> |
||||
<main> |
||||
<iframe :src="`http://65.47.60.145/#/mail-detail?mailId=` + id"></iframe> |
||||
</main> |
||||
</el-dialog> |
||||
</template> |
||||
<script lang="ts" setup> |
||||
const props = defineProps({ |
||||
id: { |
||||
type: String, |
||||
required: true, |
||||
}, |
||||
}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
iframe { |
||||
width: 100%; |
||||
height: 100%; |
||||
border: none; |
||||
} |
||||
main { |
||||
height: 90vh; |
||||
} |
||||
.dialog-header { |
||||
position: absolute; |
||||
top: 10px; |
||||
right: 10px; |
||||
} |
||||
</style> |
||||
<style lang="scss"> |
||||
.dialog-body-nopadding .el-dialog__body { |
||||
padding: 0; |
||||
} |
||||
</style> |
||||
Loading…
Reference in new issue