update add page

src/components/Profile/AddProfile.js

@@ -13,14 +13,20 @@ import dummyData from "../../data/index.json";
 import { validatePhoneNumber } from "constans/index.js";
 
 const AddProfile = () => {
-  const [profileName, setProfileName] = useState("");
-  const [profileCode, setProfileCode] = useState("");
-  const [logo, setLogo] = useState({});
-  const [phoneNumber, setPhoneNumber] = useState("");
-  const [profileAddress, setProfileAddress] = useState("");
+  const history = useHistory();
+  const state = { ...history.location.state };
+  const profileId = state.profileId;
+  const detailProfile = dummyData.data ? dummyData.data.filter(item => item.id === profileId) : [];
+  console.log("list data", detailProfile);
+
+  const [profileName, setProfileName] = useState(profileId ? detailProfile.name : "");
+  const [profileCode, setProfileCode] = useState(profileId ? detailProfile.code : {});
+  const [logo, setLogo] = useState(profileId ? detailProfile.logo : {});
+  const [phoneNumber, setPhoneNumber] = useState(profileId ? detailProfile.phone_number : "");
+  const [profileAddress, setProfileAddress] = useState(profileId ? detailProfile.address : "");
   const [validPhoneNumber, setValidPhoneNumber] = useState(false);
 
-  const history = useHistory();
+  
 
   const onHandleBack = () => {
     history.push("/");

src/components/Profile/SearchProfile.js

@@ -24,9 +24,7 @@ const SearchProfile = () => {
     event.preventDefault();
     if (!searchProfile) return;
     const nameCode = dummyData.data.map(item => item.code);
-    console.log("nameCode", nameCode);
     const checkSearch = nameCode.indexOf(searchProfile);
-    console.log("checkSearch", checkSearch);
     if (checkSearch !== -1) {
       history.push({
         pathname: `/profile/${searchProfile}`,

src/views/IndexSections/Inputs.js

@@ -59,10 +59,6 @@ const Inputs = () => {
     }
   }
 
-  const onHandleCreateProfile = () => {
-    history.push("/profile/add");
-  }
-
     return (
       <>
         <section className="section pb-0 section-components">

src/views/IndexSections/Table.js

@@ -8,6 +8,7 @@ export const ProfileTable = (props) => {
   const [dropdownOpen, setDropdownOpen] = useState(false);
   const toggle = () => setDropdownOpen(prevState => !prevState);
 
+
   const history = useHistory();
   // const dispatch = useDispatch();
 
@@ -15,10 +16,11 @@ export const ProfileTable = (props) => {
     history.push("/profile/add");
   };
 
-  const onHandleClickEdit = async (profileId) => {
+  const onHandleClickEdit = (profileId) => {
+    console.log("profileId", profileId);
     let detailProfile = props.dummyData.filter(item => item.id === profileId);
     history.push({
-      // pathname: "Routes.DetailProfile.path",
+      pathname: "/profile/add",
       state: { profileId, detailProfile }  
     });
   } 
@@ -33,11 +35,9 @@ export const ProfileTable = (props) => {
   }, []);
 
   const items = [];
-  const totalItem = "123";
+  const totalItem = "15";
   let pageSize = totalItem / 10;
 
-  
-
   const getPageItem = () => {
     let number = 1;
     if(pageSize > 1){
@@ -56,7 +56,7 @@ export const ProfileTable = (props) => {
     };
     items.push(
       <PaginationItem key={number} onClick={handlePaginationChange}>
-        {number}
+        <PaginationLink>{number}</PaginationLink>
       </PaginationItem>
     );
   }
@@ -64,6 +64,7 @@ export const ProfileTable = (props) => {
   const TableRow = (props) => {
     const { id, address, logo, name, phone_number, profile_product, created_at, qr_code } = props;
     const productName = profile_product ? profile_product.map(item => item.name) : "";
+
     return (
       <tr>
         <th scope="row">{""}</th>
@@ -80,16 +81,18 @@ export const ProfileTable = (props) => {
               Menu
             </DropdownToggle>
             <DropdownMenu>
-              <DropdownItem >
+              <DropdownItem tag="a">
                 <i className="fa fa-plus" />{"Thêm sản phẩm"}
               </DropdownItem>
-              <DropdownItem onClick={() => onHandleClickEdit(id)} >
-                <i className="fa fa-pencil" />{"Sửa"}
-                {/* <FontAwesomeIcon icon={faEdit} className="me-2" /> {t('common.table.edit')} */}
+              <DropdownItem tag="b">
+                <div onClick={() => onHandleClickEdit(id)}>
+                  <i className="fa fa-pencil mr-3" />{"Sửa"}
+                </div>
               </DropdownItem>
-              <DropdownItem className="text-danger" onClick={() => onHandleClickDelete(id)}>
-                <i className="fa fa-trash" />{"Xóa"}
-                {/* <FontAwesomeIcon icon={faTrashAlt} className="me-2" /> {t('common.table.remove')} */}
+              <DropdownItem tag="c" className="text-danger">
+                <div onClick={() => console.log('This will fire!')}>
+                  <i className="fa fa-trash mr-3" />{"Xóa"}
+                </div>
               </DropdownItem>
             </DropdownMenu>
           </Dropdown>
@@ -109,7 +112,7 @@ export const ProfileTable = (props) => {
               <h5>{"Thông tin doanh nghiệp"}</h5>
             </Col>
             <Col className="text-right">
-              <Button className="btn-1 ml-1" color="success" size="sm" type="button" onClick={() => onHandleClickAdd()}>{"Tạo mới doanh nghiệp"}</Button>
+              <Button className="btn-1 ml-1" color="success" type="button" onClick={() => onHandleClickAdd()}>{"Tạo mới doanh nghiệp"}</Button>
             </Col>
           </Row>
         </CardHeader>
@@ -131,25 +134,38 @@ export const ProfileTable = (props) => {
             {props.dummyData ? props.dummyData.map(profile => <TableRow key={`page-visit-${profile.id}`} {...profile} />) : []}
           </tbody>
         </Table>
-        {/* <Card.Footer>
-          <Nav>
-            <Pagination className="mb-2 mb-lg-0">
-              <Pagination.Prev disabled={props.currentPage === 1} onClick={onPrevItem}>
-                {t('common.table.previous')}
-              </Pagination.Prev>
-              {items}
-              <Pagination.Next disabled={props.currentPage === Math.ceil(pageSize)} onClick={() => onNextItem()}>
-                {t('common.table.next')}
-              </Pagination.Next>
-            </Pagination>
-          </Nav>
-          <small className="fw-bold">
-            {t('common.table.showing', {
-              'current': props.dummyData.length,
-              'total': totalItem
-            })}
-          </small>
-        </Card.Footer> */}
+        <Row  className="mx-3 my-2">
+          <Col>
+            <nav>
+              <Pagination aria-label="Page navigation example">
+                {/* <Pagination.Prev disabled={props.currentPage === 1} onClick={onPrevItem}>
+              {t('common.table.previous')}
+            </Pagination.Prev> */}
+                <PaginationItem>
+                  <PaginationLink first href="#" />
+                </PaginationItem>
+                <PaginationItem>
+                  <PaginationLink previous href="#" />
+                </PaginationItem>
+                {items}
+                <PaginationItem>
+                  <PaginationLink next href="#" />
+                </PaginationItem>
+                <PaginationItem>
+                  <PaginationLink last href="#" />
+                </PaginationItem>
+                {/* <Pagination.Next disabled={props.currentPage === Math.ceil(pageSize)} onClick={() => onNextItem()}>
+              {t('common.table.next')}
+            </Pagination.Next> */}
+              </Pagination>
+            </nav>
+          </Col>
+          <Col className="text-right">
+            <h6 className="font-weight-bold">
+              {('Hiển thị ' + props.dummyData.length + "/" + totalItem)}
+            </h6>
+          </Col>
+        </Row>
       </Card> 
       : <div></div>
   );