danak/dzone-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

structure and home page and detail company

Browse Source
This commit is contained in:
hamid zarghami
2025-02-09 14:36:13 +03:30
commit 0341b836f7
111 changed files with 10674 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/transaction/List.tsx
+123
View File
@@ -0,0 +1,123 @@
import { ArrowRight, MoneyRecive, MoneySend } from 'iconsax-react'
import { FC } from 'react'
import { useTranslation } from 'react-i18next'
import Td from '../../components/Td'
import Detail from './components/Detail'
const TransactionList: FC = () => {
const { t } = useTranslation('global')
return (
<div className='mt-4'>
<div>
{t('transaction.transaction')}
</div>
<div className='mt-6 flex xl:gap-6 gap-1 justify-center'>
<div className='bg-white flex-1 rounded-2xl xl:p-6 py-2 px-4 xl:max-w-[253px]'>
<div className='flex xl:flex-row flex-col gap-2 items-center'>
<div className='size-8 bg-[#EEF0F7] rounded-full flex justify-center items-center'>
<MoneySend size={18} color='black' />
</div>
<div className='xl:text-xs text-[10px] text-[#101828]'>
{t('transaction.totao_deposit')}
</div>
</div>
<div className='mt-2 flex xl:flex-row flex-col gap-2 items-center'>
<div className='text-[#101828] xl:text-xs text-[10px]'>
۱۴۰,۰۰۰,۰۰۰ ریال
</div>
<div className='flex gap gap-0.5 px-2 py-1 bg-green-100 rounded-lg text-[10px] text-success'>
<ArrowRight size={12} color='#00BA4B' className='-rotate-45' />
<div>۳۰٪</div>
</div>
</div>
</div>
<div className='bg-white flex-1 rounded-2xl xl:p-6 py-2 px-4 xl:max-w-[253px]'>
<div className='flex xl:flex-row flex-col gap-2 items-center'>
<div className='size-8 bg-[#EEF0F7] rounded-full flex justify-center items-center'>
<MoneyRecive size={18} color='black' />
</div>
<div className='xl:text-xs text-[10px] text-[#101828]'>
{t('transaction.total_withdrawal')}
</div>
</div>
<div className='mt-2 flex xl:flex-row flex-col gap-2 items-center'>
<div className='text-[#101828] xl:text-xs text-[10px]'>
۱۴۰,۰۰۰,۰۰۰ ریال
</div>
<div className='flex gap gap-0.5 px-2 py-1 bg-green-100 rounded-lg text-[10px] text-success'>
<ArrowRight size={12} color='#00BA4B' className='-rotate-45' />
<div>۳۰٪</div>
</div>
</div>
</div>
<div className='bg-white flex-1 rounded-2xl xl:p-6 py-2 px-4 xl:max-w-[253px]'>
<div className='flex xl:flex-row flex-col gap-2 items-center'>
<div className='size-8 bg-[#EEF0F7] rounded-full flex xl:flex-row flex-col justify-center items-center'>
<MoneyRecive size={18} color='black' />
</div>
<div className='xl:text-xs text-[10px] text-[#101828]'>
{t('transaction.balance')}
</div>
</div>
<div className='mt-2 flex xl:flex-row flex-col gap-2 items-center'>
<div className='text-[#101828] xl:text-xs text-[10px]'>
۱۴۰,۰۰۰,۰۰۰ ریال
</div>
<div className='flex gap gap-0.5 px-2 py-1 text-red-400 rounded-lg text-[10px] bg-red-100'>
<ArrowRight size={12} color='red' className='rotate-45' />
<div>۳۰٪</div>
</div>
</div>
</div>
</div>
<div className='relative overflow-x-auto rounded-3xl mt-9 w-full'>
<table className='w-full text-sm '>
<thead className='thead'>
<tr>
<Td text={t('ticket.number')} />
<Td text={t('ticket.title')} />
<Td text={t('ticket.team')} />
<Td text={t('ticket.date')} />
<Td text={t('ticket.status')} />
<Td text={t('ticket.priority')} />
<Td text={t('ticket.detail')} />
<Td text={''} />
</tr>
</thead>
<tbody>
<tr className='tr'>
<Td text={t('ticket.number')} />
<Td text={t('ticket.title')} />
<Td text={t('ticket.team')} />
<Td text={t('ticket.date')} />
<Td text={t('ticket.status')} />
<Td text={t('ticket.priority')} />
<Td text={t('ticket.detail')} />
<Td text={''}>
<Detail
/>
</Td>
</tr>
<tr className='tr'>
<Td text={t('ticket.number')} />
<Td text={t('ticket.title')} />
<Td text={t('ticket.team')} />
<Td text={t('ticket.date')} />
<Td text={t('ticket.status')} />
<Td text={t('ticket.priority')} />
<Td text={t('ticket.detail')} />
<Td text={''} />
</tr>
</tbody>
</table>
</div>
</div>
)
}
export default TransactionList