ttk-app-core
Version:
enterprise develop framework
170 lines (164 loc) • 6.05 kB
JavaScript
import React from 'react'
import { Form, Radio, Button ,Input} from 'edf-component'
import moment from 'moment'
const FormItem = Form.Item
const RadioGroup = Radio.Group
import { message } from 'antd';
import utils from 'edf-utils'
class InventoryCostingComponent extends React.Component{
constructor(props){
super(props)
this.state = {
carryForwardMode: props.initData.carryForwardMode,
period:props.period,
amount:props.initData.amount?props.initData.amount:0,
proportion:props.initData.proportion?props.initData.proportion:0,
isAccountedMonth: props.isAccountedMonth
}
}
componentWillMount = () => {
// let res = this.props.interfacePath.getAmountAndProportion(this.props.period)
// console.log(res)
// this.setState({
// carryForwardMode: res.carryForwardMode
// })
}
confirm = () => {
if(this.state.proportion==''&&this.state.carryForwardMode==5000090001){
message.warning('比例不能为空')
return
}
this.props.closeModal()
this.props.callBack(this)
}
cancel = () => {
this.props.closeModal()
}
radioChange = async (value) => {
let res = await this.props.interfacePath.getAmountAndProportion({
carryForwardMode: value,
year:this.props.period.year,
month:this.props.period.month,
})
this.setState({
carryForwardMode: res.carryForwardMode,
amount:res.amount?res.amount:0,
proportion:res.proportion?res.proportion:''
})
console.log(res)
}
handleChange =()=>{}
handleBlur=(value)=>{
this.setState({
proportion: value
})
}
getContent = () => {
let carryForwardMode = this.state.carryForwardMode
if(carryForwardMode == '5000090001'){
return (
<div className="inventoryCosting-content">
<div className="tips">
结转成本金额 = 本期收入科目结转前发生额 * 结转比例
</div>
<div className="content">
<div className="contentLeft">本期销售收入发生额：<span>{utils.number.format(this.state.amount,2)}</span></div>
<div className="contentRight">
<span>结转比例：</span>
<EditableCell value={this.state.proportion} onBlur={(value) =>this.handleBlur(value)}/>
</div>
</div>
</div>
)
}else if(carryForwardMode == '5000090002'){
return (
<div className="inventoryCosting-content">
<div className="tips">
收入科目及库存商品科目需要启用数量核算，根据加权平均法结转成本
</div>
</div>
)
}else if(carryForwardMode == '5000090003'){
return (
<div className="inventoryCosting-content">
<div className="tips">
结转成本金额 = 库存商品结转前的科目余额
</div>
<div className="content">
<div className="contentLeft">本期库存商品结余：<span>{utils.number.format(this.state.amount,2)}</span></div>
</div>
</div>
)
}
}
render(){
const { carryForwardMode,isAccountedMonth } = this.state
console.log(isAccountedMonth)
return (
<div className="inventoryCosting">
<div style={{fontSize:'12px',color:' #FA954C'}}>注：结转方式一经确认，不可修改</div>
<FormItem label="结转方式：">
<RadioGroup value={carryForwardMode} disabled={isAccountedMonth} onChange={(e) => this.radioChange(e.target.value)}>
<Radio value={5000090001}>按比例结转</Radio>
<Radio value={5000090002}>全月加权平均</Radio>
<Radio value={5000090003}>全额结转</Radio>
</RadioGroup>
</FormItem>
{this.getContent()}
<div className="btnContainer">
<Button onClick={this.cancel} style={{fontSize: '12px',padding:'0px 15px'}}>取消</Button>
<Button style={{marginLeft: '8px',fontSize: '12px',padding:'0px 15px'}} type='primary' onClick={this.confirm}>保存</Button>
</div>
</div>
)
}
}
class EditableCell extends React.Component{
constructor(props) {
super(props)
this.state = {
value: props.value
}
}
handleChange = (value) => {
if( value > 100 ){
value = 100
}
this.setState({
value: value
})
}
handleBlur = (e) => {
const { onBlur} = this.props
const { value } = this.state
onBlur(value ? value : 0)
}
componentWillReceiveProps(nextProps) {
this.setState({
value: nextProps.value
})
}
render () {
const { onBlur, onEnter ,customAttribute, disabled} = this.props
const value = this.state.value
return (
<div className="td_input_antNumber">
<Input.AntNumber
onChange= {this.handleChange}
value={value}
onBlur={this.handleBlur}
onPressEnter={(e) => onEnter(e)}
style={{'textAlign':'right',fontSize:'12px'}}
disabled={disabled}
customAttribute = {customAttribute}
// regex='^([0-9]+)(?:\.[0-9]{1,2})?$'
min={0}
max={100}
formatter={value => `${value}${value==''?'':'%'}`}
parser={value => value.replace('%', '')}
/>
</div>
)
}
}
export default InventoryCostingComponent