From 79bc2d7eee49ae41f99db3295917370912ab1883 Mon Sep 17 00:00:00 2001 From: Michael Leisch Date: Tue, 1 Oct 2024 15:40:27 +0200 Subject: [PATCH] #117 device set overview --- .../boundary/DeviceSetResource.java | 26 ++++ .../dtos/deviceSet/DeviceSetCreateDTO.java | 8 + .../java/at/camconnect/model/DeviceSet.java | 70 ++++++++- .../repository/DeviceSetRepository.java | 19 +++ backend/src/main/resources/import.sql | 25 +++- frontend/web/src/AppState.ts | 27 +++- .../app/edit/deviceSetEdit.component.ts | 68 +++++++++ .../app/edit/deviceSetEditEntry.component.ts | 107 ++++++++++++++ .../src/components/app/edit/edit.component.ts | 13 +- .../app/edit/editDeviceSetModal.component.ts | 137 ++++++++++++++++++ .../navigation/sidebar.component.ts | 26 +++- frontend/web/src/index.ts | 6 +- frontend/web/src/model.ts | 9 +- frontend/web/src/service/deviceSet.service.ts | 53 +++++++ frontend/web/src/util/UrlHandler.ts | 13 +- .../app/edit/deviceTypeEditEntry.styles.scss | 8 + 16 files changed, 598 insertions(+), 17 deletions(-) create mode 100644 backend/src/main/java/at/camconnect/dtos/deviceSet/DeviceSetCreateDTO.java create mode 100644 backend/src/main/java/at/camconnect/repository/DeviceSetRepository.java create mode 100644 frontend/web/src/components/app/edit/deviceSetEdit.component.ts create mode 100644 frontend/web/src/components/app/edit/deviceSetEditEntry.component.ts create mode 100644 frontend/web/src/components/app/edit/editDeviceSetModal.component.ts create mode 100644 frontend/web/src/service/deviceSet.service.ts diff --git a/backend/src/main/java/at/camconnect/boundary/DeviceSetResource.java b/backend/src/main/java/at/camconnect/boundary/DeviceSetResource.java index 5b9da09e..e7945878 100644 --- a/backend/src/main/java/at/camconnect/boundary/DeviceSetResource.java +++ b/backend/src/main/java/at/camconnect/boundary/DeviceSetResource.java @@ -1,5 +1,31 @@ package at.camconnect.boundary; +import at.camconnect.model.Device; +import at.camconnect.repository.DeviceSetRepository; +import at.camconnect.responseSystem.CCException; +import at.camconnect.responseSystem.CCResponse; +import jakarta.inject.Inject; +import jakarta.ws.rs.GET; +import jakarta.ws.rs.Path; +import jakarta.ws.rs.core.Response; + +import java.util.List; + +@Path("deviceset") public class DeviceSetResource { //TODO this and the repo + + @Inject + DeviceSetRepository deviceSetRepository; + + @GET + @Path("/getall") + public Response getAll() { + List devices; + try{ + return CCResponse.ok(deviceSetRepository.getAll()); + }catch (CCException ex){ + return CCResponse.error(ex); + } + } } diff --git a/backend/src/main/java/at/camconnect/dtos/deviceSet/DeviceSetCreateDTO.java b/backend/src/main/java/at/camconnect/dtos/deviceSet/DeviceSetCreateDTO.java new file mode 100644 index 00000000..5766cf70 --- /dev/null +++ b/backend/src/main/java/at/camconnect/dtos/deviceSet/DeviceSetCreateDTO.java @@ -0,0 +1,8 @@ +package at.camconnect.dtos.deviceSet; + +import at.camconnect.enums.DeviceStatus; + +import java.util.List; + +public record DeviceSetCreateDTO (Long id, String name, String description, List deviceTypeIds, DeviceStatus status) { +} diff --git a/backend/src/main/java/at/camconnect/model/DeviceSet.java b/backend/src/main/java/at/camconnect/model/DeviceSet.java index e014a96f..c67e8e27 100644 --- a/backend/src/main/java/at/camconnect/model/DeviceSet.java +++ b/backend/src/main/java/at/camconnect/model/DeviceSet.java @@ -1,29 +1,53 @@ package at.camconnect.model; +import at.camconnect.enums.DeviceStatus; import jakarta.persistence.*; +import java.time.LocalDateTime; import java.util.List; @Entity public class DeviceSet { @Column(length = 20) private String name; + @Id @GeneratedValue(strategy = GenerationType.IDENTITY) @Column(length = 4) private Long id; - @OneToMany(fetch = FetchType.EAGER) + private String description; + + @ManyToMany(fetch = FetchType.EAGER) private List device_types; - public DeviceSet(String name) { + @Enumerated(EnumType.STRING) + private DeviceStatus status; + + private String image_blob; + + private LocalDateTime creation_date; + private LocalDateTime change_date; + + public DeviceSet(String name, String description, DeviceStatus status) { this.name = name; + this.description = description; + this.status = status; } public DeviceSet() { } //region Getter and Setter + + public String getDescription() { + return description; + } + + public void setDescription(String description) { + this.description = description; + } + public String getName() { return name; } @@ -47,5 +71,45 @@ public List getDevice_types() { public void addDevice_type(DeviceType device_type) { this.device_types.add(device_type); } + + public void removeDevice_type(DeviceType device_type) { + this.device_types.remove(device_type); + } + + public void setDevice_types(List device_types) { + this.device_types = device_types; + } + + public DeviceStatus getStatus() { + return status; + } + + public void setStatus(DeviceStatus status) { + this.status = status; + } + + public String getImage_blob() { + return image_blob; + } + + public void setImage_blob(String image_blob) { + this.image_blob = image_blob; + } + + public LocalDateTime getCreation_date() { + return creation_date; + } + + public void setCreation_date(LocalDateTime creation_date) { + this.creation_date = creation_date; + } + + public LocalDateTime getChange_date() { + return change_date; + } + + public void setChange_date(LocalDateTime change_date) { + this.change_date = change_date; + } //endregion -} +} \ No newline at end of file diff --git a/backend/src/main/java/at/camconnect/repository/DeviceSetRepository.java b/backend/src/main/java/at/camconnect/repository/DeviceSetRepository.java new file mode 100644 index 00000000..797f1284 --- /dev/null +++ b/backend/src/main/java/at/camconnect/repository/DeviceSetRepository.java @@ -0,0 +1,19 @@ +package at.camconnect.repository; + +import at.camconnect.model.DeviceSet; +import at.camconnect.model.DeviceType; +import jakarta.enterprise.context.ApplicationScoped; +import jakarta.inject.Inject; +import jakarta.persistence.EntityManager; + +import java.util.List; + +@ApplicationScoped +public class DeviceSetRepository { + @Inject + EntityManager em; + + public List getAll(){ + return em.createQuery("SELECT d FROM DeviceSet d order by d.id", DeviceSet.class).getResultList(); + } +} diff --git a/backend/src/main/resources/import.sql b/backend/src/main/resources/import.sql index 00159b34..6940c415 100644 --- a/backend/src/main/resources/import.sql +++ b/backend/src/main/resources/import.sql @@ -117,7 +117,30 @@ VALUES ('DJI Phantom 4', 'url4', 'drone', 'DroneType', 5, 28, true, 'active'), ('Yuneec Typhoon H Pro', 'url5', 'drone', 'DroneType', 1, 25, false, 'active'); --- assigning tags to devicetypes +-- Device Set +INSERT INTO deviceset (name, description, status) +VALUES + ('Foto Set', 'Ein Set für Fotografen', 'ACTIVE'), + ('Video Set', 'Ein Set für Videografen', 'ACTIVE'), + ('Audio Set', 'Ein Set für Tontechniker', 'ACTIVE'), + ('Light Set', 'Ein Set für Beleuchter', 'ACTIVE'), + ('Simple Set', 'Ein Set für einfache Geräte', 'ACTIVE'), + ('Stabilizer Set', 'Ein Set für Stabilizer', 'ACTIVE'), + ('Tripod Set', 'Ein Set für Stative', 'ACTIVE'), + ('Drone Set', 'Ein Set für Drohnen', 'ACTIVE'); + +-- Assigning devices to device sets +INSERT INTO deviceset_devicetype (deviceset_id, device_types_type_id) +VALUES + (1, 1), -- Foto Set with Canon EOS 5D Mark IV + (1, 2), -- Foto Set with Nikon D850 + (1, 3), -- Foto Set with Sony Alpha a7 III + (1, 4), -- Foto Set with Fujifilm X-T3 + (1, 5), -- Foto Set with Olympus OM-D E-M10 Mark III + (2, 1), -- Video Set with Canon EOS 5D Mark IV + (2, 2), -- Video Set with Nikon D850 + (3, 3); -- Audio Set with Sony Alpha a7 III + -- assigning tags to devicetypes INSERT INTO tag_devicetype (tag_tag_id, types_type_id) VALUES diff --git a/frontend/web/src/AppState.ts b/frontend/web/src/AppState.ts index 1ae439f9..bd71e249 100644 --- a/frontend/web/src/AppState.ts +++ b/frontend/web/src/AppState.ts @@ -15,6 +15,8 @@ import {KeyBoardShortCut} from "./util/KeyboardShortcut" import {DeviceTypeEditEntryComponent} from "./components/app/edit/deviceTypeEditEntry.component" import {DeviceEditEntryComponent} from "./components/app/edit/deviceEditEntry" import {SidebarComponent} from "./components/navigation/sidebar.component" +import {EditType} from "./components/app/edit/edit.component" +import {DeviceSetEditEntryComponent} from "./components/app/edit/deviceSetEditEntry.component" interface ActionCancellation { identifier: string, @@ -59,13 +61,14 @@ export interface DeviceFilters { export class AppState{ private _page: PageEnum = PageEnum.RENTS private _editPage: EditPageEnum = EditPageEnum.OVERVIEW; - private _editPageType: DeviceTypeVariantEnum = DeviceTypeVariantEnum.camera; + private _editPageType: EditType = DeviceTypeVariantEnum.camera; private _createRentModalOpen: boolean = false private _createMultiRentModalOpen: boolean = false private _selectedRentEntries: Set = new Set() private _selectedDeviceEntries: Set = new Set() private _selectedDeviceTypeEditEntries: Set = new Set() private _selectedDeviceEditEntries: Set = new Set() + private _selectedDeviceSetEditEntries: Set = new Set() private _cancelCurrentAction: ActionCancellation[] = [] private _createRentElement: CreateRentComponent private _appElement: HTMLElement @@ -125,11 +128,11 @@ export class AppState{ this.update() } - get editPageType(): DeviceTypeVariantEnum { + get editPageType(): EditType { return this._editPageType } - set editPageType(value: DeviceTypeVariantEnum) { + set editPageType(value: EditType) { this._editPageType = value this.update() } @@ -235,6 +238,10 @@ export class AppState{ return this._selectedDeviceEditEntries } + get selectedDeviceSetEditEntries(): Set { + return this._selectedDeviceSetEditEntries + } + addSelectedRentEntry(rentEntry: RentListEntryComponent){ this.selectedRentEntries.add(rentEntry) this.update() @@ -284,6 +291,20 @@ export class AppState{ this.update() } + toggleSelectedDeviceSetEditEntry(deviceSetEditEntry: DeviceSetEditEntryComponent){ + if(this.selectedDeviceSetEditEntries.has(deviceSetEditEntry)){ + this.selectedDeviceSetEditEntries.delete(deviceSetEditEntry) + }else{ + this.selectedDeviceSetEditEntries.add(deviceSetEditEntry) + } + this.update() + } + + clearSelectedDeviceSetEditEntries(){ + this.selectedDeviceSetEditEntries.clear() + this.update() + } + get cancelCurrentAction(): () => void { if(this._cancelCurrentAction.length <= 0) return () => {} if(typeof this._cancelCurrentAction.at(-1).action != "function") return () => {} diff --git a/frontend/web/src/components/app/edit/deviceSetEdit.component.ts b/frontend/web/src/components/app/edit/deviceSetEdit.component.ts new file mode 100644 index 00000000..600e41a7 --- /dev/null +++ b/frontend/web/src/components/app/edit/deviceSetEdit.component.ts @@ -0,0 +1,68 @@ +import {html, LitElement, PropertyValues} from 'lit' +import {customElement, property} from 'lit/decorators.js' +import styles from '../../../../styles/components/app/edit/deviceTypeEdit.styles.scss' +import { + DeviceTypeFullDTO, DeviceTypeVariantEnum, +} from "../../../service/deviceType.service" +import {EditPageEnum, ObservedProperty} from "../../../model" +import UrlHandler from "../../../util/UrlHandler" +import {model} from "../../../index" +import {AppState} from "../../../AppState" +import {InputType} from "../../basic/input.component" +import {ColorEnum, SizeEnum} from "../../../base" +import TagService, {Tag} from "../../../service/tag.service" +import {ChipType} from "../../basic/chip.component" +import {DeviceSetCreateDTO, DeviceSet} from "../../../service/deviceSet.service" + +@customElement('cc-device-set-edit') +export class DeviceSetEditComponent extends LitElement { + @property() private deviceSets: ObservedProperty + + @property() private appState: ObservedProperty + + constructor() { + super() + this.deviceSets = new ObservedProperty(this, model.deviceSets) + this.appState = new ObservedProperty(this, model.appState) + + console.log(this.deviceSets.value) + } + + render() { + return html` + + +
+ + +
+
+

+ Geräte-Sets +

+
+ + ${Object.values(this.deviceSets.value)?.flat().map(deviceSet => { + return html``, () => {})}}"> + }}">` + })} +
+
+ ` + } +} + +declare global { + interface HTMLElementTagNameMap { + "cc-device-set-edit": DeviceSetEditComponent + } +} \ No newline at end of file diff --git a/frontend/web/src/components/app/edit/deviceSetEditEntry.component.ts b/frontend/web/src/components/app/edit/deviceSetEditEntry.component.ts new file mode 100644 index 00000000..e198b733 --- /dev/null +++ b/frontend/web/src/components/app/edit/deviceSetEditEntry.component.ts @@ -0,0 +1,107 @@ +import {html, LitElement, PropertyValues} from 'lit' +import {customElement, property} from 'lit/decorators.js' +import styles from '../../../../styles/components/app/edit/deviceTypeEditEntry.styles.scss' +import {ColorEnum, Orientation, SizeEnum} from "../../../base" +import {unsafeSVG} from "lit/directives/unsafe-svg.js" +import {icon} from "@fortawesome/fontawesome-svg-core" +import {faPen, faTrash} from "@fortawesome/free-solid-svg-icons" +import {EditPageEnum, ObservedProperty} from "../../../model" +import {AppState} from "../../../AppState" +import {model} from "../../../index" +import PopupEngine from "../../../util/PopupEngine" +import DeviceSetService, {DeviceSet} from "../../../service/deviceSet.service" + +@customElement('cc-device-set-edit-entry') +export class DeviceSetEditEntryComponent extends LitElement { + @property() deviceSet: DeviceSet + + @property() private appState: ObservedProperty + + constructor(){ + super() + this.appState = new ObservedProperty(this, model.appState) + } + + render() { + return html` + + +

${this.deviceSet.name}

+ + + +
+ +
+ +
+ ${ + this.deviceSet.device_types?.map((deviceType, index) => { + return html`${deviceType.name} ${this.deviceSet.device_types.length - 1 <= index ? '' : ','}` + }) + } +
+ +
+ `, () => {}) + event.stopPropagation() + }}"> +
+ ${unsafeSVG(icon(faPen).html[0])} +
+

Bearbeiten

+ + + +
+ ${unsafeSVG(icon(faTrash).html[0])} +
+

Löschen

+ +
+ + + + ` + } + + getPropertyValue(property: string, value: any){ + return html`${value ? html`` : ''}` + } + + private removeDevice(device: DeviceSet) { + PopupEngine.createModal({ + text: `Möchten Sie das Geräte-Set ${device.name} wirklich löschen?`, + buttons: [ + { + text: "Ja", + action: (data) => { + DeviceSetService.remove(device) + this.appState.value.clearSelectedDeviceTypeEditEntries() + this.appState.value.clearSelectedDeviceEditEntries() + this.appState.value.clearSelectedDeviceSetEditEntries() + }, + closePopup: true + }, + { + text: "Nein", + }, + ] + }) + } +} + +declare global { + interface HTMLElementTagNameMap { + "cc-device-set-edit-entry": DeviceSetEditEntryComponent + } +} \ No newline at end of file diff --git a/frontend/web/src/components/app/edit/edit.component.ts b/frontend/web/src/components/app/edit/edit.component.ts index 32694a01..a6a95daf 100644 --- a/frontend/web/src/components/app/edit/edit.component.ts +++ b/frontend/web/src/components/app/edit/edit.component.ts @@ -1,4 +1,4 @@ -import {html, LitElement, PropertyValues, render} from 'lit'; +import {html, LitElement, PropertyValues} from 'lit'; import {customElement, property} from 'lit/decorators.js'; import PopupEngine from "../../../util/PopupEngine"; import {EditPageEnum, ObservedProperty} from "../../../model" @@ -9,7 +9,9 @@ import UrlHandler from "../../../util/UrlHandler" import {AppState} from "../../../AppState" import {Api} from "../../../util/Api" import {Device} from "../../../service/device.service" -import TagService, {Tag} from "../../../service/tag.service" +import {Tag} from "../../../service/tag.service" + +export type EditType = DeviceTypeVariantEnum | "set" @customElement('cc-edit') export class EditComponent extends LitElement { @@ -17,7 +19,7 @@ export class EditComponent extends LitElement { @property() private appState: ObservedProperty - currentEditType : DeviceTypeVariantEnum = DeviceTypeVariantEnum.camera + currentEditType : EditType = DeviceTypeVariantEnum.camera isSelectAlreadyUsed : boolean = false @@ -45,10 +47,15 @@ export class EditComponent extends LitElement { } getComponent(){ + console.log(model.appState.value.editPage) if(model.appState.value.editPage == EditPageEnum.OVERVIEW){ return html`` } + if(model.appState.value.editPage == EditPageEnum.DEVICESET){ + return html`` + } + if(model.appState.value.editPage == EditPageEnum.CHILDREN){ return html`${this.deviceTypesFull.value.map(elem => { if(elem.deviceType.type_id == parseInt(UrlHandler.getParam("gid"))){ diff --git a/frontend/web/src/components/app/edit/editDeviceSetModal.component.ts b/frontend/web/src/components/app/edit/editDeviceSetModal.component.ts new file mode 100644 index 00000000..e2c4b745 --- /dev/null +++ b/frontend/web/src/components/app/edit/editDeviceSetModal.component.ts @@ -0,0 +1,137 @@ +import {html, LitElement, PropertyValues} from 'lit'; +import {customElement, property} from 'lit/decorators.js'; +import {EditPageEnum, ObservedProperty} from "../../../model"; +import DeviceTypeService, { + AudioType, + CameraType, + DeviceType, + DeviceTypeFullDTO, + DeviceTypeVariantEnum, + DroneType, + LensType, + LightType, + MicrophoneType, + SimpleType, + StabilizerType, + TripodType +} from "../../../service/deviceType.service"; +import {model} from "../../../index"; +import styles from '../../../../styles/components/app/edit/editModal.styles.scss'; +import {AppState} from "../../../AppState"; +import TagService, {Tag} from "../../../service/tag.service"; +import {InputType} from "../../basic/input.component"; +import {ColorEnum, SizeEnum} from "../../../base"; +import {ChipType} from "../../basic/chip.component"; +import DeviceService, {Device, DeviceStatus} from "../../../service/device.service"; +import {unsafeSVG} from "lit/directives/unsafe-svg.js"; +import {icon} from "@fortawesome/fontawesome-svg-core"; +import {faTag} from "@fortawesome/free-solid-svg-icons"; +import PopupEngine from "../../../util/PopupEngine" +import UrlHandler from "../../../util/UrlHandler" +import DeviceSetService, {DeviceSetCreateDTO, DeviceSet} from "../../../service/deviceSet.service" + +@customElement('cc-edit-device-set-modal') +export class EditDeviceSetModalComponent extends LitElement { + @property() private element: DeviceSetCreateDTO | null; + @property() private appState: ObservedProperty; + @property() private isEditMode: boolean = true; + + @property() private deviceType: DeviceTypeFullDTO + + startElement: DeviceSetCreateDTO | null = null; + tags: Tag[] = []; + + constructor() { + super(); + this.appState = new ObservedProperty(this, model.appState); + } + + connectedCallback() { + super.connectedCallback(); + + if (!this.isEditMode) { + this.element = { + id: -1, + name: "", + description: "", + deviceTypeIds: [], + status: DeviceStatus.ACTIVE + } as DeviceSetCreateDTO; + + this.startElement = this.element; + } + } + + protected firstUpdated(_changedProperties: PropertyValues) { + super.firstUpdated(_changedProperties); + } + + render() { + return html` + + ${this.getModalContent()} +
+ Schließen + + ${!this.isEditMode ? html` + Erstellen + ` : ``} +
+ `; + } + + createElement(element: DeviceSetCreateDTO) { + DeviceSetService.create(element) + .then(() => { + model.appState.value.closeOverlay(); + }) + .catch(error => { + PopupEngine.createNotification({ + text: "Something went wrong while creating the device set: " + error, + CSSClass: "bad" + }) + }); + } + + private updateDeviceSet(element: DeviceSetCreateDTO) { + this.requestUpdate() + if (this.isEditMode){ + DeviceSetService.update(element); + } + } + + getModalContent() { + return html` +

Gerät-Set Erstellen

+
+ + +
+
+ +
+ Gerät ist aktiv + + `; + } +} + +declare global { + interface HTMLElementTagNameMap { + "cc-edit-device-set-modal": EditDeviceSetModalComponent; + } +} \ No newline at end of file diff --git a/frontend/web/src/components/navigation/sidebar.component.ts b/frontend/web/src/components/navigation/sidebar.component.ts index e3b17fa1..b6a38a67 100644 --- a/frontend/web/src/components/navigation/sidebar.component.ts +++ b/frontend/web/src/components/navigation/sidebar.component.ts @@ -1,9 +1,8 @@ -import {LitElement, css, html} from 'lit' +import {html, LitElement} from 'lit' import {customElement, property, queryAssignedElements} from 'lit/decorators.js' import styles from '../../../styles/components/navigation/sidebar.styles.scss' -import { ButtonComponent, ButtonType} from '../basic/button.component' +import {ButtonType} from '../basic/button.component' import {FilterContainerComponent} from "../basic/filterContainer.component" -import {filter} from "rxjs" import {Orientation, SimpleColorEnum, SizeEnum} from "../../base" import {model} from "../../index" import {EditPageEnum, ObservedProperty} from "../../model" @@ -114,7 +113,9 @@ export class SidebarComponent extends LitElement { this.appState.value.clearSelectedDeviceEditEntries() this.appState.value.clearSelectedDeviceTypeEditEntries() + this.appState.value.clearSelectedDeviceSetEditEntries() this.appState.value.editPageType = value.id as DeviceTypeVariantEnum + model.appState.value.editPage = EditPageEnum.OVERVIEW }}">

${value.name} @@ -122,6 +123,25 @@ export class SidebarComponent extends LitElement { ` }) } + +

+
+

Geräte-Set

+
({audioTypes: [], microphoneTypes: [], cameraTypes: [], droneTypes: [], lensTypes: [], lightTypes: [], stabilizerTypes: [], tripodHeads: []}) readonly deviceTypesFull = new BehaviorSubject([]) readonly deviceTypeAttributes = new BehaviorSubject({cameraResolutions: [], cameraSystems: [], lensMounts: [], tripodHeads: [], audioConnectors: []}) + readonly deviceSets = new BehaviorSubject([]) /** * This is a representation of all the deviceTypeAttributes split up and transformed into FilterOptions that can be @@ -96,6 +98,7 @@ export default class Model{ console.log("querying data") RentService.fetchAll() DeviceService.fetchAll() + DeviceSetService.fetchAll() DeviceTypeService.fetchAll() DeviceTypeService.fetchAllFull() DeviceTypeAttributeService.fetchAll() @@ -133,6 +136,10 @@ export default class Model{ this.deviceTypeAttributes.next(deviceTypeAttributes) } + loadDeviceSets(deviceSets: DeviceSet[]){ + this.deviceSets.next(deviceSets) + } + //endregion //region update functions diff --git a/frontend/web/src/service/deviceSet.service.ts b/frontend/web/src/service/deviceSet.service.ts new file mode 100644 index 00000000..67c88bc3 --- /dev/null +++ b/frontend/web/src/service/deviceSet.service.ts @@ -0,0 +1,53 @@ +import {DeviceStatus} from "./device.service" +import {Api} from "../util/Api" +import {model} from "../index" +import {DeviceType} from "./deviceType.service" + +export interface DeviceSetCreateDTO{ + id: number, + name: string, + description: string, + deviceTypeIds: number[], + status: DeviceStatus +} + +export interface DeviceSet { + id: number, + name: string, + description: string, + device_types: DeviceType[], + status: DeviceStatus +} + +export default class DeviceSetService{ + static fetchAll(){ + Api.fetchData("/deviceset/getall") + .then(result => { + model.loadDeviceSets(result.data) + }) + .catch(error => { + console.error(error) + }) + } + + static remove(device: DeviceSet) { + + } + + static create(element: DeviceSetCreateDTO) { + return Api.postData("/deviceset/create", element) + .then(result => { + if (result.ccStatus.statusCode == 1000) { + DeviceSetService.fetchAll(); + } + }) + .catch(error => { + console.error(error); + return Promise.reject(error); + }); + } + + static update(element: DeviceSetCreateDTO) { + + } +} \ No newline at end of file diff --git a/frontend/web/src/util/UrlHandler.ts b/frontend/web/src/util/UrlHandler.ts index 69f8ed2e..e96d3f55 100644 --- a/frontend/web/src/util/UrlHandler.ts +++ b/frontend/web/src/util/UrlHandler.ts @@ -1,6 +1,6 @@ import {model} from "../index" import {EditPageEnum, PageEnum} from "../model" -import {html, render} from "lit" +import {html} from "lit" import {DeviceTypeVariantEnum} from "../service/deviceType.service" let pages = { @@ -34,7 +34,13 @@ let pages = { handler: () => { UrlHandler.changeOrigin("cc-edit") model.appState.value.editPage = EditPageEnum.OVERVIEW - model.appState.value.editPageType = UrlHandler.getParam("type") as DeviceTypeVariantEnum/* || DeviceTypeVariantEnum.camera*/ + + if(UrlHandler.getParam("type") == "set"){ + model.appState.value.editPage = EditPageEnum.DEVICESET + model.appState.value.editPageType = "set" + } else{ + model.appState.value.editPageType = UrlHandler.getParam("type") as DeviceTypeVariantEnum/* || DeviceTypeVariantEnum.camera*/ + } }, children: { children: { @@ -45,6 +51,9 @@ let pages = { }, devicetype: { handler: () => { model.appState.value.editPage = EditPageEnum.DEVICETYPE } + }, + set: { + handler: () => { model.appState.value.editPage = EditPageEnum.DEVICESET } } } } diff --git a/frontend/web/styles/components/app/edit/deviceTypeEditEntry.styles.scss b/frontend/web/styles/components/app/edit/deviceTypeEditEntry.styles.scss index fc0856b4..7abc7d67 100644 --- a/frontend/web/styles/components/app/edit/deviceTypeEditEntry.styles.scss +++ b/frontend/web/styles/components/app/edit/deviceTypeEditEntry.styles.scss @@ -68,4 +68,12 @@ div{ cc-circle-select{ margin-left: auto; z-index: 10; +} + +.deviceSetInfo{ + gap: .5rem; + + span{ + color: $gray800; + } } \ No newline at end of file