mirror of
https://github.com/Kingsrook/qqq-frontend-material-dashboard.git
synced 2025-07-18 13:20:43 +00:00
ONE-38: checkpoint commit of frontend MVP goal
This commit is contained in:
@ -1,56 +0,0 @@
|
||||
/**
|
||||
=========================================================
|
||||
* Material Dashboard 2 PRO React TS - v1.0.0
|
||||
=========================================================
|
||||
|
||||
* Product Page: https://www.creative-tim.com/product/material-dashboard-2-pro-react-ts
|
||||
* Copyright 2022 Creative Tim (https://www.creative-tim.com)
|
||||
|
||||
Coded by www.creative-tim.com
|
||||
|
||||
=========================================================
|
||||
|
||||
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||
*/
|
||||
|
||||
// Material Dashboard 2 PRO React TS components
|
||||
import MDBox from "components/MDBox";
|
||||
import MDTypography from "components/MDTypography";
|
||||
import MDAvatar from "components/MDAvatar";
|
||||
|
||||
// Declaring props types for CustomerCell
|
||||
interface Props {
|
||||
image?: string;
|
||||
name: string;
|
||||
color?:
|
||||
| "transparent"
|
||||
| "primary"
|
||||
| "secondary"
|
||||
| "info"
|
||||
| "success"
|
||||
| "warning"
|
||||
| "error"
|
||||
| "light"
|
||||
| "dark";
|
||||
}
|
||||
|
||||
function CustomerCell({ image, name, color }: Props): JSX.Element {
|
||||
return (
|
||||
<MDBox display="flex" alignItems="center">
|
||||
<MDBox mr={1}>
|
||||
<MDAvatar bgColor={color} src={image} alt={name} size="xs" />
|
||||
</MDBox>
|
||||
<MDTypography variant="caption" fontWeight="medium" color="text" sx={{ lineHeight: 0 }}>
|
||||
{name}
|
||||
</MDTypography>
|
||||
</MDBox>
|
||||
);
|
||||
}
|
||||
|
||||
// Declaring default props for CustomerCell
|
||||
CustomerCell.defaultProps = {
|
||||
image: "",
|
||||
color: "dark",
|
||||
};
|
||||
|
||||
export default CustomerCell;
|
@ -1,43 +0,0 @@
|
||||
/**
|
||||
=========================================================
|
||||
* Material Dashboard 2 PRO React TS - v1.0.0
|
||||
=========================================================
|
||||
|
||||
* Product Page: https://www.creative-tim.com/product/material-dashboard-2-pro-react-ts
|
||||
* Copyright 2022 Creative Tim (https://www.creative-tim.com)
|
||||
|
||||
Coded by www.creative-tim.com
|
||||
|
||||
=========================================================
|
||||
|
||||
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||
*/
|
||||
|
||||
// Material Dashboard 2 PRO React TS components
|
||||
import MDTypography from "components/MDTypography";
|
||||
|
||||
// Declaring props types for DefaultCell
|
||||
interface Props {
|
||||
value: string;
|
||||
suffix?: string | boolean;
|
||||
}
|
||||
|
||||
function DefaultCell({ value, suffix }: Props): JSX.Element {
|
||||
return (
|
||||
<MDTypography variant="caption" fontWeight="medium" color="text">
|
||||
{value}
|
||||
{suffix && (
|
||||
<MDTypography variant="caption" fontWeight="medium" color="secondary">
|
||||
{suffix}
|
||||
</MDTypography>
|
||||
)}
|
||||
</MDTypography>
|
||||
);
|
||||
}
|
||||
|
||||
// Declaring default props for DefaultCell
|
||||
DefaultCell.defaultProps = {
|
||||
suffix: "",
|
||||
};
|
||||
|
||||
export default DefaultCell;
|
@ -1,53 +0,0 @@
|
||||
/**
|
||||
=========================================================
|
||||
* Material Dashboard 2 PRO React TS - v1.0.0
|
||||
=========================================================
|
||||
|
||||
* Product Page: https://www.creative-tim.com/product/material-dashboard-2-pro-react-ts
|
||||
* Copyright 2022 Creative Tim (https://www.creative-tim.com)
|
||||
|
||||
Coded by www.creative-tim.com
|
||||
|
||||
=========================================================
|
||||
|
||||
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||
*/
|
||||
|
||||
// @mui material components
|
||||
import Checkbox from "@mui/material/Checkbox";
|
||||
|
||||
// Material Dashboard 2 PRO React TS components
|
||||
import MDBox from "components/MDBox";
|
||||
import MDTypography from "components/MDTypography";
|
||||
import Link from "@mui/material/Link";
|
||||
|
||||
// Declaring props types for IdCell
|
||||
interface Props {
|
||||
id: string;
|
||||
checked?: boolean;
|
||||
}
|
||||
|
||||
function IdCell({ id, checked }: Props): JSX.Element {
|
||||
const pathParts = window.location.pathname.split("/");
|
||||
const tableName = pathParts[1];
|
||||
const href = `/${tableName}/view/${id}/`;
|
||||
const link = <Link href={href}>{id}</Link>;
|
||||
|
||||
return (
|
||||
<MDBox display="flex" alignItems="center">
|
||||
<Checkbox defaultChecked={checked} />
|
||||
<MDBox ml={1}>
|
||||
<MDTypography variant="caption" fontWeight="medium" color="text">
|
||||
{link}
|
||||
</MDTypography>
|
||||
</MDBox>
|
||||
</MDBox>
|
||||
);
|
||||
}
|
||||
|
||||
// Declaring default props for IdCell
|
||||
IdCell.defaultProps = {
|
||||
checked: false,
|
||||
};
|
||||
|
||||
export default IdCell;
|
@ -1,56 +0,0 @@
|
||||
/**
|
||||
=========================================================
|
||||
* Material Dashboard 2 PRO React TS - v1.0.0
|
||||
=========================================================
|
||||
|
||||
* Product Page: https://www.creative-tim.com/product/material-dashboard-2-pro-react-ts
|
||||
* Copyright 2022 Creative Tim (https://www.creative-tim.com)
|
||||
|
||||
Coded by www.creative-tim.com
|
||||
|
||||
=========================================================
|
||||
|
||||
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||
*/
|
||||
|
||||
// @mui material components
|
||||
import Icon from "@mui/material/Icon";
|
||||
|
||||
// Material Dashboard 2 PRO React TS components
|
||||
import MDBox from "components/MDBox";
|
||||
import MDTypography from "components/MDTypography";
|
||||
import MDButton from "components/MDButton";
|
||||
|
||||
// Declaring props types for StatusCell
|
||||
interface Props {
|
||||
icon: string;
|
||||
color:
|
||||
| "primary"
|
||||
| "secondary"
|
||||
| "info"
|
||||
| "success"
|
||||
| "warning"
|
||||
| "error"
|
||||
| "dark"
|
||||
| "light"
|
||||
| "white"
|
||||
| "default";
|
||||
status: string;
|
||||
}
|
||||
|
||||
function StatusCell({ icon, color, status }: Props): JSX.Element {
|
||||
return (
|
||||
<MDBox display="flex" alignItems="center">
|
||||
<MDBox mr={1}>
|
||||
<MDButton variant="outlined" color={color} size="small" iconOnly circular>
|
||||
<Icon sx={{ fontWeight: "bold" }}>{icon}</Icon>
|
||||
</MDButton>
|
||||
</MDBox>
|
||||
<MDTypography variant="caption" fontWeight="medium" color="text" sx={{ lineHeight: 0 }}>
|
||||
{status}
|
||||
</MDTypography>
|
||||
</MDBox>
|
||||
);
|
||||
}
|
||||
|
||||
export default StatusCell;
|
@ -39,9 +39,8 @@ import { QController } from "@kingsrook/qqq-frontend-core/lib/controllers/QContr
|
||||
import Link from "@mui/material/Link";
|
||||
import { QTableMetaData } from "@kingsrook/qqq-frontend-core/lib/model/metaData/QTableMetaData";
|
||||
import { useParams } from "react-router-dom";
|
||||
import IdCell from "./components/IdCell";
|
||||
import Footer from "../../components/Footer";
|
||||
import EntityForm from "../../components/EntityForm";
|
||||
import IdCell from "../../components/EntityForm/components/IdCell";
|
||||
|
||||
const qController = new QController("");
|
||||
|
||||
@ -69,12 +68,10 @@ function EntityList({ table }: Props): JSX.Element {
|
||||
const openFiltersMenu = (event: any) => setFiltersMenu(event.currentTarget);
|
||||
const closeFiltersMenu = () => setFiltersMenu(null);
|
||||
|
||||
const createPath = `/${tableName}/create`;
|
||||
|
||||
if (tableState === "") {
|
||||
(async () => {
|
||||
const tableMetaData = await qController.loadTableMetaData(tableName);
|
||||
const metaData = await qController.loadMetaData();
|
||||
// const metaData = await qController.loadMetaData();
|
||||
const results = await qController.query(tableName, 250);
|
||||
dataTableData = {
|
||||
columns: [],
|
||||
@ -160,7 +157,7 @@ function EntityList({ table }: Props): JSX.Element {
|
||||
<MDBox my={3}>
|
||||
<MDBox display="flex" justifyContent="space-between" alignItems="flex-start" mb={2}>
|
||||
<MDButton variant="gradient" color="info">
|
||||
<Link href={createPath}>new {tableName}</Link>
|
||||
<Link href={`/${tableName}/create`}>new {tableName}</Link>
|
||||
</MDButton>
|
||||
<MDBox display="flex">
|
||||
{tableProcesses.length > 0 && (
|
||||
@ -173,7 +170,7 @@ function EntityList({ table }: Props): JSX.Element {
|
||||
<Icon>keyboard_arrow_down</Icon>
|
||||
</MDButton>
|
||||
)}
|
||||
{renderActionsMenu}
|
||||
{/* renderActionsMenu */}
|
||||
<MDBox ml={1}>
|
||||
<MDButton
|
||||
variant={filtersMenu ? "contained" : "outlined"}
|
||||
|
Reference in New Issue
Block a user