From 40f6f69b655824217033047b5994cbb12be6c54b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D8=AD=D8=B3=DB=8C=D9=86=20=D9=85=D8=B9=D8=B5=D9=88=D9=85?= =?UTF-8?q?=DB=8C=20=D9=BE=D9=88=D8=B1?= Date: Mon, 9 Sep 2024 04:07:44 +0330 Subject: [PATCH] add new landing --- components.json | 19 + components/TaskPage/ActivityCard/page.jsx | 38 +- components/TaskPage/ActivityCardFake/page.jsx | 295 ++ components/landingComponents/Experience.jsx | 119 +- components/landingComponents/Feedbacks.jsx | 124 +- components/landingComponents/Footer/page.jsx | 4 +- components/landingComponents/Hero.jsx | 62 +- .../landingComponents/MovingLogos/page.jsx | 4 +- components/landingComponents/Navbar.jsx | 4 +- components/landingComponents/Phi.jsx | 118 + components/landingComponents/StepProduct.jsx | 868 ++++ components/landingComponents/StressTest.jsx | 91 + datacalender.js | 26 + package-lock.json | 262 +- package.json | 5 +- public/fallback-ce627215c0e4a9af.js | 1 + public/fallback-development.js | 102 - public/images/Vector1.png | Bin 0 -> 46184 bytes public/images/adjustw.png | Bin 0 -> 11187 bytes public/images/logo/lam.png | Bin 0 -> 139171 bytes public/images/logo/ros.png | Bin 0 -> 60362 bytes public/images/logo/tuk.png | Bin 0 -> 187186 bytes public/images/logo/vee.png | Bin 0 -> 48466 bytes public/images/logo/woo.png | Bin 0 -> 217380 bytes public/images/phi1t.png | Bin 0 -> 204693 bytes public/images/test.gif | Bin 0 -> 948427 bytes public/sw.js | 116 +- public/sw.js.map | 1 - public/swe-worker-5c72df51bb1f6ee0.js | 1 + public/swe-worker-development.js | 102 - public/workbox-1e54d6fe.js | 3593 ----------------- public/workbox-1e54d6fe.js.map | 1 - public/workbox-c06b064f.js | 1 + src/app/app/news/page.jsx | 1 - src/app/page.jsx | 10 +- src/assets/app.png | Bin 0 -> 366963 bytes src/assets/phi1.png | Bin 0 -> 130271 bytes src/assets/phi2.png | Bin 0 -> 122490 bytes src/assets/phi3.png | Bin 0 -> 109634 bytes src/constans/index.js | 121 +- style/globals.css | 4 + 41 files changed, 1889 insertions(+), 4204 deletions(-) create mode 100644 components.json create mode 100644 components/TaskPage/ActivityCardFake/page.jsx create mode 100644 components/landingComponents/Phi.jsx create mode 100644 components/landingComponents/StepProduct.jsx create mode 100644 components/landingComponents/StressTest.jsx create mode 100644 public/fallback-ce627215c0e4a9af.js delete mode 100644 public/fallback-development.js create mode 100644 public/images/Vector1.png create mode 100644 public/images/adjustw.png create mode 100644 public/images/logo/lam.png create mode 100644 public/images/logo/ros.png create mode 100644 public/images/logo/tuk.png create mode 100644 public/images/logo/vee.png create mode 100644 public/images/logo/woo.png create mode 100644 public/images/phi1t.png create mode 100644 public/images/test.gif delete mode 100644 public/sw.js.map create mode 100644 public/swe-worker-5c72df51bb1f6ee0.js delete mode 100644 public/swe-worker-development.js delete mode 100644 public/workbox-1e54d6fe.js delete mode 100644 public/workbox-1e54d6fe.js.map create mode 100644 public/workbox-c06b064f.js create mode 100644 src/assets/app.png create mode 100644 src/assets/phi1.png create mode 100644 src/assets/phi2.png create mode 100644 src/assets/phi3.png diff --git a/components.json b/components.json new file mode 100644 index 0000000..6bc9c7c --- /dev/null +++ b/components.json @@ -0,0 +1,19 @@ +{ + "$schema": "https://ui.shadcn.com/schema.json", + "style": "default", + "rsc": false, + "tsx": false, + "tailwind": { + "config": "tailwind.config.js", + "css": "app/globals.css", + "baseColor": "slate", + "cssVariables": false, + "prefix": "" + }, + "aliases": { + "components": "@/components", + "utils": "@/lib/utils", + "ui": "@/components/ui", + "magicui": "@/components/magicui" + } +} \ No newline at end of file diff --git a/components/TaskPage/ActivityCard/page.jsx b/components/TaskPage/ActivityCard/page.jsx index dec0a6d..b1c5b3c 100644 --- a/components/TaskPage/ActivityCard/page.jsx +++ b/components/TaskPage/ActivityCard/page.jsx @@ -9,7 +9,7 @@ import SimpleReactValidator from "simple-react-validator"; import PersianNumber from "plugins/PersianNumber"; import moment from "jalali-moment"; -const ActivityCard = ({ data }) => { +const ActivityCardFake = ({ data }) => { const CTX = useContext(AppContext); const [conditionTask, setConditionTask] = useState(0); @@ -52,7 +52,7 @@ const ActivityCard = ({ data }) => { return (
{ : "" }`} > -
+
-
+
{data?.scheduleType == 0 - ? "روزانه" + ? "daily" : data?.scheduleType == 1 - ? "هفتگی" + ? "weekly" : data?.scheduleType == 2 - ? "مخصوص" + ? "special" : ""}
-
-
+
+
{data?.shiftTitle}
-
-
+
+
{data?.userFullName}
{" "} @@ -152,19 +152,19 @@ const ActivityCard = ({ data }) => {

{data?.title}{" "}

{data?.description}{" "} @@ -258,7 +258,7 @@ const ActivityCard = ({ data }) => { >

{ "required" )} textarea={true} - theme={0} + theme={1} mt={"2"} />
handleUndoneResone()} @@ -292,4 +292,4 @@ const ActivityCard = ({ data }) => { ); }; -export default ActivityCard; +export default ActivityCardFake; diff --git a/components/TaskPage/ActivityCardFake/page.jsx b/components/TaskPage/ActivityCardFake/page.jsx new file mode 100644 index 0000000..dec0a6d --- /dev/null +++ b/components/TaskPage/ActivityCardFake/page.jsx @@ -0,0 +1,295 @@ +"use client"; +import AppContext from "@ctx/AppContext"; +import Avatar from "boring-avatars"; +import BottomFilterActivities from "plugins/BottomSheet/BottomFilterActivities"; +import Buttonbriz from "plugins/Buttonbriz/page"; +import Input from "plugins/Input/page"; +import React, { useContext, useRef, useState } from "react"; +import SimpleReactValidator from "simple-react-validator"; +import PersianNumber from "plugins/PersianNumber"; +import moment from "jalali-moment"; + +const ActivityCard = ({ data }) => { + const CTX = useContext(AppContext); + + const [conditionTask, setConditionTask] = useState(0); + const [undoneResone, setUndoneResone] = useState(""); + + const validator = useRef( + new SimpleReactValidator({ + messages: { + required: "پر کردن این فیلد الزامی میباشد", + }, + element: (message) => ( + <> +
+ {message} +
+ + ), + }) + ); + + const handleConditionTaskCircle = () => { + if (data.status != 2 && data.status != 3 && data.status != 4) { + if (conditionTask == 3 || conditionTask == 4) { + return; + } else { + setConditionTask(1); + } + } + }; + + const handleUndoneResone = () => { + setConditionTask(4); + CTX.UnDoneActivity(data.id, undoneResone); + }; + + const handleDone = () => { + setConditionTask(3); + CTX.DoneActivity(data.id); + }; + + return ( +
+
+
+
+
+ {data?.scheduleType == 0 + ? "روزانه" + : data?.scheduleType == 1 + ? "هفتگی" + : data?.scheduleType == 2 + ? "مخصوص" + : ""} +
+
+
+ {data?.shiftTitle} +
+
+
+ {data?.userFullName} +
+
{" "} + {data?.doneAt !== "0001-01-01T00:00:00" && ( + <> +
+ +
+ {" "} +
+ + )} +
+
+ +
+
handleConditionTaskCircle()} + > + {conditionTask == 2 || conditionTask == 4 || data?.status == 4 ? ( + + + + ) : conditionTask == 3 || data?.status == 2 || data?.status == 3 ? ( + + + + + ) : ( + "" + )} +
+
+

+ {data?.title}{" "} +

+

+ {data?.description}{" "} +

+
+
+ +
+
setConditionTask(0)} + > + + + +
+
+ {" "} +
handleDone()} + > + + + + +
+
setConditionTask(2)} + > + + + +
+
+
+ +
+
+
+ { + setUndoneResone(e.target.value); + validator.current.showMessageFor("undoneResone"); + }} + style="text-right" + validator={true} + validatorData={validator.current.message( + "undoneResone", + undoneResone, + "required" + )} + textarea={true} + theme={0} + mt={"2"} + /> +
+ + handleUndoneResone()} + /> +
+
+
+ ); +}; + +export default ActivityCard; diff --git a/components/landingComponents/Experience.jsx b/components/landingComponents/Experience.jsx index 800e011..04f894b 100644 --- a/components/landingComponents/Experience.jsx +++ b/components/landingComponents/Experience.jsx @@ -1,9 +1,11 @@ -import React from "react"; +"use client"; + +import React, { useEffect, useState } from "react"; import { VerticalTimeline, VerticalTimelineElement, } from "react-vertical-timeline-component"; -import { motion } from "framer-motion"; +import { AnimatePresence, motion } from "framer-motion"; import "react-vertical-timeline-component/style.min.css"; @@ -11,8 +13,26 @@ import { SectionWrapper } from "src/hoc"; import { textVariant } from "src/utils/motion"; import { styles } from "src/style"; import { experiences } from "src/constans"; +import { activityFake } from "datacalender"; +import ActivityCard from "@comp/TaskPage/ActivityCard/page"; +import ActivityCardFake from "@comp/TaskPage/ActivityCard/page"; const ExperienceCard = ({ experience }) => { + const [isMobile, setIsMobile] = useState(false); + + useEffect(() => { + // Check window size after the component mounts + const handleResize = () => { + setIsMobile(window.innerWidth < 640); + }; + + // Run the function initially and also when the window is resized + handleResize(); + window.addEventListener("resize", handleResize); + + // Clean up event listener on unmount + return () => window.removeEventListener("resize", handleResize); + }, []); return ( { }} contentArrowStyle={{ borderRight: "7px solid #35685952" }} date={experience.date} - iconStyle={{ background: experience.iconBg }} - icon={ -
- } + iconStyle={{ + background: experience.iconBg, // Customize background + color: "#fff", // Customize icon color + boxShadow: "0 0 0 4px #35685952", // Add shadow or border + display: "flex", + justifyContent: "center", + alignItems: "center", + background: "white", + width: "30px", + height: "30px", + marginLeft: isMobile ? "5px" : "-15px", // Apply margin based on screen width + marginTop: "15px", + opacity: "0.8", + }} >

{experience.title}

@@ -52,13 +82,34 @@ const ExperienceCard = ({ experience }) => { }; const Experience = () => { + const [number, setNumber] = useState(2001); + const [prevNumber, setPrevNumber] = useState(2001); + + useEffect(() => { + const interval = setInterval(() => { + setPrevNumber(number); + setNumber((prev) => prev + 1); + }, 3000); + + return () => clearInterval(interval); + }, [number]); + + const numberStr = number.toString(); + const prevNumberStr = prevNumber.toString(); + + const fadeVariants = { + initial: { opacity: 0, y: 30, color: "#000000" }, // Dark background when fading in + animate: { opacity: 1, y: 0, color: "#ffffff" }, // White background when fully visible + exit: { opacity: 0, y: -30, color: "#000000" }, // Dark background when fading out + }; return ( <> -

- User journey road map{" "} +

+ + B + + ase logics{" "}

@@ -77,11 +128,55 @@ const Experience = () => {

- " Now, your coffee shop's symphony plays harmoniously with Briz." + Number of tasks completed in Briz

+
+
+ +
+
+
+ {numberStr.split("").map((digit, index) => ( +
+ + {prevNumberStr[index] !== digit && ( + + {prevNumberStr[index]} + + )} + + + + {digit} + + +
+ ))} +
+

+ Activities performed with Briz +

+
+
); }; -export default SectionWrapper(Experience, "work"); +export default SectionWrapper(Experience, "our-solution"); diff --git a/components/landingComponents/Feedbacks.jsx b/components/landingComponents/Feedbacks.jsx index 62305b4..4d4add5 100644 --- a/components/landingComponents/Feedbacks.jsx +++ b/components/landingComponents/Feedbacks.jsx @@ -1,46 +1,114 @@ -import React from "react"; +"use clients"; +import React, { useEffect, useState } from "react"; import { motion } from "framer-motion"; import { SectionWrapper } from "src/hoc"; import { fadeIn, textVariant } from "src/utils/motion"; import { styles } from "src/style"; import { testimonials } from "src/constans"; - -const FeedbackCard = ({ index, testimonial, title }) => ( - -

{title}

-
-

- {testimonial} -

-
-
-); +import Image from "next/image"; +import phi from "@img/adjustw.png"; +import phi1 from "../../src/assets/phi1.png"; +import phi2 from "../../src/assets/phi2.png"; +import phi3 from "../../src/assets/phi3.png"; const Feedbacks = () => { + const [activeIndex, setActiveIndex] = useState(0); + + useEffect(() => { + const interval = setInterval(() => { + setActiveIndex((prevIndex) => + prevIndex === testimonials.length - 1 ? 0 : prevIndex + 1 + ); + }, 6000); // 5 seconds interval + + return () => clearInterval(interval); // Cleanup interval on component unmount + }, []); + + console.log(activeIndex); return (
-

- Platform Description. -

+
+
+ +
+ + HI + +
+ +

+ {" "} + Coffee taste always matters the most. With PHI, it will always be + perfect. Phi means the golden ratio. If you brew your coffee with + the golden ratio, it will always taste good. In the Phi section, + there are three boxes that the barista on shift should fill. These + are the main elements for adjusting the daily coffee recipe: +

-
- {testimonials.map((testimonial, index) => ( - - ))} +
+
+ {testimonials.map((e, index) => ( + setActiveIndex(index)} + > +

+ {e.title} +

+ + {activeIndex == index && ( +
+

+ {e.testimonial} +

+
+ )} +
+ ))} +
+ + + + + {/* +
+ +
+ +
+ +
*/}
+ +

+ {" "} + Your barista enters the daily recipe, which will be recorded in your + database. You can view your adjustment chart see what’s happening in + your bar, and check the quality of your coffee serving in your store. +

); }; diff --git a/components/landingComponents/Footer/page.jsx b/components/landingComponents/Footer/page.jsx index f5bdd21..93e8218 100644 --- a/components/landingComponents/Footer/page.jsx +++ b/components/landingComponents/Footer/page.jsx @@ -21,8 +21,8 @@ const Footer = () => {

pricing

- -

platform

+ +

Phi

about us

diff --git a/components/landingComponents/Hero.jsx b/components/landingComponents/Hero.jsx index 2fd31c2..13b57b4 100644 --- a/components/landingComponents/Hero.jsx +++ b/components/landingComponents/Hero.jsx @@ -1,41 +1,41 @@ -import { motion } from "framer-motion"; import Link from "next/link"; import MovingLogos from "./MovingLogos/page"; +import { motion } from "framer-motion"; +import { fadeIn, textVariant } from "src/utils/motion"; const Hero = () => { return ( -
-
- {/*
-
-
-
*/} - -
-
- +
+
+
+
+ " -

- SIMPLE AND SMOOTH OPERATION -

- + +

+ SIMPLE AND SMOOTH OPERATION +

+
+ "
-

- A task and shift management solution for coffee shops that provides - clear, trackable task management and monitoring of store operations.{" "} -

+ + +

+ A task and shift management solution for coffee shops that + provides clear, trackable task management and monitoring of store + operations. +

+
-
-
@@ -43,15 +43,11 @@ const Hero = () => {
- {/* */} - -
-

+

+

Brands that trust us and use BRIZ for their managing.

-
+
diff --git a/components/landingComponents/MovingLogos/page.jsx b/components/landingComponents/MovingLogos/page.jsx index 2a6a1de..a68b110 100644 --- a/components/landingComponents/MovingLogos/page.jsx +++ b/components/landingComponents/MovingLogos/page.jsx @@ -1,9 +1,9 @@ "use client"; import Image from "next/image"; -import logobrand1 from "@img/logo/alp.png"; +import logobrand1 from "@img/logo/ros.png"; import logobrand2 from "@img/logo/lam.png"; import logobrand3 from "@img/logo/tuk.png"; -import logobrand4 from "@img/logo/vi.png"; +import logobrand4 from "@img/logo/vee.png"; import logobrand5 from "@img/logo/woo.png"; const MovingLogos = () => { diff --git a/components/landingComponents/Navbar.jsx b/components/landingComponents/Navbar.jsx index 946e67b..154b096 100644 --- a/components/landingComponents/Navbar.jsx +++ b/components/landingComponents/Navbar.jsx @@ -83,14 +83,14 @@ const Navbar = () => { menu setToggle(!toggle)} />