Showing
1 changed file
with
12 additions
and
4 deletions
| 1 | <template> | 1 | <template> |
| 2 | <div class="poster-page"> | 2 | <div class="poster-page"> |
| 3 | - <div style="position: fixed; right: 5px; top: 10px; z-index: 9;"> | 3 | + <div @click="goToIndex" style="position: fixed; right: 5px; top: 10px; z-index: 9;"> |
| 4 | <img src="https://cdn.ipadbiz.cn/xfPark/post/public/go-back-btn.1713241695.png" style="width: 2rem; height: 2rem;"> | 4 | <img src="https://cdn.ipadbiz.cn/xfPark/post/public/go-back-btn.1713241695.png" style="width: 2rem; height: 2rem;"> |
| 5 | </div> | 5 | </div> |
| 6 | <div class="poster-contain-wrapper"> | 6 | <div class="poster-contain-wrapper"> |
| 7 | - <div v-if="flag" ref="canvasRef" class="poster-contain" style="border: 1.5px solid #9C8882; "> | 7 | + <div v-if="flag" style="border: 1.5px solid #9C8882; box-shadow: 8px 8px 8px 0px rgba(156,136,130,1); height: 100%;"> |
| 8 | + <div ref="canvasRef" class="poster-contain" style=""> | ||
| 8 | <div class="poster-text-boxer"> | 9 | <div class="poster-text-boxer"> |
| 9 | <div class="poster-text"> | 10 | <div class="poster-text"> |
| 10 | <span class="name">{{ tree_data?.name }}</span> | 11 | <span class="name">{{ tree_data?.name }}</span> |
| ... | @@ -27,7 +28,8 @@ | ... | @@ -27,7 +28,8 @@ |
| 27 | </div> | 28 | </div> |
| 28 | 29 | ||
| 29 | </div> | 30 | </div> |
| 30 | - <div v-if="imgUrl"> | 31 | + </div> |
| 32 | + <div v-if="imgUrl" :style="{border: '1.5px solid #9C8882', boxShadow: '8px 8px 8px 0px rgba(156,136,130,1)', height: ref_height}"> | ||
| 31 | <img :src="imgUrl" crossOrigin="anonymous" :style="{ width: ref_width, height: ref_height }"> | 33 | <img :src="imgUrl" crossOrigin="anonymous" :style="{ width: ref_width, height: ref_height }"> |
| 32 | </div> | 34 | </div> |
| 33 | </div> | 35 | </div> |
| ... | @@ -88,7 +90,7 @@ onMounted(async () => { | ... | @@ -88,7 +90,7 @@ onMounted(async () => { |
| 88 | ref_width.value = canvasDom.offsetWidth + 'px'; | 90 | ref_width.value = canvasDom.offsetWidth + 'px'; |
| 89 | ref_height.value = canvasDom.offsetHeight + 'px'; | 91 | ref_height.value = canvasDom.offsetHeight + 'px'; |
| 90 | }); | 92 | }); |
| 91 | - // createImage(); | 93 | + createImage(); |
| 92 | }); | 94 | }); |
| 93 | 95 | ||
| 94 | const resizePoster = () => { // 重置海报 | 96 | const resizePoster = () => { // 重置海报 |
| ... | @@ -104,6 +106,12 @@ const resizePoster = () => { // 重置海报 | ... | @@ -104,6 +106,12 @@ const resizePoster = () => { // 重置海报 |
| 104 | createImage(); | 106 | createImage(); |
| 105 | }; | 107 | }; |
| 106 | 108 | ||
| 109 | +const goToIndex = () => { // 返回首页 | ||
| 110 | + $router.push({ | ||
| 111 | + path: '/', | ||
| 112 | + }); | ||
| 113 | +} | ||
| 114 | + | ||
| 107 | const posterPrev = () => { // 上一个 | 115 | const posterPrev = () => { // 上一个 |
| 108 | if (posterIndex.value > 0) { | 116 | if (posterIndex.value > 0) { |
| 109 | posterIndex.value--; | 117 | posterIndex.value--; | ... | ... |
-
Please register or login to post a comment