diff --git a/src/components/alert/index.tsx b/src/components/alert/index.tsx
new file mode 100644
index 0000000..ab7dca1
--- /dev/null
+++ b/src/components/alert/index.tsx
@@ -0,0 +1,18 @@
+import {IconAlertCircle} from "@douyinfe/semi-icons";
+import React from "react";
+
+import './style.less'
+
+type AlertProps = {
+ message: React.ReactNode;
+}
+
+function Alert(props: AlertProps) {
+ if(!props.message) return null;
+ return
+
+ {props.message}
+
+}
+
+export default Alert
\ No newline at end of file
diff --git a/src/components/alert/style.less b/src/components/alert/style.less
new file mode 100644
index 0000000..134d6dd
--- /dev/null
+++ b/src/components/alert/style.less
@@ -0,0 +1,8 @@
+.alert-container{
+ display: flex;
+ align-items: center;
+ color:red;
+ .alert-text{
+ margin-left: 5px;
+ }
+}
\ No newline at end of file
diff --git a/src/components/bill/search-form.tsx b/src/components/bill/search-form.tsx
index 76bb9de..a81040e 100644
--- a/src/components/bill/search-form.tsx
+++ b/src/components/bill/search-form.tsx
@@ -5,6 +5,7 @@ import {useTranslation} from "react-i18next";
import {Card} from "@/components/card";
import {BillQueryParams} from "@/service/api/bill.ts";
import {useBillTypes} from "@/hooks/useBillTypes.ts";
+import {usePaymentChannels} from "@/hooks/usePaymentChannels.ts";
type SearchFormProps = {
onSearch?: (params: BillQueryParams) => void;
@@ -29,6 +30,7 @@ type SearchFormFields = {
}
const SearchForm: React.FC = (props) => {
const BillTypes = useBillTypes()
+ const { paymentChannelList } = usePaymentChannels()
const formSubmit = (value: SearchFormFields) => {
const params: BillQueryParams = {}
@@ -146,12 +148,11 @@ const SearchForm: React.FC = (props) => {
-
- FLYWIRE
- CBP
- PPS
-
+
void
@@ -20,24 +22,37 @@ export const ImportBillModal: React.FC = (props) => {
const [state, setState] = useSetState<{
loading?: boolean;
- open?: boolean
+ open?: boolean;
+ errorMessage?:string;
+ currentFile?: File;
+ paymentChannel?: string;
}>({})
const [records, setImportRecords] = useState([])
-
const closeModal = () => {
setImportRecords([])
- setState({open: false, loading: false})
+ setState({open: false, loading: false,errorMessage:undefined})
}
const onSubmit = () => {
+ if(!state.paymentChannel){
+ setState({errorMessage:'bill.import.error_require_payment_channel'})
+ return;
+ }
+ if(records.length == 0 || !state.currentFile){
+ setState({errorMessage:'bill.import.error_require_file'})
+ return;
+ }
setState({
- loading: true
+ loading: true,
+ errorMessage:undefined
})
- setTimeout(() => {
+ uploadBillingRecordFile(state.currentFile,state.paymentChannel).then(()=>{
closeModal()
props.onConfirm()
- }, 1000)
+ }).catch(e => {
+ setState({errorMessage: e.message,loading: false})
+ })
}
const onFileChange = ({fileList, currentFile}: OnChangeProps) => {
if (fileList.length == 0) {
@@ -53,6 +68,7 @@ export const ImportBillModal: React.FC = (props) => {
})
})
setImportRecords(records)
+ setState({currentFile:currentFile.fileInstance})
})
}
}
@@ -76,7 +92,11 @@ export const ImportBillModal: React.FC = (props) => {
textAlign: 'right'
}}>{t('bill.title_pay_channel')}:
-
+