Skip to content

S
shuniu-admin-react
Commit bad46fae authored by superman's avatar superman
Browse files
Options

update

parent 11ac5abf
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1225 additions and 650 deletions
.idea/workspace.xml
View file @ bad46fae
This diff is collapsed.
dist/index.css
View file @ bad46fae
This diff is collapsed.
dist/index.js
View file @ bad46fae
This diff is collapsed.
proxy.config.js
View file @ bad46fae
...@@ -2,6 +2,6 @@ ...@@ -2,6 +2,6 @@
// - https://github.com/dora-js/dora-plugin-proxy#规则定义 // - https://github.com/dora-js/dora-plugin-proxy#规则定义
module.exports = { module.exports = {
// '/api/*': 'http://react.yanky.cn/', '/api/*': 'http://react.yanky.cn/',
'/api/*': 'http://192.168.1.126:8080/' // '/api/*': 'http://192.168.1.126:8080/'
}; };
src/components/Layout/Layout.less
View file @ bad46fae
.layout { .layout {
font-size: 14px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
...@@ -11,6 +10,18 @@ ...@@ -11,6 +10,18 @@
width: 100%; width: 100%;
& > div { & > div {
height: 100%; height: 100%;
&:global(.ant-spin.ant-spin-spinning) {
width: 100%;
position: relative;
:global {
.ant-spin-dot {
position: absolute;
top: 50%;
left: 50%;
margin: -25px 0 0 -25px;
}
}
}
& > :global(.ant-spin-container) { & > :global(.ant-spin-container) {
height: 100%; height: 100%;
& > :global(.ant-form-horizontal) { & > :global(.ant-form-horizontal) {
......
src/components/MainHeader/MainHeader.jsx
View file @ bad46fae
...@@ -3,7 +3,8 @@ import React, {Component, PropTypes} from 'react'; ...@@ -3,7 +3,8 @@ import React, {Component, PropTypes} from 'react';
import { import {
Row, Row,
Col, Col,
Breadcrumb Breadcrumb,
Icon
} from 'antd'; } from 'antd';
...@@ -24,6 +25,7 @@ export default class MainHeader extends Component { ...@@ -24,6 +25,7 @@ export default class MainHeader extends Component {
<Row className={styles.header} type="flex" justify="space-around" align="middle"> <Row className={styles.header} type="flex" justify="space-around" align="middle">
<Col span="16" style={{paddingLeft: 20}}> <Col span="16" style={{paddingLeft: 20}}>
<h1>{title}</h1> <h1>{title}</h1>
<Icon type="heart"/>
<Breadcrumb> <Breadcrumb>
{ breadcrumb.map((b, i)=><Breadcrumb.Item key={i}>{b}</Breadcrumb.Item>) } { breadcrumb.map((b, i)=><Breadcrumb.Item key={i}>{b}</Breadcrumb.Item>) }
</Breadcrumb> </Breadcrumb>
......
src/components/MainHeader/MainHeader.less
View file @ bad46fae
...@@ -17,14 +17,21 @@ ...@@ -17,14 +17,21 @@
font-size: 18px; font-size: 18px;
margin-top: 5px; margin-top: 5px;
} }
:global { :global {
.ant-breadcrumb { .ant-breadcrumb {
color: #ccc; color: #ccc;
font-weight: 300; font-weight: 300;
display: inline-block;
& > span:last-child { & > span:last-child {
color: #aaa; color: #aaa;
} }
} }
.anticon.anticon-heart {
color: #93cc93;
margin-right: 5px;
font-size: 10px;
}
} }
} }
...@@ -32,4 +39,5 @@ ...@@ -32,4 +39,5 @@
padding: 10px 20px; padding: 10px 20px;
.borderBottom; .borderBottom;
} }
} }
src/containers/Announcement/EditItem.jsx
View file @ bad46fae
...@@ -27,12 +27,15 @@ import {formItemLayout, footerFormSubmitLayout} from '../../utils'; ...@@ -27,12 +27,15 @@ import {formItemLayout, footerFormSubmitLayout} from '../../utils';
@connect(state=>({ @connect(state=>({
loading: state.announcement.loading, loading: state.announcement.loading,
announcement: state.announcement.item, item: state.announcement.item,
})) }))
@Form.create() @Form.create()
export default class EditItem extends Component { export default class EditItem extends Component {
constructor() { constructor() {
super(...arguments); super(...arguments);
this.state = {
isEdit: false
}
} }
...@@ -40,6 +43,10 @@ export default class EditItem extends Component { ...@@ -40,6 +43,10 @@ export default class EditItem extends Component {
this.fetchItem(this.props.params.id); this.fetchItem(this.props.params.id);
}; };
componentWillReceiveProps(nextProps){
}
fetchItem(id) { fetchItem(id) {
this.props.dispatch({ this.props.dispatch({
type: 'FETCH_ANNOUNCEMENT_ITEM', type: 'FETCH_ANNOUNCEMENT_ITEM',
...@@ -50,7 +57,7 @@ export default class EditItem extends Component { ...@@ -50,7 +57,7 @@ export default class EditItem extends Component {
handleSubmit(e) { handleSubmit(e) {
e.preventDefault(); e.preventDefault();
const data = this.props.form.getFieldsValue(); const data = this.props.form.getFieldsValue();
data.id = this.props.announcement.id; data.id = this.props.item.id;
console.log(data); console.log(data);
this.props.dispatch({ this.props.dispatch({
type: 'UPDATE_ANNOUNCEMENT_ITEM', type: 'UPDATE_ANNOUNCEMENT_ITEM',
...@@ -59,48 +66,80 @@ export default class EditItem extends Component { ...@@ -59,48 +66,80 @@ export default class EditItem extends Component {
} }
render() { render() {
const {announcement, loading, form:{getFieldProps}, location:{query}} = this.props; const {item, loading, form:{getFieldProps}, location:{query}} = this.props;
const {isEdit} = this.state;
const operation = ( const operation = (
<div style={{textAlign:'right'}}> <div style={{textAlign:'right'}}>
<Button.Group> <Button.Group>
<Button type="ghost" onClick={e=>{e.preventDefault(); this.props.history.goBack();}}> <Button type="ghost" onClick={e=>{e.preventDefault(); this.setState({isEdit: !this.state.isEdit})}}>
<Icon type="edit"/>
</Button>
<Button type="ghost" onClick={e=>{
e.preventDefault();
isEdit ? this.setState({isEdit: !this.state.isEdit}) : this.props.history.goBack();
}}>
<Icon type="rollback"/> <Icon type="rollback"/>
</Button> </Button>
</Button.Group> </Button.Group>
</div> </div>
); );
const breadcrumb = ['产品管理', '产品详情'];
const titlePart = isEdit ? '修改公告' : '公告详情';
const title = (item && item.title ? item.title + ' - ' : '') + titlePart;
breadcrumb.push(titlePart);
const header = ( const header = (
<MainHeader breadcrumb={['产品管理', '产品详情', '修改公告']} <MainHeader breadcrumb={breadcrumb} title={title} operation={operation}/>
title={(query && query.title ? query.title + ' - ' : '') + '修改公告'}
operation={operation}
/>
); );
return ( return (
<Layout header={header}> <Layout header={header}>
<Spin spinning={loading}> <Spin spinning={loading}>
{ {
announcement && item &&
<Form className="main-form" horizontal onSubmit={this.handleSubmit.bind(this)}> <Form className="main-form" horizontal onSubmit={this.handleSubmit.bind(this)}>
<Form.Item label="标题" {...formItemLayout}> <Form.Item label="标题" {...formItemLayout}>
<Input placeholder="公告标题" {
{...getFieldProps('title', { isEdit ?
initialValue: announcement.title <Input placeholder="公告标题"
})} /> {...getFieldProps('title', {
initialValue: item.title
})} />
:
item.title
}
</Form.Item> </Form.Item>
<Form.Item label="内容" {...formItemLayout}> <Form.Item label="内容" {...formItemLayout}>
<Input placeholder="公告内容" autosize={{ minRows: 5 }} type="textarea" {
{...getFieldProps('announcement', { isEdit ?
initialValue: announcement.announcement <Input placeholder="公告内容" autosize={{ minRows: 5 }} type="textarea"
})} /> {...getFieldProps('announcement', {
initialValue: item.announcement
})} />
: item.announcement
}
</Form.Item> </Form.Item>
<Form.Item {...footerFormSubmitLayout} style={{marginTop:30}}> <Form.Item {...footerFormSubmitLayout} style={{marginTop:30}}>
<Button type="primary" htmlType="submit" loading={loading}><Icon {
type="save"/>修改</Button> isEdit ?
<Button onClick={e=>{e.preventDefault(); this.props.history.goBack();}} <Button type="primary" htmlType="submit" loading={loading}>
style={{marginLeft:'1em'}}> <Icon type="save"/>修改
</Button>
:
<Button type="primary"
onClick={e=>{e.preventDefault(); this.setState({isEdit: !this.state.isEdit})}}>
<Icon type="edit"/>编辑
</Button>
}
<Button style={{marginLeft:'1em'}} onClick={e=>{
e.preventDefault();
isEdit ? this.setState({isEdit: !this.state.isEdit}) : this.props.history.goBack();
}}>
<Icon type="rollback"/>返回 <Icon type="rollback"/>返回
</Button> </Button>
</Form.Item> </Form.Item>
......
src/containers/Announcement/List.jsx
View file @ bad46fae
...@@ -33,7 +33,7 @@ export default class List extends Component { ...@@ -33,7 +33,7 @@ export default class List extends Component {
}; };
handleRowClick({id}) { handleRowClick({id}) {
this.props.history.push('/announcement/' + id + '/edit'); this.props.history.push('/announcement/' + id );
} }
handleFilterVisible() { handleFilterVisible() {
......
src/containers/App/App.jsx
View file @ bad46fae
...@@ -23,57 +23,96 @@ export default class App extends Component { ...@@ -23,57 +23,96 @@ export default class App extends Component {
render() { render() {
const styles = require('./App.less'); const styles = require('./App.less');
const mainMenu = [ const menu = [
{ {
title: '产品管理', title: '业务管理',
icon: 'mail',
items: [ items: [
{ {
to: '/products', title: '产品管理',
cn: '产品列表', items: [
en: 'Products' {
to: '/products',
cn: '产品列表',
en: 'Products'
}, {
to: '/products/create',
cn: '添加产品',
en: 'Add Products'
}
]
}, { }, {
to: '/products/create', title: '订单管理',
cn: '添加产品', items: [
en: 'Add Products' {
} to: '/trades',
] cn: '订单列表',
}, { en: 'Trades'
title: '订单管理', }
items: [ ]
{ }, {
to: '/trades', title: '审核管理',
cn: '订单列表', items: [
en: 'Trades' {
to: '/remittance/audits',
cn: '报单审核',
en: 'Remittance Audits'
}, {
to: '/withdraw/audits',
cn: '提现审核',
en: 'Withdraw Money'
}
]
}, {
title: '消息管理',
items: [
{
to: '/customMessages',
cn: '消息列表',
en: 'Messages'
}, {
to: '/customMessages/create',
cn: '推送消息',
en: 'Send Message'
}
]
} }
] ]
}, { }, {
title: '审核管理', title: '基础功能',
icon: 'folder',
items: [ items: [
{ {
to: '/remittance/audits', title: '文件管理',
cn: '报单审核', items: [
en: 'Remittance Audits' {
}, { to: '/upload',
to: '/withdraw/audits', cn: '图片上传',
cn: '提现审核', en: 'Upload Images'
en: 'Withdraw Money' }
]
} }
] ]
}, { }, {
title: '消息管理', title: '管理员',
icon: 'folder',
items: [ items: [
{ {
to: '/customMessages', title: '用户管理',
cn: '消息列表', items: [
en: 'Messages' {
}, { to: '/admin/users',
to: '/customMessages/create', cn: '用户列表',
cn: '推送消息', en: 'Users'
en: 'Send Message' }, {
to: '/admin/users/create',
cn: '创建用户',
en: 'Create user'
}
]
} }
] ]
} }];
];
const {user} = this.props; const {user} = this.props;
...@@ -86,37 +125,22 @@ export default class App extends Component { ...@@ -86,37 +125,22 @@ export default class App extends Component {
</header> </header>
<section> <section>
<Menu mode="inline" defaultOpenKeys={['sub1']}> <Menu mode="inline" defaultOpenKeys={['sub1']}>
<SubMenu key="sub1" title={<span><Icon type="mail" /><span>业务管理</span></span>}> {user && user.token &&
{ menu.map((submenu, si)=>
user && user.token && <SubMenu key={'submenu'+si} title={
mainMenu.map((menu, mi)=> <span><Icon type={submenu.icon} /><span>{submenu.title}</span></span>
<MenuItemGroup title={menu.title} key={mi}> }>
{ {submenu.items.map((menus, mi)=>
menu.items.map((item, ii)=> <MenuItemGroup key={'menu-item-group-'+si+'-'+ mi} title={menus.title}>
<Menu.Item key={[mi,ii].join('-')}> {menus.items.map((item, ii)=>
<MenuItemContent {...item}/> <Menu.Item key={[si, mi,ii].join('-')}>
</Menu.Item> <MenuItemContent {...item}/>
) </Menu.Item>
} )}
</MenuItemGroup> </MenuItemGroup>
) )}
} </SubMenu>
</SubMenu> )}
<SubMenu key="sub2" title={<span><Icon type="folder" /><span>基本功能</span></span>}>
<Menu.Item>
<MenuItemContent to="/upload" cn="图片上传" en="Upload Images"/>
</Menu.Item>
</SubMenu>
<SubMenu key="sub3" title={<span><Icon type="folder" /><span>管理员</span></span>}>
<MenuItemGroup title='用户管理' key='users'>
<Menu.Item>
<MenuItemContent to="/admin/users" cn="用户列表" en="Users"/>
</Menu.Item>
<Menu.Item>
<MenuItemContent to="/admin/users/create" cn="创建用户" en="Create users"/>
</Menu.Item>
</MenuItemGroup>
</SubMenu>
</Menu> </Menu>
</section> </section>
<footer> <footer>
...@@ -173,6 +197,37 @@ class MenuItemContent extends Component { ...@@ -173,6 +197,37 @@ class MenuItemContent extends Component {
//<div className={styles.normal}></div> //<div className={styles.normal}></div>
// <SubMenu key="sub1" title={<span><Icon type="mail" /><span>业务管理</span></span>}>
// {
// user && user.token &&
// mainMenu.map((menu, mi)=>
// <MenuItemGroup title={menu.title} key={mi}>
// {
// menu.items.map((item, ii)=>
// <Menu.Item key={[mi,ii].join('-')}>
// <MenuItemContent {...item}/>
// </Menu.Item>
// )
// }
// </MenuItemGroup>
// )
// }
// </SubMenu>
// <SubMenu key="sub2" title={<span><Icon type="folder" /><span>基本功能</span></span>}>
// <Menu.Item>
// <MenuItemContent to="/upload" cn="图片上传" en="Upload Images"/>
// </Menu.Item>
// </SubMenu>
// <SubMenu key="sub3" title={<span><Icon type="folder" /><span>管理员</span></span>}>
// <MenuItemGroup title='用户管理' key='users'>
// <Menu.Item>
// <MenuItemContent to="/admin/users" cn="用户列表" en="Users"/>
// </Menu.Item>
// <Menu.Item>
// <MenuItemContent to="/admin/users/create" cn="创建用户" en="Create users"/>
// </Menu.Item>
// </MenuItemGroup>
// </SubMenu>
......
src/containers/Product/EditItem.jsx
View file @ bad46fae
...@@ -48,11 +48,14 @@ export default class EditItem extends Component { ...@@ -48,11 +48,14 @@ export default class EditItem extends Component {
constructor() { constructor() {
super(...arguments); super(...arguments);
this.state = {
isEdit: false
}
} }
componentWillMount() { componentDidMount() {
if (!this.props.cates.length) { if (!(this.props.cates && this.props.cates.length)) {
this.fetchCates(); this.fetchCates();
} }
this.fetchItem(this.props.params.id); this.fetchItem(this.props.params.id);
...@@ -78,43 +81,53 @@ export default class EditItem extends Component { ...@@ -78,43 +81,53 @@ export default class EditItem extends Component {
const styles = require('./Product.less'); const styles = require('./Product.less');
const tabs = [{ const tabs = [
tab: '基本信息', { tab: '基本信息', children: BaseInfoForm },
children: BaseInfoForm { tab: '收益佣金', children: ShouyiYongjingForm },
}, { { tab: '汇款账号', children: HuikuanInfoForm },
tab: '收益佣金', { tab: '基本要素', children: ElementForm },
children: ShouyiYongjingForm { tab: '时间状态', children: DateTimeStatusForm },
}, { { tab: '相关附件', children: DocumentsForm },
tab: '汇款账号', { tab: '服务经理', children: ContactForm }
children: HuikuanInfoForm ].map((tabPane, index)=> {
}, {
tab: '基本要素',
children: ElementForm
}, {
tab: '时间状态',
children: DateTimeStatusForm
}, {
tab: '相关附件',
children: DocumentsForm
}, {
tab: '服务经理',
children: ContactForm
}].map((tabPane, index)=> {
tabPane.key = 'tabs-pane-' + (index + 1); tabPane.key = 'tabs-pane-' + (index + 1);
return tabPane; return tabPane;
}); });
const {isEdit} = this.state;
const operation = (
<div style={{textAlign:'right'}}>
<Button.Group>
{
product &&
<Button type="ghost"
onClick={e=>{e.preventDefault(); this.setState({isEdit: !this.state.isEdit})}}>
<Icon type="edit"/>
</Button>
}
<Button type="ghost" onClick={e=>{
e.preventDefault();
isEdit ?
this.setState({isEdit: !this.state.isEdit}) :
this.props.history.goBack();
}}>
<Icon type="rollback"/>
</Button>
</Button.Group>
</div>
);
const header = (<MainHeader breadcrumb={['产品管理', '产品详情']} const title = (product && product.itemShortTitle ? product.itemShortTitle + ' - ' : '') + '产品详情';
title={(product && product.itemShortTitle ? product.itemShortTitle + ' - ' : '') + '产品详情'}/>);
const header = (<MainHeader breadcrumb={['产品管理', '产品详情']} title={title} operation={operation}/>);
return ( return (
<Layout header={header}> <Layout header={header}>
<Tabs className={styles.tabs} tabPosition="left"> <Tabs className={styles.tabs} tabPosition="left">
{ tabs.map(tp=> { tabs.map(tp=>
<Tabs.TabPane tab={tp.tab} key={tp.key}> <Tabs.TabPane tab={tp.tab} key={tp.key}>
{product && <tp.children {...this.props} /> } {product && <tp.children {...this.props} isEdit={isEdit} /> }
</Tabs.TabPane> </Tabs.TabPane>
)} )}
</Tabs> </Tabs>
......
src/containers/Product/List.jsx
View file @ bad46fae
...@@ -12,7 +12,8 @@ import { ...@@ -12,7 +12,8 @@ import {
footerFormSubmitLayout, footerFormSubmitLayout,
handleUpload, handleUpload,
filterFormItemLayout, filterFormItemLayout,
PRODUCT_STATUS PRODUCT_STATUS,
filterFormItemStyle
} from '../../utils'; } from '../../utils';
import {Link} from 'react-router'; import {Link} from 'react-router';
...@@ -197,10 +198,7 @@ export default class List extends Component { ...@@ -197,10 +198,7 @@ export default class List extends Component {
</div> </div>
); );
const searchStyle = {
size: 'default',
style: {width: 100}
}
const header = ( const header = (
<MainHeader breadcrumb={['产品管理', '产品列表']} <MainHeader breadcrumb={['产品管理', '产品列表']}
...@@ -211,21 +209,21 @@ export default class List extends Component { ...@@ -211,21 +209,21 @@ export default class List extends Component {
this.state.filterVisible && this.state.filterVisible &&
<Form className="filterForm" inline onSubmit={this.handleFilterSubmit.bind(this)}> <Form className="filterForm" inline onSubmit={this.handleFilterSubmit.bind(this)}>
<Form.Item label="ID"> <Form.Item label="ID">
<Input placeholder="请输入搜索ID" {...searchStyle} {...getFieldProps('id')}/> <Input placeholder="请输入搜索ID" {...filterFormItemStyle} {...getFieldProps('id')}/>
</Form.Item> </Form.Item>
<Form.Item label="类目"> <Form.Item label="类目">
{ {
cates && cates &&
<Cascader options={cates} placeholder="请选产品类目" {...searchStyle} <Cascader options={cates} placeholder="请选产品类目" {...filterFormItemStyle}
{...getFieldProps('categoryId')} {...getFieldProps('categoryId')}
/> />
} }
</Form.Item> </Form.Item>
<Form.Item label="标题"> <Form.Item label="标题">
<Input placeholder="请输入搜索标题" {...searchStyle} {...getFieldProps('title')}/> <Input placeholder="请输入搜索标题" {...filterFormItemStyle} {...getFieldProps('title')}/>
</Form.Item> </Form.Item>
<Form.Item label="状态"> <Form.Item label="状态">
<Select placeholder="请选择状态" {...searchStyle} {...getFieldProps('status')}> <Select placeholder="请选择状态" {...filterFormItemStyle} {...getFieldProps('status')}>
<Select.Option key="status-option-default" <Select.Option key="status-option-default"
value={null}>请选择</Select.Option> value={null}>请选择</Select.Option>
{ {
......
src/containers/Remittance/PassItem.jsx
View file @ bad46fae
This diff is collapsed.
src/containers/Users/EditItem.jsx 0 → 100644
View file @ bad46fae
import React, {Component, PropTypes} from 'react';
import {connect} from 'react-redux';
import {
Row,
Col,
Form,
Input,
Button,
Checkbox,
Select,
message,
Tabs,
Cascader,
Radio,
Upload,
Icon,
Modal,
DatePicker,
Table,
Spin
} from 'antd';
import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader/MainHeader';
import {
formItemLayout,
smallFormItemLayout,
footerFormSubmitLayout,
userStatusToString,
formatDateTime
} from '../../utils';
@connect(state=>({
loading: state.user.loading,
item: state.user.item,
}))
@Form.create()
export default class EditItem extends Component {
constructor() {
super(...arguments);
this.state = {
isEdit: false
}
}
componentDidMount() {
this.fetchItem(this.props.params.id);
};
fetchItem(id) {
this.props.dispatch({
type: 'FETCH_USER_ITEM',
id
});
};
handleSubmit(status, e) {
e.preventDefault();
let data = {};
if (status == 1 || status == 0) {
data.status = status;
} else {
data = this.props.form.getFieldsValue();
}
data.id = this.props.params.id;
console.log(data);
this.props.dispatch({
type: 'UPDATE_USER_ITEM',
data
});
}
render() {
const {item, loading, form:{getFieldProps}, location:{query}} = this.props;
const {isEdit} = this.state;
const operation = (
<div style={{textAlign:'right'}}>
<Button.Group>
<Button type="ghost" onClick={e=>{e.preventDefault(); this.setState({isEdit: !this.state.isEdit})}}>
<Icon type="edit"/>
</Button>
<Button type="ghost" onClick={e=>{e.preventDefault(); this.props.history.goBack();}}>
<Icon type="rollback"/>
</Button>
</Button.Group>
</div>
);
const header = (
<MainHeader breadcrumb={['用户管理', '用户详情']}
title={(query && query.title ? query.title + ' - ' : '') + '用户详情'}
operation={operation}
/>
);
return (
<Layout header={header}>
<Spin spinning={loading}>
{
item &&
<Form className="main-form" horizontal>
<Form.Item label="用户名" {...smallFormItemLayout}>
{ item.username }
</Form.Item>
<Form.Item label="状态" {...smallFormItemLayout}>
{userStatusToString(item.status)}
</Form.Item>
<Form.Item label="昵称" {...smallFormItemLayout}>
{
isEdit ?
<Input {...getFieldProps('nick', {initialValue: item.nick})} />
:
item.nick
}
</Form.Item>
<Form.Item label="E-mail" {...smallFormItemLayout}>
{
isEdit ?
<Input {...getFieldProps('email', {initialValue: item.email})} />
:
item.email
}
</Form.Item>
<Form.Item label="手机号" {...smallFormItemLayout}>
{
isEdit ?
<Input {...getFieldProps('mobile', {initialValue: item.mobile})} />
:
item.mobile
}
</Form.Item>
<Form.Item label="注册时间" {...smallFormItemLayout}>
{item.dateCreated && formatDateTime(item.dateCreated)}
</Form.Item>
<Form.Item {...footerFormSubmitLayout} style={{marginTop:30}}>
{
isEdit ?
<Button type="primary" onClick={this.handleSubmit.bind(this, -1)}
loading={loading}>
<Icon type="save"/>修改
</Button>
:
item.status ?
<Button type="primary" onClick={this.handleSubmit.bind(this, 0)}
loading={loading}>
<Icon type="save"/>禁用
</Button>
:
<Button type="primary" onClick={this.handleSubmit.bind(this, 1)}
loading={loading}>
<Icon type="save"/>激活
</Button>
}
<Button onClick={e=>{e.preventDefault(); this.props.history.goBack();}}
style={{marginLeft:'1em'}}>
<Icon type="rollback"/>返回
</Button>
</Form.Item>
</Form>
}
</Spin>
</Layout>
);
}
}
src/containers/Users/List.jsx
View file @ bad46fae
...@@ -2,78 +2,57 @@ import React, {Component, PropTypes} from 'react'; ...@@ -2,78 +2,57 @@ import React, {Component, PropTypes} from 'react';
import {connect} from 'react-redux'; import {connect} from 'react-redux';
import {Table, Icon, Row, Col, Button, Form, Input, Cascader, Select} from 'antd'; import {Table, Icon, Row, Col, Button, Form, Input, Cascader, Select} from 'antd';
import {Link} from 'react-router'; import {Link} from 'react-router';
import {serialize, formatDateTime, tradeStatusToString} from '../../utils'; import {serialize, formatDateTime, userStatusToString, filterFormItemStyle} from '../../utils';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
const columns = [ const columns = [
{ {
title: '用户ID', title: 'ID',
dataIndex: 'id', dataIndex: 'id',
key: 'id', key: 'id',
width: 70, width: 70,
// fixed:'left' // fixed:'left'
}, { }, {
title: '用户名', title: '用户名',
dataIndex: 'shortTitle', dataIndex: 'username',
key: 'shortTitle', key: 'username',
width:100,
render: (shortTitle, record)=>(<span title={shortTitle}>{(shortTitle + '').substring(0, 15)}</span>)
}, { }, {
title: '预约时间', title: '注册时间',
dataIndex: 'reservationTime', dataIndex: 'dateCreated',
key: 'reservationTime', key: 'dateCreated',
width: 150, width: 150,
className: 'tac', className: 'tac',
render: (reservationTime, record)=>( render: (dateCreated, record)=>(
<span> <span>
{reservationTime && formatDateTime(reservationTime)} {dateCreated && formatDateTime(dateCreated)}
</span> </span>
) )
}, { }, {
title: '投资人', title: '角色',
dataIndex: 'buyerName', dataIndex: 'buyerName',
key: 'buyerName', key: 'buyerName',
width: 80, width: 200,
className: 'tac', className: 'tac',
}, { }, {
title: '预约额度', title: 'E-mail',
dataIndex: 'reservationAmount', dataIndex: 'email',
key: 'reservationAmount', key: 'email',
width: 100, width: 200,
className: 'tac',
}, { }, {
title: '实际打款', title: '手机号',
dataIndex: 'remittanceAmount', dataIndex: 'mobile',
key: 'remittanceAmount', key: 'mobile',
width: 100, width: 80,
className: 'tac', className: 'tac',
}, { }, {
title: '状态', title: '状态',
dataIndex: 'status', dataIndex: 'status',
key: 'status', key: 'status',
width: 160, width: 60,
className: 'tac', className: 'tac',
render: (status, record)=>(<span data-status={status}>{tradeStatusToString(status)}</span>) render: (status, record)=>(<span data-status={status}>{userStatusToString(status)}</span>)
}, {
title: '操作',
key: 'operation',
width: 140,
// fixed:'right',
className: 'tac',
render: (text, record)=>(
<span>
<Link to={'/trades/contract/'+ record.id} onClick={e=>e.stopPropagation()}>合同</Link>
{
(record.status == 11 || record.status == 21) &&
<span>
<span className="ant-divider"></span>
<Link to={'/trades/commission/'+ record.id} onClick={e=>e.stopPropagation()}>佣金</Link>
</span>
}
</span>
)
} }
]; ];
...@@ -186,21 +165,13 @@ export default class List extends Component { ...@@ -186,21 +165,13 @@ export default class List extends Component {
this.state.filterVisible && this.state.filterVisible &&
<Form className="filterForm" inline onSubmit={this.handleFilterSubmit.bind(this)}> <Form className="filterForm" inline onSubmit={this.handleFilterSubmit.bind(this)}>
<Form.Item label="ID"> <Form.Item label="ID">
<Input placeholder="请输入搜索ID" {...searchStyle} {...getFieldProps('id')}/> <Input placeholder="请输入搜索ID" {...filterFormItemStyle} {...getFieldProps('id')}/>
</Form.Item> </Form.Item>
<Form.Item label="类目"> <Form.Item label="用户名">
{ <Input placeholder="请输入搜索用户名" {...filterFormItemStyle} {...getFieldProps('title')}/>
cates &&
<Cascader options={cates} placeholder="请选产品类目" {...searchStyle}
{...getFieldProps('categoryId')}
/>
}
</Form.Item>
<Form.Item label="标题">
<Input placeholder="请输入搜索标题" {...searchStyle} {...getFieldProps('title')}/>
</Form.Item> </Form.Item>
<Form.Item label="状态"> <Form.Item label="状态">
<Select placeholder="请选择状态" {...searchStyle} {...getFieldProps('status')}> <Select placeholder="请选择状态" {...filterFormItemStyle} {...getFieldProps('status')}>
<Select.Option key="status-option-default" <Select.Option key="status-option-default"
value={null}>请选择</Select.Option> value={null}>请选择</Select.Option>
...@@ -220,6 +191,8 @@ export default class List extends Component { ...@@ -220,6 +191,8 @@ export default class List extends Component {
</MainHeader> </MainHeader>
); );
return ( return (
<Layout header={header}> <Layout header={header}>
<Table className="list-table" columns={columns} <Table className="list-table" columns={columns}
......
src/containers/index.js
View file @ bad46fae
...@@ -23,4 +23,5 @@ export CustomMessageItem from './CustomMessage/Item'; ...@@ -23,4 +23,5 @@ export CustomMessageItem from './CustomMessage/Item';
export BaseUpload from './BaseFunction/BaseUpload'; export BaseUpload from './BaseFunction/BaseUpload';
export UsersAddItem from './Users/Additem'; export UsersAddItem from './Users/Additem';
export UsersList from './Users/List'; export UsersList from './Users/List';
export UsersItem from './Users/EditItem';
src/entries/index.less
View file @ bad46fae
...@@ -84,6 +84,15 @@ ...@@ -84,6 +84,15 @@
margin: 5px 0; margin: 5px 0;
} }
.ant-menu-vertical > .ant-menu-item,
.ant-menu-inline > .ant-menu-item,
.ant-menu-item-group-list > .ant-menu-item,
.ant-menu-vertical > .ant-menu-submenu > .ant-menu-submenu-title,
.ant-menu-inline > .ant-menu-submenu > .ant-menu-submenu-title,
.ant-menu-item-group-list > .ant-menu-submenu > .ant-menu-submenu-title {
line-height: 36px;
height: 36px;
}
.list-table { .list-table {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
...@@ -115,13 +124,12 @@ ...@@ -115,13 +124,12 @@
background-color: #fcfcfc; background-color: #fcfcfc;
} }
&.ant-table-row-hover, &.ant-table-row-hover,
&:hover{ &:hover {
background-color: #eaf8fe; background-color: #eaf8fe;
} }
} }
} }
& > div { & > div {
&:first-child { &:first-child {
flex: 1; flex: 1;
...@@ -136,16 +144,49 @@ ...@@ -136,16 +144,49 @@
.tac { .tac {
text-align: center !important; text-align: center !important;
} }
}
body {
.ant-modal-mask{
animation-duration: 300ms !important;
}
.img-priview-dialog { .img-priview-dialog {
animation-duration: 300ms !important;
height: 100vh;
width: 100vw;
display: flex;
top: 0;
align-items: center;
justify-content: center;
.ant-modal-content { .ant-modal-content {
background-color: transparent; background-color: transparent;
padding-bottom: 0;
img { img {
margin: auto; margin: auto;
display: block; display: block;
max-width: 100vw !important;
max-height: 100vh !important;
}
.ant-modal-close {
background: rgba(255, 255, 255, .25);
border-radius: 50%;
width: 20px;
height: 20px;
padding: 3px;
top: -10px;
right: -10px;
}
.ant-modal-body {
display: flex;
align-items: center;
justify-content: center;
padding: 0;
} }
} }
} }
} }
} }
src/reducers/announcement.js
View file @ bad46fae
...@@ -33,7 +33,7 @@ const announcement = handleActions({ ...@@ -33,7 +33,7 @@ const announcement = handleActions({
return {...state, loading: true} return {...state, loading: true}
}, },
['UPDATE_ANNOUNCEMENT_ITEM_SUCCESS'](state, action){ ['UPDATE_ANNOUNCEMENT_ITEM_SUCCESS'](state, action){
return {...state, loading: false, item: action.item} return {...state, loading: false, item: {...state.item, ...action.item}}
}, },
['UPDATE_ANNOUNCEMENT_ITEM_FAILED'](state, action){ ['UPDATE_ANNOUNCEMENT_ITEM_FAILED'](state, action){
return {...state, err: action.err, loading: false} return {...state, err: action.err, loading: false}
......
src/reducers/user.js
View file @ bad46fae
...@@ -41,7 +41,28 @@ const user = handleActions({ ...@@ -41,7 +41,28 @@ const user = handleActions({
}, },
['FETCH_USER_LIST_FAILED'](state, action){ ['FETCH_USER_LIST_FAILED'](state, action){
return {...state, loading: false, err: action.err}; return {...state, loading: false, err: action.err};
} },
['FETCH_USER_ITEM'](state){
return {...state, loading:true};
},
['FETCH_USER_ITEM_SUCCESS'](state, action){
return {...state, loading: false, item: action.item};
},
['FETCH_USER_ITEM_FAILED'](state, action){
return {...state, loading: false, err: action.err};
},
['UPDATE_USER_ITEM'](state){
return {...state, loading:true};
},
['UPDATE_USER_ITEM_SUCCESS'](state, action){
return {...state, loading: false, item: {...state.item, ...action.item}};
},
['UPDATE_USER_ITEM_FAILED'](state, action){
return {...state, loading: false, err: action.err};
},
}, { }, {
..._user, ..._user,
loading: false, loading: false,
......
src/routes/index.js
View file @ bad46fae
...@@ -25,7 +25,8 @@ import { ...@@ -25,7 +25,8 @@ import {
CustomMessageItem, CustomMessageItem,
BaseUpload, BaseUpload,
UsersAddItem, UsersAddItem,
UsersList UsersList,
UsersItem
} from '../containers/index'; } from '../containers/index';
export default (store)=> { export default (store)=> {
...@@ -55,7 +56,7 @@ export default (store)=> { ...@@ -55,7 +56,7 @@ export default (store)=> {
<Route path="announcement"> <Route path="announcement">
<IndexRoute component={AnnouncementList}/> <IndexRoute component={AnnouncementList}/>
<Route path="create" component={AnnouncementAddItem}/> <Route path="create" component={AnnouncementAddItem}/>
<Route path=":id/edit" component={AnnouncementEditItem}/> <Route path=":id" component={AnnouncementEditItem}/>
</Route> </Route>
<Route path="remittance"> <Route path="remittance">
<Route path="audits"> <Route path="audits">
...@@ -79,6 +80,7 @@ export default (store)=> { ...@@ -79,6 +80,7 @@ export default (store)=> {
<Route path="users"> <Route path="users">
<IndexRoute component={UsersList} /> <IndexRoute component={UsersList} />
<Route path="create" component={UsersAddItem} /> <Route path="create" component={UsersAddItem} />
<Route path=":id" component={UsersItem} />
</Route> </Route>
</Route> </Route>
</Route> </Route>
......
src/sagas/announcement.js
View file @ bad46fae
...@@ -80,10 +80,10 @@ function* watchAdd() { ...@@ -80,10 +80,10 @@ function* watchAdd() {
function* editItem(data) { function* editItem(data) {
try{ try{
const item = yield call(updateItem, data); yield call(updateItem, data);
yield put({ yield put({
type: 'UPDATE_ANNOUNCEMENT_ITEM_SUCCESS', type: 'UPDATE_ANNOUNCEMENT_ITEM_SUCCESS',
item item: data
}); });
}catch(err){ }catch(err){
console.log(err); console.log(err);
......
src/sagas/user.js
View file @ bad46fae
import {takeLatest} from 'redux-saga'; import {takeLatest} from 'redux-saga';
import {take, call, put, fork, cancel} from 'redux-saga/effects'; import {take, call, put, fork, cancel} from 'redux-saga/effects';
import {fetch, clear, save, create, fetchList} from '../services/user'; import {fetch, clear, save, create, fetchList, fetchItem, updateItem} from '../services/user';
import {message} from 'antd'; import {message} from 'antd';
function* authorize(username, password, push) { function* authorize(username, password, push) {
...@@ -26,32 +26,32 @@ function* loginFlow() { ...@@ -26,32 +26,32 @@ function* loginFlow() {
} }
function* addItem(data) { function* addItem(data) {
try{ try {
yield call(create, data); yield call(create, data);
yield put({type: 'CREATE_USER_ITEM_SUCCESS'}); yield put({type: 'CREATE_USER_ITEM_SUCCESS'});
}catch(err){ } catch (err) {
console.log(err); console.log(err);
message.error(err); message.error(err);
yield put({type: 'CREATE_USER_ITEM_FAILED', err}); yield put({type: 'CREATE_USER_ITEM_FAILED', err});
} }
} }
function* watchAddItem(){ function* watchAddItem() {
while(true){ while (true) {
const {data} = yield take('CREATE_USER_ITEM'); const {data} = yield take('CREATE_USER_ITEM');
yield fork(addItem, data); yield fork(addItem, data);
} }
} }
function* getList(query){ function* getList(query) {
try{ try {
const {items, total} = yield call(fetchList, query); const {users, total} = yield call(fetchList, query);
yield put({ yield put({
type:'FETCH_USER_LIST_SUCCESS', type: 'FETCH_USER_LIST_SUCCESS',
items: items, items: users,
total total
}); });
}catch(err){ } catch (err) {
console.log(err); console.log(err);
message.error(err); message.error(err);
yield put({type: 'FETCH_USER_LIST_FAILED', err}); yield put({type: 'FETCH_USER_LIST_FAILED', err});
...@@ -59,15 +59,66 @@ function* getList(query){ ...@@ -59,15 +59,66 @@ function* getList(query){
} }
function* watchList() { function* watchList() {
while(true){ while (true) {
const {query} = yield take('FETCH_USER_LIST'); const {query} = yield take('FETCH_USER_LIST');
yield fork(getList, query); yield fork(getList, query);
} }
} }
export default function* () { function* getItem(id) {
try {
const item = yield call(fetchItem, id);
yield put({
type: 'FETCH_USER_ITEM_SUCCESS',
item: item
});
} catch (err) {
console.log(err);
message.error(err);
yield put({
type: 'FETCH_USER_ITEM_FAILED',
err
});
}
}
function* watchItem() {
while (true) {
const {id} = yield take('FETCH_USER_ITEM');
yield fork(getItem, id);
}
}
function* modifyItem(data) {
try {
yield call(updateItem, data);
yield put({
type: 'UPDATE_USER_ITEM_SUCCESS',
item: data
});
} catch (err) {
console.log(err);
message.error(err);
yield put({
type: 'UPDATE_USER_ITEM_FAILED',
err
});
}
}
function* watchMidfiyItem(){
while(true){
const {data} = yield take('UPDATE_USER_ITEM');
yield fork(modifyItem, data);
}
}
export default function*() {
yield fork(loginFlow); yield fork(loginFlow);
yield fork(watchAddItem); yield fork(watchAddItem);
yield fork(watchList); yield fork(watchList);
yield fork(watchItem);
yield fork(watchMidfiyItem);
} }
src/services/user.js
View file @ bad46fae
...@@ -10,15 +10,26 @@ export async function fetch(username, password) { ...@@ -10,15 +10,26 @@ export async function fetch(username, password) {
export async function create(data) { export async function create(data) {
return xFetch('/api/users', { return xFetch('/api/users', {
method:'POST', method: 'POST',
body: serialize(data) body: serialize(data)
}); });
} }
export async function fetchList(query){ export async function fetchList(query) {
return xFetch('/api/admin/users' + '?' + serialize(query)); return xFetch('/api/admin/users' + '?' + serialize(query));
} }
export async function fetchItem(id) {
return xFetch('/api/admin/users/' + id);
}
export async function updateItem(data) {
return xFetch('/api/admin/users/' + data.id, {
method: 'PUT',
body: serialize(data)
})
}
export async function clear() { export async function clear() {
sessionStorage.clear(); sessionStorage.clear();
return Promise.resolve(); return Promise.resolve();
......
src/services/xFetch.js
View file @ bad46fae
...@@ -20,11 +20,9 @@ function check404(res) { ...@@ -20,11 +20,9 @@ function check404(res) {
} }
function jsonParse(res) { function jsonParse(res) {
try {
return res.json().then(json => ({...res, json})); return res.json().then(json => ({...res, json})).catch(err=> ({...res, json:{status:0, message: '数据加载错误!'}}));
}catch(err){
return Promise.reject(err);
}
} }
function errorMessageParse(res) { function errorMessageParse(res) {
......
src/utils.js
View file @ bad46fae
...@@ -59,7 +59,16 @@ export const productStatusToString = status => { ...@@ -59,7 +59,16 @@ export const productStatusToString = status => {
export const productEnableCreateTrade = status => { export const productEnableCreateTrade = status => {
return status > 1 && status < 17; return status > 1 && status < 17;
} };
export const USER_STATUS = {
0: '未激活',
1: '正常'
};
export const userStatusToString = status => {
return USER_STATUS[status] || '未定义';
};
export const tradeStatusToString = status => { export const tradeStatusToString = status => {
...@@ -141,9 +150,14 @@ export const footerFormSubmitLayout = { ...@@ -141,9 +150,14 @@ export const footerFormSubmitLayout = {
}; };
export const filterFormItemLayout = { export const filterFormItemLayout = {
labelCol:{ span: 10 }, labelCol: {span: 10},
wrapperCol:{ span: 14 } wrapperCol: {span: 14}
} };
export const filterFormItemStyle = {
size: 'default',
style: {width: 100}
};
export function filterUploadSuccess(fileList) { export function filterUploadSuccess(fileList) {
...@@ -171,17 +185,17 @@ export function transformUploadThumbUrl(fileList) { ...@@ -171,17 +185,17 @@ export function transformUploadThumbUrl(fileList) {
type: file.type, type: file.type,
url: file.url, url: file.url,
thumbUrl: file.thumbUrl, thumbUrl: file.thumbUrl,
name:file.name, name: file.name,
size:file.size size: file.size
} }
} }
return file; return file;
}); });
} }
export function handleUpload(info, limit){ export function handleUpload(info, limit) {
let fileList = filterUploadSuccess(info.fileList); let fileList = filterUploadSuccess(info.fileList);
if(limit){ if (limit) {
fileList = fileList.slice(-1 * limit); fileList = fileList.slice(-1 * limit);
} }
return transformUploadThumbUrl(fileList); return transformUploadThumbUrl(fileList);
...@@ -189,7 +203,9 @@ export function handleUpload(info, limit){ ...@@ -189,7 +203,9 @@ export function handleUpload(info, limit){
export function remittanceAuditStatusToString(status) { export function remittanceAuditStatusToString(status) {
switch (status){ switch (status) {
case 0:
return '已删除';
case 1: case 1:
return '待审核'; return '待审核';
case 5: case 5:
......
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