first

node_modules/vant/es/image-preview/ImagePreview.js

@@ -0,0 +1,234 @@
+// Utils
+import { bem, createComponent } from './shared'; // Mixins
+
+import { PopupMixin } from '../mixins/popup';
+import { TouchMixin } from '../mixins/touch';
+import { BindEventMixin } from '../mixins/bind-event'; // Components
+
+import Icon from '../icon';
+import Swipe from '../swipe';
+import ImagePreviewItem from './ImagePreviewItem';
+export default createComponent({
+  mixins: [TouchMixin, PopupMixin({
+    skipToggleEvent: true
+  }), BindEventMixin(function (bind) {
+    bind(window, 'resize', this.resize, true);
+    bind(window, 'orientationchange', this.resize, true);
+  })],
+  props: {
+    className: null,
+    closeable: Boolean,
+    asyncClose: Boolean,
+    overlayStyle: Object,
+    showIndicators: Boolean,
+    images: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    loop: {
+      type: Boolean,
+      default: true
+    },
+    overlay: {
+      type: Boolean,
+      default: true
+    },
+    minZoom: {
+      type: [Number, String],
+      default: 1 / 3
+    },
+    maxZoom: {
+      type: [Number, String],
+      default: 3
+    },
+    transition: {
+      type: String,
+      default: 'van-fade'
+    },
+    showIndex: {
+      type: Boolean,
+      default: true
+    },
+    swipeDuration: {
+      type: [Number, String],
+      default: 300
+    },
+    startPosition: {
+      type: [Number, String],
+      default: 0
+    },
+    overlayClass: {
+      type: String,
+      default: bem('overlay')
+    },
+    closeIcon: {
+      type: String,
+      default: 'clear'
+    },
+    closeOnPopstate: {
+      type: Boolean,
+      default: true
+    },
+    closeIconPosition: {
+      type: String,
+      default: 'top-right'
+    }
+  },
+  data: function data() {
+    return {
+      active: 0,
+      rootWidth: 0,
+      rootHeight: 0,
+      doubleClickTimer: null
+    };
+  },
+  mounted: function mounted() {
+    this.resize();
+  },
+  watch: {
+    startPosition: 'setActive',
+    value: function value(val) {
+      var _this = this;
+
+      if (val) {
+        this.setActive(+this.startPosition);
+        this.$nextTick(function () {
+          _this.resize();
+
+          _this.$refs.swipe.swipeTo(+_this.startPosition, {
+            immediate: true
+          });
+        });
+      } else {
+        this.$emit('close', {
+          index: this.active,
+          url: this.images[this.active]
+        });
+      }
+    }
+  },
+  methods: {
+    resize: function resize() {
+      if (this.$el && this.$el.getBoundingClientRect) {
+        var rect = this.$el.getBoundingClientRect();
+        this.rootWidth = rect.width;
+        this.rootHeight = rect.height;
+      }
+    },
+    emitClose: function emitClose() {
+      if (!this.asyncClose) {
+        this.$emit('input', false);
+      }
+    },
+    emitScale: function emitScale(args) {
+      this.$emit('scale', args);
+    },
+    setActive: function setActive(active) {
+      if (active !== this.active) {
+        this.active = active;
+        this.$emit('change', active);
+      }
+    },
+    genIndex: function genIndex() {
+      var h = this.$createElement;
+
+      if (this.showIndex) {
+        return h("div", {
+          "class": bem('index')
+        }, [this.slots('index', {
+          index: this.active
+        }) || this.active + 1 + " / " + this.images.length]);
+      }
+    },
+    genCover: function genCover() {
+      var h = this.$createElement;
+      var cover = this.slots('cover');
+
+      if (cover) {
+        return h("div", {
+          "class": bem('cover')
+        }, [cover]);
+      }
+    },
+    genImages: function genImages() {
+      var _this2 = this;
+
+      var h = this.$createElement;
+      return h(Swipe, {
+        "ref": "swipe",
+        "attrs": {
+          "lazyRender": true,
+          "loop": this.loop,
+          "duration": this.swipeDuration,
+          "initialSwipe": this.startPosition,
+          "showIndicators": this.showIndicators,
+          "indicatorColor": "white"
+        },
+        "class": bem('swipe'),
+        "on": {
+          "change": this.setActive
+        }
+      }, [this.images.map(function (image) {
+        return h(ImagePreviewItem, {
+          "attrs": {
+            "src": image,
+            "show": _this2.value,
+            "active": _this2.active,
+            "maxZoom": _this2.maxZoom,
+            "minZoom": _this2.minZoom,
+            "rootWidth": _this2.rootWidth,
+            "rootHeight": _this2.rootHeight
+          },
+          "on": {
+            "scale": _this2.emitScale,
+            "close": _this2.emitClose
+          }
+        });
+      })]);
+    },
+    genClose: function genClose() {
+      var h = this.$createElement;
+
+      if (this.closeable) {
+        return h(Icon, {
+          "attrs": {
+            "role": "button",
+            "name": this.closeIcon
+          },
+          "class": bem('close-icon', this.closeIconPosition),
+          "on": {
+            "click": this.emitClose
+          }
+        });
+      }
+    },
+    onClosed: function onClosed() {
+      this.$emit('closed');
+    },
+    // @exposed-api
+    swipeTo: function swipeTo(index, options) {
+      if (this.$refs.swipe) {
+        this.$refs.swipe.swipeTo(index, options);
+      }
+    }
+  },
+  render: function render() {
+    var h = arguments[0];
+    return h("transition", {
+      "attrs": {
+        "name": this.transition
+      },
+      "on": {
+        "afterLeave": this.onClosed
+      }
+    }, [this.shouldRender ? h("div", {
+      "directives": [{
+        name: "show",
+        value: this.value
+      }],
+      "class": [bem(), this.className]
+    }, [this.genClose(), this.genImages(), this.genIndex(), this.genCover()]) : null]);
+  }
+});

node_modules/vant/es/image-preview/ImagePreviewItem.js

@@ -0,0 +1,247 @@
+// Utils
+import { bem } from './shared';
+import { range } from '../utils/format/number';
+import { preventDefault } from '../utils/dom/event'; // Mixins
+
+import { TouchMixin } from '../mixins/touch'; // Component
+
+import Image from '../image';
+import Loading from '../loading';
+import SwipeItem from '../swipe-item';
+
+function getDistance(touches) {
+  return Math.sqrt(Math.pow(touches[0].clientX - touches[1].clientX, 2) + Math.pow(touches[0].clientY - touches[1].clientY, 2));
+}
+
+export default {
+  mixins: [TouchMixin],
+  props: {
+    src: String,
+    show: Boolean,
+    active: Number,
+    minZoom: [Number, String],
+    maxZoom: [Number, String],
+    rootWidth: Number,
+    rootHeight: Number
+  },
+  data: function data() {
+    return {
+      scale: 1,
+      moveX: 0,
+      moveY: 0,
+      moving: false,
+      zooming: false,
+      imageRatio: 0,
+      displayWidth: 0,
+      displayHeight: 0
+    };
+  },
+  computed: {
+    vertical: function vertical() {
+      var rootWidth = this.rootWidth,
+          rootHeight = this.rootHeight;
+      var rootRatio = rootHeight / rootWidth;
+      return this.imageRatio > rootRatio;
+    },
+    imageStyle: function imageStyle() {
+      var scale = this.scale;
+      var style = {
+        transitionDuration: this.zooming || this.moving ? '0s' : '.3s'
+      };
+
+      if (scale !== 1) {
+        var offsetX = this.moveX / scale;
+        var offsetY = this.moveY / scale;
+        style.transform = "scale(" + scale + ", " + scale + ") translate(" + offsetX + "px, " + offsetY + "px)";
+      }
+
+      return style;
+    },
+    maxMoveX: function maxMoveX() {
+      if (this.imageRatio) {
+        var displayWidth = this.vertical ? this.rootHeight / this.imageRatio : this.rootWidth;
+        return Math.max(0, (this.scale * displayWidth - this.rootWidth) / 2);
+      }
+
+      return 0;
+    },
+    maxMoveY: function maxMoveY() {
+      if (this.imageRatio) {
+        var displayHeight = this.vertical ? this.rootHeight : this.rootWidth * this.imageRatio;
+        return Math.max(0, (this.scale * displayHeight - this.rootHeight) / 2);
+      }
+
+      return 0;
+    }
+  },
+  watch: {
+    active: 'resetScale',
+    show: function show(val) {
+      if (!val) {
+        this.resetScale();
+      }
+    }
+  },
+  mounted: function mounted() {
+    this.bindTouchEvent(this.$el);
+  },
+  methods: {
+    resetScale: function resetScale() {
+      this.setScale(1);
+      this.moveX = 0;
+      this.moveY = 0;
+    },
+    setScale: function setScale(scale) {
+      scale = range(scale, +this.minZoom, +this.maxZoom);
+
+      if (scale !== this.scale) {
+        this.scale = scale;
+        this.$emit('scale', {
+          scale: this.scale,
+          index: this.active
+        });
+      }
+    },
+    toggleScale: function toggleScale() {
+      var scale = this.scale > 1 ? 1 : 2;
+      this.setScale(scale);
+      this.moveX = 0;
+      this.moveY = 0;
+    },
+    onTouchStart: function onTouchStart(event) {
+      var touches = event.touches;
+      var _this$offsetX = this.offsetX,
+          offsetX = _this$offsetX === void 0 ? 0 : _this$offsetX;
+      this.touchStart(event);
+      this.touchStartTime = new Date();
+      this.fingerNum = touches.length;
+      this.startMoveX = this.moveX;
+      this.startMoveY = this.moveY;
+      this.moving = this.fingerNum === 1 && this.scale !== 1;
+      this.zooming = this.fingerNum === 2 && !offsetX;
+
+      if (this.zooming) {
+        this.startScale = this.scale;
+        this.startDistance = getDistance(event.touches);
+      }
+    },
+    onTouchMove: function onTouchMove(event) {
+      var touches = event.touches;
+      this.touchMove(event);
+
+      if (this.moving || this.zooming) {
+        preventDefault(event, true);
+      }
+
+      if (this.moving) {
+        var moveX = this.deltaX + this.startMoveX;
+        var moveY = this.deltaY + this.startMoveY;
+        this.moveX = range(moveX, -this.maxMoveX, this.maxMoveX);
+        this.moveY = range(moveY, -this.maxMoveY, this.maxMoveY);
+      }
+
+      if (this.zooming && touches.length === 2) {
+        var distance = getDistance(touches);
+        var scale = this.startScale * distance / this.startDistance;
+        this.setScale(scale);
+      }
+    },
+    onTouchEnd: function onTouchEnd(event) {
+      var stopPropagation = false;
+      /* istanbul ignore else */
+
+      if (this.moving || this.zooming) {
+        stopPropagation = true;
+
+        if (this.moving && this.startMoveX === this.moveX && this.startMoveY === this.moveY) {
+          stopPropagation = false;
+        }
+
+        if (!event.touches.length) {
+          if (this.zooming) {
+            this.moveX = range(this.moveX, -this.maxMoveX, this.maxMoveX);
+            this.moveY = range(this.moveY, -this.maxMoveY, this.maxMoveY);
+            this.zooming = false;
+          }
+
+          this.moving = false;
+          this.startMoveX = 0;
+          this.startMoveY = 0;
+          this.startScale = 1;
+
+          if (this.scale < 1) {
+            this.resetScale();
+          }
+        }
+      } // eliminate tap delay on safari
+
+
+      preventDefault(event, stopPropagation);
+      this.checkTap();
+      this.resetTouchStatus();
+    },
+    checkTap: function checkTap() {
+      var _this = this;
+
+      if (this.fingerNum > 1) {
+        return;
+      }
+
+      var _this$offsetX2 = this.offsetX,
+          offsetX = _this$offsetX2 === void 0 ? 0 : _this$offsetX2,
+          _this$offsetY = this.offsetY,
+          offsetY = _this$offsetY === void 0 ? 0 : _this$offsetY;
+      var deltaTime = new Date() - this.touchStartTime;
+      var TAP_TIME = 250;
+      var TAP_OFFSET = 5;
+
+      if (offsetX < TAP_OFFSET && offsetY < TAP_OFFSET && deltaTime < TAP_TIME) {
+        if (this.doubleTapTimer) {
+          clearTimeout(this.doubleTapTimer);
+          this.doubleTapTimer = null;
+          this.toggleScale();
+        } else {
+          this.doubleTapTimer = setTimeout(function () {
+            _this.$emit('close');
+
+            _this.doubleTapTimer = null;
+          }, TAP_TIME);
+        }
+      }
+    },
+    onLoad: function onLoad(event) {
+      var _event$target = event.target,
+          naturalWidth = _event$target.naturalWidth,
+          naturalHeight = _event$target.naturalHeight;
+      this.imageRatio = naturalHeight / naturalWidth;
+    }
+  },
+  render: function render() {
+    var h = arguments[0];
+    var imageSlots = {
+      loading: function loading() {
+        return h(Loading, {
+          "attrs": {
+            "type": "spinner"
+          }
+        });
+      }
+    };
+    return h(SwipeItem, {
+      "class": bem('swipe-item')
+    }, [h(Image, {
+      "attrs": {
+        "src": this.src,
+        "fit": "contain"
+      },
+      "class": bem('image', {
+        vertical: this.vertical
+      }),
+      "style": this.imageStyle,
+      "scopedSlots": imageSlots,
+      "on": {
+        "load": this.onLoad
+      }
+    })]);
+  }
+};

node_modules/vant/es/image-preview/index.css

@@ -0,0 +1 @@
+.van-image-preview{position:fixed;top:0;left:0;width:100%;height:100%}.van-image-preview__swipe{height:100%}.van-image-preview__swipe-item{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;overflow:hidden}.van-image-preview__cover{position:absolute;top:0;left:0}.van-image-preview__image{width:100%;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform}.van-image-preview__image--vertical{width:auto;height:100%}.van-image-preview__image img{-webkit-user-drag:none}.van-image-preview__image .van-image__error{top:30%;height:40%}.van-image-preview__image .van-image__error-icon{font-size:36px}.van-image-preview__image .van-image__loading{background-color:transparent}.van-image-preview__index{position:absolute;top:16px;left:50%;color:#fff;font-size:14px;line-height:20px;text-shadow:0 1px 1px #323233;-webkit-transform:translate(-50%,0);transform:translate(-50%,0)}.van-image-preview__overlay{background-color:rgba(0,0,0,.9)}.van-image-preview__close-icon{position:absolute;z-index:1;color:#c8c9cc;font-size:22px;cursor:pointer}.van-image-preview__close-icon:active{color:#969799}.van-image-preview__close-icon--top-left{top:16px;left:16px}.van-image-preview__close-icon--top-right{top:16px;right:16px}.van-image-preview__close-icon--bottom-left{bottom:16px;left:16px}.van-image-preview__close-icon--bottom-right{right:16px;bottom:16px}

node_modules/vant/es/image-preview/index.js

@@ -0,0 +1,88 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import Vue from 'vue';
+import VueImagePreview from './ImagePreview';
+import { isServer } from '../utils';
+var instance;
+var defaultConfig = {
+  loop: true,
+  value: true,
+  images: [],
+  maxZoom: 3,
+  minZoom: 1 / 3,
+  onClose: null,
+  onChange: null,
+  className: '',
+  showIndex: true,
+  closeable: false,
+  closeIcon: 'clear',
+  asyncClose: false,
+  transition: 'van-fade',
+  getContainer: 'body',
+  overlayStyle: null,
+  startPosition: 0,
+  swipeDuration: 300,
+  showIndicators: false,
+  closeOnPopstate: true,
+  closeIconPosition: 'top-right'
+};
+
+var initInstance = function initInstance() {
+  instance = new (Vue.extend(VueImagePreview))({
+    el: document.createElement('div')
+  });
+  document.body.appendChild(instance.$el);
+  instance.$on('change', function (index) {
+    if (instance.onChange) {
+      instance.onChange(index);
+    }
+  });
+  instance.$on('scale', function (data) {
+    if (instance.onScale) {
+      instance.onScale(data);
+    }
+  });
+};
+
+var ImagePreview = function ImagePreview(images, startPosition) {
+  if (startPosition === void 0) {
+    startPosition = 0;
+  }
+
+  /* istanbul ignore if */
+  if (isServer) {
+    return;
+  }
+
+  if (!instance) {
+    initInstance();
+  }
+
+  var options = Array.isArray(images) ? {
+    images: images,
+    startPosition: startPosition
+  } : images;
+
+  _extends(instance, defaultConfig, options);
+
+  instance.$once('input', function (show) {
+    instance.value = show;
+  });
+  instance.$once('closed', function () {
+    instance.images = [];
+  });
+
+  if (options.onClose) {
+    instance.$off('close');
+    instance.$once('close', options.onClose);
+  }
+
+  return instance;
+};
+
+ImagePreview.Component = VueImagePreview;
+
+ImagePreview.install = function () {
+  Vue.use(VueImagePreview);
+};
+
+export default ImagePreview;

node_modules/vant/es/image-preview/index.less

@@ -0,0 +1,103 @@
+@import '../style/var';
+
+.van-image-preview {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+
+  &__swipe {
+    height: 100%;
+
+    &-item {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      overflow: hidden;
+    }
+  }
+
+  &__cover {
+    position: absolute;
+    top: 0;
+    left: 0;
+  }
+
+  &__image {
+    width: 100%;
+    transition-property: transform;
+
+    &--vertical {
+      width: auto;
+      height: 100%;
+    }
+
+    img {
+      // disable desktop browser image drag
+      -webkit-user-drag: none;
+    }
+
+    .van-image {
+      &__error {
+        top: 30%;
+        height: 40%;
+      }
+
+      &__error-icon {
+        font-size: 36px;
+      }
+
+      &__loading {
+        background-color: transparent;
+      }
+    }
+  }
+
+  &__index {
+    position: absolute;
+    top: @padding-md;
+    left: 50%;
+    color: @image-preview-index-text-color;
+    font-size: @image-preview-index-font-size;
+    line-height: @image-preview-index-line-height;
+    text-shadow: @image-preview-index-text-shadow;
+    transform: translate(-50%, 0);
+  }
+
+  &__overlay {
+    background-color: @image-preview-overlay-background-color;
+  }
+
+  &__close-icon {
+    position: absolute;
+    z-index: @image-preview-close-icon-z-index;
+    color: @image-preview-close-icon-color;
+    font-size: @image-preview-close-icon-size;
+    cursor: pointer;
+
+    &:active {
+      color: @image-preview-close-icon-active-color;
+    }
+
+    &--top-left {
+      top: @image-preview-close-icon-margin;
+      left: @image-preview-close-icon-margin;
+    }
+
+    &--top-right {
+      top: @image-preview-close-icon-margin;
+      right: @image-preview-close-icon-margin;
+    }
+
+    &--bottom-left {
+      bottom: @image-preview-close-icon-margin;
+      left: @image-preview-close-icon-margin;
+    }
+
+    &--bottom-right {
+      right: @image-preview-close-icon-margin;
+      bottom: @image-preview-close-icon-margin;
+    }
+  }
+}

node_modules/vant/es/image-preview/shared.js

@@ -0,0 +1,7 @@
+import { createNamespace } from '../utils';
+
+var _createNamespace = createNamespace('image-preview'),
+    createComponent = _createNamespace[0],
+    bem = _createNamespace[1];
+
+export { createComponent, bem };

node_modules/vant/es/image-preview/style/index.js

@@ -0,0 +1,10 @@
+import '../../style/base.css';
+import '../../overlay/index.css';
+import '../../info/index.css';
+import '../../icon/index.css';
+import '../../image/index.css';
+import '../../popup/index.css';
+import '../../loading/index.css';
+import '../../swipe/index.css';
+import '../../swipe-item/index.css';
+import '../index.css';

node_modules/vant/es/image-preview/style/less.js

@@ -0,0 +1,10 @@
+import '../../style/base.less';
+import '../../overlay/index.less';
+import '../../info/index.less';
+import '../../icon/index.less';
+import '../../image/index.less';
+import '../../popup/index.less';
+import '../../loading/index.less';
+import '../../swipe/index.less';
+import '../../swipe-item/index.less';
+import '../index.less';