Skip to content

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

update theme

parent 65f4fa22
Expand all Show whitespace changes
Inline Side-by-side
Showing with 1034 additions and 618 deletions
.idea/workspace.xml
View file @ 1bb7d019
This diff is collapsed.
dist/index.css
View file @ 1bb7d019
This diff is collapsed.
dist/index.js
View file @ 1bb7d019
This diff is collapsed.
src/components/Layout/Layout.less
View file @ 1bb7d019
...@@ -4,8 +4,19 @@ ...@@ -4,8 +4,19 @@
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
align-items: center;
& > .content { & > .content {
flex: 1; flex: 1;
overflow: auto; overflow: auto;
width: 100%;
& > div {
height: 100%;
& > :global(.ant-spin-container) {
height: 100%;
& > :global(.ant-form-horizontal) {
height: 100%;
}
}
}
} }
} }
src/components/MainHeader.jsx → src/components/MainHeader/MainHeader.jsx
View file @ 1bb7d019
...@@ -17,27 +17,24 @@ export default class MainHeader extends Component { ...@@ -17,27 +17,24 @@ export default class MainHeader extends Component {
const {breadcrumb, title, operation} = this.props; const {breadcrumb, title, operation} = this.props;
const styles = require('./MainHeader.less');
return ( return (
<div className="main-header"> <div className={styles.MainHeader}>
<Row > <Row className={styles.header} type="flex" justify="space-around" align="middle">
<Col span="8"> <Col span="16" style={{paddingLeft: 20}}>
<h1>{title}</h1>
<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>
</Col> </Col>
</Row> <Col span="8">
<Row type="flex" justify="space-around" align="middle">
<Col span="20">
<h1 className="tac">{title}</h1>
</Col>
{
operation &&
<Col span="4">
{operation} {operation}
</Col> </Col>
}
</Row> </Row>
{ this.props.children }
</div> </div>
); );
} }
} }
src/components/MainHeader/MainHeader.less 0 → 100644
View file @ 1bb7d019
@import "../../variable";
.MainHeader {
width: 100%;
& > .header {
.borderBottom;
padding-bottom: 5px;
& > div {
&:first-child {
padding-left: 20px;
}
&:last-child {
padding-right: 20px;
}
}
h1 {
font-size: 18px;
margin-top: 5px;
}
:global {
.ant-breadcrumb {
color: #ccc;
font-weight: 300;
& > span:last-child {
color: #aaa;
}
}
}
}
& > :global(.filterForm) {
padding: 10px 20px;
.borderBottom;
}
}
src/containers/Announcement/AddItem.jsx
View file @ 1bb7d019
...@@ -21,7 +21,7 @@ import { ...@@ -21,7 +21,7 @@ import {
} from 'antd'; } from 'antd';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
import {formItemLayout, footerFormSubmitLayout} from '../../utils'; import {formItemLayout, footerFormSubmitLayout} from '../../utils';
...@@ -48,17 +48,32 @@ export default class AddItem extends Component { ...@@ -48,17 +48,32 @@ export default class AddItem extends Component {
render = ()=> { render = ()=> {
const {loading, form:{getFieldProps}, location:{query}} = this.props; const {loading, form:{getFieldProps}, location:{query}} = this.props;
const header = (<MainHeader breadcrumb={['产品管理', '产品详情', '添加公告']} const operation = (
title={(query.title ? query.title + ' - ' : '') + '添加公告'}/>); <div style={{textAlign:'right'}}>
<Button.Group>
<Button type="ghost" onClick={e=>{e.preventDefault(); this.props.history.goBack();}}>
<Icon type="rollback"/>
</Button>
</Button.Group>
</div>
);
const header = (
<MainHeader breadcrumb={['产品管理', '产品详情', '添加公告']}
title={(query.title ? query.title + ' - ' : '') + '添加公告'}
operation={operation}
/>
);
return ( return (
<Layout header={header}> <Layout header={header}>
<Spin spinning={loading}> <Spin spinning={loading}>
<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')} /> <Input placeholder="公告标题" {...getFieldProps('title')} />
</Form.Item> </Form.Item>
<Form.Item label="内容" {...formItemLayout}> <Form.Item label="内容" {...formItemLayout}>
<Input placeholder="公告内容" type="textarea" autosize={{minRows:5, maxRows:20}} {...getFieldProps('announcement')} /> <Input placeholder="公告内容" type="textarea"
autosize={{minRows:5, maxRows:20}} {...getFieldProps('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> <Button type="primary" htmlType="submit" loading={loading}><Icon type="save"/>创建</Button>
......
src/containers/Announcement/EditItem.jsx
View file @ 1bb7d019
...@@ -21,7 +21,7 @@ import { ...@@ -21,7 +21,7 @@ import {
} from 'antd'; } from 'antd';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
import {formItemLayout, footerFormSubmitLayout} from '../../utils'; import {formItemLayout, footerFormSubmitLayout} from '../../utils';
...@@ -61,15 +61,29 @@ export default class EditItem extends Component { ...@@ -61,15 +61,29 @@ export default class EditItem extends Component {
render() { render() {
const {announcement, loading, form:{getFieldProps}, location:{query}} = this.props; const {announcement, loading, form:{getFieldProps}, location:{query}} = this.props;
const header = (<MainHeader breadcrumb={['产品管理', '产品详情', '修改公告']} const operation = (
title={(query && query.title ? query.title + ' - ' : '') + '修改公告'}/>); <div style={{textAlign:'right'}}>
<Button.Group>
<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 ( return (
<Layout header={header}> <Layout header={header}>
<Spin spinning={loading}> <Spin spinning={loading}>
{ {
announcement && announcement &&
<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="公告标题" <Input placeholder="公告标题"
{...getFieldProps('title', { {...getFieldProps('title', {
......
src/containers/Announcement/List.jsx
View file @ 1bb7d019
...@@ -4,7 +4,7 @@ import {Table, Icon, Button, Switch, Form} from 'antd'; ...@@ -4,7 +4,7 @@ import {Table, Icon, Button, Switch, Form} from 'antd';
import {serialize, formatDateTime, productStatusToString, footerFormSubmitLayout} from '../../utils'; import {serialize, formatDateTime, productStatusToString, footerFormSubmitLayout} from '../../utils';
import {Link} from 'react-router'; import {Link} from 'react-router';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
@connect(state=>({ @connect(state=>({
...@@ -16,7 +16,9 @@ export default class List extends Component { ...@@ -16,7 +16,9 @@ export default class List extends Component {
constructor(props, context) { constructor(props, context) {
super(props, context); super(props, context);
this.state = {
filterVisible: false
}
} }
componentDidMount() { componentDidMount() {
...@@ -34,6 +36,9 @@ export default class List extends Component { ...@@ -34,6 +36,9 @@ export default class List extends Component {
this.props.history.push('/announcement/' + id + '/edit'); this.props.history.push('/announcement/' + id + '/edit');
} }
handleFilterVisible() {
}
render() { render() {
...@@ -69,13 +74,15 @@ export default class List extends Component { ...@@ -69,13 +74,15 @@ export default class List extends Component {
title: '标题', title: '标题',
dataIndex: 'title', dataIndex: 'title',
key: 'title', key: 'title',
width: 200,
}, { }, {
title: '内容', title: '内容',
dataIndex: 'announcement', dataIndex: 'announcement',
key: 'announcement', key: 'announcement',
width: 200,
render: (announcement, record)=>( render: (announcement, record)=>(
<span title={announcement}> <span title={announcement}>
{announcement && (announcement.length > 20 ? announcement.substr(0,20)+'...' : announcement)} {announcement && (announcement.length > 20 ? announcement.substr(0, 20) + '...' : announcement)}
</span> </span>
) )
}, { }, {
...@@ -113,32 +120,67 @@ export default class List extends Component { ...@@ -113,32 +120,67 @@ export default class List extends Component {
} }
]; ];
const header = (<MainHeader breadcrumb={['产品管理', '产品详情', '公告列表']} const operation = (
title={(query.title ? query.title + ' - ' : '') + '公告列表'}/>); <div style={{textAlign:'right'}}>
<Button.Group>
<Button type="ghost">
<Link to={'/announcement/create?itemId='+ query.itemId + '&title='+ query.title}>
<Icon type="plus"/>
</Link>
</Button>
<Button type="ghost" onClick={this.handleFilterVisible.bind(this)}>
<Icon type="filter"/>
</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.title ? query.title + ' - ' : '') + '公告列表'}
operation={operation}
/>
);
const footer = (
<div style={{margin:'10px 0'}}>
<Link to={'/announcement/create?itemId='+ query.itemId + '&title='+ query.title}>
<Button type="primary">
<Icon type="plus"/>添加
</Button>
</Link>
<Button style={{margin:'0 1em'}} type="ghost" onClick={e=>{e.preventDefault(); this.props.history.goBack();}}>
<Icon type="rollback"/>返回
</Button>
</div>
);
return ( return (
<Layout header={header}> <Layout header={header} >
<Form horizontal> <Table className="list-table" columns={columns}
<Table className="ant-table" columns={columns}
dataSource={Array.isArray(items)?items:[]} dataSource={Array.isArray(items)?items:[]}
loading={loading} loading={loading}
pagination={pagination} pagination={pagination}
scroll={{ y: window.innerHeight-(this.state.filterVisible? 203 :150) }}
onRowClick={this.handleRowClick.bind(this)} onRowClick={this.handleRowClick.bind(this)}
/> />
<Form.Item {...footerFormSubmitLayout} style={{marginTop:30}}>
<Link to={'/announcement/create?itemId='+ query.itemId + '&title='+ query.title}>
<Button size="large"><Icon type="plus"/>添加</Button>
</Link>
<Button onClick={e=>{e.preventDefault(); this.props.history.goBack();}}
style={{marginLeft:'1em'}}>
<Icon type="rollback"/>返回
</Button>
</Form.Item>
</Form>
</Layout> </Layout>
); );
} }
} }
// <Form.Item {...footerFormSubmitLayout} style={{marginTop:30}}>
// <Link to={'/announcement/create?itemId='+ query.itemId + '&title='+ query.title}>
// <Button size="large"><Icon type="plus"/>添加</Button>
// </Link>
// <Button onClick={e=>{e.preventDefault(); this.props.history.goBack();}}
// style={{marginLeft:'1em'}}>
// <Icon type="rollback"/>返回
// </Button>
// </Form.Item>
src/containers/App/App.jsx
View file @ 1bb7d019
...@@ -79,22 +79,12 @@ export default class App extends Component { ...@@ -79,22 +79,12 @@ export default class App extends Component {
const logo = require('./images/logo.png'); const logo = require('./images/logo.png');
return ( return (
<div className={styles.normal}>
<div className={styles.head}>
<Row type="flex" justify="space-around" align="middle">
<Col span="12">
<img className="page-logo" src={'/'+logo} title="枢纽科技" alt="枢纽科技"/>
</Col>
<Col span="12">
<div style={{float:'right', marginRight:30}}>
{user.username}
</div>
</Col>
</Row>
</div>
<div className={styles.content}> <div className={styles.content}>
<div className={styles.side}> <div className={styles.side}>
<header>
<img className="page-logo" src={'/'+logo} title="枢纽科技" alt="枢纽科技"/>
</header>
<section>
<Menu mode="inline" defaultOpenKeys={['sub1']}> <Menu mode="inline" defaultOpenKeys={['sub1']}>
<SubMenu key="sub1" title={<span><Icon type="mail" /><span>业务管理</span></span>}> <SubMenu key="sub1" title={<span><Icon type="mail" /><span>业务管理</span></span>}>
{ {
...@@ -118,15 +108,15 @@ export default class App extends Component { ...@@ -118,15 +108,15 @@ export default class App extends Component {
</Menu.Item> </Menu.Item>
</SubMenu> </SubMenu>
</Menu> </Menu>
</section>
<footer>
杭州枢纽科技有限公司
</footer>
</div> </div>
<div className={styles.main}> <div className={styles.main}>
{user && user.token && this.props.children} {user && user.token && this.props.children}
</div> </div>
</div> </div>
<div className={styles.foot}>
杭州枢纽科技有限公司 荣誉出品 <a href="mailto:bainx@vip.qq.com">问题反馈</a>
</div>
</div>
); );
} }
} }
...@@ -152,17 +142,25 @@ class MenuItemContent extends Component { ...@@ -152,17 +142,25 @@ class MenuItemContent extends Component {
} }
// <div className={styles.head}>
// <Row type="flex" justify="space-around" align="middle" style={{height:'100%'}}>
// <Col span="12">
// <img className="page-logo" src={'/'+logo} title="枢纽科技" alt="枢纽科技"/>
// </Col>
// <Col span="12">
// <div style={{float:'right', marginRight:30}}>
// {user.username}
// </div>
// </Col>
// </Row>
// </div>
// <div className={styles.foot}>
// 杭州枢纽科技有限公司 荣誉出品 <a href="mailto:bainx@vip.qq.com">问题反馈</a>
// </div>
//<div className={styles.normal}></div>
......
src/containers/App/App.less
View file @ 1bb7d019
@import '../../variable';
.normal { .content {
flex: 1;
display: flex; display: flex;
flex-direction: column;
height: 100%;
} }
.head { .side {
background: #fff; min-width: 220px;
height: 75px; max-width: 300px;
padding: 8px; color: #eee;
color: #364171; background-color: #4D394B;
border-bottom: 1px solid #e0e0e0;
:global { display: flex;
.page-logo { flex-direction: column;
margin: 20px 0 0 30px; height: 100%;
& > header {
padding: 20px;
img {
margin: 0 auto;
display: block;
} }
} }
} & > footer {
text-align: center;
.content { padding: 10px 0;
color: #aaa;
}
& > section {
flex: 1; flex: 1;
display: flex; }
background-color: #e9ecf3;
padding: 20px 30px 0;
}
.side {
/**/
width: 250px;
//min-width: 250px;
//max-width: 300px;
background: #fff;
border-right: 1px solid #e9e9e9;
margin-right: 0px;
padding: 30px 0 0;
border-radius: 5px 0 0 5px;
:global { :global {
.ant-menu {
background-color: transparent;
color: #fff;
}
.ant-menu-item > a {
color: #fff;
}
.ant-menu-item-group-title {
color: #aaa;
}
.ant-menu-inline, .ant-menu-inline,
.ant-menu-vertical { .ant-menu-vertical {
border-right: 0; border-right: 0;
} }
.ant-menu-item:hover,
.ant-menu-item-active,
.ant-menu-submenu-active,
.ant-menu-submenu-title:hover {
background-color: @primary-color;
}
.ant-menu-inline .ant-menu-selected, .ant-menu-inline .ant-menu-item-selected {
border-right: 1px solid @primary-color;
background-color: @primary-color;
}
.ant-menu-vertical,
.ant-menu-inline,
.ant-menu-item-group-list {
& > .ant-menu-item,
& > .ant-menu-submenu > .ant-menu-submenu-title {
.cn {
font-size: 12px;
}
.en {
font-size: 10px;
margin-left: .5em;
opacity: .45;
font-style: italic;
font-weight: 300;
}
}
}
} }
} }
...@@ -49,100 +82,36 @@ ...@@ -49,100 +82,36 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
padding: 10px 20px;
flex: 1 0 auto; flex: 1 0 auto;
overflow: hidden; overflow: hidden;
background: #fff;
border-radius: 0 5px 5px 0;
h1 { h1 {
font-size: 24px; font-size: 18px;
color: #404040; color: #444;
font-weight: 400; font-weight: 700;
line-height: 40px; line-height: 36px;
margin-bottom: 24px; margin-top: 10px;
margin-top: 8px;
font-family: lato, Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
} }
h2 { h2 {
font-size: 22px; font-size: 16px;
color: #505050; color: #666;
font-weight: 400; font-weight: 500;
line-height: 36px; line-height: 30px;
margin-top: 6px;
} }
h3 { h3 {
font-size: 18px; font-size: 14px;
color: #606060; color: #888;
font-weight: 400; font-weight: 400;
line-height: 30px; line-height: 26px;
} margin-top: 2px;
//& > section {
// display: flex;
// flex-direction: column;
// height: 100%;
// overflow: auto;
// & > header {
// h1 {
// line-height: 30px;
// margin: 0;
// }
// :global {
// .ant-breadcrumb {
// & > span {
// line-height: 42px;
// }
// }
// }
// }
// & > * {
// &:nth-child(2){
// flex: 1;
// overflow: auto;
// display: flex;
// flex-direction: column;
// :global{
// .content{
// flex:1;
// }
// }
//
// }
// }
//}
:global {
.tac {
text-align: center !important;
}
.main-header {
border-bottom: 1px solid #eaeaea;
margin-bottom: 20px;
h1 {
margin-bottom: 10px;
}
} }
& > div {
height: 100%;
flex: 1 0 auto;
} }
:global {
} .main-form {
padding-top: 24px;
.foot {
//background: #fafafa;
//border-top: 1px solid #e0e0e0;
padding: 8px;
font-size: 12px;
text-align: center;
a {
margin-left: .5em;
opacity: .8;
}
}
:global {
.img-priview-dialog {
.ant-modal-content {
background-color: transparent;
img {
margin: auto;
display: block;
}
} }
} }
} }
......
src/containers/BaseFunction/BaseUpload.jsx
View file @ 1bb7d019
...@@ -24,7 +24,7 @@ import { ...@@ -24,7 +24,7 @@ import {
import Copy from '../../components/CopyToClipboard/CopyToClipboard'; import Copy from '../../components/CopyToClipboard/CopyToClipboard';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
import { import {
handleUpload handleUpload
......
src/containers/CustomMessage/AddItem.jsx
View file @ 1bb7d019
...@@ -21,7 +21,7 @@ import { ...@@ -21,7 +21,7 @@ import {
} from 'antd'; } from 'antd';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
import {formItemLayout, footerFormSubmitLayout} from '../../utils'; import {formItemLayout, footerFormSubmitLayout} from '../../utils';
...@@ -33,8 +33,8 @@ export default class AddItem extends Component { ...@@ -33,8 +33,8 @@ export default class AddItem extends Component {
constructor(props, content) { constructor(props, content) {
super(props, content); super(props, content);
this.state = { this.state = {
redirectName: '请选择', redirectName: undefined,
sendName: '请选择' sendName: undefined
} }
} }
...@@ -55,16 +55,19 @@ export default class AddItem extends Component { ...@@ -55,16 +55,19 @@ export default class AddItem extends Component {
render = ()=> { render = ()=> {
const {loading, form:{getFieldProps}, location:{query}} = this.props; const {loading, form:{getFieldProps}, location:{query}} = this.props;
const header = (<MainHeader breadcrumb={['消息管理', '推送消息']} const header = (
title="推送消息"/>); <MainHeader breadcrumb={['消息管理', '推送消息']} title="推送消息"/>
);
const redirectNamePlaceholder = {0: '无需填写', 1: '请输入一个产品ID', 2: '请输入消息跳转指定的URL地址'};
const sendNamePlaceholder = {1: '无需填写', 2: '请输入一个产品ID', 3: '请输入接收消息的人员的手机号码'};
const redirectNamePlaceholder = {0:'无需填写', 1:'请输入一个产品ID', 2:'请输入消息跳转指定的URL地址'};
const sendNamePlaceholder = {1:'无需填写', 2:'请输入一个产品ID', 3:'请输入接收消息的人员的手机号码'};
return ( return (
<Layout header={header}> <Layout header={header}>
<Spin spinning={loading}> <Spin spinning={loading}>
<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}>
<Row> <Row>
<Col span="6"> <Col span="6">
......
src/containers/CustomMessage/Item.jsx
View file @ 1bb7d019
...@@ -9,7 +9,7 @@ import { ...@@ -9,7 +9,7 @@ import {
} from '../../utils'; } from '../../utils';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
@connect(state=>({ @connect(state=>({
loading: state.customMessage.loading, loading: state.customMessage.loading,
......
src/containers/CustomMessage/List.jsx
View file @ 1bb7d019
...@@ -4,7 +4,7 @@ import {Table, Icon, Button, Switch, Form} from 'antd'; ...@@ -4,7 +4,7 @@ import {Table, Icon, Button, Switch, Form} from 'antd';
import {serialize, formatDateTime, productStatusToString, footerFormSubmitLayout} from '../../utils'; import {serialize, formatDateTime, productStatusToString, footerFormSubmitLayout} from '../../utils';
import {Link} from 'react-router'; import {Link} from 'react-router';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
@connect(state=>({ @connect(state=>({
...@@ -16,7 +16,9 @@ export default class List extends Component { ...@@ -16,7 +16,9 @@ export default class List extends Component {
constructor(props, context) { constructor(props, context) {
super(props, context); super(props, context);
this.state = {
filterVisible: false
}
} }
componentDidMount() { componentDidMount() {
...@@ -93,11 +95,11 @@ export default class List extends Component { ...@@ -93,11 +95,11 @@ export default class List extends Component {
return ( return (
<Layout header={header}> <Layout header={header}>
<Table className="ant-table" columns={columns} <Table className="list-table" columns={columns}
dataSource={Array.isArray(items)?items:[]} dataSource={Array.isArray(items)?items:[]}
loading={loading} loading={loading}
pagination={pagination} pagination={pagination}
scroll={{ y: window.innerHeight-380 }} scroll={{ y: window.innerHeight-(this.state.filterVisible? 203 :150) }}
onRowClick={this.handleRowClick.bind(this)} onRowClick={this.handleRowClick.bind(this)}
/> />
</Layout> </Layout>
......
src/containers/Product/AddItem.jsx
View file @ 1bb7d019
...@@ -27,7 +27,7 @@ import ElementForm from '../../components/ProductForm/ElementForm'; ...@@ -27,7 +27,7 @@ import ElementForm from '../../components/ProductForm/ElementForm';
import DateTimeStatusForm from '../../components/ProductForm/DateTimeStatusForm'; import DateTimeStatusForm from '../../components/ProductForm/DateTimeStatusForm';
import DocumentsForm from '../../components/ProductForm/DocumentsForm'; import DocumentsForm from '../../components/ProductForm/DocumentsForm';
import ContactForm from '../../components/ProductForm/ContactForm'; import ContactForm from '../../components/ProductForm/ContactForm';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
......
src/containers/Product/EditItem.jsx
View file @ 1bb7d019
...@@ -28,7 +28,7 @@ import ElementForm from '../../components/ProductForm/ElementForm'; ...@@ -28,7 +28,7 @@ import ElementForm from '../../components/ProductForm/ElementForm';
import DateTimeStatusForm from '../../components/ProductForm/DateTimeStatusForm'; import DateTimeStatusForm from '../../components/ProductForm/DateTimeStatusForm';
import DocumentsForm from '../../components/ProductForm/DocumentsForm'; import DocumentsForm from '../../components/ProductForm/DocumentsForm';
import ContactForm from '../../components/ProductForm/ContactForm'; import ContactForm from '../../components/ProductForm/ContactForm';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
@connect(state=>({ @connect(state=>({
......
src/containers/Product/List.jsx
View file @ 1bb7d019
...@@ -17,7 +17,7 @@ import { ...@@ -17,7 +17,7 @@ import {
import {Link} from 'react-router'; import {Link} from 'react-router';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
const ProductStatus = Object.keys(PRODUCT_STATUS).filter(key=>key != -9); const ProductStatus = Object.keys(PRODUCT_STATUS).filter(key=>key != -9);
...@@ -147,13 +147,13 @@ export default class List extends Component { ...@@ -147,13 +147,13 @@ export default class List extends Component {
this.fetchList(searchQuery); this.fetchList(searchQuery);
} }
handleResetFilterForm(e){ handleResetFilterForm(e) {
e.preventDefault(); e.preventDefault();
this.props.form.setFieldsValue({ this.props.form.setFieldsValue({
id:undefined, id: undefined,
status: undefined, status: undefined,
categoryId:undefined, categoryId: undefined,
title:undefined title: undefined
}); });
} }
...@@ -189,9 +189,11 @@ export default class List extends Component { ...@@ -189,9 +189,11 @@ export default class List extends Component {
const operation = ( const operation = (
<div style={{textAlign:'right'}}> <div style={{textAlign:'right'}}>
<Button size="small" type="ghost" onClick={this.handleFilterVisible.bind(this)}> <Button.Group>
<Button type="ghost" onClick={this.handleFilterVisible.bind(this)}>
<Icon type="filter"/> <Icon type="filter"/>
</Button> </Button>
</Button.Group>
</div> </div>
); );
...@@ -199,17 +201,15 @@ export default class List extends Component { ...@@ -199,17 +201,15 @@ export default class List extends Component {
size: 'default', size: 'default',
style: {width: 100} style: {width: 100}
} }
//horizontal
const header = ( const header = (
<div>
<MainHeader breadcrumb={['产品管理', '产品列表']} <MainHeader breadcrumb={['产品管理', '产品列表']}
title="产品列表" title="产品列表"
operation={operation} operation={operation}
/> >
{ {
this.state.filterVisible && this.state.filterVisible &&
<Form inline onSubmit={this.handleFilterSubmit.bind(this)} style={{marginBottom:20}} <Form className="filterForm" inline onSubmit={this.handleFilterSubmit.bind(this)}>
className="tac">
<Form.Item label="ID"> <Form.Item label="ID">
<Input placeholder="请输入搜索ID" {...searchStyle} {...getFieldProps('id')}/> <Input placeholder="请输入搜索ID" {...searchStyle} {...getFieldProps('id')}/>
</Form.Item> </Form.Item>
...@@ -247,7 +247,7 @@ export default class List extends Component { ...@@ -247,7 +247,7 @@ export default class List extends Component {
</Form.Item> </Form.Item>
</Form> </Form>
} }
</div> </MainHeader>
); );
return ( return (
...@@ -256,7 +256,7 @@ export default class List extends Component { ...@@ -256,7 +256,7 @@ export default class List extends Component {
dataSource={Array.isArray(items)?items:[]} dataSource={Array.isArray(items)?items:[]}
loading={loading} loading={loading}
pagination={pagination} pagination={pagination}
scroll={{ y: window.innerHeight-(this.state.filterVisible? 432 :380) }} scroll={{ y: window.innerHeight-(this.state.filterVisible? 203 :150) }}
onRowClick={this.handleRowClick.bind(this)} onRowClick={this.handleRowClick.bind(this)}
/> />
</Layout> </Layout>
......
src/containers/Product/Product.less
View file @ 1bb7d019
...@@ -19,13 +19,20 @@ ...@@ -19,13 +19,20 @@
.tablist { .tablist {
} }
//.ant-tabs-vertical.ant-tabs-left > .ant-tabs-content {
// padding-left: 5px;
// padding-top: 24px;
//}
.ant-tabs-content { .ant-tabs-content {
flex: 1; flex: 1;
height: 100%; height: 100%;
padding-left:0 !important;
.ant-tabs-tabpane { .ant-tabs-tabpane {
height: 100%; height: 100%;
overflow: auto; overflow: auto;
padding-top:24px;
} }
} }
} }
} }
src/containers/Remittance/List.jsx
View file @ 1bb7d019
...@@ -4,7 +4,7 @@ import {Table, Icon} from 'antd'; ...@@ -4,7 +4,7 @@ import {Table, Icon} from 'antd';
import {Link} from 'react-router'; import {Link} from 'react-router';
import {serialize, formatDateTime, remittanceAuditStatusToString} from '../../utils'; import {serialize, formatDateTime, remittanceAuditStatusToString} from '../../utils';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
const columns = [ const columns = [
{ {
...@@ -75,7 +75,9 @@ export default class List extends Component { ...@@ -75,7 +75,9 @@ export default class List extends Component {
constructor(props, context) { constructor(props, context) {
super(props, context); super(props, context);
this.state = {
filterVisible: false
}
} }
componentDidMount() { componentDidMount() {
...@@ -122,11 +124,11 @@ export default class List extends Component { ...@@ -122,11 +124,11 @@ export default class List extends Component {
return ( return (
<Layout header={header}> <Layout header={header}>
<Table className="ant-table" columns={columns} <Table className="list-table" columns={columns}
dataSource={Array.isArray(items) ? items : []} dataSource={Array.isArray(items) ? items : []}
loading={loading} loading={loading}
pagination={pagination} pagination={pagination}
scroll={{y: window.innerHeight - 380}} scroll={{ y: window.innerHeight-(this.state.filterVisible? 203 :150) }}
onRowClick={this.handleRowClick.bind(this)} onRowClick={this.handleRowClick.bind(this)}
/> />
</Layout> </Layout>
......
src/containers/Remittance/PassItem.jsx
View file @ 1bb7d019
...@@ -21,7 +21,7 @@ import { ...@@ -21,7 +21,7 @@ import {
} from 'antd'; } from 'antd';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
import { import {
formatDateTime, formatDateTime,
......
src/containers/Trade/AddItem.jsx
View file @ 1bb7d019
...@@ -18,7 +18,7 @@ import { ...@@ -18,7 +18,7 @@ import {
} from 'antd'; } from 'antd';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
import { import {
formatDateTime, formatDateTime,
...@@ -122,7 +122,7 @@ export default class AddItem extends Component { ...@@ -122,7 +122,7 @@ export default class AddItem extends Component {
return ( return (
<Layout header={header}> <Layout header={header}>
<Spin spinning={loading}> <Spin spinning={loading}>
<Form horizontal onSubmit={this.handleSubmit.bind(this)} style={{height:'100%'}}> <Form className="main-form" horizontal onSubmit={this.handleSubmit.bind(this)}>
<Form.Item {...smallFormItemLayout} label="理财师手机号" help="请准确核对理财师手机号码"> <Form.Item {...smallFormItemLayout} label="理财师手机号" help="请准确核对理财师手机号码">
<Input {...getFieldProps('user.mobile')} /> <Input {...getFieldProps('user.mobile')} />
</Form.Item> </Form.Item>
...@@ -160,7 +160,7 @@ export default class AddItem extends Component { ...@@ -160,7 +160,7 @@ export default class AddItem extends Component {
{...getFieldProps('remittance.remittanceTime')} {...getFieldProps('remittance.remittanceTime')}
/> />
</Form.Item> </Form.Item>
<Form.Item {...formItemLayout} label="投资人银行卡开户行"> <Form.Item {...smallFormItemLayout} label="投资人银行卡开户行">
<Input placeholder="中国工商银行杭州文一西路支行" {...getFieldProps('remittance.bankBranch')} /> <Input placeholder="中国工商银行杭州文一西路支行" {...getFieldProps('remittance.bankBranch')} />
</Form.Item> </Form.Item>
<Form.Item {...formItemLayout} label="投资人银行卡照片"> <Form.Item {...formItemLayout} label="投资人银行卡照片">
......
src/containers/Trade/Commission.jsx
View file @ 1bb7d019
...@@ -29,7 +29,7 @@ import { ...@@ -29,7 +29,7 @@ import {
} from '../../utils'; } from '../../utils';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
@connect(state=>({ @connect(state=>({
item: state.trade.item, item: state.trade.item,
......
src/containers/Trade/Contract.jsx
View file @ 1bb7d019
...@@ -29,7 +29,7 @@ import { ...@@ -29,7 +29,7 @@ import {
} from '../../utils'; } from '../../utils';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
@connect(state=>({ @connect(state=>({
loading: state.contract.loading, loading: state.contract.loading,
......
src/containers/Trade/Item.jsx
View file @ 1bb7d019
...@@ -9,7 +9,7 @@ import { ...@@ -9,7 +9,7 @@ import {
} from '../../utils'; } from '../../utils';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
@connect(state=>({ @connect(state=>({
loading: state.trade.loading, loading: state.trade.loading,
......
src/containers/Trade/List.jsx
View file @ 1bb7d019
import React, {Component, PropTypes} from 'react'; import React, {Component, PropTypes} from 'react';
import {connect} from 'react-redux'; import {connect} from 'react-redux';
import {Table, Icon, Breadcrumb, Row, Col, Input} 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, tradeStatusToString} from '../../utils';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
const columns = [ const columns = [
{ {
...@@ -82,11 +82,14 @@ const columns = [ ...@@ -82,11 +82,14 @@ const columns = [
loading: state.trade.loading, loading: state.trade.loading,
total: state.trade.total, total: state.trade.total,
})) }))
@Form.create()
export default class List extends Component { export default class List extends Component {
constructor(props, context) { constructor(props, context) {
super(props, context); super(props, context);
this.state = {
filterVisible: false,
}
} }
componentWillMount() { componentWillMount() {
...@@ -104,9 +107,45 @@ export default class List extends Component { ...@@ -104,9 +107,45 @@ export default class List extends Component {
this.props.history.push('/trades/' + id); this.props.history.push('/trades/' + id);
} }
handleFilterVisible() {
this.setState({
filterVisible: !this.state.filterVisible
});
}
handleFilterSubmit(e) {
e.preventDefault();
// const formData = this.props.form.getFieldsValue();
// if (formData.categoryId && formData.categoryId[1]) {
// formData.categoryId = formData.categoryId[1];
// }
// const searchQuery = {...this.props.location.query, ...formData};
// console.log(searchQuery);
// this.props.history.replace(this.props.location.pathname + '?' + serialize(searchQuery));
// this.fetchList(searchQuery);
}
handleResetFilterForm(e) {
e.preventDefault();
// this.props.form.setFieldsValue({
// id: undefined,
// status: undefined,
// categoryId: undefined,
// title: undefined
// });
}
render() { render() {
const {total, items, loading, history:{replace}, location:{pathname, query}} = this.props; const {
total,
items,
loading,
history:{replace},
form:{getFieldProps},
location:{pathname, query}
} = this.props;
const pagination = { const pagination = {
total: total, total: total,
...@@ -128,18 +167,66 @@ export default class List extends Component { ...@@ -128,18 +167,66 @@ export default class List extends Component {
} }
}; };
const operation = (
<div style={{textAlign:'right'}}>
<Button.Group>
<Button type="ghost" onClick={this.handleFilterVisible.bind(this)}>
<Icon type="filter"/>
</Button>
</Button.Group>
</div>
);
const header = (<MainHeader breadcrumb={['订单管理', '订单列表']} const header = (
title="订单列表"/>); <MainHeader breadcrumb={['订单管理', '订单列表']}
operation={operation}
title="订单列表">
{
this.state.filterVisible &&
<Form className="filterForm" inline onSubmit={this.handleFilterSubmit.bind(this)}>
<Form.Item label="ID">
<Input placeholder="请输入搜索ID" {...searchStyle} {...getFieldProps('id')}/>
</Form.Item>
<Form.Item label="类目">
{
cates &&
<Cascader options={cates} placeholder="请选产品类目" {...searchStyle}
{...getFieldProps('categoryId')}
/>
}
</Form.Item>
<Form.Item label="标题">
<Input placeholder="请输入搜索标题" {...searchStyle} {...getFieldProps('title')}/>
</Form.Item>
<Form.Item label="状态">
<Select placeholder="请选择状态" {...searchStyle} {...getFieldProps('status')}>
<Select.Option key="status-option-default"
value={null}>请选择</Select.Option>
</Select>
</Form.Item>
<Form.Item>
<Button.Group size="default">
<Button type="primary" size="default" htmlType="submit" loading={loading}><Icon
type="search"/>筛选</Button>
<Button type="ghost" size="default" htmlType="reset"
onClick={this.handleResetFilterForm.bind(this)}><Icon
type="cross-circle-o"/>清空</Button>
</Button.Group>
</Form.Item>
</Form>
}
</MainHeader>
);
return ( return (
<Layout header={header}> <Layout header={header}>
<Table className="ant-table" columns={columns} <Table className="list-table" columns={columns}
dataSource={Array.isArray(items)?items:[]} dataSource={Array.isArray(items)?items:[]}
loading={loading} loading={loading}
pagination={pagination} pagination={pagination}
scroll={{ y: window.innerHeight-380 }} scroll={{ y: window.innerHeight-(this.state.filterVisible? 203 :150) }}
onRowClick={this.handleRowClick.bind(this)} onRowClick={this.handleRowClick.bind(this)}
/> />
</Layout> </Layout>
......
src/containers/Withdraw/List.jsx
View file @ 1bb7d019
...@@ -5,7 +5,7 @@ import {Link} from 'react-router'; ...@@ -5,7 +5,7 @@ import {Link} from 'react-router';
import {serialize, formatDateTime, remittanceAuditStatusToString} from '../../utils'; import {serialize, formatDateTime, remittanceAuditStatusToString} from '../../utils';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
const columns = [ const columns = [
{ {
...@@ -17,6 +17,7 @@ const columns = [ ...@@ -17,6 +17,7 @@ const columns = [
title: '提款人', title: '提款人',
dataIndex: 'bankCard', dataIndex: 'bankCard',
key: 'bankCard', key: 'bankCard',
width:150,
render: (bankCard, record)=>(<span>{bankCard.userName}</span>) render: (bankCard, record)=>(<span>{bankCard.userName}</span>)
}, { }, {
title: '提现金额', title: '提现金额',
...@@ -69,6 +70,9 @@ export default class List extends Component { ...@@ -69,6 +70,9 @@ export default class List extends Component {
constructor(props, context) { constructor(props, context) {
super(props, context); super(props, context);
this.state = {
filterVisible: false
}
} }
...@@ -116,11 +120,11 @@ export default class List extends Component { ...@@ -116,11 +120,11 @@ export default class List extends Component {
return ( return (
<Layout header={header}> <Layout header={header}>
<Table className="ant-table" columns={columns} <Table className="list-table" columns={columns}
dataSource={Array.isArray(items) ? items : []} dataSource={Array.isArray(items) ? items : []}
loading={loading} loading={loading}
pagination={pagination} pagination={pagination}
scroll={{y: window.innerHeight - 380}} scroll={{ y: window.innerHeight-(this.state.filterVisible? 203 :150) }}
onRowClick={this.handleRowClick.bind(this)} onRowClick={this.handleRowClick.bind(this)}
/> />
</Layout> </Layout>
......
src/containers/Withdraw/PassItem.jsx
View file @ 1bb7d019
...@@ -21,7 +21,7 @@ import { ...@@ -21,7 +21,7 @@ import {
} from 'antd'; } from 'antd';
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
import { import {
formatDateTime, formatDateTime,
......
src/entries/index.less
View file @ 1bb7d019
@import '../variable';
:global { :global {
html, body, #root { html, body, #root {
height: 100vh !important;
height: 100%; height: 100%;
font-size: 14px;
background-color: #e9ecf3;
} }
//input[type="text"][readonly], #root {
//textarea[readonly]{ display: flex;
// background-color: #fafafa !important; flex-direction: column;
//}
//.ant-cascader-input[type="text"][readonly]{ .ant-btn,
// background-color: #fff !important; .ant-btn-ghost,
//} .ant-pagination-item,
label, .ant-pagination-prev,
.ant-form-item { .ant-pagination-next {
font-size: 14px !important; &:focus,
.ant-form-explain { &:hover {
font-size: 12px; color: @primary-color;
border-color: @primary-color;
}
}
.ant-btn-primary,
.ant-pagination-item-active {
background-color: @primary-color;
border-color: @primary-color;
&:hover {
color: #fff;
}
}
.ant-input,
.ant-select-selection {
&:focus,
&:hover {
border-color: @primary-color;
}
&:focus {
box-shadow: 0 0 0 2px rgba(76, 150, 137, 0.2);
}
}
.ant-btn-group {
.ant-btn-primary {
&:last-child:not(:first-child),
& + .ant-btn {
border-left-color: @primary-color;
} }
} }
.ant-btn {
font-weight: 400 !important;
} }
.ant-table{ .ant-pagination-prev:hover,
font-size: 14px !important; .ant-pagination-next:hover,
.ant-pagination-item:hover {
a {
color: @primary-color;
} }
}
.ant-pagination-item-active:hover {
a {
color: #fff;
}
}
.ant-pagination-disabled:hover {
border-color: #d9d9d9;
a {
color: #ccc;
}
}
.ant-table {
th, td {
padding: 10px 5px;
}
}
.ant-form-item-with-help {
margin-bottom: 10px;
}
.ant-tabs-vertical {
.ant-tabs-nav {
padding-top: 14px;
}
}
.ant-tabs-vertical > .ant-tabs-bar .ant-tabs-tab {
margin: 5px 0;
}
.list-table { .list-table {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
& > div { align-items: center;
.ant-table-header,
.ant-table {
&, table {
border-radius: 0;
}
}
.ant-table {
th, td {
&:first-child { &:first-child {
flex: 1 padding-left: 20px;
}
&:last-child {
padding-right: 20px;
}
}
th {
background-color: #eee;
.borderBottom;
}
tr {
&:nth-child(2n) {
background-color: #fcfcfc;
} }
} }
} }
.ant-menu-vertical, & > div {
.ant-menu-inline, &:first-child {
.ant-menu-item-group-list { flex: 1;
& > .ant-menu-item, width: 100%;
& > .ant-menu-submenu > .ant-menu-submenu-title { }
.cn { }
font-size: 14px; .ant-table-pagination {
margin: 10px 0;
} }
.en {
font-size: 10px;
margin-left: .5em;
opacity: .45;
font-style: italic;
font-weight: 300;
} }
.tac {
text-align: center !important;
}
.img-priview-dialog {
.ant-modal-content {
background-color: transparent;
img {
margin: auto;
display: block;
}
} }
} }
}
} }
src/variable.less 0 → 100644
View file @ 1bb7d019
@primary-color : #4c9689;
@info-color : #4c9689;
@success-color : #87d068;
@error-color : #f50;
@warning-color : #fa0;
.borderBottom() {
border-bottom: 1px solid #e2e2e2;
}
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