@things-factory/meta-ui 7.0.1-alpha.51 → 7.0.1-alpha.52

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@things-factory/meta-ui",
-  "version": "7.0.1-alpha.51",
+  "version": "7.0.1-alpha.52",
   "main": "dist-server/index.js",
   "browser": "dist-client/index.js",
   "things-factory": true,
@@ -41,10 +41,10 @@
     "@things-factory/auth-base": "^7.0.1-alpha.47",
     "@things-factory/env": "^7.0.1-alpha.43",
     "@things-factory/id-rule-base": "^7.0.1-alpha.47",
-    "@things-factory/menu-base": "^7.0.1-alpha.47",
-    "@things-factory/resource-base": "^7.0.1-alpha.47",
+    "@things-factory/menu-base": "^7.0.1-alpha.52",
+    "@things-factory/resource-base": "^7.0.1-alpha.52",
     "@things-factory/shell": "^7.0.1-alpha.47",
-    "@things-factory/worklist": "^7.0.1-alpha.51"
+    "@things-factory/worklist": "^7.0.1-alpha.52"
   },
-  "gitHead": "68110b5179a13adc1ba1f1b5557de85e0d4b0a38"
+  "gitHead": "5a1b7d0f19f4d523e0d1d9eb5d600d54006b6ab5"
 }

package/server/service/dynamic-menu/dynamic-menu-query.ts

@@ -1,53 +1,53 @@
-
 import { Resolver, FieldResolver, Root, Query, Args, Ctx, Arg } from 'type-graphql'
 import { ListParam, getRepository, getQueryBuilderFromListParams } from '@things-factory/shell'
 import { Menu } from '@things-factory/menu-base'
 import { DynamicMenuList, ExportMenuInfo } from './dynamic-menu-type'
 
-import { Entity, EntityColumn} from '@things-factory/resource-base'
-import { Terminology } from '@things-factory/i18n-base'
+import { Entity, EntityColumn } from '@things-factory/resource-base'
 
 import crypto from 'crypto'
 const { camelCase, startCase, snakeCase, kebabCase, upperFirst } = require('lodash')
 
-
 @Resolver(Menu)
 export class DynamicMenuQuery {
-
   @Query(returns => ExportMenuInfo, { description: 'To fetch a export menu data' })
   async exportMenuInfo(@Arg('id') id: string, @Ctx() context: any): Promise<ExportMenuInfo> {
     const { domain } = context.state
 
-    // 메뉴 
-    const menu:Menu = await getRepository(Menu).findOneBy({id:id, domain:{id:domain.id}});
-    const parentMenu:Menu = await getRepository(Menu).findOneBy({id:menu.parentId, domain:{id:domain.id}});
+    // 메뉴
+    const menu: Menu = await getRepository(Menu).findOneBy({ id: id, domain: { id: domain.id } })
+    const parentMenu: Menu = await getRepository(Menu).findOneBy({ id: menu.parentId, domain: { id: domain.id } })
 
-    // entity 
-    let entityName = upperFirst(camelCase(menu.routing));
-    const entity:Entity = await getRepository(Entity).findOneBy({domain:{id: domain.id}, name: entityName});
+    // entity
+    let entityName = upperFirst(camelCase(menu.routing))
+    const entity: Entity = await getRepository(Entity).findOneBy({ domain: { id: domain.id }, name: entityName })
 
-    // entity Columns 
-    const entityColumns:EntityColumn[] = await getRepository(EntityColumn).findBy({domain:{id: domain.id}, entity:{id:entity.id}});
+    // entity Columns
+    const entityColumns: EntityColumn[] = await getRepository(EntityColumn).findBy({ domain: { id: domain.id }, entity: { id: entity.id } })
 
-    let entityMeta = getRepository(entityName).metadata;
+    let entityMeta = getRepository(entityName).metadata
 
-    const indices = entityMeta.indices.map(x=>{
+    const indices = entityMeta.indices.map(x => {
       return {
-        name:x.name,
-        isUnique:x.isUnique,
-        columns: x.columns.map(y=> {return y.databaseName.toUpperCase()})
+        name: x.name,
+        isUnique: x.isUnique,
+        columns: x.columns.map(y => {
+          return y.databaseName.toUpperCase()
+        })
       }
     })
 
-    const columns = entityMeta.columns.map(x=>{
-      return {
-        name: x.databaseName,
-        isNullable: x.isNullable,
-        length: x.type =='numeric' ? [x.precision,x.scale].join(",")  : x.length,
-        type: x.type.toString(),
-        default: (typeof x.default  === 'function' ) ? undefined : x.default
-      }
-    }).filter(x => ['data_revision_no','deleted_at'].includes(x.name) == false)
+    const columns = entityMeta.columns
+      .map(x => {
+        return {
+          name: x.databaseName,
+          isNullable: x.isNullable,
+          length: x.type == 'numeric' ? [x.precision, x.scale].join(',') : x.length,
+          type: x.type.toString(),
+          default: typeof x.default === 'function' ? undefined : x.default
+        }
+      })
+      .filter(x => ['data_revision_no', 'deleted_at'].includes(x.name) == false)
 
     return {
       id,
@@ -57,35 +57,35 @@ export class DynamicMenuQuery {
       indices,
       columns,
       parentMenu
-    };
+    }
   }
 
   @Query(returns => DynamicMenuList, { description: 'To fetch multiple dynamicMenus' })
   async dynamicMenus(@Args() params: ListParam, @Ctx() context: any): Promise<DynamicMenuList> {
     const { domain } = context.state
 
-    let templateCodeIdx = params.filters?.findIndex(x=> x.name == 'templateCode');
-    let templateCode = undefined;
+    let templateCodeIdx = params.filters?.findIndex(x => x.name == 'templateCode')
+    let templateCode = undefined
 
-    if(templateCodeIdx > -1){
-      templateCode = params.filters[templateCodeIdx].value;
-      params.filters = params.filters.filter(x=> x.name != 'templateCode');
+    if (templateCodeIdx > -1) {
+      templateCode = params.filters[templateCodeIdx].value
+      params.filters = params.filters.filter(x => x.name != 'templateCode')
     }
 
-    let templateTextIdx = params.filters?.findIndex(x=> x.name == 'templateText');
-    let templateText = undefined;
+    let templateTextIdx = params.filters?.findIndex(x => x.name == 'templateText')
+    let templateText = undefined
 
-    if(templateTextIdx > -1){
-      templateText = params.filters[templateTextIdx].value;
-      params.filters = params.filters.filter(x=> x.name != 'templateText');
+    if (templateTextIdx > -1) {
+      templateText = params.filters[templateTextIdx].value
+      params.filters = params.filters.filter(x => x.name != 'templateText')
     }
 
-    if(templateText){
-      params.pagination.limit = 0;
-      params.pagination.page = 0;
+    if (templateText) {
+      params.pagination.limit = 0
+      params.pagination.page = 0
     }
 
-    let groupSearch = params.filters?.findIndex(x=> x.name == 'parentId' && x.operator == 'is_null') > -1 ? true : false;
+    let groupSearch = params.filters?.findIndex(x => x.name == 'parentId' && x.operator == 'is_null') > -1 ? true : false
 
     const queryBuilder = getQueryBuilderFromListParams({
       domain,
@@ -94,115 +94,145 @@ export class DynamicMenuQuery {
       searchables: ['name', 'description', 'routing']
     })
 
-    let [items, total] = await queryBuilder.getManyAndCount();
-    let result: DynamicMenuList = {items: items, total: total};
+    let [items, total] = await queryBuilder.getManyAndCount()
+    let result: DynamicMenuList = { items: items, total: total }
 
-    let self = this;
+    let self = this
 
-    if(templateText){
-      if(groupSearch === true){
-        for(let idx = 0 ; idx < result.items.length ;idx++){
-          result.items[idx].children = await getRepository(Menu).findBy({parent: { id: result.items[idx].id }})
+    if (templateText) {
+      if (groupSearch === true) {
+        for (let idx = 0; idx < result.items.length; idx++) {
+          result.items[idx].children = await getRepository(Menu).findBy({ parent: { id: result.items[idx].id } })
         }
-      }  
+      }
 
-      items = items.filter(function(item:Menu){
-        return self.checkTemplateByContainsText(templateCode, templateText, groupSearch === true ? item.children : item.template);
+      items = items.filter(function (item: Menu) {
+        return self.checkTemplateByContainsText(templateCode, templateText, groupSearch === true ? item.children : item.template)
       })
     }
 
     return {
       items,
       total
-    };
+    }
   }
 
-  checkTemplate(code: string, text:string, template: string){
-    if(!template) return false;
-
-    let templateString: any = '';
-    let templateJsonStr = this.dec(template);
-    let templateJson = JSON.parse(templateJsonStr);
-
-    if(code === 'col-name'){
-      templateString = templateJson['grid_column'].map(x=>{ return x.name;})
-    } else if(code === 'object-custom'){
-      templateString = JSON.stringify(templateJson['grid_column'].filter(x=>
-        ['meta-object-selector','object','resource-object'].includes(x.type) && x.object_opt && !x.object_opt.menu
-      ).map(x=> {return x.object_opt}));
-    } else if (code === 'object-menu'){
-      templateString = JSON.stringify(templateJson['grid_column'].filter(x=>
-        ['meta-object-selector','object','resource-object'].includes(x.type) && x.object_opt && x.object_opt.menu
-      ).map(x=> {return x.object_opt.menu}));
-    } else if (code === 'code-custom'){
-      templateString = JSON.stringify(templateJson['grid_column'].filter(x=>
-        ['meta-code-selector','resource-code-selector'].includes(x.type) && x.object_opt && !x.object_opt.menu
-      ).map(x=> {return x.object_opt}));
-    } else if (code === 'code-menu'){
-      templateString = JSON.stringify(templateJson['grid_column'].filter(x=>
-        ['meta-code-selector','resource-code-selector'].includes(x.type) && x.object_opt && x.object_opt.menu
-      ).map(x=> {return x.object_opt.menu}));
-    } else if (code === 'selector-entity'){
-      templateString = JSON.stringify(templateJson['grid_column'].filter(x=>
-        x.type == 'select' && x.select_opt && x.select_opt.type == 'entity'
-      ).map(x=> {return x.select_opt}));
-    } else if (code === 'selector-code'){
-      templateString = JSON.stringify(templateJson['grid_column'].filter(x=>
-        x.type == 'select' && x.select_opt && x.select_opt.type == 'code'
-      ).map(x=> {return x.select_opt.name}));
-    } else if (code === 'selector-scenario'){
-      templateString = JSON.stringify(templateJson['grid_column'].filter(x=>
-        x.type == 'select' && x.select_opt && x.select_opt.type == 'scenario'
-      ).map(x=> {return x.select_opt.name}));
+  checkTemplate(code: string, text: string, template: string) {
+    if (!template) return false
+
+    let templateString: any = ''
+    let templateJsonStr = this.dec(template)
+    let templateJson = JSON.parse(templateJsonStr)
+
+    if (code === 'col-name') {
+      templateString = templateJson['grid_column'].map(x => {
+        return x.name
+      })
+    } else if (code === 'object-custom') {
+      templateString = JSON.stringify(
+        templateJson['grid_column']
+          .filter(x => ['meta-object-selector', 'object', 'resource-object'].includes(x.type) && x.object_opt && !x.object_opt.menu)
+          .map(x => {
+            return x.object_opt
+          })
+      )
+    } else if (code === 'object-menu') {
+      templateString = JSON.stringify(
+        templateJson['grid_column']
+          .filter(x => ['meta-object-selector', 'object', 'resource-object'].includes(x.type) && x.object_opt && x.object_opt.menu)
+          .map(x => {
+            return x.object_opt.menu
+          })
+      )
+    } else if (code === 'code-custom') {
+      templateString = JSON.stringify(
+        templateJson['grid_column']
+          .filter(x => ['meta-code-selector', 'resource-code-selector'].includes(x.type) && x.object_opt && !x.object_opt.menu)
+          .map(x => {
+            return x.object_opt
+          })
+      )
+    } else if (code === 'code-menu') {
+      templateString = JSON.stringify(
+        templateJson['grid_column']
+          .filter(x => ['meta-code-selector', 'resource-code-selector'].includes(x.type) && x.object_opt && x.object_opt.menu)
+          .map(x => {
+            return x.object_opt.menu
+          })
+      )
+    } else if (code === 'selector-entity') {
+      templateString = JSON.stringify(
+        templateJson['grid_column']
+          .filter(x => x.type == 'select' && x.select_opt && x.select_opt.type == 'entity')
+          .map(x => {
+            return x.select_opt
+          })
+      )
+    } else if (code === 'selector-code') {
+      templateString = JSON.stringify(
+        templateJson['grid_column']
+          .filter(x => x.type == 'select' && x.select_opt && x.select_opt.type == 'code')
+          .map(x => {
+            return x.select_opt.name
+          })
+      )
+    } else if (code === 'selector-scenario') {
+      templateString = JSON.stringify(
+        templateJson['grid_column']
+          .filter(x => x.type == 'select' && x.select_opt && x.select_opt.type == 'scenario')
+          .map(x => {
+            return x.select_opt.name
+          })
+      )
     } else {
-      templateString = templateJsonStr;
+      templateString = templateJsonStr
     }
 
-    return templateString.includes(text);
+    return templateString.includes(text)
   }
 
-  checkTemplateByContainsText(code: string, text:string, template: any){    
-    if(Array.isArray(template)){
-      for(let idx = 0; idx < template.length ;idx++){
-        let contains = this.checkTemplate(code,text, template[idx].template);
+  checkTemplateByContainsText(code: string, text: string, template: any) {
+    if (Array.isArray(template)) {
+      for (let idx = 0; idx < template.length; idx++) {
+        let contains = this.checkTemplate(code, text, template[idx].template)
 
-        if(contains == true){
-          return true;
+        if (contains == true) {
+          return true
         }
       }
 
-      return false;
+      return false
     } else {
-      return this.checkTemplate(code,text,template);
+      return this.checkTemplate(code, text, template)
     }
   }
 
   dec(template: string): string {
-    let decResults = [];
-    let encTemps = template.split('h1z0q9i9x7q6');
-    let filters = ['aes-256-ecb', 'aes-256-cbc', 'aes-256-cfb', 'aes-256-cfb8', 'aes-256-cfb1', 'aes-256-ofb', 'aes-256-ctr', 'aes256'];
-    let salt = encTemps[0];
-    let hexKey = Buffer.from(salt, 'hex');
-    let ivBase = salt.substring(0, 16);
-    let iv = ['', ivBase, ivBase, ivBase, ivBase, ivBase, ivBase, ivBase];
-    let filterIdx = 0;
+    let decResults = []
+    let encTemps = template.split('h1z0q9i9x7q6')
+    let filters = ['aes-256-ecb', 'aes-256-cbc', 'aes-256-cfb', 'aes-256-cfb8', 'aes-256-cfb1', 'aes-256-ofb', 'aes-256-ctr', 'aes256']
+    let salt = encTemps[0]
+    let hexKey = Buffer.from(salt, 'hex')
+    let ivBase = salt.substring(0, 16)
+    let iv = ['', ivBase, ivBase, ivBase, ivBase, ivBase, ivBase, ivBase]
+    let filterIdx = 0
 
-    encTemps = encTemps.splice(1);
+    encTemps = encTemps.splice(1)
 
     for (var i = 0; i < encTemps.length; i++, filterIdx++) {
-      if (filterIdx == filters.length) filterIdx = 0;
+      if (filterIdx == filters.length) filterIdx = 0
 
-      let decipher = crypto.createDecipheriv(filters[filterIdx], hexKey, iv[filterIdx]);
+      let decipher = crypto.createDecipheriv(filters[filterIdx], hexKey, iv[filterIdx])
       let decrypted = decipher.update(encTemps[i], 'hex', 'utf8')
-      decrypted += decipher.final('utf8');
+      decrypted += decipher.final('utf8')
 
-      decResults.push(decrypted);
+      decResults.push(decrypted)
     }
-    return JSON.parse(decResults.join(''));
+    return JSON.parse(decResults.join(''))
   }
 
   @FieldResolver(type => Menu)
   async parent(@Root() menu: Menu): Promise<Menu> {
-    return await getRepository(Menu).findOneBy({id:menu.parentId})
+    return await getRepository(Menu).findOneBy({ id: menu.parentId })
   }
 }

package/server/service/dynamic-menu/dynamic-menu-type.ts

@@ -1,9 +1,7 @@
-
 import { ObjectType, Field, InputType, Int, ID, Float, registerEnumType } from 'type-graphql'
-import { ObjectRef } from '@things-factory/shell'
 
 import { Menu } from '@things-factory/menu-base'
-import { Entity, EntityColumn} from '@things-factory/resource-base'
+import { Entity, EntityColumn } from '@things-factory/resource-base'
 import { Terminology } from '@things-factory/i18n-base'
 
 @ObjectType()
@@ -16,19 +14,19 @@ export class DynamicMenuList {
 }
 
 @ObjectType()
-export class DBIndex{
+export class DBIndex {
   @Field(type => String)
   name: string
 
   @Field(type => Boolean)
   isUnique: boolean
 
-  @Field(type=> [String], { nullable: true })
-  columns?: string[];
+  @Field(type => [String], { nullable: true })
+  columns?: string[]
 }
 
 @ObjectType()
-export class DBColumn{
+export class DBColumn {
   @Field(type => String)
   name: string
 
@@ -47,14 +45,13 @@ export class DBColumn{
 
 @ObjectType()
 export class ExportMenuInfo {
-
   @Field(type => String)
   id: string
 
   @Field(type => Menu, { nullable: true })
   menu?: Menu
 
-  @Field(type => Menu, { nullable: true})
+  @Field(type => Menu, { nullable: true })
   parentMenu?: Menu
 
   @Field(type => Entity, { nullable: true })
@@ -65,15 +62,13 @@ export class ExportMenuInfo {
 
   @Field(type => [Terminology], { nullable: true })
   termsLabel?: Terminology[]
-  
+
   @Field(type => [Terminology], { nullable: true })
   termsTitle?: Terminology[]
 
-  @Field(type=> [DBIndex], { nullable: true })
-  indices?: DBIndex[];
+  @Field(type => [DBIndex], { nullable: true })
+  indices?: DBIndex[]
 
-  @Field(type=> [DBColumn], { nullable: true })
-  columns?: DBColumn[];
+  @Field(type => [DBColumn], { nullable: true })
+  columns?: DBColumn[]
 }
-
-

package/client/actions/main.js

@@ -1,127 +0,0 @@
-import '@material/web/icon/icon.js'
-import '../viewparts/dynamic-menu-part.js'
-
-import gql from 'graphql-tag'
-import { html } from 'lit'
-
-import { store, clientSettingStore } from '@operato/shell'
-import { client } from '@operato/graphql'
-import { appendViewpart, toggleOverlay, TOOL_POSITION, VIEWPART_POSITION } from '@operato/layout'
-import { isMobileDevice } from '@operato/utils'
-
-import { APPEND_APP_TOOL, REMOVE_APP_TOOL } from '@things-factory/apptool-base'
-
-export const UPDATE_META_UI = 'UPDATE_META_UI'
-export const UPDATE_META_MENU_TEMPLATE = 'UPDATE_META_MENU_TEMPLATE'
-
-var HAMBURGER
-
-export async function setupMenuPart(options) {
-  var { hovering = isMobileDevice() ? true : false, slotTemplate, portraitSlotTemplate, landscapeSlotTemplate, position = VIEWPART_POSITION.NAVBAR } = options || {}
-
-  const { hovering: hoveringSetting } = (await clientSettingStore.get('dynamic-menu'))?.value || {}
-  if (hoveringSetting !== undefined) {
-    hovering = hoveringSetting
-  }
-
-  const orientation = position == VIEWPART_POSITION.HEADERBAR ? 'landscape' : 'portrait'
-  const orientatedSlotTemplate = (orientation == 'landscape' ? landscapeSlotTemplate : portraitSlotTemplate) || slotTemplate || html``
-
-  appendViewpart({
-    name: 'dynamic-menu-part',
-    viewpart: {
-      show: !hovering,
-      resizable: true,
-      hovering: isMobileDevice() ? true : hovering,
-      template: html`<dynamic-menu-part .orientation=${orientation}>${orientatedSlotTemplate}</dynamic-menu-part>`
-    },
-    position
-  })
-
-  if ((hovering || isMobileDevice()) && orientation == 'portrait') {
-    if (!HAMBURGER) {
-      HAMBURGER = {
-        name: 'hamburger',
-        template: html`
-          <md-icon
-            @click=${e =>
-              toggleOverlay('dynamic-menu-part', {
-                backdrop: true
-              })}
-            >view_headline</md-icon
-          >
-        `,
-        position: TOOL_POSITION.FRONT_END
-      }
-
-      store.dispatch({
-        /* incase of mobile : add hamburger tool */
-        type: APPEND_APP_TOOL,
-        tool: HAMBURGER
-      })
-    }
-  } else {
-    if (HAMBURGER) {
-      store.dispatch({
-        type: REMOVE_APP_TOOL,
-        name: 'hamburger'
-      })
-
-      HAMBURGER = null
-    }
-  }
-}
-
-export async function updateMenuTemplate(template) {
-  var applicationName = document.querySelector('meta[name="application-name"]')?.content
-
-  var liteMenus = (
-    await client.query({
-      query: gql`
-        query ($filters: [Filter!], $sortings: [Sorting!]) {
-          liteMenus: myLiteMenus(filters: $filters, sortings: $sortings) {
-            items {
-              id
-              name
-              description
-              appName
-              parent
-              rank
-              active
-              type
-              value
-              icon
-            }
-            total
-          }
-        }
-      `,
-      variables: {
-        filters: [
-          {
-            name: 'active',
-            operator: 'eq',
-            value: true
-          },
-          {
-            name: 'appName',
-            operator: 'in',
-            value: ['', applicationName]
-          }
-        ],
-        sortings: [
-          {
-            name: 'rank',
-            desc: false
-          }
-        ]
-      }
-    })
-  ).data.liteMenus.items
-
-  store.dispatch({
-    type: UPDATE_META_MENU_TEMPLATE,
-    addon: liteMenus.filter(menu => !menu.appName || menu.appName === applicationName),
-    template
-  })
-}

package/client/pages/menu/dynamic-menu-setting-let.ts

@@ -1,82 +0,0 @@
-import '@operato/i18n/ox-i18n.js'
-import '@material/web/checkbox/checkbox.js'
-
-import { css, html, LitElement } from 'lit'
-import { customElement, property } from 'lit/decorators.js'
-
-import { clientSettingStore } from '@operato/shell'
-import { i18next, localize } from '@operato/i18n'
-
-import { setupMenuPart } from '../../actions/main'
-
-// TODO @things-factory/lite-menu/lite-menu-setting-let를 사용하도록 통합되어야 한다.
-@customElement('dynamic-menu-setting-let')
-export class DynamicMenuSettingLet extends localize(i18next)(LitElement) {
-  static styles = [
-    css`
-      label {
-        display: flex;
-        gap: 10px;
-        align-items: center;
-
-        font: var(--label-font);
-        color: var(--label-color);
-        text-transform: var(--label-text-transform);
-      }
-    `
-  ]
-
-  @property({ type: Boolean }) hovering?: boolean
-
-  render() {
-    const checked = this.hovering === true
-    const indeterminate = this.hovering === undefined
-
-    return html`
-      <setting-let>
-        <ox-i18n slot="title" msgid="title.lite-menu-setting"></ox-i18n>
-
-        <div slot="content">
-          <label>
-            <md-checkbox id="hovering" @change=${e => this.onChange(e)} ?checked=${checked} ?indeterminate=${indeterminate}></md-checkbox>
-            hovering
-          </label>
-        </div>
-      </setting-let>
-    `
-  }
-
-  async firstUpdated() {
-    this.hovering = ((await clientSettingStore.get('dynamic-menu'))?.value || {}).hovering
-  }
-
-  async onChange(e: Event) {
-    if (this.hovering === true) {
-      this.hovering = false
-    } else if (this.hovering === false) {
-      this.hovering = undefined
-    } else {
-      this.hovering = true
-    }
-
-    const { hovering: valueFromStore } = (await clientSettingStore.get('dynamic-menu'))?.value || {}
-    if (this.hovering === valueFromStore) {
-      return
-    }
-
-    try {
-      await clientSettingStore.put({
-        key: 'dynamic-menu',
-        value: {
-          hovering: this.hovering
-        }
-      })
-    } catch (e) {
-      console.error(e)
-    }
-
-    setupMenuPart({
-      hovering: this.hovering
-    })
-  }
-}