Commit 712bedf8 authored by superman's avatar superman

1

parent bc005bb2
...@@ -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",
...@@ -57,4 +57,4 @@ ...@@ -57,4 +57,4 @@
"start": "dora --plugins \"proxy,webpack,webpack-hmr,livereload?enableJs=false&injectHost=127.0.0.1,browser-history?index=/src/entries/index.html\"", "start": "dora --plugins \"proxy,webpack,webpack-hmr,livereload?enableJs=false&injectHost=127.0.0.1,browser-history?index=/src/entries/index.html\"",
"test": "atool-test-mocha ./src/**/__tests__/*-test.js" "test": "atool-test-mocha ./src/**/__tests__/*-test.js"
} }
} }
\ No newline at end of file
...@@ -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,85 +118,80 @@ export default class ElementForm extends Component { ...@@ -118,85 +118,80 @@ 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 ? //或者自定义其他要素
{ <Form.Item>
isEdit ? //或者自定义其他要素 <h3>可以设置以下要素</h3>
<div> <p>总规模、投资亮点、托管方、结算方式、资金用途、融资方、担保主体、风控措施、还款来源、发行方、认购起点、大小额配比</p>
<Form.Item>
<h3>可以设置以下要素</h3>
<p>总规模、投资亮点、托管方、结算方式、资金用途、融资方、担保主体、风控措施、还款来源、发行方、认购起点、大小额配比</p>
</Form.Item>
<Form.Item>
{
this.state.elements.map((item, index)=>
<div key={item.key} style={{marginBottom:8}}>
<Input.Group>
<Col span="6">
<Input placeholder="标题"
{...getFieldProps(item.key + '.title', {
initialValue: item.title
})}
/>
</Col>
<Col span="10">
<Input type="textarea" placeholder="内容" autosize
{...getFieldProps(item.key + '.content', {
initialValue: item.content
})}
/>
</Col>
<Col span="4">
<Icon type="cross" title="删除"
onClick={this.handleRemoveElement.bind(this, index)}/>
</Col>
</Input.Group>
</div>
)
}
</Form.Item>
</div>
:
this.state.elements.length ?
<Form.Item>
<table className="data-grid">
<colgroup>
<col width="150px"/>
<col />
</colgroup>
<thead>
<tr>
<th>元素标题</th>
<th>元素内容</th>
</tr>
</thead>
<tbody>
{
this.state.elements.map(item=>
item.title && item.content &&
<tr key={item.key}>
<th>{item.title}</th>
<td {...innerHTML(item.content, true)}></td>
</tr>
)
}
</tbody>
</table>
</Form.Item>
:
<Form.Item {...footerFormSubmitLayout}>
还没有设置过任何基本要素
</Form.Item>
}
<Form.Item {...footerFormSubmitLayout} style={{marginTop:30}}>
{ {
isEdit ? this.state.elements.map((item, index)=>
<span> <div key={item.key} style={{marginBottom:8}}>
<Input.Group>
<Col span="6">
<Input placeholder="标题"
{...getFieldProps(item.key + '.title', {
initialValue: item.title
})}
/>
</Col>
<Col span="10">
<Input type="textarea" placeholder="内容" autosize
{...getFieldProps(item.key + '.content', {
initialValue: item.content
})}
/>
</Col>
<Col span="4">
<Icon type="cross" title="删除"
onClick={this.handleRemoveElement.bind(this, index)}/>
</Col>
</Input.Group>
</div>
)
}
</Form.Item>
:
this.state.elements.length ?
<Form.Item>
<table className="data-grid" style={{maxWidth:600}}>
<colgroup>
<col width="150px"/>
<col />
</colgroup>
<thead>
<tr>
<th>元素标题</th>
<th>元素内容</th>
</tr>
</thead>
<tbody>
{
this.state.elements.map(item=>
item.title && item.content &&
<tr key={item.key}>
<th>{item.title}</th>
<td {...innerHTML(item.content, true)}/>
</tr>
)
}
</tbody>
</table>
</Form.Item>
:
<Form.Item {...footerFormSubmitLayout}>
还没有设置过任何基本要素
</Form.Item>
}
<Form.Item {...footerFormSubmitLayout} style={{marginTop:30}}>
{
isEdit ?
<span>
<Button size="large" onClick={this.handleAddElement.bind(this)} <Button size="large" onClick={this.handleAddElement.bind(this)}
style={{marginRight:'1em'}}> style={{marginRight:'1em'}}>
<Icon type="plus"/>添加 <Icon type="plus"/>添加
...@@ -205,19 +200,19 @@ export default class ElementForm extends Component { ...@@ -205,19 +200,19 @@ export default class ElementForm extends Component {
<Icon type="save"/>保存 <Icon type="save"/>保存
</Button> </Button>
</span> </span>
: :
<Button type="primary" onClick={e=>{ <Button type="primary" onClick={e=>{
e.preventDefault(); e.preventDefault();
this.props.dispatch({ this.props.dispatch({
type:'UPDATE_PRODUCT' type:'UPDATE_PRODUCT'
}); });
}}> }}>
<Icon type="edit"/>编辑 <Icon type="edit"/>编辑
</Button> </Button>
} }
{ {
!this.props.isCreate && !this.props.isCreate &&
<Button onClick={e=>{ <Button onClick={e=>{
e.preventDefault(); e.preventDefault();
isEdit ? isEdit ?
this.props.dispatch({ this.props.dispatch({
...@@ -225,14 +220,13 @@ export default class ElementForm extends Component { ...@@ -225,14 +220,13 @@ export default class ElementForm extends Component {
}) : }) :
this.props.history.goBack(); this.props.history.goBack();
}} }}
style={{marginLeft:'1em'}}> style={{marginLeft:'1em'}}>
<Icon type="rollback"/> <Icon type="rollback"/>
{isEdit ? '取消' : '返回'} {isEdit ? '取消' : '返回'}
</Button> </Button>
} }
</Form.Item> </Form.Item>
</Col>
</Row>
</Form> </Form>
</Spin> </Spin>
); );
......
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>
);
}
}
...@@ -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,13 +74,25 @@ export default class EditItem extends Component { ...@@ -73,13 +74,25 @@ 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>
</Button.Group> </Button.Group>
...@@ -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>
......
...@@ -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;
}); });
} }
res.action = resourceActions(res.actionMask); if (isEdit) {
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 {
map.push(res); res.action = permisAction;
}
resourcesCategoryMap[category] = map;
resourcesControllerNameMap[res.controllerName] = res; if (isEdit || permisAction.length) {
map.push(res);
resourcesCategoryMap[category] = map;
}
} }
}); });
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}
const cs = {}; checkedKeys={this.state.checkedKeys}
let totalMask = 0; onClick={
checkedKeys.forEach(key=>{ (cks)=>{
const [ac, cn, mask] = key.split('-'); const cs = {};
if(ac === 'a' && typeof mask !== 'undefined'){ cks.forEach(key=>{
let _mask = parseInt(mask, 10); const [ac, cn, mask] = key.split('-');
cs[cn] = (cs[cn] || 0) + _mask; if(ac === 'a' && typeof mask !== 'undefined'){
totalMask += _mask; let _mask = parseInt(mask, 10);
} cs[cn] = (cs[cn] || 0) + _mask;
});
console.log(cs); }
this.setState({ });
permissions: cs, console.log(cs);
permissionsMask: totalMask this.setState({
}) checkedKeys: cks,
}}> permissions: cs,
})
}
}
>
{ {
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 {
} }
...@@ -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;
}
}
}
}
} }
...@@ -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}
}, },
......
...@@ -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){
......
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'
});
} }
} }
......
...@@ -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