@things-factory/meta-ui 8.0.39 → 9.0.0-9.0.0-beta.59.0

package/client/pages/activity/meta-activity-define-page.js

@@ -1,422 +0,0 @@
-import '@material/web/icon/icon.js'
-
-import '@operato/data-grist'
-import { p13n } from '@operato/p13n'
-import '@things-factory/worklist/dist-client/pages/activity/activity-model-item-list.js'
-import { ActivityStatus } from '@things-factory/worklist/dist-client/types/types.js'
-
-import gql from 'graphql-tag'
-import { css, html } from 'lit'
-
-import { client } from '@operato/graphql'
-import { i18next, localize } from '@operato/i18n'
-import { notify, openPopup } from '@operato/layout'
-import { PageView } from '@operato/shell'
-import { CommonButtonStyles, CommonGristStyles, CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'
-import { adjustFilters, isMobileDevice } from '@operato/utils'
-
-import { MetaApi } from './../../utils/meta-api'
-
-class MetaActivityDefinePage extends p13n(localize(i18next)(PageView)) {
-  /**
-   * @description 스타일 정의
-   ***********************************
-   * @returns {Object} 화면의 스타일 정의
-   */
-  static get styles() {
-    return [
-      ScrollbarStyles,
-      CommonGristStyles,
-      CommonHeaderStyles,
-      css`
-        :host {
-          display: flex;
-
-          width: 100%;
-
-          --grid-record-emphasized-background-color: red;
-          --grid-record-emphasized-color: yellow;
-        }
-      `
-    ]
-  }
-
-  /**
-   * @description 프로퍼티 정의
-   ***********************************
-   * @returns {Object} 화면의 프로퍼티 정의
-   */
-  static get properties() {
-    return {
-      gristConfig: Object,
-      mode: String,
-      grist: Object,
-      filters: []
-    }
-  }
-
-  get grist() {
-    return this.shadowRoot.querySelector('ox-grist')
-  }
-
-  async connectedCallback() {
-    this.mode = isMobileDevice() ? 'CARD' : 'GRID'
-    this.filters = ['released']
-
-    if (super.connectedCallback) {
-      await super.connectedCallback()
-    }
-  }
-
-  get context() {
-    return {
-      title: i18next.t('title.activity list'),
-      search: {
-        handler: search => {
-          this.grist.searchText = search
-        },
-        value: this.grist?.searchText || ''
-      },
-      filter: {
-        handler: () => {
-          this.grist.toggleHeadroom()
-        }
-      },
-      help: 'worklist/activity',
-      actions: [
-        {
-          title: i18next.t('button.save'),
-          action: this.updateActivity.bind(this),
-          ...CommonButtonStyles.save
-        }
-      ]
-    }
-  }
-
-  render() {
-    const mode = this.mode
-
-    return html`
-      <ox-grist
-        .mode=${mode}
-        .config=${this.gristConfig}
-        .fetchHandler=${this.fetchHandler.bind(this)}
-        .personalConfigProvider=${this.getPagePreferenceProvider('ox-grist')}
-      >
-        <div slot="headroom" class="header">
-          <div class="filters">
-            <ox-input-select-buttons
-              .value=${this.filters}
-              .options=${[
-                {
-                  display: i18next.t('label.filter-draft'),
-                  value: 'draft'
-                },
-                {
-                  display: i18next.t('label.filter-released'),
-                  value: 'released'
-                },
-                {
-                  display: i18next.t('label.filter-deprecated'),
-                  value: 'deprecated'
-                }
-              ]}
-              @change=${e => {
-                if (e.currentTarget) {
-                  this.filters = e.currentTarget.value
-                }
-                this.grist.fetch()
-              }}
-            ></ox-input-select-buttons>
-          </div>
-
-          <div id="modes">
-            <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</md-icon>
-            <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>
-          </div>
-        </div>
-
-        <ox-grist-personalizer slot="setting"></ox-grist-personalizer>
-      </ox-grist>
-    `
-  }
-
-  async pageInitialized(lifecycle) {
-    this.gristConfig = {
-      pagination: MetaApi.getGristPagination100Config(),
-      list: {
-        thumbnail: 'thumbnail',
-        fields: ['name', 'description'],
-        details: ['updatedAt']
-      },
-      columns: [
-        { type: 'gutter', gutterName: 'sequence' },
-        { type: 'gutter', gutterName: 'row-selector', multiple: true },
-        {
-          type: 'gutter',
-          gutterName: 'button',
-          title: i18next.t('title.activity model item list'),
-          icon: 'reorder',
-          handlers: {
-            click: (columns, data, column, record, rowIndex) => {
-              if (!record.id) return
-              const popup = openPopup(
-                html` <activity-model-item-list .activity=${record}></activity-model-item-list> `,
-                {
-                  backdrop: true,
-                  help: 'worklist/activity/activity-model-item-list',
-                  size: 'large',
-                  title: i18next.t('title.activity model item list')
-                }
-              )
-              popup.onclosed = () => {
-                this.grist?.fetch()
-              }
-            }
-          }
-        },
-        {
-          type: 'string',
-          name: 'name',
-          header: i18next.t('field.name'),
-          record: {
-            editable: true
-          },
-          filter: 'search',
-          sortable: true,
-          width: 290
-        },
-        {
-          type: 'string',
-          name: 'description',
-          header: i18next.t('field.description'),
-          record: {
-            editable: true
-          },
-          filter: 'search',
-          width: 290
-        },
-        {
-          type: 'approval-line',
-          name: 'approvalLine',
-          header: i18next.t('field.approval-line'),
-          record: {
-            editable: true,
-            align: 'center'
-          },
-          width: 60
-        },
-        {
-          type: 'select',
-          name: 'state',
-          header: i18next.t('label.status'),
-          record: {
-            editable: true,
-            options: ActivityStatus
-          },
-          filter: true,
-          width: 80
-        },
-        {
-          type: 'activity-search-keys',
-          name: 'searchKeys',
-          label: true,
-          header: i18next.t('field.search-keys'),
-          record: {
-            editable: true
-          },
-          width: 120
-        },
-        {
-          type: 'resource-object',
-          name: 'supervisoryRole',
-          header: i18next.t('field.supervisory-role'),
-          record: {
-            editable: true,
-            options: {
-              title: i18next.t('title.lookup role'),
-              queryName: 'roles'
-            }
-          },
-          filter: 'search',
-          width: 90
-        },
-        {
-          type: 'resource-object',
-          name: 'updater',
-          header: i18next.t('field.updater'),
-          record: {
-            editable: false
-          },
-          sortable: true,
-          width: 90
-        },
-        {
-          type: 'datetime',
-          name: 'updatedAt',
-          header: i18next.t('field.updated_at'),
-          record: {
-            editable: false
-          },
-          sortable: true,
-          width: 180
-        }
-      ],
-      rows: {
-        selectable: {
-          multiple: true
-        },
-        handlers: {
-          click: 'select-row-toggle'
-        }
-      },
-      sorters: [
-        {
-          name: 'name'
-        }
-      ]
-    }
-  }
-
-  async fetchHandler({ page, limit, sortings = [], filters = [] }) {
-    const status = ['draft', 'released', 'deprecated'].filter(state => this.filters?.includes(state))
-
-    if (status.length > 0) {
-      filters = adjustFilters(filters, [{ name: 'state', operator: 'in', value: status }])
-    }
-
-    const response = await client.query({
-      query: gql`
-        query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {
-          responses: activities(filters: $filters, pagination: $pagination, sortings: $sortings) {
-            items {
-              id
-              name
-              description
-              activityType
-              searchKeys {
-                name
-                description
-                inputKey
-                tKey
-              }
-              state
-              model {
-                name
-                description
-                active
-                tag
-                inout
-                type
-                unit
-                options
-                quantifier
-                spec
-              }
-              thumbnail
-              priority
-              issuerRole {
-                id
-                name
-              }
-              assigneeRole {
-                id
-                name
-              }
-              supervisoryRole {
-                id
-                name
-              }
-              assignees {
-                type
-                value
-                assignee {
-                  id
-                  name
-                  description
-                  controlNo
-                }
-              }
-              approvalLine {
-                type
-                value
-                approver {
-                  id
-                  name
-                  description
-                  controlNo
-                }
-              }
-              uiType
-              uiSource
-              viewType
-              viewSource
-              reportType
-              reportSource
-              startingType
-              multiple
-              schedule
-              timezone
-              scheduleId
-              standardTime
-              updater {
-                id
-                name
-              }
-              updatedAt
-            }
-            total
-          }
-        }
-      `,
-      variables: {
-        filters,
-        pagination: { page, limit },
-        sortings
-      }
-    })
-
-    return {
-      total: response.data.responses.total || 0,
-      records: response.data.responses.items || []
-    }
-  }
-
-  async updateActivity() {
-    let patches = this.grist?.dirtyRecords
-    if (patches && patches.length) {
-      patches = patches.map(patch => {
-        let patchField = patch.id ? { id: patch.id } : {}
-        const dirtyFields = patch.__dirtyfields__
-        for (let key in dirtyFields) {
-          patchField[key] = dirtyFields[key].after
-        }
-        patchField.cuFlag = patch.__dirty__
-
-        return patchField
-      })
-
-      const response = await client.mutate({
-        mutation: gql`
-          mutation ($patches: [ActivityPatch!]!) {
-            updateMultipleActivity(patches: $patches) {
-              name
-            }
-          }
-        `,
-        variables: {
-          patches
-        },
-        context: {
-          hasUpload: true
-        }
-      })
-
-      if (!response.errors) {
-        this.grist?.fetch()
-      }
-    }
-  }
-}
-
-window.customElements.define('meta-activity-define-page', MetaActivityDefinePage)

package/client/pages/activity/meta-activity-list-page.js

@@ -1,262 +0,0 @@
-import '@operato/data-grist'
-
-import gql from 'graphql-tag'
-
-import { html } from 'lit'
-
-import { client } from '@operato/graphql'
-import { i18next, localize } from '@operato/i18n'
-import { p13n } from '@operato/p13n'
-import { PageView } from '@operato/shell'
-import { CommonButtonStyles } from '@operato/styles'
-
-import { ActivityStatus } from '@things-factory/worklist/dist-client/types/types.js'
-
-import { MetaApi } from './../../utils/meta-api'
-import { MetaUiUtil } from './../../utils/meta-ui-util'
-import { ValueUtil } from './../../utils/value-util'
-import { TermsUtil } from './../../utils/terms-util'
-import { ServiceUtil } from '../../utils/service-util'
-import { UiUtil } from '../../utils/ui-util'
-
-class MetaActivityListPage extends p13n(localize(i18next)(PageView)) {
-  static get styles() {
-    return MetaApi.getBasicGristStyles()
-  }
-
-  get context() {
-    return {
-      title: TermsUtil.tTitle('meta_activity_list'),
-      actions: [
-        {
-          title: TermsUtil.tButton('save'),
-          action: this.save.bind(this),
-          ...CommonButtonStyles.save
-        },
-        {
-          title: TermsUtil.tButton('delete'),
-          action: this.delete.bind(this),
-          ...CommonButtonStyles.delete
-        },
-        {
-          title: TermsUtil.tButton('install_activity'),
-          action: this.deploy.bind(this),
-          ...{
-            icon: 'system_update',
-            emphasis: {
-              raised: true,
-              outlined: false,
-              dense: false,
-              danger: false
-            }
-          }
-        }
-      ]
-    }
-  }
-
-  get grist() {
-    return this.shadowRoot.querySelector('ox-grist')
-  }
-
-  async connectedCallback() {
-    // 그리드 뷰 옵션
-    this.grid_view_options = ['LIST', 'GRID', 'CARD']
-
-    // 그리드 모드 설정
-    this.gridMode = MetaApi.isMobileEnv() ? 'LIST' : 'GRID'
-
-    // 그리드 설정
-    this.gridConfig = {
-      option: { view_mode: this.grid_view_options },
-      rows: MetaApi.getGristSelectableConfig(true),
-      pagination: MetaApi.getGristPagination100Config(),
-      sorters: [{ name: 'name', desc: false }],
-      appendable: true,
-      columns: [
-        ...MetaApi.getGristGuttersConfig(true, false),
-        {
-          type: 'string',
-          name: 'id',
-          sortable: false,
-          hidden: true
-        },
-        MetaUiUtil.getGristColumnConfig2('string', 'name', 'name', 'left', true, true, 300),
-        MetaUiUtil.getGristColumnConfig2('string', 'description', 'description', 'left', true, true, 350),
-        MetaUiUtil.getGristSelectorColumnConfig('state', 'status', 'left', true, 85, false, ActivityStatus),
-        {
-          type: 'resource-object',
-          name: 'menu',
-          header: TermsUtil.tLabel('menu'),
-          record: {
-            editable: true,
-            options: {
-              queryName: 'menus',
-              pagination: { pages: [1000] },
-              basicArgs: {
-                filters: [
-                  { name: 'menuType', operator: 'in', value: ['SCREEN', 'POPUP'] },
-                  { name: 'routing', operator: 'is_not_null', value: '' },
-                  { name: 'template', operator: 'is_not_null', value: '' }
-                ]
-              },
-              columns: [
-                { name: 'id', hidden: true },
-                {
-                  name: 'name',
-                  header: TermsUtil.tLabel('name'),
-                  width: 500,
-                  filter: 'search',
-                  record: {
-                    editable: true,
-                    align: 'left',
-                    renderer: function (value, column, record, rowIndex, field) {
-                      let menuName = TermsUtil.tMenu(value)
-                      if (value == menuName) {
-                        return value
-                      } else {
-                        return value + ' (' + menuName + ')'
-                      }
-                    }
-                  }
-                },
-                await MetaApi.getGristCodeSelectorColumnConfig(
-                  'menuType',
-                  'menu_type',
-                  'left',
-                  false,
-                  110,
-                  false,
-                  'MENU_PAGE_TYPE'
-                ),
-                MetaUiUtil.getGristColumnConfig2('string', 'routing', 'routing', 'left', false, false, 250)
-              ],
-              list: { fields: ['name', 'routing'] },
-              nameField: 'routing'
-            }
-          },
-          width: 190
-        },
-        MetaUiUtil.getGristColumnConfig2('object', 'updater', 'updater', 'left', false, false, 90),
-        MetaUiUtil.getGristColumnConfig2('datetime', 'updatedAt', 'updated_at', 'left', false, true, 180),
-        { name: 'activityType', hidden: true },
-        { name: 'multiple', hidden: true },
-        { name: 'startingType', hidden: true }
-      ],
-      sorters: [{ name: 'name', desc: false }]
-    }
-
-    // 조회 조건
-    let searchFields = { name: 'like' }
-    this.gridConfig.columns
-      .filter(x => searchFields[x.name])
-      .forEach(x => {
-        x.filter = searchFields[x.name]
-      })
-
-    if (this.connectedCallback) {
-      await super.connectedCallback()
-    }
-  }
-
-  async fetchHandler({ page, limit, sorters = [], filters = [] }) {
-    filters.push({
-      name: 'model',
-      operator: 'like',
-      value: '"relation-menu"'
-    })
-
-    // 조회 컬럼 추출 후 조회
-    let selectFields = MetaApi.getSelectColumns(this.gridConfig.columns.filter(x => x.name != 'menu'))
-    selectFields += `
-      model {
-        name
-        description
-      }
-    `
-
-    let response = await MetaApi.searchByPagination('metaActivities', filters, sorters, page, limit, selectFields)
-
-    response.records.forEach(x => {
-      let menu = x.model.filter(y => y.name == 'relation-menu')
-      if (menu && menu.length > 0) {
-        x.menu = JSON.parse(menu[0].description)
-      }
-      delete x.model
-    })
-
-    return response
-  }
-
-  async deploy() {
-    try {
-      var response = await client.query({
-        query: gql`
-          mutation {
-            installActivityTemplate
-          }
-        `
-      })
-
-      if (!response.errors) {
-        UiUtil.showToast('info', TermsUtil.tText('install_activity_success'))
-        return true
-      } else {
-        ServiceUtil.showGraphqlErrorResponse(response)
-      }
-    } catch (e) {
-      ServiceUtil.showGraphqlException(e)
-    }
-  }
-
-  async save() {
-    let patches = ServiceUtil.patchesForUpdateMultiple(this.grist)
-    if (ValueUtil.isNotEmpty(patches)) {
-      patches.forEach(x => {
-        Object.assign(x, {
-          uiSource: 'meta-activity-writer-element',
-          uiType: 'custom-element',
-          viewSource: 'meta-activity-viewer-element',
-          viewType: 'custom-element'
-        })
-
-        if (!x.multiple) x.multiple = 'single'
-        if (!x.activityType) x.activityType = 'task'
-        if (!x.startingType) x.startingType = 'post'
-      })
-
-      let result = await ServiceUtil.updateMultiple('updateMultipleMetaActivity', patches)
-      if (result) {
-        this.grist.fetch()
-        return result
-      }
-    }
-  }
-
-  async delete() {
-    await MetaApi.deleteListByGristSelected(this.grist, 'deleteMetaActivities')
-  }
-
-  render() {
-    return html`
-      <ox-grist
-        auto-fetch
-        id="ox-grist"
-        .config=${this.gridConfig}
-        .mode=${this.gridMode}
-        .personalConfigProvider=${this.getPagePreferenceProvider('ox-grist')}
-        .fetchHandler=${this.fetchHandler.bind(this)}
-      >
-        <div slot="headroom" class="header">
-          <div class="filters">
-            <ox-filters-form></ox-filters-form>
-          </div>
-        </div>
-
-        <ox-grist-personalizer slot="setting"></ox-grist-personalizer>
-      </ox-grist>
-    `
-  }
-}
-
-window.customElements.define('meta-activity-list-page', MetaActivityListPage)

package/client/pages/activity/meta-activity-viewer-element.js

@@ -1,35 +0,0 @@
-import gql from 'graphql-tag'
-
-import { css, html, LitElement } from 'lit'
-import { client } from '@operato/graphql'
-import { i18next, localize } from '@operato/i18n'
-import { ServiceUtil } from './../../utils/service-util'
-import { MetaApi } from './../../utils/meta-api'
-import { UiUtil } from './../../utils/ui-util'
-import { ValueUtil } from './../../utils/value-util'
-import { MetaActivityMixin } from './meta-activiy-mixin.js'
-
-
-/**
- * @description Auto Generate Activity Viewer Element
- */
-export class MetaActivityViewerElement extends MetaActivityMixin(localize(i18next)(LitElement)) {
-
-  render(){
-    if(this.relationMenu && !this.contentElement){
-      let tagName = this.relationMenu.tagName;
-      let routing = this.relationMenu.routing;
-      let name = this.relationMenu.name;
-
-      let htmlText = `<${tagName} id='${name}' route_name='${routing}' style="flex:1;" is_activity=true is_readonly=true is_detail=true></${tagName}>`;
-      this.contentElement = UiUtil.htmlToElement(htmlText);
-      this.contentElement.activityDataSet = ValueUtil.isEmpty(this.output) ? undefined : this.output.customData;
-    }
-
-    return html`
-      ${this.contentElement}
-    `
-  }
-}
-
-customElements.define('meta-activity-viewer-element', MetaActivityViewerElement)