Initial commit

2025-10-11 11:55:25 +08:00
parent 467dad8449
commit 8107dee8d3
2879 changed files with 610575 additions and 0 deletions
--- a/src/components/Tables/TablesTableRow.js
+++ b/src/components/Tables/TablesTableRow.js
@@ -0,0 +1,120 @@
+/*!
+
+=========================================================
+* Argon Dashboard Chakra PRO - v1.0.0
+=========================================================
+
+* Product Page: https://www.creative-tim.com/product/argon-dashboard-chakra-pro
+* Copyright 2022 Creative Tim (https://www.creative-tim.com/)
+
+* Designed and Coded by Simmmple & Creative Tim
+
+=========================================================
+
+* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+*/
+
+import {
+  Avatar,
+  Badge,
+  Button,
+  Flex,
+  Td,
+  Text,
+  Tr,
+  useColorModeValue,
+} from "@chakra-ui/react";
+import React from "react";
+
+function TablesTableRow(props) {
+  const {
+    logo,
+    name,
+    email,
+    subdomain,
+    domain,
+    status,
+    date,
+    paddingY,
+    isLast,
+  } = props;
+  const textColor = useColorModeValue("gray.500", "white");
+  const titleColor = useColorModeValue("gray.700", "white");
+  const bgStatus = useColorModeValue("gray.400", "navy.900");
+  const borderColor = useColorModeValue("gray.200", "gray.600");
+
+  return (
+    <Tr>
+      <Td
+        minWidth={{ sm: "250px" }}
+        pl="0px"
+        borderColor={borderColor}
+        borderBottom={isLast ? "none" : null}
+      >
+        <Flex
+          align="center"
+          py={paddingY ? paddingY : ".8rem"}
+          minWidth="100%"
+          flexWrap="nowrap"
+        >
+          <Avatar src={logo} w="50px" borderRadius="12px" me="18px" />
+          <Flex direction="column">
+            <Text
+              fontSize="md"
+              color={titleColor}
+              fontWeight="bold"
+              minWidth="100%"
+            >
+              {name}
+            </Text>
+            <Text fontSize="sm" color="gray.400" fontWeight="normal">
+              {email}
+            </Text>
+          </Flex>
+        </Flex>
+      </Td>
+
+      <Td borderColor={borderColor} borderBottom={isLast ? "none" : null}>
+        <Flex direction="column">
+          <Text fontSize="md" color={textColor} fontWeight="bold">
+            {domain}
+          </Text>
+          <Text fontSize="sm" color="gray.400" fontWeight="normal">
+            {subdomain}
+          </Text>
+        </Flex>
+      </Td>
+      <Td borderColor={borderColor} borderBottom={isLast ? "none" : null}>
+        <Badge
+          bg={status === "Online" ? "green.400" : bgStatus}
+          color={status === "Online" ? "white" : "white"}
+          fontSize="16px"
+          p="3px 10px"
+          borderRadius="8px"
+        >
+          {status}
+        </Badge>
+      </Td>
+      <Td borderColor={borderColor} borderBottom={isLast ? "none" : null}>
+        <Text fontSize="md" color={textColor} fontWeight="bold" pb=".5rem">
+          {date}
+        </Text>
+      </Td>
+      <Td borderColor={borderColor} borderBottom={isLast ? "none" : null}>
+        <Button p="0px" bg="transparent" variant="no-effects">
+          <Text
+            fontSize="md"
+            color="gray.400"
+            fontWeight="bold"
+            cursor="pointer"
+          >
+            Edit
+          </Text>
+        </Button>
+      </Td>
+    </Tr>
+  );
+}
+
+export default TablesTableRow;