Add Proses Transaksi, Metode Pembayaran, Invoice

This commit is contained in:
2025-01-16 14:35:00 +08:00
parent a649fad7cb
commit 4374def1e9
20 changed files with 495 additions and 9 deletions

View File

@@ -0,0 +1,150 @@
'use client';
import { AccentColor, MainColor } from '@/app_modules/_global/color';
import { ActionIcon, Button, Grid, Group, Paper, Stack, Text, Title } from '@mantine/core';
import { IconCamera } from '@tabler/icons-react';
import React from 'react';
function Event_Invoice() {
return (
<>
<Stack spacing={"lg"} py={"md"}>
<Stack
spacing={0}
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
}}
>
<Title order={5}>Mohon transfer ke rekening dibawah</Title>
<Group spacing={"xs"}>
<Text>untuk diteruskan ke</Text>
<Text fw={"bold"}>NicoArya</Text>
</Group>
</Stack>
<Paper
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
marginBottom: "15px",
}}
>
<Stack spacing={"md"}>
<Stack spacing={0}>
<Text>Bank BRI</Text>
<Text>PT. Himpunan Pengusaha Badung</Text>
</Stack>
<Paper
style={{
backgroundColor: AccentColor.darkblue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
}}
>
<Grid>
<Grid.Col span={8}>
<Group position='left' align='center' h={"100%"}>
<Title order={4} color={MainColor.yellow}>
9065456754325643
</Title>
</Group>
</Grid.Col>
<Grid.Col span={4}>
<Group position='right'>
<Button radius={"xl"}
style={{ backgroundColor: MainColor.yellow }}
c={MainColor.darkblue}>
Salin
</Button>
</Group>
</Grid.Col>
</Grid>
</Paper>
</Stack>
</Paper>
<Paper
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
marginBottom: "15px",
}}
>
<Stack spacing={"md"}>
<Stack spacing={0}>
<Text>Jumlah Transfer</Text>
</Stack>
<Paper
style={{
backgroundColor: AccentColor.darkblue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
}}
>
<Grid>
<Grid.Col span={8}>
<Group position='left' align='center' h={"100%"}>
<Title order={4} color={MainColor.yellow}>
Rp. 100.000
</Title>
</Group>
</Grid.Col>
<Grid.Col span={4}>
<Group position='right'>
<Button radius={"xl"} style={{ backgroundColor: MainColor.yellow }} c={MainColor.darkblue}>
Salin
</Button>
</Group>
</Grid.Col>
</Grid>
</Paper>
</Stack>
</Paper>
<Paper
style={{
backgroundColor: AccentColor.blue,
border: `2px solid ${AccentColor.darkblue}`,
padding: "15px",
cursor: "pointer",
borderRadius: "10px",
color: "white",
marginBottom: "15px",
}}
>
<Stack spacing={"sm"}>
<Group position='center'>
<Button leftIcon={<IconCamera />} radius={"xl"} style={{ backgroundColor: MainColor.yellow }} c={MainColor.darkblue}>
Upload
</Button>
</Group>
<Text ta={"center"} fz={"xs"} fs={"italic"}>Upload bukti transfer anda</Text>
</Stack>
</Paper>
<Button radius={"xl"} bg={MainColor.yellow} color='yellow' c="black">
Saya Sudah Transfer
</Button>
</Stack>
</>
);
}
export default Event_Invoice;