系统薪资项目

pc4mobx/hrmSalary/pages/salaryItem/columns.js

@@ -51,6 +51,38 @@ export const columns = [
     }
 ]
 
+export const systemItemColumns = [
+    {
+        title: "薪资项目",
+        dataIndex: 'title',
+        key: 'title'
+    },
+    {
+        title: "属性",
+        dataIndex: 'title',
+        key: 'title'
+    },
+    {
+        title: "类型",
+        dataIndex: 'title',
+        key: 'title'
+    },
+    {
+        title: "舍入规则",
+        dataIndex: 'title',
+        key: 'title'
+    },
+    {
+        title: "保留小数位",
+        dataIndex: 'title',
+        key: 'title'
+    },
+    {
+        title: "取值方式",
+        dataIndex: 'title',
+        key: 'title'
+    }
+]
 
 export const dataSource = [
     {

pc4mobx/hrmSalary/pages/salaryItem/index.js

@@ -9,7 +9,7 @@ import { WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaTable, WeaInputSearch
 import { renderNoright, getSearchs } from '../../util'; // 渲染form数据的方法：因为多个页面都会使用，所以抽的公共方法在util中
 import CustomTab from '../../components/customTab';
 import ContentWrapper from '../../components/contentWrapper';
-
+import SystemSalaryItemModal from './systemSalaryItemModal'
 import { columns, dataSource } from './columns';
 
 const { MonthPicker } = DatePicker;
@@ -21,7 +21,8 @@ export default class SalaryItem extends React.Component {
     super(props);
     this.state = {
       value: "",
-      selectedKey: "0"
+      selectedKey: "0",
+      systemItemVisible: false
     }
     columns.map(item => {
       if(item.dataIndex == "refere") {
@@ -73,9 +74,15 @@ export default class SalaryItem extends React.Component {
 
     const topTab = [
     ];
+    
+    const handleMenuClick = (e) => {
+      if(e.key == "1") {
+        this.setState({systemItemVisible: true})
+      }
+    }
 
     const menu = (
-      <Menu>
+      <Menu onClick={handleMenuClick}>
         <Menu.Item key="1">系统薪资项</Menu.Item>
         <Menu.Item key="2">自定义薪资项</Menu.Item>
       </Menu>
@@ -103,7 +110,7 @@ export default class SalaryItem extends React.Component {
             dropMenuDatas={rightMenu} // 下拉菜单（和页面的右键菜单相同）
             dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
           >
-            <CustomTab 
+            <CustomTab
                 searchOperationItem={
                   renderRightOperation()
                 }
@@ -111,6 +118,8 @@ export default class SalaryItem extends React.Component {
             <WeaTable columns={columns} dataSource={dataSource}/>
           </WeaTop>
         </WeaRightMenu>
+
+        <SystemSalaryItemModal visible={this.state.systemItemVisible} onCancel={() => {this.setState({systemItemVisible: false})}}/>
       </div>
     )
   }

pc4mobx/hrmSalary/pages/salaryItem/systemSalaryItemModal.js

@@ -0,0 +1,23 @@
+import React from 'react'
+import { systemItemColumns, dataSource } from './columns'
+import { WeaInputSearch } from 'ecCom'
+import { Modal, Button, Table } from 'antd'
+
+export default class SystemSalaryItemModal extends React.Component {
+    render() {
+        return (
+            <Modal visible={this.props.visible} onCancel={() => {this.props.onCancel()}} width={800}>
+                <div style={{height: "47px", lineHeight: '47px'}}>
+                    <span style={{marginLeft: "10px", fontSize: '14px'}}>添加系统薪资项目</span>
+                    <div style={{float: "right", marginRight: "40px"}}>
+                        <Button type="primary" style={{marginRight: '10px'}}>添加</Button>
+                        <WeaInputSearch />
+                    </div>
+                </div>
+                <div style={{margin: "10px"}}>
+                    <Table dataSource={dataSource} columns={systemItemColumns}/>
+                </div>
+            </Modal>
+        )
+    }
+}