All files / lib/pages/PlayLog/Modal ScoreModal.tsx

0% Statements 0/11
0% Branches 0/4
0% Functions 0/4
0% Lines 0/10

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83                                                                                                                                                                     
import { useGetUserScoresByPlayLogId } from '@lib/api/queries';
import useModalState from '@lib/hooks/useModalState';
import { UserScoreLogDto } from '@uniquegood/realworld-adventure-interface';
import { Button, Modal, ModalProps, Table } from 'antd';
import { ColumnsType } from 'antd/es/table';
import dayjs from 'dayjs';
import React from 'react';
import DeductionModal from './DeductionModal';
 
interface ScoreModalProps {
  modalData: ModalProps;
  closeModal: () => unknown;
  playLogId: string;
}
 
export default function ScoreModal({ modalData, closeModal, playLogId }: ScoreModalProps) {
  const {
    openModal: openDeductionModal,
    closeModal: closeDeductionModal,
    modal: deductionModal
  } = useModalState();
 
  const [selectedData, setSelectedData] = React.useState<UserScoreLogDto>();
 
  const { data: userScoreLogs, isLoading } = useGetUserScoresByPlayLogId(playLogId);
 
  const columns: ColumnsType<UserScoreLogDto> = [
    {
      key: 'id',
      dataIndex: 'id',
      title: 'ID'
    },
    {
      key: 'note',
      dataIndex: 'note',
      title: '메모'
    },
    {
      key: 'score',
      dataIndex: 'score',
      title: '점수'
    },
    {
      key: 'createdAt',
      dataIndex: 'createdAt',
      title: '생성일',
      render: (value) => (value ? dayjs(value).format('YYYY-MM-DD HH:mm:ss') : '')
    }
  ];
 
  return (
    <>
      <Modal
        title="플레이 로그 점수 조회"
        width={1000}
        footer={[<Button onClick={closeModal}>닫기</Button>]}
        {...modalData}
      >
        <Table
          columns={columns}
          dataSource={userScoreLogs?.data}
          loading={isLoading}
          pagination={false}
          onRow={(record) => ({
            onClick: () => {
              if (record.parentId) return;
 
              setSelectedData(record);
 
              openDeductionModal({});
            }
          })}
        />
      </Modal>
      <DeductionModal
        modalData={deductionModal}
        closeModal={closeDeductionModal}
        data={selectedData}
      />
    </>
  );
}