Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
3f344fa1a8 | ||
|
|
1d5b638f3e | ||
|
|
aa6cb26b46 | ||
|
|
fe1f17f740 | ||
|
|
494fc9f79b | ||
|
|
d631174d40 | ||
|
|
121287e105 | ||
|
|
fbacd2ca22 | ||
|
|
711ac3668c | ||
|
|
5594c3c25b |
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="JavaScriptLibraryMappings">
|
||||
<includedPredefinedLibrary name="Node.js Core" />
|
||||
</component>
|
||||
</project>
|
||||
@@ -1,7 +1,12 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="AutoImportSettings">
|
||||
<option name="autoReloadType" value="SELECTIVE" />
|
||||
</component>
|
||||
<component name="ChangeListManager">
|
||||
<list default="true" id="bb7b50a5-be9c-4cd7-a05b-979f0e91b173" name="Changes" comment="update" />
|
||||
<list default="true" id="bb7b50a5-be9c-4cd7-a05b-979f0e91b173" name="Changes" comment="update">
|
||||
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
|
||||
</list>
|
||||
<option name="SHOW_DIALOG" value="false" />
|
||||
<option name="HIGHLIGHT_CONFLICTS" value="true" />
|
||||
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
|
||||
@@ -15,6 +20,65 @@
|
||||
<scroll-view-position x="0" y="0" />
|
||||
</layout>
|
||||
</component>
|
||||
<component name="NextEditCompletionFeaturesState">
|
||||
<decayedCancelled>
|
||||
<entry key="MS100" value="1.9180577791458209" />
|
||||
<entry key="MS500" value="4.688644388100796" />
|
||||
<entry key="S2" value="8.26749701184336" />
|
||||
<entry key="S5" value="10.565752377401568" />
|
||||
<entry key="S10" value="11.665306157952212" />
|
||||
<entry key="S30" value="12.525747261610114" />
|
||||
<entry key="S60" value="12.758981623001501" />
|
||||
<entry key="M2" value="12.87850025822862" />
|
||||
<entry key="M5" value="12.951160086704387" />
|
||||
<entry key="M10" value="12.975539848697636" />
|
||||
<entry key="M15" value="12.983684286049057" />
|
||||
<entry key="M30" value="12.99183766624342" />
|
||||
<entry key="H1" value="12.995917713255967" />
|
||||
<entry key="H2" value="12.997958576577691" />
|
||||
<entry key="H4" value="12.99897921826579" />
|
||||
<entry key="D1" value="12.999829859984649" />
|
||||
<entry key="W1" value="12.999975694045316" />
|
||||
</decayedCancelled>
|
||||
<decayedSelected>
|
||||
<entry key="MS100" value="0.0" />
|
||||
<entry key="MS500" value="0.0" />
|
||||
<entry key="S2" value="0.0" />
|
||||
<entry key="S5" value="0.0" />
|
||||
<entry key="S10" value="0.0" />
|
||||
<entry key="S30" value="0.0" />
|
||||
<entry key="S60" value="0.0" />
|
||||
<entry key="M2" value="0.0" />
|
||||
<entry key="M5" value="0.0" />
|
||||
<entry key="M10" value="0.0" />
|
||||
<entry key="M15" value="0.0" />
|
||||
<entry key="M30" value="0.0" />
|
||||
<entry key="H1" value="0.0" />
|
||||
<entry key="H2" value="0.0" />
|
||||
<entry key="H4" value="0.0" />
|
||||
<entry key="D1" value="0.0" />
|
||||
<entry key="W1" value="0.0" />
|
||||
</decayedSelected>
|
||||
<decayedShown>
|
||||
<entry key="MS100" value="1.7420918727122994" />
|
||||
<entry key="MS500" value="4.512290317154382" />
|
||||
<entry key="S2" value="8.19204120547899" />
|
||||
<entry key="S5" value="10.528482205836237" />
|
||||
<entry key="S10" value="11.645001964515167" />
|
||||
<entry key="S30" value="12.518545816831239" />
|
||||
<entry key="S60" value="12.755322274489146" />
|
||||
<entry key="M2" value="12.876655570534636" />
|
||||
<entry key="M5" value="12.950418561706101" />
|
||||
<entry key="M10" value="12.97516847394418" />
|
||||
<entry key="M15" value="12.98343656653061" />
|
||||
<entry key="M30" value="12.991713738236065" />
|
||||
<entry key="H1" value="12.995855732176478" />
|
||||
<entry key="H2" value="12.997927581767277" />
|
||||
<entry key="H4" value="12.998963719792695" />
|
||||
<entry key="D1" value="12.999827276757467" />
|
||||
<entry key="W1" value="12.999975325009228" />
|
||||
</decayedShown>
|
||||
</component>
|
||||
<component name="ProjectColorInfo">{
|
||||
"customColor": "",
|
||||
"associatedIndex": 2
|
||||
@@ -33,18 +97,30 @@
|
||||
"RunOnceActivity.typescript.service.memoryLimit.init": "true",
|
||||
"codeWithMe.voiceChat.enabledByDefault": "false",
|
||||
"git-widget-placeholder": "main",
|
||||
"javascript.nodejs.core.library.configured.version": "26.3.0",
|
||||
"javascript.nodejs.core.library.typings.version": "26.1.2",
|
||||
"javascript.preferred.runtime.type.id": "node",
|
||||
"js.debugger.nextJs.config.created.client": "true",
|
||||
"js.debugger.nextJs.config.created.server": "true",
|
||||
"kronk.content.tree.expanded.paths": "",
|
||||
"last_opened_file_path": "D:/Project/GitHubRepo/robot-market-landing",
|
||||
"node.js.detected.package.eslint": "true",
|
||||
"node.js.detected.package.tslint": "true",
|
||||
"node.js.selected.package.eslint": "(autodetect)",
|
||||
"node.js.selected.package.tslint": "(autodetect)",
|
||||
"nodejs_package_manager_path": "npm",
|
||||
"settings.editor.selected.configurable": "editor.preferences.fonts.default",
|
||||
"ts.external.directory.path": "C:\\Program Files\\JetBrains\\WebStorm 2026.1.1\\plugins\\javascript-plugin\\jsLanguageServicesImpl\\external",
|
||||
"vue.rearranger.settings.migration": "true"
|
||||
}
|
||||
}</component>
|
||||
<component name="RecentsManager">
|
||||
<key name="MoveFile.RECENT_KEYS">
|
||||
<recent name="D:\Project\GitHubRepo\robot-market-landing\public\images\icons" />
|
||||
<recent name="D:\Project\GitHubRepo\robot-market-landing\public\images" />
|
||||
<recent name="D:\Project\GitHubRepo\robot-market-landing\app" />
|
||||
</key>
|
||||
</component>
|
||||
<component name="RunManager" selected="npm.Next.js: server-side">
|
||||
<configuration name="Next.js: debug client-side" type="JavascriptDebugType" uri="http://localhost:3000/">
|
||||
<method v="2" />
|
||||
@@ -63,7 +139,7 @@
|
||||
<component name="SharedIndexes">
|
||||
<attachedChunks>
|
||||
<set>
|
||||
<option value="bundled-js-predefined-d6986cc7102b-31caf2ab9e3c-JavaScript-WS-261.23567.141" />
|
||||
<option value="bundled-js-predefined-d6986cc7102b-31caf2ab9e3c-JavaScript-WS-261.27258.45" />
|
||||
</set>
|
||||
</attachedChunks>
|
||||
</component>
|
||||
@@ -84,6 +160,20 @@
|
||||
<workItem from="1785645096071" duration="26000" />
|
||||
<workItem from="1785646314677" duration="16621000" />
|
||||
<workItem from="1785730130350" duration="12049000" />
|
||||
<workItem from="1785757166936" duration="5000" />
|
||||
<workItem from="1785901279535" duration="17323000" />
|
||||
<workItem from="1785988592310" duration="763000" />
|
||||
<workItem from="1785993398943" duration="489000" />
|
||||
<workItem from="1785995385816" duration="1586000" />
|
||||
<workItem from="1785999660169" duration="117000" />
|
||||
<workItem from="1785999908774" duration="697000" />
|
||||
<workItem from="1786434051896" duration="714000" />
|
||||
<workItem from="1787030163530" duration="2042000" />
|
||||
<workItem from="1787052515900" duration="43000" />
|
||||
<workItem from="1787980069071" duration="1369000" />
|
||||
<workItem from="1787993488084" duration="706000" />
|
||||
<workItem from="1788148958104" duration="1576000" />
|
||||
<workItem from="1788244010046" duration="1115000" />
|
||||
</task>
|
||||
<task id="LOCAL-00001" summary="update">
|
||||
<option name="closed" value="true" />
|
||||
@@ -197,12 +287,87 @@
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1785747909967</updated>
|
||||
</task>
|
||||
<option name="localTasksCounter" value="15" />
|
||||
<task id="LOCAL-00015" summary="update">
|
||||
<option name="closed" value="true" />
|
||||
<created>1785754086526</created>
|
||||
<option name="number" value="00015" />
|
||||
<option name="presentableId" value="LOCAL-00015" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1785754086526</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00016" summary="update">
|
||||
<option name="closed" value="true" />
|
||||
<created>1785754201946</created>
|
||||
<option name="number" value="00016" />
|
||||
<option name="presentableId" value="LOCAL-00016" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1785754201946</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00017" summary="update">
|
||||
<option name="closed" value="true" />
|
||||
<created>1785755999255</created>
|
||||
<option name="number" value="00017" />
|
||||
<option name="presentableId" value="LOCAL-00017" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1785755999255</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00018" summary="update">
|
||||
<option name="closed" value="true" />
|
||||
<created>1785914887554</created>
|
||||
<option name="number" value="00018" />
|
||||
<option name="presentableId" value="LOCAL-00018" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1785914887554</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00019" summary="update">
|
||||
<option name="closed" value="true" />
|
||||
<created>1785915840468</created>
|
||||
<option name="number" value="00019" />
|
||||
<option name="presentableId" value="LOCAL-00019" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1785915840468</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00020" summary="update">
|
||||
<option name="closed" value="true" />
|
||||
<created>1785918100372</created>
|
||||
<option name="number" value="00020" />
|
||||
<option name="presentableId" value="LOCAL-00020" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1785918100372</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00021" summary="update">
|
||||
<option name="closed" value="true" />
|
||||
<created>1785919055708</created>
|
||||
<option name="number" value="00021" />
|
||||
<option name="presentableId" value="LOCAL-00021" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1785919055708</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00022" summary="update">
|
||||
<option name="closed" value="true" />
|
||||
<created>1785988898095</created>
|
||||
<option name="number" value="00022" />
|
||||
<option name="presentableId" value="LOCAL-00022" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1785988898096</updated>
|
||||
</task>
|
||||
<task id="LOCAL-00023" summary="update">
|
||||
<option name="closed" value="true" />
|
||||
<created>1787052543722</created>
|
||||
<option name="number" value="00023" />
|
||||
<option name="presentableId" value="LOCAL-00023" />
|
||||
<option name="project" value="LOCAL" />
|
||||
<updated>1787052543722</updated>
|
||||
</task>
|
||||
<option name="localTasksCounter" value="24" />
|
||||
<servers />
|
||||
</component>
|
||||
<component name="TypeScriptGeneratedFilesManager">
|
||||
<option name="version" value="3" />
|
||||
</component>
|
||||
<component name="UnknownFeatures">
|
||||
<option featureType="com.intellij.fileTypeFactory" implementationName="next.config.js" />
|
||||
</component>
|
||||
<component name="VcsManagerConfiguration">
|
||||
<MESSAGE value="ui : change the position of header in Hero Section" />
|
||||
<MESSAGE value="update" />
|
||||
|
||||
|
After Width: | Height: | Size: 90 KiB |
@@ -8,12 +8,19 @@ const vazirmatn = Vazirmatn({
|
||||
display: 'swap',
|
||||
});
|
||||
|
||||
|
||||
export const metadata = {
|
||||
title: 'روبات مارکت | دستگاههای وندینگ هوشمند',
|
||||
description:
|
||||
'روبات مارکت؛ دستگاههای فروش خودکار هوشمند با مدیریت آنلاین، تحویل نرم و طراحی مدرن.',
|
||||
};
|
||||
|
||||
|
||||
export const viewport = {
|
||||
themeColor: '#00a693',
|
||||
};
|
||||
|
||||
|
||||
export default function RootLayout({children}) {
|
||||
|
||||
return (
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import Header from '@/components/Header';
|
||||
import HeroSection from '@/components/HeroSection';
|
||||
import HorizontalShowcase from '@/components/HorizontalShowcase';
|
||||
import TrustedBySection from '@/components/TrustedBySection';
|
||||
import FeaturesSection from '@/components/FeaturesSection';
|
||||
import AboutSection from '@/components/AboutSection';
|
||||
@@ -12,6 +11,7 @@ import TicketForm from '@/components/TicketForm';
|
||||
import Footer from '@/components/Footer';
|
||||
import CartDrawer from '@/components/CartDrawer';
|
||||
import ChatWidget from '@/components/ChatWidget';
|
||||
import ShowcaseSection from "@/components/ShowcaseSection";
|
||||
|
||||
|
||||
export default function HomePage() {
|
||||
@@ -25,7 +25,7 @@ export default function HomePage() {
|
||||
|
||||
<HeroSection/>
|
||||
|
||||
<HorizontalShowcase/>
|
||||
<ShowcaseSection/>
|
||||
|
||||
<TrustedBySection/>
|
||||
|
||||
|
||||
@@ -35,7 +35,7 @@ export default function FloatingItems({ items }) {
|
||||
}, [items]);
|
||||
|
||||
return (
|
||||
<div ref={containerRef} className="absolute inset-0 pointer-events-none">
|
||||
<div ref={containerRef} className="absolute inset-0 pointer-events-none hidden md:block">
|
||||
{items.map((item) => (
|
||||
<img
|
||||
key={item.id}
|
||||
|
||||
@@ -44,7 +44,7 @@ export default function Header() {
|
||||
>
|
||||
<div className="mx-auto max-w-7xl px-5 md:px-8 h-20 flex items-center justify-between gap-4">
|
||||
<a href="#hero" className="flex items-center gap-2 shrink-0">
|
||||
<Image src="/images/logo.png" alt="روبات مارکت" width={150} height={42} priority/>
|
||||
<Image src="/images/icons/logo.png" alt="روبات مارکت" width={150} height={42} priority/>
|
||||
</a>
|
||||
|
||||
<nav className="hidden xl:flex items-center gap-5 2xl:gap-7">
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
'use client';
|
||||
|
||||
// سکشن ویترین محصولات: با اسکرول عمودی به اسکرول افقی پینشده تبدیل میشود (GSAP ScrollTrigger)
|
||||
// و یک ویدیوی پسزمینه دارد که با پیشرفت اسکرول جلو/عقب میرود. طبق درخواست کاربر، این سکشن
|
||||
// و هیرو از چرخهی رنگبندی متناوب بقیه سکشنها مستثنا هستند.
|
||||
|
||||
import {useEffect, useRef, useState} from 'react';
|
||||
import {gsap} from 'gsap';
|
||||
import {ScrollTrigger} from 'gsap/ScrollTrigger';
|
||||
@@ -30,9 +26,28 @@ export default function HorizontalShowcase() {
|
||||
const ctx = gsap.context(() => {
|
||||
const track = trackRef.current;
|
||||
const section = sectionRef.current;
|
||||
|
||||
if (!track || !section) return;
|
||||
|
||||
const scrollDistance = () => track.scrollWidth - window.innerWidth;
|
||||
const scrollDistance = () => (
|
||||
Math.max(track.scrollWidth - window.innerWidth, 0)
|
||||
);
|
||||
|
||||
let animationFrameId = null;
|
||||
let latestProgress = 0;
|
||||
|
||||
const syncVideo = (progress) => {
|
||||
latestProgress = progress;
|
||||
if (animationFrameId !== null) return;
|
||||
|
||||
animationFrameId = window.requestAnimationFrame(() => {
|
||||
const video = videoRef.current;
|
||||
if (video && Number.isFinite(video.duration) && video.duration > 0) {
|
||||
video.currentTime = latestProgress * video.duration;
|
||||
}
|
||||
animationFrameId = null;
|
||||
});
|
||||
};
|
||||
|
||||
const horizontalTween = gsap.to(track, {
|
||||
x: () => -scrollDistance(),
|
||||
@@ -44,16 +59,12 @@ export default function HorizontalShowcase() {
|
||||
scrub: 1,
|
||||
pin: true,
|
||||
invalidateOnRefresh: true,
|
||||
onUpdate: (self) => {
|
||||
const video = videoRef.current;
|
||||
if (video && video.duration) {
|
||||
video.currentTime = self.progress * video.duration;
|
||||
}
|
||||
},
|
||||
onUpdate: (self) => syncVideo(self.progress),
|
||||
},
|
||||
});
|
||||
|
||||
return () => {
|
||||
if (animationFrameId !== null) window.cancelAnimationFrame(animationFrameId);
|
||||
horizontalTween.scrollTrigger?.kill();
|
||||
horizontalTween.kill();
|
||||
};
|
||||
@@ -64,6 +75,7 @@ export default function HorizontalShowcase() {
|
||||
|
||||
const handleModalAddToCart = () => {
|
||||
if (!quickViewMachine) return;
|
||||
|
||||
dispatch(
|
||||
addToCart({
|
||||
id: quickViewMachine.id,
|
||||
@@ -73,6 +85,7 @@ export default function HorizontalShowcase() {
|
||||
image: quickViewMachine.image,
|
||||
})
|
||||
);
|
||||
|
||||
message.success(t.cart.addToast(quickViewMachine.name));
|
||||
setQuickViewMachine(null);
|
||||
};
|
||||
@@ -115,12 +128,19 @@ export default function HorizontalShowcase() {
|
||||
>
|
||||
{quickViewMachine && (
|
||||
<div className="flex flex-col gap-4">
|
||||
<img src={quickViewMachine.image} alt={quickViewMachine.name}
|
||||
className="w-full h-64 object-contain"/>
|
||||
<img
|
||||
src={quickViewMachine.image}
|
||||
alt={quickViewMachine.name}
|
||||
className="w-full h-64 object-contain"
|
||||
/>
|
||||
<p className="text-secondary leading-7">{quickViewMachine.description}</p>
|
||||
<p className="text-xl font-bold text-primary">{quickViewMachine.priceLabel}</p>
|
||||
<Button type="primary" size="large" icon={<ShoppingCartOutlined/>}
|
||||
onClick={handleModalAddToCart}>
|
||||
<Button
|
||||
type="primary"
|
||||
size="large"
|
||||
icon={<ShoppingCartOutlined/>}
|
||||
onClick={handleModalAddToCart}
|
||||
>
|
||||
{t.machineActions.addToCart}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
@@ -95,8 +95,7 @@ export default function MapSection() {
|
||||
|
||||
<div className="grid lg:grid-cols-[1.3fr,1fr] gap-6">
|
||||
<div className="rounded-2xl overflow-hidden border border-subtle h-[360px] lg:h-auto min-h-[360px]">
|
||||
{/*<MapThumb coords={pins[0].coords} mapStyle={mapStyle} alt={pins[0].label} />*/}
|
||||
<Image src="/images/map.png" alt="روبات مارکت" width={600} height={600} className={"object-contain"} />
|
||||
<MapThumb coords={pins[0].coords} mapStyle={mapStyle} alt={pins[0].label}/>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-4">
|
||||
|
||||
@@ -0,0 +1,107 @@
|
||||
'use client';
|
||||
|
||||
import {useState} from 'react';
|
||||
import {Modal, Button, message} from 'antd';
|
||||
import {ShoppingCartOutlined, EyeOutlined} from '@ant-design/icons';
|
||||
import {useDispatch} from 'react-redux';
|
||||
import {useLanguage} from '@/app/context/LanguageContext';
|
||||
import {addToCart} from '@/store/cartSlice';
|
||||
|
||||
export default function MobileShowcase() {
|
||||
const dispatch = useDispatch();
|
||||
const {t, dir} = useLanguage();
|
||||
const [quickViewMachine, setQuickViewMachine] = useState(null);
|
||||
|
||||
const handleAddToCart = (machine) => {
|
||||
dispatch(
|
||||
addToCart({
|
||||
id: machine.id,
|
||||
name: machine.name,
|
||||
priceNumeric: machine.priceNumeric,
|
||||
priceLabel: machine.priceLabel,
|
||||
image: machine.image,
|
||||
})
|
||||
);
|
||||
message.success(t.cart.addToast(machine.name));
|
||||
};
|
||||
|
||||
const handleModalAddToCart = () => {
|
||||
if (!quickViewMachine) return;
|
||||
handleAddToCart(quickViewMachine);
|
||||
setQuickViewMachine(null);
|
||||
};
|
||||
|
||||
return (
|
||||
<section id="showcase" className="relative w-full py-8 px-4" dir={dir}>
|
||||
<div className="flex flex-col gap-4">
|
||||
{t.machines.map((machine) => (
|
||||
<div
|
||||
key={machine.id}
|
||||
className="flex gap-4 items-center bg-surface border border-subtle rounded-2xl p-4"
|
||||
>
|
||||
<img
|
||||
src={machine.image}
|
||||
alt={machine.name}
|
||||
className="w-24 h-24 object-contain shrink-0"
|
||||
onClick={() => setQuickViewMachine(machine)}
|
||||
/>
|
||||
|
||||
<div className="flex flex-col gap-1.5 min-w-0 flex-1">
|
||||
<span className="text-brand-400 text-xs font-semibold tracking-wide">
|
||||
{machine.shortLabel}
|
||||
</span>
|
||||
<h3 className="text-lg font-bold text-primary truncate">
|
||||
{machine.name}
|
||||
</h3>
|
||||
<p className="text-sm text-secondary line-clamp-2">
|
||||
{machine.description}
|
||||
</p>
|
||||
<p className="text-base font-bold text-primary mt-1">
|
||||
{machine.priceLabel}
|
||||
</p>
|
||||
|
||||
<div className="flex justify-start items-center mt-3">
|
||||
<Button
|
||||
type="primary"
|
||||
size="middle"
|
||||
icon={<ShoppingCartOutlined/>}
|
||||
onClick={() => handleAddToCart(machine)}
|
||||
>
|
||||
{t.machineActions.addToCart}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<Modal
|
||||
open={!!quickViewMachine}
|
||||
onCancel={() => setQuickViewMachine(null)}
|
||||
footer={null}
|
||||
centered
|
||||
title={quickViewMachine?.name}
|
||||
>
|
||||
{quickViewMachine && (
|
||||
<div className="flex flex-col gap-4">
|
||||
<img
|
||||
src={quickViewMachine.image}
|
||||
alt={quickViewMachine.name}
|
||||
className="w-full h-64 object-contain"
|
||||
/>
|
||||
<p className="text-secondary leading-7">{quickViewMachine.description}</p>
|
||||
<p className="text-xl font-bold text-primary">{quickViewMachine.priceLabel}</p>
|
||||
<Button
|
||||
type="primary"
|
||||
size="large"
|
||||
icon={<ShoppingCartOutlined/>}
|
||||
onClick={handleModalAddToCart}
|
||||
>
|
||||
{t.machineActions.addToCart}
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</Modal>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,28 @@
|
||||
'use client';
|
||||
|
||||
import {useEffect, useState} from 'react';
|
||||
import HorizontalShowcase from './HorizontalShowcase';
|
||||
import MobileShowcase from './MobileShowcase';
|
||||
|
||||
const MOBILE_BREAKPOINT = 768;
|
||||
|
||||
export default function ShowcaseSection() {
|
||||
const [isMobile, setIsMobile] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
const mediaQuery = window.matchMedia(
|
||||
`(max-width: ${MOBILE_BREAKPOINT - 1}px)`
|
||||
);
|
||||
|
||||
const handleChange = (event) => setIsMobile(event.matches);
|
||||
|
||||
setIsMobile(mediaQuery.matches);
|
||||
mediaQuery.addEventListener('change', handleChange);
|
||||
|
||||
return () => mediaQuery.removeEventListener('change', handleChange);
|
||||
}, []);
|
||||
|
||||
if (isMobile === null) return null;
|
||||
|
||||
return isMobile ? <MobileShowcase/> : <HorizontalShowcase/>;
|
||||
}
|
||||
@@ -1,11 +1,9 @@
|
||||
'use client';
|
||||
|
||||
// کارت نمایش هر دستگاه داخل ویترین: شامل جلوه اسپاتلایت (هاور روی عکس دستگاه رنگ جایگزین را نشان میدهد)،
|
||||
// آیتمهای شناور، گیف+توضیحات، و دکمههای افزودن به سبد / مشاهده سریع / علاقهمندی.
|
||||
|
||||
import { useRef, useState } from 'react';
|
||||
import { Button, Tooltip, message } from 'antd';
|
||||
import { ShoppingCartOutlined, EyeOutlined, HeartOutlined, HeartFilled } from '@ant-design/icons';
|
||||
import {useRef} from 'react';
|
||||
import {Button, message} from 'antd';
|
||||
import {ShoppingCartOutlined, EyeOutlined} from '@ant-design/icons';
|
||||
import {useDispatch} from 'react-redux';
|
||||
import {addToCart} from '@/store/cartSlice';
|
||||
import {useLanguage} from '@/app/context/LanguageContext';
|
||||
@@ -15,7 +13,6 @@ import { floatingSnacks } from '@/data/content';
|
||||
export default function VendingCard({machine, onQuickView}) {
|
||||
const dispatch = useDispatch();
|
||||
const {t, dir} = useLanguage();
|
||||
const [wishlisted, setWishlisted] = useState(false);
|
||||
const stageRef = useRef(null);
|
||||
const lensRef = useRef(null);
|
||||
const revealRef = useRef(null);
|
||||
@@ -54,12 +51,12 @@ export default function VendingCard({ machine, onQuickView }) {
|
||||
|
||||
return (
|
||||
<div className="horizontal-panel flex items-center justify-center px-6 md:px-16" dir={dir}>
|
||||
<div className="relative z-10 max-w-6xl w-full grid md:grid-cols-2 gap-10 items-center">
|
||||
<div className="relative z-10 max-w-6xl w-full grid md:grid-cols-2 gap-0 md:gap-10 items-center">
|
||||
<div
|
||||
ref={stageRef}
|
||||
onMouseMove={handleMouseMove}
|
||||
onMouseLeave={handleMouseLeave}
|
||||
className="spotlight-stage relative h-[420px] md:h-[560px] flex items-center justify-center"
|
||||
className="spotlight-stage relative h-48 md:h-[500px] flex items-center justify-center"
|
||||
>
|
||||
<FloatingItems items={floatingSnacks}/>
|
||||
|
||||
@@ -72,27 +69,30 @@ export default function VendingCard({ machine, onQuickView }) {
|
||||
/>
|
||||
<div ref={lensRef} className="spotlight-lens"/>
|
||||
|
||||
<span className="absolute top-3 z-30 text-[11px] px-3 py-1 rounded-full bg-brand/15 border border-subtle text-brand-400 start-3">
|
||||
<span
|
||||
className="absolute hidden md:block top-3 z-30 text-[11px] px-3 py-1 rounded-full bg-brand/15 border border-subtle text-brand-400 start-3">
|
||||
{t.machineActions.hoverHint}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-5">
|
||||
<div className="flex flex-col justify-center items-center gap-5 ">
|
||||
<span className="text-brand-400 text-sm font-semibold tracking-wide">{machine.shortLabel}</span>
|
||||
<h3 className="text-2xl md:text-4xl font-extrabold text-primary">{machine.name}</h3>
|
||||
|
||||
<div className="grid grid-cols-[auto,1fr] gap-4 items-start bg-surface border border-subtle rounded-2xl p-4">
|
||||
<div
|
||||
className="grid grid-cols-[auto,1fr] gap-4 items-start bg-surface border border-subtle rounded-2xl p-4">
|
||||
<img
|
||||
src={machine.gif}
|
||||
alt={t.machineActions.gifAlt(machine.name)}
|
||||
className="w-28 h-20 md:w-32 md:h-24 object-cover rounded-lg border border-subtle"
|
||||
className="w-28 h-14 md:w-32 md:h-24 object-cover rounded-lg border border-subtle"
|
||||
/>
|
||||
<p className="text-sm md:text-base text-secondary leading-7">{machine.description}</p>
|
||||
<p className="text-sm md:text-base text-secondary md:leading-7">{machine.description}</p>
|
||||
</div>
|
||||
|
||||
<ul className="flex flex-wrap gap-2">
|
||||
{machine.highlights.map((h) => (
|
||||
<li key={h} className="text-xs md:text-sm text-brand-400 bg-brand/10 border border-subtle rounded-full px-3 py-1">
|
||||
<li key={h}
|
||||
className="text-xs md:text-sm text-brand-400 bg-brand/10 border border-subtle rounded-full px-3 py-1">
|
||||
{h}
|
||||
</li>
|
||||
))}
|
||||
@@ -100,21 +100,13 @@ export default function VendingCard({ machine, onQuickView }) {
|
||||
|
||||
<p className="text-xl md:text-2xl font-bold text-primary mt-2">{machine.priceLabel}</p>
|
||||
|
||||
<div className="flex flex-wrap items-center gap-3 mt-2">
|
||||
<div className="flex flex-wrap items-center gap-2 mt-2 ">
|
||||
<Button type="primary" size="large" icon={<ShoppingCartOutlined/>} onClick={handleAddToCart}>
|
||||
{t.machineActions.addToCart}
|
||||
</Button>
|
||||
<Button size="large" icon={<EyeOutlined/>} onClick={() => onQuickView?.(machine)}>
|
||||
{t.machineActions.quickView}
|
||||
</Button>
|
||||
<Tooltip title={wishlisted ? t.machineActions.wishlistRemove : t.machineActions.wishlistAdd}>
|
||||
<Button
|
||||
size="large"
|
||||
shape="circle"
|
||||
icon={wishlisted ? <HeartFilled className="text-brand-400" /> : <HeartOutlined />}
|
||||
onClick={() => setWishlisted((v) => !v)}
|
||||
/>
|
||||
</Tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -13,8 +13,8 @@ const machinesFa = [
|
||||
priceNumeric: 3860000000,
|
||||
description: 'یخچالدار، ۳۵ کانال اختصاصی، سیستم خنککننده قدرتمند، تحویل نرم، مدیریت آنلاین ۲۴ ساعته.',
|
||||
highlights: ['یخچالدار', '۳۵ کانال اختصاصی', 'تحویل نرم', 'مدیریت آنلاین ۲۴ ساعته'],
|
||||
image: '/images/machine-35-base.png',
|
||||
imageAlt: '/images/machine-35-white.png',
|
||||
image: '/images/machine-35-base.webp',
|
||||
imageAlt: '/images/machine-35-white.webp',
|
||||
gif: '/gifs/machine-35.gif',
|
||||
},
|
||||
{
|
||||
@@ -25,8 +25,8 @@ const machinesFa = [
|
||||
priceNumeric: 4480000000,
|
||||
description: 'یخچالدار، ۴۸ کانال اختصاصی، قابلیتهای پیشرفته مدیریت آنلاین و تحویل کالا.',
|
||||
highlights: ['یخچالدار', '۴۸ کانال اختصاصی', 'مدیریت آنلاین پیشرفته', 'تحویل هوشمند کالا'],
|
||||
image: '/images/machine-48-base.png',
|
||||
imageAlt: '/images/machine-48-white.png',
|
||||
image: '/images/machine-48-base.webp',
|
||||
imageAlt: '/images/machine-48-white.webp',
|
||||
gif: '/gifs/machine-48.gif',
|
||||
},
|
||||
{
|
||||
@@ -37,8 +37,8 @@ const machinesFa = [
|
||||
priceNumeric: 4980000000,
|
||||
description: 'یخچالدار، ۶۰ کانال اختصاصی برای کسبوکارهای پرتردد.',
|
||||
highlights: ['یخچالدار', '۶۰ کانال اختصاصی', 'مناسب اماکن پرتردد', 'ظرفیت بالا'],
|
||||
image: '/images/machine-60-base.png',
|
||||
imageAlt: '/images/machine-60-white.png',
|
||||
image: '/images/machine-60-base.webp',
|
||||
imageAlt: '/images/machine-60-white.webp',
|
||||
gif: '/gifs/machine-60.gif',
|
||||
},
|
||||
];
|
||||
@@ -52,8 +52,8 @@ const machinesEn = [
|
||||
priceNumeric: 3860000000,
|
||||
description: 'Refrigerated, 35 dedicated channels, powerful cooling system, soft delivery, 24/7 online management.',
|
||||
highlights: ['Refrigerated', '35 dedicated channels', 'Soft delivery', '24/7 online management'],
|
||||
image: '/images/machine-35-base.png',
|
||||
imageAlt: '/images/machine-35-white.png',
|
||||
image: '/images/machine-35-base.webp',
|
||||
imageAlt: '/images/machine-35-white.webp',
|
||||
gif: '/gifs/machine-35.gif',
|
||||
},
|
||||
{
|
||||
@@ -64,8 +64,8 @@ const machinesEn = [
|
||||
priceNumeric: 4480000000,
|
||||
description: 'Refrigerated, 48 dedicated channels, advanced online management and delivery capabilities.',
|
||||
highlights: ['Refrigerated', '48 dedicated channels', 'Advanced online management', 'Smart delivery'],
|
||||
image: '/images/machine-48-base.png',
|
||||
imageAlt: '/images/machine-48-white.png',
|
||||
image: '/images/machine-48-base.webp',
|
||||
imageAlt: '/images/machine-48-white.webp',
|
||||
gif: '/gifs/machine-48.gif',
|
||||
},
|
||||
{
|
||||
@@ -76,8 +76,8 @@ const machinesEn = [
|
||||
priceNumeric: 4980000000,
|
||||
description: 'Refrigerated, 60 dedicated channels for high-traffic businesses.',
|
||||
highlights: ['Refrigerated', '60 dedicated channels', 'Ideal for high-traffic venues', 'High capacity'],
|
||||
image: '/images/machine-60-base.png',
|
||||
imageAlt: '/images/machine-60-white.png',
|
||||
image: '/images/machine-60-base.webp',
|
||||
imageAlt: '/images/machine-60-white.webp',
|
||||
gif: '/gifs/machine-60.gif',
|
||||
},
|
||||
];
|
||||
@@ -112,21 +112,21 @@ export const content = {
|
||||
kicker: 'روبات مارکت',
|
||||
titleLines: ['فروش خودکار،', 'هوشمند و بیوقفه'],
|
||||
sub: 'تجربهای نوین از خرید آسان و سریع با دستگاههای وندینگ روبات مارکت.',
|
||||
image: '/images/machine-slide-0.png',
|
||||
image: '/images/machine-slide-0.webp',
|
||||
},
|
||||
{
|
||||
id: 'slide-2',
|
||||
kicker: 'یخچالدار',
|
||||
titleLines: ['خنککننده قدرتمند،', 'کیفیت تضمینی'],
|
||||
sub: 'نگهداری اصولی تنقلات و نوشیدنی سرد، ۲۴ ساعته و بدون نیاز به نیروی انسانی.',
|
||||
image: '/images/machine-slide-1.png',
|
||||
image: '/images/machine-slide-1.webp',
|
||||
},
|
||||
{
|
||||
id: 'slide-3',
|
||||
kicker: 'مدیریت آنلاین',
|
||||
titleLines: ['کنترل کامل کسبوکار', 'از راه دور'],
|
||||
sub: 'مدیریت موجودی، فروش و گزارشگیری آنلاین، هر ساعت از شبانهروز.',
|
||||
image: '/images/machine-slide-2.png',
|
||||
image: '/images/machine-slide-2.webp',
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -402,21 +402,21 @@ export const content = {
|
||||
kicker: 'Robot Market',
|
||||
titleLines: ['Automated selling,', 'smart & non-stop'],
|
||||
sub: 'A new experience of fast, easy shopping with Robot Market vending machines.',
|
||||
image: '/images/machine-slide-0.png',
|
||||
image: '/images/machine-slide-0.webp',
|
||||
},
|
||||
{
|
||||
id: 'slide-2',
|
||||
kicker: 'Refrigerated',
|
||||
titleLines: ['Powerful cooling,', 'guaranteed quality'],
|
||||
sub: 'Proper storage for snacks and cold drinks, 24/7, with no staff required.',
|
||||
image: '/images/machine-slide-1.png',
|
||||
image: '/images/machine-slide-1.webp',
|
||||
},
|
||||
{
|
||||
id: 'slide-3',
|
||||
kicker: 'Online Management',
|
||||
titleLines: ['Full control of your', 'business, remotely'],
|
||||
sub: 'Manage inventory, sales, and reports online, any hour of the day.',
|
||||
image: '/images/machine-slide-2.png',
|
||||
image: '/images/machine-slide-2.webp',
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -667,12 +667,12 @@ export const content = {
|
||||
|
||||
// Locale-independent asset config (positions/paths only — same in both languages).
|
||||
export const floatingSnacks = [
|
||||
{id: 'chips-1', image: '/images/snacks/item-1.png', size: 125, top: '5%', left: '-5%', duration: 5.5, delay: 0},
|
||||
{id: 'soda-1', image: '/images/snacks/item-2.png', size: 85, top: '68%', left: '2%', duration: 6.2, delay: 0.6},
|
||||
{id: 'chips-2', image: '/images/snacks/item-3.png', size: 95, top: '10%', left: '85%', duration: 4.8, delay: 0.3},
|
||||
{id: 'soda-2', image: '/images/snacks/item-4.png', size: 105, top: '72%', left: '88%', duration: 5.9, delay: 0.9},
|
||||
{id: 'chips-3', image: '/images/snacks/item-5.png', size: 90, top: '42%', left: '90%', duration: 6.6, delay: 1.2},
|
||||
{id: 'soda-3', image: '/images/snacks/item-6.png', size: 95, top: '46%', left: '-4%', duration: 5.1, delay: 1.5},
|
||||
{id: 'chips-1', image: '/images/snacks/item-1.webp', size: 60, top: '5%', left: '-5%', duration: 5.5, delay: 0},
|
||||
{id: 'soda-1', image: '/images/snacks/item-2.webp', size: 55, top: '68%', left: '2%', duration: 6.2, delay: 0.6},
|
||||
{id: 'chips-2', image: '/images/snacks/item-3.webp', size: 65, top: '10%', left: '85%', duration: 4.8, delay: 0.3},
|
||||
{id: 'soda-2', image: '/images/snacks/item-4.webp', size: 55, top: '72%', left: '88%', duration: 5.9, delay: 0.9},
|
||||
{id: 'chips-3', image: '/images/snacks/item-5.webp', size: 50, top: '42%', left: '90%', duration: 6.6, delay: 1.2},
|
||||
{id: 'soda-3', image: '/images/snacks/item-6.webp', size: 55, top: '46%', left: '-4%', duration: 5.1, delay: 1.5},
|
||||
];
|
||||
|
||||
export const showcaseVideoSrc = '/video/showcase-placeholder.mp4';
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
[{"eventName":"NEXT_CLI_SESSION_STOPPED","payload":{"nextVersion":"14.2.5","nodeVersion":"v26.3.0","cliCommand":"dev","durationMilliseconds":263824,"turboFlag":false,"pagesDir":false,"appDir":true}}]
|
||||
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"pages": {}
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
{
|
||||
"polyfillFiles": [
|
||||
"static/chunks/polyfills.js"
|
||||
],
|
||||
"devFiles": [],
|
||||
"ampDevFiles": [],
|
||||
"lowPriorityFiles": [
|
||||
"static/development/_buildManifest.js",
|
||||
"static/development/_ssgManifest.js"
|
||||
],
|
||||
"rootMainFiles": [],
|
||||
"pages": {
|
||||
"/_app": []
|
||||
},
|
||||
"ampFirstPages": []
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
{"type": "commonjs"}
|
||||
@@ -0,0 +1 @@
|
||||
{}
|
||||
@@ -0,0 +1 @@
|
||||
{}
|
||||
@@ -0,0 +1 @@
|
||||
self.__INTERCEPTION_ROUTE_REWRITE_MANIFEST="[]"
|
||||
@@ -0,0 +1 @@
|
||||
self.__BUILD_MANIFEST={"polyfillFiles":["static/chunks/polyfills.js"],"devFiles":[],"ampDevFiles":[],"lowPriorityFiles":["static/development/_buildManifest.js","static/development/_ssgManifest.js"],"rootMainFiles":[],"pages":{"/_app":[]},"ampFirstPages":[]}
|
||||
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"version": 3,
|
||||
"middleware": {},
|
||||
"functions": {},
|
||||
"sortedMiddleware": []
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
self.__REACT_LOADABLE_MANIFEST="{}"
|
||||
@@ -0,0 +1 @@
|
||||
self.__NEXT_FONT_MANIFEST="{\"pages\":{},\"app\":{},\"appUsingSizeAdjust\":false,\"pagesUsingSizeAdjust\":false}"
|
||||
@@ -0,0 +1 @@
|
||||
{"pages":{},"app":{},"appUsingSizeAdjust":false,"pagesUsingSizeAdjust":false}
|
||||
@@ -0,0 +1 @@
|
||||
{}
|
||||
@@ -0,0 +1 @@
|
||||
self.__RSC_SERVER_MANIFEST="{\n \"node\": {},\n \"edge\": {},\n \"encryptionKey\": \"OV7lo+xPvS/sDjLEddseUuhg7MfbZYxNg/IFGVNi66w=\"\n}"
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"node": {},
|
||||
"edge": {},
|
||||
"encryptionKey": "OV7lo+xPvS/sDjLEddseUuhg7MfbZYxNg/IFGVNi66w="
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
self.__BUILD_MANIFEST = {__rewrites:{afterFiles:[],beforeFiles:[],fallback:[]},sortedPages:["\u002F_app"]};self.__BUILD_MANIFEST_CB && self.__BUILD_MANIFEST_CB()
|
||||
@@ -0,0 +1 @@
|
||||
self.__SSG_MANIFEST=new Set;self.__SSG_MANIFEST_CB&&self.__SSG_MANIFEST_CB()
|
||||
@@ -0,0 +1 @@
|
||||
{"type": "module"}
|
||||
@@ -1,8 +1,21 @@
|
||||
/** @type {import('next').NextConfig} */
|
||||
|
||||
const basePath = process.env.NEXT_PUBLIC_BASE_PATH || '';
|
||||
|
||||
const nextConfig = {
|
||||
reactStrictMode: true,
|
||||
// AntD ships CJS + uses some patterns that benefit from transpilation in the App Router.
|
||||
transpilePackages: ['antd', '@ant-design/icons', 'rc-util', 'rc-pagination', 'rc-picker'],
|
||||
|
||||
|
||||
output: 'export',
|
||||
|
||||
images: {unoptimized: true},
|
||||
|
||||
trailingSlash: true,
|
||||
|
||||
basePath: basePath || undefined,
|
||||
assetPrefix: basePath || undefined,
|
||||
};
|
||||
|
||||
module.exports = nextConfig;
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
"dev": "next dev -H 0.0.0.0",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "next lint"
|
||||
|
||||
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 382 KiB |
|
After Width: | Height: | Size: 121 KiB |
|
After Width: | Height: | Size: 231 KiB |
|
Before Width: | Height: | Size: 1.6 MiB |
|
After Width: | Height: | Size: 231 KiB |
|
Before Width: | Height: | Size: 382 KiB |
|
After Width: | Height: | Size: 121 KiB |
|
Before Width: | Height: | Size: 1.6 MiB |
|
After Width: | Height: | Size: 230 KiB |
|
Before Width: | Height: | Size: 382 KiB |
|
After Width: | Height: | Size: 121 KiB |
|
Before Width: | Height: | Size: 1.6 MiB |
|
After Width: | Height: | Size: 229 KiB |
|
Before Width: | Height: | Size: 1.7 MiB |
|
After Width: | Height: | Size: 99 KiB |
|
Before Width: | Height: | Size: 2.7 MiB |
|
After Width: | Height: | Size: 325 KiB |
|
Before Width: | Height: | Size: 290 KiB |
|
After Width: | Height: | Size: 64 KiB |
|
Before Width: | Height: | Size: 2.7 MiB |
|
After Width: | Height: | Size: 354 KiB |
|
Before Width: | Height: | Size: 2.0 MiB |
|
Before Width: | Height: | Size: 1.4 MiB |
|
After Width: | Height: | Size: 86 KiB |
|
Before Width: | Height: | Size: 821 KiB |
|
Before Width: | Height: | Size: 316 KiB |
|
After Width: | Height: | Size: 231 KiB |
|
Before Width: | Height: | Size: 2.1 MiB |
|
After Width: | Height: | Size: 228 KiB |
|
Before Width: | Height: | Size: 2.4 MiB |
|
Before Width: | Height: | Size: 2.3 MiB |
|
Before Width: | Height: | Size: 2.6 MiB |
|
Before Width: | Height: | Size: 395 KiB |
|
After Width: | Height: | Size: 289 KiB |
|
Before Width: | Height: | Size: 178 KiB |
|
After Width: | Height: | Size: 128 KiB |
|
Before Width: | Height: | Size: 142 KiB |
|
After Width: | Height: | Size: 104 KiB |
|
Before Width: | Height: | Size: 179 KiB |
|
After Width: | Height: | Size: 70 KiB |
|
Before Width: | Height: | Size: 102 KiB |
|
After Width: | Height: | Size: 75 KiB |
|
Before Width: | Height: | Size: 2.3 MiB |
|
After Width: | Height: | Size: 235 KiB |
|
Before Width: | Height: | Size: 2.1 MiB |
|
After Width: | Height: | Size: 316 KiB |
|
Before Width: | Height: | Size: 2.1 MiB |
|
After Width: | Height: | Size: 232 KiB |