Skip to content

C
cdsf-wx-app
Commit 0a46b9c3 by 姜雷
Options

添加图片资源和接口调用

parent ebce654f
Showing with 342 additions and 18 deletions
src/api/fetch.js
......@@ -2,8 +2,9 @@ import axios from 'axios';
import config from '../config/index';
import errorHandle from './errorHandle';
// import store from '../store/index';
import { Toast } from 'antd-mobile';
const path = config.SERVER_URL + '/dcxy/api/gx/construction';
const path = config.SERVER_URL;
// 创建axios实例
const service = axios.create({
baseURL: path, // api的base_url
......@@ -13,7 +14,7 @@ const service = axios.create({
service.interceptors.request.use(
conf => {
// let token = store.getToken();
Toast.loading('Loading...', 10);
conf.headers = {
...conf.headers,
reqSource: 'wx',
......@@ -28,17 +29,24 @@ service.interceptors.request.use(
);
// respone拦截器
service.interceptors.response.use(response => {
const res = response.data;
service.interceptors.response.use(
response => {
const res = response.data;
/**
* code为非'0'是抛错
*/
if (res.code !== 1000) {
return Promise.reject(response.data);
} else {
return response.data;
Toast.hide();
/**
* code为非1000是抛错
*/
if (res.code !== 1000) {
return Promise.reject(response.data);
} else {
return response.data;
}
},
err => {
Toast.hide();
return errorHandle(err);
}
}, errorHandle);
);
export default service;
src/api/index.js
import fetch from './fetch';
// login
export const sendMsg = entity =>
fetch({
url: '/login/sendMsg',
params: entity,
});
// publicCar
export const fetchPublicCarList = entity =>
fetch({
url: '/publicCar/app/pageList4PublicCar',
......@@ -24,6 +31,7 @@ export const dealPublicCar = entity =>
params: entity,
});
// repair
export const fetchRepairList = entity =>
fetch({
url: '/repair/app/pageList4Repair',
......
src/config/index.js
export const APP_ID = 'wxed39740c39fa1c0a';
export const SERVER_URL = 'http://ex-dev-gx-manager.168cad.top';
// export const SERVER_URL = 'http://192.168.1.150:8080';
// export const SERVER_URL = 'http://ex-dev-gx-manager.168cad.top';
export const SERVER_URL = 'http://192.168.1.33:8888';
export default {
APP_ID,
......
src/containers/App.js
......@@ -10,6 +10,7 @@ import Report from './report/report';
import Login from './Login/Login';
import PublicCarList from './PublicCar/PublicCarList';
import PublicCarApply from './PublicCar/PublicCarApply';
import Repair from './Repair/index';
import NoMatch from './NoMatch';
class App extends Component {
......@@ -90,6 +91,7 @@ class App extends Component {
<Route path="/login" component={Login} />
<Route path="/PublicCarList" component={PublicCarList} />
<Route path="/PublicCarApply" component={PublicCarApply} />
<Route path="/Repair" component={Repair} />
<Route component={NoMatch} />
</Switch>
</UserInfoContext.Provider>
......
src/containers/PublicCar/PublicCarApply.js
import React, { Component } from 'react';
import { List, InputItem, DatePicker, Button, Toast } from 'antd-mobile';
import styles from './style.css';
import { applyPublicCar, sendMsg } from '../../api/index';
const minDate = new Date();
class PublicCarApply extends Component {
state = {
department: '',
createDate: '',
name: '',
categoryName: '',
userCount: '',
beginDate: '',
endDate: '',
lineDescription: '',
};
onSubmit = () => {
// applyPublicCar({
// ...this.state,
// })
// .then(res => {
// console.log('res: ' + res);
// })
// .catch(err => {
// console.log('err: ' + err);
// });
sendMsg({
cellphone: '18108096099',
})
.then(res => {
console.log(res);
Toast.success('发送成功！');
})
.catch(err => {
console.log(err);
});
};
render() {
return (
<div>
PublicCarApply
<div className={styles.bg}>
公务约车
<List className={styles.content}>
<InputItem clear placeholder="用车部门">
用车部门
</InputItem>
<InputItem clear placeholder="申请时间">
申请时间
</InputItem>
<InputItem clear placeholder="申请人">
申请人
</InputItem>
<InputItem clear placeholder="用车类型">
用车类型
</InputItem>
<InputItem clear placeholder="用车人数">
用车人数
</InputItem>
<DatePicker
minDate={minDate}
value={this.state.beginDate}
onChange={date => this.setState({ beginDate: date })}
>
<List.Item arrow="horizontal">用车开始时间</List.Item>
</DatePicker>
<DatePicker
minDate={this.state.beginDate}
value={this.state.endDate}
onChange={date => this.setState({ endDate: date })}
>
<List.Item arrow="horizontal">用车结束时间</List.Item>
</DatePicker>
</List>
<Button type="primary" size="small" inline onClick={this.onSubmit}>
提交
</Button>
</div>
);
}
}
export default PublicCarApply;
\ No newline at end of file
export default PublicCarApply;
src/containers/PublicCar/style.css 0 → 100644
.bg {
width: 100%;
height: 100%;
background-color: #fff;
}
src/containers/Repair/RepairList.js 0 → 100644
import React, { Component } from 'react';
class RepairList extends Component {
render() {
return (
<div>
保修记录
</div>
);
}
}
export default RepairList;
\ No newline at end of file
src/containers/Repair/ReprtRepair.js 0 → 100644
import React, { Component } from 'react';
import styles from './style.css';
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';
import areaIcon from './images/repair_area_icon@2x.png';
import typeIcon from './images/repair_item_icon@2x.png';
import addrIcon from './images/repair_addr_icon@2x.png';
import imgIcon from './images/upload_pic_icon@2x.png';
class ReprtRepair extends Component {
render() {
return (
<div className={styles.wrap}>
<div className={styles.listItem}>
<i className={styles.itemIcon}>
<img src={peopleIcon} alt="" />
</i>
<span className={styles.itemLabel}>报修人</span>
<div className={styles.inputBox}>
<input className={styles.input} type="text" />
</div>
</div>
<div className={styles.listItem}>
<i className={styles.itemIcon}>
<img src={phoneIcon} alt="" />
</i>
<span className={styles.itemLabel}>报修人tel</span>
<div className={styles.inputBox}>
<input className={styles.input} type="text" />
</div>
</div>
<div className={styles.listItem}>
<i className={styles.itemIcon}>
<img src={roleIcon} alt="" />
</i>
<span className={styles.itemLabel}>报修身份</span>
<div className={styles.inputBox}>
<input className={styles.input} type="text" />
</div>
</div>
<div className={styles.listItem}>
<i className={styles.itemIcon}>
<img src={areaIcon} alt="" />
</i>
<span className={styles.itemLabel}>报修区域</span>
<div className={styles.inputBox}>
<input className={styles.input} type="text" />
</div>
</div>
<div className={styles.listItem}>
<i className={styles.itemIcon}>
<img src={typeIcon} alt="" />
</i>
<span className={styles.itemLabel}>报修项目</span>
<div className={styles.inputBox}>
<input className={styles.input} type="text" />
</div>
</div>
<div className={styles.listItem}>
<i className={styles.itemIcon}>
<img src={addrIcon} alt="" />
</i>
<span className={styles.itemLabel}>报修地址</span>
</div>
<div className={styles.listItem}>
<i className={styles.itemIcon}>
<img src={imgIcon} alt="" />
</i>
<span className={styles.itemLabel}>上传图片</span>
</div>
</div>
);
}
}
export default ReprtRepair;
src/containers/Repair/index.js 0 → 100644
import React, { Component } from 'react';
import { Switch, Route, Redirect } from 'react-router-dom';
import styles from './style.css';
import ReprtRepair from './ReprtRepair';
import RepairList from './RepairList';
class index extends Component {
state = {
tab: 'ReprtRepair',
};
toggleRouteHandle = name => {
if (name === this.state.tab) return;
console.log(name);
const { history } = this.props;
this.setState({
tab: name,
});
history.replace('/repair/' + name);
};
render() {
const { tab } = this.state;
return (
<div className="Content-Wrap">
<div className={styles.content}>
<Switch>
<Route path="/repair/ReprtRepair" component={ReprtRepair} />
<Route path="/repair/RepairList" component={RepairList} />
<Route render={() => <Redirect to="/repair/ReprtRepair" />} />
</Switch>
</div>
<div className={styles.footer}>
<span
className={`${[styles['footer-item']]} ${
tab === 'ReprtRepair' ? styles.activated : ''
}`}
onClick={() => this.toggleRouteHandle('ReprtRepair')}
>
报修服务
</span>
<span className={styles.line}></span>
<span
className={`${[styles['footer-item']]} ${
tab === 'RepairList' ? styles.activated : ''
}`}
onClick={() => this.toggleRouteHandle('RepairList')}
>
报修记录
</span>
</div>
</div>
);
}
}
export default index;
src/containers/Repair/style.css 0 → 100644
/* index */
.content {
flex: auto;
}
.footer {
width: 100%;
height: 80px;
line-height: 80px;
display: flex;
justify-content: center;
align-items: center;
font-size: 30px;
color: #999;
}
.line {
width: 2px;
height: 50px;
background-color: #f0f0f0;
}
.footer-item {
margin: 0 80px;
}
.activated {
color: #3695c0;
}
/* Report */
.wrap {
width: 100%;
height: 100%;
overflow-y: scroll;
}
.listItem {
margin-top: 32px;
height: 48px;
line-height: 48px;
display: flex;
align-items: center;
padding: 0 40px;
}
.itemIcon {
width: 30px;
height: 30px;
overflow: hidden;
}
.itemLabel {
width: 120px;
margin: 0 12px 0 10px;
font-size: 26px;
color: #333;
text-align: justify;
text-justify: distribute-all-lines;
text-align-last: justify;
}
.inputBox {
position: relative;
flex: auto;
}
.input {
border: none;
width: 100%;
height: 100%;
padding: 0;
text-align: center;
font-size: 26px;
color: #666;
}
.inputBox::after {
content: '';
position: absolute;
background-color: #f0f0f0;
display: block;
z-index: 1;
top: auto;
right: auto;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
transform-origin: 50% 100%;
transform: scaleY(0.5);
}
src/styles/index.css
......@@ -99,3 +99,10 @@ img {
overflow: hidden;
overflow-y: scroll;
}
:global(.Content-Wrap) {
background-color: #fff;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment