Files
auburnoil_frontend/src/routes/(app)/delivery/+page.svelte

147 lines
4.2 KiB
Svelte
Executable File

<script lang='ts'>
import "../../../app.postcss";
import { onMount } from "svelte";
import { PUBLIC_BASE_URL } from "$env/static/public";
import type { company, priceitems } from '$lib/types/types'
export let company_data: company;
export let oil_data: priceitems;
let company_name: string = '';
let tel_number: string = '';
let price_emergency: string = '';
let price_prime: string = '';
let price_same_day: string = '';
onMount(async () => {
await fetch(PUBLIC_BASE_URL + "/info/company", {
method: "get",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => (company_data = result));
if (company_data["ok"] == true) {
company_name = company_data["company_name"];
tel_number = company_data["company_phone_number"];
}
});
onMount(async () => {
await fetch(PUBLIC_BASE_URL + "/info/price/oil/items", {
method: "get",
credentials: "include",
headers: {
"Content-Type": "application/json",
},
})
.then((response) => response.json())
.then((result) => (oil_data = result));
if (oil_data["ok"] == true) {
price_emergency = oil_data["price_emergency"];
price_prime = oil_data["price_prime"];
price_same_day = oil_data["price_same_day"];
}
});
</script>
<title>Home Heating Oil Delivery</title>
<div class="bg-secondary px-10">
<div
class="max-w-7xl justify-center py-5 mx-auto font-bold text-white"
>
<h1>Heating Oil Delivery</h1>
</div>
</div>
<div class="max-w-7xl mx-auto px-10">
<div class="grid grid-cols-12 max-w-7xl">
<div class="col-span-12 lg:col-span-6">
<div class="grid grid-cols-12">
<div class="col-span-12 font-bold text-2xl my-10">
We know it can be tough to order oil. We make it simple!
</div>
<div class="col-span-12 font-bold text-xl text-primary">
Worcester County
</div>
<div class="col-span-12 text-lg">
<ul>100 Gallon Minimum to Worcester County</ul>
<ul>Prime - ${price_prime}</ul>
<ul>Same Day - ${price_same_day} + price oil</ul>
<ul>After Hours Emergency - ${price_emergency} + price oil (prime included)</ul>
</div>
<div class="col-span-12 font-bold mt-10 text-xl text-primary">
Payments Methods
</div>
<div class="col-span-12 text-lg">
<ul>Cash on Delivery (C.O.D)</ul>
<ul>Credit Card</ul>
<ul>Money Order</ul>
<ul>Check (with credit card hold till it clears)</ul>
</div>
<div class="col-span-12 mb-10">
<ul>
<div class="col-span-12 font-bold mt-10 text-xl text-primary">
How to Order Oil
</div>
<div class="flex gap-5">
<li class=" font-bold">
1.) Call {tel_number} to place an order.
</li>
</div>
<div class="flex gap-5">
<li class=" font-bold">
2.) Give your name, address, fill location, and phone number.
</li>
</div>
<div class="flex gap-5">
<li class=" font-bold">
3.) Decide if you want a fill or specific gallons
</li>
</div>
<div class="flex gap-5">
<li class=" font-bold">
4.) Pay with above payments mentioned.
</li>
</div>
</ul>
</div>
<div class="col-span-12 mx-auto py-10">
</div>
</div>
</div>
<div class="col-span-12 md:col-span-6">
<div class="col-span-12">
<img alt="" class="w-full p-0 m-0" src="/images/truckauburn.jpg" />
</div>
</div>
<div class="col-span-12 mb-10
text-bold bg-blue-oil text-white mt-10 text-5xl text-bold
p-5 text-center">
Call Today {tel_number}
</div>
</div>
</div>