SkuImgUploader.js 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. // Utils
  2. import { createNamespace } from '../../utils'; // Components
  3. import Uploader from '../../uploader';
  4. var namespace = createNamespace('sku-img-uploader');
  5. var createComponent = namespace[0];
  6. var t = namespace[2];
  7. export default createComponent({
  8. props: {
  9. value: String,
  10. uploadImg: Function,
  11. maxSize: {
  12. type: Number,
  13. default: 6
  14. }
  15. },
  16. data: function data() {
  17. return {
  18. fileList: []
  19. };
  20. },
  21. watch: {
  22. value: function value(val) {
  23. if (val) {
  24. this.fileList = [{
  25. url: val,
  26. isImage: true
  27. }];
  28. } else {
  29. this.fileList = [];
  30. }
  31. }
  32. },
  33. methods: {
  34. afterReadFile: function afterReadFile(file) {
  35. var _this = this;
  36. file.status = 'uploading';
  37. file.message = t('uploading');
  38. this.uploadImg(file.file, file.content).then(function (img) {
  39. file.status = 'done';
  40. _this.$emit('input', img);
  41. }).catch(function () {
  42. file.status = 'failed';
  43. file.message = t('fail');
  44. });
  45. },
  46. onOversize: function onOversize() {
  47. this.$toast(t('oversize', this.maxSize));
  48. },
  49. onDelete: function onDelete() {
  50. this.$emit('input', '');
  51. }
  52. },
  53. render: function render() {
  54. var _this2 = this;
  55. var h = arguments[0];
  56. return h(Uploader, {
  57. "attrs": {
  58. "maxCount": 1,
  59. "afterRead": this.afterReadFile,
  60. "maxSize": this.maxSize * 1024 * 1024
  61. },
  62. "on": {
  63. "oversize": this.onOversize,
  64. "delete": this.onDelete
  65. },
  66. "model": {
  67. value: _this2.fileList,
  68. callback: function callback($$v) {
  69. _this2.fileList = $$v;
  70. }
  71. }
  72. });
  73. }
  74. });