132 lines
2.9 KiB
JavaScript
132 lines
2.9 KiB
JavaScript
import { Space, Table, message } from "antd";
|
|
import {
|
|
FormatDatetime,
|
|
MyAvatar,
|
|
WebSocketContext,
|
|
getUserSessionFromLocalStorage,
|
|
} from "../../utils";
|
|
import { useContext } from "react";
|
|
import { Link } from "react-router-dom";
|
|
import { Constants } from "../../utils";
|
|
|
|
const columns = [
|
|
{
|
|
title: "Name",
|
|
dataIndex: "name",
|
|
key: "name",
|
|
},
|
|
{
|
|
title: "Used by",
|
|
dataIndex: "usedByUserId",
|
|
key: "usedByUserId",
|
|
},
|
|
{
|
|
title: "Last used",
|
|
dataIndex: "lastUsed",
|
|
key: "lastUsed",
|
|
},
|
|
{
|
|
title: "Registered at",
|
|
dataIndex: "registeredAt",
|
|
key: "registeredAt",
|
|
},
|
|
{
|
|
title: "User-Agent",
|
|
dataIndex: "userAgent",
|
|
key: "userAgent",
|
|
},
|
|
{
|
|
title: "Action",
|
|
dataIndex: "action",
|
|
key: "action",
|
|
render: (_, record) => (
|
|
<Space size="middle">
|
|
<Link
|
|
to="#"
|
|
onClick={() => {
|
|
if (localStorage.getItem("userId") === record._usedByUserId) {
|
|
message.error("You are already using this scanner");
|
|
return;
|
|
}
|
|
|
|
fetch(`${Constants.API_ADDRESS}/scanner/${record.key}`, {
|
|
method: "PATCH",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
"X-Authorization": getUserSessionFromLocalStorage(),
|
|
},
|
|
}).catch((err) => console.error(err));
|
|
}}
|
|
>
|
|
Use scanner
|
|
</Link>
|
|
</Space>
|
|
),
|
|
},
|
|
];
|
|
|
|
export default function Scanners() {
|
|
const webSocketContext = useContext(WebSocketContext);
|
|
|
|
const getTableItems = () => {
|
|
if (webSocketContext.Scanners === null) return [];
|
|
|
|
let items = [];
|
|
|
|
webSocketContext.Scanners.forEach((scanner) => {
|
|
const usedByUser = webSocketContext.AllUsers.find(
|
|
(user) => user.Id === scanner.UsedByUserId
|
|
);
|
|
|
|
items.push({
|
|
key: scanner.Id,
|
|
name: scanner.Name,
|
|
usedByUserId:
|
|
scanner.UsedByUserId === "" ? (
|
|
Constants.TEXT_EMPTY_PLACEHOLDER
|
|
) : (
|
|
<>
|
|
<MyAvatar avatar={usedByUser.Avatar} />
|
|
<span> {usedByUser.Username}</span>
|
|
</>
|
|
),
|
|
_usedByUserId: scanner.UsedByUserId,
|
|
lastUsed: scanner.LastUsed,
|
|
registeredAt: FormatDatetime(scanner.RegisteredAt),
|
|
userAgent: scanner.UserAgent,
|
|
});
|
|
});
|
|
|
|
return items;
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<h1 style={{ fontWeight: "bold", float: "left" }}>
|
|
Scanners (
|
|
{webSocketContext.Scanners === null
|
|
? "0"
|
|
: webSocketContext.Scanners.length}
|
|
)
|
|
</h1>
|
|
|
|
<Table columns={columns} dataSource={getTableItems()} />
|
|
</>
|
|
);
|
|
}
|
|
|
|
/*
|
|
<Popover
|
|
title="Scan this on mobile"
|
|
content={<QRCode value={"test"} bordered={false} />}
|
|
>
|
|
<Button
|
|
style={{ float: "right" }}
|
|
type="primary"
|
|
icon={<PlusOutlined />}
|
|
>
|
|
Add scanner
|
|
</Button>
|
|
</Popover>
|
|
*/
|