import React, { Component } from 'react';
import { getControl } from 'zorod/components/Zform/controls';
import { ZsearchListHOC } from 'zorod';
import api from '../Api';
import { Row, Col, Card, Form, Input, Button, message, Icon, Checkbox, Select, Cascader, Table, Popconfirm, Divider,Switch  } from 'antd';
import DataDesenMonitorPop from '../popComponents/DataDesenMonitorPop';
import DataDesenexaminePop from '../popComponents/DataDesenexaminePop';


import { hashHistory} from 'react-router';
import { getProcessEnv } from 'zorod/components/zTool';
const { baserouter } = getProcessEnv();
const FormItem=Form.Item;
const TextArea=Input.TextArea;


class ecDesensitizationMonitor extends Component {
	constructor(props) {
		
			super(props);
			this.onchange=this.onchange.bind(this);
			this.state = {
				dataSource: [],
				batchNameList: [],
				selectInitialValue: '',
				selectedRowKeys: [], // Check here to configure the default column
				loading: false,
				popShow: true,
				popShow2:false,
				popMode: '',
				popData: {},
				setMode: '',
				pagination: {},
				searchValues: {"DATABASE_TYPE": "0"},
				dataSource3:[]
		
			}
	}

	// 页面加载函数
	componentDidMount() {
		api.system.getTestLists(1, 10, this.state.searchValues).then(res => {
			console.log(this.state.searchValues)
			console.log(res)
			const pagination = { ...this.state.pagination }
			pagination.current = 1
			pagination.total = res.data.total
			this.setState({
				dataSource: res.data.list,
				pagination
			})
		})
		api.system.getBatchLists(1, 999, {'MODULE_TYPE': 5}).then(res => {
			console.log(res)
			const batchNameList = []
			for (let data of res.data.list) {
				batchNameList.push({name: data.BATCH_NAME, id: data.BATCH_ID})
			}
			batchNameList.unshift({name: '全部', id: '-1'})
			this.setState({
				batchNameList,
				selectInitialValue: batchNameList[0].id
			})
		})
	}
	//表单提交
	handelsubmit=()=>{
			let userInfo=this.props.form.getFieldsValue
			this.props.form.validateFields((err,values)=>{
						if(!err){
							console.log(values)
							message.success(`添加成功!!!`)
						}
			})
	}
	//取消
	handelConcel=()=>{
		this.setState({
			popShow: false,
			popShow2: false
		})
	}
	// 关闭弹窗
	closePop = () => {
		this.setState({
			popShow: true,
			popShow2: false
		})
	}
	// 打开新增弹窗
	sourceAdd = () => {
		this.setState({
			popShow: false,
			popMode: '新增任务',
			setMode: 'add',
			popData: {},
			detailMode: true
		})
		api.system.odsTableList().then(res => {
			console.log(res.data)
			this.setState({
				dataSource3: res.data
				
			})
		})
	}
	// 打开更新弹窗
	sourceSet = (key) => {
		api.system.getSingleTest(key).then(res => {
			console.log(res)
			this.setState({
				popShow: false,
				popMode: '修改任务',
				setMode: 'update',
				popData: res.data,
				detailMode: true
			})
		})
		api.system.odsTableList().then(res => {
			console.log(res.data)
			this.setState({
				dataSource3: res.data
				
			})
		})
	}
	// 打开审核弹窗
	sourceExamine = (key) => {
		api.system.getSingleTest(key).then(res => {
			console.log(res)
			this.setState({
				popShow2: true,
				popMode: '审核',
				setMode: 'Examine',
				popData: res.data,
				detailMode: true
			})
		})
		api.system.odsTableList().then(res => {
			console.log(res.data)
			this.setState({
				dataSource3: res.data
				
			})
		})
	}
	// 打开详情窗口
	sourceDetailSet = (key) => {
		api.system.getSingleTest(key).then(res => {
			console.log(res)
			this.setState({
				popShow: false,
				popMode: '详情',
				setMode: '',
				popData: res.data,
				detailMode: false
			})
		})
		api.system.odsTableList().then(res => {
			console.log(res.data)
			this.setState({
				dataSource3: res.data
				
			})
		})
	}
	//审核一条数据
	examineDataSource = (data) => {
		api.system.Examine(data).then(res => {
			console.log(res.data)
			this.setState({
				popShow2: false
			})
			api.system.getTestLists(1, 10, {'desenTaskId': res.data}).then(res => {
				const pagination = { ...this.state.pagination }
				pagination.current = 1
				pagination.total = res.data.total
				
				this.setState({
					dataSource: res.data.list,
					pagination
				})
			})
		})
	}
	// 新增一条数据
	addDataSource = (data) => {

		api.system.addTest(data).then(res => {
			console.log(res.data)
			this.setState({
				popShow: true
			})
			api.system.getTestLists(1, 10, {'desenTaskId': res.data}).then(res => {
				const pagination = { ...this.state.pagination }
				pagination.current = 1
				pagination.total = res.data.total
				
				this.setState({
					dataSource: res.data.list,
					pagination
				})
			})
		})
	}
	// 修改一条数据
	updateDataSource = (data) => {
		api.system.updateTest(data).then(res => {
			console.log(res)
			this.setState({
				popShow: true
			})
			api.system.odsTableList().then(res => {
				console.log(res.data)
				this.setState({
					dataSource3: res.data
					
				})
			})
			api.system.getTestLists(1, 10, this.state.searchValues).then(res => {
				const pagination = { ...this.state.pagination }
				pagination.current = 1
				pagination.total = res.data.total
				
				this.setState({
					dataSource: res.data.list,
					pagination
				})
			})
		})
	}
	// 删除一条数据
	deleteDataSource = (key) => {
		api.system.deleteTest(key).then(res => {
			console.log(res)
			api.system.getTestLists(1, 10, this.state.searchValues).then(res => {
				const pagination = { ...this.state.pagination }
				pagination.current = 1
				pagination.total = res.data.total
				
				this.setState({
					dataSource: res.data.list,
					pagination
				})
			})
		})
	}
	// 搜索
	search = () => {
		this.props.form.validateFields((err, values)=>{
			// values = JSON.stringify(values)
			console.log(values)
			this.setState({
				searchValues: values
			})
			api.system.getTestLists(1, 10, values).then(res => {
				const pagination = { ...this.state.pagination }
				pagination.current = 1
				pagination.total = res.data.total
				
				this.setState({
					dataSource: res.data.list,
					pagination
				})
			})
		})
	}
	// reload选项
	start = () => {
		this.setState({ loading: true })
		// ajax request after empty completing
		setTimeout(() => {
			this.setState({
				selectedRowKeys: [],
				loading: false,
			})
		}, 1000)
	}
	
	
	// 点击选择一行
  onSelectChange = selectedRowKeys => {
    console.log('selectedRowKeys changed: ', selectedRowKeys)
    this.setState({ selectedRowKeys })
  }
 
	// 点击翻页
	handleTableChange = pagination => {
		const pager = { ...this.state.pagination }
		pager.current = pagination.current
		this.setState({
			pagination: pager,
		})
		api.system.getTestLists( pagination.current, pagination.pageSize, this.state.searchValues).then(res => {
			const pagination = { ...this.state.pagination }
			
			this.setState({
				dataSource: res.data.list,
        pagination
			})
		})
	}
	//启停
	onchange = (val,id,status) =>{
		
		api.system.examine(val,id,status).then(res => {
			console.log(res)
		})
	
		setTimeout(()=>{
			
		api.system.getTestLists(1, 10,  {'aa': 'res'}).then(res => {
			console.log(res)
			
			this.setState({
				dataSource: res.data.list,
				
			})
		})
	},100)
		
	}

	render() { 
		const { getFieldDecorator, getFieldsError, getFieldError, isFieldTouched } = this.props.form
		const { batchNameList, selectInitialValue } = this.state
		
		const formItemLayout = {
		    labelCol: { span: 8 },
		    wrapperCol: { span: 16 },
		  }
		const buttonItemLayout = {
						wrapperCol: { span: 14, offset: 4 },
					}
		const formTailLayout = {
			labelCol: { span: 12 },
			wrapperCol: { span: 12 },
		}
		const formButtom={
			wrapperCol: { span: 12, offset: 6 }
		}
		const columns = [
			{
				title: '任务组',
				dataIndex: 'executeStatusDo.BATCH_NAME',
				key: 'executeStatusDo.BATCH_NAME',
				
			},
			{
				title: '任务名称',
				dataIndex: 'taskName',
				key: 'taskName',
				
			},
			{
				title: '脱敏表',
				dataIndex: 'odsTable.TABLE_NAME_CN',
				key: 'odsTable.TABLE_NAME_CN'
			},
			// {
			// 	title: '运行状态',
			// 	dataIndex: 'status',
			// 	key: 'status',
			// 	render (status) {
			// 		let config = {
			// 			'0': '未运行',
			// 			'1': '正运行',
			// 			'2': '已完成'
			// 		}
			// 		return config[status]
			// 	}
			// },
			// {
			// 	title: '结果状态',
			// 	dataIndex: 'result',
			// 	key: 'result',
			// 	render (result) {
			// 		let config = {
			// 			'0': '未有结果',
			// 			'1': '正常',
			// 			'2': '有错误',
			// 			'3':'有严重错误'
			// 		}
			// 		return config[result]
			// 	}
			// },
			{
				title: '审核',
				dataIndex: 'verify',
				key: 'verify',
				render (verify) {
					let config = {
						'1': '已审核',
						'2': '未审核',
						
					}
					return config[verify]
				}
				
			},
			{
				title: '启/停',
				dataIndex: '',
				key: '',
				render: (val, record) => (
					<div>						
						<Switch defaultChecked={record.status == '1'?true:false}  style={record.status == '2'?{display:"none"}:{}}  onChange={(value)=>{this.onchange(value,record.id,record.status)}}   />
					</div>
				)
			},
			{
				title: '操作',
				key: 'actions',
				width:"35%",
				render: (text, record) => (
					<div>
						<Button icon='eye' type='default' size='small' onClick={()=>{this.props.history.push((baserouter!=="/"?baserouter:"")+'/main/ecBaseDataSet/ecDataDesensitization/ecDesensitizationTable?desenTaskId='+record.desenTaskId)}}>
						字段任务
						</Button><Divider type="vertical" />
						<Button icon='edit' type='primary' size='small' onClick={() => this.sourceExamine(record.id)}>审核</Button><Divider type="vertical" />
						<Button icon='edit' type='primary' size='small' onClick={() => this.sourceSet(record.id)}>修改</Button><Divider type="vertical" />
						<Popconfirm placement="topLeft" title='是否确认删除？' onConfirm={() => this.deleteDataSource(record.id)} okText="确认" cancelText="取消">
							<Button icon='delete' type='danger' size='small'>删除</Button>
						</Popconfirm><Divider type="vertical" />
						<Button icon='eye' type='default' size='small' onClick={() => this.sourceDetailSet(record.id)}>详情</Button>
					</div>
				)
			}
		]
    const { loading, selectedRowKeys } = this.state
    const rowSelection = {
      selectedRowKeys,
      onChange: this.onSelectChange,
    }
    const hasSelected = selectedRowKeys.length > 0
		return ( 
			<div>
				<div>
					<Card title="脱敏任务监控" extra={<div>
						<Button icon='plus' type='primary' onClick={this.sourceAdd}>新增</Button>
					</div>}>
						<FormItem label="任务组" {...formItemLayout}
							style={{ display: 'inline-block', width: 'calc( 30% - 12px )' }}
						>
							{
								getFieldDecorator('batchId', {
									initialValue: '-1',
									rules: [
										{
											required: false,
											message: '请输入批次名',
										},
									],
								})
								(<Select
									style={{ width: '150px' }}
									showSearch
									optionFilterProp="children"
									filterOption={(input, option) =>
										option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
									}
								>
									{batchNameList.map((data) => (
										<option value={data.id}>{data.name}</option>
									))}
								</Select>)
							}
						</FormItem>
						
						<FormItem label="运行状态" {...formItemLayout}
							style={{ display: 'inline-block', width: 'calc( 30% - 12px )' }}
						>
							{getFieldDecorator('status', {
								initialValue: '-1',
								rules: [
									{
										required: false,
										message: '请输入运行状态',
									},
								],
							})(<Select style={{ width: 100 }}>
								<option value="-1">全部</option>
								<option value="0">未运行</option>
								<option value="1">正运行</option>
								<option value="2">已完成</option>
							</Select>)}
						</FormItem>
						<FormItem label="运行结果" {...formItemLayout}
							style={{ display: 'inline-block', width: 'calc( 30% - 12px )' }}
						>
							{getFieldDecorator('result', {
								initialValue: '-1',
								rules: [
									{
										required: false,
										message: '请输入运行结果',
									},
								],
							})(<Select style={{ width: 100 }}>
								<option value="-1">全部</option>
								<option value="0">未有结果</option>
								<option value="1">正常</option>
								<option value="2">不正常</option>
								<option value="3">严重不正常</option>
							</Select>)}
						</FormItem>
						<FormItem
							style={{ display: 'inline-block', width: 'calc(10% - 12px)' }}
						>
							<Button icon='search' onClick={this.search} type='primary'>搜索</Button>
						</FormItem>
						<Button type="primary" onClick={this.start} disabled={!hasSelected} loading={loading}>
							重置选择
						</Button>
						<span style={{ marginLeft: 8 }}>
							{hasSelected ? `Selected ${selectedRowKeys.length} items` : ''}
						</span>
						<Table
							rowSelection={rowSelection}
							pagination={this.state.pagination}
							loading={this.state.loading}
							onChange={this.handleTableChange}
							columns={columns}
							dataSource={this.state.dataSource}
						></Table>
					</Card>
					{!this.state.popShow &&
						<DataDesenMonitorPop
							title={this.state.popMode}
							onPopClose={this.closePop}
							onAdd={this.addDataSource}
							onUpdate={this.updateDataSource}
							data={this.state.popData}
							setMode={this.state.setMode}
							detailMode={this.state.detailMode}
							dataSource3={this.state.dataSource3}
						></DataDesenMonitorPop>
					}
					{this.state.popShow2 &&
						<DataDesenexaminePop
							title={this.state.popMode}
							onPopClose={this.closePop}							
							onExamine={this.examineDataSource}
							data={this.state.popData}
							setMode={this.state.setMode}
							detailMode={this.state.detailMode}
							dataSource={this.state.dataSource}
						></DataDesenexaminePop>
					}
				</div>
			</div>
		)
	}
}
export default Form.create({ name: 'ecDesensitizationMonitor' })(ecDesensitizationMonitor);
//export default EcTashAdd;