// 拒绝弹框
import React from 'react';
import { Modal, Steps, Icon, Card, Row, Col, Input, Button, Tree, message, List } from 'antd';
import { $http } from 'containers/config/https';
import {Util} from 'tools'

const { TextArea } = Input;
const Step = Steps.Step;
const { TreeNode } = Tree;

export default class AppealPopup extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            visible: false,
            popupData:{},//传过来的参数
            reasonsPreviewDis: [], //审核记录
            audStID: '',
            value: '', //备注信息
            remarkDis:'',//说明
            stautsCode:'', //显示内容
            reasonData: {},
        };
    }

    componentDidMount() {
        this.props.onRef(this);
        this.getAuditLogging();
    }

    // componentWillReceiveProps(props) {
    //     console.log('123',props)
    //     this.setState({popupData: props.handlerThis ? props.handlerThis.state : {}})
    // }
    // 打开弹框
    showModal = (v) => {
        this.setState({visible: true});
    };
    //关闭弹窗
    handleCancel=()=>{
        this.setState({visible: false});
    };
    // 点击查看历史流程
    getAuditLogging = () => {
        let popupData = this.props.handlerThis ? this.props.handlerThis.state:{};
            let data = {
                params: [{
                    ordPrescNo: popupData.otherInfo ? JSON.parse(popupData.otherInfo).prescno : ''
                }]
            }
            $http.post('urlS', this, {
                code: "02030025",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0 && res.result[0].rows.length > 0) {
                        let endObj =  res.result[0].rows.slice(-1);
                        this.setState({auditLogging: res.result[0].rows,  audStID: endObj[0].audStID,reasonData:endObj[0]},() => {
                            this.handleSpan(endObj[0]);
                        })
                    } else {
                        this.setState({auditLogging: []})
                    }
                }
            })
    };
    // 点击查看历史流程
    handleSpan = (rowData) => {
        this.setState({stautsCode:rowData.stautsCode});
        if(rowData.audStID){
            let data = {
                params: [{
                    audStID: rowData.audStID,
                }]
            }
            $http.post('urlS', this, {
                code: "02030026",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        let reasonsPreview = res.result[0].reasonInfo&&res.result[0].reasonInfo.map(item => {
                            return {
                                title: item.reasonDesc,
                                reasonID: item.reasonID,
                                ordInfo: item.ordInfo&&item.ordInfo.map((child, index) => {
                                    return {
                                        ordID: child.ordDr,
                                        medDesc: child.medDesc,
                                        ordUsage: child.ordUsage
                                    }
                                })
                            }
                        })
                        let processNode = rowData.audStID === "" ? '1' : '0';
                        this.setState({remarkDis: res.result[0].remark, reasonsPreviewDis: reasonsPreview, processNode: processNode, audStID: rowData.audStID})
                    }
                }
            })
        }else {
            // 返回当前节点
            this.handleGoBack()
        }
    };


    // 获取拒绝原因
    AcceptReject = () => {
        let popupData = this.props.handlerThis ? this.props.handlerThis.state:{};
        let data = {
            params: [{
                ordPrescNo: popupData.otherInfo ? JSON.parse(popupData.otherInfo).prescno : '',
                remark:this.state.value,
            }]
        }
        $http.post('urlS', this, {
            code: "02030024",
            data: data,
            success: function (res) {
                if (+res.errorCode === 0) {
                   message.success(res.errorMessage);
                    this.props.handlerThis.close()
                }
            }
        })
    };
    //申诉
    appealMethod=()=>{
        let popupData = this.props.handlerThis ? this.props.handlerThis.state:{};
        let data = {
            params: [{
                ordPrescNo: popupData.otherInfo ? JSON.parse(popupData.otherInfo).prescno : '',
                remark:this.state.value,
            }]
        }
        $http.post('urlS', this, {
            code: "02030023",
            data: data,
            success: function (res) {
                if (+res.errorCode === 0) {
                    message.success(res.errorMessage);
                    this.props.handlerThis.close()
                }
            }
        })
    }

    onChangeValue=(v)=>{
        this.setState({value: v.target.value})
    };
    // 返回当前节点
    handleGoBack = () => {
        // 改变状态
        this.setState({ audStID: ''})
    };

    render() {
        let {auditLogging, reasonData} = this.state;
        let length = auditLogging ? auditLogging.length : 0;
        return (
                <div style={{minHeight: '500px'}} className="reject-steps">
                    <div style={{width: '100%', overflow: 'auto', margin: '0 auto'}} className="none-scroll">
                        <Steps size="small" current={1} style={{width: length * 172 + 'px', margin: '0 auto'}}>
                            {auditLogging&&auditLogging.map((item, index) => {
                                return (
                                    <Step
                                        style={{color: '#1890ff'}}
                                        key={index} icon={<Icon type="user" />}
                                        status={item.clickFlag === 1 ? (item.audStID === this.state.audStID ? "process" : "finish") : 'wait'}
                                        title={item.clickFlag === 0 ? item.role : <span style={{cursor: 'pointer'}}
                                                                                        onClick={() => {this.setState({reasonData: item},()=>{this.handleSpan(item)})}}>{item.role}</span>}
                                        description={
                                            <div key={index+'descriptopn'} style={{fontSize: '12px', }}><Icon type="check" style={{marginRight: '8px'}} />{item.userName + ' ' + item.stautsDesc + ' ' + item.date + ' ' + item.time}</div>
                                        }
                                    />
                                )
                            })}
                        </Steps>
                    </div>
                    <div>
                        <div style={{margin: '15px 0 0'}}>
                            <Row>
                                <Col>
                                    {this.state.stautsCode == 'Yes' &&
                                        <div style={{ fontSize: '16px', fontWeight: '900',borderTop: '1px solid #e5e5e5', paddingTop: '40px' ,marginLeft: '13px'}}>
                                            {reasonData.userName + ' ' + reasonData.stautsDesc + ' ' + reasonData.date + ' ' + reasonData.time}
                                        </div>
                                    }
                                    {this.state.stautsCode == 'No' &&
                                        <Card title='拒绝原因预览' size="small">
                                            <div style={{height: '320px', overflow: 'auto'}}>
                                            <List
                                            itemLayout="horizontal"
                                            dataSource={this.state.reasonsPreviewDis}
                                            renderItem={item => (
                                            <List.Item>
                                            <List.Item.Meta
                                            title={<div>{item.title}</div>}
                                            description={
                                            item.ordInfo&&item.ordInfo.map((child, index) => {
                                                return (
                                                    (<li key={index} style={{position: 'relative', paddingRight: '20px'}}>
                                                        <div style={{marginRight: '10px'}}>
                                                            <span style={{marginRight: '15px'}}>{index + 1}、{child.medDesc}</span>
                                                            {child.medSpec ? <span>{child.medSpec+ "*1片"}</span> : ''}
                                                            {/*{child.ordUsage ? <span>用法：{child.ordUsage}</span> : ''}*/}
                                                        </div>
                                                        <div style={{marginLeft: '20px'}}>
                                                            <span>用法：{child.ordUsage}</span>
                                                         </div>
                                                    </li>)
                                                )
                                            })
                                        }
                                            />
                                            </List.Item>
                                            )}
                                            />
                                            </div>
                                            </Card>
                                    }
                                    {
                                        this.state.stautsCode == 'Apply' &&
                                            <div>
                                                <div style={{ fontSize: '16px', fontWeight: '900',borderTop: '1px solid #e5e5e5', paddingTop: '40px' ,marginLeft: '13px'}}>
                                                    {reasonData.userName + ' ' + reasonData.stautsDesc + ' ' + reasonData.date + ' ' + reasonData.time}
                                                </div>
                                            </div>
                                    }
                                    {
                                        this.state.stautsCode == 'Rec' &&
                                            <div style={{ fontSize: '16px', fontWeight: '900',marginLeft: '13px',  borderTop: '1px solid #e5e5e5', paddingTop: '40px'}}>
                                                {reasonData.userName + ' ' + reasonData.stautsDesc + ' ' + reasonData.date + ' ' + reasonData.time}
                                            </div>
                                    }
                                </Col>
                            </Row>
                        </div>
                        {this.state.stautsCode !== 'Yes' &&
                        <div style={{margin: '9px 0px 9px 13px',fontSize: this.state.stautsCode !== 'No' ? '16px' : '14px', fontWeight: this.state.stautsCode !== 'No' ? '900' : 'normal', marginBottom: this.state.stautsCode == 'No' ? '30px' : ''}}>
                            <span>说明： {this.state.remarkDis}</span>
                        </div>
                        }
                        {
                            !this.state.audStID &&
                            <Row>
                                <Col span={2} style={{textAlign: 'center'}}>备注：</Col>
                                <Col span={22}>
                                <TextArea
                                    rows={2}
                                    style={{width: '100%'}}
                                    onChange={this.onChangeValue}
                                />
                                </Col>
                            </Row>
                        }

                    </div>
                    <div>
                        <div style={{marginTop: '20px', textAlign: 'center',     position: 'absolute', bottom: '15px',left: '40%'}}>
                                    <Button disabled={this.state.audStID ? true : false} type="primary" style={{margin: '0 15px'}} onClick={this.AcceptReject}>接受拒绝</Button>
                                    <Button disabled={this.state.audStID ? true : false} type="danger" onClick={this.appealMethod}>申诉</Button>
                        </div>
                    </div>
                </div>
        );
    }
}
