Browse Source

更换图片组件

mentoswzq 4 years ago
parent
commit
1cf3a0a0cc

+ 2 - 0
js/component/common/imgList/index.js

@@ -70,10 +70,12 @@ class ImgList extends Component{
         const isJPG = file.type === 'image/jpeg' || file.type === 'image/png' || file.type === 'image/jpg';
         if (!isJPG) {
             message.error('只能上传图片文件!');
+            return isJPG;
         }
         const isLt2M = file.size / 1024 / 1024 < 10;
         if (!isLt2M) {
             message.error('图片大小不能超过 10MB!');
+            return isLt2M;
         }
         if(isJPG && isLt2M){
             //用于计算当次选择的图片数量

+ 16 - 21
js/component/manageCenter/order/myOrder/servicesOrder/addService.jsx

@@ -39,29 +39,22 @@ const PicturesWall = React.createClass({
         this.state.fileList = nextProps.pictureUrl; 
     },
     render() {
-        const { previewVisible, previewImage, fileList } = this.state;
-        const uploadButton = (
-            <div>
-                <Icon type="plus" />
-                <div className="ant-upload-text">点击上传</div>
-            </div>
-        );
+        const { fileList } = this.state;
         return (
             <div style={{display:"inline-block"}}>
-                <Upload
-                	beforeUpload={beforeUploadFile}
-                    action={globalConfig.context + "/api/admin/order/uploadOrderImg"}
-                    data={{ 'sign': '' }}
-                    listType="picture-card"
+                <ImgList
+                    domId={this.props.domId}
+                    uploadConfig={{
+                        action:globalConfig.context + "/api/admin/order/uploadOrderImg",
+                        data:{ 'sign': '' },
+                        multiple:true,
+                        listType:"picture-card",
+                    }}
+                    onChange={(infor)=>{
+                        this.handleChange(infor)
+                    }}
                     fileList={fileList}
-                    multiple
-                    onPreview={this.handlePreview}
-                    onChange={this.handleChange} >
-                    {uploadButton}
-                </Upload>
-                <Modal maskClosable={false} visible={previewVisible} footer={null} onCancel={this.handleCancel}>
-                    <img alt="example" style={{ width: '100%' }} src={previewImage} />
-                </Modal>
+                />
             </div>
         );
     }
@@ -1414,6 +1407,7 @@ const NewService = Form.create()(React.createClass({
 												                >
 												            	
 												                <PicturesWall
+                                                                    domId={'addService1'}
 												                    fileList={this.getOrgCodeUrl}
 												                    pictureUrl={this.state.orgCodeUrl} />
 												                    <p>图片建议:要清晰。</p>
@@ -1491,7 +1485,7 @@ const NewService = Form.create()(React.createClass({
 									                            {/*        });*/}
 									                            {/*    }} />*/}
                                                                 {this.state.orgCodeUrl ? <div style={{paddingTop:'10px',paddingBottom:'10px'}}>
-                                                                    <ImgList fileList={this.state.orgCodeUrl} ItemWidth={'96px'}/>
+                                                                    <ImgList domId={'addService3'} fileList={this.state.orgCodeUrl} ItemWidth={'96px'}/>
                                                                 </div> : <div/>}
 									                            <Modal maskClosable={false} footer={null}
 									                                visible={this.state.previewVisible}
@@ -1819,6 +1813,7 @@ const NewService = Form.create()(React.createClass({
 								                wrapperCol={{ span: 18 }}
 								                label="合同扫描件" >
 								                <PicturesWall
+                                                    domId={'addService2'}
 								                	listType="picture-card"
 								                    fileList={this.getOrgCodeUrl}
 								                    pictureUrl={this.state.orgCodeUrl} />

+ 18 - 31
js/component/manageCenter/order/orderNew/approveds.jsx

@@ -38,6 +38,7 @@ import './customer.less';
 import { ChooseList } from "../orderNew/chooseList";
 import ShowModalDiv from "@/showModal.jsx";
 import Project from "../../../../component/project";
+import ImgList from "../../../common/imgList";
 const { TabPane } = Tabs;
 const { TextArea } = Input;
 //图片组件
@@ -73,39 +74,23 @@ const PicturesWall = React.createClass({
   },
   render() {
     const {
-      previewVisible,
-      previewImage,
       fileList
     } = this.state;
-    const uploadButton = (
-      <div>
-        <Icon type="plus" />
-        <div className="ant-upload-text">点击上传</div>
-      </div>
-    );
     return (
       <div style={{ display: "inline-block" }}>
-        <Upload
-          action={
-            globalConfig.context + "/api/admin/customer/uploadCustomerImg"
-          }
-          data={{ sign: "" }}
-          listType="picture-card"
-          fileList={fileList}
-          multiple
-          onPreview={this.handlePreview}
-          onChange={this.handleChange}
-        >
-          {uploadButton}
-        </Upload>
-        <Modal
-          maskClosable={false}
-          visible={previewVisible}
-          footer={null}
-          onCancel={this.handleCancel}
-        >
-          <img alt="example" style={{ width: "100%" }} src={previewImage} />
-        </Modal>
+        <ImgList
+            domId={this.props.domId}
+            uploadConfig={{
+              action:globalConfig.context + "/api/admin/customer/uploadCustomerImg",
+              data:{ 'sign': '' },
+              multiple:true,
+              listType:"picture-card",
+            }}
+            onChange={(infor)=>{
+              this.handleChange(infor)
+            }}
+            fileList={fileList}
+        />
       </div>
     );
   }
@@ -2275,7 +2260,7 @@ const IntentionCustomer = Form.create()(
                 />
               </Spin>
             </div>
-            <Modal
+            {this.state.visible ? <Modal
               className="customeDetails"
               footer=""
               title="订单详情"
@@ -2420,6 +2405,7 @@ const IntentionCustomer = Form.create()(
                         }
                       >
                         <PicturesWall
+                          domId={'approveds1'}
                           fileList={this.getOrgCodeUrl}
                           pictureUrl={this.state.orgCodeUrl}
                         />
@@ -2445,6 +2431,7 @@ const IntentionCustomer = Form.create()(
                         }
                       >
                         <PicturesWall
+                          domId={'approveds2'}
                           fileList={this.getReplenishUrl}
                           pictureUrl={this.state.replenishUrl}
                           url="/api/admin/order/uploadOrderImg"
@@ -2588,7 +2575,7 @@ const IntentionCustomer = Form.create()(
                   </div>
                 </Spin>
               </Form>
-            </Modal>
+            </Modal> : <div/>}
             <Modal
               maskClosable={false}
               visible={this.state.addnextVisible}