tom_trgr/mqtt_creator
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects Releases 2 Wiki Activity

CHANGE: focus on name input

Browse Source
This commit is contained in:
Tom Tröger
2024-07-31 13:06:52 +02:00
parent 897120028c
commit f98a3035e1
3 changed files with 56 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/entity-data/entity-data.component.html
View File

@@ -2,18 +2,18 @@
<form class="grid grid-cols-2 gap-4" (submit)="$event.preventDefault();generatorService.createEntity()" > <form class="grid grid-cols-2 gap-4" (submit)="$event.preventDefault();generatorService.createEntity()" >
<div class="property" *ngIf="hasProperty('name')"> <div class="property" *ngIf="hasProperty('name')">
<p>Name</p> <p>Name</p>
<input required placeholder="entity name" type="text" name="entity_name" [ngModel]="entity_name" (ngModelChange)="entity_name = $event"/> <input tabindex="0" #nameinput autocomplete="name" placeholder="entity name" type="text" name="entity_name" [ngModel]="entity_name" (ngModelChange)="entity_name = $event"/>
</div> </div>
<div class="property" *ngIf="hasProperty('uniq_id')"> <div class="property" *ngIf="hasProperty('uniq_id')">
<p>Uniqe ID</p> <p>Uniqe ID</p>
<div class="flex-row flex gap-2"> <div class="flex-row flex gap-2">
<input type="text" name="entity_uniq_id" [ngModel]="entity_uniq_id" (ngModelChange)="entity_uniq_id = $event"/> <input type="text" name="entity_uniq_id" [ngModel]="entity_uniq_id" (ngModelChange)="entity_uniq_id = $event"/>
<button class="randomButton" > <!-- <button tabindex="-1" class="randomButton" type="button">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-dice-3" viewBox="0 0 16 16"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-dice-3" viewBox="0 0 16 16">
<path d="M13 1a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2zM3 0a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V3a3 3 0 0 0-3-3z"/> <path d="M13 1a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2zM3 0a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V3a3 3 0 0 0-3-3z"/>
<path d="M5.5 4a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m8 8a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m-4-4a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0"/> <path d="M5.5 4a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m8 8a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m-4-4a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0"/>
</svg> </svg>
</button> </button> -->
</div> </div>
</div> </div>
<div class="property" *ngIf="hasProperty('cmd_t')"> <div class="property" *ngIf="hasProperty('cmd_t')">

14
src/app/entity-data/entity-data.component.ts
View File

@@ -1,6 +1,5 @@
import { Component, Input } from '@angular/core'; import { Component, Input, ViewChild } from '@angular/core';
import { DeviceClass, MQTTEntity } from '../_models/mqtt_base'; import { DeviceClass, MQTTEntity } from '../_models/mqtt_base';
import { EntityService } from '../_services/entity.service';
import { GeneratorService } from '../_services/generator.service'; import { GeneratorService } from '../_services/generator.service';
@Component({ @Component({
@@ -9,17 +8,18 @@ import { GeneratorService } from '../_services/generator.service';
styleUrl: './entity-data.component.css', styleUrl: './entity-data.component.css',
}) })
export class EntityDataComponent { export class EntityDataComponent {
@Input() entity_type: number = 0; @Input() entity_type: number = 1;
@Input() basemodel!: MQTTEntity; @Input() basemodel!: MQTTEntity;
@Input() created: boolean = false; @Input() created: boolean = false;
constructor( @ViewChild('nameinput') nameinput!: any;
private entityService: EntityService, constructor(public generatorService: GeneratorService) {
public generatorService: GeneratorService
) {
if (generatorService.selected_entity) { if (generatorService.selected_entity) {
this.basemodel = generatorService.selected_entity; this.basemodel = generatorService.selected_entity;
} }
} }
ngAfterViewInit() {
if (!this.created) this.nameinput.nativeElement.focus();
}
_entity_name: string = ''; _entity_name: string = '';
_entity_uniq_id: string = ''; _entity_uniq_id: string = '';

92
src/app/entity/entity.component.ts
View File

@@ -49,23 +49,23 @@ export class EntityComponent {
} }
update(model: keyof this = 'stat_t', event: Event | boolean = false): void { update(model: keyof this = 'stat_t', event: Event | boolean = false): void {
if (this.generatorService.auto_topic == 2) { // if (this.generatorService.auto_topic == 2) {
this.stat_t = this.updateTopic('stat'); // this.stat_t = this.updateTopic('stat');
this.entity_cmd_t = this.updateTopic('cmd'); // this.entity_cmd_t = this.updateTopic('cmd');
this.entity_bri_cmd_t = this.updateTopic('bri_cmd'); // this.entity_bri_cmd_t = this.updateTopic('bri_cmd');
return; // return;
} // }
if (event instanceof Event) // if (event instanceof Event)
var value = (event.target as HTMLInputElement).value; // var value = (event.target as HTMLInputElement).value;
else return; // else return;
if (this.generatorService.auto_topic == 1) { // if (this.generatorService.auto_topic == 1) {
this.sync_topcis(model, value); // this.sync_topcis(model, value);
} else { // } else {
if (!this.hasOwnProperty(model)) return; // if (!this.hasOwnProperty(model)) return;
if (typeof this[model] === 'string') { // if (typeof this[model] === 'string') {
this[model] = value as (typeof this)[keyof this]; // this[model] = value as (typeof this)[keyof this];
} // }
} // }
} }
sync_topcis(model: keyof this, value: string) { sync_topcis(model: keyof this, value: string) {
@@ -74,7 +74,7 @@ export class EntityComponent {
let missing = new_list.filter((item) => old_list.indexOf(item) < 0); let missing = new_list.filter((item) => old_list.indexOf(item) < 0);
if (old_list.filter((item) => new_list.indexOf(item) < 0).length > 1) if (old_list.filter((item) => new_list.indexOf(item) < 0).length > 1)
return (this.generatorService.auto_topic = 0); return (this.generatorService.auto_topic = false);
if (missing.length == 0) return; //(this.generatorService.auto_topic = 2); if (missing.length == 0) return; //(this.generatorService.auto_topic = 2);
if (new_list.indexOf(missing[0]) == new_list.length - 1) { if (new_list.indexOf(missing[0]) == new_list.length - 1) {
this[model] = value as (typeof this)[keyof this]; this[model] = value as (typeof this)[keyof this];
@@ -114,38 +114,38 @@ export class EntityComponent {
return topic_str; return topic_str;
} }
select_type(event: unknown) { select_type(event: unknown) {}
let ent_type = entity_types[event as keyof typeof entity_types]; // let ent_type = entity_types[event as keyof typeof entity_types];
let ent_class = ent_type[1]; // let ent_class = ent_type[1];
if (typeof ent_class === 'function' && event != 0) { // if (typeof ent_class === 'function' && event != 0) {
this.basemodel = new ent_class(); // this.basemodel = new ent_class();
this.generatorService.selected_entity = this.basemodel; // this.generatorService.selected_entity = this.basemodel;
if (this.generatorService.has_property('dev_cla')) { // // if (this.generatorService.has_property('dev_cla')) {
this.entity_dev_cla = this.basemodel.getProperty('dev_cla'); // // this.entity_dev_cla = this.basemodel.;
} // // }
} else this.generatorService.selected_entity = null; // } else this.generatorService.selected_entity = null;
this.entity_type = event as number; // this.entity_type = event as number;
this.update(); // this.update();
} // }
lock_auto_topic() { lock_auto_topic() {
this.generatorService.auto_topic = 1; // this.generatorService.auto_topic = 1;
} }
create_entity() { create_entity() {}
this.basemodel?.setProperty('stat_t', this.stat_t); // this.basemodel?.setProperty('stat_t', this.stat_t);
this.basemodel?.setProperty('name', this.entity_name); // this.basemodel?.setProperty('name', this.entity_name);
this.basemodel?.setProperty('cmd_t', this.entity_cmd_t); // this.basemodel?.setProperty('cmd_t', this.entity_cmd_t);
this.basemodel?.setProperty('bri_cmd_t', this.entity_bri_cmd_t); // this.basemodel?.setProperty('bri_cmd_t', this.entity_bri_cmd_t);
this.basemodel?.setProperty('pl_off', this.entity_pl_off); // this.basemodel?.setProperty('pl_off', this.entity_pl_off);
this.basemodel?.setProperty('pl_on', this.entity_pl_on); // this.basemodel?.setProperty('pl_on', this.entity_pl_on);
this.basemodel?.setProperty('unit_of_meas', this.entity_unit_of_meas); // this.basemodel?.setProperty('unit_of_meas', this.entity_unit_of_meas);
this.basemodel?.setProperty('val_tpl', this.entity_val_tpl); // this.basemodel?.setProperty('val_tpl', this.entity_val_tpl);
this.basemodel?.setProperty('dev_cla', this.entity_dev_cla); // this.basemodel?.setProperty('dev_cla', this.entity_dev_cla);
this._discoveryTopic = this.discoveryTopic; // this._discoveryTopic = this.discoveryTopic;
this.showDiscovery = true; // this.showDiscovery = true;
return; // return;
} // }
get discoveryString() { get discoveryString() {
return this.basemodel?.toJSON(); return this.basemodel?.toJSON();