import React, { Component } from 'react';
import { getControl } from 'zorod/components/Zform/controls';
import { ZsearchListHOC } from 'zorod';
import api from '@/Api';
import { Card, Form, Input, Button, message, DatePicker, Checkbox, Select,Cascader} from 'antd';

const FormItem=Form.Item;
const TextArea=Input.TextArea;

const formItemLayout = {
    labelCol: { span: 4 },
    wrapperCol: { span: 12 },
  };
  const formTailLayout = {
    labelCol: { span: 4 },
    wrapperCol: { span: 12, offset: 4 },
  };
  const formButtom={
    wrapperCol: { span: 12, offset: 6 }
  }
const residences=["baijing","hunian","guangxi"];

class EcTashAdd extends Component {
    constructor(props) {
        super(props);
        this.state = {  }
    }

    //表单提交
    handelsubmit=()=>{
        let userInfo=this.props.form.getFieldsValue;
        this.props.form.validateFields((err,values)=>{
              if(!err){
                  console.log(values);
                  EcData.push(values);
                message.success(`${userInfo.DATATBASE_NAME} 添加成功!!!`);
              }
        });
    }


    //取消
    handelConcel=()=>{

    }

    //打开数据增量类型
    handleOpenDataAddType=()=>{
     

      
    }

    render() { 
        const { getFieldDecorator, getFieldsError, getFieldError, isFieldTouched } = this.props.form;
        return ( 
            <div>
              <div>
    <Card title="任务配置">
      <Form >
      <FormItem label="任务名称" {...formItemLayout}>            
            {getFieldDecorator('TASK_NAME', {
            rules: [
              {
                required: true,
                message: '请输入任务名称',
              },
            ],
          })(<Input placeholder="请输入任务名称" />)}
          </FormItem>
      <FormItem label="任务类型" {...formItemLayout}>
          {getFieldDecorator('TASK_TYPE', {
              initialValue: ['db'],
            rules: [
              { required: true, message: '请选择任务类型' },
            ],
          })(<Select>
               <option value="db">数据库对接</option>
              <option value="shell">脚本</option>
          </Select>)}
          </FormItem>

          <FormItem label="任务启动时间" {...formItemLayout}>            
            {getFieldDecorator('RUN_TIME', {
            rules: [
              {
                required: false
              },
            ],
          })(<DatePicker 
               showTime={{format:'MM-DD HH:mm'}}
               format="MM-DD HH:mm"></DatePicker>)}
          </FormItem>

          

          <FormItem label="周期" {...formItemLayout}>
          {getFieldDecorator('ADD_PERIOD', {
              initialValue: ['day'],
            rules: [
              { required: true, message: '请选择周期' },
            ],
          })(<Select>
               <option value="day">天</option>
               <option value="week">周</option>
               <option value="month">月</option>
          </Select>)}
          </FormItem>

          <FormItem label="同步任务路径" {...formItemLayout}>            
            {getFieldDecorator('SYNCHRO_SCRIPT_PATH', {
            rules: [
              {
                required: false,
                message: '请输入同步任务路径',
              },
            ],
          })(<Input placeholder="请输入同步任务路径" />)}
          </FormItem>

          <FormItem label="脚本所在服务器IP" {...formItemLayout}>            
            {getFieldDecorator('SYNCHRO_SCRIPT_IP', {
            rules: [
              {
                required: false,
                message: '请输入脚本所在服务器IP',
              },
            ],
          })(<Input placeholder="请输入脚本所在服务器IP" />)}
          </FormItem>

          

          <FormItem label="同步表名称" {...formItemLayout}>            
            {getFieldDecorator('TABLE_NAME', {
            rules: [
              {
                required: this.state.checkNick,
                message: '请输入同步表名称',
              },
            ],
          })(<Input placeholder="请输入同步表名称" />)}
          </FormItem>

          <FormItem label="数据新增类型" {...formItemLayout}>            
          {getFieldDecorator('DATA_ADD_TYPE', {
              initialValue: ['1'],
            rules: [
              { required: true, message: '请选择类型' },
            ],
          })(<Select>
               <option value="1">全量</option>
              <option value="2">增量</option>
          </Select>)}
          </FormItem>

          
          
          <FormItem  {...formButtom}>            
               <Button type="primary" onClick={this.handelsubmit}>保存</Button>&nbsp;&nbsp;&nbsp;&nbsp;
               <Button  onClick={this.handelConcel}>取消</Button>
          </FormItem>

      </Form>
    </Card>
  </div>
            </div>
         );
    }
    
}
export default Form.create({ name: 'EcTashAdd' })(EcTashAdd);
//export default EcTashAdd;