feat(editor/substation): read-only editor for SubEquipment element (o…

…penscd#1030) * Added sub-equipment to Sub-Station editor Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> * Fixed review comments Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> * Fixed formatting Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> * Added new tests for parents of the SubEquipmentEditor Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> * Added new tests for children of the SubEquipmentEditor Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> * Fixed formatting Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> * reverted test files Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> Signed-off-by: Pascal Wilbrink <pascal.wilbrink@alliander.com> Co-authored-by: Dennis Labordus <dennis.labordus@alliander.com>
sprinteins · Oct 21, 2022 · f6e96b5 · f6e96b5
1 parent 81da900
commit f6e96b5
Show file tree

Hide file tree

Showing 14 changed files with 761 additions and 13 deletions.
diff --git a/src/editors/substation/conducting-equipment-editor.ts b/src/editors/substation/conducting-equipment-editor.ts
@@ -32,6 +32,8 @@ import {
 import { BayEditor } from './bay-editor.js';
 import { emptyWizard, wizards } from '../../wizards/wizard-library.js';
 
+import './sub-equipment-editor.js';
+
 function childTags(element: Element | null | undefined): SCLTag[] {
   if (!element) return [];
 
@@ -54,7 +56,7 @@ export class ConductingEquipmentEditor extends LitElement {
   get name(): string {
     return this.element.getAttribute('name') ?? '';
   }
-  /** Whether `EqFunction` and `SubEqFunction` are rendered */
+  /** Whether `EqFunction`, `SubEqFunction` and `SubEquipment` are rendered */
   @property({ type: Boolean })
   showfunctions = false;
 
@@ -219,10 +221,32 @@ export class ConductingEquipmentEditor extends LitElement {
       ></mwc-fab>`;
   }
 
+  private renderSubEquipments(): TemplateResult {
+    if (!this.showfunctions) return html``;
+
+    const subEquipments = getChildElementsByTagName(
+      this.element,
+      'SubEquipment'
+    );
+
+    return subEquipments.length
+      ? html`<div class="container subequipment">
+          ${subEquipments.map(
+            subEquipment =>
+              html`<sub-equipment-editor
+                .doc=${this.doc}
+                .element=${subEquipment}
+              ></sub-equipment-editor>`
+          )}
+        </div>`
+      : html``;
+  }
+
   render(): TemplateResult {
     if (this.showfunctions)
       return html`<action-pane label="${this.name}"
-        >${this.renderContentPane()}${this.renderLNodes()}${this.renderEqFunctions()}</action-pane
+        >${this.renderContentPane()}${this.renderLNodes()}${this.renderEqFunctions()}${this.renderSubEquipments()}</action-pane
+        ></action-pane
       >`;
 
     return html`<action-icon label="${this.name}"

diff --git a/src/editors/substation/foundation.ts b/src/editors/substation/foundation.ts
@@ -305,6 +305,14 @@ export const styles = css`
     grid-template-columns: repeat(auto-fit, minmax(64px, auto));
   }
 
+  .container.subequipment {
+    display: grid;
+    grid-gap: 12px;
+    padding: 8px 12px 16px;
+    box-sizing: border-box;
+    grid-template-columns: repeat(auto-fit, minmax(64px, auto));
+  }
+
   powertransformer-editor[showfunctions] {
     margin: 4px 8px 16px;
   }

diff --git a/src/editors/substation/powertransformer-editor.ts b/src/editors/substation/powertransformer-editor.ts
@@ -33,6 +33,8 @@ import { SubstationEditor } from './substation-editor.js';
 import { BayEditor } from './bay-editor.js';
 import { VoltageLevelEditor } from './voltage-level-editor.js';
 
+import './sub-equipment-editor.js';
+
 function childTags(element: Element | null | undefined): SCLTag[] {
   if (!element) return [];
 
@@ -56,7 +58,7 @@ export class PowerTransformerEditor extends LitElement {
   get name(): string {
     return this.element.getAttribute('name') ?? 'UNDEFINED';
   }
-  /** Whether `EqFunction` and `SubEqFunction` are rendered */
+  /** Whether `EqFunction`, `SubEqFunction` and `SubEquipment` are rendered */
   @property({ type: Boolean })
   showfunctions = false;
 
@@ -197,6 +199,26 @@ export class PowerTransformerEditor extends LitElement {
       </abbr>`;
   }
 
+  private renderSubEquipments(): TemplateResult {
+    if (!this.showfunctions) return html``;
+    const subEquipments = getChildElementsByTagName(
+      this.element,
+      'SubEquipment'
+    );
+
+    return subEquipments.length
+      ? html`<div class="container subequipment">
+          ${subEquipments.map(
+            subEquipment =>
+              html`<sub-equipment-editor
+                .doc=${this.doc}
+                .element=${subEquipment}
+              ></sub-equipment-editor>`
+          )}
+        </div>`
+      : html``;
+  }
+
   renderContentIcon(): TemplateResult {
     return html`<mwc-icon slot="icon"
         >${powerTransformerTwoWindingIcon}</mwc-icon
@@ -237,7 +259,7 @@ export class PowerTransformerEditor extends LitElement {
   render(): TemplateResult {
     if (this.showfunctions)
       return html`<action-pane label="${this.name}"
-        >${this.renderContentPane()}${this.renderLNodes()}${this.renderEqFunctions()}</action-pane
+        >${this.renderContentPane()}${this.renderLNodes()}${this.renderEqFunctions()}${this.renderSubEquipments()}</action-pane
       > `;
 
     return html`<action-icon label="${this.name}"

diff --git a/src/editors/substation/sub-equipment-editor.ts b/src/editors/substation/sub-equipment-editor.ts
@@ -0,0 +1,102 @@
+import {
+  css,
+  customElement,
+  html,
+  LitElement,
+  property,
+  TemplateResult,
+} from 'lit-element';
+
+import '@material/mwc-fab';
+import '@material/mwc-icon';
+import '@material/mwc-icon-button';
+import '@material/mwc-menu';
+
+import '../../action-icon.js';
+import '../../action-pane.js';
+
+import { styles } from './foundation.js';
+import { getChildElementsByTagName } from '../../foundation.js';
+
+/** [[`SubstationEditor`]] subeditor for a child-less `SubEquipment` element. */
+@customElement('sub-equipment-editor')
+export class SubEquipmentEditor extends LitElement {
+  /** The document being edited as provided to editor by [[`Zeroline`]]. */
+  @property({ attribute: false })
+  doc!: XMLDocument;
+  /** SCL element SubEquipment */
+  @property({ attribute: false })
+  element!: Element;
+
+  /** SubEquipment name attribute */
+  @property({ type: String })
+  get label(): string {
+    const name = `${
+      this.element.hasAttribute('name')
+        ? `${this.element.getAttribute('name')}`
+        : ''
+    }`;
+
+    const description = `${
+      this.element.hasAttribute('desc')
+        ? ` - ${this.element.getAttribute('desc')}`
+        : ''
+    }`;
+
+    const phase = `${
+      this.element.hasAttribute('phase')
+        ? ` (${this.element.getAttribute('phase')})`
+        : ''
+    }`;
+
+    return `${name}${description}${phase}`;
+  }
+
+  private renderLNodes(): TemplateResult {
+    const lNodes = getChildElementsByTagName(this.element, 'LNode');
+
+    return lNodes.length
+      ? html`<div class="container lnode">
+          ${lNodes.map(
+            lNode =>
+              html`<l-node-editor
+                .doc=${this.doc}
+                .element=${lNode}
+              ></l-node-editor>`
+          )}
+        </div>`
+      : html``;
+  }
+
+  private renderEqFunctions(): TemplateResult {
+    const eqFunctions = getChildElementsByTagName(this.element, 'EqFunction');
+    return eqFunctions.length
+      ? html` ${eqFunctions.map(
+          eqFunction =>
+            html`<eq-function-editor
+              .doc=${this.doc}
+              .element=${eqFunction}
+            ></eq-function-editor>`
+        )}`
+      : html``;
+  }
+
+  render(): TemplateResult {
+    return html`<action-pane label="${this.label}">
+      ${this.renderLNodes()} ${this.renderEqFunctions()}
+    </action-pane> `;
+  }
+
+  static styles = css`
+    ${styles}
+
+    :host(.moving) {
+      opacity: 0.3;
+    }
+
+    abbr {
+      text-decoration: none;
+      border-bottom: none;
+    }
+  `;
+}
diff --git a/src/foundation.ts b/src/foundation.ts
@@ -1699,7 +1699,11 @@ export const tags: Record<
     identity: namingIdentity,
     selector: namingSelector,
     parents: ['Process', 'Line', 'SubFunction', 'Function', 'Bay'],
-    children: [...tAbstractConductingEquipmentSequence, 'EqFunction'],
+    children: [
+      ...tAbstractConductingEquipmentSequence,
+      'EqFunction',
+      'SubEquipment',
+    ],
   },
   ConfDataSet: {
     identity: singletonIdentity,
@@ -2127,6 +2131,7 @@ export const tags: Record<
       'TransformerWinding',
       'SubEquipment',
       'EqFunction',
+      'SubEquipment',
     ],
   },
   Private: {
@@ -2357,6 +2362,8 @@ export const tags: Record<
     parents: [
       'TapChanger',
       'PowerTransformer',
+      'ConductingEquipment',
+      'TransformerWinding',
       ...tAbstractConductingEquipment,
     ],
     children: [...tPowerSystemResourceSequence, 'EqFunction'],
@@ -2435,6 +2442,7 @@ export const tags: Record<
       'TapChanger',
       'NeutralPoint',
       'EqFunction',
+      'SubEquipment',
     ],
   },
   TrgOps: {