Commit 45c3aa7d authored by Mai Thanh Cong's avatar Mai Thanh Cong

replace Qr code in table

parent bf4b5526
...@@ -27,8 +27,6 @@ const AddProfile = () => { ...@@ -27,8 +27,6 @@ const AddProfile = () => {
const [profileAddress, setProfileAddress] = useState(profileId ? detailProfile.address : ""); const [profileAddress, setProfileAddress] = useState(profileId ? detailProfile.address : "");
const [validPhoneNumber, setValidPhoneNumber] = useState(false); const [validPhoneNumber, setValidPhoneNumber] = useState(false);
console.log("phoneNumber", typeof(phoneNumber));
const onHandleBack = () => { const onHandleBack = () => {
history.push("/"); history.push("/");
} }
......
...@@ -6,6 +6,7 @@ import { ...@@ -6,6 +6,7 @@ import {
UncontrolledDropdown, DropdownToggle, DropdownMenu, DropdownItem, Pagination, PaginationItem, PaginationLink, UncontrolledDropdown, DropdownToggle, DropdownMenu, DropdownItem, Pagination, PaginationItem, PaginationLink,
Modal, ModalHeader, ModalBody, ModalFooter, Form, FormGroup, Label, InputGroup, InputGroupAddon, InputGroupText, Input Modal, ModalHeader, ModalBody, ModalFooter, Form, FormGroup, Label, InputGroup, InputGroupAddon, InputGroupText, Input
} from "reactstrap"; } from "reactstrap";
import QRCode from 'qrcode.react';
import { profileFormatDateTime } from "constans"; import { profileFormatDateTime } from "constans";
export const ProfileTable = (props) => { export const ProfileTable = (props) => {
...@@ -71,7 +72,7 @@ export const ProfileTable = (props) => { ...@@ -71,7 +72,7 @@ export const ProfileTable = (props) => {
let count = 0; let count = 0;
const TableRow = (props) => { const TableRow = (props) => {
const { id, address, logo, name, phone_number, profile_product, created_at, qr_code } = props; const { id, address, logo, name, phone_number, profile_product, created_at, code } = props;
count++; count++;
const productName = profile_product ? profile_product.map(item => item.name) : []; const productName = profile_product ? profile_product.map(item => item.name) : [];
...@@ -84,12 +85,23 @@ export const ProfileTable = (props) => { ...@@ -84,12 +85,23 @@ export const ProfileTable = (props) => {
<tr> <tr>
<th scope="row">{count}</th> <th scope="row">{count}</th>
<td>{name}</td> <td>{name}</td>
<td><img src={window.location.origin + logo} alt="logo" width={100} height={50} /></td>
<td>{phone_number}</td> <td>{phone_number}</td>
<td>{address}</td> <td>{address}</td>
<td dangerouslySetInnerHTML={{__html: listProductName}}></td> <td dangerouslySetInnerHTML={{__html: listProductName}}></td>
<td>{created_at ? profileFormatDateTime(created_at) : ""}</td> <td>{created_at ? profileFormatDateTime(created_at) : ""}</td>
<td><img src={window.location.origin + qr_code} alt="qr-code" width={50} height={50} /></td> <td>
<QRCode
size={120}
includeMargin
value={`http://trace.aqbits.net/${code}`}
imageSettings={{
width: 60,
height: 40,
src: window.location.origin + logo,
excavate: true,
}}
/>
</td>
<td key={id}> <td key={id}>
<UncontrolledDropdown nav> <UncontrolledDropdown nav>
<DropdownToggle nav> <DropdownToggle nav>
...@@ -127,7 +139,6 @@ export const ProfileTable = (props) => { ...@@ -127,7 +139,6 @@ export const ProfileTable = (props) => {
<tr > <tr >
<th>{"STT"}</th> <th>{"STT"}</th>
<th>{"Tên doanh nghiệp"}</th> <th>{"Tên doanh nghiệp"}</th>
<th>{"Logo"}</th>
<th>{"Số điện thoại"}</th> <th>{"Số điện thoại"}</th>
<th>{"Địa chỉ"}</th> <th>{"Địa chỉ"}</th>
<th>{"Tên sản phẩm"}</th> <th>{"Tên sản phẩm"}</th>
...@@ -144,7 +155,7 @@ export const ProfileTable = (props) => { ...@@ -144,7 +155,7 @@ export const ProfileTable = (props) => {
<Col> <Col>
<nav> <nav>
<Pagination aria-label="Page navigation example"> <Pagination aria-label="Page navigation example">
<PaginationItem> <PaginationItem disabled={props.currentPage === 1}>
<PaginationLink first href="#" /> <PaginationLink first href="#" />
</PaginationItem> </PaginationItem>
<PaginationItem disabled={props.currentPage === 1} onClick={onPrevItem}> <PaginationItem disabled={props.currentPage === 1} onClick={onPrevItem}>
...@@ -154,7 +165,7 @@ export const ProfileTable = (props) => { ...@@ -154,7 +165,7 @@ export const ProfileTable = (props) => {
<PaginationItem disabled={props.currentPage === Math.ceil(pageSize)} onClick={onNextItem}> <PaginationItem disabled={props.currentPage === Math.ceil(pageSize)} onClick={onNextItem}>
<PaginationLink next href="#" /> <PaginationLink next href="#" />
</PaginationItem> </PaginationItem>
<PaginationItem> <PaginationItem disabled={props.currentPage === Math.ceil(pageSize)}>
<PaginationLink last href="#" /> <PaginationLink last href="#" />
</PaginationItem> </PaginationItem>
</Pagination> </Pagination>
...@@ -237,8 +248,20 @@ export const ProductTable = (props) => { ...@@ -237,8 +248,20 @@ export const ProductTable = (props) => {
<td>{origin}</td> <td>{origin}</td>
<td>{description}</td> <td>{description}</td>
<td>{growing_conditions}</td> <td>{growing_conditions}</td>
<td><img src={window.location.origin + image} alt="product" width={50} height={50} /></td> <td>
<td><img src={window.location.origin + qr_code} alt="qr-code" width={50} height={50} /></td> <QRCode
size={120}
includeMargin
value={`http://trace.aqbits.net/trace-code/${qr_code}`}
imageSettings={{
width: 60,
height: 40,
src: window.location.origin + image,
excavate: true,
}}
/>
{/* <img src={window.location.origin + qr_code} alt="qr-code" width={50} height={50} /> */}
</td>
<td>{created_at ? profileFormatDateTime(created_at) : ""}</td> <td>{created_at ? profileFormatDateTime(created_at) : ""}</td>
<td key={product_id}> <td key={product_id}>
<UncontrolledDropdown nav> <UncontrolledDropdown nav>
...@@ -282,7 +305,6 @@ export const ProductTable = (props) => { ...@@ -282,7 +305,6 @@ export const ProductTable = (props) => {
<th>{"Xuất xứ"}</th> <th>{"Xuất xứ"}</th>
<th>{"Mô tả"}</th> <th>{"Mô tả"}</th>
<th>{"Điều kiện nuôi trồng"}</th> <th>{"Điều kiện nuôi trồng"}</th>
<th>{"Ảnh"}</th>
<th>{"QR code"}</th> <th>{"QR code"}</th>
<th>{"Ngày tạo"}</th> <th>{"Ngày tạo"}</th>
<th></th> <th></th>
......
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