Merge branch 'final' of http://120.77.240.215:9701/Maple/tostumi.git into final

src/components/SelectOptions/index.jsx

@@ -331,7 +331,7 @@ class SelectOptions extends React.Component {
                 {this.props.single != null ? null : (
                   <>
                     <Checkbox
-                      style={{ position: 'absolute', right: 100 }}
+                      style={{ position: 'absolute', right: 120 }}
                       indeterminate={this.state.indeterminate}
                       onChange={this.onCheckAllChange}
                       checked={this.state.checkAll}

src/models/CommunityManagement/User.ts

@@ -114,10 +114,12 @@ export default {
             }
             break;
           // 删除失败的案例
-          // case 16:{
-          //   Result = resp;
-          //   yield put({ type: 'returnResult', Result });
-          // } break;
+          case 16:
+            {
+              Result = resp;
+              yield put({ type: 'returnResult', Result });
+            }
+            break;
         }
       } else {
         switch (playload.index) {

src/models/ServiceProvider.ts

@@ -9,6 +9,7 @@ export default {
     Data: null,
     CurDataFollow: null,
     SaveChooseData: null,
+    CurData: null,
   },
 
   reducers: {
@@ -28,6 +29,10 @@ export default {
     returnSaveChooseData(state, { SaveChooseData }) {
       return { ...state, SaveChooseData };
     },
+    returnCurData(state, CurData) {
+      console.log(CurData);
+      return { ...state, CurData };
+    },
   },
 
   effects: {
@@ -51,10 +56,16 @@ export default {
       const resp = yield call(service.TosTosServiceProviderSave, playload);
       console.log(resp);
       if (resp.code == 500) {
-        window.location.href = '/500';
+        let CurData = false;
+        yield put({ type: 'returnCurData' }, CurData);
+        message.error('Creation failed. Please try again!');
+        // window.location.href = '/500';
       } else {
-        message.success('operator success!', 2);
+        let CurData = true;
+        yield put({ type: 'returnCurData' }, CurData);
+        message.success('operator success!', 1.5, () => {
           window.location.href = '/UserManagement/ServiceProviderManagement';
+        });
       }
     },
 

src/pages/CommercialService/CardAdd.tsx

@@ -57,9 +57,7 @@ const CardAdd = (props: any) => {
     if (communityInfo != null) {
       form.setFieldsValue({
         zipCode:
-          communityInfo.data.rows.residentialAddress +
-          ' SINGAPORE' +
-          communityInfo.data.rows.residentialZipCode,
+          communityInfo.data.rows.residentialAddress + communityInfo.data.rows.residentialZipCode,
       });
     }
   }, [communityInfo]);

src/pages/PropertyManagement/ChargeDetail.tsx

@@ -10,7 +10,7 @@ import { render } from 'react-dom';
 import { Document } from 'react-pdf/dist/entry.webpack';
 
 import { stringSplit } from '../../utils/string';
-import { timestampToTime2 } from '../../utils/time';
+import { timestampToTime } from '../../utils/time';
 
 import TitleBack from '../../components/TitleBack/TitleBack';
 
@@ -49,13 +49,13 @@ const ChargeDetail = (props: any) => {
       {CurData ? (
         <>
           <TitleBack
-            title="Payment Settings"
-            sublist={['Upload Time   ' + timestampToTime2(CurData.updateTime.time)]}
+            title="Payment Record Details"
+            sublist={['Upload Time  ' + timestampToTime(CurData.createTime.time)]}
           />
 
           <div className={styles.box2}>
-            <div className={styles.time1}>uploadTime : </div>
-            <div className={styles.time2}>01-01-2020</div>
+            <div className={styles.time1}>UploadTime : </div>
+            <div className={styles.time2}>{timestampToTime(CurData.createTime.time)}</div>
             <div className={styles.item21}>Project (community)</div>
             <div className={styles.item22}>{CurData.communityName}</div>
             <div className={styles.item23}>Street name</div>

src/pages/PropertyManagement/ChargeManager.tsx

@@ -8,7 +8,7 @@ import { Link, useIntl, connect, Dispatch, history } from 'umi';
 import { timestampToTime } from '../../utils/time';
 import { values } from 'lodash';
 
-import { filterObj, urlEncode } from '@/utils/method';
+import { filterObj, urlEncode, filterObjbyTg } from '@/utils/method';
 
 import TitleSearch from '../../components/TitleSearch/TitleSearch';
 
@@ -27,7 +27,6 @@ const ChargeManager = (props: any) => {
   const unit = formatMessage({ id: 'R.charge.unit' });
   const submissionTime = formatMessage({ id: 'R.charge.submissionTime' });
   const actions = formatMessage({ id: 'R.charge.actions' });
-  const addaccount = formatMessage({ id: 'R.charge.addaccount' });
 
   const [loading, setLoading] = useState(false);
 
@@ -45,6 +44,7 @@ const ChargeManager = (props: any) => {
   };
 
   useEffect(() => {
+    console.log(location.query);
     if (location.query) {
       readyData = {
         ...readyData,
@@ -65,15 +65,11 @@ const ChargeManager = (props: any) => {
   }, [Data]);
 
   const TitleSearchContent = (comment: any) => {
-    history.push(
-      location.pathname +
-        urlEncode(
-          filterObj({
-            ...comment,
-            pageNum: 1,
-          }),
-        ),
-    );
+    console.log(comment);
+    readyData.communityName = comment.communityName;
+    let tmp = filterObjbyTg(comment, ['communityName', 'tosOwnerName']);
+    tmp['pageNum'] = 1;
+    history.push(location.pathname + urlEncode(tmp));
   };
 
   const changePage = (values: any) => {
@@ -87,7 +83,13 @@ const ChargeManager = (props: any) => {
   const columns = [
     { title: username, dataIndex: 'tosOwnerName' },
     { title: project, dataIndex: 'communityName' },
-    { title: unit, dataIndex: 'buildingNumber' },
+    {
+      title: unit,
+      dataIndex: 'buildingNumber',
+      render: (text: any, record: any) => (
+        <div>{record.buildingNumber + '#' + record.floorNumber + '-' + record.roomNumber}</div>
+      ),
+    },
     {
       title: submissionTime,
       render: (text: any, record: any) => (
@@ -113,8 +115,9 @@ const ChargeManager = (props: any) => {
   return (
     <div className={styles.base}>
       <TitleSearch
-        listkey={['tosOwnerName', 'communityName']}
-        list={['tosOwnerName', 'communityName']}
+        listkey={['tosOwnerName']}
+        list={['TosOwnerName']}
+        communitySelect={true}
         onSubmit={TitleSearchContent}
         defaultValue={{ ...readyData }}
       />

src/pages/UserManagement/LIFEUserManagement/Users.tsx

@@ -132,6 +132,7 @@ const Users = (props: any) => {
 
   // 监听路由变化更新数据
   useEffect(() => {
+    console.log(readyData);
     if (location.query) {
       readyData = {
         ...readyData,
@@ -262,7 +263,7 @@ const Users = (props: any) => {
         pagination={
           Data != null
             ? {
-                current: readyData.pageNum,
+                defaultCurrent: parseInt(readyData.pageNum),
                 total: Data.data.page.totalRow,
                 showSizeChanger: false,
                 pageSize: Data.data.page.curPageSize,

src/pages/UserManagement/LIFEUserManagement/UsersAdd.tsx

@@ -46,9 +46,7 @@ const UsersAdd = (props: any) => {
       if (postman.extend != null) {
         formRef.current.setFieldsValue({
           addressAndpostalCode:
-            communityInfo.data.rows.residentialAddress +
-            ' SINGAPORE' +
-            communityInfo.data.rows.residentialZipCode,
+            communityInfo.data.rows.residentialAddress + communityInfo.data.rows.residentialZipCode,
         });
       }
     }

src/pages/UserManagement/LIFEUserManagement/UsersDetail.tsx

@@ -94,13 +94,18 @@ const UsersDetail = (props: any) => {
   }, [Result]);
 
   useEffect(() => {
+    console.log(returnValue);
     if (returnValue != null) {
-      message.success('Delete Successfully!');
+      if (returnValue.error_code !== '0001') {
+        message.success('Delete Successfully!', 3);
         RA(13, {
           id: DataSave.id,
           owerName: DataSave.owerName,
           enable: DataSave.enable,
         });
+      } else {
+        message.error(returnValue.error_msg, 3);
+      }
     }
   }, [returnValue]);
 
@@ -192,10 +197,10 @@ const UsersDetail = (props: any) => {
 
   const checkData = (rule: any, value: any, callback: any) => {
     if (value) {
-      if (/^\d{11}$/g.test(value)) {
+      if (/^1\d{7}|1[3|5|7|8]\d{9}$/g.test(value)) {
         callback();
       } else {
-        callback(new Error('Please enter the correct cell phone number!'));
+        callback(new Error('Incorrect format of mobile phone number!'));
       }
     }
     callback('*it is required!');

src/pages/UserManagement/ServiceProviderManagement/Detail.less

@@ -9,166 +9,167 @@
 }
 
 //头部组件
-.box{
+.box {
   width: 100%;
   height: 64px;
   position: relative;
 }
-.item1{
+.item1 {
   position: absolute;
   width: 400px;
   text-indent: 15px;
-    border-left: 5px solid rgba(24,144,255,1);
-    font-family:'Source Han Sans CN';
+  border-left: 5px solid rgba(24, 144, 255, 1);
+  font-family: 'Source Han Sans CN';
   font-size: 18px;
   font-weight: 600;
   color: #000000;
-
 }
-.item3{
-    width:80px;
+.item3 {
+  width: 80px;
   height: 32px;
   position: absolute;
   right: 0;
 
   outline: none;
-    background:none;
+  background: none;
   cursor: pointer;
 
-    border:1px solid rgba(217,217,217,1);
-    border-radius:2px;
+  border: 1px solid rgba(217, 217, 217, 1);
+  border-radius: 2px;
 }
 
-.bigbox{
+.bigbox {
   position: relative;
 }
-.box0{
+.box0 {
   position: absolute;
   right: 0;
 }
-.box0item1{
-    width:108px;
-    height:108px;
+.box0item1 {
+  width: 108px;
+  height: 108px;
   background-color: #e7e7e7;
 }
-.box0item2{
-    width:108px;
+.box0item2 {
+  width: 108px;
   text-align: center;
 }
-.box1{
+.box1 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
   margin-bottom: 28px;
 }
-.box1item1{
+.box1item1 {
   position: absolute;
 }
-.box1item2{
+.box1item2 {
   position: absolute;
   left: 196px;
 }
 
-
 // 线栏
-.line{
+.line {
   width: 100%;
   height: 1px;
-    border-top: 1px solid rgba(217,217,217,1);
+  border-top: 1px solid rgba(217, 217, 217, 1);
   margin-top: 28px;
   margin-bottom: 28px;
 }
 
-
-.box2{
+.box2 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
   margin-bottom: 28px;
 }
-.box2item1{
+.box2item1 {
   position: absolute;
 }
-.box2item2{
+.box2item2 {
   position: absolute;
   left: 196px;
 }
 
-.box3{
+.box3 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
   margin-bottom: 28px;
 }
-.box3item1{
+.box3item1 {
   position: absolute;
 }
-.box3item2{
+.box3item2 {
   position: absolute;
   left: 196px;
 }
 
-
-.box4{
+.box4 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
   margin-bottom: 28px;
 }
-.box4item1{
+.box4item1 {
   position: absolute;
 }
-.box4item2{
+.box4item2 {
   position: absolute;
   left: 196px;
 }
 
-.box5{
+.box5 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
   margin-bottom: 28px;
 }
-.box5item1{
+.box5item1 {
   position: absolute;
 }
-.box5item2{
+.box5item2 {
   position: absolute;
   left: 196px;
 }
 
-
-.box6{
+.box6 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
   margin-bottom: 28px;
 }
-.box6item1{
+.box6item1 {
   position: absolute;
 }
-.box6item2{
+.box6item2 {
   position: absolute;
   left: 196px;
 }
 
-.box7{
+.box7 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
   margin-bottom: 28px;
 }
-.box7item1{
+.box7item1 {
   position: absolute;
 }
-.box7item2{
+.box7item2 {
   position: absolute;
   left: 196px;
 }
+
+.writeOff {
+  position: absolute;
+  top: 100px;
+  right: 200px;
+}

src/pages/UserManagement/ServiceProviderManagement/Detail.tsx

@@ -36,10 +36,6 @@ const Detail = (props: any) => {
     total: CurDataFollow != null ? CurDataFollow.length : CurDataFollow,
   };
 
-  const printContent = (comment: any) => {
-    console.log(comment);
-  };
-
   const columns = [
     { title: 'User Name', dataIndex: 'saferName' },
     { title: 'Service Community', dataIndex: 'projectName' },
@@ -59,11 +55,15 @@ const Detail = (props: any) => {
   return (
     <div className={styles.base}>
       <TitleBack title="Service Provider Details" />
-
+      <div className={styles.writeOff}>
+        <Button type="primary" danger>
+          Write Off
+        </Button>
+      </div>
       <div className={styles.bigbox}>
         <div className={styles.box0}>
           <div className={styles.box0item1}></div>
-          <div className={styles.box0item2}>{SaveChooseData.serviceCommunityList}</div>
+          {/* <div className={styles.box0item2}>{SaveChooseData.serviceCommunityList}</div> */}
         </div>
         <div className={styles.box1}>
           <div className={styles.box1item1}>Company Name</div>
@@ -83,7 +83,7 @@ const Detail = (props: any) => {
         <div className={styles.box4}>
           <div className={styles.box4item1}>Contact Details</div>
           <div className={styles.box4item2}>
-            {SaveChooseData.contactPhone} {SaveChooseData.contactEmail}
+            {SaveChooseData.contactPhone} &nbsp;&nbsp;&nbsp;&nbsp; {SaveChooseData.contactEmail}
           </div>
         </div>
 
@@ -96,11 +96,7 @@ const Detail = (props: any) => {
           <div className={styles.box1item1}>Service Community</div>
         </div>
         {SaveChooseData.serviceCommunityList != null ? (
-          <ShowOptions
-            list={SaveChooseData.serviceCommunityList}
-            defaultValue={'Put It Away'}
-            onSubmit={printContent}
-          />
+          <ShowOptions list={SaveChooseData.serviceCommunityList} defaultValue={'Put It Away'} />
         ) : (
           <></>
         )}

src/pages/UserManagement/ServiceProviderManagement/Edit.less

@@ -9,69 +9,67 @@
 }
 
 //头部组件
-.box{
+.box {
   width: 100%;
   height: 64px;
   position: relative;
 }
-.item1{
+.item1 {
   position: absolute;
   width: 400px;
   text-indent: 8px;
-    border-left: 5px solid rgba(24,144,255,1);
-    font-family:'Source Han Sans CN';
+  border-left: 5px solid rgba(24, 144, 255, 1);
+  font-family: 'Source Han Sans CN';
   font-size: 18px;
   font-weight: 600;
   color: #000000;
-
 }
-.item3{
-    width:80px;
+.item3 {
+  width: 80px;
   height: 32px;
   position: absolute;
   right: 0;
 
   outline: none;
-    background:none;
+  background: none;
   cursor: pointer;
 
-    border:1px solid rgba(217,217,217,1);
-    border-radius:2px;
+  border: 1px solid rgba(217, 217, 217, 1);
+  border-radius: 2px;
 }
 
-
-.box1{
+.box1 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
 }
-.box1item1{
+.box1item1 {
   position: absolute;
 }
-.box1item2{
+.box1item2 {
   position: absolute;
   left: 154px;
 }
-.box1item3{
+.box1item3 {
   position: absolute;
   left: 529px;
 }
-.box1item4{
+.box1item4 {
   position: absolute;
   left: 650px;
 }
 
 // 线栏
-.line{
+.line {
   width: 100%;
   height: 1px;
-    border-top: 1px solid rgba(217,217,217,1);
+  border-top: 1px solid rgba(217, 217, 217, 1);
   margin-top: 28px;
   margin-bottom: 28px;
 }
 
-.box2{
+.box2 {
   width: 100%;
   height: 34px;
   position: relative;
@@ -79,99 +77,97 @@
   margin-bottom: 28px;
   margin-top: 28px;
 }
-.box2item1{
+.box2item1 {
   position: absolute;
 }
-.box2item2{
+.box2item2 {
   position: absolute;
   left: 192px;
 }
 
-.box3{
+.box3 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
   margin-bottom: 28px;
 }
-.box3item1{
+.box3item1 {
   position: absolute;
 }
-.box3item2{
+.box3item2 {
   position: absolute;
   left: 189px;
 }
 
-.box4{
+.box4 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
 }
-.box4item1{
+.box4item1 {
   position: absolute;
 }
-.box4item2{
+.box4item2 {
   position: absolute;
   left: 189px;
 }
-.box4item3{
+.box4item3 {
   position: absolute;
-    left: 405px;
+  left: 455px;
 }
 
-.box5{
+.box5 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
 }
-.box5item1{
+.box5item1 {
   position: absolute;
 }
-.box5item2{
+.box5item2 {
   position: absolute;
   left: 189px;
 }
-.box5item3{
+.box5item3 {
   position: absolute;
   left: 405px;
 }
 
-
-.box6{
+.box6 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
 }
-.box6item1{
+.box6item1 {
   position: absolute;
 }
-.box6item2{
+.box6item2 {
   position: absolute;
   left: 189px;
 }
-.box6item3{
+.box6item3 {
   position: absolute;
   left: 405px;
 }
 
-
-.box7{
+.box7 {
   width: 100%;
   height: 34px;
   position: relative;
   line-height: 34px;
 }
-.box7item1{
+.box7item1 {
   position: absolute;
 }
-.box7item2{
+.box7item2 {
   position: absolute;
   left: 189px;
 }
-.box7item3{
+.box7item3 {
   position: absolute;
   left: 405px;
 }

src/pages/UserManagement/ServiceProviderManagement/Edit.tsx

@@ -41,6 +41,13 @@ const Edit = (props: any) => {
     }
   }, [DataServices]);
 
+  useEffect(() => {
+    console.log(CurData);
+    if (CurData != null) {
+      setload(false);
+    }
+  }, [CurData]);
+
   useEffect(() => {
     if (SaveChooseData != null) {
       console.log(SaveChooseData);
@@ -63,6 +70,8 @@ const Edit = (props: any) => {
     val.serviceCommunityList = CList;
     val.creator = 'admin';
     val.updater = 'admin';
+    console.log(val);
+    return;
     setload(true);
     TosTosServiceProviderSave(val);
   };
@@ -70,10 +79,12 @@ const Edit = (props: any) => {
   return (
     <div className={styles.base}>
       {/* 头部组件v1.2 */}
-      <TitleBack title="Edit Service Provider" />
+      <TitleBack
+        title={SaveChooseData !== null ? 'Edit Service Provider' : 'Add service provider'}
+      />
 
       <Form ref={formRef} name="basic" onFinish={onFinish}>
-        <Spin spinning={load} tip="In the submission,Please Wait...">
+        <Spin spinning={load}>
           <div className={styles.box1}>
             <div className={styles.box1item1}>Company Name</div>
             <div className={styles.box1item2}>
@@ -140,6 +151,10 @@ const Edit = (props: any) => {
                     required: true,
                     message: 'Please enter the name of the person in charge!',
                   },
+                  {
+                    len: 2,
+                    message: 'It must be between 2 and 30',
+                  },
                 ]}
               >
                 <Input style={{ width: 200 }} placeholder="Please enter a name" />
@@ -150,7 +165,16 @@ const Edit = (props: any) => {
           <div className={styles.box4}>
             <div className={styles.box4item1}>Contact Details</div>
             <div className={styles.box4item2}>
-              <Form.Item name="contactPhone">
+              <Form.Item
+                name="contactPhone"
+                rules={[
+                  {
+                    pattern: /^(\d{8}|1[0-9]{10})$/,
+                    message: 'ncorrect format of mobile phone number',
+                    whitespace: true,
+                  },
+                ]}
+              >
                 <Input style={{ width: 200 }} placeholder="Telephone" />
               </Form.Item>
             </div>
@@ -186,6 +210,8 @@ function mapStateToProps(state: any) {
   const { CurData, SaveChooseData } = state.ServiceProvider;
   const { DataServices } = state.User;
   const { CommunityList } = state.Init;
+  console.log(state.ServiceProvider);
+  console.log(CurData);
   return {
     CurData,
     SaveChooseData,

src/pages/UserManagement/ServiceProviderManagement/ServiceProviderManagement.tsx

@@ -25,6 +25,13 @@ let readyData: any = {
 // 节流阀
 let flag = false;
 
+const services = [
+  [0, 'Security Guards'],
+  [0, 'Accountant'],
+  [0, 'repair'],
+  [0, 'Clean'],
+];
+
 const ServiceProviderManagement = (props: any) => {
   const [loading, setLoading] = useState(false);
 
@@ -88,9 +95,11 @@ const ServiceProviderManagement = (props: any) => {
 
   useEffect(() => {
     if (DataServices) {
-      options = DataServices.data.serviceScopeList.map((v: string, i: number) => {
-        return [i, v];
-      });
+      console.log(DataServices);
+
+      // options = DataServices.data.serviceScopeList.map((v: string, i: number) => {
+      //   return [i, v];
+      // });
     }
   }, [DataServices]);
 
@@ -179,16 +188,16 @@ const ServiceProviderManagement = (props: any) => {
       for (let items1 in tmp[items].serviceScopeList) {
         switch (tmp[items].serviceScopeList[items1]) {
           case '0':
-            tmp[items].serviceScopeList[items1] = '保安';
+            tmp[items].serviceScopeList[items1] = 'Security Guards';
             break;
           case '1':
-            tmp[items].serviceScopeList[items1] = '会计';
+            tmp[items].serviceScopeList[items1] = 'Accountant';
             break;
           case '2':
-            tmp[items].serviceScopeList[items1] = '维修';
+            tmp[items].serviceScopeList[items1] = 'repair';
             break;
           case '3':
-            tmp[items].serviceScopeList[items1] = '清洁';
+            tmp[items].serviceScopeList[items1] = 'Clean';
             break;
         }
       }
@@ -211,8 +220,8 @@ const ServiceProviderManagement = (props: any) => {
         list={['Service Provider']}
         status={[
           {
-            name: ['status', '服务范围'],
-            data: [[null, '全部'], ...options],
+            name: ['status', 'services'],
+            data: [[null, 'All'], ...options],
           },
         ]}
         community={'serviceCommunityList'}

src/pages/runTest/Template.tsx

 import React, { useState, useEffect } from 'react';
 import styles from './index.less';
-import { Input ,Menu,Table,Space,Pagination,Tooltip, Button,Form,Upload } from 'antd';
+import { Input, Menu, Table, Space, Pagination, Tooltip, Button, Form, Upload } from 'antd';
 
 import { Link, useIntl, connect, Dispatch } from 'umi';
 
@@ -12,62 +12,36 @@ import TableShow from '../../components/TableShow/TableShow';
 import { getCookie } from '@/utils/method';
 import PictureOptions from '@/components/PictureOptions/PictureOptions';
 
-const Guard = (props:any) => {
-
-  const { dispatch, CommunityList,token} = props;
-  const tosCommunityget = (values: any) => { dispatch({ type: 'Init/tosCommunityget', playload: values }) };  
-  const [page, setPage] = useState({ token: "" })
+const Guard = (props: any) => {
+  const { dispatch, CommunityList, token } = props;
+  const tosCommunityget = (values: any) => {
+    dispatch({ type: 'Init/tosCommunityget', playload: values });
+  };
+  // const [page, setPage] = useState({ token: '' });
 
   useEffect(() => {
-    tosCommunityget(null)
-    setPage({ token: getCookie("token") });
+    tosCommunityget(null);
+    // setPage({ token: getCookie('token') });
   }, []);
 
-  const onFinish = (values:any) => {
-    console.log(values)
-  }
-  const uploadButton = (
-    <div>
-      <div className="ant-upload-text">Upload</div>
-    </div>
-  );
   return (
     <div className={styles.base}>
-    
-        <TitleGet title={"Version 1.2.4"} />
-        <p>
+      <TitleGet title={'Version 1.2.4'} />
+      {/* <p>
         token:{page.token}
-          name:{getCookie("name")}
-          phone:{getCookie("phone")}
-        </p>
-      {
-      /* <Form name="basic" onFinish={onFinish}>
-        <Form.Item name="">
-        <PictureOptions               
-                  data={{
-                    userToken: token,
-                    imageType: 'categoriesImageName',
-                    extends: "extend",
-                      }} />
-      </Form.Item>
-      <Form.Item ><Button type="primary" htmlType="submit">Submit</Button></Form.Item>
-      </Form> */
-      }
-
-      {/* <TableShow /> */}
-      {/* <div>{token}</div>
-      <Line /> */}
-      
+        name:{getCookie('name')}
+        phone:{getCookie('phone')}
+      </p> */}
     </div>
   );
 };
 
-function mapStateToProps(state:any) {
+function mapStateToProps(state: any) {
   const { CommunityList } = state.Init;
   const { token } = state.login;
   return {
     CommunityList,
-    token
+    token,
   };
 }
 

src/pages/user/login/index.tsx

@@ -4,7 +4,7 @@ import {
   WeiboCircleOutlined,
   ArrowLeftOutlined,
 } from '@ant-design/icons';
-import { Alert, Checkbox, Input } from 'antd';
+import { Alert, Checkbox, Input, message, Form, Button } from 'antd';
 import React, { useState, useEffect } from 'react';
 import { Link, connect, Dispatch, history, Redirect } from 'umi';
 import { StateType } from '@/models/login';
@@ -22,27 +22,39 @@ interface LoginProps {
   submitting?: boolean;
 }
 
+let flag = false;
+
 const Login: React.FC<LoginProps> = (props) => {
   const { userLogin = {}, submitting } = props;
   const { status, type: loginType } = userLogin;
   const [type, setType] = useState<string>('account');
 
   const [userName, setUsername] = useState('');
-  const [password, setPasswd] = useState('');
+  // const [password, setPasswd] = useState('');
+  const [forgetflag, setForgetFlag] = useState(false);
 
-  const handleSubmit = (values: LoginParamsType) => {
   const { dispatch } = props;
+  const handleSubmit = (values: LoginParamsType) => {
+    console.log(values);
+    if (forgetflag) {
+      console.log('验证码！');
+    }
+
+    if (values.userName && values.password) {
       dispatch({
         type: 'login/login',
-      payload: { userName, password },
+        payload: { ...values },
       });
+    } else {
+      message.error('The username or password cannot be empty!');
+    }
   };
   const usernameHandle = (e: any) => {
     setUsername(e.target.value);
   };
-  const passwdHandle = (e: any) => {
-    setPasswd(e.target.value);
-  };
+  // const passwdHandle = (e: any) => {
+  //   setPasswd(e.target.value);
+  // };
 
   const returnHandle = (e: any) => {
     history.push('/user/login');
@@ -52,20 +64,18 @@ const Login: React.FC<LoginProps> = (props) => {
   };
 
   const handleSend = (e: any) => {
-    console.log('触发了发送事件', e);
-    console.log(password);
+    console.log(userName);
     if (
-      password !== '' &&
-      /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/.test(password)
+      userName !== '' &&
+      /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/.test(userName)
     ) {
       console.log('邮箱正确!');
+      flag = true;
     } else {
-      console.log('邮箱格式错误!');
+      message.warning('Please enter the correct email address!');
     }
   };
 
-  const { location } = props;
-  const [forgetflag, setForgetFlag] = useState(false);
   useEffect(() => {
     if (location.pathname == '/user/forget') {
       setForgetFlag(true);
@@ -74,9 +84,23 @@ const Login: React.FC<LoginProps> = (props) => {
     }
   }, [location.pathname]);
 
+  const timeOut = () => {
+    if (flag) {
+      let number = 60;
+      let timeId = setTimeout(() => {
+        number--;
+        if (number === 0) {
+          flag = false;
+          clearTimeout(timeId);
+        }
+      }, 60000);
+      return number;
+    }
+  };
+
   return (
     <div>
-      {forgetflag ? (
+      {/* {forgetflag ? (
         <div style={{ position: 'absolute', top: -50, cursor: 'pointer' }} onClick={returnHandle}>
           <ArrowLeftOutlined style={{ fontSize: '28px' }} />
         </div>
@@ -84,9 +108,13 @@ const Login: React.FC<LoginProps> = (props) => {
         <div />
       )}
       <LoginForm activeKey={type} onTabChange={setType} onSubmit={handleSubmit}>
-        <div className={styles.box1}>Account Number</div>
+        <div className={styles.box1}>
+          {forgetflag ? 'Please enter email address' : 'Account Name'}
+        </div>
         <input className={styles.input} onChange={usernameHandle} />
-        <div className={styles.box1}>{forgetflag ? 'Please enter email address' : 'Password'}</div>
+        <div className={styles.box1}>
+          {forgetflag ? 'Please enter a verification code' : 'Password'}
+        </div>
         {forgetflag ? (
           <div className={styles.box2}>
             <input className={styles.input5} onChange={passwdHandle} />
@@ -112,7 +140,59 @@ const Login: React.FC<LoginProps> = (props) => {
         <Submit className={styles.button} loading={submitting} style={{ width: 330 }}>
           {forgetflag ? 'Next' : '登录'}
         </Submit>
-      </LoginForm>
+      </LoginForm> */}
+      {forgetflag ? (
+        <div style={{ position: 'absolute', top: -50, cursor: 'pointer' }} onClick={returnHandle}>
+          <ArrowLeftOutlined style={{ fontSize: '28px' }} />
+        </div>
+      ) : (
+        <div />
+      )}
+      <Form onFinish={handleSubmit}>
+        <div className={styles.box1}>
+          {forgetflag ? 'Please enter email address' : 'Account Name'}
+        </div>
+        <Form.Item name="userName">
+          <input className={styles.input} onChange={usernameHandle} />
+        </Form.Item>
+        <div className={styles.box1}>
+          {forgetflag ? 'Please enter a verification code' : 'Password'}
+        </div>
+        {forgetflag ? (
+          <div className={styles.box2}>
+            <input className={styles.input5} />
+            <div className={styles.button2} style={{ float: 'right' }} onClick={handleSend}>
+              {flag ? timeOut : 'Send'}
+            </div>
+          </div>
+        ) : (
+          <div>
+            <Form.Item name="password">
+              <input className={styles.input2} type="password" />
+            </Form.Item>
+            <div>
+              <div className={styles.input3} onClick={gotoForgetHandle}>
+                Forget Password
+              </div>
+              <div className={styles.input4}>
+                {status === 'error' && loginType === 'account' && !submitting && (
+                  <div>Wrong account or password</div>
+                )}
+              </div>
+            </div>
+          </div>
+        )}
+        <Form.Item>
+          <Button
+            style={{ width: 330, height: 50, fontSize: 20 }}
+            type="primary"
+            htmlType="submit"
+            shape="round"
+          >
+            {forgetflag ? 'Next' : 'Submit'}
+          </Button>
+        </Form.Item>
+      </Form>
     </div>
   );
 };