Commit 59ddeddf authored by Mai Thanh Cong's avatar Mai Thanh Cong

create modal add diary

parent b04f6b72
......@@ -71,14 +71,7 @@ const AddProduct = () => {
<section className="section section-components">
<Container>
<Form onSubmit={onHandleAddProduct}>
<Row className="align-items-center">
<Col>
<h5 className="mb-3">{productId ? "Sửa thông tin sản phẩm" : "Thêm mới sản phẩm"}</h5>
</Col>
<Col className="text-right">
<Button className="btn-1 ml-1" color="success" size="sm" type="button" onClick={() => onHandleClickAddProductDiary()}>{"Thêm nhật kí sản phẩm"}</Button>
</Col>
</Row>
<FormGroup>
<Label for="product-name">Tên sn phm</Label>
<InputGroup className="mb-4">
......
......@@ -63,13 +63,6 @@ const AddProfile = () => {
}
}
const onHandleClickAddProduct = () => {
history.push({
pathname: "/profile/add-product",
state: { profileId }
});
}
return (
<>
<DemoNavbar />
......@@ -78,14 +71,7 @@ const AddProfile = () => {
<section className="section section-components">
<Container>
<Form onSubmit={onHandleAddNewProfile}>
<Row className="align-items-center">
<Col>
<h5 className="mb-3">{profileId ? "Sửa thông tin doanh nghiệp" : "Thêm mới doanh nghiệp"}</h5>
</Col>
<Col className="text-right">
<Button className="btn-1 ml-1" color="success" size="sm" type="button" onClick={() => onHandleClickAddProduct()}>{"Thêm mới sản phẩm"}</Button>
</Col>
</Row>
<FormGroup className="mb-4">
<Label for="profile_name" >Tên doanh nghip</Label>
<InputGroup className="mb-4">
......@@ -165,10 +151,10 @@ const AddProfile = () => {
</FormText>
</Col>
</FormGroup>
<div className="mt-5">
<div className="mt-3">
<ProductTable listProduct={detailProfile.profile_product} />
</div>
<div className="d-flex justify-content-between mt-5">
<div className="d-flex justify-content-between mt-3">
<Button
color="info"
type="button"
......
......@@ -40,9 +40,9 @@ const SearchProfile = (props) => {
}
}
useEffect(() => {
dispatch(props.onLoadListProfile( { currentPage: props.currentPage, limit: props.limit } ));
}, []);
// useEffect(() => {
// dispatch(props.onLoadListProfile( { currentPage: props.currentPage, limit: props.limit } ));
// }, []);
......@@ -59,7 +59,7 @@ const SearchProfile = (props) => {
<InputGroup className="mb-4">
<InputGroupAddon addonType="prepend">
<InputGroupText>
<i className="ni ni-zoom-split-in" />
<i className="fa fa-search"></i>
</InputGroupText>
</InputGroupAddon>
<Input
......
......@@ -29,25 +29,25 @@
"date": 1616300741111
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "hgythxc4-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Vinashrimp",
"description": "Thu hoạch",
"date": 1626841541222
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "akiun692-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Thu mua, nhập kho đông lạnh Cần Thơ",
"date": 1626841541222
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "13sdab64-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Trưng bày siêu thị",
"date": 1627014341333
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "afdr45ht-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Bán cho người tiêu dùng",
"date": 1627619141213
......@@ -55,13 +55,13 @@
],
"product_certification": [
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "lpweredf-fbb9-4dd3-af84-8247efe74a92",
"certification_information": "Chứng nhận certificate 1",
"image": "/image/certificate/certificate.jpg",
"date": 1624870109921
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "vcxdserw-fbb9-4dd3-af84-8247efe74a92",
"certification_information": "Chứng nhận certificate 2",
"image": "/image/certificate/certificate.jpg",
"date": 1624870109921
......@@ -70,7 +70,7 @@
},
{
"trace_code": "VNC12345678",
"product_id": "u20d1e14-fbb9-4dd3-af84-8247efe74a92",
"product_id": "gyhj89jy-fbb9-4dd3-af84-8247efe74a92",
"name": "Tôm càng xanh loại 2",
"cost": "Liên hệ",
"origin": "Việt Nam",
......@@ -81,31 +81,31 @@
"created_at": 1624870109921,
"product_chain_diary": [
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "jytgrfe4-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Vinashrimp",
"description": "Bắt đầu nuôi trồng",
"date": 1616300741111
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "mnhjytr4-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Vinashrimp",
"description": "Thu hoạch",
"date": 1626841541222
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "fgder4e4-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Thu mua, nhập kho đông lạnh Cần Thơ",
"date": 1626841541222
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "dghytrt5-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Trưng bày siêu thị",
"date": 1627014341333
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "bvfdret4-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Bán cho người tiêu dùng",
"date": 1627619141213
......@@ -113,13 +113,13 @@
],
"product_certification": [
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "hgfre435-fbb9-4dd3-af84-8247efe74a92",
"certification_information": "Chứng nhận certificate 1",
"image": "/image/certificate/certificate.jpg",
"date": 1624870109921
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "vfdr4353-fbb9-4dd3-af84-8247efe74a92",
"certification_information": "Chứng nhận certificate 2",
"image": "/image/certificate/certificate.jpg",
"date": 1624870109921
......@@ -128,7 +128,7 @@
},
{
"trace_code": "VNC12345678",
"product_id": "u20d1e14-fbb9-4dd3-af84-8247efe74a92",
"product_id": "cadw21dg-fbb9-4dd3-af84-8247efe74a92",
"name": "Tôm càng xanh loại 3",
"cost": "Liên hệ",
"origin": "Việt Nam",
......@@ -139,31 +139,31 @@
"created_at": 1624870109921,
"product_chain_diary": [
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "nhg43fd4-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Vinashrimp",
"description": "Bắt đầu nuôi trồng",
"date": 1616300741111
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "daqwa32s-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Vinashrimp",
"description": "Thu hoạch",
"date": 1626841541222
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "nhg65f4f-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Thu mua, nhập kho đông lạnh Cần Thơ",
"date": 1626841541222
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "dswadfd3-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Trưng bày siêu thị",
"date": 1627014341333
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "csadwqe2-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Bán cho người tiêu dùng",
"date": 1627619141213
......@@ -171,13 +171,13 @@
],
"product_certification": [
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "dsacsfjy-fbb9-4dd3-af84-8247efe74a92",
"certification_information": "Chứng nhận certificate 1",
"image": "/image/certificate/certificate.jpg",
"date": 1624870109921
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "vfsdrty3-fbb9-4dd3-af84-8247efe74a92",
"certification_information": "Chứng nhận certificate 2",
"image": "/image/certificate/certificate.jpg",
"date": 1624870109921
......@@ -187,7 +187,7 @@
]
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "hkyuiye3-fbb9-4dd3-af84-8247efe74a92",
"code": "FPT",
"name": "Tập đoàn FPT",
"logo": "/image/logo/full_Logo.png",
......@@ -208,31 +208,31 @@
"growing_conditions": "Nuôi trồng tại vùng nguyên liệu tôm, cơ sở chế biến: Tỉnh Trà Vinh",
"product_chain_diary": [
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "ngftryt5-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Vinashrimp",
"description": "Bắt đầu nuôi trồng",
"date": 1616300741111
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "dg434543-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Vinashrimp",
"description": "Thu hoạch",
"date": 1626841541222
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "sfewrwe3-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Thu mua, nhập kho đông lạnh Cần Thơ",
"date": 1626841541222
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "shuyu75a-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Trưng bày siêu thị",
"date": 1627014341333
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "cloiahu7-fbb9-4dd3-af84-8247efe74a92",
"company": "Công ty Coopmart",
"description": "Bán cho người tiêu dùng",
"date": 1627619141213
......@@ -240,13 +240,13 @@
],
"product_certification": [
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "fko098sd-fbb9-4dd3-af84-8247efe74a92",
"certification_information": "Chứng nhận certificate 1",
"image": "/image/certificate/certificate.jpg",
"date": 1624870109921
},
{
"id": "a57e6b29-fbb9-4dd3-af84-8247efe74a92",
"id": "kius93js-fbb9-4dd3-af84-8247efe74a92",
"certification_information": "Chứng nhận certificate 2",
"image": "/image/certificate/certificate.jpg",
"date": 1624870109921
......
import React, { useEffect } from "react";
import React, { useState } from "react";
import { useHistory } from "react-router-dom";
import { useDispatch } from "react-redux";
import { Table, Card, CardHeader, Row, Col, Button, UncontrolledDropdown, DropdownToggle, DropdownMenu, DropdownItem, Pagination, PaginationItem, PaginationLink } from "reactstrap";
import {
Table, Card, CardHeader, Row, Col, Button,
UncontrolledDropdown, DropdownToggle, DropdownMenu, DropdownItem, Pagination, PaginationItem, PaginationLink,
Modal, ModalHeader, ModalBody, ModalFooter, Form, FormGroup, Label, InputGroup, InputGroupAddon, InputGroupText, Input
} from "reactstrap";
import { profileFormatDateTime } from "constans";
export const ProfileTable = (props) => {
......@@ -187,6 +191,13 @@ export const ProductTable = (props) => {
// dispatch(props.onDeleteProfile(profileId));
}
const onHandleClickAddProduct = () => {
history.push({
pathname: "/profile/add-product",
// state: { profileId }
});
}
const items = [];
const totalItem = props.listProduct ? props.listProduct.length : 1;
let pageSize = totalItem / 10;
......@@ -251,6 +262,16 @@ export const ProductTable = (props) => {
return (
props.listProduct && props.listProduct.length > 0 ?
<Card>
<CardHeader>
<Row className="align-items-center">
<Col>
<h5 className="mb-3">{"Danh sách sản phẩm"}</h5>
</Col>
<Col className="text-right">
<Button className="btn-1 ml-1" color="success" size="sm" type="button" onClick={() => onHandleClickAddProduct()}>{"Thêm mới sản phẩm"}</Button>
</Col>
</Row>
</CardHeader>
<Table striped responsive>
<thead>
<tr >
......@@ -303,14 +324,15 @@ export const ProductTable = (props) => {
}
export const ProductDiaryTable = (props) => {
const [modal, setModal] = useState(false);
const [company, setCompany] = useState("");
const [description, setDescription] = useState("");
const history = useHistory();
// const dispatch = useDispatch();
console.log("props", props);
const onHandleClickAdd = () => {
history.push("/profile/add");
};
console.log("props", props);
const toggle = () => setModal(!modal);
const onHandleClickEdit = (id) => {
console.log("id", id);
......@@ -367,7 +389,7 @@ export const ProductDiaryTable = (props) => {
<i className="fa fa-ellipsis-h" />
</DropdownToggle>
<DropdownMenu>
<DropdownItem onClick={() => onHandleClickEdit(id)} >
<DropdownItem onClick={() => toggle()} >
<i className="fa fa-pencil mr-3" />{"Sửa"}
</DropdownItem>
<DropdownItem className="text-danger" onClick={() => console.log('This will fire!')}>
......@@ -383,6 +405,61 @@ export const ProductDiaryTable = (props) => {
return (
props.listProductDiary && props.listProductDiary.length > 0 ?
<Card>
<CardHeader>
<Row className="align-items-center">
<Col>
<h5>{"Nhật kí sản phẩm"}</h5>
</Col>
<Col className="text-right">
<div>
<Button className="btn-1 ml-1" color="success" size="sm" type="button" onClick={() => toggle()}>{"Tạo mới nhật kí"}</Button>
<Modal isOpen={modal} toggle={toggle}>
<ModalHeader toggle={toggle}>Thêm nht kí</ModalHeader>
<ModalBody>
<Form>
<FormGroup>
<Label for="company-name">Tên công ty</Label>
<InputGroup className="mb-4">
<InputGroupAddon addonType="prepend">
<InputGroupText>
<i className="fa fa-building" />
</InputGroupText>
</InputGroupAddon>
<Input
placeholder="Tên công ty"
type="text"
value={company}
onChange={(e) => setCompany(e.target.value)}
/>
</InputGroup>
</FormGroup>
<FormGroup>
<Label for="diary-description">Mô t</Label>
<InputGroup className="mb-4">
{/* <InputGroupAddon addonType="prepend">
<InputGroupText>
<i className="fa fa-book" />
</InputGroupText>
</InputGroupAddon> */}
<Input
placeholder="Mô tả"
type="textarea"
value={description}
onChange={(e) => setDescription(e.target.value)}
/>
</InputGroup>
</FormGroup>
</Form>
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={toggle}>Thêm</Button>
{/* <Button color="secondary" onClick={toggle}>Quay lại</Button> */}
</ModalFooter>
</Modal>
</div>
</Col>
</Row>
</CardHeader>
<Table striped responsive>
<thead>
<tr >
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment