Perbaikan PPOB

This commit is contained in:
ajat91.sudrajat 2022-01-11 14:33:09 +07:00
parent b24ea23e3d
commit a9d0d199d1
15 changed files with 344 additions and 107 deletions

View File

@ -8,6 +8,8 @@ import {
Select,
Space,
Table,
List,
Divider
} from "antd";
import { observer } from "mobx-react-lite";
import { useHistory } from "react-router-dom";
@ -115,6 +117,7 @@ export const CategoryComponent = observer((props) => {
return (
<div>
{store.ui.mediaQuery.isDesktop && (
<Table
style={{ textAlign: "center" }}
columns={columns}
@ -136,7 +139,73 @@ export const CategoryComponent = observer((props) => {
modalLoader.setLoading(false);
}}
/>
)}
{store.ui.mediaQuery.isMobile && (
<List
itemLayout="horizontal"
position={"top"}
pagination={{
onChange: async (page, pageSize) => {
store.category.pageSize = pageSize;
store.category.page = page - 1;
modalLoader.setLoading(true);
await store.category.getData();
modalLoader.setLoading(false);
},
pageSize: store.category.pageSize,
total: store.category.total_data,
current: store.category.page + 1,
style: { marginBottom: "1rem", marginRight: "1rem" },
}}
dataSource={store.category.data}
style={{ padding: 0 }}
renderItem={(item) => {
return (
<div>
<List.Item
key={item.id}
style={{
backgroundColor: "#ffffff",
paddingTop: 0,
paddingBottom: 0,
display: "flex",
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
}}
>
<List.Item.Meta
className={["cariparkir-container"].join(" ")}
title={item.code}
description={
<div style={{}}>
<p>
<small>Category : {item.name}</small>
<br />
</p>
<p></p>
</div>
}
/>
<div style={{ marginRight: 16 }}>
<p
style={{
fontSize: 9,
margin: 0,
}}
>
<Button onClick={() => handleEditButton(item)}>
Edit
</Button>
</p>
</div>
</List.Item>
<Divider plain style={{ margin: 0 }} />
</div>
);
}}
/>
)}
<Modal
visible={store.category.visibleModalCategory}
title={idData ? "Edit Category" : "Create a new Category"}

View File

@ -235,9 +235,9 @@ export const PartnerComponent = observer((props) => {
itemLayout="horizontal"
position={"top"}
pagination={{
onChange: async (page) => {
store.partner.pageSize = page.pageSize;
store.partner.page = page.current - 1;
onChange: async (page, pageSize) => {
store.partner.pageSize = pageSize;
store.partner.page = page - 1;
modalLoader.setLoading(true);
await store.partner.getData();
modalLoader.setLoading(false);
@ -270,9 +270,11 @@ export const PartnerComponent = observer((props) => {
description={
<div style={{}}>
<p>
<div style={{ marginBottom: 10 }}>
<small>Nama : {item.name}</small> <br />
<small>Npwp : {item.npwp}</small> <br />
<small>Address : {item.address}</small>
</div>
<Space size="middle">
<Button
type={

View File

@ -313,9 +313,9 @@ export const ProductComponent = observer((props) => {
itemLayout="horizontal"
position={"top"}
pagination={{
onChange: async (page) => {
store.product.pageSize = page.pageSize;
store.product.page = page.current - 1;
onChange: async (page,pageSize) => {
store.product.pageSize = pageSize;
store.product.page = page - 1;
modalLoader.setLoading(true);
await store.product.getData();
modalLoader.setLoading(false);

View File

@ -148,9 +148,9 @@ export const SubcategoryComponent = observer((props) => {
itemLayout="horizontal"
position={"top"}
pagination={{
onChange: async (page) => {
store.subcategory.pageSize = page.pageSize;
store.subcategory.page = page.current - 1;
onChange: async (page,pageSize) => {
store.subcategory.pageSize = pageSize;
store.subcategory.page = page - 1;
modalLoader.setLoading(true);
await store.subcategory.getData();
modalLoader.setLoading(false);

View File

@ -251,9 +251,9 @@ export const SupplierComponent = observer((props) => {
itemLayout="horizontal"
position={"top"}
pagination={{
onChange: async (page) => {
store.supplier.pageSize = page.pageSize;
store.supplier.page = page.current - 1;
onChange: async (page,pageSize) => {
store.supplier.pageSize = pageSize;
store.supplier.page = page - 1;
modalLoader.setLoading(true);
await store.supplier.getData();
modalLoader.setLoading(false);

View File

@ -205,23 +205,19 @@ export const DesktopLayout = observer(() => {
<span>Produk</span>
</Link>
</Menu.Item>
{store.authentication.userData.role === "Admin" && (
<Menu.Item key="sub-category">
<Link to={LINKS.SUBCATEGORY}>
<FileSyncOutlined />
<span>Sub Kategori</span>
</Link>
</Menu.Item>
)}
</SubMenu>
)}
{store.authentication.userData.role === "Admin" && (
<Menu.Item key="category">
<Link to={LINKS.CATEGORY}>
<FileAddOutlined />
<span>Kategori</span>
</Link>
</Menu.Item>
</SubMenu>
)}
{store.authentication.userData.role === "Supervisor" && (
<Menu.Item key="product">

View File

@ -43,6 +43,7 @@ export const DetailUser = observer(() => {
modalLoader.setLoading(false);
})();
return () => {
store.membership.dataDetail = {};
store.transaction.dataHistoryTopUp = [];
@ -265,6 +266,9 @@ export const DetailUser = observer(() => {
justifyContent: "center",
}
: null;
console.log(JSON.parse(store.authentication.dataProfit.userDetail?.image_store)," ini dia")
const data = JSON.parse(store.authentication.dataProfit.userDetail?.image_store)
console.log(data,"ini data")
return (
<div className={["ppob-container"].join(" ")}>
<BreadcumbComponent data={routeData} />
@ -412,7 +416,7 @@ export const DetailUser = observer(() => {
<Text>
<Image
src={
store.authentication.dataProfit.profileData
store.authentication.dataProfit.userDetail
?.image_identity
? `${appConfig.apiUrl}/config/image/${store.authentication.dataProfit.userDetail?.image_identity}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
@ -421,19 +425,25 @@ export const DetailUser = observer(() => {
/>
</Text>
</Col>
<Col span={12}>
<Text>
{data.map((item)=>{
<Image
src={
store.authentication.dataProfit.profileData
store.authentication.dataProfit.userDetail
?.image_store
? `${appConfig.apiUrl}/config/image/${store.authentication.dataProfit.userDetail?.image_store}`
? `${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" }}
/>
})}
</Text>
</Col>
</Row>
)}
{store.authentication.userData.role === "Admin" && (
@ -448,7 +458,7 @@ export const DetailUser = observer(() => {
<Text>
<Image
src={
store.authentication.dataProfit.profileData?.image_identity
store.authentication.dataProfit.userDetail?.image_identity
? "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
: `${appConfig.apiUrl}/config/image/${store.authentication.dataProfit.userDetail?.image_identity}`}
style={{ width: "10vw" }}
@ -459,7 +469,7 @@ export const DetailUser = observer(() => {
<Text>
<Image
src={
store.authentication.dataProfit.profileData
store.authentication.dataProfit.userDetail
?.image_store
?"https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
: `${appConfig.apiUrl}/config/image/${store.authentication.dataProfit.userDetail?.image_store}` }
@ -479,7 +489,7 @@ export const DetailUser = observer(() => {
<Text>
<Image
src={
store.authentication.dataProfit.profileData
store.authentication.dataProfit.userDetail
?.image_identity
? `${appConfig.apiUrl}/config/image/${store.authentication.profileData.userDetail?.image_identity}`
: "https://st4.depositphotos.com/14953852/24787/v/600/depositphotos_247872612-stock-illustration-no-image-available-icon-vector.jpg"
@ -629,9 +639,9 @@ export const DetailUser = observer(() => {
itemLayout="horizontal"
position={"top"}
pagination={{
onChange: async (page) => {
store.transaction.pageSize = page.pageSize;
store.transaction.page = page.current - 1;
onChange: async (page,pageSize) => {
store.transaction.pageSize = pageSize;
store.transaction.page = page - 1;
modalLoader.setLoading(true);
await getData();
modalLoader.setLoading(false);

View File

@ -30,6 +30,7 @@ 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;
@ -291,7 +292,7 @@ export const Membership = observer(() => {
const request = {
...data,
image_identity: image,
image_store: imageStore,
image_store: JSON.stringify(imageStore),
};
const response = await store.membership.create(request);
response?.body?.statusCode === 201 || response?.body?.statusCode === 200
@ -308,6 +309,7 @@ export const Membership = observer(() => {
setConfirmLoading(false);
setVisibleModal(false);
setInitialData({});
form.resetFields();
}
};
return (
@ -385,9 +387,9 @@ export const Membership = observer(() => {
itemLayout="horizontal"
position={"top"}
pagination={{
onChange: async (page) => {
store.membership.pageSize = page.pageSize;
store.membership.page = page.current - 1;
onChange: async (page, pageSize) => {
store.membership.pageSize = pageSize;
store.membership.page = page -1;
modalLoader.setLoading(true);
await getData();
modalLoader.setLoading(false);

View File

@ -87,15 +87,14 @@ export const MembershipModal = ({
const res = await store.payback.uploadImages(file);
console.log(res, "ini respon 2");
setImageStore(`${appConfig.apiUrl}/config/image/${res.body.filename}`);
setResponseFilenameStore(res.body.filename);
setFileStore([
{
setResponseFilenameStore([...responseFilenameStore, res.body.filename]);
setFileStore([...fileStore, {
uid: "-1",
name: res.body.filename,
status: "done",
url: `${appConfig.apiUrl}/config/image/${res.body.filename}`,
},
]);
} ]);
setLoadingStore(false);
};
@ -159,6 +158,15 @@ export const MembershipModal = ({
.then((values) => {
onCreate(values,responseFilename,responseFilenameStore);
form.resetFields();
setFileStore([])
setImage("");
setFileList([]);
setPreviewImage("");
setResponseFilename("");
setImageStore("");
setFileStore([]);
setPreviewImageStore("");
setResponseFilenameStore("");
})
.catch((info) => {
console.log("Validate Failed:", info);
@ -435,13 +443,14 @@ export const MembershipModal = ({
onChange={handleChangeStore}
beforeUpload={(file) => beforeUploadStore(file)}
customRequest={(args) => uploadHandlerStore(args)}
maxCount={3}
onRemove={(file) => {
setImageStore("");
setLoadingStore(false);
setFileStore([]);
}}
>
{imageStore === "" ? uploadButtonStore : null}
{fileStore.length >= 3 ? null:uploadButtonStore }
</Upload>
<h5
style={{

View File

@ -0,0 +1,141 @@
import React from 'react';
import { Image, Modal, Upload, message } from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import { http } from "../utils/http";
function getBase64(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
}
export class PicturesWall extends React.Component {
state = {
previewVisible: false,
previewImage: '',
previewTitle: '',
fileList: [],
};
handleCancel = () => this.setState({ previewVisible: false });
handlePreview = async file => {
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}
this.setState({
previewImage: file.url || file.preview,
previewTitle: file.name || file.url.substring(file.url.lastIndexOf('/') + 1),
previewVisible: true,
});
};
handlePreviewCancel = () => {
this.setState({
previewVisible: false,
});
};
handleChange = ({ fileList }, info) => {
// if (this.props.maxUpload) {
// if (fileList.length > this.props.maxUpload) {
// fileList.splice(0, 1)
// }
// }
// if (info.file.status !== 'uploading') {
// console.log(info.file, info.fileList);
// }
// if (info.file.status === 'done') {
// message.success(`${info.file.name} file uploaded successfully`);
// } else if (info.file.status === 'error') {
// message.error(`${info.file.name} file upload failed.`);
// }
this.setState({ fileList })
};
render() {
const { previewVisible, previewImage, fileList, previewTitle, handlePreviewCancel } = this.state;
const uploadButton = (
<div>
<PlusOutlined />
<div style={{ marginTop: 8 }}>Upload</div>
</div>
);
return (
<>
<Upload
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
listType="picture-card"
fileList={fileList}
accept={'.png, .jpg, .jpeg, .PNG, .JPG, .JPEG'}
onPreview={this.handlePreview}
onChange={this.handleChange}
beforeUpload={(file) => {
console.log({ file })
http.uploadAntd({
file,
onError() {
},
onProgress(event) {
console.log({ event })
},
onSuccess: (res) => {
if (this.props.onUpload) {
const { fileList } = this.state
const index = fileList.findIndex(d => d.uid === file.uid)
if (fileList.length > this.props.maxUpload) {
this.setState({
fileList: []
}) && this.props.onUpload()
message.error('Upload foto tidak boleh melebihi batas maksimal!');
} else {
fileList[index].path = res.body.path
this.setState({
...fileList
})
this.props.onUpload(fileList)
}
}
}
})
return false;
}}
{...(this.props.uploadProps || {})}
>
{/* {fileList.length > this.props.maxUpload ?
this.setState({
fileList: []
}) && this.props.onUpload() && null
:
''} */}
{fileList.length >= this.props.maxUpload ? '' : uploadButton}
</Upload>
<Modal
visible={previewVisible}
title={previewTitle}
footer={null}
onCancel={this.handleCancel}
>
<Image
onClick={this.handleCancel}
src={previewImage}
/>
</Modal>
</>
);
}
}
export default PicturesWall;

View File

@ -367,12 +367,10 @@ export const Payback = observer(() => {
>
<List.Item.Meta
className={["cariparkir-container"].join(" ")}
title={item.name}
title={item.userData_name}
description={
<div style={{}}>
<p>
<span>{item.userData_name}</span>
<br />
<small>Amount: {item.amount}</small>
<br />
{PAYBACK_STATUS[item.status] ===

View File

@ -274,9 +274,9 @@ export const PaybackCreated = observer(() => {
itemLayout="horizontal"
position={"top"}
pagination={{
onChange: async (page) => {
store.payback.pageSizeCreated = page.pageSize;
store.payback.pageCreated = page.current - 1;
onChange: async (page, pageSize) => {
store.payback.pageSizeCreated = pageSize;
store.payback.pageCreated = page - 1;
modalLoader.setLoading(true);
await store.payback.getDataCreated();
modalLoader.setLoading(false);
@ -308,7 +308,7 @@ export const PaybackCreated = observer(() => {
title={item.name}
description={
<div style={{}}>
<Image src={item.image_prove} preview={false} />
<small>Amount: {item.amount}</small>
</div>
}
/>
@ -319,7 +319,12 @@ export const PaybackCreated = observer(() => {
margin: 0,
}}
>
{item.amount}
{" "}
<Image
src={`${appConfig.apiUrl}/config/image/${item.image_prove}`}
style={{ width: "20vw" }}
preview={true}
/>
</p>
</div>
</List.Item>

View File

@ -401,20 +401,19 @@ export const Profile = observer(() => {
position={"top"}
dataSource={store.transaction.dataHistoryTransaction}
pagination={{
pageSize: store.transaction.pageSizeHistoryTransaction,
total: store.transaction.total_dataHistoryTransaction,
current: store.transaction.pageHistoryTransaction + 1,
showSizeChanger: true,
simple: false,
}}
onChange={async (page) => {
let pageNumber = page.current;
store.transaction.pageSizeHistoryTransaction =
page.pageSize;
store.transaction.pageHistoryTransaction = pageNumber - 1;
onChange: async (page, pageSize) => {
console.log(page,'Page')
console.log(pageSize,'Page size')
store.transaction.pageSizeHistoryTransaction = pageSize;
store.transaction.pageHistoryTransaction = page -1;
modalLoader.setLoading(true);
await store.transaction.getDataHistoryTransaction();
modalLoader.setLoading(false);
},
pageSize: store.transaction.pageSizeHistoryTransaction,
total:store.transaction.total_dataHistoryTransaction,
current: store.transaction.pageHistoryTransaction + 1,
style: { marginBottom: "1rem", marginRight: "1rem" },
}}
style={{ padding: 0 }}
renderItem={(item) => {
@ -472,6 +471,10 @@ export const Profile = observer(() => {
No.Seri : {item.seri_number}
</small>{" "}
<br />
<small>
Alasan Gagal : {item.failed_reason}
</small>{" "}
<br />
<small>
IDTrx Mitra :{" "}
{item.partner_transaction_code}

View File

@ -48,6 +48,7 @@ export class Product {
}) ?? []
this.total_data = response?.body?.count ?? 0
//console.log(this.total_data)
} catch (e) {
console.error(e);
}

View File

@ -135,6 +135,7 @@ 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);
}