Pages Config

This commit is contained in:
2021-12-14 18:52:42 +07:00
parent f5903db03e
commit 558ca2a098
18 changed files with 421 additions and 342 deletions

View File

@@ -5,7 +5,7 @@ import {Link} from "react-router-dom";
export const BreadcumbComponent = (props) => {
return (
<div>
<Breadcrumb style={{marginBottom: 10}}>
<Breadcrumb>
{props.data.map((e, index) => (
<Breadcrumb.Item key={index}>
<Link to={e.route}>

View File

@@ -7,7 +7,7 @@ import {capitalize} from "lodash";
import {useStore} from "../utils/useStore";
import {LINKS} from "../routes/app";
export const CommisionComponent = observer((props) => {
export const CommissionComponent = observer((props) => {
const store = useStore();
const [form] = Form.useForm();
const {Option} = Select;
@@ -20,7 +20,7 @@ export const CommisionComponent = observer((props) => {
const init = async () => {
try {
setIsLoading(true);
await store.product.getDataSubCategories();
//await store.product.getDataSubCategories();
setIsLoading(false);
} catch (e) {
setIsLoading(false);
@@ -38,7 +38,7 @@ export const CommisionComponent = observer((props) => {
address: data.address,
});
store.product.visibleModalProduct = true;
store.commission.visibleModalCommission = true;
setIdData(data.id);
}
@@ -92,7 +92,7 @@ export const CommisionComponent = observer((props) => {
const deleteData = async (id) => {
try {
console.log(id);
await store.product.delete(id);
await store.commission.delete(id);
message.success("Data Berhasil Dihapus");
history.push(LINKS.PRODUCT);
} catch (err) {
@@ -119,7 +119,7 @@ export const CommisionComponent = observer((props) => {
const handleCancel = () => {
setIdData('')
store.product.visibleModalProduct = false;
store.commission.visibleModalCommission = false;
}
const handleSubmit = async (data) => {
@@ -127,26 +127,26 @@ export const CommisionComponent = observer((props) => {
if (idData !== '') {
setConfirmLoading(true);
try {
await store.product.update(idData, data)
await store.commission.update(idData, data)
message.success("Success Update Data Member")
} catch (e) {
message.error("Failed Update Data Member")
}
setConfirmLoading(false);
store.product.visibleModalProduct = false;
store.commission.visibleModalCommission = false;
setIdData('');
form.resetFields();
} else {
setConfirmLoading(true);
try {
await store.partner.create(data)
await store.commission.create(data)
message.success("Success Add New Member")
} catch (e) {
console.log(e, "apa errornya")
message.error("Failed Add Member")
}
setConfirmLoading(false);
store.product.visibleModalProduct = false;
store.commission.visibleModalCommission = false;
setIdData('');
form.resetFields();
}
@@ -157,7 +157,7 @@ export const CommisionComponent = observer((props) => {
<Table
style={{textAlign: "center"}}
columns={columns}
dataSource={store.partner.data}
dataSource={store.commission.data}
bordered
pagination={{
pageSize: store.product.pageSize,
@@ -168,17 +168,17 @@ export const CommisionComponent = observer((props) => {
}}
onChange={async (page) => {
let pageNumber = page.current;
store.product.pageSize = page.pageSize;
store.product.page = pageNumber - 1;
store.commission.pageSize = page.pageSize;
store.commission.page = pageNumber - 1;
// store.membership.isLoading = true;
await store.product.getData();
await store.commission.getData();
// store.membership.isLoading = false;
}}
/>
<Modal
visible={store.product.visibleModalProduct}
title={idData ? "Edit Product" : "Create a new Product"}
visible={store.commission.visibleModalCommission}
title={idData ? "Edit Commission" : "Create a new commission"}
okText={idData ? "Edit" : "Create"}
cancelText="Cancel"
onCancel={() => {

View File

@@ -1,244 +1,274 @@
import React, {useEffect, useState} from "react";
import {Button, Form, Input, message, Modal, Select, Space, Table, Tag} from "antd";
import {observer} from "mobx-react-lite";
import {ExclamationCircleOutlined} from "@ant-design/icons";
import {useHistory} from "react-router-dom";
import {capitalize} from "lodash";
import {useStore} from "../utils/useStore";
import {LINKS} from "../routes/app";
import React, { useEffect, useState } from "react";
import {
Button,
Form,
Input,
message,
Modal,
Select,
Space,
Table,
Tag,
} from "antd";
import { observer } from "mobx-react-lite";
import { ExclamationCircleOutlined } from "@ant-design/icons";
import { useHistory } from "react-router-dom";
import { capitalize } from "lodash";
import { useStore } from "../utils/useStore";
import { LINKS } from "../routes/app";
export const PartnerComponent = observer((props) => {
const store = useStore();
const [form] = Form.useForm();
const {Option} = Select;
const history = useHistory();
const [idData, setIdData] = useState('');
const [confirmLoading, setConfirmLoading] = useState(false);
const [isLoading, setIsLoading] = useState(false);
const store = useStore();
const [form] = Form.useForm();
const { Option } = Select;
const history = useHistory();
const [idData, setIdData] = useState("");
const [confirmLoading, setConfirmLoading] = useState(false);
const [isLoading, setIsLoading] = useState(false);
useEffect(() => {
const init = async () => {
try {
setIsLoading(true);
await store.partner.getDataSubCategories();
setIsLoading(false);
} catch (e) {
setIsLoading(false);
}
};
init();
}, []);
const handleEditButton = (data) => {
console.log(data, "isi data")
form.setFieldsValue({
name: data.name,
npwp: data.npwp,
address: data.address,
});
store.partner.visibleModalPartner = true;
setIdData(data.id);
}
const columns = [
{
title: "Name",
dataIndex: "name",
key: "name",
},
{
title: "Npwp",
dataIndex: "npwp",
key: "npwp",
},
{
title: "Address",
dataIndex: "address",
key: "address",
},
{
title: "Status",
dataIndex: "status",
key: "status",
render: (text, record) => (
<Tag
color={record?.status === true ? "processing" : "#E3E8EE"}
style={{ color: "#4F566B" }}
>
{record?.status === true ? " ACTIVE" : "INACTIVE"}
</Tag>
),
},
{
title: "Action",
key: "action",
render: (text, record) => (
<Space size="middle">
<Button
onClick={() => handleEditButton(record)}
>Edit</Button>
<Button
onClick={() => handleDelete(record.id)}
>
Delete
</Button>
</Space>
),
},
];
const deleteData = async (id) => {
try {
console.log(id);
await store.product.delete(id);
message.success("Data Berhasil Dihapus");
history.push(LINKS.PRODUCT);
} catch (err) {
console.log("error", err);
message.error("Gagal menghapus");
}
useEffect(() => {
const init = async () => {
try {
setIsLoading(true);
await store.partner.getData();
setIsLoading(false);
} catch (e) {
setIsLoading(false);
}
};
const handleDelete = (id) => {
Modal.confirm({
title: "Are you sure delete this record?",
icon: <ExclamationCircleOutlined/>,
okText: "Yes",
okType: "primary",
cancelText: "Cancel",
onOk() {
return deleteData(id);
},
onCancel() {
console.log("Cancel");
},
});
};
init();
}, []);
const handleCancel = () => {
setIdData('')
store.partner.visibleModalPartner = false;
const handleEditButton = (data) => {
console.log(data, "isi data");
form.setFieldsValue({
name: data.name,
npwp: data.npwp,
address: data.address,
});
store.partner.visibleModalPartner = true;
setIdData(data.id);
};
const columns = [
{
title: "Name",
dataIndex: "name",
key: "name",
},
{
title: "Npwp",
dataIndex: "npwp",
key: "npwp",
},
{
title: "Address",
dataIndex: "address",
key: "address",
},
{
title: "Status",
dataIndex: "status",
key: "status",
render: (text, record) => (
<Button type={record?.status === true ? "primary" : "danger"}>
{record?.status === true ? " ACTIVE" : "INACTIVE"}
</Button>
),
},
{
title: "Action",
key: "action",
render: (text, record) => (
<Space size="middle">
<Button onClick={() => handleEditButton(record)}>Edit</Button>
<Button onClick={() => handleDelete(record.id)}>Delete</Button>
</Space>
),
},
];
// const handleEditStatus = async (id)=>{
// try {
// console.log(id);
// await store.partner.delete(id);
// message.success("Data Berhasil Dihapus");
// history.push(LINKS.PARTNER);
// } catch (err) {
// console.log("error", err);
// message.error("Gagal menghapus");
// }
// }
const deleteData = async (id) => {
try {
console.log(id);
await store.partner.delete(id);
message.success("Data Berhasil Dihapus");
history.push(LINKS.PARTNER);
} catch (err) {
console.log("error", err);
message.error("Gagal menghapus");
}
};
const handleSubmit = async (data) => {
console.log(data, "isi data2")
if (idData !== '') {
setConfirmLoading(true);
try {
await store.partner.update(idData, data)
message.success("Success Update Data Member")
} catch (e) {
message.error("Failed Update Data Member")
}
setConfirmLoading(false);
store.partner.visibleModalPartner = false;
setIdData('');
form.resetFields();
} else {
setConfirmLoading(true);
try {
await store.partner.create(data)
message.success("Success Add New Member")
} catch (e) {
console.log(e, "apa errornya")
message.error("Failed Add Member")
}
setConfirmLoading(false);
store.partner.visibleModalPartner = false;
setIdData('');
form.resetFields();
}
const handleDelete = (id) => {
Modal.confirm({
title: "Are you sure delete this record?",
icon: <ExclamationCircleOutlined />,
okText: "Yes",
okType: "primary",
cancelText: "Cancel",
onOk() {
return deleteData(id);
},
onCancel() {
console.log("Cancel");
},
});
};
const handleCancel = () => {
setIdData("");
store.partner.visibleModalPartner = false;
};
const handleSubmit = async (data) => {
console.log(data, "isi data2");
if (idData !== "") {
setConfirmLoading(true);
try {
await store.partner.update(idData, data);
message.success("Success Update Data Partner");
//await store.partner.getData()
} catch (e) {
message.error("Failed Update Data Partner");
}
setConfirmLoading(false);
store.partner.visibleModalPartner = false;
setIdData("");
form.resetFields();
} else {
setConfirmLoading(true);
try {
await store.partner.create(data);
message.success("Success Add New Partner");
//await store.partner.getData()
} catch (e) {
console.log(e, "apa errornya");
message.error("Failed Add Partner");
}
setConfirmLoading(false);
store.partner.visibleModalPartner = false;
setIdData("");
form.resetFields();
}
};
return (
<div>
<Table
style={{ textAlign: "center" }}
columns={columns}
dataSource={store.partner.data}
bordered
pagination={{
pageSize: store.partner.pageSize,
total: store.partner.total_data,
current: store.partner.page + 1,
showSizeChanger: true,
simple: false,
}}
onChange={async (page) => {
let pageNumber = page.current;
store.partner.pageSize = page.pageSize;
store.partner.page = pageNumber - 1;
//store.membership.isLoading = true;
await store.partner.getData();
// store.membership.isLoading = false;
}}
/>
return (
<div>
<Table
style={{textAlign: "center"}}
columns={columns}
dataSource={store.partner.data}
bordered
pagination={{
pageSize: store.partner.pageSize,
total: store.partner.total_data,
current: store.partner.page + 1,
showSizeChanger: true,
simple: false
}}
onChange={async (page) => {
let pageNumber = page.current;
store.partner.pageSize = page.pageSize;
store.partner.page = pageNumber - 1;
// store.membership.isLoading = true;
await store.partner.getData();
// store.membership.isLoading = false;
}}
/>
<Modal
visible={store.partner.visibleModalPartner}
title={idData ? "Edit Product" : "Create a new Product"}
okText={idData ? "Edit" : "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="name"
label="Name"
rules={[{required: true, message: 'Please input name!'}]}
>
<Input/>
</Form.Item>
<Form.Item
name="owner"
label="Owner"
rules={[{required: true, message: 'Please input owner!'}]}
>
<Input/>
</Form.Item>
<Form.Item
name="password_account"
label="Password Account"
rules={[{required: true, message: 'Please input password account!'}]}
>
<Input/>
</Form.Item>
<Form.Item
name="npwp"
label="Npwp"
rules={[{required: true, message: 'Please input npwp!'}]}
>
<Input/>
</Form.Item>
<Form.Item
name="address"
label="address"
rules={[{required: true, message: 'Please input password!'}]}
>
<Input/>
</Form.Item>
</Form>
</Modal>
</div>
);
<Modal
visible={store.partner.visibleModalPartner}
title={idData ? "Edit Partner" : "Create a new partner"}
okText={idData ? "Edit" : "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="name"
label="Name"
rules={[
idData
? { required: false }
: { required: true, message: "Please input password name!" }]}
>
<Input />
</Form.Item>
<Form.Item
name="owner"
label="Owner"
rules={[
idData
? { required: false }
: { required: true, message: "Please input name!" }
]}
>
<Input />
</Form.Item>
<Form.Item
name="password_account"
label="Password Account"
rules={[
idData
? { required: false }
: { required: true, message: "Please input password account!" }
]}
>
<Input />
</Form.Item>
<Form.Item
name="npwp"
label="Npwp"
rules={[
idData
? { required: false }
: { required: true, message: "Please input npwp!" }
]}
>
<Input />
</Form.Item>
<Form.Item
name="address"
label="address"
rules={[
idData
? { required: false }
: { required: true, message: "Please input password address!" }
]}
>
<Input />
</Form.Item>
</Form>
</Modal>
</div>
);
});

View File

@@ -30,7 +30,7 @@ export const SupplierComponent = observer((props) => {
const init = async () => {
try {
setIsLoading(true);
await store.product.getDataSubCategories();
await store.supplier.getData();
setIsLoading(false);
} catch (e) {
setIsLoading(false);
@@ -90,7 +90,7 @@ export const SupplierComponent = observer((props) => {
const deleteData = async (id) => {
try {
console.log(id);
await store.product.delete(id);
await store.supplier.delete(id);
message.success("Data Berhasil Dihapus");
history.push(LINKS.PRODUCT);
} catch (err) {