修正样式和列表刷新

.env

+PORT=7001
\ No newline at end of file

src/config/index.js

-export const APP_ID = 'wxed39740c39fa1c0a';
+export const APP_ID = 'wx723baaa343083ca9';
 // export const SERVER_URL = 'http://ex-dev-gx-manager.168cad.top';
 export const SERVER_URL = 'http://192.168.1.33:8888';
 

src/containers/App.js

@@ -42,6 +42,8 @@ class App extends Component {
     if (!isWx) {
       return <div>请在微信客户端打开链接</div>;
     } else if (!code) {
+      console.log(window.location);
+
       let rUrl = encodeURIComponent('');
       window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${APP_ID}&redirect_uri=${rUrl}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect`;
       return <div>授权中。。。</div>;
@@ -60,9 +62,16 @@ class App extends Component {
   };
   renderIndex = props => {
     console.log(props);
-
+    const {
+      userContext: {
+        userinfo: { login },
+      },
+    } = this.state;
     const { history, location } = props;
     let params = this.getParams(location.search);
+    if (login) {
+      return <div style={{ margin: '60px 24px 0' }}>加载中。。。</div>;
+    }
     if (params.code) {
       console.log('fetch UserInfo');
       console.log('redirect', params);
@@ -72,8 +81,8 @@ class App extends Component {
         .then(res => {
           console.log(res);
           const { firstLogin, user, author } = res.data;
-          this.updateUserInfo({ ...user, login: true, author });
           store.updateUserId(user.userId);
+          this.updateUserInfo({ ...user, login: true, author });
           if (firstLogin) {
             history.replace('/login');
           } else {
@@ -86,13 +95,13 @@ class App extends Component {
         });
     } else {
       console.log('go in wxAuth');
-      // this.goWechatAuth()
+      this.goWechatAuth();
     }
 
     return <div style={{ margin: '60px 24px 0' }}>加载中。。。</div>;
   };
   goWechatAuth = () => {
-    let rUrl = encodeURIComponent('');
+    let rUrl = encodeURIComponent(window.location.origin);
     window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${APP_ID}&redirect_uri=${rUrl}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect`;
     return <div>授权中。。。</div>;
   };

src/containers/Home/Index.js

@@ -3,6 +3,11 @@ import PropTypes from 'prop-types';
 import styles from './style.css';
 import { Toast } from 'antd-mobile';
 import UserInfoContext from '../../context/userinfo-context';
+import bannerIcon from './images/home_page_banner@2x.png';
+import repairIcon from './images/repairs@2x.png';
+import repairDealIcon from './images/repairs_dispose@2x.png';
+import publicCarIcon from './images/service_car@2x.png';
+import publicCarDealIcon from './images/service_car_dispose@2x.png';
 
 export class Index extends React.Component {
   static propTypes = {
@@ -14,7 +19,7 @@ export class Index extends React.Component {
       history,
     } = this.props;
     let item = author.find(i => i.code === code);
-    if (item.type) {
+    if (item && item.type) {
       history.push(path);
       return;
     } else {
@@ -24,18 +29,35 @@ export class Index extends React.Component {
   };
   render() {
     return (
-      <div className={styles.LoadPage}>
-        <h2>HomePage</h2>
-        <div onClick={() => this.validate('CSXY0001', '/Repair')}>报修</div>
-        <br />
-        <div onClick={() => this.validate('CSXY0002', '/RepairDeal')}>
-          报修处理
+      <div className={styles.HomePage}>
+        <div className={styles.banner}>
+          <img src={bannerIcon} alt="" />
+        </div>
+        <div className={styles.iconBox}>
+          <div
+            className={styles.iconItem}
+            onClick={() => this.validate('CSXY0001', '/Repair')}
+          >
+            <img src={repairIcon} alt="" />
+          </div>
+          <div
+            className={styles.iconItem}
+            onClick={() => this.validate('CSXY0002', '/RepairDeal')}
+          >
+            <img src={repairDealIcon} alt="" />
+          </div>
+          <div
+            className={styles.iconItem}
+            onClick={() => this.validate('CSXY0003', '/publicCar')}
+          >
+            <img src={publicCarIcon} alt="" />
+          </div>
+          <div
+            className={styles.iconItem}
+            onClick={() => this.validate('CSXY0004', '/publicCarDeal')}
+          >
+            <img src={publicCarDealIcon} alt="" />
           </div>
-        <br />
-        <div onClick={() => this.validate('CSXY0003', '/publicCar')}>约车</div>
-        <br />
-        <div onClick={() => this.validate('CSXY0004', '/publicCarDeal')}>
-          约车处理
         </div>
       </div>
     );

src/containers/Home/style.css

-.LoadPage {
-  margin: 60px 24px 0;
+.banner {
+  height: 341px;
+}
+.iconBox {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  margin: 18.7px 20.5px 0;
+}
+.iconItem {
+  width: 290px;
+  height: 293.5px;
+  margin-bottom: 18.7px;
 }

src/containers/Login/Login.js

@@ -7,6 +7,7 @@ import { Button, Modal, Toast } from 'antd-mobile';
 import { getVcode, sendMsg, login } from '../../api/index';
 import CodeView from '../../components/CodeView/CodeView';
 import UserInfoContext from '../../context/userinfo-context';
+import store from '../../store';
 
 class Login extends Component {
   constructor(props) {
@@ -119,6 +120,7 @@ class Login extends Component {
     login(entity)
       .then(res => {
         const { user, author } = res.data;
+        store.updateUserId(user.userId);
         updateUserInfo({
           ...user,
           author,
@@ -129,9 +131,6 @@ class Login extends Component {
       .catch(err => {
         console.log(err);
       });
-    // fakeAuth.authenticate(() => {
-    //   this.setState({ redirectToReferrer: true });
-    // });
   };
 
   render() {

src/containers/Login/style.css

@@ -52,7 +52,7 @@
 }
 .vInputBox {
   composes: inputBox;
-  width: 300px;
+  width: 280px;
   margin-right: 10px;
 }
 .vcode {

src/containers/PublicCar/PublicCarApply.js

@@ -4,7 +4,9 @@ import { applyPublicCar, fetchCarCategory } from '../../api/index';
 import styles from './style.css';
 import { formatDate } from '../../utils/index';
 import arrIcon from '../../components/Input/Select/images/select_icon@2x.png';
-import UserInfoContext from '../../context/userinfo-context'
+import offCheckIcon from '../../images/Check/radio_off_btn@2x.png';
+import onCheckIcon from '../../images/Check/radio_on_btn@2x.png';
+import UserInfoContext from '../../context/userinfo-context';
 
 const CustomChildren = ({ extra, onClick, children }) => (
   <div onClick={onClick} className={styles.selectWrap}>
@@ -26,7 +28,7 @@ class PublicCarApply extends Component {
       beginDate: '',
       endDate: '',
       lineDescription: '',
-      showAllCategory: true,
+      showAllCategory: false,
       categoryList: [],
     };
   }
@@ -40,8 +42,14 @@ class PublicCarApply extends Component {
   selectCategory = id => {
     this.setState({
       categoryId: id,
+      showAllCategory: false,
     });
   };
+  toggleCategoryOptions = () => {
+    this.setState(({ showAllCategory }) => ({
+      showAllCategory: !showAllCategory,
+    }));
+  };
   validateForm = () => {
     if (!this.state.categoryId) {
       Toast.fail('请选择用车类型');
@@ -84,6 +92,7 @@ class PublicCarApply extends Component {
     applyPublicCar(entity)
       .then(res => {
         console.log('res: ' + res);
+        Toast.success(res.msg);
       })
       .catch(err => {
         console.log('err: ' + err);
@@ -107,6 +116,7 @@ class PublicCarApply extends Component {
       categoryList,
       categoryId,
       lineDescription,
+      showAllCategory,
     } = this.state;
     return (
       <div className={styles.bg}>
@@ -126,13 +136,35 @@ class PublicCarApply extends Component {
           <div className={styles.listItemAutoHeight}>
             <div className={styles.itemLabel}>用车类型</div>
             <div className={styles.itemValue}>
-              <div className={styles.selectInput}>
+              <div
+                className={styles.selectInput}
+                onClick={this.toggleCategoryOptions}
+              >
                 请选择
                 <span className={styles.arrow}>
                   <img src={arrIcon} alt="" />
                 </span>
               </div>
-              {categoryList.map(i => (
+              {showAllCategory
+                ? categoryList.map(i => (
+                    <div
+                      key={i.id}
+                      className={styles.optionItem}
+                      onClick={() => this.selectCategory(i.id)}
+                    >
+                      <div className={styles.radioLabel}>
+                        {i.id === categoryId ? (
+                          <img src={onCheckIcon} alt="" />
+                        ) : (
+                          <img src={offCheckIcon} alt="" />
+                        )}
+                      </div>
+                      <div className={styles.radioValue}>{i.name}</div>
+                    </div>
+                  ))
+                : categoryList.map(
+                    i =>
+                      categoryId === i.id ? (
                         <div
                           key={i.id}
                           className={styles.optionItem}
@@ -140,12 +172,15 @@ class PublicCarApply extends Component {
                         >
                           <div className={styles.radioLabel}>
                             {i.id === categoryId ? (
-                      <div className={styles.inner} />
-                    ) : null}
+                              <img src={onCheckIcon} alt="" />
+                            ) : (
+                              <img src={offCheckIcon} alt="" />
+                            )}
                           </div>
                           <div className={styles.radioValue}>{i.name}</div>
                         </div>
-              ))}
+                      ) : null
+                  )}
             </div>
           </div>
           <div className={styles.listItem}>

src/containers/PublicCar/PublicCarList.js

 import React, { Component } from 'react';
 import { fetchPublicCarList } from '../../api/index';
-import { PullToRefresh } from 'antd-mobile';
+import { PullToRefresh, Toast } from 'antd-mobile';
 import styles from './style.css';
 import PublicCarItem from './components/PublicCarItem';
 
@@ -13,7 +13,7 @@ class PublicCarList extends Component {
       height: document.documentElement.clientHeight,
       list: [],
       pagination: {
-        lastIndex: null,
+        nowDate: '',
         pageNum: 1,
         pageSize: 50,
       },
@@ -30,7 +30,29 @@ class PublicCarList extends Component {
         }),
       0
     );
-    this.fetchList();
+    const { pagination } = this.state;
+    const nowDate = new Date().toISOString();
+    fetchPublicCarList({
+      ...pagination,
+      nowDate,
+    })
+      .then(res => {
+        console.log(res);
+        this.setState(({ pagination }) => ({
+          list: res.data,
+          pagination: {
+            ...pagination,
+            nowDate,
+          },
+          refreshing: false,
+        }));
+      })
+      .catch(err => {
+        Toast.fail(err.msg || '请求失败！');
+        this.setState({
+          refreshing: false,
+        });
+      });
   }
   fetchList = () => {
     const { pagination } = this.state;
@@ -42,7 +64,6 @@ class PublicCarList extends Component {
             list: res.data,
             pagination: {
               ...pagination,
-              lastIndex: res.data[res.data.length - 1].lastIndex,
             },
           }));
         }
@@ -53,8 +74,27 @@ class PublicCarList extends Component {
   };
   refreshHandle = () => {
     this.setState({ refreshing: true });
-    this.fetchList().then(() => {
-      this.setState({ refreshing: false });
+    const { pagination } = this.state;
+    fetchPublicCarList({
+      ...pagination,
+      pageNum: pagination.pageNum + 1,
+    })
+      .then(res => {
+        console.log(res);
+        this.setState(({ pagination }) => ({
+          list: res.data,
+          pagination: {
+            ...pagination,
+            pageNum: pagination.pageNum + 1,
+          },
+          refreshing: false,
+        }));
+      })
+      .catch(err => {
+        Toast.fail(err.msg || '请求失败！');
+        this.setState({
+          refreshing: false,
+        });
       });
   };
   render() {

src/containers/PublicCarDeal/index.js

@@ -9,6 +9,8 @@ import {
 } from '../../api/index';
 // import Select from '../../components/Input/Select/Select';
 import SelectIcon from './images/more_item_btn@2x.png';
+import offCheckIcon from '../../images/Check/radio_off_btn@2x.png';
+import onCheckIcon from '../../images/Check/radio_on_btn@2x.png';
 
 class PublicCarDeal extends Component {
   constructor(props) {
@@ -33,32 +35,76 @@ class PublicCarDeal extends Component {
     };
   }
   componentDidMount() {
-    this.fetchList();
+    const { pagination } = this.state;
+    const nowDate = new Date().toISOString();
+    fetchApplyPublicCarList({
+      ...pagination,
+      nowDate,
+    })
+      .then(res => {
+        this.setState(({ pagination }) => ({
+          list: res.data,
+          pagination: {
+            ...pagination,
+            nowDate,
+          },
+          refreshing: false,
+        }));
+      })
+      .catch(err => {
+        Toast.fail(err.msg || '请求失败！');
+        this.setState({
+          refreshing: false,
+        });
+      });
   }
   fetchList = fetchMore => {
+    this.setState({ refreshing: true });
     const { pagination } = this.state;
     fetchApplyPublicCarList({
       ...pagination,
-      pageNum: fetchMore ? ++pagination.pageNum : pagination.pageNum,
-    }).then(res => {
-      // const { list, ...pagination } = res.data;
-      // this.setState({
-      //   list: list,
-      //   pagination: pagination,
-      // });
-      if (fetchMore) {
-        this.setState(({ list }) => ({
-          list: [...list, ...res.data],
+      pageNum: pagination.pageNum + 1,
+    })
+      .then(res => {
+        this.setState(({ pagination }) => ({
+          list: res.data,
+          pagination: {
+            ...pagination,
+            pageNum: pagination.pageNum + 1,
+          },
+          refreshing: false,
         }));
-      } else {
+      })
+      .catch(err => {
+        Toast.fail(err.msg || '请求失败！');
         this.setState({
-          list: res.data,
+          refreshing: false,
         });
-      }
       });
   };
   refreshHandle = () => {
-    this.fetchList(true);
+    this.setState({ refreshing: true });
+    const { pagination } = this.state;
+    fetchApplyPublicCarList({
+      ...pagination,
+      pageNum: pagination.pageNum + 1,
+    })
+      .then(res => {
+        this.setState(({ list, pagination }) => ({
+          list: [...list, ...res.data],
+          pagination: {
+            ...pagination,
+            pageNum: pagination.pageNum + 1,
+          },
+          refreshing: false,
+        }));
+      })
+      .catch(err => {
+        Toast.fail(err.msg || '请求失败！');
+        this.setState({
+          refreshing: false,
+        });
+      });
   };
   toggleSelectedState = val => {
     this.setState({
@@ -220,7 +266,11 @@ class PublicCarDeal extends Component {
                 onClick={() => this.toggleSelectedState(1)}
               >
                 <span className={styles.checkLabel}>
-                  <span className={value === 1 ? styles.checkInner : ''} />
+                  {value === 1 ? (
+                    <img src={onCheckIcon} alt="" />
+                  ) : (
+                    <img src={offCheckIcon} alt="" />
+                  )}
                 </span>
                 <span>同意</span>
               </div>
@@ -229,7 +279,11 @@ class PublicCarDeal extends Component {
                 onClick={() => this.toggleSelectedState(2)}
               >
                 <span className={styles.checkLabel}>
-                  <span className={value === 2 ? styles.checkInner : ''} />
+                  {value === 2 ? (
+                    <img src={onCheckIcon} alt="" />
+                  ) : (
+                    <img src={offCheckIcon} alt="" />
+                  )}
                 </span>
                 <span>不同意</span>
               </div>

src/containers/Repair/RepairList.js

 import React, { Component } from 'react';
-import { PullToRefresh, Modal } from 'antd-mobile';
+import { ListView, PullToRefresh, Modal, Toast } from 'antd-mobile';
 import styles from './style.css';
 import RepairItem from './components/RepairItem';
 import { fetchRepairList } from '../../api/index';
@@ -8,15 +8,24 @@ import Perview from '../../components/Perview/Perview';
 class RepairList extends Component {
   constructor(props) {
     super(props);
+    const getSectionData = (dataBlob, sectionID) => dataBlob[sectionID];
+    const getRowData = (dataBlob, sectionID, rowID) => dataBlob[rowID];
+    const list = new ListView.DataSource({
+      getRowData,
+      getSectionHeaderData: getSectionData,
+      rowHasChanged: (row1, row2) => row1 !== row2,
+      sectionHeaderHasChanged: (s1, s2) => s1 !== s2,
+    });
     this.state = {
       refreshing: false,
       down: true,
       height: document.documentElement.clientHeight,
       pagination: {
+        nowDate: '',
         pageNum: 1,
         pageSize: 50,
       },
-      list: [],
+      list: list,
       perviewVisibility: false,
       selectedImgList: [],
       perviewIndex: 0,
@@ -33,20 +42,58 @@ class RepairList extends Component {
       0
     );
     const { pagination } = this.state;
+    const nowDate = new Date().toISOString();
     fetchRepairList({
       ...pagination,
-    }).then(res => {
+      nowDate,
+    })
+      .then(res => {
         console.log(res);
-      this.setState({
+        this.setState(({ pagination }) => ({
           list: res.data,
+          pagination: {
+            ...pagination,
+            nowDate,
+          },
+        }));
+      })
+      .catch(err => {
+        Toast.fail(err.msg || '请求失败！');
+        this.setState({
+          refreshing: false,
         });
       });
   }
   refreshHandle = () => {
     this.setState({ refreshing: true });
-    setTimeout(() => {
-      this.setState({ refreshing: false });
-    }, 1000);
+    const { pagination } = this.state;
+    fetchRepairList({
+      ...pagination,
+      pageNum: pagination.pageNum + 1,
+    })
+      .then(res => {
+        console.log(res);
+        if (res.data.length) {
+          this.setState(({ list, pagination }) => ({
+            refreshing: false,
+            list: [...list, ...res.data],
+            pagination: {
+              ...pagination,
+              pageNum: pagination.pageNum + 1,
+            },
+          }));
+        } else {
+          this.setState({
+            refreshing: false,
+          });
+        }
+      })
+      .catch(err => {
+        Toast.fail(err.msg || '请求失败！');
+        this.setState({
+          refreshing: false,
+        });
+      });
   };
   showViewHandle = (list, index) => {
     this.setState({
@@ -61,9 +108,27 @@ class RepairList extends Component {
     });
   };
   render() {
-    const { perviewVisibility, selectedImgList, perviewIndex } = this.state;
+    const {
+      list,
+      perviewVisibility,
+      selectedImgList,
+      perviewIndex,
+    } = this.state;
     return (
       <div className={styles.repairList}>
+        {/* <ListView
+          style={{
+            height: this.state.height,
+          }}
+          dataSource={list}
+          renderRow={rowData => (
+            <RepairItem
+              key={rowData.id}
+              data={rowData}
+              showView={this.showViewHandle}
+            />
+          )}
+        /> */}
         <PullToRefresh
           damping={60}
           ref={el => (this.ptr = el)}
@@ -77,8 +142,8 @@ class RepairList extends Component {
           onRefresh={this.refreshHandle}
         >
           <div className={styles.listInfo}>显示最近半年的报修记录</div>
-          {this.state.list.length ? (
-            this.state.list.map(i => (
+          {list.length ? (
+            list.map(i => (
               <RepairItem key={i.id} data={i} showView={this.showViewHandle} />
             ))
           ) : (

src/containers/Repair/ReprtRepair.js

 import React, { Component } from 'react';
 import styles from './style.css';
-import { Radio, Toast, Button, TextareaItem, Modal } from 'antd-mobile';
+import { Toast, Button, TextareaItem, Modal } from 'antd-mobile';
 import peopleIcon from './images/repair_people_icon@2x.png';
 import phoneIcon from './images/phone_tel_icon@2x.png';
 import roleIcon from './images/user_role_icon@2x.png';
@@ -15,6 +15,8 @@ import { reportRepair } from '../../api/repairAdd';
 import Perview from '../../components/Perview/Perview';
 import store from '../../store/index';
 import UserInfoContext from '../../context/userinfo-context';
+import offCheckIcon from '../../images/Check/radio_off_btn@2x.png';
+import onCheckIcon from '../../images/Check/radio_on_btn@2x.png';
 
 class ReprtRepair extends Component {
   constructor(props) {
@@ -152,7 +154,7 @@ class ReprtRepair extends Component {
     if (!this.validateForm()) {
       return;
     }
-
+    Toast.loading('请求中', 99);
     let formData = new FormData();
     this.state.applyForm.uploadImg.map(i => {
       if (i) {
@@ -183,9 +185,12 @@ class ReprtRepair extends Component {
         console.log(res);
         console.log('resetForm');
         this.resetApplyForm();
+        Toast.hide();
+        Toast.success(res.msg);
       })
       .catch(err => {
         console.log(err);
+        Toast.hide();
       });
   };
   resetDialog = () => {
@@ -244,15 +249,47 @@ class ReprtRepair extends Component {
           <div className={styles.inputBoxNoBB}>
             {/* <input className={styles.input} type="text" /> */}
 
-            <Radio
+            <div
+              className={styles.checkBox}
+              onClick={() =>
+                this.onChangeHandle({
+                  target: { name: 'applyIdentity', value: '老师' },
+                })
+              }
+            >
+              <div className={styles.checkLabel}>
+                {applyForm.applyIdentity === '老师' ? (
+                  <img src={onCheckIcon} alt="" />
+                ) : (
+                  <img src={offCheckIcon} alt="" />
+                )}
+              </div>
+              <div>老师</div>
+            </div>
+            <div
+              className={styles.checkBox}
+              onClick={() =>
+                this.onChangeHandle({
+                  target: { name: 'applyIdentity', value: '学生' },
+                })
+              }
+            >
+              <div className={styles.checkLabel}>
+                {applyForm.applyIdentity === '学生' ? (
+                  <img src={onCheckIcon} alt="" />
+                ) : (
+                  <img src={offCheckIcon} alt="" />
+                )}
+              </div>
+              <div>学生</div>
+            </div>
+            {/* <Radio
               className="my-radio"
               name="applyIdentity"
               value="老师"
               checked={applyForm.applyIdentity === '老师'}
               onChange={this.onChangeHandle}
-            >
-              老师
-            </Radio>
+            />
             <Radio
               className="my-radio"
               name="applyIdentity"
@@ -261,7 +298,7 @@ class ReprtRepair extends Component {
               onChange={this.onChangeHandle}
             >
               学生
-            </Radio>
+            </Radio> */}
           </div>
         </div>
         <div className={styles.listItem}>

src/containers/Repair/style.css

@@ -87,34 +87,19 @@
 .inputBoxNoBB::after {
   display: none;
 }
-:global(.my-radio) {
-  color: #666;
-  margin-right: 20px;
+.checkBox {
+  display: inline-flex;
+  align-items: center;
+  margin-right: 60px;
 }
-:global(.my-radio .am-radio) {
-  box-sizing: border-box;
-  width: 30px;
-  height: 30px;
-  border: 1px solid #666;
-  border-radius: 50%;
-  margin-right: 10px;
+.checkBox:last-child {
+  margin-right: 0;
 }
-:global(.my-radio .am-radio-inner) {
+.checkLabel {
   width: 30px;
   height: 30px;
-  left: 0;
-  top: 0;
-}
-:global(.my-radio .am-radio-inner::after) {
-  content: '';
-  width: 15px;
-  height: 15px;
-  top: 5px;
-  left: 5px;
-  background-color: #3695c0;
-  border-radius: 50%;
+  margin-right: 10px;
 }
-
 .radio {
   position: relative;
   display: inline-block;

src/containers/RepairDeal/index.js

@@ -4,6 +4,7 @@ import styles from './style.css';
 import RepairItem from '../Repair/components/RepairItem';
 import { fetchReportRepairList, dealRepair } from '../../api/index';
 import Perview from '../../components/Perview/Perview';
+import onCheckIcon from '../../images/Check/radio_on_btn@2x.png';
 
 class RepairDeal extends Component {
   constructor(props) {
@@ -13,75 +14,93 @@ class RepairDeal extends Component {
       down: true,
       height: document.documentElement.clientHeight,
       pagination: {
+        nowDate: '',
         pageNum: 1,
         pageSize: 50,
       },
-      list: [
-        {
-          address: '该卡北师大ask绝对不阿斯顿快捷巴士的科比爱的快捷巴士的空间',
-          applyCellphone: '18108099999',
-          applyIdentity: 'string',
-          area: 'string',
-          areaId: 0,
-          createDate: '2018-09-27T03:18:47.973Z',
-          dealDate: '2018-09-27T03:18:47.973Z',
-          dealState: 1,
-          endDate: '2018-09-27T03:18:47.973Z',
-          id: 0,
-          name: 'string',
-          pageNum: 0,
-          pageSize: 0,
-          repairCellphone: 'string',
-          startDate: '2018-09-27T03:18:47.973Z',
-          term: 'f阿斯顿 adasdasdasdasdasd',
-          termId: 0,
-          uploadImg: 'string',
-          userId: 0,
-        },
-        {
-          address: 'string',
-          applyCellphone: 'string',
-          applyIdentity: 'string',
-          area: 'string',
-          areaId: 0,
-          createDate: '2018-09-27T03:18:47.973Z',
-          dealDate: '2018-09-27T03:18:47.973Z',
-          dealState: 2,
-          endDate: '2018-09-27T03:18:47.973Z',
-          id: 1,
-          name: 'string',
-          pageNum: 0,
-          pageSize: 0,
-          repairCellphone: 'string',
-          startDate: '2018-09-27T03:18:47.973Z',
-          term: 'string',
-          termId: 0,
-          uploadImg: '',
-          userId: 0,
-        },
-      ],
+      list: [],
     };
   }
   componentDidMount() {
-    this.fetchList();
+    const { pagination } = this.state;
+    const nowDate = new Date().toISOString();
+    fetchReportRepairList({
+      ...pagination,
+      nowDate,
+    })
+      .then(res => {
+        console.log(res);
+        this.setState(({ pagination }) => ({
+          list: res.data,
+          pagination: {
+            ...pagination,
+            nowDate,
+          },
+          refreshing: false,
+        }));
+      })
+      .catch(err => {
+        Toast.fail(err.msg || '请求失败！');
+        this.setState({
+          refreshing: false,
+        });
+      });
   }
   fetchList = () => {
     const { pagination } = this.state;
+    const nowDate = new Date().toISOString();
     fetchReportRepairList({
       ...pagination,
-    }).then(res => {
-      // const { list, ...pagination } = res.data;
-      // this.setState({
-      //   list: list,
-      //   pagination: pagination,
-      // });
-      this.setState({
+      nowDate,
+    })
+      .then(res => {
+        console.log(res);
+        this.setState(({ pagination }) => ({
           list: res.data,
+          pagination: {
+            ...pagination,
+            nowDate,
+          },
+          refreshing: false,
+        }));
+      })
+      .catch(err => {
+        Toast.fail(err.msg || '请求失败！');
+        this.setState({
+          refreshing: false,
         });
       });
   };
   refreshHandle = () => {
-    this.fetchList();
+    this.setState({ refreshing: true });
+    const { pagination } = this.state;
+    fetchReportRepairList({
+      ...pagination,
+      pageNum: pagination.pageNum + 1,
+    })
+      .then(res => {
+        console.log(res);
+        if (res.data.length) {
+          this.setState(({ list, pagination }) => ({
+            refreshing: false,
+            list: [...list, ...res.data],
+            pagination: {
+              ...pagination,
+              pageNum: pagination.pageNum + 1,
+            },
+          }));
+        } else {
+          this.setState({
+            refreshing: false,
+          });
+        }
+      })
+      .catch(err => {
+        Toast.fail(err.msg || '请求失败！');
+        this.setState({
+          refreshing: false,
+        });
+      });
   };
   dealHandle = id => {
     console.log('in date');
@@ -89,7 +108,7 @@ class RepairDeal extends Component {
       '',
       <div className={styles.alertInfo}>
         <span className={styles.checkLabel}>
-          <span className={styles.checkInner} />
+          <img src={onCheckIcon} alt="" />
         </span>
         <span>已处理</span>
       </div>,

src/containers/RepairDeal/style.css

@@ -16,8 +16,6 @@
   margin-right: 14px;
   width: 30px;
   height: 30px;
-  border: 1px solid #666;
-  border-radius: 50%;
   position: relative;
 }
 .checkInner {

src/context/userinfo-context.js

@@ -2,7 +2,7 @@ import React from 'react';
 
 export const defaultUserinfo = {
   login: false,
-  userId: '15',
+  userId: '',
   cellphone: '',
   name: '',
   department: '',

src/store/index.js

 class Store {
   constructor() {
-    this.userId = '1';
+    this.userId = '34';
   }
   getUserId = () => {
     return this.userId;