SriBondsTable.tsx 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172
  1. 'use client';
  2. import DataTable, { DataTableColumn } from '@/components/table/DataTable';
  3. import { SriBondRow } from '@/types/market';
  4. import { formatKrwCompact } from '@/lib/utils/stock';
  5. import { formatRatePercent } from '@/lib/utils/market';
  6. function buildColumns(): DataTableColumn<SriBondRow>[] {
  7. return [
  8. {
  9. key: 'name',
  10. header: '종목명',
  11. align: 'left',
  12. priority: 'high',
  13. cellClassName: 'data-table__cell--name',
  14. cell: (row) => (
  15. <span className='stock-cell'>
  16. <span className='stock-cell__name'>{row.name}</span>
  17. <span className='stock-cell__code'>{row.code}</span>
  18. </span>
  19. )
  20. },
  21. {
  22. key: 'issuer',
  23. header: '발행기관',
  24. align: 'left',
  25. priority: 'medium',
  26. cell: (row) => row.issuerName
  27. },
  28. {
  29. key: 'sriType',
  30. header: '유형',
  31. align: 'center',
  32. priority: 'medium',
  33. cell: (row) => <span className='market__cls-badge'>{row.sriBondType}</span>
  34. },
  35. {
  36. key: 'coupon',
  37. header: '표면금리',
  38. align: 'right',
  39. priority: 'high',
  40. cell: (row) => formatRatePercent(row.couponRate, 3)
  41. },
  42. {
  43. key: 'issueAmount',
  44. header: '발행액',
  45. align: 'right',
  46. priority: 'high',
  47. cell: (row) => formatKrwCompact(row.issueAmount)
  48. },
  49. {
  50. key: 'redemption',
  51. header: '상환일',
  52. align: 'center',
  53. priority: 'low',
  54. cell: (row) => row.redemptionDate || '—'
  55. }
  56. ];
  57. }
  58. export default function SriBondsTable({ rows }: { rows: SriBondRow[] })
  59. {
  60. return (
  61. <DataTable<SriBondRow>
  62. caption='SRI 채권 목록 — 종목명, 발행기관, 유형, 표면금리, 발행액, 상환일'
  63. columns={buildColumns()}
  64. rows={rows}
  65. rowKey={(row) => row.code}
  66. emptyMessage='표시할 SRI 채권이 없습니다.'
  67. />
  68. );
  69. }