Fakultas Ilmu Komputer UI

Commit c56626f3 authored by Ilma Ainur Rohma's avatar Ilma Ainur Rohma
Browse files

[REFACTOR] resolve merge conflict

parents 6325c078 4b0f0c52
Pipeline #80629 passed with stages
in 4 minutes and 35 seconds
This diff is collapsed.
......@@ -27,7 +27,8 @@
"react-moment": "^0.9.7",
"react-number-format": "^4.4.1",
"react-promise-tracker": "^2.1.0",
"react-toastify": "^7.0.3"
"react-toastify": "^7.0.3",
"reactstrap": "^8.9.0"
},
"scripts": {
"start": "cross-env REACT_APP_BASE_URL=http://localhost:8000 parcel public/index.html",
......
......@@ -15,6 +15,7 @@ test("Test edit bank renders", async () => {
JSON.stringify({
id: "e1827709-82a3-4a6f-b55c-bb1a229b7036",
bank_name: "bca",
bank_code_number: "222",
bank_account_number: "1234456",
bank_account_name: "test bca",
})
......@@ -31,6 +32,8 @@ test("Test edit bank renders", async () => {
await waitFor(() => getByTestId("edit-bank"));
const name_bank = getByTestId("name-bank-input");
expect(name_bank.value).toEqual("bca");
const code_bank = getByTestId("code-number-input");
expect(code_bank.value).toEqual("222");
expect(fetch.mock.calls.length).toEqual(1);
await act(async () => {
await fireEvent.input(name_bank, { target: { value: "test" } });
......@@ -47,6 +50,7 @@ test("Test edit bank error", async () => {
JSON.stringify({
id: "e1827709-82a3-4a6f-b55c-bb1a229b7036",
bank_name: "bca",
bank_code_number: "222",
bank_account_number: "1234456",
bank_account_name: "test bca",
})
......@@ -63,6 +67,8 @@ test("Test edit bank error", async () => {
await waitFor(() => getByTestId("edit-bank"));
const name_bank = getByTestId("name-bank-input");
expect(name_bank.value).toEqual("bca");
const code_bank = getByTestId("code-number-input");
expect(code_bank.value).toEqual("222");
expect(fetch.mock.calls.length).toEqual(1);
await act(async () => {
await fireEvent.input(name_bank, { target: { value: "test" } });
......@@ -96,5 +102,5 @@ test("Test edit bank required marks", async () => {
expect(waitBank.textContent).toContain("Fetching data..");
await waitFor(() => getByTestId("edit-bank"));
const formBank = getByTestId("form-bank");
expect(formBank.textContent).toContain("* Perlu diisi", "Nama bank*", "Nomor rekening*", "Nama pemilik rekening*");
expect(formBank.textContent).toContain("* Perlu diisi", "Nama bank*", "Nomor kode bank*", "Nomor rekening*", "Nama pemilik rekening*");
});
\ No newline at end of file
......@@ -20,12 +20,14 @@ test("Test List Bank", async () => {
{
id: "e1827709-82a3-4a6f-b55c-bb1a229b7036",
bank_name: "bca",
bank_code_number: "222",
bank_account_number: "1234456",
bank_account_name: "test bca",
},
{
id: "3e7974da-47fb-47ed-a83c-525e237a8c41",
bank_name: "bca1",
bank_code_number: "333",
bank_account_number: "1234456",
bank_account_name: "test bca",
},
......@@ -40,5 +42,8 @@ test("Test List Bank", async () => {
await waitFor(() => getByTestId("tableList"));
const data = getByTestId("tableList");
expect(data.textContent).toContain("bca");
expect(data.textContent).toContain("222");
expect(data.textContent).toContain("bca1");
expect(data.textContent).toContain("333");
expect(fetch.mock.calls.length).toEqual(1);
});
......@@ -15,9 +15,13 @@ test("Test tambah bank renders", async () => {
</AuthContext.Provider>
);
const name_bank = getByTestId("name-bank-input");
const code_bank = getByTestId("code-number-input");
await act(async () => {
await fireEvent.input(name_bank, { target: { value: "test" } });
});
await act(async () => {
await fireEvent.input(code_bank, { target: { value: "222" } });
});
await act(async () => {
await fireEvent.submit(getByTestId("submit-bank"));
});
......@@ -31,5 +35,5 @@ test("Test tambah bank required marks", async () => {
</AuthContext.Provider>
);
const formBank = getByTestId("tambah-bank");
expect(formBank.textContent).toContain("* Perlu diisi", "Nama bank*", "Nomor rekening*", "Nama pemilik rekening*");
expect(formBank.textContent).toContain("* Perlu diisi", "Nama bank*", "Nomor kode bank*", "Nomor rekening*", "Nama pemilik rekening*");
});
\ No newline at end of file
import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import 'bootstrap/dist/css/bootstrap.min.css';
import App from "./App";
ReactDOM.render(<App />, document.getElementById("root"));
......@@ -26,6 +26,7 @@ const EditBank = ({ idBank }) => {
const onSubmit = (data) => {
const formData = new FormData();
formData.append("bank_name", data["bank_name"]);
formData.append("bank_code_number", data["bank_code_number"]);
formData.append("bank_account_number", data["bank_account_number"]);
formData.append("bank_account_name", data["bank_account_name"]);
send(formData);
......
import React from "react";
import { useForm } from "react-hook-form";
import {
ErrorDiv,
RowInput,
InputForm,
LabelInput,
InputSubmitForm,
} from "../../component/html/html";
import { css } from "@emotion/core";
const FormBank = ({ onSubmit, initialData = null }) => {
const { register, handleSubmit, errors } = useForm({
defaultValues:
initialData !== null
? {
bank_name: initialData["bank_name"],
bank_account_number: initialData["bank_account_number"],
bank_account_name: initialData["bank_account_name"],
}
: {},
});
return (
<form
data-testid="form-bank"
onSubmit={handleSubmit(onSubmit)}
css={css`
display: flex;
flex-direction: column;
`}
>
<div
css={css`
font-size: 15px;
color:red;
`}>
* Perlu diisi
</div>
<RowInput>
<LabelInput htmlFor="bank_name">Nama bank
<span css={css`color:red`}>*</span></LabelInput>
<InputForm
data-testid="name-bank-input"
name="bank_name"
ref={register({ required: true })}
/>
{errors.bank_name && <ErrorDiv>Nama bank tidak boleh kosong</ErrorDiv>}
</RowInput>
<RowInput>
<LabelInput htmlFor="account_number">Nomor rekening
<span css={css`color:red`}>*</span></LabelInput>
<InputForm
data-testid="account-number-input"
name="bank_account_number"
ref={register({ required: true })}
/>
{errors.bank_account_number && (
<ErrorDiv>Nomor rekening tidak boleh kosong</ErrorDiv>
)}
</RowInput>
<RowInput>
<LabelInput htmlFor="account_name">Nama pemilik rekening
<span css={css`color:red`}>*</span></LabelInput>
<InputForm
data-testid="account-name-input"
name="bank_account_name"
ref={register({ required: true })}
/>
{errors.bank_account_name && (
<ErrorDiv>Nama pemilik rekening tidak boleh kosong</ErrorDiv>
)}
</RowInput>
<RowInput>
<InputSubmitForm
type="submit"
data-testid="submit-bank"
value="SUBMIT"
css={css`
height: 100%;
`}
/>
</RowInput>
</form>
);
};
export default FormBank;
import React from "react";
import { useForm } from "react-hook-form";
import {
ErrorDiv,
RowInput,
InputForm,
LabelInput,
InputSubmitForm,
} from "../../component/html/html";
import { css } from "@emotion/core";
const FormBank = ({ onSubmit, initialData = null }) => {
const { register, handleSubmit, errors } = useForm({
defaultValues:
initialData !== null
? {
bank_name: initialData["bank_name"],
bank_code_number: initialData["bank_code_number"],
bank_account_number: initialData["bank_account_number"],
bank_account_name: initialData["bank_account_name"],
}
: {},
});
return (
<form
data-testid="form-bank"
onSubmit={handleSubmit(onSubmit)}
css={css`
display: flex;
flex-direction: column;
`}
>
<div
css={css`
font-size: 15px;
color:red;
`}>
* Perlu diisi
</div>
<RowInput>
<LabelInput htmlFor="bank_name">Nama bank
<span css={css`color:red`}>*</span></LabelInput>
<InputForm
data-testid="name-bank-input"
name="bank_name"
ref={register({ required: true })}
/>
{errors.bank_name && <ErrorDiv>Nama bank tidak boleh kosong</ErrorDiv>}
</RowInput>
<RowInput>
<LabelInput htmlFor="code_number">Nomor kode bank
<span css={css`color:red`}>*</span></LabelInput>
<InputForm
data-testid="code-number-input"
name="bank_code_number"
ref={register({ required: true })}
/>
{errors.bank_code_number && (
<ErrorDiv>Nomor kode bank tidak boleh kosong</ErrorDiv>
)}
</RowInput>
<RowInput>
<LabelInput htmlFor="account_number">Nomor rekening
<span css={css`color:red`}>*</span></LabelInput>
<InputForm
data-testid="account-number-input"
name="bank_account_number"
ref={register({ required: true })}
/>
{errors.bank_account_number && (
<ErrorDiv>Nomor rekening tidak boleh kosong</ErrorDiv>
)}
</RowInput>
<RowInput>
<LabelInput htmlFor="account_name">Nama pemilik rekening
<span css={css`color:red`}>*</span></LabelInput>
<InputForm
data-testid="account-name-input"
name="bank_account_name"
ref={register({ required: true })}
/>
{errors.bank_account_name && (
<ErrorDiv>Nama pemilik rekening tidak boleh kosong</ErrorDiv>
)}
</RowInput>
<RowInput>
<InputSubmitForm
type="submit"
data-testid="submit-bank"
value="SUBMIT"
css={css`
height: 100%;
`}
/>
</RowInput>
</form>
);
};
export default FormBank;
......@@ -11,6 +11,7 @@ const ListBank = () => {
keyValuePairs: [
["id", "id"],
["bank_name", "Nama Bank"],
["bank_code_number", "Nomor Kode Bank"],
["bank_account_number", "Nomor Rekening"],
["bank_account_name", "Nama Pemilik Rekening"],
],
......
......@@ -15,12 +15,9 @@ const TambahBank = () => {
const onSubmit = (data) => {
const formData = new FormData();
formData.append("bank_name", data["bank_name"]);
formData.append("bank_code_number", data["bank_code_number"]);
formData.append("bank_account_number", data["bank_account_number"]);
formData.append("bank_account_name", data["bank_account_name"]);
console.log(data);
for (let pair in formData.entries()){
console.log(pair[0] + ' ' + pair[1]);
}
send(formData);
};
return (
......
......@@ -155,98 +155,116 @@ const DetailPengguna = ({ userId }) => {
{user.username}
</div>
</div>
<div
className="profile"
<div className="detailProfile"
css={css`
background-color: #F2F2F2;
border-radius: 15px;
padding: 0.5rem 1rem 0.5rem 1rem;
margin: 1rem 0 1rem 0;
`}>
<div
css={css`
font-style: normal;
font-weight: 300;
font-size: 30px;
line-height: 44px;
border-bottom: 1px solid #C4C4C4;
padding-left: 1rem;
`}>
Detail Profile</div>
<div
data-testid="detail-profile-test"
className="profileDesc"
css={css`
font-style: normal;
font-weight: 300;
font-size: 36px;
line-height: 44px;
margin-top: 1rem;
`}
>
Profil
</div>
<div
className="row mt-2"
css={css`
margin-top: 1rem;
margin-bottom: 1rem;
`}
>
<div className="col-sm-2">
<img
alt={user.username}
className="img-fluid"
src={user.profile_picture}
css={css`
object-fit: cover;
width: 150px;
height: 150px;
`}
/>
</div>
<div data-testid="profile" className="col-sm-10">
<div
css={css`
margin-top: 1rem;
`}
>
<PersonIcon style={{ fontSize: 20, color: "FFC80A" }} />
<div
css={css`
display: inline;
margin-left: 2rem;
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 22px;
`}
>
{user.username}
font-size: 18px;
padding: 1rem;
`}>
<div className="row" >
<div className="col-3" css={css`display: flex; align-items: center;`}>
<PersonIcon style={{ fontSize: 20, color: "FFC80A" }} />
<div
css={css`
display: inline;
margin-left: 1rem;
font-style: normal;
font-weight: normal;
font-size: 18px;
`}
>
Nama:
</div>
</div>
<div className="col-9"
css={css`
font-style: normal;
font-weight: normal;
`}>
{user.full_name}
</div>
</div>
<div
css={css`
margin-top: 1rem;
`}
>
<PhoneIcon style={{ fontSize: 20, color: "FFC80A" }} />
<div className="row" >
<div className="col-3" css={css`display: flex; `}>
<PhoneIcon style={{ fontSize: 23, color: "FFC80A" }} />
<div
css={css`
display: inline;
margin-left: 2rem;
margin-left: 1rem;
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 22px;
`}
>
Nomor HP:
</div></div>
<div className="col-9"
css={css`
font-style: normal;
font-weight: normal;`}>
{user.phone_number}
</div>
</div>
<div
css={css`
margin-top: 1rem;
`}
>
<LocationOnIcon style={{ fontSize: 20, color: "FFC80A" }} />
<div
<div className="row" >
<div className="col-3" css={css`display: flex; `}>
<LocationOnIcon style={{ fontSize: 23, color: "FFC80A"}} />
<div
css={css`
display: inline;
margin-left: 1rem;
font-style: normal;
font-weight: normal;
font-size: 18px;
`}
>
Alamat:
</div>
</div>
<div className="col-9"
css={css`
display: inline;
margin-left: 2rem;
font-style: normal;
font-weight: normal;
font-size: 18px;
line-height: 22px;
`}
>
font-style: normal;
font-weight: normal;`}>
{user.address}, RT {user.neighborhood}, RW {user.hamlet},
Kelurahan {user.urban_village}, Kecamatan {user.sub_district}
</div>
</div>
</div>
</div>
<div
css={css`
font-style: normal;
......
......@@ -3,8 +3,8 @@ import useFetchSingleData from "../../utils/useFetchSingleData";
import { css } from "@emotion/core";
import ArrowBackIcon from "@material-ui/icons/ArrowBack";
import PhoneIcon from "@material-ui/icons/Phone";
import PhotoIcon from "@material-ui/icons/Photo";
import ContactsIcon from "@material-ui/icons/Contacts";
import ImageIcon from '@material-ui/icons/Image';
import LocationOnIcon from '@material-ui/icons/LocationOn';
import { Link, navigate } from "@reach/router";
import PersonIcon from "@material-ui/icons/Person";
import Table from "@material-ui/core/Table";
......@@ -23,9 +23,12 @@ import DialogActions from "@material-ui/core/DialogActions";
import DialogContent from "@material-ui/core/DialogContent";
import DialogTitle from "@material-ui/core/DialogTitle";
import FormStatus from "./FormStatus";
import { Container, Row, Col } from 'reactstrap';
import "moment-timezone";
import Moment from "react-moment";
const DetailTransaksi = ({ idTransaksi }) => {
const url = `${process.env.REACT_APP_BASE_URL}/transactions/${idTransaksi}/`;
const [transaction, error] = useFetchSingleData(url);
......@@ -62,7 +65,6 @@ const DetailTransaksi = ({ idTransaksi }) => {
margin: 2rem 3rem 3rem 3rem;
flex-direction: column;
justify-content: space-around;
height: 125vh;
`}
>
{error && <ErrorDiv>Something error</ErrorDiv>}
......@@ -93,129 +95,225 @@ const DetailTransaksi = ({ idTransaksi }) => {
KELOLA TRANSAKSI
</div>
</div>
<div
css={css`
font-size: 1.5rem;
display: flex;
align-content: space-between;
`}
>
<div
css={css`
display: flex;
`}
>
<div
<br></br><br></br>
<Container>
<Row style={{paddingBottom:8}}>
<Col md="4">
<div
css={css`
margin-right: 1rem;
font-size: 1.5rem;
display: flex;
align-content: space-between;
font-weight: bold;
`}
>
Kode Transaksi
</div>
</Col>
<Col md="3">
<div
css={css`
margin-right: 1rem;
font-size: 1.5rem;
display: flex;
align-content: space-between;
font-weight: bold;
`}
>
<div>: {transaction.transaction_number}</div>
</div>
</Col>
<Col md="5">
{transaction.transaction_status !== "005" &&
transaction.transaction_status !== "006" &&
transaction.transaction_status !== "007" && (
<FormStatus
{...{
idTransaksi,
defaultStatus: transaction.transaction_status,