Fakultas Ilmu Komputer UI

Commit 930e8d38 authored by Fadhil Pradipta Widyanto's avatar Fadhil Pradipta Widyanto
Browse files

Merge branch 'coldfix' into 'dev'

Coldfix

See merge request !38
parents ddb6033e f5e4178a
Pipeline #82041 passed with stages
in 3 minutes and 34 seconds
......@@ -270,9 +270,7 @@ const DetailProduk = ({ productId }) => {
<LocalShippingIcon style={{ color: "#FFC80A" }} />
</span>
{product.preorder ? "Preorder" : (product.stock)}
</span>
{" "}{product.preorder ? ("") : product.unit}
</span>
</p>
{product.preorder && (
<p>
......
......@@ -11,26 +11,27 @@ import {
InputTextArea,
} from "../../component/html/html";
import { css } from "@emotion/core";
import MaskedInput from 'react-text-mask'
import createNumberMask from 'text-mask-addons/dist/createNumberMask'
import MaskedInput from "react-text-mask";
import createNumberMask from "text-mask-addons/dist/createNumberMask";
const FormProduk = ({ onSubmit, initialData = null, error }) => {
const defaultMaskOptions = { //mask for currency form
prefix: 'Rp ',
suffix: '',
const defaultMaskOptions = {
//mask for currency form
prefix: "Rp ",
suffix: "",
includeThousandsSeparator: true,
thousandsSeparatorSymbol: '.',
thousandsSeparatorSymbol: ".",
allowDecimal: true,
decimalSymbol: ',',
decimalLimit: 2,
decimalSymbol: ",",
decimalLimit: 2,
allowNegative: false,
allowLeadingZeroes: false,
}
};
const currencyMask = createNumberMask({
...defaultMaskOptions,
})
});
const [isPreorder, setIsPreorder] = useState("");
const[isHampers, setIsHampers] = useState(false);
const [isHampers, setIsHampers] = useState(false);
const { register, handleSubmit, errors, watch } = useForm({
defaultValues:
initialData !== null
......@@ -68,65 +69,71 @@ const FormProduk = ({ onSubmit, initialData = null, error }) => {
`category=${watchCategory}`,
null,
]);
const onChangeModal = (event) => {
setValueModal(event.target.value)
if (event.target.value === ''){
setErrorModal(1)
setValueModal(event.target.value);
if (event.target.value === "") {
setErrorModal(1);
} else {
setErrorModal(0);
}
else{
setErrorModal(0)
};
const onChangeHarga = (event) => {
setValueHarga(event.target.value);
if (event.target.value === "") {
setErrorHarga(1);
} else {
setErrorHarga(0);
}
}
const onChangeHarga = (event) =>{
setValueHarga(event.target.value)
if (event.target.value === ''){
setErrorHarga(1)
}
else{
setErrorHarga(0)
};
function formatValue(val) {
//change currency value to decimal
var raw = val.split(" ");
var rawnum = [];
if (String(raw[1]).length > 3) {
rawnum = String(raw[1]).split(".");
return rawnum.join("");
} else {
return raw[1];
}
}
function formatValue(val){ //change currency value to decimal
var raw = val.split(" ")
var rawnum = []
if (String(raw[1]).length > 3){
rawnum = String(raw[1]).split(".")
return rawnum.join('')
}
else{
return raw[1]
}
}
const [valueModal, setValueModal] = useState('');
const [valueModal, setValueModal] = useState("");
const [errorModal, setErrorModal] = useState(0);
const [valueHarga, setValueHarga] = useState('');
const [valueHarga, setValueHarga] = useState("");
const [errorHarga, setErrorHarga] = useState(0);
const filterSubmit = useCallback((data) => {
//error handling for Price and modal
if (valueHarga === ''){
setErrorHarga(1)
const filterSubmit = useCallback(
(data) => {
//error handling for Price and modal
if (valueHarga === "") {
setErrorHarga(1);
}
if (valueModal === ''){
setErrorModal(1)
if (valueModal === "") {
setErrorModal(1);
}
const formData = new FormData();
const formKey = ["image"];
const formCurrency = ["modal", "price"]
// Loop through every field in form and append to FormData
for (const key in data) {
if (formKey.includes(key)) {
if (data.image.length !== 0) formData.append("image", data["image"][0]);
const formData = new FormData();
const formKey = ["image"];
const formCurrency = ["modal", "price"];
// Loop through every field in form and append to FormData
for (const key in data) {
if (formKey.includes(key)) {
if (data.image.length !== 0)
formData.append("image", data["image"][0]);
} else if (formCurrency.includes(key))
formData.append(key, formatValue(data[key]));
else formData.append(key, data[key]);
isPreorder === "true"
? formData.set("stock", "")
: formData.set("preorder_duration", "");
isHampers === "false"
? formData.set("hampers_price", "")
: formData.set("hampers_price", data["hampers_price"]);
}
else if (formCurrency.includes(key)) formData.append(key, formatValue(data[key]))
else formData.append(key, data[key]);
isPreorder === "true" ? formData.set("stock" , "") : formData.set("preorder_duration", "")
isHampers === "false" ? formData.set("hampers_price", "") : formData.set("hampers_price", data["hampers_price"])
}
onSubmit(formData);
}, [isPreorder]);
onSubmit(formData);
},
[isPreorder]
);
return (
<form
......@@ -175,6 +182,31 @@ const FormProduk = ({ onSubmit, initialData = null, error }) => {
{/* NAME SECTION END */}
{/* MODAL SECTION START */}
<RowInput>
<LabelInput htmlFor="modal">Modal/Satuan </LabelInput>
<MaskedInput
data-testid="modal-produk-input"
type="text"
name="modal"
ref={register({ required: true })}
onChange={onChangeModal}
mask={currencyMask}
css={css`
flex-grow: 4;
border: 1px solid #e0e1e2;
box-sizing: border-box;
border-radius: 4px;
font-size: 1rem;
padding-left: 1rem;
`}
/>
{errorModal === 1 && <ErrorDiv>Modal tidak boleh kosong</ErrorDiv>}
</RowInput>
{/* MODAL SECTION END */}
{/* CATEGORY SECTION START */}
{results === undefined || Object.keys(results).length === 0 ? null : (
......@@ -271,60 +303,45 @@ const FormProduk = ({ onSubmit, initialData = null, error }) => {
{/* DESCRIPTION SECTION END */}
{/* MODAL SECTION START */}
<RowInput>
<LabelInput htmlFor="modal">Modal/Satuan </LabelInput>
<MaskedInput
data-testid="modal-produk-input"
type="text"
name="modal"
ref={register({ required: true })}
onChange={onChangeModal}
mask={currencyMask}
css={css`
flex-grow: 4;
border: 1px solid #e0e1e2;
box-sizing: border-box;
border-radius: 4px;
font-size: 1rem;
padding-left: 1rem;
`}
/>
{errorModal === 1 && <ErrorDiv>Modal tidak boleh kosong</ErrorDiv>}
</RowInput>
{/* MODAL SECTION END */}
{/* HARGA SECTION START */}
<RowInput>
<LabelInput htmlFor="harga">Harga/kuantitas </LabelInput>
<MaskedInput
data-testid="price-produk-input"
type="text"
name="price"
ref={register({ required: true })}
onChange={onChangeHarga}
mask={currencyMask}
css={css`
flex-grow: 4;
border: 1px solid #e0e1e2;
box-sizing: border-box;
border-radius: 4px;
font-size: 1rem;
padding-left: 1rem;
`}
<MaskedInput
data-testid="price-produk-input"
type="text"
name="price"
ref={register({ required: true })}
onChange={onChangeHarga}
mask={currencyMask}
css={css`
flex-grow: 4;
border: 1px solid #e0e1e2;
box-sizing: border-box;
border-radius: 4px;
font-size: 1rem;
padding-left: 1rem;
`}
/>
{errorHarga === 1 && <ErrorDiv>Harga Produk tidak boleh kosong</ErrorDiv>}
{errorHarga === 1 && (
<ErrorDiv>Harga Produk tidak boleh kosong</ErrorDiv>
)}
</RowInput>
{/* HARGA SECTION END */}
{/* HAMPERS TYPE SECTION START*/}
<RowInput>
<LabelInput htmlFor="is_hampers">Tipe (Hampers)
<span css={css`color:red`}>*</span></LabelInput>
<LabelInput htmlFor="is_hampers">
Tipe (Hampers)
<span
css={css`
color: red;
`}
>
*
</span>
</LabelInput>
<div
css={css`
display: flex;
......@@ -339,7 +356,7 @@ const FormProduk = ({ onSubmit, initialData = null, error }) => {
name="is_hampers"
value="false"
id="false_hampers"
onClick = {() => setIsHampers(false)}
onClick={() => setIsHampers(false)}
ref={register({ required: true })}
/>
<label htmlFor="false_hampers">Non-Hampers</label>
......@@ -358,12 +375,14 @@ const FormProduk = ({ onSubmit, initialData = null, error }) => {
name="is_hampers"
value="true"
id="true_hampers"
onClick = {() => setIsHampers(true)}
onClick={() => setIsHampers(true)}
ref={register({ required: true })}
/>
<label htmlFor="true_hampers">Hampers</label>
</div>
{errors.is_hampers && <ErrorDiv>Tipe hampers tidak boleh kosong.</ErrorDiv>}
{errors.is_hampers && (
<ErrorDiv>Tipe hampers tidak boleh kosong.</ErrorDiv>
)}
</RowInput>
{/* HAMPERS TYPE SECTION END*/}
......@@ -375,7 +394,7 @@ const FormProduk = ({ onSubmit, initialData = null, error }) => {
type="number"
name="hampers_price"
defaultValue="0"
disabled = {!isHampers}
disabled={!isHampers}
ref={register}
/>
</RowInput>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment