Signed-off-by: cellee <893264950@qq.com>

src/pages/AccountManagement/Service/service.tsx

@@ -50,17 +50,25 @@ const service = (props: any) => {
         <Space size="middle">
           <a
             onClick={() => {
-              emptys(record, `/AccountManagement/service/edit`);
+              edits(record, `/AccountManagement/service/edit`);
             }}
           >
-            Edit
+            Add
           </a>
           <a
             onClick={() => {
               emptys(record, '/AccountManagement/service/detail');
             }}
           >
-            Detail
+            Edit
+          </a>
+
+          <a
+            onClick={() => {
+              message.warning('Under development');
+            }}
+          >
+            Download
           </a>
         </Space>
       ),
@@ -86,7 +94,7 @@ const service = (props: any) => {
     }
   }, [location, Init, Data]);
 
-  // 清除操作之前的数据
+  // 清除操作之前的数据 在跳转
   const emptys = (data: any, url: any) => {
     // dispatch({ type: module + '/urlRemove' }); // 清掉图片信息
     dispatch({ type: module + '/Result' }); // 清掉之前的删除结果
@@ -95,6 +103,10 @@ const service = (props: any) => {
     history.push(url + '/' + data.id);
   };
 
+  const edits = (data: any, url: any) => {
+    history.push(url + '/' + data.communityName);
+  };
+
   // 点击搜索
 
   const CallBackTitleSearch = (comment: any) => {

src/pages/AccountManagement/Service/serviceEdit.tsx

 /*
  * @Author: your name
  * @Date: 2021-03-02 14:39:40
- * @LastEditTime: 2021-04-22 15:18:59
+ * @LastEditTime: 2021-05-21 18:01:22
  * @LastEditors: Please set LastEditors
  * @Description: In User Settings Edit
  * @FilePath: \tostumi\src\pages\AccountManagement\Service\serviceEdit.tsx
  */
 import React, { useState, useEffect } from 'react';
-import { Button, Spin, Form, Input } from 'antd';
+import { Button, Spin, Form, Input, message } from 'antd';
 import { connect } from 'umi';
+import { PlusOutlined } from '@ant-design/icons';
 const { TextArea } = Input;
 
-import { RA, SA } from '@/utils/method';
+import { RA } from '@/utils/method';
 const module = 'ServicePro';
 import './service.less';
 
@@ -19,100 +20,119 @@ import TitleBack from '@/components/TitleBack/TitleBack';
 import SearchOptionsCommnity from '@/components/SearchOptions/SearchOptionsCommnity';
 import PictureOptionsRow from '@/components/PictureOptions/PictureOptionsRow';
 
-import moment from 'moment';
-
-import { getUrlPicName } from '@/utils/string';
-
 const service = (props: any) => {
-  const { DataSave, dispatch, loading, match } = props;
+  const { DataSave, dispatch, loading, match, user } = props;
 
   const [term, setTerm] = useState(null as any); // 默认小区
   const [ImageSrc, setImageSrc] = useState([] as any); // 图片地址
 
-  const [imgs, setImgs] = useState([] as any); // 回复地址
+  const [report, setreport] = useState([] as any); // 循环新增的报告
 
   const [form] = Form.useForm();
+
   // 监听是否有数据
   useEffect(() => {
     if (match.params.id) {
-      RA(69, { id: match.params.id }, module, dispatch);
+      console.log(match.params.id);
+      setTerm(match.params.id);
+      // RA(69, { id: match.params.id }, module, dispatch);
     }
   }, [match]);
 
   useEffect(() => {
     if (DataSave != null) {
-      setTerm({ ...DataSave });
+    }
+  }, [DataSave]);
 
-      form.setFieldsValue({
-        communityName: DataSave.communityName,
-        reportContent: DataSave.reportContent,
-        reportImages: DataSave.reportImages ? DataSave.reportImages.split(',') : null,
-      });
+  //onFinish  提交
+  const onFinish = (values: any) => {
+    // 存储个数
+    let num = [];
 
-      if (DataSave.reportPictures.length > 0) {
-        // 图片名any
-        let a = DataSave.reportPictures.map((item: any, i: any) => {
-          let img = DataSave.reportImages.split(',');
-          let key = img[i];
-
-          return {
-            uid: i,
-            name: key,
-            status: 'done',
-            url: item,
-          };
-        });
-        // 图片列表
-        setImageSrc(a);
-      }
+    // 先抽取所有的key
+    let obj = Object.keys(values);
 
-      if (DataSave.replyData.length > 0) {
-        // 图片名any
-        let b = [] as any;
-        DataSave.replyData[0].replyPictures.map((item: any, i: any) => {
-          let obj = {
-            uid: i,
-            name: getUrlPicName(item),
-            status: 'done',
-            url: item,
+    // 再看有多少个 值
+    for (let i in obj) {
+      if (obj[i].indexOf('reportContent') != -1) {
+        num.push(obj[i]);
+      }
+    }
+    // 删除第一个
+    num.splice(num.indexOf('reportContent'), 1);
+
+    // 开始拼接
+    let tosReportRecordModels = [];
+
+    // 第一个是都有的
+    let requte = {
+      reporterId: user.currentUser.userModel.id,
+      communityName: values.communityName,
+      imagesList: values.imagesList,
+      reportContent: values.reportContent,
     };
-          b.push(obj);
-        });
-
-        // 回复列表
-        setImgs(b);
 
-        form.setFieldsValue({
-          replyContent: DataSave.replyData[0].replyContent,
+    // 添加进去
+    tosReportRecordModels.push(requte);
+
+    // 如果存在其他的
+    if (num.length > 0) {
+      num.forEach((i, idx) => {
+        let img = 'imagesList' + idx;
+        let cont = 'reportContent' + idx;
+        let objs = {
+          reporterId: user.currentUser.userModel.id,
+          communityName: values.communityName,
+          imagesList: values[img],
+          reportContent: values[cont],
+        };
+        tosReportRecordModels.push(objs);
       });
     }
-    }
-  }, [DataSave]);
+    // 最后结果
+    let oves = {
+      tosReportRecordModels,
+    };
 
-  //onFinish  提交
-  const onFinish = (values: any) => {
-    values.id = match.params.id;
-    values.reportImages = values.reportImages ? values.reportImages.join(',') : null;
-    values.replyImages = values.replyImages ? values.replyImages.join(',') : null;
-    RA(70, values, module, dispatch);
+    // 再发起请求
+    RA(77, oves, module, dispatch);
   };
 
   // 选择小区名字并赋值
   const opname = (value: any) => {
-    // console.log(value);
-    if (value) {
-      RA(72, { communityName: value }, module, dispatch);
-    }
+    // if (value) {
+    //   RA(72, { communityName: value }, module, dispatch);
+    // }
+    // setTerm(value);
     form.setFieldsValue({
       communityName: value,
     });
   };
 
+  // 增加
+  const addItem = () => {
+    // 先检查表单内容填完了没
+    let objs = form.getFieldsValue();
+
+    // 存在没填写的就禁止增加
+    for (let i in objs) {
+      if (typeof objs[i] === 'undefined') {
+        message.warning('Please enter all information!');
+        return false;
+      }
+    }
+
+    // 再新增
+    let a = report;
+    a.push(report.length);
+    setreport([...a]);
+  };
+
   return (
     <Spin spinning={loading}>
       <div className="edit">
         {/* 标题 */}
-        <TitleBack title={'Edit report'} />
+        <TitleBack title={'Add report'} />
         {/* 信息 */}
         <div className="form_s">
           <Form
@@ -128,31 +148,32 @@ const service = (props: any) => {
               <SearchOptionsCommnity
                 // ubmit={extendName}
                 opname={opname}
-                defaultName={term ? term.communityName : null}
+                defaultName={term}
                 // type={1} // 单选还是多选  单选就直接去掉
               />
             </Form.Item>
-            {/* 小区地址 */}
-            <Form.Item label="Address">
-              <span>{term ? `${term.communityAddress} , ${term.postCode}` : null}</span>
-            </Form.Item>
-            {/* 报告人 */}
-            <Form.Item label="Reported By">
-              <span>{term ? term.reporterName : null}</span>
-            </Form.Item>
-            {/* 报告人联系方式 */}
-            <Form.Item label="Contact Details">
-              {/* <span style={{ display: 'inline-block', marginRight: 20 }}>
-                {term ? term.reporterEmail : null}
-              </span> */}
-              <span>{term ? term.reporterPhone : null}</span>
-            </Form.Item>
             {/* 报告描述 */}
             <Form.Item label="Description" name="reportContent" rules={[{ required: true }]}>
+              <div className="psoBox flex">
                 <TextArea rows={4} style={{ maxWidth: 600, width: '100%' }} />
+
+                {report.length == 0 ? (
+                  <div className="psoBtn">
+                    <Button
+                      shape="circle"
+                      icon={<PlusOutlined />}
+                      onClick={() => {
+                        addItem();
+                      }}
+                    />
+                  </div>
+                ) : (
+                  ''
+                )}
+              </div>
             </Form.Item>
             {/* 报告图片 */}
-            <Form.Item label="Picture" name="reportImages" rules={[{ required: true }]}>
+            <Form.Item label="Picture" name="imagesList" rules={[{ required: true }]}>
               <PictureOptionsRow
                 action="/tos/image/upload"
                 data={{
@@ -166,24 +187,51 @@ const service = (props: any) => {
             </Form.Item>
             <hr></hr>
             {/* --------------------------------------------------------------------------------------------- */}
-            {/* 回复内容 */}
-            <Form.Item label="Overview" name="replyContent" rules={[{ required: true }]}>
+
+            {report.map((i: any, idx: any) => {
+              return (
+                <div key={idx}>
+                  <Form.Item
+                    label="Description"
+                    name={'reportContent' + idx}
+                    rules={[{ required: true }]}
+                  >
+                    <div className="psoBox flex">
                       <TextArea rows={4} style={{ maxWidth: 600, width: '100%' }} />
+
+                      {idx == report.length - 1 ? (
+                        <div className="psoBtn">
+                          <Button
+                            shape="circle"
+                            icon={<PlusOutlined />}
+                            onClick={() => {
+                              addItem();
+                            }}
+                          />
+                        </div>
+                      ) : (
+                        ''
+                      )}
+                    </div>
                   </Form.Item>
-            {/* 回复图片 */}
-            <Form.Item label="Picture" name="replyImages">
+
+                  <Form.Item label="Picture" name={'imagesList' + idx} rules={[{ required: true }]}>
                     <PictureOptionsRow
                       action="/tos/image/upload"
                       data={{
-                  // imageType: 'tosReportImage',
-                  imageType: 'tosReplyImage',
+                        imageType: 'tosReportImage',
                         identification: '',
                       }}
                       limitNums={10}
-                imgs={imgs}
+                      imgs={ImageSrc}
+                      over={loading}
                     />
                   </Form.Item>
                   <hr></hr>
+                </div>
+              );
+            })}
+
             {/* --------------------------------------------------------------------------------------------- */}
             {/* 提交 */}
             <Form.Item label=" " colon={false}>
@@ -199,9 +247,9 @@ const service = (props: any) => {
 };
 
 function map(state: any) {
-  const loading = state.loading.models.ServicePro;
-  const Init = state.Init;
+  const loading = state.loading.global;
+  const { Init, user } = state;
   const { DataSave, curString, village } = state[module];
-  return { DataSave, loading, curString, village, Init };
+  return { DataSave, loading, curString, village, Init, user };
 }
 export default connect(map)(service);