From 49d37ee7e110f6c028ecd957c5d37aab2aa9a3cf Mon Sep 17 00:00:00 2001 From: Fuzi_fauzia Date: Thu, 20 Jun 2024 15:50:40 +0700 Subject: [PATCH] integrasi fimter device --- .../_layout/settings/menu-settings.config.ts | 1432 ++++++++--------- .../device-control.component.css | 57 +- .../device-control.component.html | 171 +- .../device-control.component.ts | 82 + .../hemat-app/device/device.component.html | 122 +- .../hemat-app/device/device.component.ts | 98 +- .../content/hemat-app/device/device.module.ts | 2 + .../hemat-app/service/device.service.ts | 53 + .../service/monitoring-api.service.ts | 27 - 9 files changed, 1171 insertions(+), 873 deletions(-) create mode 100644 src/app/content/hemat-app/service/device.service.ts diff --git a/src/app/_layout/settings/menu-settings.config.ts b/src/app/_layout/settings/menu-settings.config.ts index a4c68b5..421ab01 100644 --- a/src/app/_layout/settings/menu-settings.config.ts +++ b/src/app/_layout/settings/menu-settings.config.ts @@ -1066,736 +1066,736 @@ export const MenuSettingsConfig: MenuConfig = { }, }, - // { section: 'APPS', icon: 'la-ellipsis-h' }, - // { - // title: 'Dashboard', - // icon: 'la-home', - // page: 'null', - // badge: { type: 'badge-info', value: '3' }, - // submenu: { - // items: [ - // { - // title: 'Sales', - // page: '/dashboard/sales' - // }, - // { - // title: 'Ecommerce', - // page: '/dashboard/ecommerce' - // }, - // { - // title: 'Hospital', - // page: '/dashboard/hospital' - // } - // ] - // } - // }, - // { - // title: 'Templates', - // icon: 'la-television', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Horizontal', - // page: 'null' - // }, - // { - // title: 'Vertical', - // page: 'null' - // }, - // ] - // } - // }, - // { - // title: 'To Do', - // icon: 'la-edit', - // page: '/todo-app' - // }, - // { - // title: 'Contacts', - // icon: 'la-users', - // page: '/contacts' - // }, - // { - // title: 'Email Application', - // icon: 'la-envelope', - // page: '/email' - // }, - // { - // title: 'Chat Application', - // icon: 'la-comments', - // page: '/chats' - // }, - // { - // title: 'Calenders', - // icon: 'la-calendar', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Basic', - // page: '/calender/basic' - // }, - // { - // title: 'Events', - // page: '/calender/events' - // }, + { section: 'APPS', icon: 'la-ellipsis-h' }, + { + title: 'Dashboard', + icon: 'la-home', + page: 'null', + badge: { type: 'badge-info', value: '3' }, + submenu: { + items: [ + { + title: 'Sales', + page: '/dashboard/sales' + }, + { + title: 'Ecommerce', + page: '/dashboard/ecommerce' + }, + { + title: 'Hospital', + page: '/dashboard/hospital' + } + ] + } + }, + { + title: 'Templates', + icon: 'la-television', + page: 'null', + submenu: { + items: [ + { + title: 'Horizontal', + page: 'null' + }, + { + title: 'Vertical', + page: 'null' + }, + ] + } + }, + { + title: 'To Do', + icon: 'la-edit', + page: '/todo-app' + }, + { + title: 'Contacts', + icon: 'la-users', + page: '/contacts' + }, + { + title: 'Email Application', + icon: 'la-envelope', + page: '/email' + }, + { + title: 'Chat Application', + icon: 'la-comments', + page: '/chats' + }, + { + title: 'Calenders', + icon: 'la-calendar', + page: 'null', + submenu: { + items: [ + { + title: 'Basic', + page: '/calender/basic' + }, + { + title: 'Events', + page: '/calender/events' + }, - // { - // title: 'Addevent', - // page: '/calender/addevent' - // }, - // ] - // } - // }, - // { - // title: 'KanBan', - // icon: 'la-comments', - // page: '/kanban' - // }, - // { section: 'PAGES', icon: 'la-ellipsis-h' }, - // { - // title: 'News Feed', - // icon: 'la-newspaper-o', - // page: '/news-feed/news-feed' - // }, - // { - // title: 'Social Feed', - // icon: 'la-share-alt', - // page: '/social-feed/social-feed' - // }, - // { - // title: 'Invoice', - // icon: 'la-clipboard', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Invoice Summary', - // page: '/invoice/invoice-summary', - // }, - // { - // title: 'Invoice Template', - // page: '/invoice/invoice-template', - // }, - // { - // title: 'Invoice List', - // page: '/invoice/invoice-list', - // }, - // ] - // } - // }, - // { - // title: 'Timelines', - // icon: 'la-film', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Timelines Center', - // page: '/timelines/timelines-center', - // }, - // { - // title: 'Timelines Left ', - // page: '/timelines/timelines-left', - // }, - // { - // title: 'Timelines Right ', - // page: '/timelines/timelines-right', - // }, - // { - // title: 'Timelines Horizontal', - // page: '/timelines/timelines-horizontal', - // } - // ] - // } - // }, - // { - // title: 'User', - // icon: 'la-user', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'User Profile', - // page: '/user/user-profile', - // }, - // { - // title: 'User Cards', - // page: '/user/user-cards', - // }, - // ] - // } - // }, - // { - // title: 'Gallery', - // icon: 'la-image', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Gallery Grid', - // page: '/gallery/gallery-grid', - // }, - // { - // title: 'Gallery Grid with Desc', - // page: '/gallery/gallery-grid-desc', - // }, - // { - // title: 'Masonry Gallery', - // page: '/gallery/masonry-gallery', - // }, - // { - // title: 'Hover Effect', - // page: '/gallery/hover-effect', - // }, - // ] - // } - // }, - // { - // title: 'File Uploader', - // icon: 'la la-cloud-upload', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Dropzone', - // page: '/dropzone/dropzone', - // } - // ] - // } - // }, - // { - // title: 'Search', - // icon: 'la-search', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Search Page', - // page: '/others/searchPage', - // }, - // { - // title: 'Search Website', - // page: '/search/searchWebsite', - // }, - // { - // title: 'Search Images', - // page: '/search/searchImages', - // }, - // { - // title: 'Search Videos', - // page: '/search/searchVideos', - // }, - // ] - // } - // }, - // { - // title: 'Authentication', - // icon: 'la-unlock', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Login Simple', - // page: '/authentication/loginSimple', - // }, - // { - // title: 'Login With Bg', - // page: '/authentication/loginWithBg', - // }, - // { - // title: 'Login With Bg Image', - // page: '/authentication/loginWithBgImage', - // }, - // { - // title: 'Login With Navbar', - // page: '/authentication/loginWithNavbar', - // }, - // { - // title: 'Login Advanced', - // page: '/authentication/loginAdvanced', - // }, - // { - // title: 'Register Simple', - // page: '/authentication/registerSimple', - // }, - // { - // title: 'Register With Bg', - // page: '/authentication/registerWithBg', - // }, - // { - // title: 'Register With Bg Image', - // page: '/authentication/registerWithBgImage', - // }, - // { - // title: 'Register With Navbar', - // page: '/authentication/registerWithNavbar', - // }, - // { - // title: 'Register Advanced', - // page: '/authentication/registerAdvanced', - // }, - // { - // title: 'Unlock User', - // page: '/authentication/unlockUser', - // }, - // { - // title: 'recover-password', - // page: '/authentication/recoverPassword', - // }, - // ] - // } - // }, - // { - // title: 'Error', - // icon: 'la-warning', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Error 400', - // page: '/error/error400', - // }, - // { - // title: 'Error 400 with Navbar', - // page: '/error/error400WithNavbar', - // }, - // { - // title: 'Error 401', - // page: '/error/error401', - // }, - // { - // title: 'Error 401 with Navbar', - // page: '/error/error401WithNavbar', - // }, - // { - // title: 'Error 403', - // page: '/error/error403', - // }, - // { - // title: 'Error 403 with Navbar', - // page: '/error/error403WithNavbar', - // }, - // { - // title: 'Error 404', - // page: '/error/error404', - // }, - // { - // title: 'Error 404 with Navbar', - // page: '/error/error404WithNavbar', - // }, - // { - // title: 'Error 500', - // page: '/error/error500', - // }, - // { - // title: 'Error 500 with Navbar', - // page: '/error/error500WithNavbar', - // }, - // ] - // } - // }, - // { - // title: 'Others', - // icon: 'la-file-text', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Coming Soon', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Flat', - // page: '/others/flat' - // }, - // { - // title: 'Bg image', - // page: '/others/bgImage' - // }, - // // { - // // title: 'Bg video', - // // page: '/others/bgVideo' - // // }, - // ] - // } - // }, - // { - // title: 'Maintenance', - // page: '/others/maintenance' - // }, - // ] - // } - // }, - // { section: 'USER INTERFACE', icon: 'la-ellipsis-h' }, - // { - // title: 'Cards', - // page: '/cards/bootstrap', - // icon: 'la-tablet' - // }, - // { - // title: 'Advance Cards', - // icon: 'la-fire', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Statistics', - // page: '/advanceCards/statistics' - // }, - // { - // title: 'Social', - // page: '/advanceCards/social' - // }, - // { - // title: 'Charts', - // page: '/advanceCards/charts' - // }, - // ] - // } - // }, - // { - // title: 'Components', - // icon: 'la-server', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Alerts', - // page: '/components/alerts' - // }, - // { - // title: 'Callout', - // page: '/components/callout' - // }, - // { - // title: 'Buttons', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Basic Buttons', - // page: '/components/basic-buttons' - // }, - // { - // title: 'Extended Buttons', - // page: '/components/extended-buttons' - // } - // ] - // } - // }, - // { - // title: 'Carousel', - // page: '/components/carousel' - // }, - // { - // title: 'Collapse', - // page: '/components/collapse' - // }, - // { - // title: 'Dropdowns', - // page: '/components/dropdowns' - // }, - // { - // title: 'List Group', - // page: '/components/list-group' - // }, - // { - // title: 'Modals', - // page: '/components/modals' - // }, - // { - // title: 'Pagination', - // page: '/components/pagination' - // }, - // { - // title: 'Navs Component', - // page: '/components/navs' - // }, - // { - // title: 'Pills Component', - // page: '/components/pills' - // }, - // { - // title: 'Tooltips', - // page: '/components/tooltips' - // }, - // { - // title: 'Popovers', - // page: '/components/popovers' - // }, - // { - // title: 'Badges', - // page: '/components/badges' - // }, - // { - // title: 'Pill Badges', - // page: '/components/pill-badges' - // }, - // { - // title: 'Progress', - // page: '/components/progress' - // }, - // { - // title: 'Media Objects', - // page: '/components/mediaobjects' - // }, - // { - // title: 'Scrollable', - // page: '/components/scrollable' - // }, - // { - // title: 'Spinners', - // page: '/components/spinners' - // }, - // ] - // } - // }, - // { - // title: 'Extra Components', - // icon: 'la-diamond', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Date Time Picker', - // page: '/extraComponents/dateTimePicker' - // }, - // { - // title: 'TypeAhead', - // page: '/extraComponents/typeAhead' - // }, - // { - // title: 'Text Editer', - // page: '/extraComponents/text-editor' - // } - // ] - // } - // }, - // { - // title: 'Icons', + { + title: 'Addevent', + page: '/calender/addevent' + }, + ] + } + }, + { + title: 'KanBan', + icon: 'la-comments', + page: '/kanban' + }, + { section: 'PAGES', icon: 'la-ellipsis-h' }, + { + title: 'News Feed', + icon: 'la-newspaper-o', + page: '/news-feed/news-feed' + }, + { + title: 'Social Feed', + icon: 'la-share-alt', + page: '/social-feed/social-feed' + }, + { + title: 'Invoice', + icon: 'la-clipboard', + page: 'null', + submenu: { + items: [ + { + title: 'Invoice Summary', + page: '/invoice/invoice-summary', + }, + { + title: 'Invoice Template', + page: '/invoice/invoice-template', + }, + { + title: 'Invoice List', + page: '/invoice/invoice-list', + }, + ] + } + }, + { + title: 'Timelines', + icon: 'la-film', + page: 'null', + submenu: { + items: [ + { + title: 'Timelines Center', + page: '/timelines/timelines-center', + }, + { + title: 'Timelines Left ', + page: '/timelines/timelines-left', + }, + { + title: 'Timelines Right ', + page: '/timelines/timelines-right', + }, + { + title: 'Timelines Horizontal', + page: '/timelines/timelines-horizontal', + } + ] + } + }, + { + title: 'User', + icon: 'la-user', + page: 'null', + submenu: { + items: [ + { + title: 'User Profile', + page: '/user/user-profile', + }, + { + title: 'User Cards', + page: '/user/user-cards', + }, + ] + } + }, + { + title: 'Gallery', + icon: 'la-image', + page: 'null', + submenu: { + items: [ + { + title: 'Gallery Grid', + page: '/gallery/gallery-grid', + }, + { + title: 'Gallery Grid with Desc', + page: '/gallery/gallery-grid-desc', + }, + { + title: 'Masonry Gallery', + page: '/gallery/masonry-gallery', + }, + { + title: 'Hover Effect', + page: '/gallery/hover-effect', + }, + ] + } + }, + { + title: 'File Uploader', + icon: 'la la-cloud-upload', + page: 'null', + submenu: { + items: [ + { + title: 'Dropzone', + page: '/dropzone/dropzone', + } + ] + } + }, + { + title: 'Search', + icon: 'la-search', + page: 'null', + submenu: { + items: [ + { + title: 'Search Page', + page: '/others/searchPage', + }, + { + title: 'Search Website', + page: '/search/searchWebsite', + }, + { + title: 'Search Images', + page: '/search/searchImages', + }, + { + title: 'Search Videos', + page: '/search/searchVideos', + }, + ] + } + }, + { + title: 'Authentication', + icon: 'la-unlock', + page: 'null', + submenu: { + items: [ + { + title: 'Login Simple', + page: '/authentication/loginSimple', + }, + { + title: 'Login With Bg', + page: '/authentication/loginWithBg', + }, + { + title: 'Login With Bg Image', + page: '/authentication/loginWithBgImage', + }, + { + title: 'Login With Navbar', + page: '/authentication/loginWithNavbar', + }, + { + title: 'Login Advanced', + page: '/authentication/loginAdvanced', + }, + { + title: 'Register Simple', + page: '/authentication/registerSimple', + }, + { + title: 'Register With Bg', + page: '/authentication/registerWithBg', + }, + { + title: 'Register With Bg Image', + page: '/authentication/registerWithBgImage', + }, + { + title: 'Register With Navbar', + page: '/authentication/registerWithNavbar', + }, + { + title: 'Register Advanced', + page: '/authentication/registerAdvanced', + }, + { + title: 'Unlock User', + page: '/authentication/unlockUser', + }, + { + title: 'recover-password', + page: '/authentication/recoverPassword', + }, + ] + } + }, + { + title: 'Error', + icon: 'la-warning', + page: 'null', + submenu: { + items: [ + { + title: 'Error 400', + page: '/error/error400', + }, + { + title: 'Error 400 with Navbar', + page: '/error/error400WithNavbar', + }, + { + title: 'Error 401', + page: '/error/error401', + }, + { + title: 'Error 401 with Navbar', + page: '/error/error401WithNavbar', + }, + { + title: 'Error 403', + page: '/error/error403', + }, + { + title: 'Error 403 with Navbar', + page: '/error/error403WithNavbar', + }, + { + title: 'Error 404', + page: '/error/error404', + }, + { + title: 'Error 404 with Navbar', + page: '/error/error404WithNavbar', + }, + { + title: 'Error 500', + page: '/error/error500', + }, + { + title: 'Error 500 with Navbar', + page: '/error/error500WithNavbar', + }, + ] + } + }, + { + title: 'Others', + icon: 'la-file-text', + page: 'null', + submenu: { + items: [ + { + title: 'Coming Soon', + page: 'null', + submenu: { + items: [ + { + title: 'Flat', + page: '/others/flat' + }, + { + title: 'Bg image', + page: '/others/bgImage' + }, + // { + // title: 'Bg video', + // page: '/others/bgVideo' + // }, + ] + } + }, + { + title: 'Maintenance', + page: '/others/maintenance' + }, + ] + } + }, + { section: 'USER INTERFACE', icon: 'la-ellipsis-h' }, + { + title: 'Cards', + page: '/cards/bootstrap', + icon: 'la-tablet' + }, + { + title: 'Advance Cards', + icon: 'la-fire', + page: 'null', + submenu: { + items: [ + { + title: 'Statistics', + page: '/advanceCards/statistics' + }, + { + title: 'Social', + page: '/advanceCards/social' + }, + { + title: 'Charts', + page: '/advanceCards/charts' + }, + ] + } + }, + { + title: 'Components', + icon: 'la-server', + page: 'null', + submenu: { + items: [ + { + title: 'Alerts', + page: '/components/alerts' + }, + { + title: 'Callout', + page: '/components/callout' + }, + { + title: 'Buttons', + page: 'null', + submenu: { + items: [ + { + title: 'Basic Buttons', + page: '/components/basic-buttons' + }, + { + title: 'Extended Buttons', + page: '/components/extended-buttons' + } + ] + } + }, + { + title: 'Carousel', + page: '/components/carousel' + }, + { + title: 'Collapse', + page: '/components/collapse' + }, + { + title: 'Dropdowns', + page: '/components/dropdowns' + }, + { + title: 'List Group', + page: '/components/list-group' + }, + { + title: 'Modals', + page: '/components/modals' + }, + { + title: 'Pagination', + page: '/components/pagination' + }, + { + title: 'Navs Component', + page: '/components/navs' + }, + { + title: 'Pills Component', + page: '/components/pills' + }, + { + title: 'Tooltips', + page: '/components/tooltips' + }, + { + title: 'Popovers', + page: '/components/popovers' + }, + { + title: 'Badges', + page: '/components/badges' + }, + { + title: 'Pill Badges', + page: '/components/pill-badges' + }, + { + title: 'Progress', + page: '/components/progress' + }, + { + title: 'Media Objects', + page: '/components/mediaobjects' + }, + { + title: 'Scrollable', + page: '/components/scrollable' + }, + { + title: 'Spinners', + page: '/components/spinners' + }, + ] + } + }, + { + title: 'Extra Components', + icon: 'la-diamond', + page: 'null', + submenu: { + items: [ + { + title: 'Date Time Picker', + page: '/extraComponents/dateTimePicker' + }, + { + title: 'TypeAhead', + page: '/extraComponents/typeAhead' + }, + { + title: 'Text Editer', + page: '/extraComponents/text-editor' + } + ] + } + }, + { + title: 'Icons', - // icon: 'la-eye', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Feather', - // page: '/icons/feather' - // }, - // { - // title: 'Line Awesome', - // page: '/icons/line-awesome' - // }, - // { - // title: 'Meteocons', - // page: '/icons/meteocons' - // }, - // { - // title: 'Simple Line Icons', - // page: '/icons/simple-line-icons' - // } - // ] - // } - // }, - // { section: 'FORMS', icon: 'la-ellipsis-h' }, - // { - // title: 'Form Elements', + icon: 'la-eye', + page: 'null', + submenu: { + items: [ + { + title: 'Feather', + page: '/icons/feather' + }, + { + title: 'Line Awesome', + page: '/icons/line-awesome' + }, + { + title: 'Meteocons', + page: '/icons/meteocons' + }, + { + title: 'Simple Line Icons', + page: '/icons/simple-line-icons' + } + ] + } + }, + { section: 'FORMS', icon: 'la-ellipsis-h' }, + { + title: 'Form Elements', - // icon: 'la-terminal', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Form Inputs', - // page: '/form-elements/form-inputs' - // }, - // { - // title: 'Input Groups', - // page: '/form-elements/input-groups' - // }, - // { - // title: 'Input Grid', - // page: '/form-elements/input-grid' - // }, - // { - // title: 'Checkboxes & Radios', - // page: '/form-elements/checkboxes-radios' - // }, - // { - // title: 'Switch', - // page: '/form-elements/switch' - // }, - // { - // title: 'Select', - // page: '/form-elements/select' - // }, - // { - // title: 'Extended Inputs', - // page: '/form-elements/extendedinputs' - // }, - // ] - // } - // }, - // { - // title: 'Form Layouts', + icon: 'la-terminal', + page: 'null', + submenu: { + items: [ + { + title: 'Form Inputs', + page: '/form-elements/form-inputs' + }, + { + title: 'Input Groups', + page: '/form-elements/input-groups' + }, + { + title: 'Input Grid', + page: '/form-elements/input-grid' + }, + { + title: 'Checkboxes & Radios', + page: '/form-elements/checkboxes-radios' + }, + { + title: 'Switch', + page: '/form-elements/switch' + }, + { + title: 'Select', + page: '/form-elements/select' + }, + { + title: 'Extended Inputs', + page: '/form-elements/extendedinputs' + }, + ] + } + }, + { + title: 'Form Layouts', - // icon: 'la-file-text', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Basic Forms', - // page: '/form-layouts/basic-forms' - // }, - // { - // title: 'Horizontal Forms', - // page: '/form-layouts/horizontal-forms' - // }, - // { - // title: 'Hidden Labels', - // page: '/form-layouts/hidden-labels' - // }, - // { - // title: 'Form Actions', - // page: '/form-layouts/form-actions' - // }, - // { - // title: 'Row Separator', - // page: '/form-layouts/row-separator' - // }, - // { - // title: 'Bordered', - // page: '/form-layouts/bordered' - // }, - // { - // title: 'Striped Rows', - // page: '/form-layouts/striped-rows' - // }, - // { - // title: 'Striped Labels', - // page: '/form-layouts/striped-labels' - // }, - // ] - // } - // }, - // { - // title: 'Form Wizard', + icon: 'la-file-text', + page: 'null', + submenu: { + items: [ + { + title: 'Basic Forms', + page: '/form-layouts/basic-forms' + }, + { + title: 'Horizontal Forms', + page: '/form-layouts/horizontal-forms' + }, + { + title: 'Hidden Labels', + page: '/form-layouts/hidden-labels' + }, + { + title: 'Form Actions', + page: '/form-layouts/form-actions' + }, + { + title: 'Row Separator', + page: '/form-layouts/row-separator' + }, + { + title: 'Bordered', + page: '/form-layouts/bordered' + }, + { + title: 'Striped Rows', + page: '/form-layouts/striped-rows' + }, + { + title: 'Striped Labels', + page: '/form-layouts/striped-labels' + }, + ] + } + }, + { + title: 'Form Wizard', - // icon: 'la-paste', - // page: '/form-wizard', - // // submenu: { - // // items: [ - // // { - // // title: 'Circle Style', - // // page: '/form-wizard/circle-style' - // // }, - // // ] - // // } - // }, - // { - // title: 'Form Repeater', + icon: 'la-paste', + page: '/form-wizard', + // submenu: { + // items: [ + // { + // title: 'Circle Style', + // page: '/form-wizard/circle-style' + // }, + // ] + // } + }, + { + title: 'Form Repeater', - // icon: 'la-repeat', - // page: '/form-repeater' - // }, - // { section: 'TABLE', icon: 'la-ellipsis-h' }, - // { - // title: 'Boostrap Tables', + icon: 'la-repeat', + page: '/form-repeater' + }, + { section: 'TABLE', icon: 'la-ellipsis-h' }, + { + title: 'Boostrap Tables', - // icon: 'la-table', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Basic Table', - // page: '/boostraptables/basictable' - // }, - // { - // title: 'Table Border', - // page: '/boostraptables/tableborder' - // }, - // { - // title: 'Table Sizing', - // page: '/boostraptables/tablesizing' - // }, - // { - // title: 'Table Styling', - // page: '/boostraptables/tablestyling' - // }, - // { - // title: 'Table Components', - // page: '/boostraptables/tablecomponents' - // }, - // { - // title: 'Ngx BoostrapTables', - // page: '/boostraptables/ngxboostraptables' - // }, - // ] - // } - // }, - // { - // title: 'Data Tables', + icon: 'la-table', + page: 'null', + submenu: { + items: [ + { + title: 'Basic Table', + page: '/boostraptables/basictable' + }, + { + title: 'Table Border', + page: '/boostraptables/tableborder' + }, + { + title: 'Table Sizing', + page: '/boostraptables/tablesizing' + }, + { + title: 'Table Styling', + page: '/boostraptables/tablestyling' + }, + { + title: 'Table Components', + page: '/boostraptables/tablecomponents' + }, + { + title: 'Ngx BoostrapTables', + page: '/boostraptables/ngxboostraptables' + }, + ] + } + }, + { + title: 'Data Tables', - // icon: 'la-th', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Basic Installation', - // page: '/datatables/basicinitialisation' + icon: 'la-th', + page: 'null', + submenu: { + items: [ + { + title: 'Basic Installation', + page: '/datatables/basicinitialisation' - // }, - // { - // title: 'Styling', - // page: '/datatables/styling' - // }, - // { - // title: 'API', - // page: '/datatables/api' + }, + { + title: 'Styling', + page: '/datatables/styling' + }, + { + title: 'API', + page: '/datatables/api' - // }, - // ] - // } - // }, - // { - // title: 'DataTables Ext', + }, + ] + } + }, + { + title: 'DataTables Ext', - // icon: 'la-th-large', - // page: 'null', - // submenu: { - // items: [ - // { - // title: 'Buttons', - // page: '/datatablesext/buttons' + icon: 'la-th-large', + page: 'null', + submenu: { + items: [ + { + title: 'Buttons', + page: '/datatablesext/buttons' - // }, - // { - // title: 'HTML5 Data Export', - // page: '/datatablesext/html5dataexport' + }, + { + title: 'HTML5 Data Export', + page: '/datatablesext/html5dataexport' - // }, - // { - // title: 'Hidden On load', - // page: '/datatablesext/hiddentable' + }, + { + title: 'Hidden On load', + page: '/datatablesext/hiddentable' - // }, - // ] - // } - // }, - // { section: 'CHARTS', icon: 'la-ellipsis-h' }, - // { - // title: 'Chartjs', - // icon: 'la-bar-chart', - // page: '/chartjs/charts', - // }, - // { - // title: 'Chartist', - // icon: 'la-pie-chart', - // page: '/ngchartist/linecharts' - // }, + }, + ] + } + }, + { section: 'CHARTS', icon: 'la-ellipsis-h' }, + { + title: 'Chartjs', + icon: 'la-bar-chart', + page: '/chartjs/charts', + }, + { + title: 'Chartist', + icon: 'la-pie-chart', + page: '/ngchartist/linecharts' + }, // { // title: 'Starter Kit', // icon: 'la-puzzle-piece', diff --git a/src/app/content/hemat-app/device/device-control/device-control.component.css b/src/app/content/hemat-app/device/device-control/device-control.component.css index 31faad1..753feaa 100644 --- a/src/app/content/hemat-app/device/device-control/device-control.component.css +++ b/src/app/content/hemat-app/device/device-control/device-control.component.css @@ -1,44 +1,13 @@ -.bg-maintenance-image { - background-size: cover; - display: flex; - justify-content: center; - align-items: center; - } - - .centered-card { - display: flex; - justify-content: center; - align-items: center; - width: 100%; - height: 100%; - } - - .box-shadow-2 { - box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); - } - - .box-shadow-3 { - box-shadow: 0 3px 20px rgba(0, 0, 0, 0.2); - } - - .card { - background-color: rgba(255, 255, 255, 0.5); - border: 1px solid rgba(255, 255, 255, 0.3); - padding: 20px; - max-width: 400px; - width: 100%; - } - - .spinner { - animation: spin 1s linear infinite; - } - - @keyframes spin { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); - } - } - \ No newline at end of file +:host ::ng-deep .ng-select .ng-select-container { + color: #ffffff !important; + background-color: #252525 !important; + height: 40px !important; +} + +.background-round { + background-color: #252525 !important; + padding: 8px; + border-radius: 50%; + border: 2px solid #BEF264; + border-color: #BEF264 !important; +} \ No newline at end of file diff --git a/src/app/content/hemat-app/device/device-control/device-control.component.html b/src/app/content/hemat-app/device/device-control/device-control.component.html index fc54b59..d68bf90 100644 --- a/src/app/content/hemat-app/device/device-control/device-control.component.html +++ b/src/app/content/hemat-app/device/device-control/device-control.component.html @@ -1,30 +1,155 @@ -
+
+
+ +
-
-
-
-
- - logo - -
-
-

Coming Soon

-

- We're working hard to bring you this page.
- Please check back later. -

-
- +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+ + +
+
+
+
+ + +
+
+ +
+ +
+
+ +
+ +
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+ {{ item.name }} +
+ lamp +
+
+
+ +
+
+
-
diff --git a/src/app/content/hemat-app/device/device-control/device-control.component.ts b/src/app/content/hemat-app/device/device-control/device-control.component.ts index 2873629..322f62a 100644 --- a/src/app/content/hemat-app/device/device-control/device-control.component.ts +++ b/src/app/content/hemat-app/device/device-control/device-control.component.ts @@ -1,4 +1,7 @@ import { Component } from '@angular/core'; +import { Router } from '@angular/router'; +import { BuildingService } from '../../service/monitoring-api.service'; +import { DeviceService } from '../../service/device.service'; @Component({ selector: 'app-device-control', @@ -6,5 +9,84 @@ import { Component } from '@angular/core'; styleUrls: ['./device-control.component.css'] }) export class DeviceControlComponent { + data: any; + totalOn: any; + totalOff: any; + filteredRows: any[]; + searchTerm: string = ""; + rows: any = []; + public breadcrumb: any; + spinnerActive: boolean = false; + singlebasicSelected: any; + + singleSelectArray = [ + { item_id: 1, item_text: "Alaska" }, + { item_id: 2, item_text: "California" }, + { item_id: 3, item_text: "Colorado" }, + { item_id: 4, item_text: "New Mexico" }, + { item_id: 5, item_text: "Alabama" }, + { item_id: 6, item_text: "Connecticut" }, + { item_id: 7, item_text: "New York" }, + ]; + + + constructor( + private router: Router, + private deviceService: DeviceService + ) {} + + ngOnInit() { + this.breadcrumb = { + mainlabel: "Device", + links: [ + { + name: "Home", + isLink: false, + link: "/dashboard/sales", + }, + { + name: "Device", + isLink: false, + }, + ], + }; + this.fetchData(); + } + + fetchData() { + this.deviceService.getDeviceLIst().subscribe((res) => { + console.log(res); + + this.data = res; + this.filteredRows = this.data.data; + console.log(this.filteredRows); + }); + } + + filterRows() { + if (!this.searchTerm) { + this.filteredRows = [...this.data.results.data]; + } else { + this.filteredRows = this.data.results.data.filter((row) => + this.rowContainsSearchTerm(row) + ); + } + } + + rowContainsSearchTerm(row: any): boolean { + const searchTermLC = this.searchTerm.toLowerCase(); + return Object.values(row).some( + (value) => + value !== null && value.toString().toLowerCase().includes(searchTermLC) + ); + } + + addFieldValue() { + + } + + addDevice(): void { + + } } diff --git a/src/app/content/hemat-app/device/device.component.html b/src/app/content/hemat-app/device/device.component.html index 9319ca5..e347b34 100644 --- a/src/app/content/hemat-app/device/device.component.html +++ b/src/app/content/hemat-app/device/device.component.html @@ -42,7 +42,7 @@
- Total Device Aktive + Total Device Active

{{ totalOn }}

@@ -94,11 +94,12 @@
@@ -107,47 +108,57 @@
- -
-
-
-
- + +
+
+
+
+
- -
-
- +
+ +
+