diff options
Diffstat (limited to 'sdnr/wt/odlux/apps/inventoryApp/src')
-rw-r--r-- | sdnr/wt/odlux/apps/inventoryApp/src/index.html | 25 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/inventoryApp/src/models/inventory.ts | 17 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/inventoryApp/src/plugin.tsx | 17 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx | 73 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/inventoryApp/src/views/detail.tsx | 24 |
5 files changed, 156 insertions, 0 deletions
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/index.html b/sdnr/wt/odlux/apps/inventoryApp/src/index.html new file mode 100644 index 000000000..d24358e18 --- /dev/null +++ b/sdnr/wt/odlux/apps/inventoryApp/src/index.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <meta http-equiv="X-UA-Compatible" content="ie=edge"> + <!-- <link rel="stylesheet" href="./vendor.css" > --> + <title>Inventory App</title> +</head> + +<body> + <div id="app"></div> + <script type="text/javascript" src="./require.js"></script> + <script type="text/javascript" src="./config.js"></script> + <script> + // run the application + require(["app", "inventoryApp"], function (app, inventoryApp) { + inventoryApp.register(); + app("./app.tsx"); + }); + </script> +</body> + +</html>
\ No newline at end of file diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/models/inventory.ts b/sdnr/wt/odlux/apps/inventoryApp/src/models/inventory.ts new file mode 100644 index 000000000..c8c9c5702 --- /dev/null +++ b/sdnr/wt/odlux/apps/inventoryApp/src/models/inventory.ts @@ -0,0 +1,17 @@ +export { HitEntry, Result } from '../../../../framework/src/models'; +export type InventoryType = { + treeLevel: number; + parentUuid: string; + mountpoint: string; + uuid: string; + containedHolder?: (string)[] | null; + manufacturerName?: string ; + manufacturerIdentifier: string; + serial: string; + date: string; + version: string; + description: string; + partTypeId: string; + modelIdentifier: string; + typeName: string; +} diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/plugin.tsx b/sdnr/wt/odlux/apps/inventoryApp/src/plugin.tsx new file mode 100644 index 000000000..52e1d4802 --- /dev/null +++ b/sdnr/wt/odlux/apps/inventoryApp/src/plugin.tsx @@ -0,0 +1,17 @@ +// app configuration and main entry point for the app + + +import { faShoppingBag } from '@fortawesome/free-solid-svg-icons'; // select app icon + +import applicationManager from '../../../framework/src/services/applicationManager'; + +import { Dashboard } from './views/dashboard'; + +export function register() { + applicationManager.registerApplication({ + name: "inventoryApp", + icon: faShoppingBag, + rootComponent: Dashboard, + menuEntry: "Inventory App" + }); +} diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx b/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx new file mode 100644 index 000000000..8d07fa88c --- /dev/null +++ b/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx @@ -0,0 +1,73 @@ +import * as React from "react"; +import { MaterialTable, DataCallback, MaterialTableCtorType } from '../../../../framework/src/components/material-table'; + +import { Result, InventoryType } from '../models/inventory'; + + +const url = `${ window.location.origin}/database/sdnevents/inventoryequipment/_search`; + +const fetchData: DataCallback = async (page, rowsPerPage, orderBy, order, filter) => { + const from = rowsPerPage && page != null && !isNaN(+page) + ? (+page) * rowsPerPage + : null; + + const filterKeys = filter && Object.keys(filter) || []; + + const query = { + ...filterKeys.length > 0 ? { + query: { + bool: { + must: filterKeys.reduce((acc, cur) => { + if (acc && filter && filter[cur]) { + acc.push({ [filter[cur].indexOf("*") > -1 || filter[cur].indexOf("?") > -1 ? "wildcard" : "prefix"]: { [cur]: filter[cur] } }); + } + return acc; + }, [] as any[]) + } + } + }: { "query": { "match_all": {} } }, + ...rowsPerPage ? { "size": rowsPerPage } : {} , + ...from ? { "from": from } : {}, + ...orderBy && order ? { "sort": [{ [orderBy]: order }] } : {}, + }; + + const result = await fetch(url, { + method: "POST", // *GET, POST, PUT, DELETE, etc. + mode: "no-cors", // no-cors, cors, *same-origin + cache: "no-cache", // *default, no-cache, reload, force-cache, only-if-cached + headers: { + "Content-Type": "application/json; charset=utf-8", + // "Content-Type": "application/x-www-form-urlencoded", + }, + body: JSON.stringify(query), // body data type must match "Content-Type" header + }); + + if (result.ok) { + const queryResult: Result<InventoryType> = await result.json(); + const data = { + page: Math.min(page || 0, queryResult.hits.total || 0 / (rowsPerPage || 1)), rowCount: queryResult.hits.total, rows: queryResult && queryResult.hits && queryResult.hits.hits && queryResult.hits.hits.map(h => ( + { ...h._source, _id: h._id } + )) || [] + }; + return data; + } + + return { page: 0, rowCount: 0, rows: [] }; +}; + +const InventoryTable = MaterialTable as MaterialTableCtorType<InventoryType & {_id: string}>; + +export const Dashboard : React.SFC = (props) => ( + <InventoryTable onRequestData={ fetchData } columns={ [ + { property: "uuid", title: "Name" }, + { property: "parentUuid", title: "Parent" }, + { property: "mountpoint", title: "Mountpoint" }, + { property: "manufacturerIdentifier", title: "Manufacturer" }, + { property: "serial", title: "Serial" }, + { property: "typeName", title: "Type" }, + ] } title="Inventory" idProperty="_id" > + + </InventoryTable> +); + +export default Dashboard;
\ No newline at end of file diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/views/detail.tsx b/sdnr/wt/odlux/apps/inventoryApp/src/views/detail.tsx new file mode 100644 index 000000000..3f0ffccc2 --- /dev/null +++ b/sdnr/wt/odlux/apps/inventoryApp/src/views/detail.tsx @@ -0,0 +1,24 @@ +import * as React from "react"; +import { withRouter, RouteComponentProps } from 'react-router-dom'; + +import Button from '@material-ui/core/Button'; +import { WithStyles, withStyles, createStyles, Theme } from '@material-ui/core/styles'; // infra for styling + +const styles = (theme: Theme) => createStyles({ + warnButton: { + backgroundColor: theme.palette.primary.dark + } +}); + +type DetailProps = RouteComponentProps<{ id: string }> & WithStyles<typeof styles>; + +export const Detail = withStyles( styles )( withRouter( (props: DetailProps) => ( + <div> + <h1>Detail {props.match.params.id}</h1> + <p>This are the information about {props.staticContext}.</p> + <Button color={"secondary"} variant={"contained"}>Start</Button> + <Button className={ props.classes.warnButton } variant={"contained"}>Stop</Button> + </div> +))); + +export default Detail;
\ No newline at end of file |