class AdvertAdd extends Component {
    constructor(props) {
        super(props);

        this.state = {
            carProducerValue: '',
            carModelValue: '',
            fuelTypeValue: '',
            shortDescriptionValue: '',
            descriptionValue: '',
            equipmentValue: [],
            phoneNumberValue: '',
            yearProductionValue: ''
        }
    }






    onClickSubmit() {

        this.sendAdvert();
    }
    async sendAdvert() {
        const ob = {
            ShortDescription: this.state.shortDescriptionValue,
            Description: this.state.descriptionValue,
            PhoneNumber: this.state.phoneNumberValue,
            Equipment: this.state.equipmentValue,
            CarProducer: this.state.carProducerValue,
            CarModel: this.state.carModelValue,
            Fuel: this.state.fuelTypeValue,
            Year: this.state.yearProductionValue

        };
        console.log(ob);
        /*   await fetch("https://localhost:44394/api/CarOffer", {
                   method: "post",
                   headers: {
                       "Content-type": "application/json; charset=UTF-8"
                   },
                   body: JSON.stringify(ob)
               })
               .then(res => res.json())
               .then(res => {

                   console.log(res);
               })*/

    }

    onChangeEquipment(state,e) {

        if (e.target.checked == true) {

            state.equipmentValue = state.equipmentValue.filter(name => !name.includes(e.target.id));
            state.equipmentValue.push(e.target.id);
        }
        else
            state.equipmentValue = state.equipmentValue.filter(name => !name.includes(e.target.id));

    }

    //to przekazuje
    onChangeProducer = (carProducerValue) => {
        this.state.carProducerValue = carProducerValue;

    }
    async componentDidMount() {


    }
    shouldComponentUpdate(nextProps, nextState) {

      //  console.log( nextProps.carModelValue +" "+ this.state.carModelValue )
        return  nextProps.carModelValue != this.state.carModelValue;
        return false;
    }
    onChangeCarModel = (carModelValue) => {
        this.setState({
            carModelValue
        })
      //  this.state.carModelValue = carModelValue;
    }
    onChangeFuelType = (fuelTypeValue) => {
        this.setState({
            fuelTypeValue
        })
    }
    onChangeShortDescription = (shortDescriptionValue) => {
        this.setState({
            shortDescriptionValue
        })
    }
    onChangePhoneNumber = (phoneNumberValue ) => {
        this.setState({
            phoneNumberValue
        })
    }
    onChangeEquipment = (equipmentValue ) => {
        this.setState({
            equipmentValue
        })
    }
    onChangeYearProduction = (yearProductionValue) =>{
        console.log(111+yearProductionValue)
        this.setState({
            yearProductionValue
        })
    }
    render() {
        let optionItems;
        if (this.props.carModel.length > 0) {
            optionItems = this.props.carModel.map((x) =>
                <option key={x.idString} value={x.idString}>{x.modelName}</option>
            );
        }
        return (
            <div>
                carProducentAd
                <div>
                    <MainInformationContainer

                        onChangeProducer={this.onChangeProducer}
                        onChangeCarModel={this.onChangeCarModel}
                        onChangeFuelType={this.onChangeFuelType}
                        onChangeShortDescription={this.onChangeShortDescription}
                        onChangePhoneNumber={this.onChangePhoneNumber}
                        onChangeYearProduction={this.onChangeYearProduction}
                        state={this.state}
                    />
                    <EquipmentContainer
                        state={this.state}
                        onChangeEquipment={this.onChangeEquipment}
                    />
                    <div>
                        Opis:
                        <div>
                            <textarea id="description" onChange={x => this.state.descriptionValue = x.target.value} maxLength="4096" ></textarea>
                        </div>
                    </div>

                    <input type="button" value="wyślij" onClick={this.onClickSubmit.bind(this)} />
                </div>
            </div>
        )
    }

}
export default AdvertAdd;