From 1e13b98152e8393e76e04ab5ef081b99d9e03311 Mon Sep 17 00:00:00 2001
From: MustangDeng <670124965@qq.com>
Date: Mon, 21 Mar 2022 14:01:15 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AF=B9=E6=8E=A5=E6=8E=A5=E5=8F=A3=E9=92=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../pages/salaryItem/customSalaryItemSlide.js | 103 ++++++++++++++++++
 pc4mobx/hrmSalary/pages/salaryItem/index.js   |  41 ++++++-
 2 files changed, 143 insertions(+), 1 deletion(-)
 create mode 100644 pc4mobx/hrmSalary/pages/salaryItem/customSalaryItemSlide.js

diff --git a/pc4mobx/hrmSalary/pages/salaryItem/customSalaryItemSlide.js b/pc4mobx/hrmSalary/pages/salaryItem/customSalaryItemSlide.js
new file mode 100644
index 00000000..cda814d1
--- /dev/null
+++ b/pc4mobx/hrmSalary/pages/salaryItem/customSalaryItemSlide.js
@@ -0,0 +1,103 @@
+import React from 'react'
+
+export default class CustomSalaryItemSlide extends React.Component {
+    render() {
+        return (
+            <div>
+                <div>
+                    <Row>
+                        <Col span={4}>名称</Col>
+                        <Col span={20}>
+                            <WeaInput />
+                        </Col>
+                    </Row>
+                    <Row>
+                        <Col span={4}>默认使用</Col>
+                        <Col span={20}>
+                            <Switch />
+                            <WeaHelpfulTip
+                                style={{marginLeft: "10px"}}
+                                width={200}
+                                title="提示：开启后，每个薪资方案都有该薪资项目，可在具体薪资方案中删除"
+                                placement="topLeft"
+                            />
+                        </Col>
+                    </Row>
+
+                    
+                    <Row>
+                        <Col span={4}>薪资档案引用</Col>
+                        <Col span={20}>
+                            <Switch />
+                            <WeaHelpfulTip
+                                style={{marginLeft: "10px"}}
+                                width={200}
+                                title="提示：开启后，该薪资项目不可删除或者设为无效"
+                                placement="topLeft"
+                            />
+                        </Col>
+                    </Row>
+
+                    <Row>
+                        <Col span={12}>
+                            <Row>
+                                <Col span={8}>属性</Col>
+                                <Col span={16}>
+
+                                    <WeaSelect style={{width: "200px"}}/>
+                                </Col>
+                            </Row>
+                        </Col>
+                        <Col span={12}>
+                        <Row>
+                                <Col span={8}>类型</Col>
+                                <Col span={16}>
+                                    <WeaSelect style={{width: "200px"}}/>
+                                </Col>
+                            </Row>
+                        </Col>
+                    </Row>
+                    <Row>
+                        <Col span={12}>
+                            <Row>
+                                <Col span={8}>舍入规则</Col>
+                                <Col span={16}>
+
+                                    <WeaSelect style={{width: "200px"}}/>
+                                </Col>
+                            </Row>
+                        </Col>
+                        <Col span={12}>
+                        <Row>
+                                <Col span={8}>保留小数位</Col>
+                                <Col span={16}>
+                                    <WeaSelect style={{width: "200px"}}/>
+                                </Col>
+                            </Row>
+                        </Col>
+                    </Row>
+
+
+                    <Row>
+                        <Col span={4}>取值方式</Col>
+                        <Col span={20}>
+                            <Radio.Group>
+                                <Radio value={1}>薪资项目前</Radio>
+                                <Radio value={2}>薪资项目后</Radio>
+                            </Radio.Group>
+                        </Col>
+                    </Row>
+
+
+                    <Row>
+                        <Col span={4}>备注</Col>
+                        <Col span={20}>
+                            <WeaTextarea />
+                        </Col>
+                    </Row>
+
+                </div>
+            </div>
+        )
+    }
+}
\ No newline at end of file
diff --git a/pc4mobx/hrmSalary/pages/salaryItem/index.js b/pc4mobx/hrmSalary/pages/salaryItem/index.js
index 4804d4dd..5a78ddf2 100644
--- a/pc4mobx/hrmSalary/pages/salaryItem/index.js
+++ b/pc4mobx/hrmSalary/pages/salaryItem/index.js
@@ -11,6 +11,7 @@ import CustomTab from '../../components/customTab';
 import ContentWrapper from '../../components/contentWrapper';
 import SystemSalaryItemModal from './systemSalaryItemModal'
 import { columns, dataSource } from './columns';
+import SlideModalTitle from "../../components/slideModalTitle"
 
 const { MonthPicker } = DatePicker;
 
@@ -22,7 +23,8 @@ export default class SalaryItem extends React.Component {
     this.state = {
       value: "",
       selectedKey: "0",
-      systemItemVisible: false
+      systemItemVisible: false,
+      editSlideVisible: false
     }
     columns.map(item => {
       if(item.dataIndex == "refere") {
@@ -78,6 +80,8 @@ export default class SalaryItem extends React.Component {
     const handleMenuClick = (e) => {
       if(e.key == "1") {
         this.setState({systemItemVisible: true})
+      } else if(e.key == "2") {
+        this.setState({editSlideVisible: true})
       }
     }
 
@@ -96,6 +100,15 @@ export default class SalaryItem extends React.Component {
      
     }
 
+    const renderCustomOperate = () => {
+      return (
+        <div>
+          <Button type="primary" style={{marginRight: "10px"}}>保存</Button>
+          <Button type="default">保存并继续创建</Button>
+        </div>
+      )
+    }
+
     return (
       <div className="mySalaryBenefitsWrapper">
         <WeaRightMenu
@@ -120,6 +133,32 @@ export default class SalaryItem extends React.Component {
         </WeaRightMenu>
 
         <SystemSalaryItemModal visible={this.state.systemItemVisible} onCancel={() => {this.setState({systemItemVisible: false})}}/>
+
+        {
+              this.state.editSlideVisible && 
+              <WeaSlideModal visible={this.state.editSlideVisible}
+                top={0}
+                width={40}
+                height={100}
+                direction={'right'}
+                measure={'%'}
+                
+                title={
+                  <SlideModalTitle 
+                    subtitle={"新建自定义薪资项目"}
+                    editable={true}
+                    customOperate={renderCustomOperate()}
+                    subItemChange={
+                      (item) => {this.setState({selectedTab: item.key})}
+                    }
+                  />
+                }
+                content={<CustomSalaryItemSlide />}
+                onClose={() => this.setState({editSlideVisible: false})}
+                showMask={true}
+                closeMaskOnClick={() => this.setState({editSlideVisible: false})} />
+   
+            }
       </div>
     )
   }