/**
 * 医保目录维护
 */

import React from 'react';
import {
	Input, Row, Col, Button, Table, message, Icon, Popconfirm, Divider, Select
} from 'antd';
import { $http } from '../../../containers/config/https';
import AddMedicalInsuranceDirectory from './AddMedicalInsuranceDirectory.jsx';
import store from 'store';
import CommonPagination from 'components/pagination/index';
import ColumnAuthoritysModel from '../../columnAuthority/ColumnAuthoritysModel';


const { Option } = Select;
let user;
class MedicalInsuranceDirectory extends React.Component {
	constructor(props) {
		super(props);
		this.state = {
			insuCode: "",
			insuDesc: "",
			configInfo: {},
			tableData: [],
			// 表格数据总条数
			total: 0,
			page: 1,
			pageSize: 10,
			flag: "",
			title: "",
			column: [],
			admReasonArr: [],
			admReason:""
		}
		this.columns = [
			{
				key: 0,
				title: '医保地域',
				dataIndex: 'yBAreaDesc',
				align: "center",
				width: '100'
			},
			{
				key: 1,
				title: '省项目编码',
				dataIndex: 'provinceCode',
				align: "center",
				width: '100'
			},
			{
				key: 2,
				title: '社保目录编码',
				dataIndex: 'insuCode',
				align: "center",
				width: '100'
			},
			{
				key: 3,
				title: '社保目录名称',
				dataIndex: 'insuDesc',
				align: "center",
				width: '100',
			},
			{
				key: 4,
				title: '目录类别',
				dataIndex: 'catalogCategory',
				align: "center",
				width: '100',
			},
			{
				key: 5,
				title: '分类编码',
				dataIndex: 'classCode',
				align: "center",
				width: '100',
			},
			{
				key: 6,
				title: '通用名',
				dataIndex: 'generic',
				align: "center",
				width: '100',
			},
			{
				key: 7,
				title: '药品本位码',
				dataIndex: 'bitCode',
				align: "center",
				width: '100',
			},
			{
				key: 8,
				title: '英文名称',
				dataIndex: 'englishName',
				align: "center",
				width: '100',
			},
			{
				key: 9,
				title: '别名（简称）',
				dataIndex: 'alias',
				align: "center",
				width: '100',
			},
			{
				key: 10,
				title: '大类代码',
				dataIndex: 'pinyinCode',
				align: "center",
				width: '100',
			},
			{
				key: 11,
				title: '记账途径',
				dataIndex: 'jZChannel',
				align: "center",
				width: '100',
			},
			{
				key: 12,
				title: '规格',
				dataIndex: 'specifications',
				align: "center",
				width: '100',
			},
			{
				key: 13,
				title: '计价单位',
				dataIndex: 'unit',
				align: "center",
				width: '100',
			},
			{
				key: 14,
				title: '单位时间',
				dataIndex: 'unitTime',
				align: "center",
				width: '100',
			},
			{
				key: 15,
				title: '剂型',
				dataIndex: 'formulation',
				align: "center",
				width: '100',
			},
			{
				key: 16,
				title: '收费项目等级',
				dataIndex: 'itemGrade',
				align: "center",
				width: '100',
			},
			{
				key: 17,
				title: '记账标志',
				dataIndex: 'accountingMark',
				align: "center",
				width: '100',
			},
			{
				key: 18,
				title: '药品类别',
				dataIndex: 'drugsClass',
				align: "center",
				width: '100',
			},
			{
				key: 19,
				title: '最高限价',
				dataIndex: 'maxPrice',
				align: "center",
				width: '100',
			},

			{
				key: 25,
				title: '自付比例',
				dataIndex: 'selfPercent',
				align: "center",
				width: '100',
			},
			{
				key: 26,
				title: '门诊自付比例',
				dataIndex: 'outSelfPercent',
				align: "center",
				width: '100',
			},
			{
				key: 27,
				title: '住院自付比例',
				dataIndex: 'hosSelfPercent',
				align: "center",
				width: '100',
			},

			{
				key: 20,
				title: '处方药标志',
				dataIndex: 'prescriptionLogoDesc',
				align: "center",
				width: '100',
			},
			{
				key: 21,
				title: '加收项目标识',
				dataIndex: 'additionalSign',
				align: "center",
				width: '100',
			},
			{
				key: 22,
				title: '项目内涵',
				dataIndex: 'projectConnotation',
				align: "center",
				width: '100',
			},
			{
				key: 23,
				title: '除外内容',
				dataIndex: 'exceptions',
				align: "center",
				width: '100',
			},
			{
				title: '操作',
				key: 24,
				align: "center",
				width: '250',
				render: (text, record) => (
					<span>
						<Icon type="edit" style={{ color: '#108EE9' }}></Icon>
						<span className='span' onClick={() => this.handleCompile(record)}>编辑</span>
						<Divider type="vertical" />
						<Popconfirm title="删除不可恢复，确定要删除吗？" onConfirm={this.handleDelete.bind(this, record)}>
                			<span className="span" style={{ color: 'rgba(240,65,52,1)' }}>删除</span>
              			</Popconfirm>
					</span>
				),
			}
		]
	}
	componentDidMount() {
		this.handleQuery();
		this.getAdmReasonData();
	}
	componentWillUnmount() {
		// 组件销毁前将静止让setState修改state的状态
		this.setState = (state, callback) => { return; }
	}

	handleQuery = () => {
		let { page, pageSize } = this.state;
		let data = {
			params: [{
				insuCode: this.state.insuCode,
				insuDesc: this.state.insuDesc,
				admReason:this.state.admReason
			}],
			pagination: [{
				pageSize: pageSize,
				currentPage: page,
			}]
		};
		$http.post('urlADS', this, {
			code: "05100292",
			data: data,
			success: function (res) {
				let errorCode = res.errorCode;
				if (errorCode === '0') {
					this.setState({ tableData: res.result.Data, total: res.total })
				}else{
					this.setState({ tableData: [], total: 0 })
				}
			}
		});
	}
	// 提供修改page和pageSize的回调函数
	compilePage(page, pageSize) {
		// 修改page，或者pageSize
		this.setState({ page: page, pageSize: pageSize }, () => {
			// 重新调用查询方法
			this.handleQuery();
		})
	}
	// 查询条件 --- 项目代码
	onChangeCode = (e) => {
		this.setState({ insuCode: e.target.value })
	}

	// 查询条件 --- 项目描述
	onChangeDescripts = (e) => {
		this.setState({ insuDesc: e.target.value })
	}

	// 重置信息
    resetConfigInfo() {
        this.setState({ configInfo: {} })
	}

	// 编辑信息
	handleCompile = (record) => {
		// 打开抽屉
		this.child.showDrawer();
		// 初始化数据
		this.setState({ configInfo: record, flag: 'edit', title: '编辑' })
	}
	// 删除信息
	handleDelete = (record) => {
		let user = window.sessionStorage.userData ? JSON.parse(window.sessionStorage.userData) : {};
		let data = {
			"params": [{
				userID: user.userID,
				ID: record.ID,
			}]
		};
		$http.post('urlADS', this, {
			code: "05100294",
			data: data,
			success: function (res) {
				let errorCode = res.errorCode;
				if (errorCode === '0') {
					message.success("删除成功!");
					this.handleQuery();
				}
			}
		});

	}
	//新增配置
	handleAdd = () => {
		// 打开抽屉
		this.child.showDrawer();
		// 初始化数据
		this.setState({ flag: 'add', title: '新增' })
	}
	componentWillUnmount() {
		// 组件销毁前将静止让setState修改state的状态
		this.setState = (state, callback) => { return; }
	}
	// 调用公共组件的连接事件
	onRef = (ref) => {
		this.child = ref
	}

	onChange(e, pageSize) {
		this.setState({ page: e, pageSize: pageSize }, () => {
			this.handleQuery();
		});
	}

	//分页切换
	changePageSize(page, pageSize) {
		this.setState({ pageSize: pageSize, page: page }, () => {
			this.handleQuery(user.hospID);
		});
	}

	onColumnRef = (ref) => {
		this.columnRef = ref;
	}

	//结算类型
	getAdmReasonData = () => {
		var data = {
			params: [{
				hospID: JSON.parse(window.sessionStorage.userData).hospID, //医院id
			}]
		}
		$http.post("urlS", this, {
			code: '05100129',
			data: data,
			success: function (res) {
				if (+res.errorCode === 0 && res.data) {
					for (var i = 0; i < res.data.length; i++) {
						this.state.admReasonArr.push(<Option value={String(res.data[i].code)} key={i + "A"}>{res.data[i].descripts}</Option>)
					}
					this.setState({ admReasonArr: this.state.admReasonArr })
				}
			},
			error: function (err) {
				this.setState({ errMsg: this.state.languageCode === "CN" ? "数据加载失败，请重试！" : 'Data loading failed, please try again' })
			}
		})
	}

	changeAdmReasonData = (option)=>{
		if (option===undefined || option===""){
			this.setState({admReason:""})
		}else {
			this.setState({admReason:option.props.value})
		}
	};

	render() {
		// 组件所需参数
		const param = {
			// 表头配置
			columns: this.columns,
			// 表格数据
			data: this.state.tableData,
			// 数据总条数
			total: this.state.total,
			// 数据页数
			page: this.state.page,
			// 表格的宽度
			x: 900
		}
		return (
			<div className="MedicalInsuranceDirectory" style={{ width: '100%', height: '100%', overflow: 'hidden' }}>
				<ColumnAuthoritysModel
					clientWidth='800px'
					compontName="MedicalInsuranceDirectory"
					configType="C"
					onRef={this.onColumnRef}
					reloadData={this.getDetailTableColumns}
				/>
				<div className="table-operations">
					<Row style={{ minHeight: '80px', padding: '0 24px 24px 24px' }}>
						<Col span={20}>
							社保目录编码：<Input allowClear={true} onPressEnter={this.handleQuery} value={this.state.insuCode} onChange={this.onChangeCode} placeholder="社保目录编码(Enter)" style={{ width: '160px', margin: '23px 15px 0 0' }} />
							社保目录名称：<Input allowClear={true} onPressEnter={this.handleQuery} value={this.state.insuDesc} onChange={this.onChangeDescripts} placeholder="社保目录名称(Enter)" style={{ width: '160px', margin: '23px 15px 0 0' }} />
							费别：<Select placeholder="请选择费别" allowClear style={{ width: '160px', margin: '23px 15px 0 0' }}
										onChange={(value, option) => this.changeAdmReasonData(option)}
										onClear={()=>{this.changeAdmReasonData()}}>
							{this.state.admReasonArr}
						</Select>
							<Button onClick={this.handleQuery} style={{ margin: '23px 15px 0 0', background: 'rgba(255,255,255,1)' }}>查询</Button>
						</Col>
						<Col span={4} style={{ textAlign: 'right' }}>
							<Button icon="plus" onClick={this.handleAdd} style={{ background: 'rgba(247,128,93,1)', color: '#fff', margin: '23px 15px 0 0' }}>新增目录</Button>
						</Col>
					</Row>
				</div>
				<div style={{ widht: '100%', height: '10px', background: '#f0f2f5' }}></div>
				<div className="operationLeave" style={{ float: "left", width: '100%', height: "100%" }}>
					<div style={{ width: '100%', height: 'calc(100% - 127px)', overflow: 'hidden' }} >
						<Table
							style={{ width: '100%', "padding": "5px", height: "100%", border: '7px soild #eeeeee' }}
							dataSource={this.state.tableData}
							columns={this.columns}
							onHeaderRow={column => {
								return {
									onDoubleClick: () => {
										this.columnRef.onOpenModel();
									},
								};
							}}
							bordered={true}
							pagination={false}
							scroll={{ x: (this.columns && this.state.length > 0 ? widthTotal : 2900), y: 550 }}
							//scroll={{ y: store.getState().tableHeight.y + 'px', x: this.state.tableWidth }}
						/>
					</div>
					<div style={{ width: '100%', height: '45px', overflow: 'hidden' }}>
						<CommonPagination
							size='small'
							current={this.state.page}
							total={this.state.total}
							search='search'
							onShowSizeChange={this.changePageSize.bind(this)}
							complete={true}
							dataSource={this.state.tableData}
							onChange={this.onChange.bind(this)}
							scroll={{ y: store.getState().tableHeight.y + 'px' }}
						/>
					</div>
				</div>
				<AddMedicalInsuranceDirectory onRef={this.onRef} handelThis={this} configInfo={this.state.configInfo} hospID={this.state.hospID} flag={this.state.flag} title={this.state.title} />
			</div>

		);
	}
}

export default MedicalInsuranceDirectory;
