Browse Source

fix:表情弹框可配置位置、头像变形、图片多选等

zhengyingya 5 years ago
parent
commit
c54e8c3aff

+ 7
- 1
src/components/ContentItem/index.css View File

16
   margin-left: 10px;
16
   margin-left: 10px;
17
   margin-bottom: 20px;
17
   margin-bottom: 20px;
18
 }
18
 }
19
-
19
+.comment-item-avatar {
20
+  width: 40px;
21
+  height: 40px;
22
+  border-radius: 20px;
23
+  background-position: center;
24
+  background-size: cover;
25
+}
20
 .comment-item-content {
26
 .comment-item-content {
21
   margin: 10px 0;
27
   margin: 10px 0;
22
   word-break: break-all;
28
   word-break: break-all;

+ 7
- 1
src/components/ContentItem/index.js View File

116
     return (
116
     return (
117
       <div className="comment-item-box">
117
       <div className="comment-item-box">
118
         <div className="comment-item-left">
118
         <div className="comment-item-left">
119
-          <Avatar src={content.user_avatar || avatar} size="large" />
119
+          {/* <Avatar src={content.user_avatar || avatar} size="large" /> */}
120
+          <div
121
+            className="comment-item-avatar"
122
+            style={{
123
+              backgroundImage: `url(${content.user_avatar || avatar})`
124
+            }}
125
+          />
120
         </div>
126
         </div>
121
         <div className="comment-item-right">
127
         <div className="comment-item-right">
122
           <div>
128
           <div>

+ 2
- 1
src/components/Editor/Upload.js View File

103
 
103
 
104
   render() {
104
   render() {
105
     const { previewVisible, previewImage } = this.state;
105
     const { previewVisible, previewImage } = this.state;
106
-    const { fileList, maxUpload } = this.props;
106
+    const { fileList, maxUpload, multiple } = this.props;
107
     const uploadButton = (
107
     const uploadButton = (
108
       <div>
108
       <div>
109
         <Icon type="plus" />
109
         <Icon type="plus" />
114
       <div>
114
       <div>
115
         <Upload
115
         <Upload
116
           accept="image/jpg,image/jpeg,image/png,image/bmp"
116
           accept="image/jpg,image/jpeg,image/png,image/bmp"
117
+          multiple={multiple}
117
           listType="picture-card"
118
           listType="picture-card"
118
           fileList={fileList}
119
           fileList={fileList}
119
           customRequest={this.customRequest}
120
           customRequest={this.customRequest}

+ 8
- 2
src/components/Editor/index.js View File

172
       rows,
172
       rows,
173
       showEmoji,
173
       showEmoji,
174
       showUpload,
174
       showUpload,
175
+      multiple,
176
+      emojiPopoverPlacement,
175
       closeUploadWhenBlur,
177
       closeUploadWhenBlur,
176
       maxUpload,
178
       maxUpload,
177
       // btnSubmitText,
179
       // btnSubmitText,
199
             "comment-editor-toolbar-error": inputValue.length > maxLength
201
             "comment-editor-toolbar-error": inputValue.length > maxLength
200
           })}
202
           })}
201
         >
203
         >
202
-
203
           {/* {intl.get("editor.alreadyEntered", {
204
           {/* {intl.get("editor.alreadyEntered", {
204
             count: inputValue.length,
205
             count: inputValue.length,
205
             maxLength
206
             maxLength
219
               {showEmoji && (
220
               {showEmoji && (
220
                 <Popover
221
                 <Popover
221
                   trigger="click"
222
                   trigger="click"
222
-                  placement="bottomLeft"
223
+                  placement={emojiPopoverPlacement}
223
                   autoAdjustOverflow={false}
224
                   autoAdjustOverflow={false}
224
                   content={
225
                   content={
225
                     <div
226
                     <div
264
                       }}
265
                       }}
265
                     >
266
                     >
266
                       <Upload
267
                       <Upload
268
+                        multiple={multiple}
267
                         onChangeFileList={this.handleChangeFileList}
269
                         onChangeFileList={this.handleChangeFileList}
268
                         onUpload={this.handleUpload}
270
                         onUpload={this.handleUpload}
269
                         maxUpload={maxUpload}
271
                         maxUpload={maxUpload}
343
   rows: PropTypes.number,
345
   rows: PropTypes.number,
344
   placeholder: PropTypes.string,
346
   placeholder: PropTypes.string,
345
   showEmoji: PropTypes.bool,
347
   showEmoji: PropTypes.bool,
348
+  emojiPopoverPlacement: PropTypes.string,
346
   showUpload: PropTypes.bool,
349
   showUpload: PropTypes.bool,
350
+  multiple: PropTypes.bool,
347
   closeUploadWhenBlur: PropTypes.bool,
351
   closeUploadWhenBlur: PropTypes.bool,
348
   maxUpload: PropTypes.number,
352
   maxUpload: PropTypes.number,
349
   value: PropTypes.string,
353
   value: PropTypes.string,
366
   // placeholder: "说点什么吧",
370
   // placeholder: "说点什么吧",
367
   showEmoji: true,
371
   showEmoji: true,
368
   showUpload: true,
372
   showUpload: true,
373
+  multiple: true,
374
+  emojiPopoverPlacement: "bottomLeft",
369
   closeUploadWhenBlur: false,
375
   closeUploadWhenBlur: false,
370
   maxUpload: 1,
376
   maxUpload: 1,
371
   // btnSubmitText: "发表",
377
   // btnSubmitText: "发表",

+ 3
- 0
src/index.js View File

52
     userId: 71299,
52
     userId: 71299,
53
     onCountChange: c => {
53
     onCountChange: c => {
54
       console.log(c);
54
       console.log(c);
55
+    },
56
+    editorProps: {
57
+      // emojiPopoverPlacement: "bottom"
55
     }
58
     }
56
   });
59
   });
57
 }
60
 }