Commit 1f37e9ed79ef70842a11e14044b769e1cef6e998
1 parent
24f4ae70
feat(packages/external): 重写远程网页,新增全屏按钮
Showing
1 changed file
with
11 additions
and
8 deletions
1 | 1 | <template> |
2 | - <div :style="getStyle(borderRadius)"> | |
2 | + <div class="iframe-content" :style="getStyle(borderRadius)"> | |
3 | 3 | <div v-show="isShowSvg" @click="handleFullScreen" class="fullscreen-button"> |
4 | 4 | <svg |
5 | 5 | focusable="false" |
... | ... | @@ -19,7 +19,7 @@ |
19 | 19 | <iframe |
20 | 20 | @mouseenter="handleMouseenter" |
21 | 21 | @mouseleave="handleMouseleave" |
22 | - id="iframe-content" | |
22 | + id="iframeContent" | |
23 | 23 | :src="option.dataset" |
24 | 24 | :width="w" |
25 | 25 | :height="h" |
... | ... | @@ -75,7 +75,7 @@ useChartDataFetch(props.chartConfig, useChartEditStore, (newData: string) => { |
75 | 75 | }) |
76 | 76 | |
77 | 77 | const handleFullScreen = () => { |
78 | - const domName = document.getElementById('iframe-content') as HTMLElement | |
78 | + const domName = document.getElementById('iframeContent') as HTMLElement | |
79 | 79 | const htmlName = document.querySelector('html') as HTMLHtmlElement |
80 | 80 | useFullScreen(domName, htmlName) |
81 | 81 | } |
... | ... | @@ -85,10 +85,13 @@ const handleMouseleave = () => (isShowSvg.value = false) |
85 | 85 | </script> |
86 | 86 | |
87 | 87 | <style lang="scss" scoped> |
88 | -.fullscreen-button { | |
89 | - cursor: pointer; | |
90 | - position: absolute; | |
91 | - right: 0; | |
92 | - top: 0; | |
88 | +.iframe-content { | |
89 | + position: relative; | |
90 | + .fullscreen-button { | |
91 | + cursor: pointer; | |
92 | + position: absolute; | |
93 | + right: 0; | |
94 | + top: 0; | |
95 | + } | |
93 | 96 | } |
94 | 97 | </style> | ... | ... |