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

Merge branch 'develop' of https://gitlab.com/empatnusabangsa/ppob/ppob-frontend into develop

Browse Source
This commit is contained in:
ajat91.sudrajat 2021-12-22 16:47:34 +07:00
commit aa2c658f69
7 changed files with 89 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

106
src/component/ProductComponent.js
View File

@ -15,9 +15,8 @@ export const ProductComponent = observer((props) => {
const {Option} = Select;
const history = useHistory();
const [idData, setIdData] = useState("");
const [filterSupplier, setFilterSupplier] = useState(null);
const [filterCategories, setFilterCategories] = useState(null);
const [filterSubCategories, setFilterSubCategories] = useState(null);
const [filterSupplier, setFilterSupplier] = useState([]);
const [filterSubCategories, setFilterSubCategories] = useState([]);
const modalLoader = useContext(ModalLoaderContext);
const handleEditButton = (data) => {
@ -42,18 +41,18 @@ export const ProductComponent = observer((props) => {
},
{
title: "Produk",
dataIndex: ["product_name"],
dataIndex: "product_name",
key: "product_name",
},
{
title: "Harga Beli",
dataIndex: ["current_price_price"],
key: ["current_price_price"],
dataIndex: "current_price_price",
key: "current_price_price",
},
{
title: "Harga Jual",
dataIndex: ["mark_up_price"],
key: ["mark_up_price"],
dataIndex: "mark_up_price",
key: "mark_up_price",
},
// {
// title: "Gangguan",
@ -163,17 +162,17 @@ export const ProductComponent = observer((props) => {
const handleRemoveFilter = async () => {
store.product.filterSupplier = null;
store.product.filterSubCategory = null;
setFilterSupplier(null);
setFilterCategories(null);
setFilterSubCategories(null);
setFilterSupplier([]);
store.product.filterCategory = null;
setFilterSubCategories([]);
await store.product.getData();
store.product.visibleModalFilterProduct = false;
};
const handleCancelFilter = () => {
setFilterSupplier(null);
setFilterCategories(null);
setFilterSubCategories(null);
setFilterSupplier([]);
store.product.filterCategory = null;
setFilterSubCategories([]);
store.product.visibleModalFilterProduct = false;
};
@ -186,14 +185,24 @@ export const ProductComponent = observer((props) => {
store.product.visibleModalFilterProduct = false;
};
const handleFilterCategory = async (value) => {
if (value) {
store.product.filterCategory = value;
await store.product.getDataSubCategories();
} else {
store.product.filterCategory = null;
await store.product.getDataSubCategories();
}
};
const footerLayoutFilter = [
<Button
key={"remove"}
onClick={handleRemoveFilter}
style={{
backgroundColor: "#e74e5e",
color: "#fff",
}}
key={"remove"}
onClick={handleRemoveFilter}
style={{
backgroundColor: "#e74e5e",
color: "#fff",
}}
>
Remove Filter
</Button>,
@ -403,17 +412,18 @@ export const ProductComponent = observer((props) => {
Filter Supplier
</Title>
<Select
mode={"multiple"}
placeholder="Choose Supplier"
onChange={(val) => {
setFilterSupplier(val);
}}
style={{ marginBottom: "20px", width: "100%" }}
mode={"multiple"}
placeholder="Choose Supplier"
onChange={(val) => {
setFilterSupplier(val);
}}
style={{marginBottom: "20px", width: "100%"}}
value={filterSupplier}
>
{store.supplier.data.map((item) => (
<Option value={item.id} key={item.id}>
{item.name}
</Option>
<Option value={item.id} key={item.id}>
{item.name}
</Option>
))}
</Select>
</Col>
@ -422,19 +432,16 @@ export const ProductComponent = observer((props) => {
Filter Categories
</Title>
<Select
mode={"multiple"}
placeholder="Choose Category"
onChange={async (val) => {
setFilterCategories(val);
store.product.filterByCategory = val;
await store.product.getDataSubCategories();
}}
style={{ marginBottom: "20px", width: "100%" }}
mode={"multiple"}
placeholder="Choose Category"
onChange={async (val) => handleFilterCategory(val)}
style={{marginBottom: "20px", width: "100%"}}
value={store.product.filterCategory || []}
>
{store.category.data.map((item) => (
<Option value={item.id} key={item.id}>
{item.name}
</Option>
<Option value={item.id} key={item.id}>
{item.name}
</Option>
))}
</Select>
</Col>
@ -443,17 +450,18 @@ export const ProductComponent = observer((props) => {
Filter Sub-Categories
</Title>
<Select
mode={"multiple"}
placeholder="Choose Sub-Category"
onChange={(val) => {
setFilterSubCategories(val);
}}
style={{ marginBottom: "20px", width: "100%" }}
mode={"multiple"}
placeholder="Choose Sub-Category"
onChange={(val) => {
setFilterSubCategories(val);
}}
style={{marginBottom: "20px", width: "100%"}}
value={filterSubCategories}
>
{store.product.dataSubCategories.map((item) => (
<Option value={item.id} key={item.id}>
{item.name}
</Option>
<Option value={item.id} key={item.id}>
{item.name}
</Option>
))}
</Select>
</Col>

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

@ -1,35 +1,16 @@
import React, { useContext, useEffect, useState } from "react";
import {
Button,
Card,
Col,
Divider,
Form,
Input,
List,
message,
Modal,
Row,
Select,
Space,
Table,
Tag,
} from "antd";
import { useStore } from "../../utils/useStore";
import { observer } from "mobx-react-lite";
import {
DownloadOutlined,
ExclamationCircleOutlined,
PlusSquareOutlined,
} from "@ant-design/icons";
import { MembershipModal } from "./MembershipModal";
import { BreadcumbComponent } from "../../component/BreadcumbComponent";
import { LINKS } from "../../routes/app";
import { Link, useHistory } from "react-router-dom";
import { ModalLoaderContext } from "../../utils/modal";
import React, {useContext, useEffect, useState} from "react";
import {Button, Card, Col, Divider, Form, Input, List, message, Modal, Row, Select, Space, Table, Tag,} from "antd";
import {useStore} from "../../utils/useStore";
import {observer} from "mobx-react-lite";
import {DownloadOutlined, PlusSquareOutlined,} from "@ant-design/icons";
import {MembershipModal} from "./MembershipModal";
import {BreadcumbComponent} from "../../component/BreadcumbComponent";
import {LINKS} from "../../routes/app";
import {useHistory} from "react-router-dom";
import {ModalLoaderContext} from "../../utils/modal";
const { Search } = Input;
const { Option } = Select;
const {Search} = Input;
const {Option} = Select;
export const Membership = observer(() => {
const history = useHistory();
const [form] = Form.useForm();
@ -357,7 +338,7 @@ export const Membership = observer(() => {
store.membership.pageSize = page.pageSize;
store.membership.page = pageNumber - 1;
modalLoader.setLoading(true);
//await getData();
await getData();
modalLoader.setLoading(false);
}}
/>

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

@ -6,6 +6,7 @@ import {CheckCircleOutlined, CloseOutlined, FilterOutlined,} from "@ant-design/i
import {BreadcumbComponent} from "../../component/BreadcumbComponent";
import {LINKS} from "../../routes/app";
import {ModalLoaderContext} from "../../utils/modal";
import {appConfig} from "../../config/app";
const {Search} = Input;
@ -39,12 +40,11 @@ export const Payback = observer(() => {
dataIndex: "image_prove",
key: "image_prove",
render: (text, record) => (
<Image
src={record.picture}
style={{width: 50, height: 50}}
shape="circle"
alt="avatar"
/>
<Image
src={`${appConfig.apiUrl}/config/image/${text}`}
style={{width: '5vw'}}
alt={record.id}
/>
),
},
{

15
src/pages/Payback/PaybackModal.js
View File

@ -12,7 +12,7 @@ export const PaybackModal = ({initialData}) => {
const [image, setImage] = useState("");
const [fileList, setFileList] = useState([]);
const [previewImage, setPreviewImage] = useState("");
const [previewVisible, setPreviewVisible] = useState(false);
const [responseFilename, setResponseFilename] = useState("");
const [loading, setLoading] = useState(false);
const modalLoader = useContext(ModalLoaderContext);
@ -34,6 +34,7 @@ export const PaybackModal = ({initialData}) => {
const file = args.file;
const res = await http.upload(file);
setImage(`${appConfig.apiUrl}/config/image/${res.body.filename}`);
setResponseFilename(res.body.filename);
setFileList([{
uid: '-1',
name: 'image',
@ -62,7 +63,8 @@ export const PaybackModal = ({initialData}) => {
try {
const request = {
...data,
destination: store.authentication.profileData.superior?.id
destination: store.authentication.profileData.superior?.id,
image_prove: responseFilename
}
await store.payback.create(request);
message.success("Success Add Payback");
@ -74,21 +76,21 @@ export const PaybackModal = ({initialData}) => {
message.error(e.message);
}
modalLoader.setLoading(false);
form.resetFields();
store.payback.visibleModalPayback = false;
form.resetFields();
setImage("");
setFileList([]);
setPreviewImage("");
setPreviewVisible(false);
setResponseFilename("");
};
const handleCancel = () => {
form.resetFields();
store.payback.visibleModalPayback = false;
setImage("");
setFileList([]);
setPreviewImage("");
setPreviewVisible(false);
setResponseFilename("");
store.payback.visibleModalPayback = false;
}
return (
@ -126,7 +128,6 @@ export const PaybackModal = ({initialData}) => {
fileList={fileList}
onPreview={(file) => {
setPreviewImage(file.url || file.filename);
setPreviewVisible(file.url || file.filename);
}}
showUploadList={true}
onChange={handleChange}

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

@ -21,7 +21,7 @@ export const Product = observer(() => {
await Promise.allSettled([
store.supplier.getData(),
store.category.getData(),
store.category.getDataSubCategories(),
store.product.getDataSubCategories(),
]);
await store.product.getData();
modalLoader.setLoading(false);

4
src/store/product.js
View File

@ -21,7 +21,7 @@ export class Product {
pageSizeSubCategories = 10
dataSubCategories = [];
total_dataSubCategories = 0;
filterByCategory = null;
filterCategory = null;
constructor(ctx) {
this.ctx = ctx;
@ -45,7 +45,7 @@ export class Product {
async getDataSubCategories() {
try {
const response = await http.get(`/product/sub-categories?category=${this.filterByCategory}&page=${this.pageSubCategories}&pageSize=${this.pageSizeSubCategories}`);
const response = await http.get(`/product/sub-categories?category=${this.filterCategory}&page=${this.pageSubCategories}&pageSize=${this.pageSizeSubCategories}`);
this.dataSubCategories = response.body.data.map((item, idx) => {
item.key = idx;
return item

4
src/store/role.js
View File

@ -2,8 +2,8 @@ import {makeAutoObservable} from "mobx";
import {http} from "../utils/http";
export class Role {
page = null;
pageSize = null;
page = 0;
pageSize = 10;
data = [];
total_data = 0;