@asaleh37/ui-base 1.2.3 → 1.2.5

package/src/components/administration/dev/BluePrintGrid.tsx

@@ -0,0 +1,129 @@
+import { useState } from "react";
+import TemplateGrid from "../../templates/DataEntryTemplates/TemplateDataGrid/TemplateGrid";
+import { useApiActions } from "../../../hooks";
+import { FormElementProps } from "../../templates/DataEntryTemplates/DataEntryTypes";
+import { useTranslation } from "react-i18next";
+import { useSelector } from "react-redux";
+
+const BluePrintGrid: React.FC = () => {
+  const { t } = useTranslation();
+  const SystemDataQueries = useSelector(
+    (state: any) => state.commonStores.stores.SystemDataQueries.data
+  );
+  const [data, setData] = useState([]);
+  const apiActions = useApiActions({
+    commonStoreKey: "SystemBluePrints",
+    deleteById: "api/v1/dev/blueprint",
+    save: "api/v1/dev/blueprint",
+    findById: "api/v1/dev/blueprint",
+    setData: setData,
+  });
+
+  const formElements: Array<FormElementProps> = [
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "id",
+        fieldName: "id",
+        fieldType: "number",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "createTime",
+        fieldName: "createTime",
+        fieldType: "datetime",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "createdBy",
+        fieldName: "createdBy",
+        fieldType: "text",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "lastUpdateBy",
+        fieldName: "lastUpdateBy",
+        fieldType: "text",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "lastUpdateTime",
+        fieldName: "lastUpdateTime",
+        fieldType: "datetime",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "BLUE_PRINT_BLUE_PRINT_CODE",
+        fieldName: "bluePrintCode",
+        required: true,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "BLUE_PRINT_QUERY_ID",
+        fieldName: "queryId",
+        required: true,
+        fieldType: "combobox",
+        options: SystemDataQueries,
+        optionDisplayField: "queryName",
+        optionValueField: "id",
+      },
+    },
+  ];
+
+  return (
+    <TemplateGrid
+      apiActions={apiActions}
+      data={data}
+      setData={setData}
+      editMode={{ editMode: "row", reloadAfterSave: true }}
+      formElements={formElements}
+      keyColumnName={"id"}
+      gridTitle={t("BLUE_PRINT_PLURAL")}
+      girdIcon="table-cells"
+      editAction={{ isEnabled: true, authority: "BLUE_PRINT_EDIT" }}
+      deleteAction={{ isEnabled: true, authority: "BLUE_PRINT_DELETE" }}
+    />
+  );
+};
+
+export default BluePrintGrid;

package/src/components/administration/dev/DashboardGrid.tsx

@@ -0,0 +1,173 @@
+import { useState } from "react";
+import TemplateGrid from "../../templates/DataEntryTemplates/TemplateDataGrid/TemplateGrid";
+import { FormElementProps } from "../../templates/DataEntryTemplates/DataEntryTypes";
+import { useTranslation } from "react-i18next";
+import { useApiActions, useWindow } from "../../../hooks";
+import DashboardWidgetGrid from "./DashboardWidgetGrid";
+import { useNavigate } from "react-router-dom";
+
+const DashboardGrid: React.FC = () => {
+  const { t } = useTranslation();
+  const [selectedRecord, setSelectedRecord] = useState<any>(null);
+  const { Window: WidgetsWindows, setWindowState: setWidgetsWindowState } =
+    useWindow({
+      windowTitle: "Dashboard Widgets",
+      windowIcon: "chart-pie",
+    });
+  const [data, setData] = useState([]);
+  const navigate = useNavigate();
+  const apiActions = useApiActions({
+    findAll: "api/v1/dev/dashboard/all",
+    deleteById: "api/v1/dev/dashboard",
+    save: "api/v1/dev/dashboard",
+    findById: "api/v1/dev/dashboard",
+    setData: setData,
+  });
+
+  const formElements: Array<FormElementProps> = [
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "id",
+        fieldName: "id",
+        fieldType: "number",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "createTime",
+        fieldName: "createTime",
+        fieldType: "datetime",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "createdBy",
+        fieldName: "createdBy",
+        fieldType: "text",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "lastUpdateBy",
+        fieldName: "lastUpdateBy",
+        fieldType: "text",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "lastUpdateTime",
+        fieldName: "lastUpdateTime",
+        fieldType: "datetime",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DASHBOARD_DASHBOARD_CODE",
+        fieldName: "dashboardCode",
+        required: true,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DASHBOARD_DASHBOARD_NAME",
+        fieldName: "dashboardName",
+        required: true,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DASHBOARD_DASHBOARD_TITLE",
+        fieldName: "dashboardTitle",
+        required: true,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DASHBOARD_ENABLED",
+        fieldName: "enabled",
+        required: false,
+        fieldType: "checkbox",
+      },
+    },
+  ];
+
+  return (
+    <>
+      <WidgetsWindows>
+        <DashboardWidgetGrid selectedRecord={selectedRecord} />
+      </WidgetsWindows>
+      <TemplateGrid
+        apiActions={apiActions}
+        data={data}
+        setData={setData}
+        editMode={{ editMode: "row" }}
+        formElements={formElements}
+        keyColumnName={"id"}
+        rowActions={[
+          {
+            label: "Widgets",
+            icon: "chart-pie",
+            actionFn: async (data) => {
+              setSelectedRecord(data);
+              setWidgetsWindowState(true);
+            },
+          },
+          {
+            label: "View",
+            icon: "eye",
+            actionFn: async (data) => {
+              navigate("/dashboard/" + data.dashboardCode);
+            },
+          },
+        ]}
+        gridTitle={t("DASHBOARD_PLURAL")}
+        girdIcon="square-poll-vertical"
+        editAction={{ isEnabled: true, authority: "DASHBOARD_EDIT" }}
+        deleteAction={{ isEnabled: true, authority: "DASHBOARD_DELETE" }}
+      />
+    </>
+  );
+};
+
+export default DashboardGrid;

package/src/components/administration/dev/DashboardWidgetGrid.tsx

@@ -0,0 +1,164 @@
+import { useState } from "react";
+import TemplateGrid from "../../templates/DataEntryTemplates/TemplateDataGrid/TemplateGrid";
+import { FormElementProps } from "../../templates/DataEntryTemplates/DataEntryTypes";
+import { useTranslation } from "react-i18next";
+import { useApiActions } from "../../../hooks";
+import { useSelector } from "react-redux";
+
+type DashboardWidgetGridProps = {
+  selectedRecord: any;
+};
+
+const DashboardWidgetGrid: React.FC<DashboardWidgetGridProps> = (props) => {
+  const { t } = useTranslation();
+  const [data, setData] = useState([]);
+  const SystemWidgets = useSelector(
+    (state: any) => state.commonStores.stores.SystemWidgets.data
+  );
+  const apiActions = useApiActions({
+    findAll: "api/v1/dev/dashboardwidget/all",
+    deleteById: "api/v1/dev/dashboardwidget",
+    save: "api/v1/dev/dashboardwidget",
+    findById: "api/v1/dev/dashboardwidget",
+    setData: setData,
+  });
+
+  const formElements: Array<FormElementProps> = [
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "id",
+        fieldName: "id",
+        fieldType: "number",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "createTime",
+        fieldName: "createTime",
+        fieldType: "datetime",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "createdBy",
+        fieldName: "createdBy",
+        fieldType: "text",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "lastUpdateBy",
+        fieldName: "lastUpdateBy",
+        fieldType: "text",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "lastUpdateTime",
+        fieldName: "lastUpdateTime",
+        fieldType: "datetime",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DASHBOARD_WIDGET_DASHBOARD_ID",
+        fieldName: "dashboardId",
+        required: false,
+        hidden: true,
+        gridProps: { hidden: true },
+        fieldType: "number",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DASHBOARD_WIDGET_WIDGET_ID",
+        fieldName: "widgetId",
+        required: true,
+        fieldType: "combobox",
+        options: SystemWidgets,
+        optionValueField: "id",
+        optionDisplayField: "widgetName",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DASHBOARD_WIDGET_WIDGET_ORDER",
+        fieldName: "widgetOrder",
+        required: false,
+        fieldType: "number",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DASHBOARD_WIDGET_ENABLED",
+        fieldName: "enabled",
+        required: false,
+        fieldType: "checkbox",
+      },
+    },
+  ];
+
+  return (
+    <TemplateGrid
+      apiActions={apiActions}
+      data={data}
+      setData={setData}
+      editMode={{ editMode: "row" }}
+      hideInfoBar={true}
+      formElements={formElements}
+      gridLoadParametersValues={{ dashboardId: props.selectedRecord.id }}
+      keyColumnName={"id"}
+      gridTitle={t("DASHBOARD_WIDGET_PLURAL")}
+      girdIcon="table-cells"
+      editAction={{
+        isEnabled: true,
+        authority: "DASHBOARD_WIDGET_EDIT",
+        preActionValidation: async (data) => {
+          data.dashboardId = props.selectedRecord.id;
+          return true;
+        },
+      }}
+      deleteAction={{ isEnabled: true, authority: "DASHBOARD_WIDGET_DELETE" }}
+    />
+  );
+};
+
+export default DashboardWidgetGrid;

package/src/components/administration/dev/DataQueryGrid.tsx

@@ -0,0 +1,206 @@
+import { useState } from "react";
+import TemplateGrid from "../../templates/DataEntryTemplates/TemplateDataGrid/TemplateGrid";
+import { useApiActions, useWindow } from "../../../hooks";
+import { FormElementProps } from "../../templates/DataEntryTemplates/DataEntryTypes";
+import { useTranslation } from "react-i18next";
+import { useSelector } from "react-redux";
+import DataQueryParametersForm from "./DataQueryParametersForm";
+import DataQueryParameterGrid from "./DataQueryParameterGrid";
+
+const DataQueryGrid: React.FC = () => {
+  const [selectedRecord, setSelectedRecord] = useState<any>(null);
+  const {
+    Window: DataQueryParameterWindow,
+    setWindowState: setDataQueryParameterWindow,
+  } = useWindow({
+    width: "50%",
+    windowTitle: "Data query parameters",
+    windowIcon: "p",
+  });
+  const SystemDataSources = useSelector(
+    (state: any) => state.commonStores.stores.SystemDataSources.data
+  );
+  const { t } = useTranslation();
+  const [data, setData] = useState([]);
+  const apiActions = useApiActions({
+    commonStoreKey: "SystemDataQueries",
+    deleteById: "api/v1/dev/dataquery",
+    save: "api/v1/dev/dataquery",
+    findById: "api/v1/dev/dataquery",
+    setData: setData,
+  });
+
+  const formElements: Array<FormElementProps> = [
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "id",
+        fieldName: "id",
+        fieldType: "number",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "createTime",
+        fieldName: "createTime",
+        fieldType: "datetime",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "createdBy",
+        fieldName: "createdBy",
+        fieldType: "text",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "lastUpdateBy",
+        fieldName: "lastUpdateBy",
+        fieldType: "text",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "lastUpdateTime",
+        fieldName: "lastUpdateTime",
+        fieldType: "datetime",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATA_QUERY_QUERY_NAME",
+        fieldName: "queryName",
+        required: false,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATA_QUERY_USE_SYS_CON",
+        fieldName: "useSysCon",
+        required: false,
+        fieldType: "checkbox",
+        formProps: {
+          onValueChangeCallBack(
+            value,
+            formManager,
+            formActions,
+            selectedRecord
+          ) {
+            if (value) {
+              formActions.hideField("datasourceConId");
+              formManager.setValue("datasourceConId", null);
+            } else {
+              formActions.showField("datasourceConId");
+            }
+          },
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATA_QUERY_DATASOURCE_CON_ID",
+        fieldName: "datasourceConId",
+        required: false,
+        options: SystemDataSources,
+        optionDisplayField: "connectionName",
+        optionValueField: "id",
+        fieldType: "combobox",
+      },
+    },
+
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATA_QUERY_QUERY_STR",
+        fieldName: "queryStr",
+        formProps: { fieldHeight: 400 },
+        gridProps: {
+          hidden: true,
+        },
+        muiTextFieldProps: {
+          multiline: true,
+          rows: 4,
+        },
+        required: false,
+        fieldType: "text",
+      },
+    },
+  ];
+
+  return (
+    <>
+      <DataQueryParameterWindow>
+        <DataQueryParameterGrid selectedRecord={selectedRecord} />
+      </DataQueryParameterWindow>
+      <TemplateGrid
+        apiActions={apiActions}
+        rowActions={[
+          {
+            label: "Query Parameters",
+            actionFn: async (data) => {
+              setSelectedRecord(data);
+              setDataQueryParameterWindow(true);
+            },
+            icon: "p",
+          },
+        ]}
+        data={data}
+        setData={setData}
+        editMode={{
+          editMode: "modal",
+          specs: {
+            modalTitle: "System Query",
+            modalWidth: 600,
+            modalIcon: "file-code",
+          },
+        }}
+        formElements={formElements}
+        keyColumnName={"id"}
+        gridTitle={t("DATA_QUERY_PLURAL")}
+        girdIcon="table-cells"
+        editAction={{ isEnabled: true, authority: "DATA_QUERY_EDIT" }}
+        deleteAction={{ isEnabled: true, authority: "DATA_QUERY_DELETE" }}
+      />
+    </>
+  );
+};
+
+export default DataQueryGrid;