@things-factory/worklist 6.0.27 → 6.0.32

package/client/pages/installable-activity/installable-activity-list-page.ts

@@ -13,7 +13,7 @@ import { PageView, store } from '@operato/shell'
 import { CommonButtonStyles, CommonGristStyles, ScrollbarStyles } from '@operato/styles'
 import { isMobileDevice } from '@operato/utils'
 
-import { ActivityTypes, ActivityUITypes } from '../../types.js'
+import { ActivityTypes, ActivityUITypes } from '../../types/types.js'
 
 @customElement('installable-activity-list-page')
 export class ActivityTemplateListPage extends connect(store)(localize(i18next)(PageView)) {
@@ -229,6 +229,34 @@ export class ActivityTemplateListPage extends connect(store)(localize(i18next)(P
           },
           width: 140
         },
+        {
+          type: 'select',
+          name: 'viewType',
+          label: true,
+          header: i18next.t('field.view-type'),
+          record: {
+            editable: true,
+            options: ActivityUITypes
+          },
+          width: 80
+        },
+        {
+          type: 'string',
+          name: 'viewSource',
+          header: i18next.t('field.view-source'),
+          record: {
+            editable: true,
+            editor: function (value, column, record, rowIndex, field) {
+              var type = record.viewType !== 'board' ? 'script' : 'board'
+              return getEditor(type)(value, column, record, rowIndex, field)
+            },
+            renderer: function (value, column, record, rowIndex, field) {
+              var type = record.viewType !== 'board' ? 'script' : 'board'
+              return getRenderer(type)(value, column, record, rowIndex, field)
+            }
+          },
+          width: 140
+        },
         {
           type: 'select',
           name: 'reportType',

package/client/pages/todo/approval-waiting-list-page.ts

@@ -14,7 +14,7 @@ import { navigate, PageView, store } from '@operato/shell'
 import { CommonGristStyles, ScrollbarStyles } from '@operato/styles'
 import { isMobileDevice, sleep } from '@operato/utils'
 
-import { ActivityInstanceStatus, Priorities } from '../../types.js'
+import { Priorities } from '../../types/types.js'
 
 const MIN = 60
 const HOUR = 60 * MIN
@@ -153,14 +153,14 @@ export class ApprovalWaitingListPage extends connect(store)(localize(i18next)(Pa
         },
         {
           type: 'string',
-          name: 'uiSource',
-          header: i18next.t('field.ui-source'),
+          name: 'viewSource',
+          header: i18next.t('field.view-source'),
           record: {
             editable: false,
             renderer: function (value, column, record, rowIndex, field) {
-              const { uiType, uiSource } = record.activity || {}
-              var type = uiType !== 'board' ? 'string' : 'board'
-              return getRenderer(type)(uiSource, column, record, rowIndex, field)
+              const { viewType, viewSource } = record.activity || {}
+              var type = viewType !== 'board' ? 'string' : 'board'
+              return getRenderer(type)(viewSource, column, record, rowIndex, field)
             }
           },
           width: 140,
@@ -183,7 +183,17 @@ export class ApprovalWaitingListPage extends connect(store)(localize(i18next)(Pa
           header: i18next.t('field.status'),
           record: {
             editable: false,
-            options: ActivityInstanceStatus
+            options: [
+              { display: 'Draft', value: 'draft' },
+              { display: 'Posted', value: 'posted' },
+              { display: 'WaitingAssignment', value: 'waiting-assignment' },
+              { display: 'Assigned', value: 'assigned' },
+              { display: 'Started', value: 'started' },
+              { display: 'Pending', value: 'pending' },
+              { display: 'Escalated', value: 'escalated' },
+              { display: 'Ended', value: 'ended' },
+              { display: 'Aborted', value: 'aborted' }
+            ]
           },
           // filter: true,
           width: 60
@@ -304,8 +314,8 @@ export class ApprovalWaitingListPage extends connect(store)(localize(i18next)(Pa
                   input
                   refBy
                   activityType
-                  uiType
-                  uiSource
+                  viewType
+                  viewSource
                   thumbnail
                   updatedAt
                   createdAt

package/client/pages/todo/done-list-page.ts

@@ -0,0 +1,344 @@
+import '@operato/data-grist'
+import '@operato/input/ox-input-select-buttons.js'
+
+import gql from 'graphql-tag'
+import { css, html } from 'lit'
+import { customElement, property, query, state } from 'lit/decorators.js'
+import { connect } from 'pwa-helpers/connect-mixin.js'
+
+import { DataGrist, getRenderer } from '@operato/data-grist'
+import { client } from '@operato/graphql'
+import { i18next, localize } from '@operato/i18n'
+import { navigate, PageView, store } from '@operato/shell'
+import { CommonGristStyles, ScrollbarStyles } from '@operato/styles'
+import { isMobileDevice, sleep } from '@operato/utils'
+
+import { Priorities } from '../../types/types.js'
+
+const FILTERS = [
+  {
+    display: 'Important',
+    value: 'Important'
+  },
+  {
+    display: 'Imminent',
+    value: 'Imminent'
+  },
+  {
+    display: 'Disapproved',
+    value: 'Disapproved'
+  }
+]
+
+@customElement('done-list-page')
+export class DoneListPage extends connect(store)(localize(i18next)(PageView)) {
+  static styles = [
+    ScrollbarStyles,
+    CommonGristStyles,
+    css`
+      :host {
+        display: flex;
+
+        width: 100%;
+
+        --grid-record-emphasized-background-color: red;
+        --grid-record-emphasized-color: yellow;
+      }
+
+      #modes {
+        margin-left: auto;
+      }
+    `
+  ]
+
+  @property({ type: Object }) gristConfig?: any
+  @property({ type: String }) mode: 'GRID' | 'LIST' | 'CARD' = isMobileDevice() ? 'CARD' : 'GRID'
+
+  @query('ox-grist') grist!: DataGrist
+
+  @state() filters?: string[]
+
+  get context() {
+    return {
+      search: {
+        handler: (search: string) => {
+          this.grist.searchText = search
+        },
+        placeholder: i18next.t('title.done list'),
+        value: this.grist.searchText
+      },
+      filter: {
+        handler: () => {
+          this.grist.toggleHeadroom()
+        }
+      },
+      help: 'worklist/done-list',
+      actions: []
+    }
+  }
+
+  render() {
+    const mode = this.mode || (isMobileDevice() ? 'CARD' : 'GRID')
+
+    return html`
+      <ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
+        <div slot="headroom">
+          <div id="filters">
+            <ox-input-select-buttons
+              .value=${this.filters}
+              .options=${FILTERS}
+              @change=${(e: CustomEvent) => {
+                this.filters = (e.currentTarget as any)?.value
+              }}
+              multiple
+            ></ox-input-select-buttons>
+          </div>
+
+          <div id="modes">
+            <mwc-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</mwc-icon>
+            <mwc-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</mwc-icon>
+            <mwc-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</mwc-icon>
+          </div>
+        </div>
+      </ox-grist>
+    `
+  }
+
+  async pageInitialized(lifecycle) {
+    this.gristConfig = {
+      list: {
+        thumbnail: 'thumbnail',
+        fields: ['name', 'description'],
+        details: ['createdAt', 'due']
+      },
+      columns: [
+        { type: 'gutter', gutterName: 'sequence' },
+        {
+          type: 'gutter',
+          gutterName: 'button',
+          name: 'start',
+          icon: 'play_arrow',
+          handlers: {
+            click: (columns, data, column, record, rowIndex) => {
+              const { id } = record
+              this.openActivityThread(record)
+            }
+          }
+        },
+        {
+          type: 'string',
+          name: 'name',
+          header: i18next.t('field.name'),
+          record: {
+            editable: false
+          },
+          filter: 'search',
+          sortable: true,
+          width: 150
+        },
+        {
+          type: 'string',
+          name: 'description',
+          header: i18next.t('field.description'),
+          record: {
+            editable: false
+          },
+          filter: 'search',
+          width: 200
+        },
+        {
+          type: 'string',
+          name: 'viewSource',
+          header: i18next.t('field.view-source'),
+          record: {
+            editable: false,
+            renderer: function (value, column, record, rowIndex, field) {
+              const { viewType, viewSource } = record.activity || {}
+              var type = viewType !== 'board' ? 'string' : 'board'
+              return getRenderer(type)(viewSource, column, record, rowIndex, field)
+            }
+          },
+          width: 140,
+          hidden: true
+        },
+        {
+          type: 'select',
+          name: 'priority',
+          header: i18next.t('field.priority'),
+          record: {
+            editable: false,
+            options: Priorities
+          },
+          // filter: true,
+          width: 60
+        },
+        {
+          type: 'select',
+          name: 'state',
+          header: i18next.t('field.status'),
+          record: {
+            editable: false,
+            options: [
+              { display: 'Draft', value: 'draft' },
+              { display: 'Posted', value: 'posted' },
+              { display: 'WaitingAssignment', value: 'waiting-assignment' },
+              { display: 'Assigned', value: 'assigned' },
+              { display: 'Started', value: 'started' },
+              { display: 'Pending', value: 'pending' },
+              { display: 'Escalated', value: 'escalated' },
+              { display: 'Ended', value: 'ended' },
+              { display: 'Aborted', value: 'aborted' }
+            ]
+          },
+          filter: false,
+          width: 60
+        },
+        {
+          type: 'datetime',
+          name: 'dueAt',
+          header: i18next.t('field.due-at'),
+          record: {
+            editable: false,
+            options: {
+              year: 'numeric',
+              month: 'numeric',
+              day: 'numeric'
+            }
+          },
+          sortable: true,
+          width: 100
+        },
+        {
+          type: 'datetime',
+          name: 'startedAt',
+          header: i18next.t('field.started-at'),
+          record: {
+            editable: false
+          },
+          sortable: true,
+          width: 100
+        },
+        {
+          type: 'datetime',
+          name: 'terminatedAt',
+          header: i18next.t('field.terminated-at'),
+          record: {
+            editable: false
+          },
+          sortable: true,
+          width: 100
+        },
+        {
+          type: 'resource-object',
+          name: 'creator',
+          header: i18next.t('field.issuer'),
+          record: {
+            editable: false
+          },
+          sortable: true,
+          width: 120
+        },
+        {
+          type: 'datetime',
+          name: 'createdAt',
+          header: i18next.t('field.posted-at'),
+          record: {
+            editable: false
+          },
+          sortable: true,
+          filter: false,
+          width: 180
+        },
+        {
+          type: 'image',
+          name: 'thumbnail',
+          header: i18next.t('field.thumbnail'),
+          record: { editable: false },
+          hidden: true
+        }
+      ],
+      rows: {
+        appendable: false
+      },
+      sorters: [
+        {
+          name: 'dueAt',
+          desc: false
+        }
+      ]
+    }
+  }
+
+  async pageUpdated(changes, lifecycle, changedBefore) {
+    if (this.active) {
+      this.grist?.fetch()
+    }
+  }
+
+  async fetchHandler({ page, limit, sortings = [], filters = [] }) {
+    const response = await client.query({
+      query: gql`
+        query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {
+          responses: doneList(filters: $filters, pagination: $pagination, sortings: $sortings) {
+            items {
+              id
+              activityInstance {
+                activityId: id
+                name
+                description
+                priority
+                input
+                refBy
+                activityType
+                viewType
+                viewSource
+                thumbnail
+                createdAt
+                startedAt
+                terminatedAt
+                updatedAt
+                createdAt
+                creator {
+                  id
+                  name
+                }
+              }
+              state
+              output
+              dueAt
+              assignedAt
+              startedAt
+              terminatedAt
+            }
+            total
+          }
+        }
+      `,
+      variables: {
+        filters,
+        pagination: { page, limit },
+        sortings
+      }
+    })
+
+    return {
+      total: response.data.responses.total || 0,
+      records: (response.data.responses.items || []).map(item => {
+        return {
+          id: item.id,
+          state: item.state,
+          output: item.output,
+          dueAt: item.dueAt,
+          assignedAt: item.assignedAt,
+          startedAt: item.startedAt,
+          terminatedAt: item.terminatedAt,
+          ...item.activityInstance
+        }
+      })
+    }
+  }
+
+  openActivityThread(activityThread) {
+    navigate(`activity-thread/${activityThread.id}?title=${activityThread.name}`)
+  }
+}

package/client/pages/todo/draft-list-page.ts

@@ -15,7 +15,8 @@ import { CommonGristStyles, ScrollbarStyles } from '@operato/styles'
 import { isMobileDevice } from '@operato/utils'
 import { OxPopup } from '@operato/popup'
 
-import { ActivityInstanceStatus, Priorities } from '../../types.js'
+import { ActivityInstanceStatus } from '../../types/activity-instance'
+import { Priorities } from '../../types/types.js'
 
 const MIN = 60
 const HOUR = 60 * MIN
@@ -193,7 +194,17 @@ export class DraftListPage extends connect(store)(localize(i18next)(PageView)) {
           header: i18next.t('field.status'),
           record: {
             editable: false,
-            options: ActivityInstanceStatus
+            options: [
+              { display: 'Draft', value: 'draft' },
+              { display: 'Posted', value: 'posted' },
+              { display: 'WaitingAssignment', value: 'waiting-assignment' },
+              { display: 'Assigned', value: 'assigned' },
+              { display: 'Started', value: 'started' },
+              { display: 'Pending', value: 'pending' },
+              { display: 'Escalated', value: 'escalated' },
+              { display: 'Ended', value: 'ended' },
+              { display: 'Aborted', value: 'aborted' }
+            ]
           },
           // filter: true,
           width: 60

package/client/pages/todo/todo-list-page.ts

@@ -14,7 +14,8 @@ import { navigate, PageView, store } from '@operato/shell'
 import { CommonGristStyles, ScrollbarStyles } from '@operato/styles'
 import { isMobileDevice, sleep } from '@operato/utils'
 
-import { ActivityInstanceStatus, Priorities } from '../../types.js'
+import { ActivityInstanceStatus } from '../../types/activity-instance'
+import { Priorities } from '../../types/types.js'
 
 const MIN = 60
 const HOUR = 60 * MIN
@@ -183,9 +184,19 @@ export class TodoListPage extends connect(store)(localize(i18next)(PageView)) {
           header: i18next.t('field.status'),
           record: {
             editable: false,
-            options: ActivityInstanceStatus
+            options: [
+              { display: 'Draft', value: 'draft' },
+              { display: 'Posted', value: 'posted' },
+              { display: 'WaitingAssignment', value: 'waiting-assignment' },
+              { display: 'Assigned', value: 'assigned' },
+              { display: 'Started', value: 'started' },
+              { display: 'Pending', value: 'pending' },
+              { display: 'Escalated', value: 'escalated' },
+              { display: 'Ended', value: 'ended' },
+              { display: 'Aborted', value: 'aborted' }
+            ]
           },
-          // filter: true,
+          filter: false,
           width: 60
         },
         {

package/client/route.ts

@@ -16,6 +16,10 @@ export default function route(page: string) {
       import('./pages/todo/todo-list-page.js')
       return page
 
+    case 'done-list':
+      import('./pages/todo/done-list-page.js')
+      return page
+
     case 'approval-waiting-list':
       import('./pages/todo/approval-waiting-list-page.js')
       return page
@@ -60,6 +64,10 @@ export default function route(page: string) {
       import('./pages/activity-instance/activity-instance-list-page.js')
       return page
 
+    case 'activity-instance-search':
+      import('./pages/activity-instance/activity-instance-search-page.js')
+      return page
+
     case 'activity-template-list':
       import('./pages/activity-template/activity-template-list-page.js')
       return page

package/client/types/activity-instance-type.ts

@@ -0,0 +1,123 @@
+import { Role } from '@operato/shell'
+import { ApprovalLineItem } from '@things-factory/organization'
+
+import { ActivityType, ActivityUIType } from './activity'
+import { AssigneeItem, ActivityInstance, ActivityInstanceStatus } from './activity-instance'
+
+export class NewActivityInstance {
+  name?: string
+
+  activityId?: string
+
+  description?: string
+
+  priority?: number
+
+  reason?: string
+
+  threadsMin?: number
+
+  threadsMax?: number
+
+  dueAt?: Date
+
+  input?: { [key: string]: any }
+
+  adhocType?: string
+
+  refBy?: string
+
+  activityType?: ActivityType
+
+  uiType?: ActivityUIType
+
+  uiSource?: string
+
+  supervisoryRole?: Role
+
+  assigneeRole?: Role
+
+  assignees?: AssigneeItem[]
+
+  approvalLine?: ApprovalLineItem[]
+}
+
+export class ActivityInstancePost {
+  id?: string
+
+  name?: string
+
+  activityId?: string
+
+  description?: string
+
+  priority?: number
+
+  reason?: string
+
+  threadsMin?: number
+
+  threadsMax?: number
+
+  dueAt?: Date
+
+  input?: { [key: string]: any }
+
+  adhocType?: string
+
+  refBy?: string
+
+  activityType?: ActivityType
+
+  uiType?: ActivityUIType
+
+  uiSource?: string
+
+  supervisoryRole?: Role
+
+  assigneeRole?: Role
+
+  assignees?: AssigneeItem[]
+
+  approvalLine?: ApprovalLineItem[]
+}
+
+export class ActivityInstanceSave {
+  output?: { [key: string]: any }
+
+  assignees?: AssigneeItem[]
+
+  approvalLine?: ApprovalLineItem[]
+}
+
+export class ActivityInstancePatch {
+  id?: string
+
+  name?: string
+
+  description?: string
+
+  priority?: number
+
+  state?: ActivityInstanceStatus
+
+  threadsMin?: number
+
+  threadsMax?: number
+
+  dueAt?: Date
+
+  input?: { [key: string]: any }
+
+  assignees?: AssigneeItem[]
+
+  approvalLine?: ApprovalLineItem[]
+
+  cuFlag?: string
+}
+
+export class ActivityInstanceList {
+  items?: ActivityInstance[]
+
+  total?: number
+}