watermark

 <template>
-  <ImageFormat :mode="1" :lazy="lazy" :style="imageStyle" class="image-slide-item" :src="data.contentData" :width="data.width" :height="data.height"></ImageFormat>
+  <ImageFormat :mode="image.mode" :lazy="lazy" :style="imageStyle" class="image-slide-item" :src="image.src" :width="image.width" :height="image.height"></ImageFormat>
 </template>
 
 <script>
@@ -15,6 +15,28 @@ export default {
   },
   computed: {
     ...mapState(['yoho']),
+    image() {
+      const fixedWidth = 750;
+      let {contentData, width, height} = this.data;
+      const scale = width / height;
+      let mode = 1;
+
+      if (width >= fixedWidth || scale > 1) {
+        width = fixedWidth;
+        height = Math.floor(fixedWidth / scale);
+      } else {
+        mode = 5;
+        width = Math.floor(fixedWidth / scale);
+        height = fixedWidth;
+      }
+
+      return {
+        src: `${this.data.contentData}${this.data.contentData.indexOf('?') ? '|' : '?'}watermark/1/image/aHR0cHM6Ly9jZG4ueW9oby5jbi93YXRlcm1hcmsvZ3Jhc3MucG5n/gravity/South`,
+        width,
+        height,
+        mode
+      };
+    },
     imageStyle() {
       const {width, height} = this.itemSize;