Vehicle Service Entry
body {
font-family: Arial, sans-serif;
background: #f4f6f8;
margin: 0;
padding: 20px;
}
.container {
max-width: 700px;
margin: auto;
background: white;
padding: 30px;
border-radius: 10px;
box-shadow: 0 2px 10px rgba(0,0,0,.1);
}
h1 {
text-align: center;
color: #333;
}
label {
display: block;
margin-top: 15px;
margin-bottom: 5px;
font-weight: bold;
}
input,
select {
width: 100%;
padding: 12px;
border: 1px solid #ccc;
border-radius: 5px;
box-sizing: border-box;
}
button {
width: 100%;
margin-top: 25px;
padding: 14px;
background: #2c7be5;
color: white;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
}
button:hover {
background: #1d63c8;
}
.success {
color: green;
text-align: center;
margin-top: 15px;
}
.error {
color: red;
text-align: center;
margin-top: 15px;
}
const SCRIPT_URL = “https://script.google.com/macros/s/AKfycbxRtv5oUTQmUBIzYdRyzRTAc1VsElsGiUz2bBnpohvESfqXtu29ChkQoqAZ7GgteH7J/exec”;
document.getElementById(“serviceForm”).addEventListener(“submit”, async function(e) {
e.preventDefault();
const formData = {
customerId: document.getElementById(“customerId”).value,
customerName: document.getElementById(“customerName”).value,
vehicle: document.getElementById(“vehicle”).value,
mileage: document.getElementById(“mileage”).value,
interval: document.getElementById(“interval”).value
};
const message = document.getElementById(“message”);
try {
const response = await fetch(SCRIPT_URL, {
method: “POST”,
headers: {
“Content-Type”: “application/json”
},
body: JSON.stringify(formData)
});
const result = await response.text();
message.className = “success”;
message.innerHTML = “✓ Service record saved successfully.”;
document.getElementById(“serviceForm”).reset();
} catch (error) {
message.className = “error”;
message.innerHTML = “Unable to save service record.”;
}
});
Neighbor's Choice Mobile Auto Maintenance LLC 