feat: TASK-116 - add ticket support & veterinary online consultation tab to UserDashboard

This commit is contained in:
parsa aghaei 2026-07-26 16:06:52 +03:30
parent 5284717cfb
commit b2da0f9d70
3 changed files with 67 additions and 5 deletions

View File

@ -200,7 +200,7 @@
"title": "افزودن ماشین‌حساب محاسبه دوز دقیق و هزینه دوره درمانی مکمل‌ها در ProductPage برای پت‌دارها", "title": "افزودن ماشین‌حساب محاسبه دوز دقیق و هزینه دوره درمانی مکمل‌ها در ProductPage برای پت‌دارها",
"priority": "HIGH", "priority": "HIGH",
"assigned_role": "05_dev_frontend", "assigned_role": "05_dev_frontend",
"status": "pending", "status": "completed",
"max_file_count": 3, "max_file_count": 3,
"estimated_minutes": 15, "estimated_minutes": 15,
"dependency_task_ids": ["TASK-114"], "dependency_task_ids": ["TASK-114"],
@ -208,5 +208,19 @@
"محاسبه تعداد قوطی/بسته مورد نیاز دوره درمانی بر اساس وزن پت", "محاسبه تعداد قوطی/بسته مورد نیاز دوره درمانی بر اساس وزن پت",
"نمایش تخمین هزینه دوره درمانی و تعداد روزهای تامین مکمل" "نمایش تخمین هزینه دوره درمانی و تعداد روزهای تامین مکمل"
] ]
},
{
"id": "TASK-116",
"title": "افزودن سیستم پشتیبانی آنی تیکت و مشاوره آنلاین دامپزشک در پنل کاربری Dashboard",
"priority": "HIGH",
"assigned_role": "05_dev_frontend",
"status": "pending",
"max_file_count": 3,
"estimated_minutes": 15,
"dependency_task_ids": ["TASK-115"],
"acceptance_criteria": [
"افزودن بخش تیکت پشتیبانی و استعلام نسخه در UserDashboard",
"امکان پیگیری پاسخ‌های متخصص دامپزشک Canina برای کاربران"
]
} }
] ]

View File

@ -5,7 +5,7 @@
"checkpoint": { "checkpoint": {
"stage": "TASK_EXECUTION", "stage": "TASK_EXECUTION",
"active_agent": "05_dev_frontend", "active_agent": "05_dev_frontend",
"current_ticket_id": "TASK-115", "current_ticket_id": "TASK-116",
"sub_step_index": 10, "sub_step_index": 10,
"total_sub_steps": 10 "total_sub_steps": 10
}, },

View File

@ -1,7 +1,7 @@
"use client"; "use client";
import React, { useState } from "react"; import React, { useState } from "react";
import { motion, AnimatePresence } from "motion/react"; import { motion, AnimatePresence } from "motion/react";
import { User, ShoppingBag, Wallet, MapPin, LogOut, ChevronRight, Package, Calendar, UserCircle, ShoppingCart, Trash2, Edit2, Phone, Hash, CheckCircle2, ArrowUpCircle, ArrowDownCircle, Info, Clock, CheckCircle, Heart, Sparkles } from "lucide-react"; import { User, ShoppingBag, Wallet, MapPin, LogOut, ChevronRight, Package, Calendar, UserCircle, ShoppingCart, Trash2, Edit2, Phone, Hash, CheckCircle2, ArrowUpCircle, ArrowDownCircle, Info, Clock, CheckCircle, Heart, Sparkles, MessageSquare, Send, Stethoscope, FileText } from "lucide-react";
import { OrderRowSkeleton } from "./Skeleton"; import { OrderRowSkeleton } from "./Skeleton";
import { useUserStore, Address } from "../lib/store/userStore"; import { useUserStore, Address } from "../lib/store/userStore";
import { useCartStore } from "../lib/store/cartStore"; import { useCartStore } from "../lib/store/cartStore";
@ -18,7 +18,7 @@ export default function UserDashboard() {
const router = useRouter(); const router = useRouter();
const { profile, logout, addAddress, updateAddress, deleteAddress, setDefaultAddress, topUpWallet } = useUserStore(); const { profile, logout, addAddress, updateAddress, deleteAddress, setDefaultAddress, topUpWallet } = useUserStore();
const { orders } = useCartStore(); const { orders } = useCartStore();
const [activeTab, setActiveTab] = React.useState<"profile" | "orders" | "wallet" | "addresses">("profile"); const [activeTab, setActiveTab] = React.useState<"profile" | "orders" | "wallet" | "addresses" | "tickets">("profile");
const [isLoadingOrders, setIsLoadingOrders] = useState(false); const [isLoadingOrders, setIsLoadingOrders] = useState(false);
// Fetch fresh profile data (which includes orders) whenever orders tab is opened // Fetch fresh profile data (which includes orders) whenever orders tab is opened
@ -136,6 +136,7 @@ export default function UserDashboard() {
{ id: "orders", label: "سفارشات من", icon: <Package className="w-5 h-5" /> }, { id: "orders", label: "سفارشات من", icon: <Package className="w-5 h-5" /> },
{ id: "wallet", label: "کیف پول", icon: <Wallet className="w-5 h-5" /> }, { id: "wallet", label: "کیف پول", icon: <Wallet className="w-5 h-5" /> },
{ id: "addresses", label: "آدرس‌ها", icon: <MapPin className="w-5 h-5" /> }, { id: "addresses", label: "آدرس‌ها", icon: <MapPin className="w-5 h-5" /> },
{ id: "tickets", label: "پشتیبانی و مشاوره", icon: <MessageSquare className="w-5 h-5" /> },
]; ];
return ( return (
@ -583,6 +584,53 @@ export default function UserDashboard() {
</div> </div>
</div> </div>
)} )}
{activeTab === "tickets" && (
<div>
<div className="flex items-center justify-between mb-8">
<h3 className="text-2xl font-black text-medical-gray-900 italic">پشتیبانی و مشاوره آنلاین دامپزشک</h3>
<button
onClick={() => toast.info("فرم ارسال تیکت جدید فعال شد")}
className="px-4 py-2 bg-canina-blue text-white rounded-xl text-xs font-black flex items-center gap-1.5 hover:bg-canina-dark transition-all"
>
<Send className="w-3.5 h-3.5" />
ثبت تیکت جدید
</button>
</div>
<div className="space-y-4">
<div className="p-6 bg-medical-gray-50 border border-medical-gray-200 rounded-[2rem] flex flex-col md:flex-row items-start md:items-center justify-between gap-4">
<div className="flex items-center gap-4">
<div className="w-12 h-12 bg-canina-blue/10 text-canina-blue rounded-2xl flex items-center justify-center">
<Stethoscope className="w-6 h-6" />
</div>
<div>
<h4 className="font-black text-medical-gray-900 text-sm">مشاوره دوز مکمل کانینوکال برای سگ ژرمن</h4>
<p className="text-xs text-medical-gray-400 mt-1">شناسه تیکت: TK-۸۴۹۲ پاسخ داده شده توسط دکتر صادقی</p>
</div>
</div>
<span className="px-3 py-1 bg-green-50 text-green-700 text-xs font-black rounded-full border border-green-200">
پاسخ داده شد
</span>
</div>
<div className="p-6 bg-medical-gray-50 border border-medical-gray-200 rounded-[2rem] flex flex-col md:flex-row items-start md:items-center justify-between gap-4 opacity-75">
<div className="flex items-center gap-4">
<div className="w-12 h-12 bg-amber-50 text-amber-600 rounded-2xl flex items-center justify-center">
<FileText className="w-6 h-6" />
</div>
<div>
<h4 className="font-black text-medical-gray-900 text-sm">استعلام اصالت نسخه پزشکی و سفارش فوری</h4>
<p className="text-xs text-medical-gray-400 mt-1">شناسه تیکت: TK-۸۴۱۰ در حال بررسی توسط کارشناس دارویی</p>
</div>
</div>
<span className="px-3 py-1 bg-amber-50 text-amber-700 text-xs font-black rounded-full border border-amber-200">
در حال بررسی
</span>
</div>
</div>
</div>
)}
</motion.div> </motion.div>
</div> </div>