"use client";
import { useSearchParams } from "next/navigation";

const Page = () => {
  const params = useSearchParams();
  const refid = params.get("refid");
  const paymentStatus = params.get("paymentStatus");
  const factorNumber = params.get("factorNumber");

  console.log(paymentStatus);

  return (
    <>
      {!paymentStatus ? (
        <div className="bg-contact-us  !min-h-[100vh]">
          <div className=" pb-20">
            <div className="pt-[190px] px-10">
              <div>
                <svg
                  width="90"
                  height="90"
                  viewBox="0 0 264 276"
                  fill="none"
                  xmlns="http://www.w3.org/2000/svg"
                  className="mx-auto"
                >
                  <path
                    d="M132 13L164.832 36.95L205.475 36.875L217.957 75.55L250.882 99.375L238.25 138L250.882 176.625L217.957 200.45L205.475 239.125L164.832 239.05L132 263L99.1691 239.05L58.5254 239.125L46.0441 200.45L13.1191 176.625L25.7504 138L13.1191 99.375L46.0441 75.55L58.5254 36.875L99.1691 36.95L132 13Z"
                    stroke="white"
                    stroke-opacity="0.28"
                    stroke-width="25"
                    stroke-linecap="round"
                    stroke-linejoin="round"
                  />
                  <path
                    d="M88.25 138L119.5 169.25L182 106.75"
                    stroke="white"
                    stroke-width="25"
                    stroke-linecap="round"
                    stroke-linejoin="round"
                  />
                </svg>
              </div>

              <h1 className=" xs:text-[20px] lg:text-[40px] text-white font-bold text-center mt-10 rtl">
                خرید شما با شماره فاکتور{" "}
                <span className="bg-primary-200 px-2 rounded-lg mx-2">
                  {" "}
                  {factorNumber}
                </span>
                با موفقیت کامل شد
              </h1>
              <p className="mb-0 text-center xs:text-sm lg:text-base text-gray-200 opacity-80">
                میتونید با مراجعه به پنل کابری قسمت سفارش ها جزئیات سفارش رو
                ببینید
              </p>
              <div className="flex justify-center">
                <button className="btn btn-outline-light text-sm rounded-xl py-1 mt-5">
                  مشاهده سفارش
                </button>
              </div>
            </div>
          </div>
        </div>
      ) : (
        <div className="bg-error !min-h-[100vh]">
          <div className=" pb-20">
            <div className="pt-[50px] px-10">
              <div className="text-[200px] text-white mx-auto text-center">
                !
              </div>

              <h1 className=" xs:text-[20px] lg:text-[40px] text-white font-bold text-center mt-10 rtl">
                خرید شما با شماره فاکتور با موفقیت انجام نشد
              </h1>
              <p className="mb-0 text-center xs:text-sm lg:text-base text-gray-200 opacity-80">
                میتونید با مراجعه به پنل گفتینو یا در صفحه تماس با ما با تیم
                پشتیبانی ما در تماس باشید
              </p>
              <div className="flex justify-center">
                <button className="btn btn-outline-light text-sm rounded-xl py-1 mt-5">
                  درباره ما{" "}
                </button>
              </div>
            </div>
          </div>
        </div>
      )}
    </>
  );
};

export default Page;