import React, { Component } from 'react'
import { InputNumber, Button, Modal } from 'antd'

class RewardDialog extends Component {
	constructor(props) {
		super(props)

		this.handleGoldRewardDialogClose = this.handleGoldRewardDialogClose.bind(this)

		this.state = {
			goldRewardInput: '',
		}
	}

	showGoldRewardDialog(comment, childComment) {
		if (comment.admin === true) {
			this.comment = comment;
			this.childComment = childComment;
			this.setState({ goldRewardDialogOpen: true })
		}
	}

	handleGoldRewardDialogClose() {
		this.props.setRewardDialogVisible(false)
	}
	onGoldRewardDialogOkBtnClick() {
		console.log('onGoldRewardDialogOkBtnClick')
		const { goldRewardInput } = this.state;
		if (!goldRewardInput || goldRewardInput === '0' || goldRewardInput < 0) {
			this.props.showNotification('奖励金币不能为空或负数')
			return;
		} else {
			this.props.setRewardDialogVisible(false)
			this.props.rewardCode(goldRewardInput)
		}
	}
	onGoldRewardInputChange(value) {
		// || event.target.value
		const number = parseInt(value || 0, 10);
		if (Number.isNaN(number)) {
			return;
		}
		this.setState({ goldRewardInput: number, goldRewardInputError: false });
	}

	render() {
		const { goldRewardDialogOpen } = this.props;

		return (
			<Modal
				title="奖励设置"
				visible={goldRewardDialogOpen}
				onOk={this.onGoldRewardDialogOkBtnClick.bind(this)}
				onCancel={this.handleGoldRewardDialogClose}
			>
				<InputNumber placeholder="请输入奖励的金币数量" id="goldReward" type="number" value={this.state.goldRewardInput}
					onChange={(e) => this.onGoldRewardInputChange(e)} width={228} style={{ width: '228px' }} />
			</Modal>
		);
	}
}

export default RewardDialog;
