归档详情
This commit is contained in:
MustangDeng
parent
75dc9b4694
commit
621d58a6d6
|
|
@ -193,8 +193,8 @@ export const warningModalColumns = [
|
|||
export const placeOnFileColumns = [
|
||||
{
|
||||
title: "姓名",
|
||||
dataIndex: 'title',
|
||||
key: 'title'
|
||||
dataIndex: 'username',
|
||||
key: 'username'
|
||||
},
|
||||
{
|
||||
title: "个税扣缴义务人",
|
||||
|
|
@ -243,8 +243,41 @@ export const placeOnFileColumns = [
|
|||
}
|
||||
]
|
||||
|
||||
export const mergeDetailColumns = [
|
||||
{
|
||||
title: "核算次序",
|
||||
dataIndex: 'title',
|
||||
key: 'title'
|
||||
},
|
||||
{
|
||||
title: "薪资项目1",
|
||||
dataIndex: 'title',
|
||||
key: 'title'
|
||||
},
|
||||
{
|
||||
title: "薪资项目2",
|
||||
dataIndex: 'title',
|
||||
key: 'title'
|
||||
},
|
||||
|
||||
{
|
||||
title: "薪资项目3",
|
||||
dataIndex: 'title',
|
||||
key: 'title'
|
||||
},
|
||||
|
||||
{
|
||||
title: "薪资项目4",
|
||||
dataIndex: 'title',
|
||||
key: 'title'
|
||||
},
|
||||
]
|
||||
|
||||
export const dataSource = [
|
||||
{title: "测试"}
|
||||
{
|
||||
title: "测试",
|
||||
username: "测试"
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,12 @@
|
|||
import React from 'react'
|
||||
|
||||
|
||||
export default class CompareDetail extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,105 @@
|
|||
import React from 'react';
|
||||
import { mergeDetailColumns, dataSource} from './columns'
|
||||
import { Row, Col, Table } from 'antd'
|
||||
import { WeaHelpfulTip } from "ecCom"
|
||||
|
||||
export default class FileMergeDetail extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="fileMergeDetail">
|
||||
<div className="detialItemWrapper">
|
||||
<div className="titleWrapper">
|
||||
<span className="itemTitle">基本信息</span>
|
||||
<div className="rightItemWrapper">
|
||||
<span>薪资所属月：2021-11</span>
|
||||
<WeaHelpfulTip
|
||||
style={{marginLeft: "10px"}}
|
||||
width={200}
|
||||
title="薪资周期\n
|
||||
2021-11-01至2021-11-30\n
|
||||
税款所属期\n
|
||||
2021-12\n
|
||||
考勤取值周期\n
|
||||
2021-11-01至2021-11-30\n
|
||||
福利台账月份\n
|
||||
引用2021-11的福利台账数据"
|
||||
placement="topLeft"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="itemContent">
|
||||
<Row classsName="itemRow">
|
||||
<Col span={8}>
|
||||
<Row>
|
||||
<Col span={12}>姓名</Col>
|
||||
<Col span={12}>张三</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
|
||||
<Col span={8}>
|
||||
<Row>
|
||||
<Col span={12}>部门</Col>
|
||||
<Col span={12}>研发</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
|
||||
|
||||
<Col span={8}>
|
||||
<Row>
|
||||
<Col span={12}>岗位</Col>
|
||||
<Col span={12}>开发</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Row className="itemRow">
|
||||
<Col span={8}>
|
||||
<Row>
|
||||
<Col span={12}>入职日期</Col>
|
||||
<Col span={12}>2020-10-20</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
|
||||
<Col span={8}>
|
||||
<Row>
|
||||
<Col span={12}>手机号</Col>
|
||||
<Col span={12}>18888888888</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
|
||||
|
||||
<Col span={8}>
|
||||
<Row>
|
||||
<Col span={12}>个税扣缴义务人</Col>
|
||||
<Col span={12}>义务人一</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
</div>
|
||||
<div className="detialItemWrapper">
|
||||
<div className="titleWrapper">
|
||||
<span className="itemTitle">合并计税详情</span>
|
||||
<WeaHelpfulTip
|
||||
style={{marginLeft: "10px"}}
|
||||
width={200}
|
||||
title="薪资周期\n
|
||||
2021-11-01至2021-11-30\n
|
||||
税款所属期\n
|
||||
2021-12\n
|
||||
考勤取值周期\n
|
||||
2021-11-01至2021-11-30\n
|
||||
福利台账月份\n
|
||||
引用2021-11的福利台账数据"
|
||||
placement="topLeft"
|
||||
/>
|
||||
</div>
|
||||
<div className="tableWrapper">
|
||||
<Table dataSource={dataSource} columns={mergeDetailColumns}/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -76,4 +76,45 @@
|
|||
.itemRow {
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.placeOnFileDetail {
|
||||
padding: 20px;
|
||||
.tabWrapper {
|
||||
height: 47px;
|
||||
line-height: 47px;
|
||||
}
|
||||
.tableWrapper {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.fileMergeDetail {
|
||||
padding: 20px;
|
||||
.detialItemWrapper {
|
||||
.titleWrapper {
|
||||
height: 47px;
|
||||
line-height: 47px;
|
||||
.itemTitle {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.rightItemWrapper {
|
||||
display: inline-block;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.itemContent {
|
||||
margin-top: 10px;
|
||||
.itemRow {
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.tableWrapper {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -1,11 +1,32 @@
|
|||
import React from 'react'
|
||||
import CustomTab from '../../components/customTab'
|
||||
import { Dropdown, Menu, Button, Table } from 'antd'
|
||||
import { WeaHelpfulTip, WeaInputSearch } from 'ecCom'
|
||||
import { WeaHelpfulTip, WeaInputSearch, WeaSlideModal } from 'ecCom'
|
||||
|
||||
import { placeOnFileColumns, dataSource } from './columns'
|
||||
import SlideModalTitle from "../../components/slideModalTitle"
|
||||
import FileMergeDetail from './fileMergeDetail'
|
||||
|
||||
export default class PlaceOnFileDetail extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
placeOnFileColumns.map(item => {
|
||||
if(item.dataIndex == "username") {
|
||||
item.render = (text, record) => (
|
||||
<a onClick={() => {this.onDetail()}}>{text}</a>
|
||||
)
|
||||
}
|
||||
})
|
||||
this.state = {
|
||||
slideVisiable: false,
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
onDetail() {
|
||||
this.setState({slideVisiable: true})
|
||||
}
|
||||
|
||||
render() {
|
||||
const menu = (
|
||||
<Menu>
|
||||
|
|
@ -22,16 +43,18 @@ export default class PlaceOnFileDetail extends React.Component {
|
|||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const { slideVisiable } = this.state
|
||||
|
||||
return (
|
||||
|
||||
<div>
|
||||
<div className="placeOnFileDetail">
|
||||
<CustomTab
|
||||
searchOperationItem={
|
||||
renderRightOperation()
|
||||
}
|
||||
/>
|
||||
<div>
|
||||
<div className="tabWrapper">
|
||||
<span>薪资所属月：2021-11</span>
|
||||
<WeaHelpfulTip
|
||||
style={{marginLeft: "10px"}}
|
||||
|
|
@ -47,9 +70,28 @@ export default class PlaceOnFileDetail extends React.Component {
|
|||
placement="topLeft"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<div className="tableWrapper">
|
||||
<Table columns={placeOnFileColumns} dataSource={dataSource} />
|
||||
</div>
|
||||
|
||||
{
|
||||
slideVisiable && <WeaSlideModal visible={slideVisiable}
|
||||
top={0}
|
||||
width={40}
|
||||
height={100}
|
||||
direction={'right'}
|
||||
measure={'%'}
|
||||
title={
|
||||
<SlideModalTitle
|
||||
subtitle={"合并计税详情"}
|
||||
editable={true}
|
||||
/>
|
||||
}
|
||||
content={(<FileMergeDetail />)}
|
||||
onClose={() => this.setState({slideVisiable: false})}
|
||||
showMask={true}
|
||||
closeMaskOnClick={() => this.setState({slideVisiable: false})} />
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue