"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _comp = require("../../ui/src/comp");
var _xeUtils = _interopRequireDefault(require("xe-utils"));
var _ui = require("../../ui");
var _dom = require("../../ui/src/dom");
var _util = require("./util");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function createInternalData() {
  return {
    // dgTime: 0,
    // mdTime: 0
  };
}
function createReactData() {
  return {};
}
var _default2 = exports.default = /* define-vxe-component start */(0, _comp.defineVxeComponent)({
  name: 'VxeImage',
  mixins: [_ui.globalMixins.sizeMixin],
  props: {
    src: [String, Array],
    alt: [String, Number],
    loading: String,
    title: [String, Number],
    width: [String, Number],
    height: [String, Number],
    minWidth: [String, Number],
    minHeight: [String, Number],
    maxWidth: [String, Number],
    maxHeight: [String, Number],
    circle: Boolean,
    draggable: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().image.draggable;
      }
    },
    zIndex: Number,
    maskClosable: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().image.maskClosable;
      }
    },
    toolbarConfig: Object,
    showPreview: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().image.showPreview;
      }
    },
    showPrintButton: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().image.showPrintButton;
      }
    },
    showDownloadButton: {
      type: Boolean,
      default: function _default() {
        return (0, _ui.getConfig)().image.showDownloadButton;
      }
    },
    size: {
      type: String,
      default: function _default() {
        return (0, _ui.getConfig)().image.size || (0, _ui.getConfig)().size;
      }
    },
    getThumbnailUrlMethod: Function
  },
  data: function data() {
    var reactData = createReactData();
    return Object.assign(Object.assign({}, {}), {
      xID: _xeUtils.default.uniqueId(),
      reactData: reactData
    });
  },
  computed: Object.assign(Object.assign({}, {}), {
    computeWrapperStyle: function computeWrapperStyle() {
      var $xeImage = this;
      var props = $xeImage;
      var width = props.width,
        height = props.height,
        circle = props.circle;
      var stys = {};
      if (circle) {
        // 圆形只能生效一个
        if (width) {
          stys.height = (0, _dom.toCssUnit)(width);
        } else if (height) {
          stys.width = (0, _dom.toCssUnit)(height);
        }
      } else {
        if (width) {
          stys.width = (0, _dom.toCssUnit)(width);
        }
        if (height) {
          stys.height = (0, _dom.toCssUnit)(height);
        }
      }
      return stys;
    },
    computeImgStyle: function computeImgStyle() {
      var $xeImage = this;
      var props = $xeImage;
      var width = props.width,
        height = props.height,
        minWidth = props.minWidth,
        minHeight = props.minHeight,
        maxHeight = props.maxHeight,
        maxWidth = props.maxWidth;
      var stys = {};
      if (width && height) {
        stys.maxWidth = (0, _dom.toCssUnit)(width);
        stys.maxHeight = (0, _dom.toCssUnit)(height);
      } else {
        if (width) {
          stys.width = (0, _dom.toCssUnit)(width);
        }
        if (height) {
          stys.height = (0, _dom.toCssUnit)(height);
        }
        if (minWidth) {
          stys.minWidth = (0, _dom.toCssUnit)(minWidth);
        }
        if (minHeight) {
          stys.minHeight = (0, _dom.toCssUnit)(minHeight);
        }
        if (maxWidth) {
          stys.maxWidth = (0, _dom.toCssUnit)(maxWidth);
        }
        if (maxHeight) {
          stys.maxHeight = (0, _dom.toCssUnit)(maxHeight);
        }
      }
      return stys;
    },
    computeImgList: function computeImgList() {
      var $xeImage = this;
      var props = $xeImage;
      var src = props.src;
      if (src) {
        return (_xeUtils.default.isArray(src) ? src : [src]).map(function (item) {
          if (_xeUtils.default.isString(item)) {
            return {
              url: item,
              alt: ''
            };
          }
          return {
            url: item.url,
            alt: item.alt
          };
        });
      }
      return [];
    },
    computeImgItem: function computeImgItem() {
      var $xeImage = this;
      var imgList = $xeImage.computeImgList;
      return imgList[0];
    },
    computeImgUrl: function computeImgUrl() {
      var $xeImage = this;
      var imgItem = $xeImage.computeImgItem;
      return imgItem ? "".concat(imgItem.url || '') : '';
    },
    computeImgThumbnailUrl: function computeImgThumbnailUrl() {
      var $xeImage = this;
      var props = $xeImage;
      var getThumbnailUrlFn = props.getThumbnailUrlMethod || (0, _ui.getConfig)().image.getThumbnailUrlMethod;
      var imgUrl = $xeImage.computeImgUrl;
      return getThumbnailUrlFn ? getThumbnailUrlFn({
        url: imgUrl,
        $image: $xeImage
      }) : '';
    }
  }),
  methods: {
    //
    // Method
    //
    dispatchEvent: function dispatchEvent(type, params, evnt) {
      var $xeImage = this;
      $xeImage.$emit(type, (0, _ui.createEvent)(evnt, {
        $image: $xeImage
      }, params));
    },
    clickEvent: function clickEvent(evnt) {
      var $xeImage = this;
      var props = $xeImage;
      var internalData = $xeImage.internalData;
      var $xeImageGroup = $xeImage.$xeImageGroup;
      var showPreview = props.showPreview,
        toolbarConfig = props.toolbarConfig,
        showPrintButton = props.showPrintButton,
        showDownloadButton = props.showDownloadButton,
        maskClosable = props.maskClosable,
        zIndex = props.zIndex;
      var mdTime = internalData.mdTime,
        dgTime = internalData.dgTime;
      if (mdTime && dgTime && dgTime > mdTime) {
        return;
      }
      var imgList = $xeImage.computeImgList;
      var imgUrl = $xeImage.computeImgUrl;
      if ($xeImageGroup) {
        $xeImageGroup.handleClickImgEvent(evnt, {
          url: imgUrl
        });
      } else {
        if (showPreview && imgUrl) {
          (0, _util.openPreviewImage)({
            urlList: imgList,
            toolbarConfig: toolbarConfig,
            showPrintButton: showPrintButton,
            showDownloadButton: showDownloadButton,
            maskClosable: maskClosable,
            zIndex: zIndex,
            events: {
              change: function change(eventParams) {
                $xeImage.dispatchEvent('change', eventParams, eventParams.$event);
              },
              rotate: function rotate(eventParams) {
                $xeImage.dispatchEvent('rotate', eventParams, eventParams.$event);
              }
            }
          });
        }
        $xeImage.dispatchEvent('click', {
          url: imgUrl
        }, evnt);
      }
    },
    mousedownEvent: function mousedownEvent() {
      var $xeImage = this;
      var internalData = $xeImage.internalData;
      internalData.mdTime = Date.now();
    },
    handleDragstartEvent: function handleDragstartEvent(evnt) {
      var $xeImage = this;
      var internalData = $xeImage.internalData;
      internalData.dgTime = Date.now();
      $xeImage.dispatchEvent('dragstart', {}, evnt);
    },
    handleDragEvent: function handleDragEvent(evnt) {
      var $xeImage = this;
      $xeImage.dispatchEvent(evnt.type, {}, evnt);
    },
    //
    // Render
    //
    renderVN: function renderVN(h) {
      var $xeImage = this;
      var props = $xeImage;
      var alt = props.alt,
        loading = props.loading,
        circle = props.circle,
        draggable = props.draggable;
      var wrapperStyle = $xeImage.computeWrapperStyle;
      var imgStyle = $xeImage.computeImgStyle;
      var imgUrl = $xeImage.computeImgUrl;
      var imgThumbnailUrl = $xeImage.computeImgThumbnailUrl;
      var vSize = $xeImage.computeSize;
      var imgDrag;
      if (!_xeUtils.default.eqNull(draggable)) {
        imgDrag = !!(draggable === true || draggable === 'true');
      }
      return h('div', {
        class: ['vxe-image', _defineProperty(_defineProperty({}, "size--".concat(vSize), vSize), 'is--circle', circle)],
        style: wrapperStyle
      }, [h('img', {
        ref: 'refElem',
        class: 'vxe-image-img',
        style: imgStyle,
        attrs: {
          src: imgThumbnailUrl || imgUrl,
          alt: alt,
          loading: loading,
          draggable: imgDrag
        },
        on: {
          mousedown: $xeImage.mousedownEvent,
          click: $xeImage.clickEvent,
          dragstart: $xeImage.handleDragstartEvent,
          drag: $xeImage.handleDragEvent,
          dragend: $xeImage.handleDragEvent
        }
      })]);
    }
  },
  created: function created() {
    var $xeImage = this;
    $xeImage.internalData = createInternalData();
  },
  beforeDestroy: function beforeDestroy() {
    var $xeImage = this;
    var reactData = $xeImage.reactData;
    var internalData = $xeImage.internalData;
    _xeUtils.default.assign(reactData, createReactData());
    _xeUtils.default.assign(internalData, createInternalData());
  },
  render: function render(h) {
    return this.renderVN(h);
  }
});
/* define-vxe-component end */