From 44f2be7d9b40d0b73d096522dab316a6a5be80c5 Mon Sep 17 00:00:00 2001
From: yanran200730 <yanran200830@163.com>
Date: Tue, 31 May 2022 18:09:17 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/saas/AppCountryAlbum/Watermark.vue | 50 +++++++++++++++-----------
 1 file changed, 29 insertions(+), 21 deletions(-)

diff --git a/src/saas/AppCountryAlbum/Watermark.vue b/src/saas/AppCountryAlbum/Watermark.vue
index 6a1f5062..db73c562 100644
--- a/src/saas/AppCountryAlbum/Watermark.vue
+++ b/src/saas/AppCountryAlbum/Watermark.vue
@@ -6,19 +6,21 @@
         <image src="./images/to-right.png" />
       </div>
     </div>
-    <div ref="waterMarker" class="waterMarker-wrapper" :style="{height: canvasHeight + 'px'}">
-      <image class="waterMarker-img" :src="img" mode="widthFix" @load="onImgLoad" />
-      <div
-        class="watermark"
-        v-if="currIndex > -1 && currWatermarkConfig.length"
-        :style="{left: x + 'px', top: y + 'px' }"
-        @touchstart="onTouchstart"
-        @touchmove="onTouchmove">
-        <component ref="WatermarkItem" :is="'Watermark' + (currIndex + 1)" :config="currWatermarkConfig"></component>
-        <div v-if="!isHide" @click.stop="currIndex = -1" class="watermark-close" data-html2canvas-ignore>
-          <image src="./images/close-b.png" />
+    <div class="photo-wrapper">
+      <div ref="waterMarker" class="waterMarker-wrapper" :style="{height: canvasHeight + 'px'}">
+        <img class="waterMarker-img" :src="img" mode="widthFix" @load="onImgLoad" />
+        <div
+          class="watermark"
+          v-if="currIndex > -1 && currWatermarkConfig.length"
+          :style="{left: x + 'px', top: y + 'px' }"
+          @touchstart="onTouchstart"
+          @touchmove="onTouchmove">
+          <component ref="WatermarkItem" :is="'Watermark' + (currIndex + 1)" :config="currWatermarkConfig"></component>
+          <div v-if="!isHide" @click.stop="currIndex = -1" class="watermark-close" data-html2canvas-ignore>
+            <image src="./images/close-b.png" />
+          </div>
+          <span v-if="!isHide" class="watermark-edit" @click.stop="toEdit" data-html2canvas-ignore>编辑</span>
         </div>
-        <span v-if="!isHide" class="watermark-edit" @click.stop="toEdit" data-html2canvas-ignore>编辑</span>
       </div>
     </div>
     <div class="photo-bottom" data-html2canvas-ignore>
@@ -393,15 +395,21 @@
 
 <style lang="scss" scoped>
   .photo {
-    display: flex;
-    position: relative;
-    align-items: center;
-    justify-content: center;
     width: 100%;
-    height: 100vh;
     background: #333;
     overflow: hidden;
 
+    .photo-wrapper {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      position: absolute;
+      top: 128px;
+      left: 0;
+      width: 100%;
+      height: calc(100vh - 321px - 128px);
+    }
+
     .newImg {
       position: fixed;
       left: 0;
@@ -564,13 +572,13 @@
     }
 
     .waterMarker-wrapper {
-      width: 100%;
-      max-height: 100vh;
+      position: relative;
+      max-height: calc(100vh - 321px - 128px);
       overflow: hidden;
 
       .waterMarker-img {
         width: 100%;
-        max-height: 100vh;
+        max-height: calc(100vh - 321px - 128px);
       }
 
       .watermark {
@@ -637,7 +645,7 @@
       left: 0;
       z-index: 10;
       width: 100%;
-      padding-bottom: 40px;
+      height: 321px;
       background: #FFFFFF;
       border-radius: 32px 32px 0px 0px;
       border: 1px solid #DDDDDD;