// 术后登记
import React, { Component } from 'react';
import { Row, Col, Select, Button, message, Input, Form, DatePicker } from 'antd';
import { $http } from '../../../containers/config/https';
// import { Util } from 'tools/index';
import TextArea from 'antd/lib/input/TextArea';
import moment from 'moment';
import './style/style.less';
const FormItem = Form.Item;
// 用户数据
let userData;
// 登记完成数据下拉选中项存储
let defapparatusNurseID = '', defbackApparatusNurseID = '', deftourNurseID = '', deftourNurseID2 = '', defbackTourNurseID = '', deftraderID = '';
const formItemLayout = {
	labelCol: { span: 5 },
	wrapperCol: { span: 19 },
}

const formItemLayoutLong = {
	labelCol: { span: 2 },
	wrapperCol: { span: 22 },
}
const formItemLayoutLong1 = {
	labelCol: { span: 1 },
	wrapperCol: { span: 23 },
}
// const formItemLayoutCenter = {
// 	labelCol: { span: 2 },
// 	wrapperCol: { span: 24 },
// }
// const formItemLayoutDataForm = {
// 	labelCol: { span: 7 },
// 	wrapperCol: { span: 16, offset: 1 },
// }
const RegAfterOperation = Form.create()(
	class extends Component {
		constructor(props) {
			super(props);
			this.state = {
				nurData: [],				// 护士数据源
				clickFlag: false,
				operationID: '',
				operationApplyInfo: {},		// 手术申请信息
			}
			userData = sessionStorage.userData ? JSON.parse(sessionStorage.userData) : {};
		}

		componentDidMount() {
			this.getLocUserData();
			this.getOperationInfo();
		}

		componentWillReceiveProps(nextProps) {
			if (nextProps.operationID != this.state.operationID) {
				this.setState({ operationID: nextProps.operationID }, () => {
					this.getOperationInfo();
				})
			}
		}

		getLocUserData = () => {
			let data = {
				params: [{
					hospID: userData && userData.hospID ? userData.hospID : '', // 登录医院id
					locID: userData && userData.locID ? userData.locID : '', // 登录科室id
					power: 'select',
					deptEffective: 'Y',
				}]
			};
			$http.post('urlDeault', this, {
				code: "01040021",
				data: data,
				success: function (res) {
					if (+res.errorCode === 0) {
						this.setState({
							nurData: res.result.Data
						})
					}
				},
				error: function (error) {
					message.error('失败：' + error);
				}
			});
		}

		// 获取手术单查询
		getOperationInfo() {
			if (this.props.patOperationID == '') return
			let data = {
				params: [{
					patOperationID: this.props.operationID,
				}]
			};
			$http.post('urlDeault', this, {
				code: "04160006",
				data: data,
				success: function (res) {
					if (+res.errorCode === 0) {
						let dataInfo = res.result.Data[0];
						//console.log(dataInfo)
						this.setState({ operationApplyInfo: dataInfo })
						if (this.props.status == '02') {
							dataInfo.apparatusNurseID = defapparatusNurseID
							dataInfo.backApparatusNurseID = defbackApparatusNurseID
							dataInfo.tourNurseID = deftourNurseID
							dataInfo.tourNurseID2 = deftourNurseID2
							dataInfo.backTourNurseID = defbackTourNurseID
							dataInfo.traderID = deftraderID.toString().replace(/,/g, "^")
						}
						this.props.form.setFieldsValue({
							arrangeOperationRoomDesc: dataInfo.arrangeOperationRoomDesc,
							operationDate: dataInfo.operationDate,
							arrangeOperationTime: dataInfo.arrangeOperationTime,
							arrangeNumber: dataInfo.arrangeNumber,
							apparatusNurseID: dataInfo.apparatusNurseID,
							backApparatusNurseID: dataInfo.backApparatusNurseID,
							tourNurseID: dataInfo.tourNurseID,
							tourNurseID2: dataInfo.tourNurseID2,
							backTourNurseID: dataInfo.backTourNurseID,
							traderID: (dataInfo.traderID) && (dataInfo.traderID != "") ? dataInfo.traderID.toString().split("^") : [],
							apparatusNotes: dataInfo.apparatusNotes,
							tourNotes: dataInfo.tourNotes,
							afterOperationNotes: dataInfo.afterOperationNotes,
							// actualStartDate: dataInfo.actualStartDate ? moment(dataInfo.actualStartDate, 'YYYY-MM-DD') : null,
							// actualStartTime: dataInfo.actualStartTime ? moment(dataInfo.actualStartTime, 'HH:mm:ss') : null,
							actualEndDate: dataInfo.actualEndDate ? moment(dataInfo.actualEndDate, 'YYYY-MM-DD') : moment(),
							// actualEndTime: dataInfo.actualEndTime ? moment(dataInfo.actualEndTime, 'HH:mm:ss') : null
							actualOperation: dataInfo.actualOperation
						})
					}
				},
				error: function (error) {

					message.error('失败：' + error);
				}
			});
		}

		//保存
		save = (code) => {
			this.setState({
				clickFlag: true,
			});
			const formData = this.props.form.getFieldsValue();
			this.props.form.validateFields((err, value) => {
				if (err) {
					this.setState({
						clickFlag: false
					});
				} else {
					if (this.props.status && this.props.status == '02') {
						defapparatusNurseID = formData.apparatusNurseID
						defbackApparatusNurseID = formData.backApparatusNurseID
						deftourNurseID = formData.tourNurseID
						deftourNurseID2 = formData.tourNurseID2
						defbackTourNurseID = formData.backTourNurseID
						deftraderID = formData.traderID
					}
					let data = {
						params: [{
							id: this.state.operationID || this.props.operationID,
							statusCode: code,
							type: 'finish',
							apparatusNurseID: formData.apparatusNurseID,
							backApparatusNurseID: formData.backApparatusNurseID,
							tourNurseID: formData.tourNurseID,
							tourNurseID2: formData.tourNurseID2,
							backTourNurseID: formData.backTourNurseID,
							traderID: formData.traderID,
							apparatusNotes: formData.apparatusNotes,
							tourNotes: formData.tourNotes,
							afterOperationNotes: formData.afterOperationNotes,
							// actualStartDate: formData.actualStartDate ? moment(formData.actualStartDate).format('YYYY-MM-DD') : null,
							// actualStartTime: formData.actualStartTime ? moment(formData.actualStartTime).format('HH:mm:ss') : null,
							actualEndDate: formData.actualEndDate ? moment(formData.actualEndDate).format('YYYY-MM-DD') : null,
							// actualEndTime: formData.actualEndTime ? moment(formData.actualEndTime).format('HH:mm:ss') : null,
							actualOperation: formData.actualOperation
						}]
					};
					// console.log(data)
					$http.post('urlADS', this, {
						code: "04160004",
						data: data,
						success: function (res) {
							if (+res.errorCode == '0') {
								message.success('成功');
								this.setState({
									clickFlag: false,
									operationID: res.id,
									statusCode: res.statusCode
								}, () => {
									this.getOperationInfo();
									this.props?.handleSaveCollBack();
								});
							} else {
								this.setState({ clickFlag: false })
							}
						},
						error: function (error) {
							message.error('失败：' + error);
							this.setState({ clickFlag: false })
						}
					});
				}
			});
		}

		render() {
			const { getFieldDecorator } = this.props.form;
			// const inputStyle = {
			// 	width: '50px'
			// }
			// const spanStyle = {
			// 	marginTop: '5px'
			// }
			let formData = this.props.form.getFieldsValue();
			const selectedNurData = [formData.apparatusNurseID, formData.backApparatusNurseID, formData.tourNurseID, formData.tourNurseID2, formData.backTourNurseID, formData.traderID]
			// let operationApplyInfo = this.state.operationApplyInfo ? this.state.operationApplyInfo : {}
			return (
				<div>
					<Form style={{ minHeight: '400px' }}>
						<Row>
							<Col span={6} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayout} label='手术间'>
									{getFieldDecorator('arrangeOperationRoomDesc', {
										initialValue: ''
									})(
										<Input disabled >
										</Input>
									)}
								</FormItem>
							</Col>
							<Col span={6} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayout} label='安排日期'>
									{getFieldDecorator('operationDate', {
										initialValue: ''
									})(
										<Input disabled >
										</Input>
									)}
								</FormItem>
							</Col>
							<Col span={6} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayout} label='安排时间'>
									{getFieldDecorator('arrangeOperationTime', {
										initialValue: ''
									})(
										<Input disabled >
										</Input>
									)}
								</FormItem>
							</Col>
							<Col span={6} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayout} label='安排台次'>
									{getFieldDecorator('arrangeNumber', {
										initialValue: ''
									})(
										<Input disabled >
										</Input>
									)}
								</FormItem>
							</Col>
						</Row>
						<Row>
							<Col span={24} style={{ padding: '0 16px 10px' }}>
								<FormItem {...formItemLayoutLong1} label='实际手术'>
									{getFieldDecorator('actualOperation', {
										initialValue: ''
									})(
										<TextArea
											style={{ marginTop: '10px' }}
											allowClear
											autosize={{ minRows: 2, maxRows: 6 }}
										>
										</TextArea>
									)}
								</FormItem>
							</Col>
						</Row>
						<Row>
							<Col span={6} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayout} label='器械护士'>
									{getFieldDecorator('apparatusNurseID', {
										initialValue: '',
										// rules: [{ required: true, message: '请选择...', }]
									})(
										<Select showSearch allowClear optionFilterProp="role" >
											{this.state.nurData.map(data => (<Select.Option key={data.id} value={data.id} role={data.code + '^' + data.descripts + '^' + data.descriptsSPCode} disabled={selectedNurData.includes(data.id)}>{data.descripts}</Select.Option>))}
										</Select>
									)}
								</FormItem>
							</Col>
							<Col span={6} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayout} label='交器械'>
									{getFieldDecorator('backApparatusNurseID', {
										initialValue: '',
										// rules: [{ required: true, message: '请选择...', }]
									})(
										<Select showSearch allowClear optionFilterProp="role" >
											{this.state.nurData.map(data => (<Select.Option key={data.id} value={data.id} role={data.code + '^' + data.descripts + '^' + data.descriptsSPCode} disabled={selectedNurData.includes(data.id)}>{data.descripts}</Select.Option>))}
										</Select>
									)}
								</FormItem>
							</Col>
							<Col span={6} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayout} label='巡回护士'>
									{getFieldDecorator('tourNurseID', {
										initialValue: '',
										// rules: [{ required: true, message: '请选择...', }]
									})(
										<Select showSearch allowClear optionFilterProp="role" >
											{this.state.nurData.map(data => (<Select.Option key={data.id} value={data.id} role={data.code + '^' + data.descripts + '^' + data.descriptsSPCode} disabled={selectedNurData.includes(data.id)}>{data.descripts}</Select.Option>))}
										</Select>
									)}
								</FormItem>
							</Col>
							<Col span={6} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayout} label='巡回护士2'>
									{getFieldDecorator('tourNurseID2', {
										initialValue: '',
										// rules: [{ required: true, message: '请选择...', }]
									})(
										<Select showSearch allowClear optionFilterProp="role" >
											{this.state.nurData.map(data => (<Select.Option key={data.id} value={data.id} role={data.code + '^' + data.descripts + '^' + data.descriptsSPCode} disabled={selectedNurData.includes(data.id)}>{data.descripts}</Select.Option>))}
										</Select>
									)}
								</FormItem>
							</Col>
							<Col span={6} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayout} label='交巡回'>
									{getFieldDecorator('backTourNurseID', {
										initialValue: '',
										// rules: [{ required: true, message: '请选择...', }]
									})(
										<Select showSearch allowClear optionFilterProp="role" >
											{this.state.nurData.map(data => (<Select.Option key={data.id} value={data.id} role={data.code + '^' + data.descripts + '^' + data.descriptsSPCode} disabled={selectedNurData.includes(data.id)}>{data.descripts}</Select.Option>))}
										</Select>
									)}
								</FormItem>
							</Col>
							<Col span={6} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayout} label='操盘'>
									{getFieldDecorator('traderID', {
										initialValue: '',
										// rules: [{ required: true, message: '请选择...', }]
									})(
										<Select
											mode="multiple"
											showSearch allowClear optionFilterProp="role" >
											{this.state.nurData.map(data => (<Select.Option key={data.id} value={data.id} role={data.code + '^' + data.descripts + '^' + data.descriptsSPCode} disabled={selectedNurData.includes(data.id)}>{data.descripts}</Select.Option>))}
										</Select>
									)}
								</FormItem>
							</Col>
						</Row>
						<Row className="apparatus" style={{ height: "55px", lineHeight: "55px" }}>
							<Col span={12} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayoutLong} label='器械备注'>
									{getFieldDecorator('apparatusNotes', {
										initialValue: ''
									})(
										<Input allowClear >
										</Input>
									)}
								</FormItem>
							</Col>
							<Col span={12} style={{ paddingRight: '15px' }}>
								<FormItem {...formItemLayoutLong} label='巡回备注'>
									{getFieldDecorator('tourNotes', {
										initialValue: ''
									})(
										<Input allowClear >
										</Input>
									)}
								</FormItem>
							</Col>
						</Row>
						<Row>
							<Col span={24} style={{ padding: '0 16px 10px' }}>
								<FormItem {...formItemLayoutLong1} label='备注'>
									{getFieldDecorator('afterOperationNotes', {
										initialValue: ''
									})(
										<TextArea
											style={{ marginTop: '10px' }}
											allowClear
											autosize={{ minRows: 2, maxRows: 6 }}
										>
										</TextArea>
									)}
								</FormItem>
							</Col>
						</Row>
						<Row>
							<Col span={6} >
								<FormItem  {...formItemLayout} label='完成日期'>
									{getFieldDecorator('actualEndDate', {
										initialValue: '',
										rules: [{ required: true, message: '完成日期必填' }]
									})(
										<DatePicker
											style={{ width: '100%' }}
											disabledDate={(curDate) => {
												return curDate && curDate > moment().endOf('day');
											}}
										/>
									)}
								</FormItem>
							</Col>
						</Row>
						{/* <Row style={{height:"80px",borderBottom:"1px solid #eee",lineHeight:"80px"}}> */}
						{/* <Col span={4} style={{ paddingRight: "0" }}>
								<FormItem {...formItemLayoutDataForm} label='日期选择'>
									{getFieldDecorator('actualStartDate', {
										initialValue: operationApplyInfo.actualStartDate ? moment(operationApplyInfo.actualStartDate, 'YYYY-MM-DD') : moment(moment().format('L'), 'YYYY-MM-DD'),
										rules: [{ required: true }]
									})(
										<DatePicker style={{ width: '100%' }} disabledDate={(curDate) => {
											return curDate && curDate > moment().endOf('day');
										}} />
									)}
								</FormItem>
							</Col> */}
						{/* <Col span={2} style={{ paddingLeft: "5px", paddingRight: "0px" }}>
								<FormItem {...formItemLayoutCenter} label=''>
									{getFieldDecorator('actualStartTime', {
										initialValue: operationApplyInfo.actualStartTime ? moment(operationApplyInfo.actualStartTime, 'HH:mm') : null,
										//rules: [{ required: true }]
									})(
										<TimePicker style={{ width: '100%' }} format='HH:mm' />
									)}
								</FormItem>
							</Col> */}
						{/* <Col span={1} style={{ width: "2%", textAlign: "center", padding: "0px" }}>
								<FormItem  {...formItemLayoutCenter}>
									<Col>
										至
								</Col>
								</FormItem>
							</Col> */}
						{/* <Col span={4} >
								<FormItem  {...formItemLayoutCenter} label='手术完成日期'>
									{getFieldDecorator('actualEndDate', {
										initialValue: operationApplyInfo.actualEndDate ? moment(operationApplyInfo.actualEndDate, 'YYYY-MM-DD') : moment(moment().format('L'), 'YYYY-MM-DD'),
										rules: [{ required: true }]
									})(
										<DatePicker
											style={{ width: '100%' }}
											disabledDate={(curDate) => {
												return curDate && curDate > moment().endOf('day');
											}}
										/>
									)}
								</FormItem>
							</Col> */}
						{/* <Col span={2} style={{ paddingLeft: "5px", paddingRight: "0px" }}>
								<FormItem {...formItemLayoutCenter} label=''>
									{getFieldDecorator('actualEndTime', {
										initialValue: operationApplyInfo.actualEndTime ? moment(operationApplyInfo.actualEndTime, 'HH:mm') : null,
										//rules: [{ required: true }]
									})(
										<TimePicker style={{ width: '100%' }} format='HH:mm' />
									)}
								</FormItem>
							</Col> */}
						{/* </Row> */}
						<Row>
							<Col offset={11} span={1}>
								<Button
									style={{ marginTop: '30px' }}
									type='primary'
									htmlType="submit"
									onClick={this.save.bind(this, '07')}
								>保存
								</Button>
							</Col>
						</Row>
						<br />
					</Form>

				</div>
			)
		}
	}
)
export default RegAfterOperation;
