feat add bill/student number confirm

src/components/bill/list.tsx

@@ -3,6 +3,7 @@ import {ColumnProps} from "@douyinfe/semi-ui/lib/es/table";
 import React, {useMemo, useState} from "react";
 import {useTranslation} from "react-i18next";
 import dayjs from "dayjs";
+import {IconCheckCircleStroked} from "@douyinfe/semi-icons";
 
 import MoneyFormat from "@/components/money-format.tsx";
 import {Card} from "@/components/card";
@@ -20,6 +21,15 @@ type BillListProps = {
     loading?: boolean;
     beforeTotalAmount?: React.ReactNode;
 }
+const CheckNumberCorrect = ({origin,confirmed}:{origin: string,confirmed?:string}) => {
+    if(origin == confirmed && origin){
+        return (<Space style={{marginTop:2,color:'green'}}><span>{origin}</span><IconCheckCircleStroked /></Space>)
+    }
+    return <div style={{lineHeight:1}}>
+        <div style={confirmed?{color:'red'}:{}}>{origin?.length ?origin: 'N/A'}</div>
+        {confirmed&&<Space style={{marginTop:2,color:'green'}}><span>{confirmed}</span><IconCheckCircleStroked /></Space>}
+    </div>
+}
 
 export const BillList: React.FC<BillListProps> = (props) => {
     const {t, i18n} = useTranslation()
@@ -69,12 +79,13 @@ export const BillList: React.FC<BillListProps> = (props) => {
                 title: t('base.student_number'),
                 dataIndex: 'student_number',
                 width: 150,
-                render: (value) => value?.length ?value: 'N/A'
+                render: (value,record) => (<CheckNumberCorrect origin={value} confirmed={record.student_number_confirm || 'test-confirm'} />)
             },
             {
                 title: t('base.bill_number'),
                 dataIndex: 'application_number',
                 width: 150,
+                render: (value,record) => (<CheckNumberCorrect origin={value} confirmed={value||record.application_number_confirm} />)
             },
             {
                 title: t('bill.title_initiated_paid_at'),
@@ -139,7 +150,7 @@ export const BillList: React.FC<BillListProps> = (props) => {
                 dataIndex: 'detail',
                 ellipsis: {showTitle: true},
                 width: 220,
-                render: (_, record) => (<div style={{fontSize: 13, lineHeight: 1.2}}>
+                render: (_, record) => (<div style={{fontSize: 13, lineHeight: 1.2,wordBreak:'break-all',maxWidth:'100%',whiteSpace:'normal'}}>
                     {record.details.map((it, idx) => (<div key={idx}>{it.bill_type}: <MoneyFormat money={it.amount}/></div>))}
                 </div>),
             },
@@ -148,7 +159,7 @@ export const BillList: React.FC<BillListProps> = (props) => {
                 dataIndex: '_detail',
                 ellipsis: {showTitle: true},
                 width: 220,
-                render: (_, record) => (<div style={{fontSize: 13, lineHeight: 1.2}}>
+                render: (_, record) => (<div style={{fontSize: 13, lineHeight: 1.2,wordBreak:'break-all',maxWidth:'100%',whiteSpace:'normal'}}>
                     {record.details.filter(s=>s.confirm_status == 'CONFIRMED').map((it) => (<div key={it.id}>{it.confirm_type}: <MoneyFormat money={it.amount}/></div>))}
                 </div>),
             },