@operato/scene-legend 0.1.10 → 0.1.18

package/dist/editors/property-editor-svg-info.d.ts

@@ -0,0 +1,15 @@
+import '@operato/i18n/ox-i18n.js';
+import { PropertyValues, TemplateResult } from 'lit';
+import { OxPropertyEditor, PropertySpec } from '@operato/property-editor';
+import { Component } from '@hatiolab/things-scene';
+export default class SVGInfoEditor extends OxPropertyEditor {
+    static styles: import("lit").CSSResult[];
+    src?: string;
+    ids: SVGPathElement[];
+    private fillStyleSaved;
+    editorTemplate(value: any, spec: PropertySpec): TemplateResult;
+    onEnterEvent(path: SVGPathElement): void;
+    onOutEvent(path: SVGPathElement): void;
+    updated(changes: PropertyValues<this>): void;
+    fetchSourceInfo(component: Component, src: string): Promise<void>;
+}

package/dist/editors/property-editor-svg-info.js

@@ -0,0 +1,71 @@
+import { __decorate } from "tslib";
+import '@operato/i18n/ox-i18n.js';
+import { css, html } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { OxPropertyEditor } from '@operato/property-editor';
+let SVGInfoEditor = class SVGInfoEditor extends OxPropertyEditor {
+    constructor() {
+        super(...arguments);
+        this.ids = [];
+        this.fillStyleSaved = [];
+    }
+    editorTemplate(value, spec) {
+        return html `
+      <fieldset fullwidth>
+        <ul info>
+          ${this.ids.map(path => html `<li @mouseenter=${() => this.onEnterEvent(path)} @mouseout=${() => this.onOutEvent(path)}>
+                <div style="fillStyle:${path.style.fill}">${path.id}</div>
+              </li>`)}
+        </ul>
+      </fieldset>
+    `;
+    }
+    onEnterEvent(path) {
+        this.fillStyleSaved.push(path.style.fill);
+        path.style.fill = 'red';
+    }
+    onOutEvent(path) {
+        path.style.fill = this.fillStyleSaved.pop();
+    }
+    updated(changes) {
+        if (changes.has('src')) {
+            this.dispatchEvent(new CustomEvent('i-need-selected', {
+                bubbles: true,
+                composed: true,
+                detail: {
+                    callback: (selected) => {
+                        this.fetchSourceInfo(selected[0], this.src);
+                    }
+                }
+            }));
+        }
+    }
+    async fetchSourceInfo(component, src) {
+        if (!src || !src.trim()) {
+            return;
+        }
+        const element = component.element;
+        const elements = element.querySelectorAll('path[id]');
+        this.ids = Array.from(elements).map(path => path);
+    }
+};
+SVGInfoEditor.styles = [
+    ...OxPropertyEditor.styles,
+    css `
+      ul[info] {
+        margin: 0;
+        font-size: 1em;
+      }
+    `
+];
+__decorate([
+    property({ type: String })
+], SVGInfoEditor.prototype, "src", void 0);
+__decorate([
+    state()
+], SVGInfoEditor.prototype, "ids", void 0);
+SVGInfoEditor = __decorate([
+    customElement('property-editor-svg-info')
+], SVGInfoEditor);
+export default SVGInfoEditor;
+//# sourceMappingURL=property-editor-svg-info.js.map

package/dist/editors/property-editor-svg-info.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"property-editor-svg-info.js","sourceRoot":"","sources":["../../src/editors/property-editor-svg-info.ts"],"names":[],"mappings":";AAAA,OAAO,0BAA0B,CAAA;AAEjC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAkC,MAAM,KAAK,CAAA;AAC/D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,gBAAgB,EAAgB,MAAM,0BAA0B,CAAA;AAI1D,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,gBAAgB;IAA5C;;QAaJ,QAAG,GAAqB,EAAE,CAAA;QAE3B,mBAAc,GAAU,EAAE,CAAA;IAoDpC,CAAC;IAlDC,cAAc,CAAC,KAAU,EAAE,IAAkB;QAC3C,OAAO,IAAI,CAAA;;;YAGH,IAAI,CAAC,GAAG,CAAC,GAAG,CACZ,IAAI,CAAC,EAAE,CACL,IAAI,CAAA,mBAAmB,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;wCACnE,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,IAAI,CAAC,EAAE;oBAC/C,CACT;;;KAGN,CAAA;IACH,CAAC;IAED,YAAY,CAAC,IAAoB;QAC/B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAA;QACzC,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,KAAK,CAAA;IACzB,CAAC;IAED,UAAU,CAAC,IAAoB;QAC7B,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,cAAc,CAAC,GAAG,EAAE,CAAA;IAC7C,CAAC;IAED,OAAO,CAAC,OAA6B;QACnC,IAAI,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC;YACvB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,iBAAiB,EAAE;gBACjC,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;gBACd,MAAM,EAAE;oBACN,QAAQ,EAAE,CAAC,QAAe,EAAE,EAAE;wBAC5B,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,GAAI,CAAC,CAAA;oBAC9C,CAAC;iBACF;aACF,CAAC,CACH,CAAA;QACH,CAAC;IACH,CAAC;IAED,KAAK,CAAC,eAAe,CAAC,SAAoB,EAAE,GAAW;QACrD,IAAI,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,EAAE,CAAC;YACxB,OAAM;QACR,CAAC;QAED,MAAM,OAAO,GAAI,SAAkC,CAAC,OAAyB,CAAA;QAE7E,MAAM,QAAQ,GAAG,OAAO,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAA;QACrD,IAAI,CAAC,GAAG,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAQ,CAAA;IAC1D,CAAC;;AAjEM,oBAAM,GAAG;IACd,GAAG,gBAAgB,CAAC,MAAM;IAC1B,GAAG,CAAA;;;;;KAKF;CACF,AARY,CAQZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAa;AAE/B;IAAR,KAAK,EAAE;0CAA2B;AAbhB,aAAa;IADjC,aAAa,CAAC,0BAA0B,CAAC;GACrB,aAAa,CAmEjC;eAnEoB,aAAa","sourcesContent":["import '@operato/i18n/ox-i18n.js'\n\nimport { css, html, PropertyValues, TemplateResult } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { OxPropertyEditor, PropertySpec } from '@operato/property-editor'\nimport { Component, HTMLOverlayContainer } from '@hatiolab/things-scene'\n\n@customElement('property-editor-svg-info')\nexport default class SVGInfoEditor extends OxPropertyEditor {\n  static styles = [\n    ...OxPropertyEditor.styles,\n    css`\n      ul[info] {\n        margin: 0;\n        font-size: 1em;\n      }\n    `\n  ]\n\n  @property({ type: String }) src?: string\n\n  @state() ids: SVGPathElement[] = []\n\n  private fillStyleSaved: any[] = []\n\n  editorTemplate(value: any, spec: PropertySpec): TemplateResult {\n    return html`\n      <fieldset fullwidth>\n        <ul info>\n          ${this.ids.map(\n            path =>\n              html`<li @mouseenter=${() => this.onEnterEvent(path)} @mouseout=${() => this.onOutEvent(path)}>\n                <div style=\"fillStyle:${path.style.fill}\">${path.id}</div>\n              </li>`\n          )}\n        </ul>\n      </fieldset>\n    `\n  }\n\n  onEnterEvent(path: SVGPathElement) {\n    this.fillStyleSaved.push(path.style.fill)\n    path.style.fill = 'red'\n  }\n\n  onOutEvent(path: SVGPathElement) {\n    path.style.fill = this.fillStyleSaved.pop()\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('src')) {\n      this.dispatchEvent(\n        new CustomEvent('i-need-selected', {\n          bubbles: true,\n          composed: true,\n          detail: {\n            callback: (selected: any[]) => {\n              this.fetchSourceInfo(selected[0], this.src!)\n            }\n          }\n        })\n      )\n    }\n  }\n\n  async fetchSourceInfo(component: Component, src: string) {\n    if (!src || !src.trim()) {\n      return\n    }\n\n    const element = (component as HTMLOverlayContainer).element as HTMLDivElement\n\n    const elements = element.querySelectorAll('path[id]')\n    this.ids = Array.from(elements).map(path => path) as any\n  }\n}\n"]}

package/dist/svg.d.ts

@@ -0,0 +1,19 @@
+import { Component, ComponentNature, HTMLOverlayElement, Properties } from '@hatiolab/things-scene';
+export default class Svg extends HTMLOverlayElement {
+    static get nature(): ComponentNature;
+    oncreate_element(div: HTMLDivElement): Promise<void>;
+    private _value?;
+    private _legendTarget?;
+    get legendTarget(): Component | undefined;
+    loadSVG(div: HTMLElement): Promise<void>;
+    setElementProperties(div: HTMLDivElement): Promise<void>;
+    get src(): any;
+    set src(src: any);
+    onchange(after: Properties, before: Properties): void;
+    onchangeSrc(src: string): void;
+    onchangeValue(value: any): void;
+    get tagName(): string;
+    get nature(): ComponentNature;
+    get value(): any;
+    set value(value: any);
+}

package/dist/svg.js

@@ -0,0 +1,166 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import { __decorate } from "tslib";
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: true,
+    properties: [
+        {
+            type: 'image-selector',
+            label: 'image-src',
+            name: 'src',
+            property: {
+                displayField: 'id',
+                displayFullUrl: true,
+                baseUrlAlias: '$base_url',
+                defaultStorage: 'scene-image',
+                storageFilters: {
+                    type: Array,
+                    value: [
+                        {
+                            name: 'category',
+                            value: 'image'
+                        }
+                    ]
+                },
+                useUpload: true
+            },
+            observe: function (src) {
+                const info = this.parentNode.querySelector('[name=svgInfo]');
+                info.src = src;
+            }
+        },
+        {
+            type: 'svg-info',
+            label: 'svg-info',
+            name: 'svgInfo',
+            readonly: true,
+            editor: {
+                fullwidth: true
+            }
+        },
+        {
+            type: 'id-input',
+            label: 'legend-target',
+            name: 'legendTarget',
+            property: {
+                component: 'legend'
+            }
+        },
+        {
+            type: 'string',
+            label: 'id-field',
+            name: 'idField'
+        },
+        {
+            type: 'string',
+            label: 'value-field',
+            name: 'valueField'
+        }
+    ]
+};
+import { HTMLOverlayElement, sceneComponent } from '@hatiolab/things-scene';
+let Svg = class Svg extends HTMLOverlayElement {
+    static get nature() {
+        return NATURE;
+    }
+    async oncreate_element(div) {
+        await this.loadSVG(div);
+    }
+    get legendTarget() {
+        var { legendTarget } = this.state;
+        if (!this._legendTarget && legendTarget) {
+            this._legendTarget = this.root.findById(legendTarget);
+            this._legendTarget && this._legendTarget.on('change', this.onchangeData, this);
+        }
+        return this._legendTarget;
+    }
+    async loadSVG(div) {
+        try {
+            const parser = new DOMParser();
+            const response = await fetch(this.src);
+            div.innerHTML = '';
+            if (response.ok) {
+                const text = await response.text();
+                const doc = await parser.parseFromString(text, 'image/svg+xml');
+                const element = doc.querySelector('svg');
+                element && div.appendChild(element);
+            }
+            else {
+                const error = await response.text();
+                console.error('load SVG error', error);
+            }
+        }
+        catch (error) {
+            console.error(error);
+        }
+    }
+    async setElementProperties(div) { }
+    get src() {
+        return this.getState('src');
+    }
+    set src(src) {
+        this.setState('src', src);
+    }
+    onchange(after, before) {
+        'src' in after && this.onchangeSrc(after.src);
+        'value' in after && this.onchangeValue(after.value);
+    }
+    onchangeSrc(src) {
+        this.loadSVG(this.element);
+    }
+    onchangeValue(value) {
+        if (typeof this.value !== 'object' || !Array.isArray(this.value)) {
+            return;
+        }
+        const { idField, valueField } = this.state;
+        const legendTarget = this.legendTarget;
+        if (!legendTarget) {
+            return;
+        }
+        const { field: statusField, defaultColor, ranges } = legendTarget.getState('status');
+        if (!(statusField && ranges)) {
+            return;
+        }
+        this.value.forEach(item => {
+            if (!(idField in item) || !(valueField in item)) {
+                return;
+            }
+            var id = item[idField];
+            var status = Number(item[valueField]);
+            var range = ranges.find((range, index) => {
+                let { min: minValue, max: maxValue } = range;
+                var min = minValue !== undefined && minValue !== null && minValue !== '' ? Number(minValue) : undefined;
+                var max = maxValue !== undefined && maxValue !== null && maxValue !== '' ? Number(maxValue) : undefined;
+                // If max is not set, treat it as infinity
+                var maxCheck = max === undefined ? true : max > status;
+                var minCheck = min === undefined ? true : min <= status;
+                return maxCheck && minCheck;
+            });
+            const paths = this.element.querySelectorAll(`path[id="${String(id)}"]`);
+            paths.forEach(path => {
+                path.style.fill = (range === null || range === void 0 ? void 0 : range.color) || defaultColor || 'transparent';
+            });
+        });
+    }
+    get tagName() {
+        return 'div';
+    }
+    get nature() {
+        return NATURE;
+    }
+    get value() {
+        return this._value;
+    }
+    set value(value) {
+        this._value = value;
+        this.onchangeValue(value);
+    }
+};
+Svg = __decorate([
+    sceneComponent('svg')
+], Svg);
+export default Svg;
+//# sourceMappingURL=svg.js.map

package/dist/svg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"svg.js","sourceRoot":"","sources":["../src/svg.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nconst NATURE: ComponentNature = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'image-selector',\n      label: 'image-src',\n      name: 'src',\n      property: {\n        displayField: 'id',\n        displayFullUrl: true,\n        baseUrlAlias: '$base_url',\n        defaultStorage: 'scene-image',\n        storageFilters: {\n          type: Array,\n          value: [\n            {\n              name: 'category',\n              value: 'image'\n            }\n          ]\n        },\n        useUpload: true\n      },\n      observe: function (this: HTMLElement, src: string) {\n        const info: any = this.parentNode!.querySelector('[name=svgInfo]')\n        info.src = src\n      }\n    },\n    {\n      type: 'svg-info',\n      label: 'svg-info',\n      name: 'svgInfo',\n      readonly: true,\n      editor: {\n        fullwidth: true\n      }\n    },\n    {\n      type: 'id-input',\n      label: 'legend-target',\n      name: 'legendTarget',\n      property: {\n        component: 'legend'\n      }\n    },\n    {\n      type: 'string',\n      label: 'id-field',\n      name: 'idField'\n    },\n    {\n      type: 'string',\n      label: 'value-field',\n      name: 'valueField'\n    }\n  ]\n}\n\nimport { Component, ComponentNature, HTMLOverlayElement, Properties, sceneComponent } from '@hatiolab/things-scene'\nimport Legend from './legend.js'\n\n@sceneComponent('svg')\nexport default class Svg extends HTMLOverlayElement {\n  static get nature() {\n    return NATURE\n  }\n\n  async oncreate_element(div: HTMLDivElement) {\n    await this.loadSVG(div)\n  }\n\n  private _value?: any\n  private _legendTarget?: Component\n\n  get legendTarget() {\n    var { legendTarget } = this.state\n\n    if (!this._legendTarget && legendTarget) {\n      this._legendTarget = this.root.findById(legendTarget)\n      this._legendTarget && this._legendTarget.on('change', this.onchangeData, this)\n    }\n\n    return this._legendTarget\n  }\n\n  async loadSVG(div: HTMLElement) {\n    try {\n      const parser = new DOMParser()\n\n      const response = await fetch(this.src)\n\n      div.innerHTML = ''\n\n      if (response.ok) {\n        const text = await response.text()\n        const doc = await parser.parseFromString(text, 'image/svg+xml')\n        const element = doc.querySelector('svg')\n\n        element && div.appendChild(element)\n      } else {\n        const error = await response.text()\n        console.error('load SVG error', error)\n      }\n    } catch (error) {\n      console.error(error)\n    }\n  }\n\n  async setElementProperties(div: HTMLDivElement) {}\n\n  get src() {\n    return this.getState('src')\n  }\n\n  set src(src) {\n    this.setState('src', src)\n  }\n\n  onchange(after: Properties, before: Properties) {\n    'src' in after && this.onchangeSrc(after.src)\n    'value' in after && this.onchangeValue(after.value)\n  }\n\n  onchangeSrc(src: string) {\n    this.loadSVG(this.element)\n  }\n\n  onchangeValue(value: any): void {\n    if (typeof this.value !== 'object' || !Array.isArray(this.value)) {\n      return\n    }\n\n    const { idField, valueField } = this.state\n    const legendTarget = this.legendTarget\n\n    if (!legendTarget) {\n      return\n    }\n\n    const {\n      field: statusField,\n      defaultColor,\n      ranges\n    } = legendTarget.getState('status') as {\n      field: string\n      defaultColor: string\n      ranges: { min?: string | number; max?: string | number; color: string }[]\n    }\n\n    if (!(statusField && ranges)) {\n      return\n    }\n\n    this.value.forEach(item => {\n      if (!(idField in item) || !(valueField in item)) {\n        return\n      }\n\n      var id = item[idField]\n      var status = Number(item[valueField])\n\n      var range = ranges.find((range, index) => {\n        let { min: minValue, max: maxValue } = range\n\n        var min: number | undefined =\n          minValue !== undefined && minValue !== null && minValue !== '' ? Number(minValue) : undefined\n        var max: number | undefined =\n          maxValue !== undefined && maxValue !== null && maxValue !== '' ? Number(maxValue) : undefined\n\n        // If max is not set, treat it as infinity\n        var maxCheck = max === undefined ? true : max > status\n        var minCheck = min === undefined ? true : min <= status\n\n        return maxCheck && minCheck\n      })\n\n      const paths = this.element.querySelectorAll(`path[id=\"${String(id)}\"]`) as NodeListOf<SVGPathElement>\n      paths.forEach(path => {\n        path.style.fill = range?.color || defaultColor || 'transparent'\n      })\n    })\n  }\n\n  get tagName() {\n    return 'div'\n  }\n\n  get nature() {\n    return NATURE\n  }\n\n  get value() {\n    return this._value\n  }\n\n  set value(value) {\n    this._value = value\n    this.onchangeValue(value)\n  }\n}\n"]}

package/dist/templates/svg.d.ts

@@ -0,0 +1,18 @@
+declare const _default: {
+    type: string;
+    description: string;
+    group: string;
+    icon: string;
+    model: {
+        type: string;
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+        fillStyle: string;
+        direction: string;
+        strokeStyle: string;
+        lineWidth: number;
+    };
+};
+export default _default;

package/dist/templates/svg.js

@@ -0,0 +1,19 @@
+const icon = new URL('../../icons/svg.png', import.meta.url).href;
+export default {
+    type: 'svg',
+    description: 'svg for visualizer',
+    group: 'warehouse' /* line|shape|textAndMedia|chartAndGauge|table|container|dataSource|IoT|3D|warehouse|form|etc */,
+    icon,
+    model: {
+        type: 'svg',
+        left: 100,
+        top: 100,
+        width: 400,
+        height: 300,
+        fillStyle: '#efefef',
+        direction: 'vertical',
+        strokeStyle: 'rgba(0, 0, 0, 0.3)',
+        lineWidth: 1
+    }
+};
+//# sourceMappingURL=svg.js.map

package/dist/templates/svg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"svg.js","sourceRoot":"","sources":["../../src/templates/svg.ts"],"names":[],"mappings":"AAAA,MAAM,IAAI,GAAG,IAAI,GAAG,CAAC,qBAAqB,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,CAAA;AAEjE,eAAe;IACb,IAAI,EAAE,KAAK;IACX,WAAW,EAAE,oBAAoB;IACjC,KAAK,EAAE,WAAW,CAAC,gGAAgG;IACnH,IAAI;IACJ,KAAK,EAAE;QACL,IAAI,EAAE,KAAK;QACX,IAAI,EAAE,GAAG;QACT,GAAG,EAAE,GAAG;QACR,KAAK,EAAE,GAAG;QACV,MAAM,EAAE,GAAG;QACX,SAAS,EAAE,SAAS;QACpB,SAAS,EAAE,UAAU;QACrB,WAAW,EAAE,oBAAoB;QACjC,SAAS,EAAE,CAAC;KACb;CACF,CAAA","sourcesContent":["const icon = new URL('../../icons/svg.png', import.meta.url).href\n\nexport default {\n  type: 'svg',\n  description: 'svg for visualizer',\n  group: 'warehouse' /* line|shape|textAndMedia|chartAndGauge|table|container|dataSource|IoT|3D|warehouse|form|etc */,\n  icon,\n  model: {\n    type: 'svg',\n    left: 100,\n    top: 100,\n    width: 400,\n    height: 300,\n    fillStyle: '#efefef',\n    direction: 'vertical',\n    strokeStyle: 'rgba(0, 0, 0, 0.3)',\n    lineWidth: 1\n  }\n}\n"]}

package/logs/.08636eb59927f12972f6774f5947c8507b3564c2-audit.json

@@ -0,0 +1,15 @@
+{
+    "keep": {
+        "days": true,
+        "amount": 2
+    },
+    "auditLog": "logs/.08636eb59927f12972f6774f5947c8507b3564c2-audit.json",
+    "files": [
+        {
+            "date": 1689248179100,
+            "name": "logs/application-2023-07-13-20.log",
+            "hash": "89d17538c1898ddce7ba4c309d7b1ea2d91a9a582682878e950f50fd29fbc298"
+        }
+    ],
+    "hashType": "sha256"
+}

package/logs/.5e5d741d8b7784a2fbad65eedc0fd46946aaf6f2-audit.json

@@ -0,0 +1,15 @@
+{
+    "keep": {
+        "days": true,
+        "amount": 14
+    },
+    "auditLog": "logs/.5e5d741d8b7784a2fbad65eedc0fd46946aaf6f2-audit.json",
+    "files": [
+        {
+            "date": 1689248180358,
+            "name": "logs/connections-2023-07-13-20.log",
+            "hash": "a0dac8996e3b70e357e8b668557260ea5be9055a21ade4693e6f0fde6b02ad2e"
+        }
+    ],
+    "hashType": "sha256"
+}

package/logs/application-2023-07-13-20.log

@@ -0,0 +1,10 @@
+2023-07-13T20:36:19+09:00 info: File Storage is Ready.
+2023-07-13T20:36:20+09:00 error: oracledb module loading failed
+2023-07-13T20:36:21+09:00 info: Default DataSource established
+2023-07-13T20:36:22+09:00 info: 🚀 Server ready at http://0.0.0.0:3000/graphql
+2023-07-13T20:36:22+09:00 info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/graphql
+2023-07-13T20:52:49+09:00 info: File Storage is Ready.
+2023-07-13T20:52:50+09:00 error: oracledb module loading failed
+2023-07-13T20:52:51+09:00 info: Default DataSource established
+2023-07-13T20:52:52+09:00 info: 🚀 Server ready at http://0.0.0.0:3000/graphql
+2023-07-13T20:52:52+09:00 info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/graphql

package/logs/connections-2023-07-13-20.log

@@ -0,0 +1,80 @@
+2023-07-13T20:36:22+09:00 info: Initializing ConnectionManager...
+2023-07-13T20:36:22+09:00 info: Connector 'echo-back-server' started to ready
+2023-07-13T20:36:22+09:00 info: Connector 'echo-back' started to ready
+2023-07-13T20:36:22+09:00 info: Connector 'http-connector' started to ready
+2023-07-13T20:36:22+09:00 info: http-connector connection(날씨마루:https://bd.kma.go.kr) is connected
+2023-07-13T20:36:22+09:00 info: Connector 'graphql-connector' started to ready
+2023-07-13T20:36:22+09:00 info: Connector 'sqlite-connector' started to ready
+2023-07-13T20:36:22+09:00 info: Connector 'postgresql-connector' started to ready
+2023-07-13T20:36:22+09:00 info: Connector 'mqtt-connector' started to ready
+2023-07-13T20:36:22+09:00 info: Connector 'mssql-connector' started to ready
+2023-07-13T20:36:22+09:00 info: Connector 'oracle-connector' started to ready
+2023-07-13T20:36:22+09:00 info: Connector 'mysql-connector' started to ready
+2023-07-13T20:36:22+09:00 info: Connector 'socket-server' started to ready
+2023-07-13T20:36:22+09:00 info: Connector 'msgraph-connector' started to ready
+2023-07-13T20:36:22+09:00 info: echo-back-servers are ready
+2023-07-13T20:36:22+09:00 info: echo-back connections are ready
+2023-07-13T20:36:22+09:00 info: graphql-connector connections are ready
+2023-07-13T20:36:22+09:00 info: sqlite-connector connections are ready
+2023-07-13T20:36:22+09:00 info: postgresql-connector connections are ready
+2023-07-13T20:36:22+09:00 info: mqtt-connector connections are ready
+2023-07-13T20:36:22+09:00 info: mssql-connector connections are ready
+2023-07-13T20:36:22+09:00 info: oracle-connector connections are ready
+2023-07-13T20:36:22+09:00 info: mysql-connector connections are ready
+2023-07-13T20:36:22+09:00 info: socket servers are ready
+2023-07-13T20:36:22+09:00 info: msgraph-connector connections are ready
+2023-07-13T20:36:22+09:00 info: http-connector connections are ready
+2023-07-13T20:36:22+09:00 info: All connector for 'echo-back-server' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'echo-back' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'graphql-connector' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'sqlite-connector' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'postgresql-connector' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'mqtt-connector' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'mssql-connector' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'oracle-connector' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'mysql-connector' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'socket-server' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'msgraph-connector' ready
+2023-07-13T20:36:22+09:00 info: All connector for 'http-connector' ready
+2023-07-13T20:36:22+09:00 info: ConnectionManager initialization done:
+2023-07-13T20:36:22+09:00 info: For domain(61dc2a70-e0b2-4e30-95c3-c66cf47ddee2) : ["날씨마루"]
+2023-07-13T20:52:52+09:00 info: Initializing ConnectionManager...
+2023-07-13T20:52:52+09:00 info: Connector 'echo-back-server' started to ready
+2023-07-13T20:52:52+09:00 info: Connector 'echo-back' started to ready
+2023-07-13T20:52:52+09:00 info: Connector 'http-connector' started to ready
+2023-07-13T20:52:52+09:00 info: http-connector connection(날씨마루:https://bd.kma.go.kr) is connected
+2023-07-13T20:52:52+09:00 info: Connector 'graphql-connector' started to ready
+2023-07-13T20:52:52+09:00 info: Connector 'sqlite-connector' started to ready
+2023-07-13T20:52:52+09:00 info: Connector 'postgresql-connector' started to ready
+2023-07-13T20:52:52+09:00 info: Connector 'mqtt-connector' started to ready
+2023-07-13T20:52:52+09:00 info: Connector 'mssql-connector' started to ready
+2023-07-13T20:52:52+09:00 info: Connector 'oracle-connector' started to ready
+2023-07-13T20:52:52+09:00 info: Connector 'mysql-connector' started to ready
+2023-07-13T20:52:52+09:00 info: Connector 'socket-server' started to ready
+2023-07-13T20:52:52+09:00 info: Connector 'msgraph-connector' started to ready
+2023-07-13T20:52:52+09:00 info: echo-back-servers are ready
+2023-07-13T20:52:52+09:00 info: echo-back connections are ready
+2023-07-13T20:52:52+09:00 info: graphql-connector connections are ready
+2023-07-13T20:52:52+09:00 info: sqlite-connector connections are ready
+2023-07-13T20:52:52+09:00 info: postgresql-connector connections are ready
+2023-07-13T20:52:52+09:00 info: mqtt-connector connections are ready
+2023-07-13T20:52:52+09:00 info: mssql-connector connections are ready
+2023-07-13T20:52:52+09:00 info: oracle-connector connections are ready
+2023-07-13T20:52:52+09:00 info: mysql-connector connections are ready
+2023-07-13T20:52:52+09:00 info: socket servers are ready
+2023-07-13T20:52:52+09:00 info: msgraph-connector connections are ready
+2023-07-13T20:52:52+09:00 info: http-connector connections are ready
+2023-07-13T20:52:52+09:00 info: All connector for 'echo-back-server' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'echo-back' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'graphql-connector' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'sqlite-connector' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'postgresql-connector' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'mqtt-connector' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'mssql-connector' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'oracle-connector' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'mysql-connector' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'socket-server' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'msgraph-connector' ready
+2023-07-13T20:52:52+09:00 info: All connector for 'http-connector' ready
+2023-07-13T20:52:52+09:00 info: ConnectionManager initialization done:
+2023-07-13T20:52:52+09:00 info: For domain(61dc2a70-e0b2-4e30-95c3-c66cf47ddee2) : ["날씨마루"]

package/logs/system/.144ddb221a51f7e2afac3fe1fc3dcf306a8de9ef-audit.json

@@ -0,0 +1,15 @@
+{
+    "keep": {
+        "days": true,
+        "amount": 14
+    },
+    "auditLog": "logs/system/.144ddb221a51f7e2afac3fe1fc3dcf306a8de9ef-audit.json",
+    "files": [
+        {
+            "date": 1689248235070,
+            "name": "logs/system/scenario-에너지 레이어 색상-2023-07-13-20.log",
+            "hash": "8509c7d861880c0931ec87feae7d3833b828ef059038c240e1132ae26baf4c6e"
+        }
+    ],
+    "hashType": "sha256"
+}

package/logs/system/.437ed478d36eef33cb9dfb565b13329b4464783e-audit.json

@@ -0,0 +1,20 @@
+{
+    "keep": {
+        "days": true,
+        "amount": 14
+    },
+    "auditLog": "logs/system/.437ed478d36eef33cb9dfb565b13329b4464783e-audit.json",
+    "files": [
+        {
+            "date": 1683599346648,
+            "name": "logs/system/scenario-발전량 예측 데이터-2023-05-09-11.log",
+            "hash": "f7fa1a6df91294365d1b393045434891d9ea1a63afb428db4dea208c9b8bc12e"
+        },
+        {
+            "date": 1683601398986,
+            "name": "logs/system/scenario-발전량 예측 데이터-2023-05-09-12.log",
+            "hash": "798ae42f4efbc44a7d3ddd9e863c126d687fd1e7f790db7a627b64f5ac02e4a9"
+        }
+    ],
+    "hashType": "sha256"
+}

package/logs/system/.a16ac19e6e222b854c699e1f94ae757f5c8db307-audit.json

@@ -0,0 +1,15 @@
+{
+    "keep": {
+        "days": true,
+        "amount": 14
+    },
+    "auditLog": "logs/system/.a16ac19e6e222b854c699e1f94ae757f5c8db307-audit.json",
+    "files": [
+        {
+            "date": 1683601372061,
+            "name": "logs/system/scenario-일사량 예측 지도-2023-05-09-12.log",
+            "hash": "93d606c9b51d26ada4839c94902f0d4d5efeb0a91708f754302cd1a24d747686"
+        }
+    ],
+    "hashType": "sha256"
+}