diff --git a/src/main/webui/package-lock.json b/src/main/webui/package-lock.json index 3641fb3..416e9d4 100644 --- a/src/main/webui/package-lock.json +++ b/src/main/webui/package-lock.json @@ -16,6 +16,7 @@ "@angular/platform-browser": "^18.0.0", "@angular/platform-browser-dynamic": "^18.0.0", "@angular/router": "^18.0.0", + "primeng": "^17.18.1", "rxjs": "~7.8.0", "tslib": "^2.3.0", "zone.js": "~0.14.3" @@ -10085,6 +10086,21 @@ "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", "dev": true }, + "node_modules/primeng": { + "version": "17.18.1", + "resolved": "https://registry.npmjs.org/primeng/-/primeng-17.18.1.tgz", + "integrity": "sha512-pMuXOgLQw5Xz0w9d3YTp2DAlYR8svK1Jz5gSWAhk6AyH7u7akwL1JX96RXVzLS8v2YeLUCvkMM+QROOvR3yKug==", + "dependencies": { + "tslib": "^2.3.0" + }, + "peerDependencies": { + "@angular/common": "^17.0.0 || ^18.0.0", + "@angular/core": "^17.0.0 || ^18.0.0", + "@angular/forms": "^17.0.0 || ^18.0.0", + "rxjs": "^6.0.0 || ^7.8.1", + "zone.js": "~0.14.0" + } + }, "node_modules/proc-log": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/proc-log/-/proc-log-4.2.0.tgz", diff --git a/src/main/webui/package.json b/src/main/webui/package.json index fafc4fd..849e2ae 100644 --- a/src/main/webui/package.json +++ b/src/main/webui/package.json @@ -18,6 +18,7 @@ "@angular/platform-browser": "^18.0.0", "@angular/platform-browser-dynamic": "^18.0.0", "@angular/router": "^18.0.0", + "primeng": "^17.18.1", "rxjs": "~7.8.0", "tslib": "^2.3.0", "zone.js": "~0.14.3" diff --git a/src/main/webui/src/app/app.component.html b/src/main/webui/src/app/app.component.html index 36093e1..1d0dca4 100644 --- a/src/main/webui/src/app/app.component.html +++ b/src/main/webui/src/app/app.component.html @@ -1,336 +1,14 @@ - - - - - - - - - - - -
-
-
- -

Hello, {{ title }}

-

Congratulations! Your app is running. 🎉

-
- -
-
- @for (item of [ - { title: 'Explore the Docs', link: 'https://angular.dev' }, - { title: 'Learn with Tutorials', link: 'https://angular.dev/tutorials' }, - { title: 'CLI Docs', link: 'https://angular.dev/tools/cli' }, - { title: 'Angular Language Service', link: 'https://angular.dev/tools/language-service' }, - { title: 'Angular DevTools', link: 'https://angular.dev/tools/devtools' }, - ]; track item.title) { - - {{ item.title }} - - - - - } -
- -
-
-
- - - - - - - - - - - +

Sample object control panel

+

Create object types

+
+ + +
+

Create object

+
+ + + + diff --git a/src/main/webui/src/app/app.component.ts b/src/main/webui/src/app/app.component.ts index a5c6c94..d2ffa02 100644 --- a/src/main/webui/src/app/app.component.ts +++ b/src/main/webui/src/app/app.component.ts @@ -1,13 +1,34 @@ -import { Component } from '@angular/core'; +import {Component, OnInit} from '@angular/core'; import { RouterOutlet } from '@angular/router'; +import { ButtonModule } from 'primeng/button'; +import {PaginatorModule} from "primeng/paginator"; +import { InputTextModule } from 'primeng/inputtext'; +import { DropdownModule } from 'primeng/dropdown'; +import {SelectItem} from "primeng/api"; @Component({ selector: 'app-root', standalone: true, - imports: [RouterOutlet], + imports: [RouterOutlet, ButtonModule, PaginatorModule, InputTextModule, DropdownModule], templateUrl: './app.component.html', styleUrl: './app.component.css' }) -export class AppComponent { - title = 'webui'; +export class AppComponent implements OnInit { + selectedOption: SelectItem | undefined; + options:SelectItem[]; + + constructor() { + this.options = [ + { label: "GET", value: "GET" }, + { label: "POST", value: "POST" }, + { label: "PUT", value: "PUT" }, + { label: "DELETE", value: "DELETE" }, + { label: "HEAD", value: "HEAD" }, + { label: "CONNECT", value: "CONNECT" }, + { label: "OPTIONS", value: "OPTIONS" }, + { label: "TRACE", value: "TRACE" }, + { label: "PATCH", value: "PATCH" } + ]; + } + ngOnInit() {} } diff --git a/src/main/webui/src/styles.css b/src/main/webui/src/styles.css index 90d4ee0..5f2e635 100644 --- a/src/main/webui/src/styles.css +++ b/src/main/webui/src/styles.css @@ -1 +1,3 @@ /* You can add global styles to this file, and also import other style files */ +@import "primeng/resources/themes/aura-dark-blue/theme.css"; /* This line defines the global primeAngular theme*/ +@import "primeng/resources/primeng.css";