@things-factory/meta-ui 7.0.0-alpha.9 → 7.0.1-alpha.0

package/client/actions/main.js

@@ -1,23 +1,133 @@
-const a0_0x58b458=a0_0x251c;(function(_0x29ecac,_0x396f71){const _0x330c26=a0_0x251c,_0x2e9168=_0x29ecac();while(!![]){try{const _0x38916b=parseInt(_0x330c26(0x82))/0x1*(-parseInt(_0x330c26(0x89))/0x2)+-parseInt(_0x330c26(0x7b))/0x3+parseInt(_0x330c26(0x80))/0x4+parseInt(_0x330c26(0x7f))/0x5+-parseInt(_0x330c26(0x8a))/0x6+-parseInt(_0x330c26(0x79))/0x7*(-parseInt(_0x330c26(0x84))/0x8)+parseInt(_0x330c26(0x8e))/0x9*(-parseInt(_0x330c26(0x81))/0xa);if(_0x38916b===_0x396f71)break;else _0x2e9168['push'](_0x2e9168['shift']());}catch(_0x1b37c5){_0x2e9168['push'](_0x2e9168['shift']());}}}(a0_0x5f00,0xe7342));import'../viewparts/dynamic-menu-part';import'@material/mwc-icon';import a0_0x593fc1 from'graphql-tag';import{html}from'lit';function a0_0x251c(_0x153823,_0x4c7761){const _0x5f00f0=a0_0x5f00();return a0_0x251c=function(_0x251ccc,_0xb3ec11){_0x251ccc=_0x251ccc-0x73;let _0x4f6e66=_0x5f00f0[_0x251ccc];return _0x4f6e66;},a0_0x251c(_0x153823,_0x4c7761);}import{client}from'@operato/graphql';import{appendViewpart,toggleOverlay,TOOL_POSITION,VIEWPART_POSITION}from'@operato/layout';import{store}from'@operato/shell';import{isMobileDevice}from'@operato/utils';import{APPEND_APP_TOOL,REMOVE_APP_TOOL}from'@things-factory/apptool-base';function a0_0x5f00(){const _0x5663eb=['UPDATE_META_UI','FRONT_END','content','dispatch','4RXDfNR','3454728HMJxGK','value','query','querySelector','9294759mePdim','UPDATE_META_MENU_TEMPLATE','dynamic-menu-part','NAVBAR','portrait','active','hamburger','12452216ghKwFg','landscape','738663chwVoM','appName','get','meta[name=\x22application-name\x22]','5149945tVfzEh','1971100SdfzVg','10lAZbIW','249941swxrdd','items','8sjfdzn'];a0_0x5f00=function(){return _0x5663eb;};return a0_0x5f00();}import{clientSettingStore}from'@things-factory/shell';export const UPDATE_META_UI=a0_0x58b458(0x85);export const UPDATE_META_MENU_TEMPLATE=a0_0x58b458(0x73);var HAMBURGER;export async function setupMenuPart(_0x8f6f31){const _0x3b18a2=a0_0x58b458;var {hovering:_0x9263c4=!!isMobileDevice(),slotTemplate:_0x2af785,portraitSlotTemplate:_0x6cf0,landscapeSlotTemplate:_0x3f1baf,position:_0x69621d=VIEWPART_POSITION[_0x3b18a2(0x75)]}=_0x8f6f31||{};const {hovering:_0x1844df}=(await clientSettingStore[_0x3b18a2(0x7d)]('dynamic-menu'))?.[_0x3b18a2(0x8b)]||{};void 0x0!==_0x1844df&&(_0x9263c4=_0x1844df);const _0x41d65d=_0x69621d==VIEWPART_POSITION['HEADERBAR']?_0x3b18a2(0x7a):_0x3b18a2(0x76),_0x2f1570=(_0x3b18a2(0x7a)==_0x41d65d?_0x3f1baf:_0x6cf0)||_0x2af785||html``;appendViewpart({'name':_0x3b18a2(0x74),'viewpart':{'show':!_0x9263c4,'resizable':!0x0,'hovering':!!isMobileDevice()||_0x9263c4,'template':html`<dynamic-menu-part .orientation=${_0x41d65d}>${_0x2f1570}</dynamic-menu-part>`},'position':_0x69621d}),_0x9263c4&&_0x3b18a2(0x76)==_0x41d65d?HAMBURGER||(HAMBURGER={'name':_0x3b18a2(0x78),'template':html`
-        <mwc-icon @click=${_0xa070ef=>toggleOverlay(_0x3b18a2(0x74),{'backdrop':!0x0})}
-            >view_headline</mwc-icon>
-        `,'position':TOOL_POSITION[_0x3b18a2(0x86)]},store[_0x3b18a2(0x88)]({'type':APPEND_APP_TOOL,'tool':HAMBURGER})):HAMBURGER&&(store[_0x3b18a2(0x88)]({'type':REMOVE_APP_TOOL,'name':'hamburger'}),HAMBURGER=null);}export async function updateMenuTemplate(_0x43fe8){const _0x348d54=a0_0x58b458;var _0x5141b5=document[_0x348d54(0x8d)](_0x348d54(0x7e))?.[_0x348d54(0x87)],_0x5232ae=(await client[_0x348d54(0x8c)]({'query':a0_0x593fc1`
-          query ($filters: [Filter!], $sortings: [Sorting!]) {
-            liteMenus: liteMenus(filters: $filters
-                sortings: $sortings) {
-              items {
-                id
-                name
-                description
-                appName
-                parent
-                rank
-                active
-                type
-                value
-                icon
-              }
-              total
+import '../viewparts/dynamic-menu-part'
+import '@material/mwc-icon'
+
+import gql from 'graphql-tag'
+import { html } from 'lit'
+
+import { client } from '@operato/graphql'
+import { appendViewpart, toggleOverlay, TOOL_POSITION, VIEWPART_POSITION } from '@operato/layout'
+import { store } from '@operato/shell'
+import { isMobileDevice } from '@operato/utils'
+import { APPEND_APP_TOOL, REMOVE_APP_TOOL } from '@things-factory/apptool-base'
+import { clientSettingStore } from '@things-factory/shell'
+
+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`
+        <mwc-icon @click=${e=>
+          toggleOverlay('dynamic-menu-part', {
+            backdrop: true
+          })}
+        >view_headline</mwc-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: liteMenus(filters: $filters
+              sortings: $sortings) {
+            items {
+              id
+              name
+              description
+              appName
+              parent
+              rank
+              active
+              type
+              value
+              icon
             }
+            total
           }
-        `,'variables':{'filters':[{'name':_0x348d54(0x77),'operator':'eq','value':!0x0},{'name':_0x348d54(0x7c),'operator':'in','value':['',_0x5141b5]}],'sortings':[{'name':'rank','desc':!0x1}]}}))['data']['liteMenus'][_0x348d54(0x83)];store[_0x348d54(0x88)]({'type':UPDATE_META_MENU_TEMPLATE,'addon':_0x5232ae['filter'](_0x2f9314=>!_0x2f9314['appName']||_0x2f9314['appName']===_0x5141b5),'template':_0x43fe8});}
+        }
+      `,
+      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/{bootstrap.js → bootstrap.ts}

@@ -1,28 +1,22 @@
 import { html } from 'lit-html'
 
-import { auth } from '@things-factory/auth-base'
+import { auth } from '@things-factory/auth-base/dist-client/auth.js'
 import { ADD_MORENDA } from '@things-factory/more-base'
-import { navigate, store } from '@things-factory/shell'
-import { navigateWithSilence, UPDATE_MODULES } from '@operato/shell'
+import { navigate, store } from '@operato/shell'
 
 import { updateMenuTemplate } from './actions/main'
 import metaUI from './reducers/main'
 import { TermsUtil } from './utils/terms-util'
 import { MetaApi } from './utils/meta-api'
 import { GristDefaultValue } from './utils/grist-default-value'
+import { MENUS } from './dynamic-menus'
 
 import {
   registerEditor as gristColumnRegisterEditor,
   registerRenderer as gristColumnRegisterRenderer,
-  registerFilterRenderer as gristRegisterFilterRenderer,
-  getRenderer as gristGetRenderer,
-  getEditor as gristGetEditor,
-  getFilterRenderers as gristGetFilterRenderers
+  registerFilterRenderer as gristRegisterFilterRenderer
 } from '@operato/data-grist'
-import {
-  registerFilterRenderer as formRegisterFilterRenderer,
-  getFilterRenderers as formGetFilterRenderers
-} from '@operato/form'
+import { registerFilterRenderer as formRegisterFilterRenderer } from '@operato/form'
 
 /** GRIST Renderer Compoment  */
 import { GristRendererMetaCodeSelector } from './component/grist/renderer/grist-renderer-meta-code-selector'
@@ -42,10 +36,10 @@ import { FilterGristMetaObjectSelect } from './component/filter/filter-grist-met
 import { FilterFormMetaCodeSelect } from './component/filter/filter-form-meta-code-select'
 import { FilterFormMetaObjectSelect } from './component/filter/filter-form-meta-object-select'
 
-export default function bootstrap() {
-  import(`./pages/activity/meta-activity-writer-element`)
-  import(`./pages/activity/meta-activity-viewer-element`)
+import './pages/activity/meta-activity-writer-element'
+import './pages/activity/meta-activity-viewer-element'
 
+export default function bootstrap(module) {
   // GRIST Renderer
   gristColumnRegisterRenderer('meta-code-selector', GristRendererMetaCodeSelector)
   gristColumnRegisterRenderer('meta-object-selector', GristRendererMetaObjectSelector)
@@ -71,31 +65,17 @@ export default function bootstrap() {
     metaUI
   })
 
-  // var titleMeta = document.querySelector('meta[name="application-name"]');
-  // console.log(titleMeta ? titleMeta.content : 'Things Factory')
-  // console.log(ENV['APP-VERSION'])
-
-  // var iconLink = document.querySelector('link[rel="application-icon"]')
-  // var titleMeta = document.querySelector('meta[name="application-name"]')
-  // var descriptionMeta = document.querySelector('meta[name="application-description"]')
-
-  // this._applicationMeta = {
-  //   icon: iconLink ? iconLink.href : logo,
-  //   title: titleMeta ? titleMeta.content : 'Things Factory',
-  //   description: descriptionMeta ? descriptionMeta.content : 'Reimagining Software'
-  // }
-
   auth.on('profile', async ({ credential, domains, domain }) => {
     // 1. 용어 다운로드
-    let locale = MetaApi.currentLocale()
-    if (locale == 'ko') locale = 'ko-KR'
+    var locale = MetaApi.currentLocale()
+    if (locale == 'ko') {
+      locale = 'ko-KR'
+    }
     await TermsUtil.downloadTerminologies(locale)
 
     // 2. 메뉴 정보를 서버로 부터 받아서 적용
-    let menuRoutes = await MetaApi.myDynamicMenus()
-
-    let realMenus = menuRoutes.menus
-    await updateMenuTemplate(realMenus)
+    const menuRoutes = await MENUS
+    updateMenuTemplate(menuRoutes.menus)
 
     // 3. 동적 메뉴 관리 화면 추가
     store.dispatch({
@@ -179,102 +159,15 @@ export default function bootstrap() {
       }
     })
 
-    // 8. 모든 routes 정보 추출
-    let allRoutes = menuRoutes.routes
-
-    // 9. store의 모듈 정보 조회 & 마지막 application 모듈 정보를 추출
-    let modules = store.getState().app.modules
-    let allModules = Object.assign([], modules)
-    let appModule = allModules[allModules.length - 1]
-
-    // 10. 최종 애플리케이션 모듈의 routes 정보 교체
-    appModule.routes = allRoutes.filter(r => {
-      return r.template && !r.template.startsWith('@things-factory')
-    })
-
-    // 11. meta-ui 모듈 추출
-    let metaUiModule = allModules.find(m => {
-      return m.name == '@things-factory/meta-ui'
-    })
-
-    // 12. meta-ui의 routes 정보 교체
-    let metaUiRoutes = allRoutes.filter(r => {
-      let isMetaUiRoute = r.template && r.template.startsWith('@things-factory/meta-ui')
-      if (isMetaUiRoute) {
-        r.template = r.template.replace('@things-factory/meta-ui/client', '.')
-      }
-
-      return isMetaUiRoute
-    })
-
-    this.routes.forEach(r => {
-      metaUiRoutes.push({ page: r.page, tagname: r.tagname })
-    })
-    metaUiModule.routes = metaUiRoutes
-    metaUiModule.route = metaUiRoute
-
-    // 13. store에 모듈 업데이트
     store.dispatch({
-      type: UPDATE_MODULES,
-      modules: allModules
-    })
-
-    // 14. 첫 페이지를 리로딩 처리 (shell/app.js에서 리로딩 처리시에는 라우팅 정보가 없어서 처리를 못하므로 여기서 다시 한번 해줌...)
-    store.dispatch(navigateWithSilence(location))
-  })
-}
-
-/**
- * @description MetaUI 라우팅 처리 로직
- ***********************************
- * @param {*} page
- * @returns
- */
-function metaUiRoute(page) {
-  if (page == 'dynamic-menu') {
-    import('./pages/menu/dynamic-menu')
-    return page
-  } else if (page == 'config-terminology') {
-    import('./pages/terms/config-terminology')
-    return page
-  } else if (page == 'meta-activity-list') {
-    import('./pages/activity/meta-activity-list-page')
-    return page
-  } else if (page == 'meta-activity-define') {
-    import('./pages/activity/meta-activity-define-page')
-    return page
-  } else if (page == 'config-entity') {
-    import('./pages/entity/config-entity')
-    return page
-  } else if (page == 'work-code-page') {
-    import('./pages/work-code/work-code-page')
-    return page
-  } else if (page == 'button-role-page') {
-    import('./pages/button-role/button-role-page')
-    return page
-  } else if (page == 'loading-page') {
-    import('./pages/loading-page')
-    return page
-  } else {
-    let storage = store.getState()
-
-    if (storage && storage.app && storage.app.modules) {
-      let modules = storage.app.modules
-      let metaUiMod = modules.find(m => {
-        return m.name == '@things-factory/meta-ui'
-      })
-
-      if (metaUiMod && metaUiMod.routes) {
-        let metaUiRoutes = metaUiMod.routes
-        let metaRoute = metaUiRoutes.find(mapping => mapping.page == page)
-
-        if (metaRoute) {
-          import(`${metaRoute.template}`)
-          return page
+      type: ADD_MORENDA,
+      morenda: {
+        icon: html` <mwc-icon>dataset</mwc-icon> `,
+        name: html` <ox-i18n msgid="text.attribute management"></ox-i18n> `,
+        action: () => {
+          navigate('attributes')
         }
       }
-    }
-
-    return ''
-  }
+    })
+  })
 }

package/client/component/filter/filter-form-meta-code-select.js

@@ -1,16 +1,94 @@
-(function(_0x4d8736,_0x3289d7){const _0x473e2b=a0_0xd6d7,_0x58c798=_0x4d8736();while(!![]){try{const _0x5c6a2c=-parseInt(_0x473e2b(0x14a))/0x1+-parseInt(_0x473e2b(0x15a))/0x2+-parseInt(_0x473e2b(0x15f))/0x3*(parseInt(_0x473e2b(0x160))/0x4)+parseInt(_0x473e2b(0x141))/0x5*(-parseInt(_0x473e2b(0x152))/0x6)+parseInt(_0x473e2b(0x154))/0x7+parseInt(_0x473e2b(0x14c))/0x8*(parseInt(_0x473e2b(0x148))/0x9)+parseInt(_0x473e2b(0x14e))/0xa*(parseInt(_0x473e2b(0x158))/0xb);if(_0x5c6a2c===_0x3289d7)break;else _0x58c798['push'](_0x58c798['shift']());}catch(_0x221d00){_0x58c798['push'](_0x58c798['shift']());}}}(a0_0x4d99,0x42dd8));import'../popup/meta-object-selector-popup';function a0_0x4d99(){const _0x5e2291=['codes','form\x20[name=\x22','split','187fMODAb','large','652202kPwszt','dispField','map','filter-change','tagName','5154tjHnkR','968exCnHl','ox-grid-header','select_item','selectorName','50gCpwfS','codeField','length','querySelector','toLowerCase','[name=\x22','filter','284679UuDWGn','tMenu','98223OnkdfZ','name','24HOCVbm','renderRoot','459010GfOEbv','options','display','dispatchEvent','101316tGfsgM','stopPropagation','2853270ectRsc'];a0_0x4d99=function(){return _0x5e2291;};return a0_0x4d99();}function a0_0xd6d7(_0xbb951b,_0xb9b99a){const _0x4d996c=a0_0x4d99();return a0_0xd6d7=function(_0xd6d75e,_0x4db100){_0xd6d75e=_0xd6d75e-0x13f;let _0x1d942e=_0x4d996c[_0xd6d75e];return _0x1d942e;},a0_0xd6d7(_0xbb951b,_0xb9b99a);}import{html}from'lit-html';import{openPopup}from'@operato/layout';import{TermsUtil}from'./../../utils/terms-util';function openMetaCodeSelector(_0x4980a1,_0x5a19ff,_0x4c253c){const _0x1e0685=a0_0xd6d7;var _0x30e487=html`
+import '../popup/meta-object-selector-popup'
+
+import { html } from 'lit-html'
+import { openPopup } from '@operato/layout'
+import { TermsUtil } from './../../utils/terms-util'
+
+function openMetaCodeSelector(filter, value, confirmCallback) {
+
+  var template = html`
     <meta-object-selector-popup
-      .value=${_0x5a19ff}
-      .options=${_0x4980a1['options']}
-      .confirmCallback=${_0x4c253c}
+      .value=${value}
+      .options=${filter.options}
+      .confirmCallback=${confirmCallback}
     ></meta-object-selector-popup>
-  `;openPopup(_0x30e487,{'backdrop':!0x0,'size':_0x1e0685(0x159),'title':_0x4980a1[_0x1e0685(0x14f)]['selectorName']?TermsUtil[_0x1e0685(0x149)](_0x4980a1[_0x1e0685(0x14f)][_0x1e0685(0x140)]):TermsUtil['tTitle'](_0x1e0685(0x13f))});}export const FilterFormMetaCodeSelect=(_0x208cf1,_0x5a25ef,_0x559d57)=>{const _0x395ee7=a0_0xd6d7,_0x5641e2=_0x208cf1['options'],_0x2bf0ba=_0x5641e2[_0x395ee7(0x155)]&&_0x5641e2['codes'][_0x395ee7(0x143)]>0x0?_0x5641e2[_0x395ee7(0x155)]:void 0x0,{operator:_0x1803e8='eq'}=_0x208cf1;let _0x374f55=_0x5a25ef||'',_0x1db0ad=_0x5a25ef||'';if(_0x5641e2[_0x395ee7(0x15b)]&&_0x5a25ef&&_0x2bf0ba){let _0x142822=_0x2bf0ba[_0x395ee7(0x147)](_0x5f28ec=>_0x5f28ec['value']==_0x5a25ef);_0x142822&&_0x142822[_0x395ee7(0x143)]>0x0&&(_0x1db0ad=_0x142822[0x0][_0x395ee7(0x150)]);}return'eq'===_0x1803e8?html`
-        <input name='${_0x208cf1[_0x395ee7(0x14b)]}' .value=${_0x374f55} type="text" hidden></input>
+  `
+
+  openPopup(template, {
+    backdrop: true,
+    size: 'large',
+    title: filter.options.selectorName ? TermsUtil.tMenu(filter.options.selectorName) : TermsUtil.tTitle('select_item')
+  })
+}
+
+
+export const FilterFormMetaCodeSelect = (filter, value, owner) =>{
+  const options = filter.options;
+  const codes = (options.codes && options.codes.length > 0) ? options.codes : undefined;
+  const { operator = 'eq' } = filter;
+  let hideText = value? value : '';
+  let text = value? value : '';
+
+  if(options.dispField && value && codes){
+    let dispCode = codes.filter(x=> x.value == value);
+
+    if(dispCode && dispCode.length > 0){
+      text = dispCode[0].display;
+    }
+  }
+
+  return operator === 'eq'
+    ? html`
+        <input name='${filter.name}' .value=${hideText} type="text" hidden></input>
         <input
           type="text"
           readonly
-          name='${_0x208cf1[_0x395ee7(0x14b)]}_disp'
-          .value=${_0x1db0ad}
-          @click=${_0x9fd715=>{const _0x4edd57=_0x395ee7;_0x9fd715[_0x4edd57(0x153)]();const _0x24407b=_0x9fd715['target'];openMetaCodeSelector(_0x208cf1,_0x5a25ef,_0x3787d4=>{const _0x391e3c=_0x4edd57;let _0x4840b3=_0x3787d4?_0x3787d4[_0x5641e2[_0x391e3c(0x142)]]:'',_0x59162d=_0x4840b3;if(_0x3787d4&&_0x5641e2[_0x391e3c(0x15b)]){let _0x3e7a9d=_0x5641e2[_0x391e3c(0x15b)][_0x391e3c(0x157)](',');_0x59162d=_0x3787d4[_0x3e7a9d[0x0]],_0x3e7a9d[_0x391e3c(0x143)]>0x1&&(_0x59162d+='('+_0x3e7a9d['splice'](0x1)[_0x391e3c(0x15c)](_0xa2e687=>_0x3787d4[_0xa2e687])['join'](',')+')');}_0x24407b['value']=_0x59162d,(_0x391e3c(0x161)==_0x559d57[_0x391e3c(0x15e)][_0x391e3c(0x145)]()?_0x559d57[_0x391e3c(0x14d)][_0x391e3c(0x144)](_0x391e3c(0x146)+_0x208cf1[_0x391e3c(0x14b)]+'\x22]'):_0x559d57[_0x391e3c(0x14d)][_0x391e3c(0x144)](_0x391e3c(0x156)+_0x208cf1['name']+'\x22]'))['value']=_0x4840b3,_0x24407b[_0x391e3c(0x151)](new Event('change',{'bubbles':!0x0})),_0x24407b[_0x391e3c(0x151)](new CustomEvent(_0x391e3c(0x15d),{'bubbles':!0x0,'composed':!0x0,'detail':{'name':_0x208cf1[_0x391e3c(0x14b)],'operator':_0x1803e8,'value':_0x4840b3}}));});}}
+          name='${filter.name}_disp'
+          .value=${text}
+          @click=${(e) => {
+            e.stopPropagation();
+
+            const input = e.target;
+
+            const confirmCallback = (selected) => {
+              let code = selected ? selected[options.codeField] : '';
+              let disp = code;
+
+              if(selected && options.dispField){
+                let fields = options.dispField.split(",");
+                disp = selected[fields[0]];
+            
+                if(fields.length > 1){
+                  disp+= `(${fields.splice(1).map(field => { return selected[field]}).join(",")})` 
+                }
+              }
+
+              input.value = disp;
+
+              let codeInput = owner.tagName.toLowerCase() == 'ox-grid-header' 
+                            ? owner.renderRoot.querySelector(`[name="${filter.name}"]`)
+                            : owner.renderRoot.querySelector(`form [name="${filter.name}"]`);
+              
+              codeInput.value = code;
+
+              input.dispatchEvent(new Event('change', { bubbles: true }))              
+
+              input.dispatchEvent(
+                new CustomEvent('filter-change', {
+                  bubbles: true,
+                  composed: true,
+                  detail: {
+                    name: filter.name,
+                    operator,
+                    value: code
+                  }
+                })
+              )
+            }
+
+            openMetaCodeSelector(filter, value, confirmCallback)
+          }}
         />
-      `:html``;};
+      `
+    : html``
+}

package/client/component/filter/filter-form-meta-object-select.js

@@ -1,16 +1,94 @@
-(function(_0xa08686,_0x475cf6){const _0xd0b892=a0_0x3b9e,_0x720594=_0xa08686();while(!![]){try{const _0x21aaf5=parseInt(_0xd0b892(0x11b))/0x1+parseInt(_0xd0b892(0x127))/0x2+-parseInt(_0xd0b892(0x12c))/0x3*(parseInt(_0xd0b892(0x11a))/0x4)+-parseInt(_0xd0b892(0x110))/0x5*(parseInt(_0xd0b892(0x12a))/0x6)+parseInt(_0xd0b892(0x11f))/0x7+-parseInt(_0xd0b892(0x115))/0x8+parseInt(_0xd0b892(0x11d))/0x9;if(_0x21aaf5===_0x475cf6)break;else _0x720594['push'](_0x720594['shift']());}catch(_0x2a32c4){_0x720594['push'](_0x720594['shift']());}}}(a0_0x1ebb,0x220e2));import'../popup/meta-object-selector-popup';import{html}from'lit-html';function a0_0x3b9e(_0x3edec8,_0x39e3f8){const _0x1ebb05=a0_0x1ebb();return a0_0x3b9e=function(_0x3b9e71,_0x1b0fd0){_0x3b9e71=_0x3b9e71-0x10e;let _0x38cfab=_0x1ebb05[_0x3b9e71];return _0x38cfab;},a0_0x3b9e(_0x3edec8,_0x39e3f8);}import{openPopup}from'@operato/layout';import{TermsUtil}from'./../../utils/terms-util';function openMetaObjectSelector(_0x483c6f,_0x3a0dd8,_0x13e15d){const _0x4c3bda=a0_0x3b9e;var _0x1f8c27=html`
+import '../popup/meta-object-selector-popup'
+
+import { html } from 'lit-html'
+import { openPopup } from '@operato/layout'
+import { TermsUtil } from './../../utils/terms-util'
+
+function openMetaObjectSelector(filter, value, confirmCallback) {
+
+  var template = html`
     <meta-object-selector-popup
-      .value=${_0x3a0dd8}
-      .options=${_0x483c6f[_0x4c3bda(0x112)]}
-      .confirmCallback=${_0x13e15d}
+      .value=${value}
+      .options=${filter.options}
+      .confirmCallback=${confirmCallback}
     ></meta-object-selector-popup>
-  `;openPopup(_0x1f8c27,{'backdrop':!0x0,'size':_0x4c3bda(0x118),'title':_0x483c6f[_0x4c3bda(0x112)][_0x4c3bda(0x122)]?TermsUtil[_0x4c3bda(0x128)](_0x483c6f[_0x4c3bda(0x112)][_0x4c3bda(0x122)]):TermsUtil['tTitle'](_0x4c3bda(0x120))});}export const FilterFormMetaObjectSelect=(_0x220040,_0x50a156,_0x2be987)=>{const _0x344034=a0_0x3b9e,_0x8664c1=_0x220040[_0x344034(0x112)],{operator:_0x1d04bc='eq'}=_0x220040;let _0x28f362=_0x50a156?_0x50a156['id']:'',_0x2573f0='';if(_0x50a156){let _0xad36e2=_0x8664c1[_0x344034(0x12b)][_0x344034(0x10f)](',');_0x2573f0=_0x50a156[_0xad36e2[0x0]],_0xad36e2[_0x344034(0x117)]>0x1&&(_0x2573f0+='('+_0xad36e2[_0x344034(0x124)](0x1)[_0x344034(0x119)](_0x4fe23e=>_0x50a156[_0x4fe23e])[_0x344034(0x113)](',')+')');}return'eq'===_0x1d04bc?html`
-        <input name='${_0x220040[_0x344034(0x114)]}' .value=${_0x28f362} type="text" hidden></input>
+  `
+
+  openPopup(template, {
+    backdrop: true,
+    size: 'large',
+    title: filter.options.selectorName ? TermsUtil.tMenu(filter.options.selectorName) : TermsUtil.tTitle('select_item')
+  })
+}
+
+
+export const FilterFormMetaObjectSelect = (filter, value, owner) =>{
+  const options = filter.options;
+  const { operator = 'eq' } = filter;
+  let hideText = value ? value.id : '';
+  let text = '';
+
+  if(value){
+    let fields = options.nameField.split(",");
+    text = value[fields[0]];
+
+    if(fields.length > 1){
+      text+= `(${fields.splice(1).map(field => { return value[field]}).join(",")})` 
+    }
+  }
+
+  return operator === 'eq'
+    ? html`
+        <input name='${filter.name}' .value=${hideText} type="text" hidden></input>
         <input
           type="text"
           readonly
-          name='${_0x220040[_0x344034(0x114)]}_disp'
-          .value=${_0x2573f0}
-          @click=${_0xb4024e=>{const _0x558141=_0x344034;_0xb4024e[_0x558141(0x111)]();const _0x56e2c8=_0xb4024e[_0x558141(0x125)];openMetaObjectSelector(_0x220040,_0x50a156,_0x53d668=>{const _0x5bc4fa=_0x558141;let _0x191314=_0x53d668?_0x53d668['id']:'',_0x103483='';if(_0x53d668){let _0xd9a971=_0x8664c1[_0x5bc4fa(0x12b)][_0x5bc4fa(0x10f)](',');_0x103483=_0x53d668[_0xd9a971[0x0]],_0xd9a971['length']>0x1&&(_0x103483+='('+_0xd9a971[_0x5bc4fa(0x124)](0x1)[_0x5bc4fa(0x119)](_0x14be01=>_0x53d668[_0x14be01])['join'](',')+')');}_0x56e2c8[_0x5bc4fa(0x10e)]=_0x103483,(_0x5bc4fa(0x123)==_0x2be987['tagName'][_0x5bc4fa(0x129)]()?_0x2be987[_0x5bc4fa(0x11c)][_0x5bc4fa(0x11e)]('[name=\x22'+_0x220040[_0x5bc4fa(0x114)]+'\x22]'):_0x2be987[_0x5bc4fa(0x11c)]['querySelector'](_0x5bc4fa(0x116)+_0x220040[_0x5bc4fa(0x114)]+'\x22]'))[_0x5bc4fa(0x10e)]=_0x191314,_0x56e2c8[_0x5bc4fa(0x126)](new Event(_0x5bc4fa(0x121),{'bubbles':!0x0})),_0x56e2c8[_0x5bc4fa(0x126)](new CustomEvent('filter-change',{'bubbles':!0x0,'composed':!0x0,'detail':{'name':_0x220040[_0x5bc4fa(0x114)],'operator':_0x1d04bc,'value':_0x191314}}));});}}
+          name='${filter.name}_disp'
+          .value=${text}
+          @click=${(e) => {
+            e.stopPropagation();
+
+            const input = e.target;
+
+            const confirmCallback = (selected) => {
+              let code = selected ? selected.id : '';
+              let disp = '';
+
+              if(selected){
+                let fields = options.nameField.split(",");
+                disp = selected[fields[0]];
+            
+                if(fields.length > 1){
+                  disp+= `(${fields.splice(1).map(field => { return selected[field]}).join(",")})` 
+                }
+              }
+
+              input.value = disp;
+
+              let codeInput = owner.tagName.toLowerCase() == 'ox-grid-header' 
+                            ? owner.renderRoot.querySelector(`[name="${filter.name}"]`)
+                            : owner.renderRoot.querySelector(`form [name="${filter.name}"]`);
+              
+              codeInput.value = code;
+
+              input.dispatchEvent(new Event('change', { bubbles: true }))              
+
+              input.dispatchEvent(
+                new CustomEvent('filter-change', {
+                  bubbles: true,
+                  composed: true,
+                  detail: {
+                    name: filter.name,
+                    operator,
+                    value: code
+                  }
+                })
+              )
+            }
+
+            openMetaObjectSelector(filter, value, confirmCallback)
+          }}
         />
-      `:html``;};function a0_0x1ebb(){const _0x18e752=['target','dispatchEvent','298180XznSdA','tMenu','toLowerCase','90096gETVfm','nameField','3sVoKlh','value','split','80dXrSzX','stopPropagation','options','join','name','716912eeVpMD','form\x20[name=\x22','length','large','map','687044dbHgYn','112325QKIGHu','renderRoot','1812195OVwFGw','querySelector','1248457YhcygX','select_item','change','selectorName','ox-grid-header','splice'];a0_0x1ebb=function(){return _0x18e752;};return a0_0x1ebb();}
+      `
+    : html``
+}