@asaleh37/ui-base 1.2.3 → 1.2.5

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

@@ -0,0 +1,191 @@
+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 DataQueryParameterGridProps = {
+  selectedRecord: any;
+};
+
+const DataQueryParameterGrid: React.FC<DataQueryParameterGridProps> = (
+  props
+) => {
+  const SystemEntityParameters = useSelector(
+    (state: any) => state.commonStores.stores.SystemEntityParameters.data
+  );
+  const { t } = useTranslation();
+  const [data, setData] = useState([]);
+  const apiActions = useApiActions({
+    findAll: "api/v1/dev/dataqueryparameter/all",
+    deleteById: "api/v1/dev/dataqueryparameter",
+    save: "api/v1/dev/dataqueryparameter",
+    findById: "api/v1/dev/dataqueryparameter",
+    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_PARAMETER_DATA_QUERY_ID",
+        fieldName: "dataQueryId",
+        required: false,
+        fieldType: "number",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATA_QUERY_PARAMETER_ENTITY_PARAMETER_ID",
+        fieldName: "entityParameterId",
+        required: true,
+        fieldType: "combobox",
+        options: SystemEntityParameters,
+        optionValueField: "id",
+        optionDisplayField: "parameterCode",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATA_QUERY_PARAMETER_DEFAULT_VALUE",
+        fieldName: "defaultValue",
+        required: false,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATA_QUERY_PARAMETER_ENABLED",
+        fieldName: "enabled",
+        required: false,
+        fieldType: "checkbox",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATA_QUERY_PARAMETER_HIDDEN",
+        fieldName: "hidden",
+        required: false,
+        fieldType: "checkbox",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATA_QUERY_PARAMETER_MANDATORY",
+        fieldName: "mandatory",
+        required: false,
+        fieldType: "checkbox",
+      },
+    },
+  ];
+
+  return (
+    <TemplateGrid
+      apiActions={apiActions}
+      data={data}
+      setData={setData}
+      editMode={{ editMode: "row" }}
+      hideInfoBar={true}
+      formElements={formElements}
+      keyColumnName={"id"}
+      gridLoadParametersValues={{ dataQueryId: props.selectedRecord.id }}
+      gridTitle={t("DATA_QUERY_PARAMETER_PLURAL")}
+      girdIcon="table-cells"
+      editAction={{
+        isEnabled: true,
+        authority: "DATA_QUERY_PARAMETER_EDIT",
+        preActionValidation: async (data) => {
+          data.dataQueryId = props.selectedRecord.id;
+          return true;
+        },
+      }}
+      deleteAction={{
+        isEnabled: true,
+        authority: "DATA_QUERY_PARAMETER_DELETE",
+      }}
+    />
+  );
+};
+
+export default DataQueryParameterGrid;

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

@@ -0,0 +1,84 @@
+import { useEffect, useState } from "react";
+import TransferList from "../../templates/TransferList";
+import { Box, Button } from "@mui/material";
+import { toast } from "react-toastify";
+import { useAxios } from "../../../hooks";
+
+type DataQueryParametersFormProps = {
+  selectedRecord: any;
+  closeModalFn: () => void;
+};
+
+const DataQueryParametersForm: React.FC<DataQueryParametersFormProps> = (
+  props
+) => {
+  const [selectedOptions, setSelectedOptions] = useState([]);
+  const [availableOptions, setAvailableOptions] = useState([]);
+  const { handlePostRequest, handleGetRequest } = useAxios();
+
+  const getOptions = async () => {
+    await handleGetRequest({
+      endPointURI: "api/v1/dev/dataquery/parameters",
+      showMask: true,
+      parameters: {
+        dataQueryId: props.selectedRecord.id,
+      },
+      successCallBkFn: (response: any) => {
+        setSelectedOptions(response.data.selectedOptions);
+        setAvailableOptions(response.data.availableOptions);
+      },
+    });
+  };
+
+  useEffect(() => {
+    if (props.selectedRecord) {
+      getOptions();
+    }
+  }, [props.selectedRecord]);
+  const saveOptions = async () => {
+    await handlePostRequest({
+      endPointURI: "api/v1/dev/dataquery/parameters",
+      showMask: true,
+      parameters: { dataQueryId: props.selectedRecord.id },
+      data: selectedOptions,
+      successCallBkFn: () => {
+        toast.success("Your request has been proccesed successfully");
+        if (props.closeModalFn) {
+          props.closeModalFn();
+        }
+      },
+    });
+  };
+  return (
+    <>
+      <TransferList
+        displayField="parameterCode"
+        options={availableOptions}
+        valueField="id"
+        selectedOptions={selectedOptions}
+        setSelection={setSelectedOptions}
+      />
+      <Box
+        sx={{
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "flex-end",
+          width: "100%",
+        }}
+      >
+        <Button
+          variant="contained"
+          onClick={saveOptions}
+          sx={{ marginRight: 1, marginLeft: 1 }}
+        >
+          Save
+        </Button>
+        <Button variant="contained" color="error" onClick={props.closeModalFn}>
+          Cancel
+        </Button>
+      </Box>
+    </>
+  );
+};
+
+export default DataQueryParametersForm;

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

@@ -0,0 +1,150 @@
+import { useState } from "react";
+import TemplateGrid from "../../templates/DataEntryTemplates/TemplateDataGrid/TemplateGrid";
+import { useApiActions, useAxios } from "../../../hooks";
+import { FormElementProps } from "../../templates/DataEntryTemplates/DataEntryTypes";
+import { useTranslation } from "react-i18next";
+import { useSelector } from "react-redux";
+import { toast } from "react-toastify";
+
+const DatasourceConnectionGrid: React.FC = () => {
+  const { handleGetRequest } = useAxios();
+  const SystemDataSourceType = useSelector(
+    (state: any) => state.commonStores.stores.SystemDataSourceType.data
+  );
+  const { t } = useTranslation();
+  const [data, setData] = useState([]);
+  const apiActions = useApiActions({
+    deleteById: "api/v1/dev/datasourceconnection",
+    save: "api/v1/dev/datasourceconnection",
+    findById: "api/v1/dev/datasourceconnection",
+    setData: setData,
+    commonStoreKey: "SystemDataSources",
+  });
+
+  const formElements: Array<FormElementProps> = [
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "ID",
+        fieldName: "id",
+        hidden: true,
+        gridProps: {
+          hidden: true,
+        },
+        required: false,
+        fieldType: "number",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATASOURCE_CONNECTION_CONNECTION_NAME",
+        fieldName: "connectionName",
+        required: true,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATASOURCE_CONNECTION_DATASOURCE_TYPE",
+        fieldName: "datasourceType",
+        required: true,
+        fieldType: "combobox",
+        options: SystemDataSourceType,
+        optionValueField: "value",
+        optionDisplayField: "value",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATASOURCE_CONNECTION_DATASOURCE_URL",
+        fieldName: "datasourceUrl",
+        required: true,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATASOURCE_CONNECTION_DATASOURCE_USERNAME",
+        fieldName: "datasourceUsername",
+        required: true,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATASOURCE_CONNECTION_DATASOURCE_PASSWORD",
+        fieldName: "datasourcePassword",
+        required: true,
+        fieldType: "text",
+      },
+    },
+
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "DATASOURCE_CONNECTION_ENABLED",
+        fieldName: "enabled",
+        required: false,
+        fieldType: "checkbox",
+      },
+    },
+  ];
+
+  return (
+    <TemplateGrid
+      apiActions={apiActions}
+      data={data}
+      setData={setData}
+      editMode={{
+        editMode: "modal",
+        specs: {
+          modalTitle: "Datasource Connection",
+          modalIcon: "plug",
+          modalWidth: 300,
+        },
+      }}
+      formElements={formElements}
+      keyColumnName={"id"}
+      gridTitle={t("DATASOURCE_CONNECTION_PLURAL")}
+      girdIcon="plug"
+      rowActions={[
+        {
+          icon: "plug",
+          label: "test connection",
+          actionFn: async (data) => {
+            await handleGetRequest({
+              endPointURI: "api/v1/dev/datasourceConnection/test",
+              showMask: true,
+              parameters: {
+                id: data.id,
+              },
+              // loadingMessage: "checking datasource connectivity",
+              successCallBkFn: (response: any) => {
+                toast.success(response.data);
+              },
+            });
+          },
+        },
+      ]}
+      editAction={{ isEnabled: true, authority: "DATASOURCE_CONNECTION_EDIT" }}
+      deleteAction={{
+        isEnabled: true,
+        authority: "DATASOURCE_CONNECTION_DELETE",
+      }}
+    />
+  );
+};
+
+export default DatasourceConnectionGrid;

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

@@ -0,0 +1,279 @@
+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";
+import { DATE_FORMAT, DATE_TIME_FORMAT } from "../../../util";
+
+const EntityParameterGrid: React.FC = () => {
+  const { t } = useTranslation();
+  const SystemParameterTypes = useSelector(
+    (state: any) => state.commonStores.stores.SystemParameterTypes.data
+  );
+  const [data, setData] = useState([]);
+  const apiActions = useApiActions({
+    commonStoreKey: "SystemEntityParameters",
+    deleteById: "api/v1/dev/entityparameter",
+    save: "api/v1/dev/entityparameter",
+    findById: "api/v1/dev/entityparameter",
+    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: "ENTITY_PARAMETER_PARAMETER_CODE",
+        fieldName: "parameterCode",
+        required: true,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "ENTITY_PARAMETER_PARAMETER_LABEL",
+        fieldName: "parameterLabel",
+        required: true,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "ENTITY_PARAMETER_PARAMETER_TYPE",
+        fieldName: "parameterType",
+        required: true,
+        fieldType: "combobox",
+        options: SystemParameterTypes,
+        optionDisplayField: "value",
+        optionValueField: "value",
+        formProps: {
+          onValueChangeCallBack(
+            value,
+            formManager,
+            formActions,
+            selectedRecord
+          ) {
+            if (value === "combobox") {
+              formManager.setValue("parameterValueFormat", null);
+              formActions.showField("parameterDataQueryId");
+              formActions.showField("parameterDataset");
+              formActions.showField("parameterDisplayField");
+              formActions.showField("parameterValueField");
+              formActions.hideField("parameterValueFormat");
+            } else if (value === "date" || value === "datetime") {
+              if (value === "date") {
+                formManager.setValue("parameterValueFormat", DATE_FORMAT);
+              } else if (value === "datetime") {
+                formManager.setValue("parameterValueFormat", DATE_TIME_FORMAT);
+              }
+              formActions.hideField("parameterDataQueryId");
+              formActions.hideField("parameterDataset");
+              formActions.hideField("parameterDisplayField");
+              formActions.hideField("parameterValueField");
+              formActions.showField("parameterValueFormat");
+            } else {
+              formManager.setValue("parameterValueFormat", null);
+              formActions.hideField("parameterDataQueryId");
+              formActions.hideField("parameterDataset");
+              formActions.hideField("parameterDisplayField");
+              formActions.hideField("parameterValueField");
+              formActions.hideField("parameterValueFormat");
+            }
+          },
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "ENTITY_PARAMETER_PARAMETER_DATA_QUERY_ID",
+        fieldName: "parameterDataQueryId",
+        hidden: true,
+        required: false,
+        fieldType: "text",
+        formProps: {
+          onValueChangeCallBack(
+            value,
+            formManager,
+            formActions,
+            selectedRecord
+          ) {
+            if (value != null && value != "") {
+              formManager.setValue("parameterDataset", null);
+              formActions.hideField("parameterDataset");
+            } else {
+              formActions.showField("parameterDataset");
+            }
+          },
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "ENTITY_PARAMETER_PARAMETER_DATASET",
+        fieldName: "parameterDataset",
+        hidden: true,
+        required: false,
+        fieldType: "text",
+        formProps: {
+          onValueChangeCallBack(
+            value,
+            formManager,
+            formActions,
+            selectedRecord
+          ) {
+            if (value != null && value != "") {
+              formManager.setValue("parameterDataQueryId", null);
+              formActions.hideField("parameterDataQueryId");
+            } else {
+              formActions.showField("parameterDataQueryId");
+            }
+          },
+        },
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "ENTITY_PARAMETER_PARAMETER_DISPLAY_FIELD",
+        fieldName: "parameterDisplayField",
+        hidden: true,
+        required: false,
+        fieldType: "text",
+      },
+    },
+
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "ENTITY_PARAMETER_PARAMETER_VALUE_FIELD",
+        fieldName: "parameterValueField",
+        hidden: true,
+        required: false,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "ENTITY_PARAMETER_PARAMETER_VALUE_FORMAT",
+        fieldName: "parameterValueFormat",
+        required: false,
+        hidden: true,
+        fieldType: "text",
+      },
+    },
+    {
+      type: "field",
+      mode: "props",
+      props: {
+        fieldLabel: "ENTITY_PARAMETER_ENABLED",
+        fieldName: "enabled",
+        required: false,
+        fieldType: "checkbox",
+      },
+    },
+  ];
+
+  return (
+    <TemplateGrid
+      apiActions={apiActions}
+      data={data}
+      setData={setData}
+      editMode={{
+        editMode: "modal",
+        specs: {
+          modalTitle: "Entity Parameter",
+          modalIcon: "p",
+          modalWidth: 300,
+        },
+      }}
+      formElements={formElements}
+      keyColumnName={"id"}
+      gridTitle={t("ENTITY_PARAMETER_PLURAL")}
+      girdIcon="p"
+      editAction={{ isEnabled: true, authority: "ENTITY_PARAMETER_EDIT" }}
+      deleteAction={{ isEnabled: true, authority: "ENTITY_PARAMETER_DELETE" }}
+    />
+  );
+};
+
+export default EntityParameterGrid;