import React from 'react';
import { Form, Input, Button, Select,Card, Row, Col, DatePicker } from 'antd';
import { AlertMessages } from '@gtpl/shared-utils/alert-messages';
import {  Link, useHistory } from "react-router-dom";
import {RmPriceListService} from '@gtpl/shared-services/masters';
import './rm-price-list-form.css';
import { RmPriceListDto } from '@gtpl/shared-models/masters';

/* eslint-disable-next-line */
export interface RmPriceListFormProps {
  rmPriceListData: RmPriceListDto;
  updateRmPriceList:(rmPriceList:RmPriceListDto)=> void;
  isUpdate:boolean;
  closeForm: () => void;
}

export function RmPriceListForm(
  props: RmPriceListFormProps
) {
  const [form] = Form.useForm();
  let history = useHistory();
  const service = new RmPriceListService;

  const create = (Data: RmPriceListDto) => {
    
    service.create(Data).then(res => {
   if (res.status) {
     AlertMessages.getSuccessMessage('Created Successfully');
         
     history.push("/rm-price-list-view")
     onReset();
   } else {
     if (res.intlCode) {
       AlertMessages.getErrorMessage(res.internalMessage);
     } else {
       AlertMessages.getErrorMessage(res.internalMessage);
     }
   }
 }).catch(err => {
   AlertMessages.getErrorMessage(err.message);
 })
}
  const saveData = (values: RmPriceListDto) => {
    // console.log(values);
    if(props.isUpdate){
      props.updateRmPriceList(values);
    }else{
      create(values);
      // console.log('test')
    }
  
  };

  const onReset = () => {
    form.resetFields();
  };


  return (
    <Card title={<span style={{color:'white'}}>Rm Price List</span>}
    style={{textAlign:'center'}} headStyle={{backgroundColor: '#69c0ff', border: 0 }} extra={<Link to='/rm-Price-List-view' ><span style={{color:'white'}} >  {(props.isUpdate===false) &&
      <Button className='panel_button' >View </Button>
       }  </span></Link>} >


      <Form form={form} initialValues={props.rmPriceListData} name="control-hooks" onFinish={saveData}
      layout="vertical"
      > 

      <Form.Item name="rmPriceListId" style={{display:"none"}} >
        <Input hidden/>
      </Form.Item>
      <Form.Item style={{display:"none"}} name="createdUser"  initialValue={props.rmPriceListData}>
      <Input hidden/>
    </Form.Item>
    <Row>
        <Col xs={{span:24}} sm={{span:24}} md={{span:5,offset:1}} lg={{span:5,offset:1}} xl={{span:6,offset:1}} style={{margin:'1%'}}>
              <Form.Item
                  name="date"
                  label="Date"
                  rules={[{ required: true }]} >
                  <DatePicker showToday style={{width:'100%'}} format="YYYY-MM-DD"/> 
                 
                </Form.Item>
        </Col>
       
      
        <Col xs={{span:24}} sm={{span:24}} md={{span:5,offset:1}} lg={{span:5,offset:1}} xl={{span:5,offset:1}} style={{margin:'1%'}} >
            <Form.Item
                name="minCount"
                label="Min Count"
                rules={[
                  {
                    required: true,
                   
                    message: 'Min Count is mandatory, enter a correct value'

                  },
                  {
                    pattern: /^[^-\s\\a-zA-Z\[\]()*!@#$^&_\-+/%=`~{}:";'<>,.?|][Z0-9.\s]*$/,
                    message: `Invalid Min Count`
                  }
                ]}>
                  <Input/>
                
              </Form.Item>
              </Col>

              <Col xs={{span:24}} sm={{span:24}} md={{span:5,offset:1}} lg={{span:5,offset:1}} xl={{span:5,offset:1}} style={{margin:'1%'}} >
            <Form.Item
                name="maxCount"
                label="Max Count"
                rules={[
                  {
                    required: true,
                   
                    message: 'Max Count is mandatory, enter a correct value'

                  },
                  {
                    pattern: /^[^-\s\\a-zA-Z\[\]()*!@#$^&_\-+/%=`~{}:";'<>,.?|][Z0-9.\s]*$/,
                    message: `Invalid Max Count`
                  }
                ]}>
                  <Input/>
                
              </Form.Item>
              </Col>
           
 
           
              
       
              <Col xs={{span:24}} sm={{span:24}} md={{span:5,offset:1}} lg={{span:5,offset:1}} xl={{span:5,offset:1}} style={{margin:'1%'}} >
            <Form.Item
                name="price"
                label="Price"
                rules={[
                  {
                    required: true,
                   
                    message: 'Price is mandatory, enter a correct value'
 
                  },
                  {
                    pattern: /^[^-\s\\a-zA-Z\[\]()*!@#$^&_\-+/%=`~{}:";'<>,.?|][Z0-9.\s]*$/,
                    message: `Invalid Price`
                  }
                ]}>
                   <Input/>
              </Form.Item>
              </Col>
              
        
              
        </Row>
        <Row>
        <Col span={24} style={{ textAlign: 'right' }}>
          
            <Button type="primary" htmlType="submit" >
              Submit
            </Button>
            {(props.isUpdate!==true) &&
     <Button htmlType="button" style={{ margin: '0 14px' }} onClick={onReset}>
        Reset
      </Button>
      }
            </Col>
          </Row>
      </Form>
    </Card>
  );
}

export default RmPriceListForm;