@things-factory/meta-ui 7.0.1-alpha.1 → 7.0.1-alpha.11

package/client/pages/entity/config-entity.js

@@ -1,4 +1,4 @@
-import { html } from 'lit-element'
+import { html } from 'lit'
 import gql from 'graphql-tag'
 
 import { client, gqlContext } from '@operato/graphql'
@@ -98,15 +98,15 @@ class ConfigEntity extends localize(i18next)(PageView) {
    * @returns {Array}
    */
   async fetchEntities({ page, limit, sorters = [{ name: 'bundle' }, { name: 'name' }] }) {
-    // 선택된 엔티티 ID 초기화 
+    // 선택된 엔티티 ID 초기화
     this.entityId = null
     this.selectedEntity = null
 
-    if(this.detailGrist && this.detailGrist.data) {
-      this.detailGrist.data = {};
+    if (this.detailGrist && this.detailGrist.data) {
+      this.detailGrist.data = {}
     }
 
-    let filters = [...await this.searchForm.getQueryFilters()]
+    let filters = [...(await this.searchForm.getQueryFilters())]
     let selectFields = `
       id
       bundle
@@ -126,13 +126,15 @@ class ConfigEntity extends localize(i18next)(PageView) {
    * @returns {Array}
    */
   async fetchEntityColumns({ page, limit, sorters = [{ name: 'rank' }] }) {
-    if(this.entityId) {
-      let filters = [{ 
-        name: 'entityId', 
-        operator: 'eq', 
-        value: this.entityId 
-      }]
-      
+    if (this.entityId) {
+      let filters = [
+        {
+          name: 'entityId',
+          operator: 'eq',
+          value: this.entityId
+        }
+      ]
+
       let selectFields = `
         id
         name
@@ -175,7 +177,7 @@ class ConfigEntity extends localize(i18next)(PageView) {
   async openMainMenuSelectorPopup() {
     let menuSelector = MetaApi.createCustomElement('main-menu-selector', 'main-menu-selector')
     menuSelector.selectCallback = this.createMenuTo.bind(this)
-    await MetaApi.openPopupByElement(TermsUtil.tButton('create-menu'), 'large', menuSelector, true)    
+    await MetaApi.openPopupByElement(TermsUtil.tButton('create-menu'), 'large', menuSelector, true)
   }
 
   /*********************************************************************/
@@ -189,8 +191,8 @@ class ConfigEntity extends localize(i18next)(PageView) {
   async saveMasters() {
     let patches = MetaApi.patchesForUpdateMultiple(this.masterGrist)
     if (ValueUtil.isNotEmpty(patches)) {
-      patches.forEach(x=>{
-        if(!x.tableName || x.tableName.length == 0){
+      patches.forEach(x => {
+        if (!x.tableName || x.tableName.length == 0) {
           x.tableName = x.name
         }
       })
@@ -220,13 +222,13 @@ class ConfigEntity extends localize(i18next)(PageView) {
         let idx = 0
         patches.forEach(patch => {
           idx += 10
-          patch.entity = { id : this.entityId }
-          patch.nullable = (patch.nullable === undefined || patch.nullable == null) ? false : patch.nullable
-          patch.rank = (!patch.rank || patch.rank == 0) ? idx : patch.rank
+          patch.entity = { id: this.entityId }
+          patch.nullable = patch.nullable === undefined || patch.nullable == null ? false : patch.nullable
+          patch.rank = !patch.rank || patch.rank == 0 ? idx : patch.rank
           patch.gridRank = patch.gridRank ? patch.gridRank : 0
           patch.term = patch.term ? patch.term : patch.name
           patch.colType = !patch.colType ? 'string' : patch.colType
-          patch.colSize = (patch.colType == 'string' && !patch.colSize) ? 50 : patch.colSize
+          patch.colSize = patch.colType == 'string' && !patch.colSize ? 50 : patch.colSize
         })
 
         let result = await MetaApi.updateMultiple('updateMultipleEntityColumn', patches)
@@ -246,14 +248,14 @@ class ConfigEntity extends localize(i18next)(PageView) {
   }
 
   /**
-   * @description 엔티티 / 서비스 자동 생성 
+   * @description 엔티티 / 서비스 자동 생성
    ************************************
    */
   async createService() {
     const answer = await MetaApi.showAlertPopup('button.create-service', 'text.are_you_sure', 'question', 'confirm', 'cancel')
     if (answer.value) {
       let ids = MetaApi.getSelectedIdList(this.masterGrist, true)
-      if(ids) {
+      if (ids) {
         let selectedId = ids[0]
         const res = await client.query({
           query: gql`
@@ -265,7 +267,7 @@ class ConfigEntity extends localize(i18next)(PageView) {
           context: gqlContext()
         })
 
-        if(res && res.data && res.data.toolCreateService) {
+        if (res && res.data && res.data.toolCreateService) {
           MetaApi.showToast('info', TermsUtil.tText('success to process'))
         }
       }
@@ -277,11 +279,11 @@ class ConfigEntity extends localize(i18next)(PageView) {
    ************************************
    */
   async createMenu() {
-    if(this.entityId) {
+    if (this.entityId) {
       // 메인 메뉴를 선택하는 팝업을 실행하여 어떤 메뉴 하위에 엔티티 메뉴를 생성할 지 결정
       const answer = await MetaApi.showAlertPopup('button.create-menu', 'text.are_you_sure', 'question', 'confirm', 'cancel')
       if (answer.value) {
-        if(MetaApi.getSelectedIdList(this.masterGrist, true)) {
+        if (MetaApi.getSelectedIdList(this.masterGrist, true)) {
           await this.openMainMenuSelectorPopup()
         }
       }
@@ -298,19 +300,19 @@ class ConfigEntity extends localize(i18next)(PageView) {
   async createMenuTo(mainMenuId) {
     const res = await client.query({
       query: gql`
-        mutation($id: String!, $parent_menu_id: String!) {
-          toolCreateMenu(id: $id, parent_menu_id: $parent_menu_id) 
+        mutation ($id: String!, $parent_menu_id: String!) {
+          toolCreateMenu(id: $id, parent_menu_id: $parent_menu_id)
         }
       `,
       variables: { id: this.entityId, parent_menu_id: mainMenuId },
       context: gqlContext()
     })
 
-    if(res && res.data && res.data.toolCreateMenu) {
+    if (res && res.data && res.data.toolCreateMenu) {
       MetaApi.showToast('info', TermsUtil.tText('success to process'))
-      return { success : true }
+      return { success: true }
     } else {
-      return { success : false }
+      return { success: false }
     }
   }
 
@@ -321,9 +323,7 @@ class ConfigEntity extends localize(i18next)(PageView) {
   async createUnregisteredTerms() {
     try {
       if (this.entityId) {
-        const terms = this.detailGrist.data.records
-          .filter(record => TermsUtil.tLabel(record.term) === record.term)
-          .map(r => `label.${r.term}`)
+        const terms = this.detailGrist.data.records.filter(record => TermsUtil.tLabel(record.term) === record.term).map(r => `label.${r.term}`)
         const bundle = this.selectedEntity.bundle
 
         if (terms.length) {
@@ -364,9 +364,7 @@ class ConfigEntity extends localize(i18next)(PageView) {
         ...this.detailGrist._config.columns
           .filter(column => column.type !== 'gutter' && column.record !== undefined && column.imex !== undefined)
           .reduce((record, column) => {
-            record[column.imex.key] = column.imex.key
-              .split('.')
-              .reduce((obj, key) => (obj && obj[key] !== 'undefined' ? obj[key] : undefined), item)
+            record[column.imex.key] = column.imex.key.split('.').reduce((obj, key) => (obj && obj[key] !== 'undefined' ? obj[key] : undefined), item)
             return record
           }, {})
       }
@@ -394,12 +392,12 @@ class ConfigEntity extends localize(i18next)(PageView) {
     fileUpload.setAttribute('accept', fileTypes)
     fileUpload.hidden = true
 
-    fileUpload.addEventListener('change', (event) => {
-      //임포트 대상 엑셀 파일 읽기 
+    fileUpload.addEventListener('change', event => {
+      //임포트 대상 엑셀 파일 읽기
       const fileObj = event.currentTarget.files[0]
       const extension = fileObj.name.split('.').pop()
       const reader = new FileReader()
-    
+
       // Ready The Event For When A File Gets Selected
       reader.onload = function (e) {
         const data = e.target.result
@@ -420,61 +418,66 @@ class ConfigEntity extends localize(i18next)(PageView) {
   }
 
   /**
-   * @description 엔티티 컬럼 엑셀 임포트 처리 
+   * @description 엔티티 컬럼 엑셀 임포트 처리
    **************************************
    */
   importEntityColumns(records) {
     let importList = records.header ? records.data : records
 
     if (importList && importList.length > 0) {
-      importList.forEach(i => {i.__selected__ = true})
+      importList.forEach(i => {
+        i.__selected__ = true
+      })
       let cols = this.importConfig.columns.filter(column => !!column.imex)
       setTimeout(() => {
         MetaApi.openPopupByElement(
-          TermsUtil.tTitle('import'), 
+          TermsUtil.tTitle('import'),
           'large',
-          html`
-          <import-pop-up 
-            .records=${importList} 
+          html` <import-pop-up
+            .records=${importList}
             .config=${{
               rows: importList,
-              columns: [{
-                type: 'gutter',
-                gutterName: 'sequence'
-              }, ...cols]
-            }} 
-            .importHandler="${this.importHandler.bind(this)}">
-          </import-pop-up>`)
+              columns: [
+                {
+                  type: 'gutter',
+                  gutterName: 'sequence'
+                },
+                ...cols
+              ]
+            }}
+            .importHandler="${this.importHandler.bind(this)}"
+          >
+          </import-pop-up>`
+        )
       }, 500)
     }
   }
 
   /**
-   * @description 엔티티 컬럼 엑셀 임포트 처리 
+   * @description 엔티티 컬럼 엑셀 임포트 처리
    **************************************
    */
   async importHandler(patches) {
-    if(!patches || patches.length == 0) {
+    if (!patches || patches.length == 0) {
       MetaApi.showToast('info', 'text.no_data')
       history.back()
-
     } else {
       let idx = 0
       patches.forEach(patch => {
         idx += 10
-        patch.colSize = ValueUtil.isNotEmpty(patch.colSize) ? ValueUtil.toInteger(patch.colSize) : (patch.colType == 'string' ? 50 : 0)
+        patch.colSize = ValueUtil.isNotEmpty(patch.colSize) ? ValueUtil.toInteger(patch.colSize) : patch.colType == 'string' ? 50 : 0
         patch.rank = ValueUtil.toInteger(patch.rank, 0)
         patch.uniqRank = ValueUtil.toInteger(patch.uniqRank, 0)
         patch.searchRank = ValueUtil.toInteger(patch.searchRank, 0)
         patch.gridRank = ValueUtil.toInteger(patch.gridRank, 0)
         patch.gridWidth = ValueUtil.toInteger(patch.gridWidth, 0)
-        patch.entity = { id : this.entityId }
+        patch.entity = { id: this.entityId }
         patch.nullable = ValueUtil.toBoolean(patch.nullable)
         patch.term = patch.term ? patch.term : patch.name
         patch.colType = !patch.colType ? 'string' : patch.colType
         delete patch['string']
       })
-  
+
       let result = await MetaApi.updateMultiple('updateMultipleEntityColumn', patches)
       if (result) {
         this.detailGrist.fetch()
@@ -487,8 +490,8 @@ class ConfigEntity extends localize(i18next)(PageView) {
    * @description 체크 컬럼
    ************************
    */
-   async checkEntityColumns() {
-    if(this.entityId) {
+  async checkEntityColumns() {
+    if (this.entityId) {
       let records = this.detailGrist.data.records
       let lastIdx = records && records.length ? records.length * 10 : 0
       let idExist = false
@@ -497,47 +500,109 @@ class ConfigEntity extends localize(i18next)(PageView) {
       let updatedAtExist = false
       let creatorIdExist = false
       let updaterIdExist = false
-  
-      if(records && records.length > 0) {
-        idExist = records.findIndex(i => {return i.name == 'id' }) >= 0
-        domainIdExist = records.findIndex(i => {return i.name == 'domain_id' }) >= 0
-        createdAtExist = records.findIndex(i => {return i.name == 'created_at' }) >= 0
-        updatedAtExist = records.findIndex(i => {return i.name == 'updated_at' }) >= 0
-        creatorIdExist = records.findIndex(i => {return i.name == 'creator_id' }) >= 0
-        updaterIdExist = records.findIndex(i => {return i.name == 'updater_id' }) >= 0
+
+      if (records && records.length > 0) {
+        idExist =
+          records.findIndex(i => {
+            return i.name == 'id'
+          }) >= 0
+        domainIdExist =
+          records.findIndex(i => {
+            return i.name == 'domain_id'
+          }) >= 0
+        createdAtExist =
+          records.findIndex(i => {
+            return i.name == 'created_at'
+          }) >= 0
+        updatedAtExist =
+          records.findIndex(i => {
+            return i.name == 'updated_at'
+          }) >= 0
+        creatorIdExist =
+          records.findIndex(i => {
+            return i.name == 'creator_id'
+          }) >= 0
+        updaterIdExist =
+          records.findIndex(i => {
+            return i.name == 'updater_id'
+          }) >= 0
       }
-  
+
       let defaultList = []
-      if(!idExist) {
+      if (!idExist) {
         lastIdx += 10
-        defaultList.push({ entity: { id : this.entityId }, name : 'id', colType: 'string', colSize: 0, nullable: false, term: 'id', rank: lastIdx, cuFlag: '+' })
+        defaultList.push({ entity: { id: this.entityId }, name: 'id', colType: 'string', colSize: 0, nullable: false, term: 'id', rank: lastIdx, cuFlag: '+' })
       }
 
-      if(!domainIdExist) {
+      if (!domainIdExist) {
         lastIdx += 10
-        defaultList.push({ entity: { id : this.entityId }, name : 'domain_id', colType: 'string', colSize: 0, nullable: false, term: 'domain', rank: lastIdx, cuFlag: '+' })
+        defaultList.push({ entity: { id: this.entityId }, name: 'domain_id', colType: 'string', colSize: 0, nullable: false, term: 'domain', rank: lastIdx, cuFlag: '+' })
       }
-  
-      if(!createdAtExist) {
+
+      if (!createdAtExist) {
         lastIdx += 10
-        defaultList.push({ entity: { id : this.entityId }, name : 'created_at', colType: 'timestamp', colSize: 0, nullable: true, term: 'created_at', rank: lastIdx, gridRank: 0, gridWidth: 140, cuFlag: '+' })
+        defaultList.push({
+          entity: { id: this.entityId },
+          name: 'created_at',
+          colType: 'timestamp',
+          colSize: 0,
+          nullable: true,
+          term: 'created_at',
+          rank: lastIdx,
+          gridRank: 0,
+          gridWidth: 140,
+          cuFlag: '+'
+        })
       }
-  
-      if(!updatedAtExist) {
+
+      if (!updatedAtExist) {
         lastIdx += 10
-        defaultList.push({ entity: { id : this.entityId }, name : 'updated_at', colType: 'timestamp', colSize: 0, nullable: true, term: 'updated_at', rank: lastIdx, gridRank: lastIdx, gridWidth: 140, cuFlag: '+' })
+        defaultList.push({
+          entity: { id: this.entityId },
+          name: 'updated_at',
+          colType: 'timestamp',
+          colSize: 0,
+          nullable: true,
+          term: 'updated_at',
+          rank: lastIdx,
+          gridRank: lastIdx,
+          gridWidth: 140,
+          cuFlag: '+'
+        })
       }
-  
-      if(!creatorIdExist) {
+
+      if (!creatorIdExist) {
         lastIdx += 10
-        defaultList.push({ entity: { id : this.entityId }, name : 'creator_id', colType: 'string', colSize: 40, nullable: true, term: 'creator', rank: lastIdx, gridRank: 0, gridWidth: 100, cuFlag: '+' })
+        defaultList.push({
+          entity: { id: this.entityId },
+          name: 'creator_id',
+          colType: 'string',
+          colSize: 40,
+          nullable: true,
+          term: 'creator',
+          rank: lastIdx,
+          gridRank: 0,
+          gridWidth: 100,
+          cuFlag: '+'
+        })
       }
-  
-      if(!updaterIdExist) {
+
+      if (!updaterIdExist) {
         lastIdx += 10
-        defaultList.push({ entity: { id : this.entityId }, name : 'updater_id', colType: 'string', colSize: 40, nullable: true, term: 'updater', rank: lastIdx, gridRank: 0, gridWidth: 100, cuFlag: '+' })
+        defaultList.push({
+          entity: { id: this.entityId },
+          name: 'updater_id',
+          colType: 'string',
+          colSize: 40,
+          nullable: true,
+          term: 'updater',
+          rank: lastIdx,
+          gridRank: 0,
+          gridWidth: 100,
+          cuFlag: '+'
+        })
       }
-  
+
       let result = await MetaApi.updateMultiple('updateMultipleEntityColumn', defaultList)
       if (result) {
         this.detailGrist.fetch()
@@ -554,7 +619,7 @@ class ConfigEntity extends localize(i18next)(PageView) {
    ***************************************
    */
   async pageInitialized() {
-    // 조회 필드 
+    // 조회 필드
     this.searchFields = [
       // name, type, label, operator, optionValues
       MetaApi.getGristSearchColumnConfig('name', 'string', 'name', 'i_like'),
@@ -563,21 +628,24 @@ class ConfigEntity extends localize(i18next)(PageView) {
       await MetaApi.getGristSearchCodeColumnConfig('bundle', 'select', 'bundle', 'eq', 'BUNDLE')
     ]
 
-    // 엔티티 마스터 그리드 설정  
+    // 엔티티 마스터 그리드 설정
     this.masterConfig = {
       rows: MetaApi.getGristSelectableConfig(false),
       pagination: { pages: [1000] },
       appendable: true,
       columns: [
         ...MetaApi.getGristGuttersConfig(true, false),
-        { type: 'gutter', gutterName: 'button', icon: 'edit',
+        {
+          type: 'gutter',
+          gutterName: 'button',
+          icon: 'edit',
           handlers: {
             click: (_columns, _data, _column, record, _rowIndex) => {
               if (record.id) {
                 this.searchEntityColumns(record)
               }
             }
-          },
+          }
         },
         // type, name, align, editable, sortable, width
         MetaApi.getGristColumnConfig('string', 'name', 'left', true, false, 175),
@@ -592,7 +660,7 @@ class ConfigEntity extends localize(i18next)(PageView) {
       ]
     }
 
-    // 엔티티 컬럼 그리드 설정  
+    // 엔티티 컬럼 그리드 설정
     this.detailConfig = {
       rows: MetaApi.getGristSelectableConfig(true),
       pagination: { pages: [1000] },
@@ -635,7 +703,7 @@ class ConfigEntity extends localize(i18next)(PageView) {
         MetaApi.getGristColumnConfig2('string', 'defVal', 'id_rule', 'left', true, false, 100)
       ]
     }
-    
+
     this.importConfig = {
       rows: MetaApi.getGristSelectableConfig(true),
       pagination: { pages: [1000] },
@@ -688,24 +756,25 @@ class ConfigEntity extends localize(i18next)(PageView) {
     return html`
       <div slot="headroom">
         <div id="filters">
-          <ox-filters-form-base 
-            .filters=${this.searchFields || []} 
-            @filters-change=${e => { this.masterGrist?.fetch() }}
+          <ox-filters-form-base
+            .filters=${this.searchFields || []}
+            @filters-change=${e => {
+              this.masterGrist?.fetch()
+            }}
           ></ox-filters-form-base>
         </div>
       </div>
 
-      <div class='container' style='grid-template-columns: 37% 63%'>
+      <div class="container" style="grid-template-columns: 37% 63%">
         <div class="container_detail">
-          <h2>
-            <mwc-icon>list_alt</mwc-icon>${TermsUtil.tTitle('entity')}
-          </h2>
-          <ox-grist 
-            id="master-grist" 
-            .config=${this.masterConfig} 
-            .mode=${MetaApi.isMobileEnv() ? 'LIST'  : 'GRID'} 
+          <h2><mwc-icon>list_alt</mwc-icon>${TermsUtil.tTitle('entity')}</h2>
+          <ox-grist
+            id="master-grist"
+            .config=${this.masterConfig}
+            .mode=${MetaApi.isMobileEnv() ? 'LIST' : 'GRID'}
             auto-fetch
-            .fetchHandler=${this.fetchEntities.bind(this)}>
+            .fetchHandler=${this.fetchEntities.bind(this)}
+          >
           </ox-grist>
           <div id="button-container" class="button-container">
             <mwc-button raised label="${TermsUtil.tButton('create-service')}" @click=${e => this.createService()}></mwc-button>
@@ -716,15 +785,14 @@ class ConfigEntity extends localize(i18next)(PageView) {
         </div>
 
         <div class="container_detail">
-          <h2>
-            <mwc-icon>list_alt</mwc-icon>${TermsUtil.tTitle('entity-column')}
-          </h2>
-          <ox-grist 
-            id="detail-grist" 
-            .config=${this.detailConfig} 
-            .mode=${MetaApi.isMobileEnv() ? 'LIST'  : 'GRID'} 
+          <h2><mwc-icon>list_alt</mwc-icon>${TermsUtil.tTitle('entity-column')}</h2>
+          <ox-grist
+            id="detail-grist"
+            .config=${this.detailConfig}
+            .mode=${MetaApi.isMobileEnv() ? 'LIST' : 'GRID'}
             explcit-fetch
-            .fetchHandler=${this.fetchEntityColumns.bind(this)}>
+            .fetchHandler=${this.fetchEntityColumns.bind(this)}
+          >
           </ox-grist>
           <div id="button-container" class="button-container">
             <mwc-button raised label="${TermsUtil.tButton('export')}" @click=${e => this.exportEntityColumns()}></mwc-button>
@@ -740,4 +808,4 @@ class ConfigEntity extends localize(i18next)(PageView) {
   }
 }
 
-customElements.define('config-entity', ConfigEntity)
+customElements.define('config-entity', ConfigEntity)