调试

src/saas/AppCountryAlbum/Watermark.vue

@@ -14,13 +14,12 @@
         :style="{left: x + 'px', top: y + 'px' }"
         @touchstart="onTouchstart"
         @touchmove="onTouchmove">
-        <component :is="'Watermark' + (currIndex + 1)" :config="currWatermarkConfig"></component>
+        <component ref="WatermarkItem" :is="'Watermark' + (currIndex + 1)" :config="currWatermarkConfig"></component>
       </div>
     </div>
     <div class="photo-bottom" data-html2canvas-ignore>
       <div class="photo-bottom__top">
         <span @click.stop="isHide = true">取消</span>
-        <!-- <image src="./images/clear.png" @click.stop="isHide = true, currIndex = -1" /> -->
         <h2>水印</h2>
         <span @click.stop="isHide = true">确定</span>
       </div>
@@ -41,23 +40,31 @@
           :key="item.id"
           @click.stop="currIndex = index">
           <image :src="item.thum" />
+          <span v-show="currIndex === index" @click.stop="toEdit">编辑</span>
           <image class="checked" v-if="currIndex === index" src="./images/xuanzhong.png" />
           <div class="water-item__bottom">{{ item.name }}</div>
         </div>
       </div>
     </div>
     <div class="photo-tabbar"  data-html2canvas-ignore>
-      <div class="item" @click.stop="back">
-        <image src="./images/fanhui.png" />
-        <div>返回</div>
-      </div>
-      <div class="item" @click.stop="isHide = false">
-        <image src="./images/shuiyin.png" />
-        <div>水印</div>
-      </div>
-      <div class="item" @click.stop="save">
-        <image src="./images/shangchuan.png" />
-        <div>上传</div>
+      <h2>编辑图片</h2>
+      <div class="tabbar-wrapper">
+        <div class="item" @click.stop="back">
+          <image src="./images/fanhui-black.png" />
+          <div>返回</div>
+        </div>
+        <div class="item" @click.stop="isHide = false">
+          <image src="./images/shuiyin-white.png" />
+          <div>水印</div>
+        </div>
+        <div class="item" @click.stop="isHide = false">
+          <image src="./images/jiancai.png" />
+          <div>剪裁</div>
+        </div>
+        <div class="item" @click.stop="save">
+          <image src="./images/shangchuan-black.png" />
+          <div>上传</div>
+        </div>
       </div>
     </div>
     <u-popup v-model="isShowAlbum" :closeable="false" border-radius="32" height="70%" mode="bottom">
@@ -210,6 +217,10 @@
         }
       },
 
+      toEdit () {
+        this.$refs.WatermarkItem.linkTo('./WatermarkConfig')
+      },
+
       save () {
         this.isHide = true
         this.$loading()
@@ -284,10 +295,11 @@
               this.$http.post('/api/appdvcpconfig/apiForward', `https://apis.map.qq.com/ws/geocoder/v1/?location=${lat},${lng}&key=3RZBZ-LZUCF-CT6J5-NWKZH-FCWOQ-UUFKY&get_poi=1`).then(res => {
                 if (res.code === 0) {
                   const data = res.data.result
+                  alert(JSON.stringify(data))
                   uni.setStorageSync('address', {
                     lat,
                     lng,
-                    address: data.title,
+                    address: data.address,
                     cityCode: `${data.ad_info.adcode}`
                   })
 
@@ -557,15 +569,31 @@
     }
 
     .photo-tabbar {
-      display: flex;
       position: fixed;
-      align-items: center;
       bottom: 0;
       left: 0;
       z-index: 10;
       width: 100%;
-      height: 160px;
-      background: #1E1E21;
+      padding-bottom: 40px;
+      background: #FFFFFF;
+      border-radius: 32px 32px 0px 0px;
+      border: 1px solid #DDDDDD;
+      overflow: hidden;
+
+      h2 {
+        width: 750px;
+        height: 96px;
+        line-height: 96px;
+        margin-bottom: 20px;
+        text-align: center;
+        color: #333333;
+        font-size: 28px;
+      }
+
+      & > div {
+        align-items: center;
+        display: flex;
+      }
 
       .item {
         flex: 1;
@@ -579,7 +607,7 @@
 
         div {
           font-size: 28px;
-          color: #fff;
+          color: #333;
         }
       }
     }
@@ -625,6 +653,22 @@
             height: 200px;
           }
 
+          span {
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            z-index: 1;
+            width: 128px;
+            height: 56px;
+            line-height: 56px;
+            text-align: center;
+            background: rgba(0, 0, 0, 0.8);
+            border-radius: 8px;
+            color: #fff;
+            font-size: 32px;
+            transform: translate(-50%, -50%);
+          }
+
           &:first-child {
             flex-direction: column;
             background: #E4E7EB;