<script lang="ts">
  import "../../../app.postcss";
  import { onMount } from "svelte";
  import { PUBLIC_BASE_URL } from "$env/static/public";
  import type { company, oilprice } from "$lib/types/types";

  export let company_data: company;
  export let oil_price_data: oilprice;

  let price_of_oil: string = "";
  let company_name: string = "";
  let company_phone_number: string = "";

  onMount(async () => {
    await fetch(PUBLIC_BASE_URL + "/info/price/today", {
      method: "get",
      credentials: "include",
      headers: {
        "Content-Type": "application/json",
      },
    })
      .then((response) => response.json())
      .then((result) => (oil_price_data = result));

    if (oil_price_data["ok"] == true) {
      price_of_oil = oil_price_data["todays_price"];
    }
  });
  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"];
      company_phone_number = company_data["company_phone_number"];
    }
  });
</script>
<title>Contact Auburn Oil  </title>
<div class="bg-secondary px-10">
  <div
    class="max-w-7xl justify-center py-5 mx-auto font-bold text-white"
  >
  <h1>Contact</h1>
  </div>
</div>
<div class="max-w-7xl mx-auto px-10">
  <div class="grid grid-cols-2 gap-5">
    <div class="col-span-2 md:col-span-1">
      <div class="text-2xl font-bold text-primary">Contact Us</div>
      <div class=" text-xl">Phone: {company_phone_number}</div>
      <div class=" text-xl">Email: auburnoilservices@gmail.com</div>
      <div class="mb-10 "></div>
      <div class=" text-xl">Auburn Oil</div>
      <div class=" text-xl">P.O. Box 174</div>
      <div class=" text-xl">Auburn Ma 01501</div>
      <div class="mb-10 "></div>
      <div class="mb-10">
        <div class="font-bold text-2xl text-primary max-w-7xl mx-auto">
          Business Hours Summer
        </div>
        <div class="font-bold text-xl bg-primary text-white h-2 mb-2"></div>
        <div class="text-xl">Monday: 8:00 a.m. – 5:00 p.m.</div>
        <div class="text-xl">Tuesday: 8:00 a.m. – 5:00 p.m.</div>
        <div class="text-xl">Wednesday: 8:00 a.m. – 5:00 p.m.</div>
        <div class="text-xl">Thursday: 8:00 a.m. – 5:00 p.m.</div>
        <div class="text-xl">Friday: 8:00 a.m. – 3:00 p.m.</div>
        <div class="text-xl">Saturday: Closed</div>
        <div class="text-xl">Sunday: Closed</div>
      </div>
      <div class="pb-10">
        <div class="font-bold text-2xl text-primary max-w-7xl mx-auto">
          Business Hours Winter
        </div>
        <div class="font-bold text-xl bg-primary text-white h-2 mb-2"></div>
        <div class="text-xl">Monday: 8:00 a.m. – 5:00 p.m.</div>
        <div class="text-xl">Tuesday: 8:00 a.m. – 5:00 p.m.</div>
        <div class="text-xl">Wednesday: 8:00 a.m. – 5:00 p.m.</div>
        <div class="text-xl">Thursday: 8:00 a.m. – 5:00 p.m.</div>
        <div class="text-xl">Friday: 8:00 a.m. – 5:00 p.m.</div>
        <div class="text-xl">Saturday: 8:00 a.m. – 1:00 p.m.</div>
        <div class="text-xl">Sunday: Closed</div>
      </div>
    </div>
    <div class="col-span-2 md:col-span-1 ">

    </div>
  </div>
</div>
