comments list

src/pages/comments/List.tsx

@@ -0,0 +1,221 @@
+import { type FC, useState } from 'react'
+import Table from '@/components/Table'
+import Filters from '@/components/Filters'
+import Switch from '@/components/Switch'
+import { Eye } from 'iconsax-react'
+import type { RowDataType, ActionType } from '@/components/types/TableTypes'
+import type { FilterValues } from '@/components/Filters'
+import { Link } from 'react-router-dom'
+import { Pages } from '@/config/Pages'
+import moment from 'moment-jalaali'
+
+interface CommentData extends RowDataType {
+    id: number
+    number: string
+    customerName: string
+    strengths: string
+    weaknesses: string
+    food: string
+    date: string
+    isDisplayed: boolean
+}
+
+const CommentsList: FC = () => {
+    const [currentPage, setCurrentPage] = useState(1)
+    const totalPages = 2
+
+    const handlePageChange = (page: number) => {
+        setCurrentPage(page)
+    }
+
+    const handleFiltersChange = (newFilters: FilterValues) => {
+        console.log('فیلترها:', newFilters)
+    }
+
+    const handleRowActions = (item: CommentData): ActionType[] => {
+        return [
+            {
+                label: 'ویرایش',
+                onClick: () => {
+                    console.log('ویرایش کامنت:', item.id)
+                },
+            },
+            {
+                label: 'حذف',
+                onClick: () => {
+                    console.log('حذف کامنت:', item.id)
+                },
+            },
+        ]
+    }
+
+    const formatDate = (dateString: string): string => {
+        try {
+            const jalaliDate = moment(dateString, 'YYYY-MM-DD').format('jYYYY/jMM/jDD')
+            return `${jalaliDate}`
+        } catch {
+            return dateString
+        }
+    }
+
+    const handleDisplayToggle = (item: CommentData, value: boolean) => {
+        console.log('تغییر وضعیت نمایش کامنت:', item.id, value)
+    }
+
+    const columns = [
+        {
+            key: 'number',
+            title: 'شماره',
+        },
+        {
+            key: 'customerName',
+            title: 'نام و نام خانوادگی',
+        },
+        {
+            key: 'strengths',
+            title: 'نقاط قوت',
+        },
+        {
+            key: 'weaknesses',
+            title: 'نقاط ضعف',
+        },
+        {
+            key: 'food',
+            title: 'غذا',
+        },
+        {
+            key: 'date',
+            title: 'تاریخ',
+            render: (item: CommentData) => {
+                return <span>{formatDate(item.date)}</span>
+            },
+        },
+        {
+            key: 'isDisplayed',
+            title: 'نمایش',
+            render: (item: CommentData) => {
+                return (
+                    <Switch
+                        active={item.isDisplayed}
+                        onChange={(value) => handleDisplayToggle(item, value)}
+                    />
+                )
+            },
+        },
+        {
+            key: 'details',
+            title: 'جزییات',
+            render: (item: CommentData) => {
+                return (
+                    <Link to={Pages.comments.detail + item.id}>
+                        <Eye size={20} color="#8C90A3" />
+                    </Link>
+                )
+            },
+        },
+    ]
+
+    const data: CommentData[] = [
+        {
+            id: 1,
+            number: '۱۲۳۳۴',
+            customerName: 'حمید ضرغامی',
+            strengths: 'بهداشت محیطی خوب',
+            weaknesses: 'تنوع کم و محدود',
+            food: 'سالاد سزار ، پیتزا پیرونی',
+            date: '2024-11-01',
+            isDisplayed: true,
+        },
+        {
+            id: 2,
+            number: '۱۲۳۳۵',
+            customerName: 'محمد رضایی',
+            strengths: 'طعم عالی',
+            weaknesses: 'زمان تحویل طولانی',
+            food: 'برگر کلاسیک',
+            date: '2024-11-02',
+            isDisplayed: false,
+        },
+        {
+            id: 3,
+            number: '۱۲۳۳۶',
+            customerName: 'فاطمه احمدی',
+            strengths: 'بسته‌بندی مناسب',
+            weaknesses: 'گران قیمت',
+            food: 'سوشی مخصوص',
+            date: '2024-11-03',
+            isDisplayed: true,
+        },
+        {
+            id: 4,
+            number: '۱۲۳۳۷',
+            customerName: 'علی کریمی',
+            strengths: 'سرویس سریع',
+            weaknesses: 'کم بودن حجم غذا',
+            food: 'پاستا کربونارا',
+            date: '2024-11-04',
+            isDisplayed: true,
+        },
+        {
+            id: 5,
+            number: '۱۲۳۳۸',
+            customerName: 'زهرا محمودی',
+            strengths: 'کیفیت بالا',
+            weaknesses: 'محدودیت در انتخاب',
+            food: 'استیک گوشت',
+            date: '2024-11-05',
+            isDisplayed: false,
+        },
+        {
+            id: 6,
+            number: '۱۲۳۳۹',
+            customerName: 'حسن نوری',
+            strengths: 'ارزش غذایی مناسب',
+            weaknesses: 'بوی نامطبوع',
+            food: 'کباب ترکی',
+            date: '2024-11-06',
+            isDisplayed: true,
+        },
+    ]
+
+    return (
+        <div className='mt-5'>
+            <div className='flex justify-between items-center'>
+                <h1 className='text-lg font-light'>لیست کامنت‌ها</h1>
+            </div>
+
+            <div className='mt-8'>
+                <Filters
+                    fields={[
+                        {
+                            type: 'input',
+                            name: 'search',
+                            placeholder: 'جستجو',
+                        },
+                        {
+                            type: 'date',
+                            name: 'registrationDate',
+                            placeholder: 'تاریخ ثبت',
+                        },
+                    ]}
+                    onChange={handleFiltersChange}
+                    searchField="search"
+                />
+            </div>
+
+            <Table
+                columns={columns}
+                data={data}
+                selectable={true}
+                rowActions={handleRowActions}
+                pagination={{
+                    currentPage,
+                    totalPages,
+                    onPageChange: handlePageChange,
+                }}
+            />
+        </div>
+    )
+}
+
+export default CommentsList

src/router/Main.tsx

@@ -14,6 +14,7 @@ import CustomerDetails from '@/pages/customers/Details'
 import CreateCustomer from '@/pages/customers/Create'
 import OrdersList from '@/pages/orders/List'
 import OrderDetails from '@/pages/orders/Details'
+import CommentsList from '@/pages/comments/List'
 const MainRouter: FC = () => {
 
     const { hasSubMenu } = useSharedStore()
@@ -39,6 +40,7 @@ const MainRouter: FC = () => {
                             <Route path={Pages.customers.add} element={<CreateCustomer />} />
                             <Route path={Pages.orders.list} element={<OrdersList />} />
                             <Route path={Pages.orders.detail + ':id'} element={<OrderDetails />} />
+                            <Route path={Pages.comments.list} element={<CommentsList />} />
                         </Routes>
                     </div>
                 </div>