PPOB/ppob-frontend
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'develop' into 'devops-staging'

Browse Source 
Perbaikan Project PPOB

See merge request empatnusabangsa/ppob/ppob-frontend!67
This commit is contained in:
ajat sudrajat 2022-01-13 08:07:46 +00:00
commit 2e4274c9b8
7 changed files with 305 additions and 211 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/pages/Membership/DetailUser.js
View File

@ -252,6 +252,17 @@ export const DetailUser = observer(() => {
},
];
const dataRoute = [
{
route: LINKS.MEMBERSHIP,
name: "Keanggotaan"
},
{
route: LINKS.USER_DETAIL.replace(":id", id),
name: <span style={{ fontWeight: "bold" }}>Detail User</span>,
},
];
const styleSaldoTitle = store.ui.mediaQuery.isDesktop
? {
display: "flex",
@ -275,21 +286,22 @@ export const DetailUser = observer(() => {
store.authentication.dataProfit.userDetail?.image_identity,
"detail"
);
console.log(
store.authentication.listImage,
"detail gambar"
);
console.log(store.authentication.listImage, "detail gambar");
return (
<div className={[""].join(" ")}>
<BreadcumbComponent data={routeData} />
<BreadcumbComponent
data={
store.authentication.userData.role === "Admin" ? routeData : dataRoute
}
/>
<Card>
<Row style={{ marginBottom: 10 }}>
<Title strong level={2}>
Detail User
</Title>
{store.authentication.userData.role === "Admin" && (
<Col lg={18} xs={18} style={{ textAlign: "right" }}>
{store.authentication.userData.role === "Admin" && (
<Col lg={18} xs={18} style={{ textAlign: "right" }}>
<Space
size="middle"
align={"center"}
@ -338,7 +350,8 @@ export const DetailUser = observer(() => {
store.membership.dataDetail.userDetail.image_identity
);
console.log(
store.membership.dataDetail.userDetail.image_store,"ini store"
store.membership.dataDetail.userDetail.image_store,
"ini store"
);
console.log(store.membership.dataDetail.username);
setVisibleModal(true);
@ -373,10 +386,10 @@ export const DetailUser = observer(() => {
Withdraw Profit
</Button>
</Space>
</Col>
)}
{store.authentication.userData.role === "Supervisor" && (
<Col lg={16} xs={16} style={{ textAlign: "right" }}>
</Col>
)}
{store.authentication.userData.role === "Supervisor" && (
<Col lg={16} xs={16} style={{ textAlign: "right" }}>
<Space
size="middle"
align={"center"}
@ -447,10 +460,10 @@ export const DetailUser = observer(() => {
Ganti Password
</Button>
</Space>
</Col>
)}
{store.authentication.userData.role === "Sales" && (
<Col lg={16} xs={16} style={{ textAlign: "right" }}>
</Col>
)}
{store.authentication.userData.role === "Sales" && (
<Col lg={16} xs={16} style={{ textAlign: "right" }}>
<Space
size="middle"
align={"center"}
@ -521,9 +534,8 @@ export const DetailUser = observer(() => {
Ganti Password
</Button>
</Space>
</Col>
)}
</Col>
)}
</Row>
<Row style={{ marginBottom: 20 }}>
@ -641,7 +653,7 @@ export const DetailUser = observer(() => {
? `${appConfig.apiUrl}/config/image/${item}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
}
style={{ width: "10vw",marginRight:15 }}
style={{ width: "10vw", marginRight: 15 }}
/>
))}
</Row>
@ -679,7 +691,7 @@ export const DetailUser = observer(() => {
? `${appConfig.apiUrl}/config/image/${item}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
}
style={{ width: "10vw",marginRight:15 }}
style={{ width: "10vw", marginRight: 15 }}
/>
))}
</Row>

24
src/pages/Membership/Membership.js
View File

@ -30,7 +30,6 @@ import { LINKS } from "../../routes/app";
import { useHistory } from "react-router-dom";
import { ModalLoaderContext } from "../../utils/modal";
export const Membership = observer(() => {
const history = useHistory();
const { Option } = Select;
@ -253,12 +252,19 @@ export const Membership = observer(() => {
name: <span style={{ fontWeight: "bold" }}>Keanggotaan</span>,
},
];
const dataRoute = [
{
route: LINKS.MEMBERSHIP,
name: "Keanggotaan"
},
];
const onSubmit = async (data, image, imageStore) => {
data.superior = true;
console.log(imageStore, "Apa imageStore")
console.log(imageStore, "Apa imageStore");
if(!imageStore){
imageStore = []
if (!imageStore) {
imageStore = [];
}
if (initialData.id) {
@ -325,7 +331,11 @@ export const Membership = observer(() => {
};
return (
<div className={["ppob-container"].join(" ")}>
<BreadcumbComponent data={routeData} />
<BreadcumbComponent
data={
store.authentication.userData.role === "Admin" ? routeData : dataRoute
}
/>
<Card>
<div>
<Row style={{ marginBottom: 20 }}>
@ -399,7 +409,7 @@ export const Membership = observer(() => {
pagination={{
onChange: async (page, pageSize) => {
store.membership.pageSize = pageSize;
store.membership.page = page -1;
store.membership.page = page - 1;
modalLoader.setLoading(true);
await getData();
modalLoader.setLoading(false);
@ -442,7 +452,7 @@ export const Membership = observer(() => {
<small>Role : {item.roles?.name}</small> <br />
<small>Saldo : {item.coa?.amount}</small> <br />
<Button
style={{ marginRight: 10,marginTop:7 }}
style={{ marginRight: 10, marginTop: 7 }}
onClick={() => {
setDestination(item?.id);
console.log(item?.id);

25
src/pages/Payback/Payback.js
View File

@ -182,6 +182,13 @@ export const Payback = observer(() => {
},
];
const dataRoute = [
{
route: LINKS.PAYBACK,
name: "Konfirmasi Pembayaran"
},
];
const handleAction = async (id, type) => {
modalLoader.setLoading(true);
try {
@ -222,7 +229,7 @@ export const Payback = observer(() => {
store.payback.visibleModalFilterPayback = false;
};
const handleCancelFilter = async() => {
const handleCancelFilter = async () => {
//setFilterMembership([]);
//form.resetFields();
store.payback.filterMembership = null;
@ -236,8 +243,12 @@ export const Payback = observer(() => {
const data = form.getFieldsValue();
//console.log(data);
store.payback.filterMembership = filterMembership;
store.payback.filterStart = data.start_date ? (moment(data.start_date).format('YYYY-MM-DD') + ' 00:00:00') : null;
store.payback.filterEnd = data.end_date ? (moment(data.end_date).format('YYYY-MM-DD') + ' 23:59:59') : null;
store.payback.filterStart = data.start_date
? moment(data.start_date).format("YYYY-MM-DD") + " 00:00:00"
: null;
store.payback.filterEnd = data.end_date
? moment(data.end_date).format("YYYY-MM-DD") + " 23:59:59"
: null;
modalLoader.setLoading(true);
await store.payback.getDataConfirmation();
modalLoader.setLoading(false);
@ -281,7 +292,11 @@ export const Payback = observer(() => {
];
return (
<div className={["ppob-container"].join(" ")}>
<BreadcumbComponent data={routeData} />
<BreadcumbComponent
data={
store.authentication.userData.role === "Admin" ? routeData : dataRoute
}
/>
<Card>
<div>
<Row style={{ marginBottom: 20 }}>
@ -470,7 +485,7 @@ export const Payback = observer(() => {
visible={store.payback.visibleModalFilterPayback}
title={"Filter"}
footer={footerLayoutFilter}
onCancel={async() => {
onCancel={async () => {
//form.resetFields();
//setFilterMembership([]);
store.payback.filterMembership = null;

63
src/pages/Payback/PaybackCreated.js
View File

@ -133,6 +133,14 @@ export const PaybackCreated = observer(() => {
name: <span style={{ fontWeight: "bold" }}>Buat Pembayaran</span>,
},
];
const dataRoute = [
{
route: LINKS.PAYBACK_CREATED,
name: "Buat Pembayaran"
},
];
const handleRemoveFilter = async () => {
store.payback.filterStart = null;
store.payback.filterEnd = null;
@ -209,7 +217,11 @@ export const PaybackCreated = observer(() => {
return (
<div className={["ppob-container"].join(" ")}>
<BreadcumbComponent data={routeData} />
<BreadcumbComponent
data={
store.authentication.userData.role === "Admin" ? routeData : dataRoute
}
/>
<Card>
<div>
<Row style={{ marginBottom: 20 }}>
@ -307,36 +319,35 @@ export const PaybackCreated = observer(() => {
className={[""].join(" ")}
title={item.name}
description={
<div style={{marginBottom:10}}>
<div style={{ marginBottom: 10 }}>
<small>Amount: {item.amount}</small>
<br/>
<div style={{marginTop:5}}>
<small>Status : </small>
<Tag
color={
item.status === 0
? "purple"
<br />
<div style={{ marginTop: 5 }}>
<small>Status : </small>
<Tag
color={
item.status === 0
? "purple"
: item.status === 1
? "blue"
: item.status === 2
? "warning"
: item.status === 3
? "success"
: "red"
}
>
{item.status === 0
? "Pending"
: item.status === 1
? "blue"
? "Success"
: item.status === 2
? "warning"
? "Failed"
: item.status === 3
? "success"
: "red"
}
>
{item.status === 0
? "Pending"
: item.status === 1
? "Success"
: item.status === 2
? "Failed"
: item.status === 3
? "Approved"
: "Rejected"}
</Tag>
? "Approved"
: "Rejected"}
</Tag>
</div>
</div>
}
/>

320
src/pages/Product/Product.js
View File

@ -1,15 +1,30 @@
import React, {useContext, useEffect, useState} from "react";
import {Button, Card, Col, Form, Input, message, Modal, Row, Select, Upload} from "antd";
import {FilterOutlined, PlusOutlined, UploadOutlined,} from "@ant-design/icons";
import {BreadcumbComponent} from "../../component/BreadcumbComponent";
import {useStore} from "../../utils/useStore";
import {observer} from "mobx-react-lite";
import {ProductComponent} from "../../component/ProductComponent";
import {LINKS} from "../../routes/app";
import {ModalLoaderContext} from "../../utils/modal";
import React, { useContext, useEffect, useState } from "react";
import {
Button,
Card,
Col,
Form,
Input,
message,
Modal,
Row,
Select,
Upload,
} from "antd";
import {
FilterOutlined,
PlusOutlined,
UploadOutlined,
} from "@ant-design/icons";
import { BreadcumbComponent } from "../../component/BreadcumbComponent";
import { useStore } from "../../utils/useStore";
import { observer } from "mobx-react-lite";
import { ProductComponent } from "../../component/ProductComponent";
import { LINKS } from "../../routes/app";
import { ModalLoaderContext } from "../../utils/modal";
const {Search} = Input;
const {Option} = Select;
const { Search } = Input;
const { Option } = Select;
export const Product = observer(() => {
const store = useStore();
@ -30,7 +45,7 @@ export const Product = observer(() => {
store.supplier.getData(),
store.category.getData(),
store.product.getDataSubCategories(),
store.product.getProductPartner()
store.product.getProductPartner(),
]);
await store.product.getData();
modalLoader.setLoading(false);
@ -58,18 +73,26 @@ export const Product = observer(() => {
},
{
route: LINKS.PRODUCT,
name: <span style={{fontWeight: "bold"}}>Produk</span>,
name: <span style={{ fontWeight: "bold" }}>Produk</span>,
},
];
const dataRoute = [
{
route: LINKS.PRODUCT,
name: "Produk",
},
];
const beforeUpload = (file) => {
let isLt2M;
let allowedFile = [
"text/csv", "application/csv",
"text/csv",
"application/csv",
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
"application/vnd.ms-excel.sheet.binary.macroEnabled.12",
"application/vnd.ms-excel",
"application/vnd.ms-excel.sheet.macroEnabled.12"
"application/vnd.ms-excel.sheet.macroEnabled.12",
];
let isValid = allowedFile.includes(file.type);
if (!isValid) {
@ -93,12 +116,14 @@ export const Product = observer(() => {
message.error("Failed upload excel!");
}
setFileList([{
uid: '-1',
name: response.body.filename,
status: 'done',
url: '',
}]);
setFileList([
{
uid: "-1",
name: response.body.filename,
status: "done",
url: "",
},
]);
setExcel(response.body.filename);
} catch (e) {
setLoading(false);
@ -107,10 +132,10 @@ export const Product = observer(() => {
};
const handleChange = (info) => {
if (info.file.status === 'uploading') {
if (info.file.status === "uploading") {
setLoading(true);
} else {
setLoading(false)
setLoading(false);
}
};
@ -140,7 +165,7 @@ export const Product = observer(() => {
const handleSubmit = async (data) => {
const request = {
fileName: excel,
supplierCode: data.supplierCode
supplierCode: data.supplierCode,
};
const responseUploadProduct = await handleUploadProduct(request);
@ -152,30 +177,37 @@ export const Product = observer(() => {
};
return (
<div className={[""].join(" ")}>
<BreadcumbComponent data={routeData}/>
<Card>
<div>
<Row style={{marginBottom: 20}}>
<Col span={12}>
<Button
onClick={() => {
store.product.visibleModalFilterProduct = true;
}}
>
<FilterOutlined/>
Filter
</Button>
</Col>
<Col span={12}>
<div
style={{
display: store.ui.mediaQuery.isMobile ? "" : "flex",
justifyContent: "flex-end",
textAlign: "right",
}}
>
{/* <Search
<div className={[""].join(" ")}>
<BreadcumbComponent
data={
store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Admin Partner"
? routeData
: dataRoute
}
/>
<Card>
<div>
<Row style={{ marginBottom: 20 }}>
<Col span={12}>
<Button
onClick={() => {
store.product.visibleModalFilterProduct = true;
}}
>
<FilterOutlined />
Filter
</Button>
</Col>
<Col span={12}>
<div
style={{
display: store.ui.mediaQuery.isMobile ? "" : "flex",
justifyContent: "flex-end",
textAlign: "right",
}}
>
{/* <Search
placeholder="input search text"
style={{
width: store.ui.mediaQuery.isMobile ? 160 : 200,
@ -184,105 +216,109 @@ export const Product = observer(() => {
}}
/> */}
{store.authentication.userData.role == "Admin" && <div
style={{
display: store.ui.mediaQuery.isMobile ? "" : "flex",
justifyContent: "flex-end",
textAlign: "right",
}}
>
<Button
disabled={visibleModalUpload}
style={{
marginRight: store.ui.mediaQuery.isMobile ? 0 : 10,
marginBottom: store.ui.mediaQuery.isMobile ? 10 : 10,
}}
icon={<PlusOutlined/>}
onClick={() => setVisibleModalUpload(true)}
>
Tambah Produk
</Button>
</div>}
</div>
</Col>
</Row>
</div>
<ProductComponent/>
</Card>
<Modal
visible={visibleModalUpload}
title={"Upload Excel Product"}
okText={"Create"}
cancelText="Cancel"
onCancel={() => {
form.resetFields();
handleCancel();
}}
onOk={() => {
form
.validateFields()
.then((values) => {
console.log(values, "isi form");
handleSubmit(values);
form.resetFields();
})
.catch((info) => {
console.error("Validate Failed:", info);
});
}}
>
<Form form={form} layout="vertical">
<Form.Item
name="fileName"
label="Upload Excel Product"
rules={[{required: true, message: "Please Upload Excel Product!"}]}
>
<Upload
fileList={fileList}
onChange={handleChange}
beforeUpload={(file) => beforeUpload(file)}
customRequest={(args) => uploadHandler(args)}
onRemove={(file) => {
setLoading(false);
setFileList([]);
setExcel("");
}}
>
<div
{store.authentication.userData.role == "Admin" && (
<div
style={{
display: "flex",
flexDirection: "row",
justifyContent: "center",
display: store.ui.mediaQuery.isMobile ? "" : "flex",
justifyContent: "flex-end",
textAlign: "right",
}}
>
<Button
disabled={loading}
>
<Button
disabled={visibleModalUpload}
style={{
marginRight: store.ui.mediaQuery.isMobile ? 0 : 10,
marginBottom: store.ui.mediaQuery.isMobile ? 10 : 10,
}}
icon={<UploadOutlined/>}
>
Upload Product
</Button>
</div>
</Upload>
</Form.Item>
<Form.Item
name="supplierCode"
label="Supplier Code"
rules={[{required: true, message: "Please input Supplier Code!"}]}
icon={<PlusOutlined />}
onClick={() => setVisibleModalUpload(true)}
>
Tambah Produk
</Button>
</div>
)}
</div>
</Col>
</Row>
</div>
<ProductComponent />
</Card>
<Modal
visible={visibleModalUpload}
title={"Upload Excel Product"}
okText={"Create"}
cancelText="Cancel"
onCancel={() => {
form.resetFields();
handleCancel();
}}
onOk={() => {
form
.validateFields()
.then((values) => {
console.log(values, "isi form");
handleSubmit(values);
form.resetFields();
})
.catch((info) => {
console.error("Validate Failed:", info);
});
}}
>
<Form form={form} layout="vertical">
<Form.Item
name="fileName"
label="Upload Excel Product"
rules={[
{ required: true, message: "Please Upload Excel Product!" },
]}
>
<Upload
fileList={fileList}
onChange={handleChange}
beforeUpload={(file) => beforeUpload(file)}
customRequest={(args) => uploadHandler(args)}
onRemove={(file) => {
setLoading(false);
setFileList([]);
setExcel("");
}}
>
<Select>
{store.supplier.data.map(data => (
<Option key={data.id} value={data.code}>
{data.name}
</Option>
))}
</Select>
</Form.Item>
</Form>
</Modal>
</div>
<div
style={{
display: "flex",
flexDirection: "row",
justifyContent: "center",
}}
>
<Button
disabled={loading}
style={{
marginRight: store.ui.mediaQuery.isMobile ? 0 : 10,
}}
icon={<UploadOutlined />}
>
Upload Product
</Button>
</div>
</Upload>
</Form.Item>
<Form.Item
name="supplierCode"
label="Supplier Code"
rules={[{ required: true, message: "Please input Supplier Code!" }]}
>
<Select>
{store.supplier.data.map((data) => (
<Option key={data.id} value={data.code}>
{data.name}
</Option>
))}
</Select>
</Form.Item>
</Form>
</Modal>
</div>
);
});

20
src/pages/Profile/Profile.js
View File

@ -38,7 +38,7 @@ export const Profile = observer(() => {
const routeData = [
{
route: LINKS.HOME,
name: "Home",
name: "Beranda",
},
{
route: LINKS.PROFILE,
@ -46,6 +46,13 @@ export const Profile = observer(() => {
},
];
const dataRoute = [
{
route: LINKS.PROFILE,
name: "Profil",
},
];
useEffect(() => {
(async () => {
modalLoader.setLoading(true);
@ -214,7 +221,14 @@ export const Profile = observer(() => {
return (
<div className={["ppob-container"].join(" ")}>
<BreadcumbComponent data={routeData} />
<BreadcumbComponent
data={
store.authentication.userData.role === "Admin" ||
store.authentication.userData.role === "Admin Partner"
? routeData
: dataRoute
}
/>
<Card>
<Title strong>Profile</Title>
<Row style={{ marginBottom: 20 }}>
@ -362,7 +376,7 @@ export const Profile = observer(() => {
? `${appConfig.apiUrl}/config/image/${item}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
}
style={{ width: "10vw",marginRight:15 }}
style={{ width: "10vw", marginRight: 15 }}
/>
))}
</Row>

6
src/pages/Transaction/Transaction.js
View File

@ -55,13 +55,9 @@ export const Transaction = observer(() => {
};
const routeData = [
{
route: LINKS.HOME,
name: "Beranda",
},
{
route: LINKS.TRANSACTION,
name: <span style={{ fontWeight: "bold" }}>Transaksi</span>,
name: "Transaksi"
},
];