个税扣缴义务人页面组件重构
This commit is contained in:
parent
cf1c6d03fa
commit
c9832d1926
|
|
@ -34,4 +34,6 @@ export const logColumns = [
|
|||
dataIndex: 'title',
|
||||
key: 'title',
|
||||
}
|
||||
]
|
||||
]
|
||||
|
||||
export const dataSource = [];
|
||||
|
|
@ -0,0 +1,99 @@
|
|||
import React from 'react'
|
||||
import { Button, Modal } from 'antd';
|
||||
import { WeaInput, WeaRangePicker, WeaTable} from 'ecCom'
|
||||
import { logColumns, dataSource } from "../../common/columns"
|
||||
|
||||
export default class LogViewModal extends React.Component {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
this.state ={
|
||||
value: ""
|
||||
}
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<Modal title="操作日志" visible={this.props.visible}
|
||||
onOk={() => alert("ok")} onCancel={this.props.onCancel}
|
||||
className="logViewModal"
|
||||
style={{ top: 150 }}
|
||||
width={'80%'} height={'50%'}
|
||||
>
|
||||
<div className="searchBar">
|
||||
<div className="searchBarItem searchDateRange">
|
||||
<div className="searchBarLabel">操作时间</div>
|
||||
<div>
|
||||
<WeaRangePicker
|
||||
value={["2019-02-03", "2019-03-08"]}
|
||||
onChange={v => this.setState({ value: v })}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="searchBarItem">
|
||||
<div className="searchBarLabel">操作人</div>
|
||||
<div>
|
||||
<WeaInput
|
||||
id="test"
|
||||
style={{ width: 200 }}
|
||||
value={this.state.value}
|
||||
onChange={value => {
|
||||
console.log(value);
|
||||
this.setState({ value });
|
||||
}}
|
||||
customBlur={v => {
|
||||
console.log("custom blur", v);
|
||||
}}
|
||||
onFocus={v => console.log("focus", v)}
|
||||
onBlur={v => console.log("blur", v)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="searchBarItem">
|
||||
<div className='searchBarLabel'>对象</div>
|
||||
<div>
|
||||
<WeaInput
|
||||
id="test"
|
||||
style={{ width: 200 }}
|
||||
value={this.state.value}
|
||||
onChange={value => {
|
||||
console.log(value);
|
||||
this.setState({ value });
|
||||
}}
|
||||
customBlur={v => {
|
||||
console.log("custom blur", v);
|
||||
}}
|
||||
onFocus={v => console.log("focus", v)}
|
||||
onBlur={v => console.log("blur", v)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="searchBarItem">
|
||||
<div className='searchBarLabel'>操作类型</div>
|
||||
<div>
|
||||
<WeaInput
|
||||
id="test"
|
||||
style={{ width: 200 }}
|
||||
value={this.state.value}
|
||||
onChange={value => {
|
||||
console.log(value);
|
||||
this.setState({ value });
|
||||
}}
|
||||
customBlur={v => {
|
||||
console.log("custom blur", v);
|
||||
}}
|
||||
onFocus={v => console.log("focus", v)}
|
||||
onBlur={v => console.log("blur", v)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="searchBarItem">
|
||||
<Button type="primary" className="searchBtn">搜索</Button>
|
||||
</div>
|
||||
</div>
|
||||
<WeaTable columns={logColumns} dataSource={dataSource} />
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
import React from 'react'
|
||||
import { Button, Modal } from 'antd';
|
||||
import { WeaInput, WeaRangePicker, WeaTable } from 'ecCom'
|
||||
import { logColumns, dataSource } from "../../common/columns"
|
||||
|
||||
export default class EditModal extends React.Component {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
this.state = {
|
||||
value: ""
|
||||
}
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<Modal title={this.props.title} visible={modelVisiable}
|
||||
onOk={() => alert("ok")} onCancel={this.props.onCancel}
|
||||
>
|
||||
<Row gutter={16}>
|
||||
<Col span={6}>
|
||||
<div className="formLabel">名称:</div>
|
||||
</Col>
|
||||
<Col span={18}>
|
||||
<WeaInput
|
||||
id="name"
|
||||
value={this.state.value}
|
||||
onChange={value => {
|
||||
console.log(value);
|
||||
this.setState({ value });
|
||||
}}
|
||||
customBlur={v => {
|
||||
console.log("custom blur", v);
|
||||
}}
|
||||
onFocus={v => console.log("focus", v)}
|
||||
onBlur={v => console.log("blur", v)}
|
||||
/>
|
||||
</Col>
|
||||
|
||||
|
||||
</Row>
|
||||
|
||||
<Row gutter={16} style={{ marginTop: "16px" }}>
|
||||
<Col span={6}>
|
||||
<div className="formLabel">备注:</div>
|
||||
</Col>
|
||||
<Col span={18}>
|
||||
<WeaTextarea value={this.state.value} onChange={(value) => { this.setState({ value }) }} />
|
||||
</Col>
|
||||
</Row>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -15,6 +15,7 @@ import "./index.less"
|
|||
import { columns, dataSource } from './columns';
|
||||
|
||||
import { logColumns } from '../../common/columns'
|
||||
import LogViewModal from '../../components/logViewModal';
|
||||
|
||||
const { MonthPicker } = DatePicker;
|
||||
|
||||
|
|
@ -132,125 +133,17 @@ export default class TaxAgent extends React.Component {
|
|||
</WeaTop>
|
||||
</WeaRightMenu>
|
||||
|
||||
<Modal title="新增个税扣缴义务人" visible={modelVisiable}
|
||||
onOk={() => alert("ok")} onCancel={() => setModelVisiable(false)}
|
||||
>
|
||||
<Row gutter={16}>
|
||||
<Col span={6}>
|
||||
<div className="formLabel">名称:</div>
|
||||
</Col>
|
||||
<Col span={18}>
|
||||
<WeaInput
|
||||
id="name"
|
||||
value={this.state.value}
|
||||
onChange={value => {
|
||||
console.log(value);
|
||||
this.setState({ value });
|
||||
}}
|
||||
customBlur={v => {
|
||||
console.log("custom blur", v);
|
||||
}}
|
||||
onFocus={v => console.log("focus", v)}
|
||||
onBlur={v => console.log("blur", v)}
|
||||
/>
|
||||
</Col>
|
||||
|
||||
<EditModal
|
||||
title={"新增个税扣缴义务人"}
|
||||
visible={this.state.modelVisiable}
|
||||
onCancel={this.setState({modelVisiable: false})}
|
||||
/>
|
||||
|
||||
|
||||
</Row>
|
||||
|
||||
<Row gutter={16} style={{marginTop: "16px"}}>
|
||||
<Col span={6}>
|
||||
<div className="formLabel">备注:</div>
|
||||
</Col>
|
||||
<Col span={18}>
|
||||
<WeaTextarea value={this.state.value} onChange={(value) => { this.setState({ value }) }} />
|
||||
</Col>
|
||||
</Row>
|
||||
</Modal>
|
||||
|
||||
|
||||
<Modal title="操作日志" visible={this.state.logViewVisiable}
|
||||
onOk={() => alert("ok")} onCancel={()=>{this.setState({logViewVisiable: false})}}
|
||||
className="logViewModal"
|
||||
style={{ top: 150 }}
|
||||
width={'80%'} height={'50%'}
|
||||
>
|
||||
<div className="searchBar">
|
||||
<div className="searchBarItem searchDateRange">
|
||||
<div className="searchBarLabel">操作时间</div>
|
||||
<div>
|
||||
<WeaRangePicker
|
||||
value={["2019-02-03", "2019-03-08"]}
|
||||
onChange={v => this.setState({ value: v })}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="searchBarItem">
|
||||
<div className="searchBarLabel">操作人</div>
|
||||
<div>
|
||||
<WeaInput
|
||||
id="test"
|
||||
style={{ width: 200 }}
|
||||
value={this.state.value}
|
||||
onChange={value => {
|
||||
console.log(value);
|
||||
this.setState({ value });
|
||||
}}
|
||||
customBlur={v => {
|
||||
console.log("custom blur", v);
|
||||
}}
|
||||
onFocus={v => console.log("focus", v)}
|
||||
onBlur={v => console.log("blur", v)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="searchBarItem">
|
||||
<div className='searchBarLabel'>对象</div>
|
||||
<div>
|
||||
<WeaInput
|
||||
id="test"
|
||||
style={{ width: 200 }}
|
||||
value={this.state.value}
|
||||
onChange={value => {
|
||||
console.log(value);
|
||||
this.setState({ value });
|
||||
}}
|
||||
customBlur={v => {
|
||||
console.log("custom blur", v);
|
||||
}}
|
||||
onFocus={v => console.log("focus", v)}
|
||||
onBlur={v => console.log("blur", v)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="searchBarItem">
|
||||
<div className='searchBarLabel'>操作类型</div>
|
||||
<div>
|
||||
<WeaInput
|
||||
id="test"
|
||||
style={{ width: 200 }}
|
||||
value={this.state.value}
|
||||
onChange={value => {
|
||||
console.log(value);
|
||||
this.setState({ value });
|
||||
}}
|
||||
customBlur={v => {
|
||||
console.log("custom blur", v);
|
||||
}}
|
||||
onFocus={v => console.log("focus", v)}
|
||||
onBlur={v => console.log("blur", v)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="searchBarItem">
|
||||
<Button type="primary" className="searchBtn">搜索</Button>
|
||||
</div>
|
||||
</div>
|
||||
<WeaTable columns={logColumns} dataSource={dataSource} />
|
||||
</Modal>
|
||||
<LogViewModal
|
||||
visible={this.state.logViewVisiable}
|
||||
onCancel={() => {this.setState({logViewVisiable: false})}}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue