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

Perbaikan Menu Transaksi

Browse Source
This commit is contained in:
ajat91.sudrajat 2021-12-30 18:09:00 +07:00
parent 07c08472b3
commit fc944a23e0
3 changed files with 76 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/component/PartnerComponent.js
View File

@ -422,7 +422,7 @@ export const PartnerComponent = observer((props) => {
},
{
pattern: /^[\d]{2,12}$/,
message: "Phone number should be 12 character",
message: "Phone number should be less than 12 character",
},
]}
>

2
src/pages/Membership/MembershipModal.js
View File

@ -103,7 +103,7 @@ export const MembershipModal = ({
{
//pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#\$%\^&\*])(?=.{8,})/,
pattern: /^[\d]{2,12}$/,
message: "Phone number should be 12 character",
message: "Phone number should be less than 12 character",
},
]}
>

135
src/pages/Transaction/Product.js
View File

@ -1,11 +1,11 @@
import React, {useContext, useEffect, useState} from "react";
import {useStore} from "../../utils/useStore";
import {Card, Col, Form, Input, message, Modal, Row, Select} from "antd";
import {observer} from "mobx-react-lite";
import {ModalLoaderContext} from "../../utils/modal";
import React, { useContext, useEffect, useState } from "react";
import { useStore } from "../../utils/useStore";
import { Card, Col, Form, Input, message, Modal, Row, Select } from "antd";
import { observer } from "mobx-react-lite";
import { ModalLoaderContext } from "../../utils/modal";
const {Search} = Input;
const {Option} = Select;
const { Search } = Input;
const { Option } = Select;
export const Product = observer(() => {
const store = useStore();
@ -72,34 +72,34 @@ export const Product = observer(() => {
};
return (
<div>
<Row>
<span style={{fontWeight: "bold", marginBottom: "10px"}}>
<div>
<Row>
<span style={{ fontWeight: "bold", marginBottom: "10px" }}>
Sub Category
</span>
</Row>
<Row>
<Col span={24}>
<Select
placeholder={"Select Sub Category"}
allowClear={true}
onChange={(val) => handleChangeSubcategory(val)}
style={{marginBottom: "10px", width: "100%"}}
value={store.transaction.filterSubCategory}
>
{store.transaction.dataSubCategories.map((item, index) => (
<Option key={item.id} value={item.id}>
{item.name}
</Option>
))}
</Select>
</Col>
</Row>
<Row justify={"center"} align={"center"} style={{marginBottom: "1rem"}}>
<Col
span={12}
style={{fontWeight: "bold", display: "flex", alignItems: "center"}}
</Row>
<Row>
<Col span={24}>
<Select
placeholder={"Select Sub Category"}
allowClear={true}
onChange={(val) => handleChangeSubcategory(val)}
style={{ marginBottom: "10px", width: "100%" }}
value={store.transaction.filterSubCategory}
>
{store.transaction.dataSubCategories.map((item, index) => (
<Option key={item.id} value={item.id}>
{item.name}
</Option>
))}
</Select>
</Col>
</Row>
<Row justify={"center"} align={"center"} style={{ marginBottom: "1rem" }}>
<Col
span={12}
style={{ fontWeight: "bold", display: "flex", alignItems: "center" }}
>
Produk & Nominal
</Col>
<Col span={12} style={{ textAlign: "right" }}>
@ -115,7 +115,7 @@ export const Product = observer(() => {
<Col key={index} xs={24} md={16} lg={8}>
<Card
onClick={() => {
setVisibleModalBuy(true)
setVisibleModalBuy(true);
}}
hoverable
style={{
@ -123,12 +123,12 @@ export const Product = observer(() => {
marginLeft: 10,
borderColor: "salmon",
height: 100,
marginBottom: 10
marginBottom: 10,
}}
>
<span style={{color: "black"}}>{item.product_name}</span>
<br/>
<span style={{color: "grey", fontSize: 10}}>
<span style={{ color: "black" }}>{item.product_name}</span>
<br />
<span style={{ color: "grey", fontSize: 10 }}>
{new Intl.NumberFormat("id-ID", {
style: "currency",
currency: "IDR",
@ -137,34 +137,47 @@ export const Product = observer(() => {
</Card>
<Modal
visible={visibleModalBuy}
title={`Are you sure buy ${item.product_name}?`}
okText={"Confirm"}
cancelText="Cancel"
onCancel={() => {
form.resetFields();
handleCancel();
}}
onOk={() => {
form
.validateFields()
.then((values) => {
console.log(values, "isi form");
handleBuyProduct(values, item.product_code);
form.resetFields();
})
.catch((info) => {
console.error("Validate Failed:", info);
});
}}
visible={visibleModalBuy}
title={`Are you sure buy ${item.product_name}?`}
okText={"Confirm"}
cancelText="Cancel"
onCancel={() => {
form.resetFields();
handleCancel();
}}
onOk={() => {
form
.validateFields()
.then((values) => {
console.log(values, "isi form");
handleBuyProduct(values, item.product_code);
form.resetFields();
})
.catch((info) => {
console.error("Validate Failed:", info);
});
}}
>
<Form form={form} layout="vertical">
<Form.Item
name="destination"
label="Destination"
rules={[{required: true, message: "Please input Destination Number!"}]}
name="destination"
label="Destination"
rules={[
{
required: true,
message: "Please input Destination Number!",
},
{
pattern: /^(?:\d*)$/,
message: "Value should contain just number",
},
{
pattern: /^[\d]{2,12}$/,
message: "Value should be less than 12 character",
},
]}
>
<Input/>
<Input />
</Form.Item>
</Form>
</Modal>