From 5fea6f568d56c4ebb4ea550f21978605caad8d11 Mon Sep 17 00:00:00 2001 From: rahman Date: Tue, 24 May 2022 21:06:34 +0700 Subject: [PATCH] feat: create table in profile --- src/pages/Profile/Profile.js | 264 +++++++++++++++++++++++++++++------ src/store/transaction.js | 41 ++++-- 2 files changed, 255 insertions(+), 50 deletions(-) diff --git a/src/pages/Profile/Profile.js b/src/pages/Profile/Profile.js index 2f860b3..4ff74d0 100644 --- a/src/pages/Profile/Profile.js +++ b/src/pages/Profile/Profile.js @@ -66,13 +66,14 @@ export const Profile = observer(() => { await Promise.allSettled([ store.authentication.getProfile(), store.transaction.getDataHistoryTransaction(), + store.transaction.getDataHistoryCheckBill(), ]); await store.transaction.getDataHistoryTopUpProfile( store.authentication.profileData?.id ); modalLoader.setLoading(false); })(); - }, []); + }, [store.transaction.filterStart, store.transaction.filterEnd]); const handleRemoveFilter = async () => { store.transaction.filterStart = null; @@ -81,11 +82,11 @@ export const Profile = observer(() => { setFilterStart([]); setFilterEnd([]); //await store.transaction.getDataHistoryTransaction(); - actionFilter === true - ? await store.transaction.getDataHistoryTopUpProfile( - store.authentication.profileData?.id - ) - : await store.transaction.getDataHistoryTransaction(); + // actionFilter === true + // ? await store.transaction.getDataHistoryTopUpProfile( + // store.authentication.profileData?.id + // ) + // : await store.transaction.getDataHistoryTransaction(); store.transaction.visibleModalFilterTransaction = false; setAction(false); }; @@ -95,11 +96,11 @@ export const Profile = observer(() => { //form.resetFields(); store.transaction.filterEnd = null; store.transaction.visibleModalFilterTransaction = false; - actionFilter === true - ? await store.transaction.getDataHistoryTopUpProfile( - store.authentication.profileData?.id - ) - : await store.transaction.getDataHistoryTransaction(); + // actionFilter === true + // ? await store.transaction.getDataHistoryTopUpProfile( + // store.authentication.profileData?.id + // ) + // : await store.transaction.getDataHistoryTransaction(); setAction(false); //await store.transaction.getDataHistoryTransaction(); }; @@ -113,14 +114,14 @@ export const Profile = observer(() => { "YYYY-MM-DD HH:mm:ss" ); modalLoader.setLoading(true); - actionFilter === true - ? await store.transaction.getDataHistoryTopUpProfile( - store.authentication.profileData?.id - ) - : await store.transaction.getDataHistoryTransaction(); + // actionFilter === true + // ? await store.transaction.getDataHistoryTopUpProfile( + // store.authentication.profileData?.id + // ) + // : await store.transaction.getDataHistoryTransaction(); modalLoader.setLoading(false); - store.transaction.filterStart = null; - store.transaction.filterEnd = null; + // store.transaction.filterStart = null; + // store.transaction.filterEnd = null; //form.resetFields(); store.transaction.visibleModalFilterTransaction = false; setAction(false); @@ -194,15 +195,15 @@ export const Profile = observer(() => { record.status === 1 ? "success" : record.status === 0 - ? "warning" - : "processing" + ? "warning" + : "processing" } > {record.status === 1 ? "Sukses" : record.status === 0 - ? "Dalam Proses" - : "Gagal"} + ? "Dalam Proses" + : "Gagal"} ); }, @@ -266,18 +267,93 @@ export const Profile = observer(() => { }, }, ]; + + const columnBill = [ + { + title: "Code Product", + dataIndex: "product_code", + key: "product_code", + }, + { + title: "Admin Price", + dataIndex: "admin_price", + key: "admin_price", + render: (text) => + new Intl.NumberFormat("id-ID", { + style: "currency", + currency: "IDR", + }).format(text), + }, + { + title: "Tagihan BPJS", + dataIndex: "amount", + key: "amount", + }, + { + title: "Nomor tujuan", + dataIndex: "destination", + key: "destination", + }, + { + title: "Transaction Id", + dataIndex: "trx_id", + key: "trx_id", + }, + { + title: "Partner Transaction Id", + dataIndex: "partner_trx_id", + key: "partner_trx_id", + }, + { + title: "Tanggal Transaksi", + dataIndex: "createdAt", + key: "createdAt", + render: (text, record) => { + return ( + + {format(parseISO(record.createdAt), "dd MMMM yyyy HH:mm:ss")} + + ); + }, + }, + { + title: "Status", + dataIndex: "status", + key: "status", + render: (text, record) => { + console.log("status", record) + return ( + + {record.status === "SUCCESS" + ? "Sukses" + : record.status === 0 + ? "Dalam Proses" + : "Gagal"} + + ); + }, + }, + ]; const styleSaldoTitle = store.ui.mediaQuery.isDesktop ? { - display: "flex", - justifyContent: "center", - } + display: "flex", + justifyContent: "center", + } : { fontSize: "0.75rem" }; const styleSaldoContent = store.ui.mediaQuery.isDesktop ? { - fontSize: "1.25rem", - display: "flex", - justifyContent: "center", - } + fontSize: "1.25rem", + display: "flex", + justifyContent: "center", + } : null; const handleSubmit = async (id, data) => { @@ -301,8 +377,8 @@ export const Profile = observer(() => { { dataSource={store.transaction.dataHistoryTransaction} pagination={{ onChange: async (page, pageSize) => { - console.log(page, "Page"); - console.log(pageSize, "Page size"); store.transaction.page = pageSize; store.transaction.page = page - 1; modalLoader.setLoading(true); @@ -657,15 +731,15 @@ export const Profile = observer(() => { item.status === 1 ? "success" : item.status === 0 - ? "warning" - : "processing" + ? "warning" + : "processing" } > {item.status === 1 ? "Sukses" : item.status === 0 - ? "Dalam Proses" - : "Gagal"} + ? "Dalam Proses" + : "Gagal"} } {" "} @@ -704,6 +778,118 @@ export const Profile = observer(() => { )} + + + {store.ui.mediaQuery.isDesktop && ( + { + let pageNumber = page.current; + store.transaction.pageSize = page.pageSize; + store.transaction.page = pageNumber - 1; + modalLoader.setLoading(true); + await store.transaction.getDataHistoryCheckBill(); + modalLoader.setLoading(false); + }} + /> + )} + {store.ui.mediaQuery.isMobile && ( +
+ { + console.log(page, "Page"); + console.log(pageSize, "Page size"); + store.transaction.pageSize = pageSize; + store.transaction.page = page - 1; + modalLoader.setLoading(true); + await store.transaction.getDataHistoryCheckBill(); + modalLoader.setLoading(false); + }, + pageSize: store.transaction.pageSize, + total: store.transaction.total_dataHistorybillProfile, + current: store.transaction.page + 1, + style: { marginBottom: "1rem", marginRight: "1rem" }, + }} + style={{ padding: 0 }} + renderItem={(item) => { + return ( +
+ + +

+ + Pengirim : {item.sender_name} + {" "} +
+ + Amount :{" "} + {new Intl.NumberFormat("id-ID", { + style: "currency", + currency: "IDR", + }).format(item.amount || 0)} + {" "} +
+ + Transaction Date :{" "} + {format( + parseISO(item.transaction_date), + "dd-MM-yyyy" + )} + {" "} +
+

+
+ } + /> + + +
+ ); + }} + /> + + )} + @@ -719,8 +905,8 @@ export const Profile = observer(() => { store.transaction.visibleModalFilterTransaction = false; actionFilter === true ? await store.transaction.getDataHistoryTopUpProfile( - store.authentication.profileData?.id - ) + store.authentication.profileData?.id + ) : await store.transaction.getDataHistoryTransaction(); }} > diff --git a/src/store/transaction.js b/src/store/transaction.js index da74f34..25f3910 100644 --- a/src/store/transaction.js +++ b/src/store/transaction.js @@ -11,8 +11,8 @@ export class Transaction { filterSubCategory = null; visibleModalProduct = false; visibleModalTransaction = false; - pageSizeDetail=10; - pageDetail=0 + pageSizeDetail = 10; + pageDetail = 0 pageCategories = 0; pageSizeCategories = 10; @@ -40,15 +40,18 @@ export class Transaction { dataHistoryTopUp = []; total_dataHistoryTopUp = 0; + dataHistorybillProfile = []; + total_dataHistorybillProfile = 0; + dataHistoryTopUpProfile = []; total_dataHistoryTopUpProfile = 0; dataTransaction = []; dataTransactionB2B = []; dataTransactionPartner = []; - total_dataDetailHistoryTransactionDetailUser=0; + total_dataDetailHistoryTransactionDetailUser = 0; + - //filter visibleModalFilterTransaction = false; filterStart = null; @@ -130,6 +133,23 @@ export class Transaction { } } + async getDataHistoryCheckBill() { + try { + const response = await http.get( + `/transaction/check-bill-history` + ); + // const response = await http.get( + // `/transaction/check-bill-history?page=${this.page}&pageSize=${this.pageSize}&start=${this.filterStart}&end=${this.filterEnd}` + // ); + console.log("bill", response); + this.dataHistorybillProfile = response.body.data ?? []; + this.total_dataHistorybillProfile = response?.body?.count ?? 0; + console.log(this.total_dataHistorybillProfile) + } catch (e) { + console.error(e); + } + } + async getDataHistoryTransaction() { try { const response = await http.get( @@ -138,7 +158,6 @@ export class Transaction { console.log(response); this.dataHistoryTransaction = response.body.data ?? []; this.total_dataHistoryTransaction = response?.body?.count ?? 0; - console.log(this.total_dataHistoryTransaction) } catch (e) { console.error(e); } @@ -147,7 +166,7 @@ export class Transaction { async getDetailHistoryTransaction(id) { try { const response = await http.get(`/transaction/history-user/${id}?page=${this.page}&pageSize=${this.pageSize}&start=${this.filterStart}&end=${this.filterEnd}`); - console.log(response,'Data Trans'); + console.log(response, 'Data Trans'); this.dataDetailHistoryTransactionDetailUser = response.body.data ?? []; this.total_data = response?.body?.count ?? 0; } catch (e) { @@ -160,7 +179,7 @@ export class Transaction { const response = await http.get( `/transaction/history-deposit?page=${this.page}&pageSize=${this.pageSize}&user-destination=${id}&start=${this.filterStart}&end=${this.filterEnd}` ); - console.log(response,'get data history') + console.log(response, 'get data history') this.dataHistoryTopUp = response.body.data ?? []; this.total_dataHistoryTopUp = response?.body?.count ?? 0; } catch (e) { @@ -173,7 +192,7 @@ export class Transaction { const response = await http.get( `/transaction/history-deposit-profile?page=${this.page}&pageSize=${this.pageSize}&user-destination=${id}&start=${this.filterStart}&end=${this.filterEnd}` ); - console.log(response,'get data history Profile') + console.log(response, 'get data history Profile') this.dataHistoryTopUpProfile = response.body.data ?? []; this.total_dataHistoryTopUpProfile = response?.body?.count ?? 0; } catch (e) { @@ -192,9 +211,9 @@ export class Transaction { } async buyProduct(data) { - const response = await http.post("/transaction/order").send(data); - console.log(response,'dari store') - return response; + const response = await http.post("/transaction/order").send(data); + console.log(response, 'dari store') + return response; } async buyProd(data) {