@things-factory/meta-ui 8.0.0 → 9.0.0-beta.3

package/client/pages/entity/main-menu-selector.js

@@ -1,245 +0,0 @@
-import '@material/web/icon/icon.js'
-
-import { css, html, LitElement } from 'lit'
-
-import { i18next, localize } from '@operato/i18n'
-import { ScrollbarStyles, CommonGristStyles, ButtonContainerStyles } from '@operato/styles'
-
-import { TermsUtil } from './../../utils/terms-util'
-import { UiUtil } from '../../utils/ui-util'
-import { MetaApi } from '../../utils/meta-api'
-
-/**
- * @license
- * Copyright © HatioLab Inc. All rights reserved.
- * @author Shortstop <shortstop@hatiolab.com>
- * @description 메인 메뉴 선택 화면
- */
-export class MainMenuSelector extends localize(i18next)(LitElement) {
-  /**
-   * @description 스타일 정의
-   ***********************************
-   * @returns {Object} 화면의 스타일 정의
-   */
-  static get styles() {
-    let styles = [
-      ScrollbarStyles,
-      CommonGristStyles,
-      ButtonContainerStyles,
-      css`
-        :host {
-          display: flex;
-          flex-direction: column;
-          overflow-x: auto;
-        }
-
-        .container {
-          flex: 1;
-          display: grid;
-          overflow: hidden;
-        }
-
-        .container_detail {
-          background-color: var(--md-sys-color-background);
-          display: flex;
-          flex-direction: column;
-          flex: 1;
-          overflow-y: auto;
-        }
-
-        h2 {
-          padding: var(--subtitle-padding);
-          font: var(--subtitle-font);
-          color: var(--subtitle-text-color);
-          border-bottom: var(--subtitle-border-bottom);
-        }
-
-        .container_detail h2 {
-          margin: var(--grist-title-margin);
-          border: var(--grist-title-border);
-          font: var(--grist-title-font);
-          color: var(--md-sys-color-secondary);
-        }
-
-        .container_detail h2 md-icon {
-          --md-icon-size: var(--grist-title-icon-size);
-          vertical-align: middle;
-          margin: var(--grist-title-icon-margin);
-          color: var(--grist-title-icon-color);
-        }
-
-        h2 {
-          padding-bottom: var(--grist-title-with-grid-padding);
-        }
-
-        ox-grist {
-          overflow-y: auto;
-          flex: 1;
-        }
-
-        ox-filters-form {
-          flex: 1;
-        }
-      `
-    ]
-    return styles
-  }
-
-  /**
-   * @description 프로퍼티 정의
-   ***********************************
-   * @returns {Object} 화면의 프로퍼티 정의
-   */
-  static get properties() {
-    return {
-      /**
-       * @description 메인 메뉴 리스트
-       ****************************
-       * @type {Array}
-       */
-      items: {
-        type: Array
-      },
-
-      /**
-       * @description 총 메인 메뉴 건수
-       ******************************
-       * @type {Number}
-       */
-      total: {
-        type: Number
-      },
-
-      /**
-       * @description 메인 메뉴 선택 이후 콜백 함수
-       ***************************************
-       * @type {Function}
-       */
-      selectCallback: {
-        type: Function
-      }
-    }
-  }
-
-  /**
-   * @description 라이트 사이클
-   ***************************
-   */
-  async connectedCallback() {
-    // 메뉴 그룹 그리드 설정
-    this.gridConfig = {
-      rows: MetaApi.getGristSelectableConfig(false),
-      pagination: { pages: [1000] },
-      appendable: true,
-      columns: [
-        ...MetaApi.getGristGuttersConfig(true, false),
-        {
-          name: 'rank',
-          header: TermsUtil.tLabel('rank'),
-          width: 80,
-          record: {
-            editable: false,
-            format: '#,###',
-            align: 'left'
-          },
-          sortable: true
-        },
-        MetaApi.getGristColumnConfig('string', 'name', 'left', true, false, 300),
-        {
-          type: 'string',
-          name: 'title',
-          header: TermsUtil.tLabel('title'),
-          record: {
-            editable: false,
-            align: 'left',
-            renderer: (value, column, record, rowIndex, field) => {
-              return record.name ? TermsUtil.tMenu(record.name) : ''
-            }
-          },
-          sortable: false,
-          width: 350
-        },
-        await MetaApi.getGristCodeSelectorColumnConfig('menuType', 'menu_type', 'left', false, 100, true, 'MENU_TYPE')
-      ]
-    }
-
-    if (super.connectedCallback) {
-      await super.connectedCallback()
-    }
-  }
-
-  /**
-   * @description 라이프 사이클
-   ***************************
-   */
-  render() {
-    return html` <div id="container" class="container">
-      <div class="container_detail">
-        <ox-grist
-          id="ox-grist"
-          .config=${this.gridConfig}
-          .mode=${'GRID'}
-          auto-fetch
-          .fetchHandler=${this.fetchMainMenus.bind(this)}
-        >
-        </ox-grist>
-        <div class="button-container">
-          <button hidden id="receive" @click=${this.selectMainMenu.bind(this)}>
-            <md-icon>menu_open</md-icon>${TermsUtil.tButton('create-menu')}
-          </button>
-        </div>
-      </div>
-    </div>`
-  }
-
-  /**
-   * @description 그리드 리턴
-   **************************
-   * @returns {Object} 그리드
-   */
-  get grist() {
-    return this.shadowRoot.querySelector('#ox-grist')
-  }
-
-  /**
-   * @description 메인 메뉴 조회
-   ***************************
-   * @returns
-   */
-  async fetchMainMenus() {
-    let filters = [{ name: 'parentId', operator: 'is_null', value: '' }]
-    let sorters = [{ name: 'rank' }]
-    let selectFields = `
-      id
-      name
-      rank
-      description
-      menuType
-      category
-    `
-    let result = await MetaApi.searchByPagination('menus', filters, sorters, 0, 0, selectFields)
-    this.items = result.records
-    this.total = result.total
-    return { total: this.total, records: this.items }
-  }
-
-  /**
-   * @description 메인 메뉴 선택 시 액션 - 콜백 함수 호출
-   ************************************************
-   */
-  async selectMainMenu(e) {
-    const records = this.grist.selected
-    if (!records || records.length == 0) {
-      UiUtil.showCustomAlert('title.info', 'text.NOTHING_SELECTED', 'info', 'button.confirm')
-    } else {
-      if (this.selectCallback) {
-        let res = await this.selectCallback(records[0].id)
-        if (res.success) {
-          history.back()
-        }
-      }
-    }
-  }
-}
-
-customElements.define('main-menu-selector', MainMenuSelector)

package/client/pages/history/history-copy-list-popup.js

@@ -1,145 +0,0 @@
-import { css, html, LitElement } from 'lit'
-
-import { i18next, localize } from '@operato/i18n'
-import { ScrollbarStyles, CommonGristStyles } from '@operato/styles'
-
-import { MetaApi } from '../../utils/meta-api'
-
-/**
- * @license
- * Copyright © HatioLab Inc. All rights reserved.
- * @author Yang
- * @description 변경 이력 (COPY) 타입 조회 팝업
- */
-export class HistoryCopyListPopup extends localize(i18next)(LitElement) {
-  /**
-   * @description 스타일 정의
-   ***********************************
-   * @returns {Object} 화면의 스타일 정의
-   */
-  static get styles() {
-    let styles = [
-      ScrollbarStyles,
-      CommonGristStyles,
-      css`
-        :host {
-          display: flex;
-          flex-direction: column;
-          overflow-x: auto;
-        }
-
-        ox-grist {
-          overflow-y: auto;
-          flex: 1;
-        }
-
-        ox-filters-form {
-          flex: 1;
-        }
-      `
-    ]
-    return styles
-  }
-
-  /**
-   * @description 프로퍼티 정의
-   ***********************************
-   * @returns {Object} 화면의 프로퍼티 정의
-   */
-  static get properties() {
-    return {
-      parent_id: String
-    }
-  }
-
-  /**
-   * @description 라이트 사이클
-   ***************************
-   */
-  async connectedCallback() {
-    // 메뉴 그룹 그리드 설정
-    let parentGristConfig = this.open_param.gristConfig
-    this.gqlFunc = this.open_param.gqlFunc
-
-    delete parentGristConfig.list
-    delete parentGristConfig.rows
-
-    parentGristConfig.rows = {
-      appendable: false,
-      selectable: false
-    }
-
-    parentGristConfig.sorters = [{ name: 'dataRevisionNo', desc: true }]
-
-    let gristColumns = parentGristConfig.columns.filter(x => x.type != 'gutter' && x.unusable !== true)
-    gristColumns.forEach(x => {
-      if (x.filter) delete x.filter
-      if (!x.record) x.record = {}
-
-      x.sortable = false
-      x.record.editable = false
-    })
-
-    parentGristConfig.columns = [
-      { type: 'gutter', gutterName: 'dirty' },
-      MetaApi.getGristColumnConfig2('integer', 'dataRevisionNo', 'data_revision_no', 'center', false, true, 90),
-      MetaApi.getGristColumnConfig2('string', 'dataRevisionAction', 'data_revision_action', 'center', false, false, 90),
-      ...gristColumns
-    ]
-
-    this.gridConfig = parentGristConfig
-
-    if (super.connectedCallback) {
-      await super.connectedCallback()
-    }
-  }
-
-  /**
-   * @description 라이프 사이클
-   ***************************
-   */
-  render() {
-    return html`
-      <ox-grist
-        id="ox-grist"
-        .config=${this.gridConfig}
-        .mode=${'GRID'}
-        auto-fetch
-        .fetchHandler=${this.fetchHandler.bind(this)}
-      >
-      </ox-grist>
-    `
-  }
-
-  /**
-   * @description 그리드 리턴
-   **************************
-   * @returns {Object} 그리드
-   */
-  get grist() {
-    return this.shadowRoot.querySelector('#ox-grist')
-  }
-
-  /**
-   * @description 이력 조회
-   ***************************
-   * @returns
-   */
-  async fetchHandler({ page = 0, limit = 0, sortings = [], filters = [] }) {
-    let filter = [{ name: 'originalId', operator: 'eq', value: this.parent_id }, ...filters]
-
-    let selectFields = MetaApi.getSelectColumns(this.gridConfig.columns)
-
-    let result = await MetaApi.searchByPagination(
-      `${this.gqlFunc}Histories`,
-      filter,
-      sortings,
-      page,
-      limit,
-      selectFields
-    )
-    return result
-  }
-}
-
-customElements.define('history-copy-list-popup', HistoryCopyListPopup)

package/client/pages/history/history-json-list-popup.js

@@ -1,159 +0,0 @@
-import { css, html, LitElement } from 'lit'
-
-import { i18next, localize } from '@operato/i18n'
-import { ScrollbarStyles, CommonGristStyles } from '@operato/styles'
-
-import { TermsUtil } from './../../utils/terms-util'
-import { UiUtil } from '../../utils/ui-util'
-import { MetaApi } from '../../utils/meta-api'
-
-/**
- * @license
- * Copyright © HatioLab Inc. All rights reserved.
- * @author Yang
- * @description 변경 이력 (JSON) 타입 조회 팝업
- */
-export class HistoryJsonListPopup extends localize(i18next)(LitElement) {
-  /**
-   * @description 스타일 정의
-   ***********************************
-   * @returns {Object} 화면의 스타일 정의
-   */
-  static get styles() {
-    let styles = [
-      ScrollbarStyles,
-      CommonGristStyles,
-      css`
-        :host {
-          display: flex;
-          flex-direction: column;
-          overflow-x: auto;
-        }
-        ox-grist {
-          overflow-y: auto;
-          flex: 1;
-        }
-
-        ox-filters-form {
-          flex: 1;
-        }
-      `
-    ]
-    return styles
-  }
-
-  /**
-   * @description 프로퍼티 정의
-   ***********************************
-   * @returns {Object} 화면의 프로퍼티 정의
-   */
-  static get properties() {
-    return {
-      parent_id: String
-    }
-  }
-
-  /**
-   * @description 라이트 사이클
-   ***************************
-   */
-  async connectedCallback() {
-    // 메뉴 그룹 그리드 설정
-    let parentGristConfig = this.open_param.gristConfig
-    this.gqlFunc = this.open_param.gqlFunc
-
-    delete parentGristConfig.list
-    delete parentGristConfig.rows
-
-    parentGristConfig.rows = {
-      appendable: false,
-      selectable: false
-    }
-
-    parentGristConfig.sorters = [{ name: 'dataRevisionNo', desc: true }]
-
-    let gristColumns = parentGristConfig.columns.filter(x => x.type != 'gutter' && x.unusable !== true)
-    gristColumns.forEach(x => {
-      if (x.filter) delete x.filter
-      if (!x.record) x.record = {}
-
-      x.sortable = false
-      x.record.editable = false
-    })
-
-    parentGristConfig.columns = [
-      { type: 'gutter', gutterName: 'dirty' },
-      MetaApi.getGristColumnConfig2('integer', 'dataRevisionNo', 'data_revision_no', 'center', false, true, 90),
-      MetaApi.getGristColumnConfig2('string', 'dataRevisionAction', 'data_revision_action', 'center', false, false, 90),
-      ...gristColumns
-    ]
-
-    this.gridConfig = parentGristConfig
-
-    if (super.connectedCallback) {
-      await super.connectedCallback()
-    }
-  }
-
-  /**
-   * @description 라이프 사이클
-   ***************************
-   */
-  render() {
-    return html`
-      <ox-grist
-        id="ox-grist"
-        .config=${this.gridConfig}
-        .mode=${'GRID'}
-        auto-fetch
-        .fetchHandler=${this.fetchHandler.bind(this)}
-      >
-      </ox-grist>
-    `
-  }
-
-  /**
-   * @description 그리드 리턴
-   **************************
-   * @returns {Object} 그리드
-   */
-  get grist() {
-    return this.shadowRoot.querySelector('#ox-grist')
-  }
-
-  /**
-   * @description 이력 조회
-   ***************************
-   * @returns
-   */
-  async fetchHandler({ page = 0, limit = 0, sortings = [], filters = [] }) {
-    let filter = [{ name: 'originalId', operator: 'eq', value: this.parent_id }, ...filters]
-
-    let selectFields = `
-      id
-      originalId
-      dataRevisionNo
-      dataRevisionAction
-      historyJson
-    `
-
-    let result = await MetaApi.searchByPagination(
-      `${this.gqlFunc}Histories`,
-      filter,
-      sortings,
-      page,
-      limit,
-      selectFields
-    )
-
-    result.records = result.records.map(x => {
-      return {
-        ...JSON.parse(x.historyJson),
-        ...x
-      }
-    })
-    return result
-  }
-}
-
-customElements.define('history-json-list-popup', HistoryJsonListPopup)

package/client/pages/menu/dynamic-menu-template.js

@@ -1,92 +0,0 @@
-import { css, html, LitElement } from 'lit'
-import { i18next, localize } from '@operato/i18n'
-import { ScrollbarStyles } from '@operato/styles'
-
-import '@operato/input/ox-input-code.js'
-
-import { MetaApi } from '../../utils/meta-api'
-
-class DynamicMenuTemplate extends localize(i18next)(LitElement) {
-  static get properties() {
-    return {
-      title: String,
-      recordId: String
-    }
-  }
-
-  static get styles() {
-    let styles = [
-      ScrollbarStyles,
-      css`
-        :host {
-          display: flex;
-          flex-direction: column;
-          overflow-x: overlay;
-          background-color: var(--md-sys-color-background);
-        }
-        legend {
-          margin: 10px;
-          text-transform: capitalize;
-          padding: var(--legend-padding);
-          font: var(--legend-font);
-          color: var(--legend-text-color);
-          border-bottom: var(--legend-border-bottom);
-        }
-        ox-input-code {
-          margin: 10px;
-          overflow-y: auto;
-          flex: 1;
-        }
-        .button-container {
-          padding: var(--button-container-padding);
-          margin: var(--button-container-margin);
-          text-align: var(--button-container-align);
-          background-color: var(--button-container-background);
-          height: var(--button-container-height);
-          text-align: right;
-          padding-right: 12px;
-        }
-      `
-    ]
-
-    return styles
-  }
-
-  async firstUpdated() {
-    if (super.firstUpdated) {
-      await super.firstUpdated()
-    }
-
-    let menu = await MetaApi.findOne('menu', this.recordId, 'template')
-    let codeData = menu ? menu.template || '' : ''
-    this.codeEditor.value = codeData
-    this.codeEditor.orgValue = this.codeEditor.value
-  }
-
-  render() {
-    return html` <legend>${this.title}</legend>
-      <ox-input-code mode="javascript" value=${this.codeValueNew}></ox-input-code>
-      <div class="button-container"></div>`
-  }
-
-  get codeEditor() {
-    return this.shadowRoot.querySelector('ox-input-code')
-  }
-
-  async save() {
-    if (this.codeEditor.orgValue == this.codeEditor.value) {
-      MetaApi.showAlertPopup('text.nothing_changed', 'text.there_is_nothing_to_save', 'info', 'confirm')
-      return
-    }
-
-    let template = this.codeEditor.value
-
-    let patches = [{ id: this.recordId, template: template, cuFlag: 'M' }]
-    let result = await MetaApi.updateMultiple('updateMultipleMenu', patches)
-    if (result) {
-      history.back()
-    }
-  }
-}
-
-customElements.define('dynamic-menu-template', DynamicMenuTemplate)