index.js 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. import _extends from "@babel/runtime/helpers/esm/extends";
  2. import { use } from '../utils';
  3. var _use = use('uploader'),
  4. sfc = _use[0],
  5. bem = _use[1];
  6. export default sfc({
  7. inheritAttrs: false,
  8. props: {
  9. disabled: Boolean,
  10. beforeRead: Function,
  11. afterRead: Function,
  12. accept: {
  13. type: String,
  14. "default": 'image/*'
  15. },
  16. resultType: {
  17. type: String,
  18. "default": 'dataUrl'
  19. },
  20. maxSize: {
  21. type: Number,
  22. "default": Number.MAX_VALUE
  23. }
  24. },
  25. computed: {
  26. detail: function detail() {
  27. return {
  28. name: this.$attrs.name || ''
  29. };
  30. }
  31. },
  32. methods: {
  33. onChange: function onChange(event) {
  34. var _this = this;
  35. var files = event.target.files;
  36. if (this.disabled || !files.length) {
  37. return;
  38. }
  39. files = files.length === 1 ? files[0] : [].slice.call(files, 0);
  40. if (!files || this.beforeRead && !this.beforeRead(files, this.detail)) {
  41. this.resetInput();
  42. return;
  43. }
  44. if (Array.isArray(files)) {
  45. Promise.all(files.map(this.readFile)).then(function (contents) {
  46. var oversize = false;
  47. var payload = files.map(function (file, index) {
  48. if (file.size > _this.maxSize) {
  49. oversize = true;
  50. }
  51. return {
  52. file: files[index],
  53. content: contents[index]
  54. };
  55. });
  56. _this.onAfterRead(payload, oversize);
  57. });
  58. } else {
  59. this.readFile(files).then(function (content) {
  60. _this.onAfterRead({
  61. file: files,
  62. content: content
  63. }, files.size > _this.maxSize);
  64. });
  65. }
  66. },
  67. readFile: function readFile(file) {
  68. var _this2 = this;
  69. return new Promise(function (resolve) {
  70. var reader = new FileReader();
  71. reader.onload = function (event) {
  72. resolve(event.target.result);
  73. };
  74. if (_this2.resultType === 'dataUrl') {
  75. reader.readAsDataURL(file);
  76. } else if (_this2.resultType === 'text') {
  77. reader.readAsText(file);
  78. }
  79. });
  80. },
  81. onAfterRead: function onAfterRead(files, oversize) {
  82. if (oversize) {
  83. this.$emit('oversize', files);
  84. } else {
  85. this.afterRead && this.afterRead(files, this.detail);
  86. }
  87. this.resetInput();
  88. },
  89. resetInput: function resetInput() {
  90. if (this.$refs.input) {
  91. this.$refs.input.value = '';
  92. }
  93. }
  94. },
  95. render: function render(h) {
  96. var accept = this.accept,
  97. disabled = this.disabled;
  98. return h("div", {
  99. "class": bem()
  100. }, [this.slots(), h("input", {
  101. "attrs": _extends({}, this.$attrs, {
  102. "type": "file",
  103. "accept": accept,
  104. "disabled": disabled
  105. }),
  106. "ref": "input",
  107. "class": bem('input'),
  108. "on": {
  109. "change": this.onChange
  110. }
  111. })]);
  112. }
  113. });