通用评论

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _modal = require("antd/es/modal");
  6. var _modal2 = _interopRequireDefault(_modal);
  7. var _spin = require("antd/es/spin");
  8. var _spin2 = _interopRequireDefault(_spin);
  9. var _upload = require("antd/es/upload");
  10. var _upload2 = _interopRequireDefault(_upload);
  11. var _icon = require("antd/es/icon");
  12. var _icon2 = _interopRequireDefault(_icon);
  13. var _message2 = require("antd/es/message");
  14. var _message3 = _interopRequireDefault(_message2);
  15. var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
  16. require("antd/es/modal/style");
  17. require("antd/es/spin/style");
  18. require("antd/es/upload/style");
  19. require("antd/es/icon/style");
  20. require("antd/es/message/style");
  21. var _react = require("react");
  22. var _react2 = _interopRequireDefault(_react);
  23. var _reactIntlUniversal = require("react-intl-universal");
  24. var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
  25. var _constant = require("../../constant");
  26. var _Comment = require("../../Comment");
  27. var _Comment2 = _interopRequireDefault(_Comment);
  28. require("./Upload.css");
  29. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  30. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  31. function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
  32. function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
  33. var App = function (_React$Component) {
  34. _inherits(App, _React$Component);
  35. function App(props) {
  36. _classCallCheck(this, App);
  37. var _this = _possibleConstructorReturn(this, (App.__proto__ || Object.getPrototypeOf(App)).call(this, props));
  38. _this.state = {
  39. previewVisible: false,
  40. previewImage: "",
  41. loading: false
  42. };
  43. _this.handleCancel = _this.handleCancel.bind(_this);
  44. _this.handlePreview = _this.handlePreview.bind(_this);
  45. _this.handleChange = _this.handleChange.bind(_this);
  46. _this.customRequest = _this.customRequest.bind(_this);
  47. _this.handleCloseClick = _this.handleCloseClick.bind(_this);
  48. _this.onImgLoad = _this.onImgLoad.bind(_this);
  49. return _this;
  50. }
  51. _createClass(App, [{
  52. key: "componentDidMount",
  53. value: function componentDidMount() {
  54. this.props.app.sOssSts();
  55. if (this.props.onRef) {
  56. this.props.onRef(this);
  57. }
  58. }
  59. }, {
  60. key: "onImgLoad",
  61. value: function onImgLoad() {
  62. this.setState({
  63. loading: false
  64. });
  65. }
  66. }, {
  67. key: "handleCancel",
  68. value: function handleCancel() {
  69. this.setState({ previewVisible: false });
  70. }
  71. }, {
  72. key: "handlePreview",
  73. value: function handlePreview(file) {
  74. this.setState({
  75. previewImage: file.url || file.thumbUrl,
  76. previewVisible: true
  77. });
  78. }
  79. }, {
  80. key: "handleChange",
  81. value: function handleChange(_ref) {
  82. var fileList = _ref.fileList;
  83. this.props.onChangeFileList(fileList);
  84. }
  85. }, {
  86. key: "customRequest",
  87. value: function customRequest(info) {
  88. var _this2 = this;
  89. var file = info.file;
  90. info.onProgress({ percent: 10 });
  91. var reader = new FileReader();
  92. reader.readAsDataURL(info.file);
  93. reader.onloadend = function () {
  94. info.onProgress({ percent: 20 });
  95. // DRIVER_LICENSE_PATH oss 的存储路径位置
  96. _this2.props.app.UploadToOss(_this2.props.app.oss, _constant.DRIVER_LICENSE_PATH, file).then(function (data) {
  97. info.onProgress({ percent: 100 });
  98. info.onSuccess(data);
  99. _this2.props.onUpload({ path: data.name, uid: file.uid });
  100. }).catch(function (e) {
  101. var msg = e.message || _constant.ERROR_DEFAULT;
  102. if (_this2.props.showError) {
  103. _message3.default.error(msg);
  104. }
  105. if (_this2.props.onError) {
  106. _this2.props.onError(msg, { response: e.response });
  107. }
  108. info.onError(e);
  109. });
  110. };
  111. }
  112. }, {
  113. key: "handleCloseClick",
  114. value: function handleCloseClick(index) {
  115. var newFileList = this.props.fileList;
  116. newFileList.splice(index, 1);
  117. this.props.onChangeFileList(newFileList);
  118. }
  119. }, {
  120. key: "render",
  121. value: function render() {
  122. var _this3 = this;
  123. var _state = this.state,
  124. previewVisible = _state.previewVisible,
  125. previewImage = _state.previewImage;
  126. var _props = this.props,
  127. fileList = _props.fileList,
  128. maxUpload = _props.maxUpload,
  129. multiple = _props.multiple;
  130. var uploadButton = _react2.default.createElement(
  131. "div",
  132. null,
  133. _react2.default.createElement(_icon2.default, { type: "plus" }),
  134. _react2.default.createElement(
  135. "div",
  136. { className: "ant-upload-text" },
  137. _reactIntlUniversal2.default.get("editor.uploadBtn")
  138. )
  139. );
  140. return _react2.default.createElement(
  141. "div",
  142. null,
  143. _react2.default.createElement(
  144. _upload2.default,
  145. {
  146. accept: "image/jpg,image/jpeg,image/png,image/bmp",
  147. multiple: multiple,
  148. listType: "picture-card",
  149. showUploadList: { showPreviewIcon: true, showRemoveIcon: false },
  150. fileList: fileList,
  151. customRequest: this.customRequest,
  152. onPreview: this.handlePreview,
  153. onChange: this.handleChange
  154. },
  155. fileList.length >= maxUpload ? null : uploadButton
  156. ),
  157. fileList.map(function (file, index) {
  158. return _react2.default.createElement("div", {
  159. className: "upload-close-icon",
  160. onClick: _this3.handleCloseClick.bind(_this3, index),
  161. key: file.uid,
  162. style: {
  163. left: index % 3 * 112 + 98 + "px",
  164. top: Math.floor(index / 3) * 112 + 16 + "px"
  165. }
  166. });
  167. }),
  168. _react2.default.createElement(
  169. _modal2.default,
  170. {
  171. wrapClassName: "upload-img-preview",
  172. visible: previewVisible,
  173. footer: null,
  174. onCancel: this.handleCancel
  175. },
  176. _react2.default.createElement(
  177. _spin2.default,
  178. { spinning: this.state.loading },
  179. _react2.default.createElement("img", {
  180. alt: "upload",
  181. style: { width: "100%" },
  182. src: previewImage,
  183. onLoad: this.onImgLoad,
  184. onError: this.onImgLoad
  185. })
  186. )
  187. )
  188. );
  189. }
  190. }]);
  191. return App;
  192. }(_react2.default.Component);
  193. exports.default = (0, _Comment2.default)(App);
  194. //# sourceMappingURL=Upload.js.map