Skip to content

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

1

parent bc005bb2
Show whitespace changes
Inline Side-by-side
Showing with 310 additions and 170 deletions
package.json
View file @ 712bedf8
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
"private": true, "private": true,
"entry": {}, "entry": {},
"dependencies": { "dependencies": {
"antd": "^1.1.0", "antd": "^1.8.0",
"atool-build": "^0.7.1", "atool-build": "^0.7.1",
"babel-plugin-antd": "^0.4.0", "babel-plugin-antd": "^0.4.0",
"babel-plugin-transform-runtime": "^6.8.0", "babel-plugin-transform-runtime": "^6.8.0",
......
src/components/ProductForm/ElementForm.jsx
View file @ 712bedf8
...@@ -64,8 +64,8 @@ export default class ElementForm extends Component { ...@@ -64,8 +64,8 @@ export default class ElementForm extends Component {
elements: BaseElementTransform(nextProps.product.elements) elements: BaseElementTransform(nextProps.product.elements)
}); });
} }
} }
console.log(nextProps);
} }
/** /**
...@@ -118,20 +118,15 @@ export default class ElementForm extends Component { ...@@ -118,20 +118,15 @@ export default class ElementForm extends Component {
render() { render() {
const {form:{getFieldProps}, loading, isEdit} = this.props; const {form:{getFieldProps}, loading, isEdit} = this.props;
console.log(this.state.elements);
return ( return (
<Spin spinning={loading}> <Spin spinning={loading}>
<Form horizontal onSubmit={this.handleSubmit.bind(this)}> <Form horizontal onSubmit={this.handleSubmit.bind(this)} style={{padding:'0 20px'}}>
<Row style={{padding:'0 20px'}}>
<Col span="24">
{ {
isEdit ? //或者自定义其他要素 isEdit ? //或者自定义其他要素
<div>
<Form.Item> <Form.Item>
<h3>可以设置以下要素</h3> <h3>可以设置以下要素</h3>
<p>总规模、投资亮点、托管方、结算方式、资金用途、融资方、担保主体、风控措施、还款来源、发行方、认购起点、大小额配比</p> <p>总规模、投资亮点、托管方、结算方式、资金用途、融资方、担保主体、风控措施、还款来源、发行方、认购起点、大小额配比</p>
</Form.Item>
<Form.Item>
{ {
this.state.elements.map((item, index)=> this.state.elements.map((item, index)=>
<div key={item.key} style={{marginBottom:8}}> <div key={item.key} style={{marginBottom:8}}>
...@@ -159,11 +154,11 @@ export default class ElementForm extends Component { ...@@ -159,11 +154,11 @@ export default class ElementForm extends Component {
) )
} }
</Form.Item> </Form.Item>
</div>
: :
this.state.elements.length ? this.state.elements.length ?
<Form.Item> <Form.Item>
<table className="data-grid">
<table className="data-grid" style={{maxWidth:600}}>
<colgroup> <colgroup>
<col width="150px"/> <col width="150px"/>
<col /> <col />
...@@ -180,7 +175,7 @@ export default class ElementForm extends Component { ...@@ -180,7 +175,7 @@ export default class ElementForm extends Component {
item.title && item.content && item.title && item.content &&
<tr key={item.key}> <tr key={item.key}>
<th>{item.title}</th> <th>{item.title}</th>
<td {...innerHTML(item.content, true)}></td> <td {...innerHTML(item.content, true)}/>
</tr> </tr>
) )
} }
...@@ -231,8 +226,7 @@ export default class ElementForm extends Component { ...@@ -231,8 +226,7 @@ export default class ElementForm extends Component {
</Button> </Button>
} }
</Form.Item> </Form.Item>
</Col>
</Row>
</Form> </Form>
</Spin> </Spin>
); );
......
src/components/ProductForm/KeyValue.jsx 0 → 100644
View file @ 712bedf8
import React, {Component, PropTypes} from 'react';
import {
Row,
Col,
Form,
Input,
Button,
Checkbox,
Select,
message,
Tabs,
Cascader,
Radio,
Upload,
Icon,
Modal,
DatePicker,
Table,
Spin
} from 'antd';
export default class KeyValue extends Component {
render(){
const {label, content, operation} = this.props;
return (
<Row>
<Col span={label.layout}>
<Input {...label.input}/>
</Col>
<Col span={content.layout}>
<Input {...content.input}/>
</Col>
<Col span={operation.layout}>
{operation.input}
</Col>
</Row>
);
}
}
src/containers/Announcement/EditItem.jsx
View file @ 712bedf8
...@@ -23,11 +23,12 @@ import { ...@@ -23,11 +23,12 @@ import {
import Layout from '../../components/Layout/Layout'; import Layout from '../../components/Layout/Layout';
import MainHeader from '../../components/MainHeader/MainHeader'; import MainHeader from '../../components/MainHeader/MainHeader';
import {formItemLayout, footerFormSubmitLayout} from '../../utils'; import {formItemLayout, footerFormSubmitLayout, innerHTML} from '../../utils';
@connect(state=>({ @connect(state=>({
loading: state.announcement.loading, loading: state.announcement.loading,
item: state.announcement.item, item: state.announcement.item,
isEdit: state.announcement.isEdit
})) }))
@Form.create() @Form.create()
export default class EditItem extends Component { export default class EditItem extends Component {
...@@ -44,7 +45,7 @@ export default class EditItem extends Component { ...@@ -44,7 +45,7 @@ export default class EditItem extends Component {
}; };
componentWillReceiveProps(nextProps) { componentWillReceiveProps(nextProps) {
this.setState({isEdit: nextProps.isEdit});
} }
fetchItem(id) { fetchItem(id) {
...@@ -61,7 +62,7 @@ export default class EditItem extends Component { ...@@ -61,7 +62,7 @@ export default class EditItem extends Component {
console.log(data); console.log(data);
this.props.dispatch({ this.props.dispatch({
type: 'UPDATE_ANNOUNCEMENT_ITEM', type: 'UPDATE_ANNOUNCEMENT_ITEM',
data item: data
}); });
} }
...@@ -73,12 +74,24 @@ export default class EditItem extends Component { ...@@ -73,12 +74,24 @@ export default class EditItem extends Component {
const operation = ( const operation = (
<div style={{textAlign:'right'}}> <div style={{textAlign:'right'}}>
<Button.Group> <Button.Group>
<Button type="ghost" onClick={e=>{e.preventDefault(); this.setState({isEdit: !this.state.isEdit})}}> <Button type="ghost"
onClick={
e=>{
e.preventDefault();
this.props.dispatch({
type: isEdit ? 'CANCEL_UPDATE_ANNOUNCEMENT' : 'UPDATE_ANNOUNCEMENT'
});
}
}>
<Icon type="edit"/> <Icon type="edit"/>
</Button> </Button>
<Button type="ghost" onClick={e=>{ <Button type="ghost" onClick={e=>{
e.preventDefault(); e.preventDefault();
isEdit ? this.setState({isEdit: !this.state.isEdit}) : this.props.history.goBack(); isEdit ?
this.props.dispatch({
type: 'CANCEL_UPDATE_ANNOUNCEMENT'
}) :
this.props.history.goBack();
}}> }}>
<Icon type="rollback"/> <Icon type="rollback"/>
</Button> </Button>
...@@ -87,8 +100,8 @@ export default class EditItem extends Component { ...@@ -87,8 +100,8 @@ export default class EditItem extends Component {
); );
const breadcrumb = ['产品管理', '产品详情']; const breadcrumb = ['产品管理', '产品详情'];
const titlePart = isEdit ? '修改公告' : '公告详情'; const titlePart = '公告详情';
const title = (item && item.title ? item.title + ' - ' : '') + titlePart; const title = (item && item.title ? item.title + ' - ' : '') + titlePart + (isEdit ? ' - 编辑' :'');
breadcrumb.push(titlePart); breadcrumb.push(titlePart);
...@@ -122,28 +135,38 @@ export default class EditItem extends Component { ...@@ -122,28 +135,38 @@ export default class EditItem extends Component {
initialValue: item.announcement initialValue: item.announcement
})} /> })} />
: :
<p style={{maxWidth:500}}> <p style={{maxWidth:500}} {...innerHTML(item.announcement, true)} />
{item.announcement}
</p>
} }
</Form.Item> </Form.Item>
<Form.Item {...footerFormSubmitLayout} style={{marginTop:30}}> <Form.Item {...footerFormSubmitLayout} style={{marginTop:30}}>
{ {
isEdit ? isEdit ?
<Button type="primary" htmlType="submit" loading={loading}> <Button type="primary" onClick={this.handleSubmit.bind(this)}
loading={loading}>
<Icon type="save"/>保存 <Icon type="save"/>保存
</Button> </Button>
: :
<Button type="primary" <Button type="primary" onClick={e=>{
onClick={e=>{e.preventDefault(); this.setState({isEdit: !this.state.isEdit})}}> e.preventDefault();
this.props.dispatch({
type:'UPDATE_ANNOUNCEMENT'
});
}}>
<Icon type="edit"/>编辑 <Icon type="edit"/>编辑
</Button> </Button>
} }
<Button style={{marginLeft:'1em'}} onClick={e=>{ <Button onClick={e=>{
e.preventDefault(); e.preventDefault();
isEdit ? this.setState({isEdit: !this.state.isEdit}) : this.props.history.goBack(); isEdit ?
}}> this.props.dispatch({
<Icon type="rollback"/>返回 type: 'CANCEL_UPDATE_ANNOUNCEMENT'
}) :
this.props.history.goBack();
}}
style={{marginLeft:'1em'}}>
<Icon type="rollback"/>
{isEdit ? '取消' : '返回'}
</Button> </Button>
</Form.Item> </Form.Item>
</Form> </Form>
......
src/containers/Authority/EditItem.jsx
View file @ 712bedf8
...@@ -33,7 +33,7 @@ import { ...@@ -33,7 +33,7 @@ import {
NULL, NULL,
resourceActions, resourceActions,
enableStatusToString, enableStatusToString,
ENABLE_STATUS_LIST ENABLE_STATUS_LIST
} from '../../utils'; } from '../../utils';
import './EditItem.less'; import './EditItem.less';
...@@ -53,7 +53,9 @@ export default class EditItem extends Component { ...@@ -53,7 +53,9 @@ export default class EditItem extends Component {
this.state = { this.state = {
isEdit: false, isEdit: false,
permissions: {}, permissions: {},
permissionsMask: 0 expandedKeys:[],
autoExpandParent: true,
checkedKeys:[]
} }
} }
...@@ -64,7 +66,12 @@ export default class EditItem extends Component { ...@@ -64,7 +66,12 @@ export default class EditItem extends Component {
}; };
componentWillReceiveProps(nextProps) { componentWillReceiveProps(nextProps) {
this.setState({isEdit: nextProps.isEdit}); const state = {isEdit: nextProps.isEdit};
if (nextProps.item && nextProps.item.permissions && nextProps.resources) {
state.permissions = nextProps.item.permissions;
console.log('state.permissions', state.permissions);
}
this.setState(state);
}; };
fetchItem(id) { fetchItem(id) {
...@@ -101,6 +108,24 @@ export default class EditItem extends Component { ...@@ -101,6 +108,24 @@ export default class EditItem extends Component {
}); });
} }
handleExpand(expandedKeys){
console.log('onExpand', arguments);
this.setState({
expandedKeys,
autoExpandParent: false
});
}
handleCheck(checkedKeys){
this.setState({
checkedKeys
});
}
render() { render() {
const {item, resources, loading, form:{getFieldProps}, location:{query}} = this.props; const {item, resources, loading, form:{getFieldProps}, location:{query}} = this.props;
...@@ -124,7 +149,7 @@ export default class EditItem extends Component { ...@@ -124,7 +149,7 @@ export default class EditItem extends Component {
e.preventDefault(); e.preventDefault();
isEdit ? isEdit ?
this.props.dispatch({ this.props.dispatch({
type: 'CANCEL_UPDATE_PRODUCT' type: 'CANCEL_UPDATE_AUTHORITY'
}) : }) :
this.props.history.goBack(); this.props.history.goBack();
}}> }}>
...@@ -144,17 +169,14 @@ export default class EditItem extends Component { ...@@ -144,17 +169,14 @@ export default class EditItem extends Component {
//对权限资源分组 //对权限资源分组
const resourcesCategoryMap = {}; const resourcesCategoryMap = {};
//权限资源对应Controller Map;
const resourcesControllerNameMap = {};
//角色权限 //角色权限
const permissions = {}; const {permissions} = this.state;
const checkedKeys = []; const checkedKeys = [];
resources.forEach(res=> { resources.forEach(res=> {
if (res.actionMask && res.status == 9 ) { if (res.actionMask && res.status == 9) {
const category = res.category || '其他'; const category = res.category || '其他';
const map = resourcesCategoryMap[category] || []; const map = resourcesCategoryMap[category] || [];
...@@ -163,29 +185,32 @@ export default class EditItem extends Component { ...@@ -163,29 +185,32 @@ export default class EditItem extends Component {
const permisAction = permisMask && resourceActions(permisMask) || []; const permisAction = permisMask && resourceActions(permisMask) || [];
const permisActionMap = {}; const permisActionMap = {};
if(permisAction.length){ if (permisAction.length) {
permisAction.forEach(pac=>{ permisAction.forEach(pac=> {
permisActionMap[pac.mask] = pac; permisActionMap[pac.mask] = pac;
}); });
} }
if (isEdit) {
res.action = resourceActions(res.actionMask); res.action = resourceActions(res.actionMask);
res.action.forEach(ac=> {
res.action.forEach(ac=>{ if (permisActionMap[ac.mask]) {
if(permisActionMap[ac.mask]){
ac.checked = true; ac.checked = true;
checkedKeys.push(['a', res.controllerName, ac.mask].join('-')); checkedKeys.push(['a', res.controllerName, ac.mask].join('-'));
} }
}); });
} else {
res.action = permisAction;
}
if (isEdit || permisAction.length) {
map.push(res); map.push(res);
resourcesCategoryMap[category] = map; resourcesCategoryMap[category] = map;
}
resourcesControllerNameMap[res.controllerName] = res;
} }
}); });
console.log(permissions, '选中的:', checkedKeys);
return ( return (
...@@ -261,33 +286,45 @@ export default class EditItem extends Component { ...@@ -261,33 +286,45 @@ export default class EditItem extends Component {
</Form.Item> </Form.Item>
</Col> </Col>
<Col span="12"> <Col span="12">
<Tree checkable={isEdit} defaultExpandAll={true} defaultCheckedKeys={checkedKeys} onCheck={(checkedKeys)=>{ <Tree checkable={isEdit}
// console.log(checkedKeys); defaultExpandAll={true}
checkedKeys={this.state.checkedKeys}
onClick={
(cks)=>{
const cs = {}; const cs = {};
let totalMask = 0; cks.forEach(key=>{
checkedKeys.forEach(key=>{
const [ac, cn, mask] = key.split('-'); const [ac, cn, mask] = key.split('-');
if(ac === 'a' && typeof mask !== 'undefined'){ if(ac === 'a' && typeof mask !== 'undefined'){
let _mask = parseInt(mask, 10); let _mask = parseInt(mask, 10);
cs[cn] = (cs[cn] || 0) + _mask; cs[cn] = (cs[cn] || 0) + _mask;
totalMask += _mask;
} }
}); });
console.log(cs); console.log(cs);
this.setState({ this.setState({
checkedKeys: cks,
permissions: cs, permissions: cs,
permissionsMask: totalMask
}) })
}}> }
}
>
{ {
Object.keys(resourcesCategoryMap).map((key, index)=> Object.keys(resourcesCategoryMap).map((key, index)=>
<Tree.TreeNode className="resource-category" key={'c-'+index} <Tree.TreeNode className="resource-category" key={'c-'+key}
title={key}> title={key}>
{ {
resourcesCategoryMap[key].map(res=> resourcesCategoryMap[key].map(res=>
<Tree.TreeNode className="resource-item" <Tree.TreeNode className="resource-item"
key={ res.action.length===1 ? ('a-'+res.controllerName+'-'+res.action[0].mask) :('r-' + res.id)} key={
title={res.description + (res.action.length===1 ? ' - '+res.action[0].title :'')}> res.action.length===1 ?
('a-'+res.controllerName+'-'+res.action[0].mask) :
('r-' + res.id)
}
title={
res.description + (
res.action.length===1 ? ' - '+res.action[0].title :''
)
}>
{ {
res.action.length > 1 && res.action.map(action=> res.action.length > 1 && res.action.map(action=>
<Tree.TreeNode className="resource-action" <Tree.TreeNode className="resource-action"
...@@ -302,6 +339,7 @@ export default class EditItem extends Component { ...@@ -302,6 +339,7 @@ export default class EditItem extends Component {
) )
} }
</Tree> </Tree>
</Col> </Col>
</Row> </Row>
</Form> </Form>
...@@ -313,3 +351,5 @@ export default class EditItem extends Component { ...@@ -313,3 +351,5 @@ export default class EditItem extends Component {
} }
src/entries/index.less
View file @ 712bedf8
...@@ -191,9 +191,9 @@ ...@@ -191,9 +191,9 @@
.data-grid { .data-grid {
border-spacing: 0; border-spacing: 0;
width:100%; width: 100%;
thead{ thead {
th{ th {
background-color: #f8f8f8; background-color: #f8f8f8;
} }
} }
...@@ -204,11 +204,26 @@ ...@@ -204,11 +204,26 @@
vertical-align: top; vertical-align: top;
} }
&.tac{ &.tac {
td, th{ td, th {
text-align: center; text-align: center;
} }
} }
} }
ul.data-grid {
width: 100%;
& > li {
display: flex;
border-bottom: 1px solid #e9e9e9;
& > span {
padding: 5px 5px;
text-align: left;
flex: none;
&.content {
flex: auto;
}
}
}
}
} }
src/reducers/announcement.js
View file @ 712bedf8
...@@ -37,6 +37,12 @@ const announcement = handleActions({ ...@@ -37,6 +37,12 @@ const announcement = handleActions({
['CREATE_ANNOUNCEMENT_ITEM_FAILED'](state, action){ ['CREATE_ANNOUNCEMENT_ITEM_FAILED'](state, action){
return {...state, err: action.err, loading: false} return {...state, err: action.err, loading: false}
}, },
['UPDATE_ANNOUNCEMENT_START'](state){
return {...state, isEdit: true}
},
['UPDATE_ANNOUNCEMENT_END'](state){
return {...state, isEdit: false}
},
['UPDATE_ANNOUNCEMENT_ITEM'](state){ ['UPDATE_ANNOUNCEMENT_ITEM'](state){
return {...state, loading: true} return {...state, loading: true}
}, },
......
src/reducers/authority.js
View file @ 712bedf8
...@@ -31,6 +31,13 @@ const authority = handleActions({ ...@@ -31,6 +31,13 @@ const authority = handleActions({
return {...state, loading: true} return {...state, loading: true}
}, },
['UPDATE_AUTHORITY_ITEM_SUCCESS'](state, action){ ['UPDATE_AUTHORITY_ITEM_SUCCESS'](state, action){
try {
if (action.item.permissions) {
action.item.permissions = JSON.parse(action.item.permissions)
}
}catch(err){
}
return {...state, loading: false, item: {...state.item, ...action.item}} return {...state, loading: false, item: {...state.item, ...action.item}}
}, },
['UPDATE_AUTHORITY_ITEM_FAILED'](state, action){ ['UPDATE_AUTHORITY_ITEM_FAILED'](state, action){
......
src/sagas/announcement.js
View file @ 712bedf8
import {takeLatest} from 'redux-saga'; import {takeLatest} from 'redux-saga';
import {take, call, put, fork, cancel, select} from 'redux-saga/effects'; import {take, call, put, fork, cancel, select, race} from 'redux-saga/effects';
import {fetchList, fetchItem, createItem, updateItem} from '../services/announcement'; import {fetchList, fetchItem, createItem, updateItem} from '../services/announcement';
import {message} from 'antd'; import {message} from 'antd';
...@@ -98,8 +98,21 @@ function* editItem(data) { ...@@ -98,8 +98,21 @@ function* editItem(data) {
function* watchEdit() { function* watchEdit() {
while (true) { while (true) {
const {data} = yield take('UPDATE_ANNOUNCEMENT_ITEM'); yield take('UPDATE_ANNOUNCEMENT');
yield fork(editItem, data); yield put({
type: 'UPDATE_ANNOUNCEMENT_START'
});
const {data} = yield race({
data: take('UPDATE_ANNOUNCEMENT_ITEM'),
canceled: take('CANCEL_UPDATE_ANNOUNCEMENT')
});
if (data && data.item) {
yield fork(editItem, data.item);
}
yield put({
type: 'UPDATE_ANNOUNCEMENT_END'
});
} }
} }
......
src/utils.js
View file @ 712bedf8
...@@ -242,7 +242,7 @@ export function innerHTML(html, safe) { ...@@ -242,7 +242,7 @@ export function innerHTML(html, safe) {
export function htmlEncode(text) { export function htmlEncode(text) {
return (text + '').replace(/[\<\>\&]/gi, (m)=> { return (text + '').replace(/[\<\>\& ]/gi, (m)=> {
switch (m) { switch (m) {
case '<': case '<':
return '&lt;'; return '&lt;';
...@@ -250,6 +250,8 @@ export function htmlEncode(text) { ...@@ -250,6 +250,8 @@ export function htmlEncode(text) {
return '&gt;'; return '&gt;';
case '&': case '&':
return '&amp;'; return '&amp;';
case ' ':
return '&nbsp;';
default: default:
return m; return m;
} }
......
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