yusuketk 6 лет назад
Родитель
Сommit
76a2967844
1 измененных файлов с 23 добавлено и 7 удалено
  1. 23 7
      src/client/js/components/ProfileImageUploader.jsx

+ 23 - 7
src/client/js/components/ProfileImageUploader.jsx

@@ -27,6 +27,7 @@ class ProfileImageUploader extends React.Component {
     this.onCropChange = this.onCropChange.bind(this);
     this.makeClientCrop = this.makeClientCrop.bind(this);
     this.getCroppedImg = this.getCroppedImg.bind(this);
+    this.hanndleSubmit = this.handleSubmit.bind(this);
   }
 
   onSelectFile(e) {
@@ -83,6 +84,13 @@ class ProfileImageUploader extends React.Component {
     });
   }
 
+  handleSubmit() {
+    // GW-201 にて、crop された画像をサーバー側に送る処理を記述する
+    // me/index.html の 199~240行目の
+    // `$("#pictureUploadForm input[name=profileImage]").on('change', function(){...}`
+    // の処理を node で記述
+  }
+
   render() {
     const { crop, croppedImageUrl, src } = this.state;
 
@@ -91,13 +99,21 @@ class ProfileImageUploader extends React.Component {
         <input type="file" onChange={this.onSelectFile} name="profileImage" accept="image/*" />
         {src
         && (
-        <ReactCrop
-          src={src}
-          crop={crop}
-          onImageLoaded={this.onImageLoaded}
-          onComplete={this.onCropComplete}
-          onChange={this.onCropChange}
-        />
+        <div>
+          <ReactCrop
+            src={src}
+            crop={crop}
+            onImageLoaded={this.onImageLoaded}
+            onComplete={this.onCropComplete}
+            onChange={this.onCropChange}
+          />
+          <button
+            type="button"
+            onClick={this.handleSubmit}
+          >
+          完了
+          </button>
+        </div>
         )}
       </div>
     );