@ttk/component
Version:
ttk组件库
690 lines (663 loc) • 40 kB
JavaScript
import React, { PureComponent } from 'react'
import moment from 'moment'
import { Icon } from '@ttk/component'
import { Popover } from 'antd'
import { Radio, Select, Checkbox, Button, InputNumber, Input, DatePicker, Tooltip } from 'antd'
const Option = Select.Option;
const RadioGroup = Radio.Group;
const maxLineNum = [5, 6, 7, 8, 9, 10]
const maxLineNumA4 = [18, 19, 20, 21, 22, 23, 24]
import './style.less'
let selectNameOption = []
const selectName = [
{ name: 'A4（297*210）一版', id: '3' },
{ name: 'A4（297*210）二版', id: '0' },
{ name: 'A4（297*210）三版', id: '1' },
{ name: 'A4（210*120）', id: '7' },
{ name: 'A5（210*148）', id: '4' },
{ name: '套打增票凭证纸KPJ103', id: '11' },
{ name: '套打金蝶凭证纸KP-J103', id: '12' },
{ name: '针打金额记账凭证KPL103', id: '13' },
{ name: '自定义大小', id: '2' }]
// const selectName=['A4（297*210）一版','A4（297*210）二版','A4（297*210）三版', 'A4（210*120）','A5（210*148）','套打增票凭证纸KPJ103 (241*139.7mm/240*140mm)','套打金蝶凭证纸KPJ105（240*120mm）','自定义大小']
const maxLineNumA5 = [5, 6, 7, 8, 9, 10]
const maxLineNumCus = [5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24]
class PrintOptionComponent extends PureComponent {
constructor(props) {
super(props)
const { printAuxAccCalc, printQuantity, printMulti, type, maxLineNum, maxLineNumA4, contentFontSize, width, height, leftPadding, rightPadding, topPadding, bottomPadding, from, customPrintTime, printTime, maxLineNumA5, maxLineNumCus, merge, grade, landscape,summaryWithQuantity } = props
this.state = {
printAuxAccCalc: printAuxAccCalc,
printQuantity: printQuantity,
printTime: props.printTime ? props.printTime : '',
printMulti: printMulti,
value: type ? type.toString() : '0',
pageSize: maxLineNum ? parseInt(maxLineNum) : 6,
pageSizeA4: maxLineNumA4 ? parseInt(maxLineNumA4) : 6,
maxLineNumA5: maxLineNumA5 ? parseInt(maxLineNumA5) : 6,
maxLineNumCus: maxLineNumCus ? parseInt(maxLineNumCus) : 6,
width: width ? parseFloat(width) : 21.5,
height: height ? parseFloat(height) : 12.5,
leftPadding: leftPadding,
rightPadding: rightPadding,
topPadding: topPadding,
bottomPadding: bottomPadding,
contentFontSize: contentFontSize,
heightConst: [10, 10.5, 11, 11.5, 12, 12.5, 13],
widthConst: from == 'proofList' ? [19, 19.5, 20, 20.5, 21, 21.5, 22, 24] : [19, 19.5, 20, 20.5, 21, 21.5, 22],
creator: props.creator ? props.creator : '',//自定义制表人
auditor: props.auditor ? props.auditor : '',//自定义财务负责人
supervisor: props.supervisor ? props.supervisor : '', //自定义主管
creatorButton: props.creatorType == -1 ? false : true,
auditorButton: props.auditorType == -1 ? false : true,
supervisorButton: props.supervisorType == -1 ? false : true,
supervisorType: props.supervisorType || props.supervisorType == 0 ? props.supervisorType : '', //自定义主管（-1：不勾选，-2：原主管，-3：隐藏主管这一行，0：自定义，1：当前操作人）
creatorType: props.creatorType || props.creatorType == 0 ? props.creatorType : '', //制表人勾选项枚举类型(-1:没有勾选，0:自定义，1:制表人)
auditorType: props.auditorType || props.auditorType == 0 ? props.auditorType : '', //财务负责人勾选项枚举类型(-1:没有勾选，0:自定义，1:制表人)
enableddate: props.enableddate ? props.enableddate : '',
customPrintTime: props.customPrintTime && props.customPrintTime != ' ' ? moment(props.customPrintTime, 'YYYY-MM-DD HH:mm:ss') : '',//自定义时间
timeOriginal: props.customPrintTime ? 1 : 0,
creatorFlag: false,
editorFlag: false,
includePageNumber: props.includePageNumber,
merge: merge,
summaryWithQuantity:summaryWithQuantity,
grade: grade ? grade : 0,
landscape: landscape,
selectNameOptionFalg: false,
selectNameOption: ''
}
}
componentWillReceiveProps(nextProps) {
const { isAllPrint, printAuxAccCalc, printQuantity, printMulti, type, contentFontSize, maxLineNum, maxLineNumA4, width, height, leftPadding, rightPadding, topPadding, bottomPadding, maxLineNumA5, maxLineNumCus, merge, grade,summaryWithQuantity } = nextProps
if (!isAllPrint) {
this.setState({
printAuxAccCalc: printAuxAccCalc,
printQuantity: printQuantity,
printMulti: printMulti,
value: type ? type : '0',
contentFontSize: contentFontSize,
pageSize: maxLineNum ? parseInt(maxLineNum) : 6,
pageSizeA4: maxLineNumA4 ? parseInt(maxLineNumA4) : 6,
maxLineNumA5: maxLineNumA5 ? parseInt(maxLineNumA5) : 6,
maxLineNumCus: maxLineNumCus ? parseInt(maxLineNumCus) : 6,
width: width ? parseFloat(width) : 215,
height: height ? parseFloat(height) : 125,
leftPadding: leftPadding,
rightPadding: rightPadding,
topPadding: topPadding,
bottomPadding: bottomPadding,
merge: merge,
summaryWithQuantity:summaryWithQuantity,
grade: grade ? grade : 0,
})
}
}
changeRadioState = (e) => {
this.setState({
value: e.target.value,
})
}
changeAccount = (e, nameStr) => {
if (nameStr == 'creatorButton' && e.target.checked == true) {
this.setState({
creatorType: this.state.creatorType !== -1 ? this.state.creatorType : -2,
})
}
if (nameStr == 'auditorButton' && e.target.checked == true) {
this.setState({
auditorType: this.state.auditorType !== -1 ? this.state.auditorType : -2,
})
}
if (nameStr == 'supervisorButton' && e.target.checked == true) {
this.setState({
supervisorType: this.state.supervisorType !== -1 ? this.state.supervisorType : -2,
})
}
this.setState({
[nameStr]: e.target.checked,
})
}
changeState = (e, nameStr) => {
this.setState({
[nameStr]: e
})
if (nameStr == 'creatorType') {
if (e != 0) {
this.setState({
creator: '',
creatorFlag: false
})
} else {
setTimeout(() => {
let editorDOM = document.getElementsByClassName('creatorTypeInput')[0]
editorDOM.focus();
}, 10);
}
}
if (nameStr == 'auditorType') {
if (e != 0) {
this.setState({
auditor: '',
editorFlag: false
})
} else {
setTimeout(() => {
let editorDOM = document.getElementsByClassName('editorTypeInput')[0]
editorDOM.focus();
}, 10);
}
}
if (nameStr == 'timeOriginal') {
if (e == 0) {
this.setState({
customPrintTime: '',
})
} else {
if (this.props.source != '1') {
setTimeout(() => {
let editorDOM = document.getElementsByClassName('datePicker')[0]
editorDOM.click();
let _input = editorDOM.querySelector('input');
_input && _input.click()
}, 10);
}
}
}
}
changeCustom = (e, nameStr) => {
if (nameStr == 'creator' && !!e) {
this.setState({
creatorFlag: false
})
}
if (nameStr == 'auditor' && !!e) {
this.setState({
editorFlag: false
})
}
this.setState({
[nameStr]: e.target.value,
})
}
changeQuantity = (e) => {
this.setState({
printQuantity: e.target.checked,
})
}
changeMultiCurrency = (e) => {
this.setState({
printMulti: e.target.checked,
})
}
changePageSize = (e) => {
this.setState({
pageSize: e
})
}
changePageSizeA4 = (e) => {
this.setState({
pageSizeA4: e
})
}
changePageSizeA5 = (e) => {
this.setState({
maxLineNumA5: e
})
}
changeMaxLineNumCus = (e) => {
this.setState({
selectNameOption: e
})
}
changeWidth = (e) => {
this.setState({
width: e
})
}
changeHeight = (e) => {
this.setState({
height: e
})
}
grade = (e) => {
this.setState({
grade: e
})
}
merge = (e) => {
if (e.target.checked) {
this.setState({
merge: e.target.checked
})
} else {
this.setState({
merge: e.target.checked,
grade: 0
})
}
}
summaryWithQuantity = (e) => {
this.setState({
summaryWithQuantity: e.target.checked
})
}
confirm = () => {
var creatorFlag, editorFlag, supervisorFlag
if (this.state.creatorType == '0' && !this.state.creator) {
creatorFlag = true
this.setState({
creatorFlag: true
})
}
if (this.state.auditorType == '0' && !this.state.auditor) {
editorFlag = true
this.setState({
editorFlag: true
})
}
if (this.state.supervisorType == '0' && !this.state.supervisor) {
supervisorFlag = true
this.setState({
supervisorFlag: true
})
}
if (!editorFlag && !creatorFlag && !supervisorFlag) {
if (!this.props.source) {
this.props.closeModal()
}
if (this.state.creatorButton == false) {
this.state.creatorType = -1
}
if (this.state.auditorButton == false) {
this.state.auditorType = -1
}
if (this.state.supervisorButton == false) {
this.state.supervisorType = -1
}
if (this.state.value == '7') {
this.state.width = 210
this.state.height = 120
}
this.state.type = this.state.value
// this.state.maxLineNum = this.state.pageSize
// this.state.maxLineNumA4 = this.state.pageSizeA4
this.state.contentFontSize = this.state.contentFontSize
if (this.state.value == '11') {
this.state.maxLineNum = 6
}
if (this.state.value == '12') {
this.state.maxLineNum = 5
}
switch (this.state.value) {
case "3":
this.state.maxLineNumA4 = this.state.selectNameOption
break
case "0":
this.state.maxLineNum = this.state.selectNameOption
break
case "4":
this.state.maxLineNumA5 = this.state.selectNameOption
break
case "2":
this.state.maxLineNumCus = this.state.selectNameOption
break
}
this.state.customPrintTime = this.state.timeOriginal == 1 ? this.state.customPrintTime ? moment(this.state.customPrintTime).format('YYYY-MM-DD HH:mm:ss') : ' ' : ''
this.props.callBack(this.state)
}
}
cancel = () => {
this.props.closeModal()
}
dateChange = (key, value) => {
this.setState({
[key]: value
})
}
disabledDate = (time, type) => {
const enableddate = this.state.enableddate
let currentMonth = this.transformDateToNum(time)
let enableddateMonth = this.transformDateToNum(enableddate)
return currentMonth < enableddateMonth
}
transformDateToNum = (date) => {
try {
if (!date) {
return 0
}
let time = date
if (typeof date == 'string') {
time = utils.date.transformMomentDate(date)
}
return parseInt(`${time.year()}${time.month() < 10 ? `0${time.month()}` : `${time.month()}`}`)
} catch (err) {
return 0
}
}
confirmBatch = () => {
var creatorFlag, editorFlag, supervisorFlag
if (this.state.creatorType == '0' && !this.state.creator) {
creatorFlag = true
this.setState({
creatorFlag: true
})
}
if (this.state.auditorType == '0' && !this.state.auditor) {
editorFlag = true
this.setState({
editorFlag: true
})
}
if (this.state.supervisorType == '0' && !this.state.supervisor) {
supervisorFlag = true
this.setState({
supervisorFlag: true
})
}
if (!editorFlag && !creatorFlag && !supervisorFlag) {
if (this.state.creatorButton == false) {
this.state.creatorType = -1
}
if (this.state.auditorButton == false) {
this.state.auditorType = -1
}
if (this.state.supervisorButton == false) {
this.state.supervisorType = -1
}
if (this.state.value == '7') {
this.state.width = 210
this.state.height = 120
}
this.state.type = this.state.value
// this.state.maxLineNum = this.state.pageSize
// this.state.maxLineNumA4 = this.state.pageSizeA4
this.state.contentFontSize = this.state.contentFontSize
if (this.state.value == '11') {
this.state.maxLineNum = 6
}
if (this.state.value == '12') {
this.state.maxLineNum = 5
}
switch (this.state.value) {
case "3":
this.state.maxLineNumA4 = this.state.selectNameOption
break
case "0":
this.state.maxLineNum = this.state.selectNameOption
break
case "4":
this.state.maxLineNumA5 = this.state.selectNameOption
break
case "2":
this.state.maxLineNumCus = this.state.selectNameOption
break
}
this.state.customPrintTime = this.state.timeOriginal == 1 ? this.state.customPrintTime ? moment(this.state.customPrintTime).format('YYYY-MM-DD HH:mm:ss') : ' ' : ''
return true
} else {
return false
}
}
batchPrint1 = () => {
if (this.confirmBatch()) {
if (this.state.creatorButton == false) {
this.state.creatorType = -1
}
if (this.state.auditorButton == false) {
this.state.auditorType = -1
}
if (this.state.supervisorButton == false) {
this.state.supervisorType = -1
}
this.state.type = this.state.value
this.state.maxLineNum = this.state.pageSize
this.state.maxLineNumA4 = this.state.pageSizeA4
this.state.contentFontSize = this.state.contentFontSize
this.state.customPrintTime = this.state.timeOriginal == 1 ? this.state.customPrintTime && this.state.customPrintTime != "Invalid date" ? moment(this.state.customPrintTime).format('YYYY-MM-DD HH:mm:ss') : ' ' : ''
return this.state
}
}
changePageName = (e) => {
let selectNameOptionFalg = false
let value = 0
switch (e) {
case "3":
selectNameOption = maxLineNumA4
selectNameOptionFalg = true
value = this.state.pageSizeA4
break
case "0":
selectNameOption = maxLineNum
selectNameOptionFalg = true
value = this.state.pageSize
break
case "1":
break
case "5":
break
case "4":
selectNameOption = maxLineNumA5
selectNameOptionFalg = true
value = this.state.maxLineNumA5
break
case "11":
break
case "12":
break
case "2":
selectNameOption = maxLineNumCus
selectNameOptionFalg = true
value = this.state.maxLineNumCus
break
}
this.setState({
value: e,
selectNameOptionFalg: selectNameOptionFalg,
selectNameOption: value
})
}
render() {
let { customPrintTime } = this.state
if (customPrintTime && typeof (customPrintTime) == 'string') {
customPrintTime = moment(customPrintTime, 'YYYY-MM-DD HH:mm:ss')
}
if (!this.state.selectNameOption) {
this.changePageName(this.state.value)
}
return (
<div className="printOption" style={{ padding: '20px' }}>
<form>
<div className="ant-form-item ant-form-item-compact">
<div className="col-18">
<RadioGroup style={{ width: '100%' }}>
<div className="item" style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', marginBottom: '10px' }}>
<label style={{ fontSize: '13px', marginRight: '3px' ,width: 60}}>纸张尺寸</label>
<Select value={this.state.value} style={{ width: 196, marginRight: '8px' }} onChange={(e) => { this.changePageName(e) }}>
{selectName.map(o => {
return <Option
key={o.id}
value={o.id}
title={o.name}
>
{o.name}
</Option>
})}
</Select>
<div className="item-select" style={{ margin: '0 10px',display: this.state.value == '11' ? 'inline' : 'none' }} >
<label style={{ fontSize: '13px' }}>241*139.7mm/240*140mm</label>
</div>
<div className="item-select" style={{ margin: '0 10px',display: this.state.value == '12'||this.state.value == '13' ? 'inline' : 'none' }} >
<label style={{ fontSize: '13px' }}>240*140mm</label>
</div>
<div className="item-select" style={{ margin: '0 5px',display: this.state.value == '2' ? 'inline' : 'none' }} >
<label style={{ fontSize: '13px', textAlign: 'right', display: 'inline-block' }}>宽：</label>
<InputNumber value={this.state.width} disabled={this.state.value == '2' ? false : true} style={{ width: 80, marginRight: '5px', textAlign: 'right' }} onChange={(e) => { this.changeWidth(e) }} min={100} max={297} precision={2} />
<label style={{ fontSize: '13px' }}>毫米</label>
</div>
<div className="item-select" style={{ display: this.state.value == '2' ? 'inline' : 'none' }} >
<label style={{ fontSize: '13px' }}>高：</label>
<InputNumber value={this.state.height} disabled={this.state.value == '2' ? false : true} style={{ width: 80, marginRight: '5px', textAlign: 'right' }} onChange={(e) => { this.changeHeight(e) }} min={80} max={297} precision={2} />
<label style={{ fontSize: '13px' }}>毫米</label>
</div>
<div className="item-select" style={{ display: this.state.selectNameOptionFalg ? 'inline' : 'none', width: '155px', textAlign: 'right' }}>
<label style={{ fontSize: '13px' }}>每页分录数：</label>
<Select value={this.state.selectNameOption} style={{ width: 65 ,marginLeft: '4px'}} onChange={(e) => { this.changeMaxLineNumCus(e) }}>
{selectNameOption.map(o => {
return <Option value={o}>{o}</Option>
})}
</Select>
</div>
</div>
<div className="item" style={{ paddingBottom: '8px', height: '45px', lineHeight: '45px'}}>
<label style={{ display: 'inline-block',marginRight: '3px' ,width: 60, height: '45px', lineHeight: '45px' }}>打印方向</label>
<Select value={this.state.landscape} style={{ width: 196 }} onChange={(e) => { this.changeState(e, 'landscape') }}>
<Option value={true}>横向</Option>
<Option value={false}>纵向</Option>
</Select>
</div>
<div style={{height: '45px', lineHeight: '45px'}}>
<label value={2} style={{ display: 'inline-block',marginRight: '3px' ,width: 60 }}>字号</label>
<Select value={this.state.contentFontSize} style={{ width: 196 }} onChange={(e) => { this.changeState(e, 'contentFontSize') }}>
<Option value={5}>5</Option>
<Option value={6}>6</Option>
<Option value={7}>7</Option>
<Option value={8}>8</Option>
<Option value={9}>9</Option>
<Option value={10}>10</Option>
<Option value={11}>11</Option>
<Option value={12}>12</Option>
</Select>
</div>
<div style={{height: '45px', lineHeight: '45px'}}>
<label value={2} style={{ display: 'inline-block',marginRight: '3px' ,width: 60 }}>边距</label>
<div className="item-select" style={{ marginRight: '15px', display: 'inline-block' }}>
<label style={{ fontSize: '13px' }}>左：</label>
<InputNumber value={this.state.leftPadding} style={{ width: 60, marginRight: '5px', textAlign: 'right' }} onChange={(e) => { this.changeState(e, 'leftPadding') }} min={5} max={30} precision={0} />
<label style={{}}>毫米</label>
</div>
<div className="item-select" style={{ marginRight: '15px', display: 'inline-block' }}>
<label style={{}}>右：</label>
<InputNumber value={this.state.rightPadding} style={{ width: 60, marginRight: '5px', textAlign: 'right' }} onChange={(e) => { this.changeState(e, 'rightPadding') }} min={5} max={30} precision={0} />
<label style={{}}>毫米</label>
</div>
<div className="item-select" style={{ marginRight: '15px', display: 'inline-block' }}>
<label style={{}}>上：</label>
<InputNumber value={this.state.topPadding} style={{ width: 60, marginRight: '5px', textAlign: 'right' }} onChange={(e) => { this.changeState(e, 'topPadding') }} min={0} max={30} precision={0} />
<label style={{}}>毫米</label>
</div>
<div className="item-select" style={{ display: 'inline-block' }}>
<label style={{}}>下：</label>
<InputNumber value={this.state.bottomPadding} style={{ width: 60, marginRight: '5px', textAlign: 'right' }} onChange={(e) => { this.changeState(e, 'bottomPadding') }} min={0} max={30} precision={0} />
<label style={{}}>毫米</label>
</div>
</div>
<div style={{ position: 'relative'}}>
<label style={{position: 'absolute', top:'10px'}}>选项</label>
<div style={{ paddingLeft: '63px', display: 'inline-block' }} >
<div className="item" style={{ paddingBottom: '8px', height: '45px', lineHeight: '45px' }}>
<Checkbox checked={this.state.printAuxAccCalc} onChange={(e) => { this.changeAccount(e, 'printAuxAccCalc') }}>打印辅助核算</Checkbox>
<Checkbox checked={this.state.printQuantity} onChange={(e) => { this.changeQuantity(e) }}>打印数量核算</Checkbox>
<Checkbox checked={this.state.printMulti} onChange={(e) => { this.changeMultiCurrency(e) }}>打印外币核算</Checkbox>
</div>
{this.props.from == 'proofList' ?
<div>
<div className="item" style={{ paddingBottom: '8px',height: '45px', lineHeight: '45px' }}>
<Checkbox style={{ width: 115, display: 'inline-block' }} checked={this.state.creatorButton} onChange={(e) => { this.changeAccount(e, 'creatorButton') }}>打印制单人</Checkbox>
{this.state.creatorButton ?
<RadioGroup value={this.state.creatorType} onChange={(e) => { this.changeState(e.target.value, 'creatorType') }} style={{}} >
<Radio value={-2} style={{ width: 100, display: 'inline-block', marginRight: '15px', lineHeight: '32px' }}>原制单人</Radio>
<Radio value={1} style={{ width: 100, display: 'inline-block', lineHeight: '32px' }} >当前操作人</Radio>
<Radio value={0} style={{ lineHeight: '32px', marginRight: '0px' }} >自定义</Radio>
<div style={{ display: this.state.creatorType == 0 ?'inline-block':'none', position: 'relative' }}>
<Input className='creatorTypeInput' placeholder='制单人' value={this.state.creator} disabled={this.state.creatorType == 0 ? false : true} style={{ width: 145, marginRight: '5px', border: this.state.creatorFlag ? '1px solid red' : '' }} onChange={(e) => { this.changeCustom(e, 'creator') }} />
<span style={{ width: 120, marginRight: '5px', display: this.state.creatorFlag ? 'block' : 'none', position: 'absolute', top: '25px', color: 'red' }} >不可为空</span>
</div>
</RadioGroup> : null
}
</div>
<div className="item" style={{ paddingBottom: '8px', height: '45px', lineHeight: '45px' }}>
<Checkbox style={{ width: 115, display: 'inline-block' }} checked={this.state.auditorButton} onChange={(e) => { this.changeAccount(e, 'auditorButton') }}>打印审核人</Checkbox>
{this.state.auditorButton ?
<RadioGroup value={this.state.auditorType} onChange={(e) => { this.changeState(e.target.value, 'auditorType') }} style={{}} >
<Radio value={-2} style={{ width: 100, display: 'inline-block', marginRight: '15px', lineHeight: '32px' }}>原审核人</Radio>
<Radio value={1} style={{ width: 100, display: 'inline-block', lineHeight: '32px' }} >当前操作人</Radio>
<Radio value={0} style={{ lineHeight: '32px', marginRight: '0px' }} >自定义</Radio>
<div style={{ display: this.state.auditorType == 0 ?'inline-block':'none', position: 'relative' }}>
<Input className="editorTypeInput" placeholder='审核人' value={this.state.auditor} disabled={this.state.auditorType == 0 ? false : true} style={{ width: 145, marginRight: '5px', border: this.state.editorFlag ? '1px solid red' : '' }} onChange={(e) => { this.changeCustom(e, 'auditor') }} />
<span style={{ width: 120, marginRight: '5px', display: this.state.editorFlag ? 'block' : 'none', position: 'absolute', top: '25px', color: 'red' }} >不可为空</span>
</div>
</RadioGroup> : null
}
</div>
{
this.props.supervisorType !== -3 ?
<div className="item" style={{ paddingBottom: '8px', height: '45px', lineHeight: '45px' }}>
<Checkbox style={{ width: 115, display: 'inline-block' }} checked={this.state.supervisorButton} onChange={(e) => { this.changeAccount(e, 'supervisorButton') }}>打印主管</Checkbox>
{this.state.supervisorButton ?
<RadioGroup value={this.state.supervisorType} onChange={(e) => { this.changeState(e.target.value, 'supervisorType') }} style={{}} >
<Radio value={-2} style={{ width: 100, display: 'inline-block', marginRight: '15px', lineHeight: '32px' }}>原主管</Radio>
<Radio value={1} style={{ width: 100, display: 'inline-block', lineHeight: '32px' }} >当前操作人</Radio>
<Radio value={0} style={{ lineHeight: '32px', marginRight: '0px' }} >自定义</Radio>
<div style={{ display:this.state.supervisorType == 0?'inline-block':'none', position: 'relative' }}>
<Input className="supervisorTypeInput" placeholder='主管人' value={this.state.supervisor} disabled={this.state.supervisorType == 0 ? false : true} style={{ width: 145, marginRight: '5px', border: this.state.supervisorFlag ? '1px solid red' : '' }} onChange={(e) => { this.changeCustom(e, 'supervisor') }} />
<span style={{ width: 120, marginRight: '5px', display: this.state.supervisorFlag ? 'block' : 'none', position: 'absolute', top: '25px', color: 'red' }} >不可为空</span>
</div>
</RadioGroup> : null
}
</div> : null
}
<div className="item" style={{ paddingBottom: '8px', height: '45px', lineHeight: '45px' }}>
<Checkbox style={{ width: 115, display: 'inline-block' }} checked={this.state.printTime} onChange={(e) => { this.changeAccount(e, 'printTime') }}>显示打印时间</Checkbox>
{this.state.printTime ?
<RadioGroup value={this.state.timeOriginal} onChange={(e) => { this.changeState(e.target.value, 'timeOriginal') }} >
<Radio value={0} style={{ width: 100, display: 'inline-block', marginRight: '15px', lineHeight: '32px' }}>当前操作时间</Radio>
<Radio value={1} style={{ lineHeight: '32px', marginRight: '0px'}} >自定义</Radio>
<DatePicker
style={{ width: '160px',display: this.state.timeOriginal == 1?'inline-block':'none' }}
disabled={this.state.timeOriginal == 1 ? false : true}
allowClear={false}
className='datePicker'
value={customPrintTime}
format="YYYY-MM-DD HH:mm:ss"
disabledDate={(current) => this.disabledDate(current)}
onChange={(value) => this.dateChange('customPrintTime', value)}
/>
</RadioGroup> : null
}
</div></div> : null
}
<div className="item" style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', height: '45px', lineHeight: '45px' }}>
<Checkbox style={{ width: 115, display: 'inline-block' }} checked={this.state.merge} onChange={(e) => { this.merge(e) }}>科目合并至：</Checkbox>
<div className="item-select" style={{ display: 'inline' }}>
<Select value={this.state.grade} style={{ width: 125 }} onChange={(e) => { this.grade(e) }} disabled={this.state.merge ? false : true} >
<Option value={1}>{'1级科目'}</Option>
<Option value={2}>{'2级科目'}</Option>
<Option value={3}>{'3级科目'}</Option>
<Option value={4}>{'4级科目'}</Option>
<Option value={5}>{'5级科目'}</Option>
<Option value={0}>{'末级科目'}</Option>
</Select>
</div>
<Popover content='凭证打印时将会汇总至选中科目级次，大于选中的科目级次将被省略并合并，但不影响系统内自身凭证' overlayStyle={{maxWidth:'360px'}} placement="right" >
<Icon type='bangzhutishi' fontFamily='edficon' style={{ fontSize: '22px', left: '4px', color: '#0066b3', position: 'relative', cursor: 'pointer' }} ></Icon>
</Popover>
</div>
<div className="item" style={{ display: 'flex', flexDirection: 'row', alignItems: 'center',height: '45px', lineHeight: '45px' }}>
<Checkbox style={{ display: 'inline-block' }} checked={this.state.summaryWithQuantity} onChange={(e) => { this.summaryWithQuantity(e) }}>摘要内显示数量、单价（外币、汇率）</Checkbox>
</div>
</div>
</div>
</RadioGroup>
</div>
</div>
</form>
<div style={{ width: '100%', textAlign: 'right', paddingTop: '12px', paddingRight: '12px', borderTop: '1px solid #e8e8e8' }}>
<Button type='primary' onClick={this.confirm}>确定</Button>
<Button style={{ marginLeft: '8px' }} onClick={this.cancel}>取消</Button>
</div>
</div>
)
}
}
export default PrintOptionComponent