//药品信息维护
import React from 'react';
import {
    Form,Col,Row,Card,Input,Button,Tree,Tabs,Icon,message
} from 'antd';
import '../../../assets/css/App.css'
import '../common/App.css'
import ChemistryMain from './ChemistryMain';
import GenericMain from './GenericMain';
import MedItemMain from './MedItemMain';
import StockItemMain from './StockItemMain';
import PHCatSave from './PHCatSave';
import { $http } from '../../../containers/config/https';
const { TreeNode } = Tree;
const TabPane = Tabs.TabPane;
class Maintenance extends React.Component {
    constructor(props) {
        super(props)
        // var userData = JSON.parse(sessionStorage.getItem('userData'))
        this.state = {
            CatDesc: '',
            expandedKeys: [],
            autoExpandParent: true,
            treeData:[],
            index:1,
        }

    }

    componentDidMount() {
        this.loadData();  //加载数据
    }

    loadData() {
        var params = {
            params: [{}],
        }
        $http.post('url', this, {
            code: "02020001",
            data: params,
            success: function (res) {
                if (res.errorCode === '0') {
                    this.setState({
                        treeData: res.result,
                    })
                    this.generateList(this.state.treeData);
                }
            }
        });
    }


    // 调用子组件的连接事件
    onRef = (ref) => {
        this.child = ref
    }

    // 调用子组件的连接事件
    onRefPhCat = (ref) => {
        this.childPhCat = ref
    }

    // 调用子组件的连接事件
    onRefMedItem = (ref) => {
        this.childMedItem = ref
    }

    // 调用子组件的连接事件
    onRefStockItem = (ref) => {
        this.childStockItem = ref
    }

    //以下是Tree展开搜索
    dataList = [];
    generateList = (data) => {
        for (let i = 0; i < data.length; i++) {
            const node = data[i];
            const key = node.key;
            this.dataList.push({ key, title: node.title });
            if (node.children) {
                this.generateList(node.children);
            }
        }
    };
    
    getParentKey = (key, tree) => {
        let parentKey;
        for (let i = 0; i < tree.length; i++) {
            const node = tree[i];
            if (node.children) {
                if (node.children.some(item => item.key === key)) {
                    parentKey = node.key;
                } else if (this.getParentKey(key, node.children)) {
                    parentKey = this.getParentKey(key, node.children);
                }
            }
        }
        return parentKey;
    };

    onExpand = (expandedKeys) => {
        this.setState({
            expandedKeys,
            autoExpandParent: false,
        });
    }

    renderTreeNodes = data => data.map((item) => {
        const index = item.title.indexOf(this.state.CatDesc);
        const beforeStr = item.title.substr(0, index);
        const afterStr = item.title.substr(index + this.state.CatDesc.length);
        const title = index > -1 ? (
            <span>
            {beforeStr}
            <span style={{ color: '#FF7F00' }}>{this.state.CatDesc}</span>
            {afterStr}
            </span>
        ) : <span>{item.title}</span>;
		if (item.children) {
			return (
				<TreeNode title={title} key={item.key} dataRef={item}>
					{this.renderTreeNodes(item.children)}
				</TreeNode>
			);
		}
		return <TreeNode title={title} key={item.key} dataRef={item} />;
    })

    selectTree = (selectedKeys, e) => {
        //console.log(e)
        if(selectedKeys.length>0)
        {
            //console.log(e.selectedNodes[0].props.dataRef.code)
            this.setState({
                phCatID:selectedKeys[0],
                phCatCode:e.selectedNodes[0].props.dataRef.code,
                phCatDesc:e.selectedNodes[0].props.dataRef.title,
            })
        }
        else{
            this.setState({
                phCatID:'',
                phCatCode:'',
                phCatDesc:'',
            })
        }
    }

    // 药理学分类查询
    handlePhCatQuery = () => {
        this.loadData();
    }

    // 药理学分类新增
    handlePhCatAdd = () => {
        //console.log(this.state.phCatDesc)
        // 显示弹框
        this.childPhCat.showModal()
        // 初始化数据
        this.setState({
            flag: 'add', 
            title: '新增药理学分类',
            codeLabel: '分类代码',
            descLabel: '分类描述',
            fristLabel: '上级分类',
        })
    }
    // 药理学分类修改
    handlePhCatModify = () => {
        //console.log(parseInt(this.state.phCatID))
        if(parseInt(this.state.phCatID)>0){
            // 显示弹框
            this.childPhCat.showModal()
            // 初始化数据
            this.setState({
                flag: 'modify', 
                title: '修改药理学分类',
                codeLabel: '分类代码',
                descLabel: '分类描述',
                fristLabel: '改前描述',
            })
        }else{
            message.warning('请选择药理学分类再修改！！！');
            return; 
        }
    }

    // 查询---药理学分类
    onChangePhCat = (e) => {
        const CatDesc=e.target.value;
        const expandedKeys = this.dataList.map((item) => {
            if (CatDesc.length===0) return null;
            if (item.title.indexOf(CatDesc) > -1) {
                return this.getParentKey(item.key, this.state.treeData);
            }
            return null;
        }).filter((item, i, self) => item && self.indexOf(item) === i);
        this.setState({
            expandedKeys,
            CatDesc: e.target.value,
            autoExpandParent: true,
        });
        //console.log(this.state.treeData)
    }

    // 切换页签
    onChangeTabs = (key) => {
        this.setState({ 
            index:key,
        });
        //console.log('key:'+key)
        if(key===2 && this.child.handleQuery){
            this.child.setState({
                chemistryDesc:this.state.selectChemistryDesc,
            })
            this.child.handleQuery(1);
        }
        if(key===3 && this.childMedItem.handleQuery){
            this.childMedItem.setState({
                genericDesc:this.state.selectGenericDesc,
            })
            this.childMedItem.handleQuery(1);
        }
        if(key===4 && this.childStockItem.handleQuery){
            this.childStockItem.setState({
                medItemDesc:this.state.selectMedItemDesc,
            })
            this.childStockItem.handleQuery(1);
        }
    }

    render() {
        var color = {
            color:"#FFFFFF",
            marginLeft:"10px",
            marginTop:"2px",
        }
        
        return(
            <div style={{height:"100%"}}>
                <Row style={{widht: '100%', height: '25px', background: '#1999db',fontSize:"12pt"}}>
                    <p style={color}>
                        药品信息维护
                    </p>
                </Row>
                <Row style={{height:"91%"}}>
                    <Col span={7} style={{height:"100%"}}>
                        <Card bodyStyle={{padding:'12px'}}>
                            <Row>
                                <Input placeholder="药理学分类···" value={this.state.CatDesc} style={{width: '120px'}} onChange={this.onChangePhCat} />
                                {/* <Button style={{ marginLeft: '20px', background: 'rgba(100,169,130,1)',color:'#ffffff'}}  onClick={this.handlePhCatQuery}>查询</Button> */}
                                <Button style={{ marginLeft: '20px', background: '#1999db',color:'#ffffff'}}  onClick={this.handlePhCatAdd}>新增</Button>
                                <Button style={{ marginLeft: '20px', background: 'rgba(255,0,0,1)',color:'#ffffff'}}  onClick={this.handlePhCatModify}>修改</Button>
                            </Row>
                        </Card>
                        {/* <Row style={{widht: '100%', height: '22px', background: '#64A982',fontSize:"10pt"}}>
                            <p style={color}>
                                药理学分类
                            </p>
                        </Row> */}
                        <Card className="cardstyle"  bodyStyle={{paddingLeft:'10px',paddingTop:'1px'}} title="药理学分类">
                            <div style={{ width: '100%' ,height: '100%' }}> 
                                <Tree
                                    autoExpandParent={this.state.autoExpandParent}
                                    onExpand={this.onExpand}
                                    expandedKeys={this.state.expandedKeys}
                                    onSelect={this.selectTree}
                                >
                                    {this.renderTreeNodes(this.state.treeData)}
                                </Tree>
                            </div>
                        </Card>
                    </Col>
                    <Col span={17}>
                        <Row >
                            <Tabs 
                                ref={(e) => { this._Tabs = e }} 
                                activeKey={String(this.state.index)} 
                                onChange={this.onChangeTabs}
                            >
                                <TabPane tab={<span><Icon type="github" />化学通用名</span>} key="1" style={{height:"100%"}}>
                                        <ChemistryMain
                                            onRef={this.onRef}
                                            handelThis={this}
                                            phcatid={this.state.phCatID}
                                            phcatdesc={this.state.phCatDesc}
                                            
                                        />
                                </TabPane>
                                <TabPane tab={<span><Icon type="github" />处方通用名</span>} key="2">
                                    <GenericMain
                                        onRef={this.onRef}
                                        handelThis={this}
                                        chemistryID={this.state.selectChemistryID}
                                        chemistryDesc={this.state.selectChemistryDesc}
                                    />
                                </TabPane>
                                <TabPane tab={<span><Icon type="github" />医嘱项</span>} key="3">
                                    <MedItemMain
                                        onRef={this.onRefMedItem}
                                        handelThis={this}
                                        genericID={this.state.selectGenericID}
                                    />
                                </TabPane>
                                <TabPane tab={<span><Icon type="github" />库存项</span>} key="4">
                                    <StockItemMain
                                        onRef={this.onRefStockItem}
                                        handelThis={this}
                                        medItemID={this.state.selectMedItemID}
                                    />
                                </TabPane>
                            </Tabs>
                        </Row>
                    </Col>
                </Row>
                {/* 新增弹框 */}
                <PHCatSave
                    onRef={this.onRefPhCat}
                    flag={this.state.flag}
                    handelThis={this}
                    title={this.state.title}
                    codeLabel={this.state.codeLabel}
                    descLabel={this.state.descLabel}
                    phcatid={this.state.phCatID}
                    phcatcode={this.state.phCatCode}
                    phcatdesc={this.state.phCatDesc}
                    fristLabel={this.state.fristLabel}
                />
            </div>
        )
    }
}export default Form.create()(Maintenance);