getId=(idname)=>{
    return document.getElementById(idname);
}

let lengthVeh = getId("length");
let widthVeh = getId("width");
let heightVeh = getId("height");
let lengthVehTwo = getId("lengthTwo");
let widthVehTwo = getId("widthTwo");
let heightVehTwo = getId("heightTwo");
let cftVeh = getId("cft");
let unitVeh = getId("unit");
let cftValue = 0;
let vehicleNo = getId("vehicleNo");
let addCft = getId("addCft");
let cftTbody = getId("cftTbody");
let chakka = getId("chakka");
let requiredValue = document.querySelectorAll(".required");
handleRequired=()=>{
    let validation = true;
    requiredValue.forEach((list)=>{
        if(list.value=="")
        {
           console.log(list); 
           list.classList.remove("required");
           list.classList.add("requiredvalue");
           validation = false;
        }
        else{
            list.classList.remove("requiredvalue");
            list.classList.add("required");
        }
     })
     return validation;
}
handleCalculation=()=>{
    cftValue= (Number(lengthVeh.value) + Number(lengthVehTwo.value/12))*(Number(widthVeh.value) + Number(widthVehTwo.value/12))*(Number(heightVeh.value) + Number(heightVehTwo.value/12));
    cftVeh.value=(cftValue).toFixed(2);
    unitVeh.value = (cftValue/100).toFixed(2);
}
lengthVeh.addEventListener("keyup",function(){
handleCalculation();
lengthVeh.classList.remove("requiredvalue");
});
widthVeh.addEventListener("keyup",function(){
handleCalculation();
widthVeh.classList.remove("requiredvalue");
});
 heightVeh.addEventListener("keyup",function(){
handleCalculation();
heightVeh.classList.remove("requiredvalue");
 });
 lengthVehTwo.addEventListener("keyup",function(){
    handleCalculation();
    lengthVehTwo.classList.remove("requiredvalue");
    });
    widthVehTwo.addEventListener("keyup",function(){
    handleCalculation();
    widthVehTwo.classList.remove("requiredvalue");
    });
     heightVehTwo.addEventListener("keyup",function(){
    handleCalculation();
    heightVehTwo.classList.remove("requiredvalue");
     });
vehicleNo.addEventListener("keyup",function(e){
vehicleNo.value =  e.target.value.toUpperCase();
vehicleNo.classList.remove("requiredvalue");
});
chakka.addEventListener("keyup",function(e){  
chakka.value = e.target.value.toUpperCase();
chakka.classList.remove("requiredvalue");
});
addCft.addEventListener("click",function(){
   if(!handleRequired()){
return;
   }

let tbody = `<tr><td>${vehicleNo.value}<input type="hidden" class="vehicle" name="vehicleno[]" value="${vehicleNo.value}"></td><td>${chakka.value}<input type="hidden" class="chakkaType"  name="chakka[]" value="${chakka.value}"></td><td>${(Number(lengthVeh.value) + Number(lengthVehTwo.value/12)).toFixed(2)}<input type="hidden" " name="length[]" value="${(Number(lengthVeh.value) + Number(lengthVehTwo.value/12)).toFixed(2)}"></td><td>${widthVeh.value}<input type="hidden"  name="width[]" value="${(Number(widthVeh.value) + Number(widthVehTwo.value/12)).toFixed(2)}"></td><td>${(Number(heightVeh.value) + Number(heightVehTwo.value/12)).toFixed(2)}<input type="hidden" name="height[]" value="${(Number(heightVeh.value) + Number(heightVehTwo.value/12)).toFixed(2)}"></td><td>${cftVeh.value}<input type="hidden"  name="cft[]" value="${cftVeh.value}"></td><td>${unitVeh.value}<input type="hidden" name="unit[]" value="${unitVeh.value}"></td><td><i class="fas fa-trash-alt dele"></i></td></tr>`;
cftTbody.innerHTML+= tbody;
lengthVeh.value="";
widthVeh.value="";
heightVeh.value="";
lengthVehTwo.value="";
widthVehTwo.value="";
heightVehTwo.value="";
cftVeh.value="";
unitVeh.value="";
chakka.value="";
chakka.focus();
});
cftTbody.addEventListener("click",function(e){
   if( e.target.classList.contains("dele")){
  e.target.closest("tr").remove();
    }
});
let chakkaName = document.getElementById("chakka");
let chakkaEntered = document.querySelectorAll(".chakkaType");
console.log(chakkaEntered);
chakkaName.addEventListener("keyup",function(){
    console.log(chakkaEntered);
chakkaEntered.forEach((list)=>{
    if(chakkaName.toLowerCase().replace(/ /g,"") == list.value.toLowerCase().replace(/ /g,"")){
        document.getElementById("alertUser").click();
        chakkaName.value="";
    }
})
});