import React, { useEffect, useState } from 'react';
import { Card, Form, Input, Row, Col, Button, Table, Tooltip, Popconfirm, message } from 'antd';
import {FreightsCompanyRequest} from '../../../../../../shared-models/masters/src/lib/freights-company'
import {FreightsCompanytService} from '../../../../../../shared-services/masters/src/lib/freights-company-service'
import { DestinationDto } from '@gtpl/shared-models/masters';
import { AlertMessages } from '@gtpl/shared-utils/alert-messages';
import {  Link,useHistory } from "react-router-dom";

/* eslint-disable-next-line */
export interface FreightsCompanyProps {
  ferightsCompanyData: FreightsCompanyRequest;
  updateDetails: (data:FreightsCompanyRequest)=>void
        isUpdate:boolean;
        closeForm:()=>void;
}

export function FreightsCompanyForm(
  props: FreightsCompanyProps
) {
  const [form] = Form.useForm();
  const [disable, setDisable] = useState<boolean>(false)

  const service = new FreightsCompanytService();
  let createdUser="";

let history = useHistory();

  console.log(props.updateDetails,'==========')

  const save = (val: FreightsCompanyRequest) => {
    setDisable(true)
       service.createFreightCompany(val).then(res => {
        setDisable(false)
      if (res.status) {
        AlertMessages.getSuccessMessage(res.internalMessage);
       history.push("/freights-company-view")
        onReset();
      } else {
        if (res.intlCode) {
          AlertMessages.getErrorMessage(res.internalMessage);
        } else {
          AlertMessages.getErrorMessage(res.internalMessage);
        }
      }
    }).catch(err => {
      setDisable(false)
      AlertMessages.getErrorMessage(err.message);
    })
  }
  if(!props.isUpdate){
      createdUser= 'admin';
  }
  const saveData = (values: FreightsCompanyRequest) => {
    setDisable(false)
    // console.log(values);
    if(props.isUpdate){
      props.updateDetails(values);
    }else{
      setDisable(false)
      save(values);
    }
  
  };
  const onReset = () => {
    form.resetFields();
  };
 
  return (
   
    <Card size="small" title={<span style={{color:'white'}}>Freight Company</span>} style={{textAlign:'center'}} extra={props.isUpdate==true?"":<Link to='/freights-company-view' ><span style={{color:'white'}} ><Button className='panel_button' >View </Button> </span></Link>} headStyle={{backgroundColor: '#69c0ff', border: 0 }}>
    <br /><br />
    <Form form={form} onFinish={saveData} initialValues={props.ferightsCompanyData} >
      <Row gutter={24}>
        <Form.Item 
        name ="id" style={{display:"none"}} >
        <Input hidden/>
      </Form.Item>
        
        <Col xs={{span:24}} sm={{span:24}} md={{span:6}} lg={{span:6}} xl={{span:6}}>
        <Form.Item
          name="name"
          label="Name"         
          rules={[
            {
              required: true,
              message: 'Name is required'
            },      
            {
              pattern: /^[^-\s\\0-9\[\]()*!@#$^&_\-+/%=`~{}:";'<>,.?|][a-zA-Z ]*$/,
              message: `Should contain only alphabets`
            }
          ]}>
        
          <Input/>
        </Form.Item>
        </Col>
        <Col xs={{span:24}} sm={{span:24}} md={{span:6}} lg={{span:6}} xl={{span:6}}>
        <Form.Item
          name="code"
          label="Code"         
          rules={[
            {
              required: true,
              message: 'Code is required'
            },      
            {
              // pattern: /^[^-\s\\0-9\[\]()*!@#$^&_\-+/%=`~{}:";'<>,.?|][a-zA-Z ]*$/,
              message: `Should contain only alphabets`
            }
          ]}>
        
          <Input/>
        </Form.Item>
        </Col>
        <Col xs={{span:24}} sm={{span:24}} md={{span:6}} lg={{span:6}} xl={{span:6}}>
        <Form.Item
          name="linerAddress"
          label=" Liner Address"         
          rules={[
            {
              required: true,
              message: 'Address is required'
            },      
            
          ]}>
        
          <Input/>
        </Form.Item>
        </Col>
        </Row>
       
        <Row>
            <Col span={24} style={{ textAlign: 'right' }}>
        <Button type="primary" disabled={disable} htmlType="submit" >
            Submit
          </Button>
          {(props.isUpdate===false) &&
         <Button htmlType="button" style={{ margin: '0 14px' }} onClick={onReset}>
            Reset
          </Button>
          }
          </Col>
          </Row>
       </Form>
          </Card>
  );
}

export default FreightsCompanyForm;