zartui 0.1.113 → 3.0.1

package/es/media-picker/index.js

@@ -1,992 +0,0 @@
-// Utils
-import { createNamespace, isDef, isPromise, noop } from '../utils'; // Types
-
-import { MediaAddType, MediaType, Media, MediaUploadStatus } from "./type";
-import { checkWatermarkConfigSupported, CompressOptions, file2DataURL, ImageProcessor, ResizeOptions, WatermarkOptions } from "@egova/media"; // 单个文件最大限制，单位为M（目前限制是100M）
-
-var FILE_SIZE_LIMIT = 100;
-
-var _createNamespace = createNamespace('media-picker'),
-    createComponent = _createNamespace[0],
-    bem = _createNamespace[1]; // import components
-
-
-import Toast from '../toast';
-import ImagePreview from "../image-preview"; // Images
-
-import TakePhotoIcon from "./image/TakePhotoIcon";
-import PickPhotoIcon from "./image/PickPhotoIcon";
-import TakeVideoIcon from "./image/TakeVideoIcon";
-import TakeAudioIcon from "./image/TakeAudioIcon";
-import PickFileIcon from "./image/PickFileIcon";
-import DeleteIcon from "./image/DeleteIcon";
-import DefaultVideoIcon from "./image/DefaultVideoIcon";
-import DefaultAudioIcon from "./image/DefaultAudioIcon";
-import DefaultFileIcon from "./image/DefaultFileIcon";
-import { getFileUniqueCode, getUniqueFileName, isAudioType, isImageType, isVideoType } from "./media-util";
-import Icon from "../icon";
-import Loading from "../loading";
-export default createComponent({
-  props: {
-    disabled: Boolean,
-    title: {
-      type: String,
-      default: '添加附件'
-    },
-    showTitle: {
-      type: Boolean,
-      default: false
-    },
-    mediaList: {
-      type: Array,
-      default: function _default() {
-        return [];
-      }
-    },
-    // 图片压缩后的最大边长
-    maxImageSideLength: {
-      type: Number,
-      default: 1920
-    },
-    // 单个图片文件大小限制（本单位为KB，默认最大1M）
-    maxImageFileSize: {
-      type: Number,
-      default: 1024
-    },
-    // 单个文件大小限制（本单位为KB，默认最大1M）
-    maxFileSize: {
-      type: Number,
-      default: FILE_SIZE_LIMIT * 1024
-    },
-
-    /**
-     * {
-     *  maxImageSideLength,
-     *  address,
-     *  humanName,
-     *  projectName,
-     *  watermarkConfigString
-     * (http://faq.egova.com.cn:7777/redmine/projects/redmine/wiki/%E6%8B%8D%E7%85%A7%E6%B0%B4%E5%8D%B0%E9%85%8D%E7%BD%AE)
-     * }
-     */
-    watermarkOptions: {
-      type: Object,
-      default: function _default() {
-        return null;
-      }
-    },
-    maxMediaCount: {
-      type: Number,
-      default: Number.MAX_VALUE
-    },
-    maxImageCount: {
-      type: Number,
-      default: Number.MAX_VALUE
-    },
-    maxAudioCount: {
-      type: Number,
-      default: Number.MAX_VALUE
-    },
-    maxVideoCount: {
-      type: Number,
-      default: Number.MAX_VALUE
-    },
-    maxFileCount: {
-      type: Number,
-      default: Number.MAX_VALUE
-    },
-    allowTakePhoto: {
-      type: Boolean,
-      default: true
-    },
-    allowPickPhoto: {
-      type: Boolean,
-      default: true
-    },
-    allowTakeVideo: {
-      type: Boolean,
-      default: false
-    },
-    allowPickVideo: {
-      type: Boolean,
-      default: false
-    },
-    allowTakeAudio: {
-      type: Boolean,
-      default: false
-    },
-    allowPickAudio: {
-      type: Boolean,
-      default: false
-    },
-    allowPickFile: {
-      type: Boolean,
-      default: false
-    },
-    // 预览函数（返回true时不再执行默认行为）
-    // 参数：media,index
-    preview: Function,
-    // 点击按钮事件（返回true时不再执行默认行为）
-    // 参数：mediaType,mediaAddType
-    mediaPickAction: Function,
-    // 文件读取完成后的回调函数，获取到对应的 media 对象
-    afterRead: Function,
-    // 文件读取前的回调函数，返回 false 可终止文件读取，支持返回 Promise
-    beforeRead: Function,
-    // 文件删除前的回调函数，返回 false 可终止文件读取，支持返回 Promise
-    beforeDelete: Function
-  },
-  model: {
-    prop: 'mediaList'
-  },
-  data: function data() {
-    return {
-      videoOptionsVisible: false,
-      audioOptionsVisible: false,
-      actionVisible: false,
-      mediaPlayerVisible: false,
-      mediaTypeToPlay: '',
-      mediaUrlToPlay: ''
-    };
-  },
-  computed: {
-    imageList: function imageList() {
-      return this.mediaList.filter(function (media) {
-        return media.type === MediaType.PHOTO;
-      });
-    },
-    actionOptions: function actionOptions() {
-      var _this = this;
-
-      if (this.videoOptionsVisible) {
-        return [{
-          name: '拍摄',
-          func: function func() {
-            _this.mediaPick(MediaType.VIDEO, MediaAddType.TAKE);
-          }
-        }, {
-          name: '视频文件',
-          func: function func() {
-            _this.mediaPick(MediaType.VIDEO, MediaAddType.PICK);
-          }
-        }];
-      } else if (this.audioOptionsVisible) {
-        return [{
-          name: '录音',
-          func: function func() {
-            _this.mediaPick(MediaType.AUDIO, MediaAddType.TAKE);
-          }
-        }, {
-          name: '音频文件',
-          func: function func() {
-            _this.mediaPick(MediaType.AUDIO, MediaAddType.PICK);
-          }
-        }];
-      }
-    }
-  },
-  methods: {
-    mediaPick: function mediaPick(mediaType, mediaAddType) {
-      if (this.disabled) {
-        return;
-      }
-
-      if (!this.checkFileCountBeforeAdd(mediaType)) {
-        return;
-      }
-
-      if (this.mediaPickAction && this.mediaPickAction(mediaType, mediaAddType)) {
-        return;
-      }
-
-      var _this$$refs = this.$refs,
-          cameraInput = _this$$refs.cameraInput,
-          imageInput = _this$$refs.imageInput,
-          camcorderInput = _this$$refs.camcorderInput,
-          videoFileInput = _this$$refs.videoFileInput,
-          audioRecorderInput = _this$$refs.audioRecorderInput,
-          audioFileInput = _this$$refs.audioFileInput,
-          fileInput = _this$$refs.fileInput;
-
-      if (mediaType === MediaType.PHOTO) {
-        if (mediaAddType === MediaAddType.TAKE) {
-          this.triggerHiddenInput(cameraInput);
-        } else if (mediaAddType === MediaAddType.PICK) {
-          this.triggerHiddenInput(imageInput);
-        }
-      } else if (mediaType === MediaType.VIDEO) {
-        if (mediaAddType === MediaAddType.TAKE) {
-          this.triggerHiddenInput(camcorderInput);
-        } else if (mediaAddType === MediaAddType.PICK) {
-          this.triggerHiddenInput(videoFileInput);
-        } else if (mediaAddType === MediaAddType.TAKE_AND_PICK) {
-          this.actionVisible = true;
-          this.videoOptionsVisible = true;
-          this.audioOptionsVisible = false;
-        }
-      } else if (mediaType === MediaType.AUDIO) {
-        if (mediaAddType === MediaAddType.TAKE) {
-          this.triggerHiddenInput(audioRecorderInput);
-        } else if (mediaAddType === MediaAddType.PICK) {
-          this.triggerHiddenInput(audioFileInput);
-        } else if (mediaAddType === MediaAddType.TAKE_AND_PICK) {
-          this.actionVisible = true;
-          this.videoOptionsVisible = false;
-          this.audioOptionsVisible = true;
-        }
-      } else if (mediaType === MediaType.FILE) {
-        this.triggerHiddenInput(fileInput);
-      }
-    },
-    triggerHiddenInput: function triggerHiddenInput(ref) {
-      if (ref && ref instanceof HTMLInputElement) {
-        ref.click();
-      }
-    },
-
-    /**
-     * 清空value，避免添加相同图片时 change 事件不触发：https://stackoverflow.com/a/54125788/1263423
-     * @param mediaType
-     * @param mediaAddType
-     */
-    resetInput: function resetInput(mediaType, mediaAddType) {
-      var _this$$refs2 = this.$refs,
-          cameraInput = _this$$refs2.cameraInput,
-          imageInput = _this$$refs2.imageInput,
-          camcorderInput = _this$$refs2.camcorderInput,
-          videoFileInput = _this$$refs2.videoFileInput,
-          audioRecorderInput = _this$$refs2.audioRecorderInput,
-          audioFileInput = _this$$refs2.audioFileInput,
-          fileInput = _this$$refs2.fileInput;
-
-      if (mediaType === MediaType.PHOTO) {
-        if (mediaAddType === MediaAddType.TAKE) {
-          cameraInput.value = '';
-        } else if (mediaAddType === MediaAddType.PICK) {
-          imageInput.value = '';
-        }
-      } else if (mediaType === MediaType.VIDEO) {
-        if (mediaAddType === MediaAddType.TAKE) {
-          camcorderInput.value = '';
-        } else if (mediaAddType === MediaAddType.PICK) {
-          videoFileInput.value = '';
-        }
-      } else if (mediaType === MediaType.AUDIO) {
-        if (mediaAddType === MediaAddType.TAKE) {
-          audioRecorderInput.value = '';
-        } else if (mediaAddType === MediaAddType.PICK) {
-          audioFileInput.value = '';
-        }
-      } else if (mediaType === MediaType.FILE) {
-        fileInput.value = '';
-      }
-    },
-    handleInputFiles: function handleInputFiles(event) {
-      var _this2 = this;
-
-      var files = event.target.files;
-
-      if (!files || files.length === 0) {
-        return;
-      }
-
-      files = this.filterValidFiles(files);
-
-      if (files.length === 0) {
-        return;
-      }
-
-      if (!this.checkFileCountAfterAdd(files)) {
-        return;
-      }
-
-      if (this.beforeRead) {
-        var response = this.beforeRead(files);
-
-        if (!response) {
-          return;
-        }
-
-        if (isPromise(response)) {
-          response.then(function (data) {
-            if (data) {
-              _this2.readFiles(data);
-            } else {
-              _this2.readFiles(files);
-            }
-          });
-          return;
-        }
-      }
-
-      this.readFiles(files);
-    },
-    readFiles: function readFiles(files) {
-      var _this3 = this;
-
-      // 处理非图片
-      var notImages = files.filter(function (f) {
-        return !isImageType(f);
-      }).map(function (f) {
-        return _this3.transformNotImageFile(f);
-      });
-      var newMedias = [];
-
-      if (notImages.length > 0) {
-        newMedias = newMedias.concat(notImages);
-      } // 处理图片并合并
-
-
-      var imageFiles = files.filter(function (f) {
-        return isImageType(f);
-      });
-      var promise;
-
-      if (imageFiles.length === 0) {
-        promise = Promise.resolve();
-      } else {
-        promise = this.transformImageFiles(imageFiles);
-      }
-
-      promise.then(function (medias) {
-        if (medias && medias.length > 0) {
-          newMedias = newMedias.concat(medias);
-        }
-      }).finally(function () {
-        _this3.$emit('input', [].concat(_this3.mediaList, newMedias));
-
-        if (_this3.afterRead) {
-          _this3.afterRead(newMedias);
-        }
-      });
-    },
-
-    /**
-     * 选择多媒体前进行数量检查
-     */
-    checkFileCountBeforeAdd: function checkFileCountBeforeAdd(mediaType) {
-      if (this.mediaList.length === this.maxMediaCount) {
-        Toast.fail("\u5DF2\u8FBE\u5230\u6587\u4EF6\u6700\u5927\u6570\u91CF\u9650\u5236");
-        return false;
-      }
-
-      if (mediaType === MediaType.PHOTO && this.mediaList.filter(function (media) {
-        return media.type === MediaType.PHOTO;
-      }).length > this.maxImageCount) {
-        Toast.fail("\u5DF2\u8FBE\u5230\u56FE\u7247\u6700\u5927\u6570\u91CF\u9650\u5236");
-        return false;
-      }
-
-      if (mediaType === MediaType.VIDEO && this.mediaList.filter(function (media) {
-        return media.type === MediaType.VIDEO;
-      }).length > this.maxVideoCount) {
-        Toast.fail("\u5DF2\u8FBE\u5230\u89C6\u9891\u6700\u5927\u6570\u91CF\u9650\u5236");
-        return false;
-      }
-
-      if (mediaType === MediaType.AUDIO && this.mediaList.filter(function (media) {
-        return media.type === MediaType.AUDIO;
-      }).length > this.maxAudioCount) {
-        Toast.fail("\u5DF2\u8FBE\u5230\u5F55\u97F3\u6700\u5927\u6570\u91CF\u9650\u5236");
-        return false;
-      }
-
-      return true;
-    },
-
-    /**
-     * 选择多媒体后进行数量检查
-     */
-    checkFileCountAfterAdd: function checkFileCountAfterAdd(files) {
-      if (this.mediaList.length + files.length > this.maxMediaCount) {
-        Toast.fail("\u6700\u591A\u53EA\u80FD\u4E0A\u4F20" + this.maxMediaCount + "\u4E2A\u6587\u4EF6");
-        return false;
-      }
-
-      if (this.mediaList.filter(function (media) {
-        return media.type === MediaType.PHOTO;
-      }).length + files.filter(function (media) {
-        return isImageType(media);
-      }).length > this.maxImageCount) {
-        Toast.fail("\u6700\u591A\u53EA\u80FD\u4E0A\u4F20" + this.maxImageCount + "\u5F20\u56FE\u7247");
-        return false;
-      }
-
-      if (this.mediaList.filter(function (media) {
-        return media.type === MediaType.VIDEO;
-      }).length + files.filter(function (media) {
-        return isVideoType(media);
-      }).length > this.maxVideoCount) {
-        Toast.fail("\u6700\u591A\u53EA\u80FD\u4E0A\u4F20" + this.maxVideoCount + "\u4E2A\u89C6\u9891");
-        return false;
-      }
-
-      if (this.mediaList.filter(function (media) {
-        return media.type === MediaType.AUDIO;
-      }).length + files.filter(function (media) {
-        return isAudioType(media);
-      }).length > this.maxAudioCount) {
-        Toast.fail("\u6700\u591A\u53EA\u80FD\u4E0A\u4F20" + this.maxAudioCount + "\u4E2A\u5F55\u97F3");
-        return false;
-      }
-
-      return true;
-    },
-    filterValidFiles: function filterValidFiles(files) {
-      var validFiles = [];
-
-      for (var i = 0; i < files.length; i++) {
-        var file = files[i];
-
-        if (file.size > this.maxFileSize * 1024) {
-          Toast.fail("\u8BF7\u52FF\u6DFB\u52A0\u5927\u4E8E" + this.maxFileSize + "K\u7684\u6587\u4EF6");
-          return validFiles;
-        }
-
-        if (this.checkFileExist(file)) {
-          Toast.fail('请勿重复添加文件');
-          return validFiles;
-        }
-
-        validFiles.push(file);
-      }
-
-      return validFiles;
-    },
-
-    /**
-     * 转换图片文件，压缩、加水印，返回Media格式的图片
-     * @param files 图片文件
-     * @return {Promise<[Media]>}
-     */
-    transformImageFiles: function transformImageFiles(files) {
-      var _this4 = this;
-
-      var promisesTodo = [];
-      var resizeOptions = new ResizeOptions(this.maxImageSideLength);
-      var compressOptions = new CompressOptions(this.maxImageFileSize);
-
-      var _loop = function _loop(i) {
-        var file = files[i];
-        var watermarkEnabled = _this4.watermarkOptions && _this4.watermarkOptions.watermarkConfigString && checkWatermarkConfigSupported(_this4.watermarkOptions.watermarkConfigString);
-        var watermarkOpt = void 0;
-
-        if (watermarkEnabled) {
-          watermarkOpt = new WatermarkOptions({
-            enabled: true,
-            watermarkConfigString: watermarkEnabled ? _this4.watermarkOptions.watermarkConfigString : '',
-            context: {
-              address: _this4.watermarkOptions.address || "",
-              humanName: _this4.watermarkOptions.humanName || "",
-              projectName: _this4.watermarkOptions.projectName || "",
-              watermarkTime: new Date()
-            }
-          });
-        } else {
-          watermarkOpt = new WatermarkOptions({
-            enabled: false
-          });
-        }
-
-        var promise = new ImageProcessor(file, resizeOptions, watermarkOpt, compressOptions).process().then(function (f) {
-          if (!f) {
-            return Promise.resolve();
-          }
-
-          return file2DataURL(f).then(function (base64) {
-            var uniqueFileName = getUniqueFileName(f, 'jpg');
-            return Promise.resolve({
-              showSrc: base64,
-              type: MediaType.PHOTO,
-              file: new File([f], uniqueFileName, {
-                lastModified: f.lastModified,
-                type: f.type
-              }),
-              //需要以原始file的信息作为唯一标识
-              uniqueCode: getFileUniqueCode(file),
-              lastModified: f.lastModified,
-              fileSize: f.size,
-              deletable: true,
-              status: '',
-              message: ''
-            });
-          });
-        });
-        promisesTodo.push(promise);
-      };
-
-      for (var i = 0; i < files.length; i++) {
-        _loop(i);
-      }
-
-      Toast.loading({
-        message: '处理中...',
-        forbidClick: true,
-        duration: 0
-      });
-      return Promise.all(promisesTodo).then(function (medias) {
-        return medias.filter(function (media) {
-          return !!media;
-        });
-      }).finally(function () {
-        Toast.clear();
-      });
-    },
-
-    /**
-     * 转换非图片文件
-     * @param {File} f 非图片文件
-     * @return {Media} Media格式的文件
-     */
-    transformNotImageFile: function transformNotImageFile(f) {
-      var suffix = '';
-      var type = MediaType.FILE;
-
-      if (isAudioType(f)) {
-        type = MediaType.AUDIO;
-        suffix = 'mp3';
-      } else if (isVideoType(f)) {
-        type = MediaType.VIDEO;
-        suffix = 'mp4';
-      } else {
-        type = MediaType.FILE;
-      }
-
-      var uniqueFileName = getUniqueFileName(f, suffix);
-      return {
-        type: type,
-        file: new File([f], uniqueFileName, {
-          lastModified: f.lastModified,
-          type: f.type
-        }),
-        uniqueCode: getFileUniqueCode(f),
-        lastModified: f.lastModified,
-        fileSize: f.size,
-        deletable: true,
-        status: '',
-        message: ''
-      };
-    },
-
-    /**
-     * 检查文件是否重复添加
-     */
-    checkFileExist: function checkFileExist(file) {
-      return this.mediaList.some(function (media) {
-        return media.uniqueCode === getFileUniqueCode(file);
-      });
-    },
-
-    /**
-     * 点击预览
-     */
-    previewMedia: function previewMedia(media, index) {
-      if (this.preview && this.preview(media, index)) {
-        return;
-      }
-
-      if (media.type === MediaType.PHOTO) {
-        var imageIndex = this.imageList.indexOf(media);
-        ImagePreview({
-          images: this.imageList.map(function (image) {
-            return {
-              url: image.showSrc
-            };
-          }),
-          startPosition: imageIndex
-        });
-      } else if (media.type === MediaType.AUDIO || media.type === MediaType.VIDEO) {
-        if (!media.file && !media.url) {
-          Toast('文件参数缺失');
-        } else {
-          this.mediaTypeToPlay = media.type;
-          this.mediaUrlToPlay = media.url || (URL || webkitURL).createObjectURL(media.file); // this.mediaUrlToPlay = 'http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4'
-
-          this.mediaPlayerVisible = true;
-        }
-      } else if (media.type === MediaType.FILE) {
-        Toast('暂不支持此类文件的预览');
-      }
-    },
-    onDelete: function onDelete(media, index) {
-      var _this5 = this;
-
-      if (this.beforeDelete) {
-        var response = this.beforeDelete(media);
-
-        if (!response) {
-          return;
-        }
-
-        if (isPromise(response)) {
-          response.then(function () {
-            _this5.deleteMedia(media, index);
-          });
-          return;
-        }
-      }
-
-      this.deleteMedia(media, index);
-    },
-    deleteMedia: function deleteMedia(media, index) {
-      var list = this.mediaList.slice(0);
-      list.splice(index, 1);
-      this.$emit('input', list);
-      this.$emit('delete', media, index);
-    },
-    hiddenInput: function hiddenInput() {
-      var _this6 = this;
-
-      var h = this.$createElement;
-      return [h("input", {
-        "attrs": {
-          "type": 'file',
-          "accept": 'image/*',
-          "multiple": true,
-          "capture": 'environment'
-        },
-        "ref": 'cameraInput',
-        "on": {
-          "change": this.handleInputFiles,
-          "click": function click() {
-            return _this6.resetInput(MediaType.PHOTO, MediaAddType.TAKE);
-          }
-        },
-        "class": bem('hidden')
-      }), h("input", {
-        "attrs": {
-          "type": 'file',
-          "accept": 'image/*,image/exact',
-          "multiple": true
-        },
-        "ref": 'imageInput',
-        "on": {
-          "change": this.handleInputFiles,
-          "click": function click() {
-            return _this6.resetInput(MediaType.PHOTO, MediaAddType.PICK);
-          }
-        },
-        "class": bem('hidden')
-      }), h("input", {
-        "attrs": {
-          "type": 'file',
-          "accept": 'video/*',
-          "capture": 'environment'
-        },
-        "ref": 'camcorderInput',
-        "on": {
-          "change": this.handleInputFiles,
-          "click": function click() {
-            return _this6.resetInput(MediaType.VIDEO, MediaAddType.TAKE);
-          }
-        },
-        "class": bem('hidden')
-      }), h("input", {
-        "attrs": {
-          "type": 'file',
-          "accept": 'video/*'
-        },
-        "ref": 'videoFileInput',
-        "on": {
-          "change": this.handleInputFiles,
-          "click": function click() {
-            return _this6.resetInput(MediaType.VIDEO, MediaAddType.PICK);
-          }
-        },
-        "class": bem('hidden')
-      }), h("input", {
-        "attrs": {
-          "type": 'file',
-          "accept": 'audio/mpeg',
-          "capture": 'nonce'
-        },
-        "ref": 'audioRecorderInput',
-        "on": {
-          "change": this.handleInputFiles,
-          "click": function click() {
-            return _this6.resetInput(MediaType.AUDIO, MediaAddType.TAKE);
-          }
-        },
-        "class": bem('hidden')
-      }), h("input", {
-        "attrs": {
-          "type": 'file',
-          "accept": 'audio/mpeg'
-        },
-        "ref": 'audioFileInput',
-        "on": {
-          "change": this.handleInputFiles,
-          "click": function click() {
-            return _this6.resetInput(MediaType.AUDIO, MediaAddType.PICK);
-          }
-        },
-        "class": bem('hidden')
-      }), h("input", {
-        "attrs": {
-          "type": 'file',
-          "accept": '*/*'
-        },
-        "ref": 'fileInput',
-        "on": {
-          "change": this.handleInputFiles,
-          "click": function click() {
-            return _this6.resetInput(MediaType.FILE, MediaAddType.PICK);
-          }
-        },
-        "class": bem('hidden')
-      })];
-    },
-    renderIcon: function renderIcon(mediaType, mediaAddType) {
-      var _this7 = this;
-
-      var h = this.$createElement;
-
-      if (mediaType === MediaType.PHOTO) {
-        if (mediaAddType === MediaAddType.TAKE) {
-          return h(TakePhotoIcon, {
-            "class": bem('button'),
-            "on": {
-              "click": function click() {
-                return _this7.mediaPick(mediaType, mediaAddType);
-              }
-            }
-          });
-        } else if (mediaAddType === MediaAddType.PICK) {
-          return h(PickPhotoIcon, {
-            "class": bem('button'),
-            "on": {
-              "click": function click() {
-                return _this7.mediaPick(mediaType, mediaAddType);
-              }
-            }
-          });
-        }
-      } else if (mediaType === MediaType.VIDEO) {
-        return h(TakeVideoIcon, {
-          "class": bem('button'),
-          "on": {
-            "click": function click() {
-              return _this7.mediaPick(mediaType, mediaAddType);
-            }
-          }
-        });
-      } else if (mediaType === MediaType.AUDIO) {
-        return h(TakeAudioIcon, {
-          "class": bem('button'),
-          "on": {
-            "click": function click() {
-              return _this7.mediaPick(mediaType, mediaAddType);
-            }
-          }
-        });
-      } else if (mediaType === MediaType.FILE) {
-        return h(PickFileIcon, {
-          "class": bem('button'),
-          "on": {
-            "click": function click() {
-              return _this7.mediaPick(mediaType, mediaAddType);
-            }
-          }
-        });
-      }
-    },
-    renderButton: function renderButton(mediaType, mediaAddType) {
-      var h = this.$createElement;
-      var label = '';
-
-      if (mediaType === MediaType.PHOTO) {
-        if (mediaAddType === MediaAddType.TAKE) {
-          label = '拍照';
-        } else if (mediaAddType === MediaAddType.PICK) {
-          label = '照片';
-        }
-      } else if (mediaType === MediaType.VIDEO) {
-        label = '摄像';
-      } else if (mediaType === MediaType.AUDIO) {
-        label = '录音';
-      } else if (mediaType === MediaType.FILE) {
-        label = '文档';
-      }
-
-      return h("div", {
-        "class": bem('box')
-      }, [this.renderIcon(mediaType, mediaAddType), h("div", {
-        "class": bem('label')
-      }, [label])]);
-    },
-    renderButtons: function renderButtons() {
-      var buttons = [];
-
-      if (this.allowTakePhoto) {
-        buttons.push(this.renderButton(MediaType.PHOTO, MediaAddType.TAKE));
-      }
-
-      if (this.allowPickPhoto) {
-        buttons.push(this.renderButton(MediaType.PHOTO, MediaAddType.PICK));
-      }
-
-      if (this.allowTakeVideo || this.allowPickVideo) {
-        var addType = MediaAddType.TAKE_AND_PICK;
-
-        if (!this.allowTakeVideo) {
-          addType = MediaAddType.PICK;
-        } else if (!this.allowPickVideo) {
-          addType = MediaAddType.TAKE;
-        }
-
-        buttons.push(this.renderButton(MediaType.VIDEO, addType));
-      }
-
-      if (this.allowTakeAudio || this.allowPickAudio) {
-        var _addType = MediaAddType.TAKE_AND_PICK;
-
-        if (!this.allowTakeAudio) {
-          _addType = MediaAddType.PICK;
-        } else if (!this.allowPickAudio) {
-          _addType = MediaAddType.TAKE;
-        }
-
-        buttons.push(this.renderButton(MediaType.AUDIO, _addType));
-      }
-
-      if (this.allowPickFile) {
-        buttons.push(this.renderButton(MediaType.FILE, MediaAddType.PICK));
-      }
-
-      return buttons;
-    },
-    genThumbnailMask: function genThumbnailMask(media) {
-      var h = this.$createElement;
-      var status = media.status,
-          message = media.message;
-
-      if (status === MediaUploadStatus.UPLOADING || status === MediaUploadStatus.FAILED) {
-        var MaskIcon = status === MediaUploadStatus.FAILED ? h(Icon, {
-          "attrs": {
-            "name": "close"
-          },
-          "class": bem('mask-icon')
-        }) : h(Loading, {
-          "class": bem('loading')
-        });
-        var showMessage = isDef(message) && message !== '';
-        return h("div", {
-          "class": bem('mask')
-        }, [MaskIcon, showMessage && h("div", {
-          "class": bem('mask-message')
-        }, [message])]);
-      }
-    },
-
-    /**
-     * 多媒体对应展示的缩略图
-     */
-    renderMediaThumbnail: function renderMediaThumbnail(media) {
-      var h = this.$createElement;
-
-      if (media.showSrc) {
-        return h("zt-image", {
-          "attrs": {
-            "src": media.showSrc,
-            "fit": 'fill',
-            "radius": '4'
-          }
-        });
-      } else if (media.type === MediaType.VIDEO) {
-        return h(DefaultVideoIcon, {
-          "class": bem('thumbnail')
-        });
-      } else if (media.type === MediaType.AUDIO) {
-        return h(DefaultAudioIcon, {
-          "class": bem('thumbnail')
-        });
-      } else if (media.type === MediaType.FILE) {
-        return h(DefaultFileIcon, {
-          "class": bem('thumbnail')
-        });
-      }
-    },
-    renderMediaList: function renderMediaList() {
-      var _this8 = this;
-
-      var h = this.$createElement;
-      return this.mediaList.map(function (media, index) {
-        var showDelete = media.deletable && media.status !== MediaUploadStatus.UPLOADING;
-        var deleteIcon = showDelete && h(DeleteIcon, {
-          "class": bem('delete'),
-          "on": {
-            "click": function click(event) {
-              event.stopPropagation();
-
-              _this8.onDelete(media, index);
-            }
-          }
-        });
-        return h("zt-grid-item", {
-          "key": media.uniqueCode,
-          "on": {
-            "click": function click() {
-              return _this8.previewMedia(media, index);
-            }
-          }
-        }, [_this8.renderMediaThumbnail(media), _this8.genThumbnailMask(media), deleteIcon]);
-      });
-    },
-    selectAction: function selectAction(action) {
-      this.actionVisible = false;
-      action.func && action.func();
-    }
-  },
-  render: function render() {
-    var _this9 = this;
-
-    var h = arguments[0];
-    var title = this.showTitle && h("div", {
-      "class": bem('title')
-    }, [this.title]);
-    return h("div", {
-      "class": bem()
-    }, [title, this.hiddenInput(), h("zt-media-player", {
-      "attrs": {
-        "mediaType": this.mediaTypeToPlay,
-        "mediaUrl": this.mediaUrlToPlay
-      },
-      "model": {
-        value: _this9.mediaPlayerVisible,
-        callback: function callback($$v) {
-          _this9.mediaPlayerVisible = $$v;
-        }
-      }
-    }), h("zt-action-sheet", {
-      "attrs": {
-        "actions": this.actionOptions,
-        "title": '请选择',
-        "cancel-text": '取消',
-        "close-on-click-action": true
-      },
-      "on": {
-        "select": this.selectAction
-      },
-      "model": {
-        value: _this9.actionVisible,
-        callback: function callback($$v) {
-          _this9.actionVisible = $$v;
-        }
-      }
-    }), h("div", {
-      "class": bem('line')
-    }, [this.renderButtons()]), h("zt-grid", {
-      "directives": [{
-        name: "show",
-        value: this.mediaList.length
-      }],
-      "attrs": {
-        "column-num": '3',
-        "border": false,
-        "square": true,
-        "gutter": '4'
-      },
-      "class": bem('grid')
-    }, [this.renderMediaList()])]);
-  }
-});