@things-factory/dataset 8.0.15 → 8.0.20

package/client/activities/activity-data-collect-edit.ts

@@ -1,4 +1,5 @@
 import '@operato/dataset/ox-data-entry-form.js'
+import '@operato/dataset/ox-checklist-entry-form.js'
 
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
@@ -8,6 +9,8 @@ import { client } from '@operato/graphql'
 import { i18next, localize } from '@operato/i18n'
 import { ScrollbarStyles } from '@operato/styles'
 import { OxDataEntryForm } from '@operato/dataset/ox-data-entry-form.js'
+import { OxChecklistEntryForm } from '@operato/dataset/ox-checklist-entry-form.js'
+
 import { DataSet } from '@operato/dataset'
 
 @customElement('activity-data-collect-edit')
@@ -33,23 +36,84 @@ export class DataCollectActivityEdit extends localize(i18next)(LitElement) {
   @property({ type: Object }) input?: any
   @property({ type: Object }) output?: any
 
-  @state() dataSet?: DataSet & { id: string }
+  @state() dataSet?: DataSet & { id: string; entryType?: string; entryView?: string }
+
+  @query('ox-data-entry-form') dataEntryForm?: OxDataEntryForm
+  @query('ox-checklist-entry-form') checklistEntryForm?: OxChecklistEntryForm
+
+  get entryForm() {
+    const entryType = this.dataSet?.entryType
+    const entryView = this.dataSet?.entryView
 
-  @query('ox-data-entry-form') entryForm!: OxDataEntryForm
+    switch (entryType) {
+      case 'generated':
+        if (!entryView || entryView === 'DEFAULT') {
+          return this.dataEntryForm
+        } else if (entryView === 'CHECKLIST') {
+          return this.checklistEntryForm
+        }
+        break
+      case 'board':
+        break
+      case 'page':
+        break
+      default:
+        return this.dataEntryForm
+        break
+    }
+  }
 
   render() {
     return html`
-      <ox-data-entry-form
+      <div class="container">
+        <!-- <ox-data-entry-form
         .dataSet=${this.dataSet}
         .value=${this.output}
         @change=${this._updateDataItems}
-      ></ox-data-entry-form>
+      ></ox-data-entry-form> -->
+        ${this.showEntryView()}
+      </div>
     `
   }
 
+  private showEntryView() {
+    const entryType = this.dataSet?.entryType
+    const entryView = this.dataSet?.entryView
+
+    switch (entryType) {
+      case 'generated':
+        if (!entryView || entryView === 'DEFAULT') {
+          return html`<ox-data-entry-form
+            .dataSet=${this.dataSet}
+            .value=${this.output}
+            @change=${this._updateDataItems}
+          ></ox-data-entry-form>`
+        } else if (entryView === 'CHECKLIST') {
+          return html`<ox-checklist-entry-form
+            .dataSet=${this.dataSet}
+            .value=${this.output}
+            @change=${this._updateDataItems}
+          ></ox-checklist-entry-form>`
+        }
+        break
+      case 'board':
+        break
+      case 'page':
+        break
+      default:
+        return html`<ox-data-entry-form
+          .dataSet=${this.dataSet}
+          .value=${this.output}
+          @change=${this._updateDataItems}
+        ></ox-data-entry-form>`
+        break
+    }
+  }
+
   async _updateDataItems(e: CustomEvent) {
     e.stopPropagation()
 
+    //@ts-ignore TODO replace with following line and confirm
     this.output = this.entryForm.value
 
     this.dispatchEvent(
@@ -77,6 +141,8 @@ export class DataCollectActivityEdit extends localize(i18next)(LitElement) {
               name
               description
               useCase
+              entryType
+              entryView
               dataItems {
                 name
                 description
@@ -84,6 +150,7 @@ export class DataCollectActivityEdit extends localize(i18next)(LitElement) {
                 hidden
                 tag
                 group
+                subgroup
                 type
                 unit
                 options

package/client/activities/activity-data-review-edit.ts

@@ -1,6 +1,7 @@
 import '@material/web/icon/icon.js'
 import '@material/web/radio/radio.js'
 import '@operato/dataset/ox-data-entry-form.js'
+import '@operato/dataset/ox-checklist-sample-view.js'
 
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
@@ -113,9 +114,7 @@ export class DataReviewActivityEdit extends localize(i18next)(LitElement) {
     const editable = state == 'unassigned' || state == 'assigned' || state == 'started' || state == 'submitted'
 
     return html`
-      <div content>
-        <ox-data-sample-view .dataSample=${this.dataSample}></ox-data-sample-view>
-      </div>
+      <div content>${this.showDataSampleView()}</div>
 
       <form @change=${this.onChangeInstruction}>
         ${editable
@@ -188,6 +187,29 @@ export class DataReviewActivityEdit extends localize(i18next)(LitElement) {
     `
   }
 
+  private showDataSampleView() {
+    const dataSet = this.dataSample?.dataSet
+    const monitorType = dataSet?.monitorType
+    const monitorView = dataSet?.monitorView
+
+    switch (monitorType) {
+      case 'generated':
+        if (!monitorView || monitorView === 'DEFAULT') {
+          return html`<ox-data-sample-view .dataSample=${this.dataSample}></ox-data-sample-view>`
+        } else if (monitorView === 'CHECKLIST') {
+          return html`<ox-checklist-sample-view .dataSample=${this.dataSample}></ox-checklist-sample-view>`
+        }
+        break
+      case 'board':
+        break
+      case 'page':
+        break
+      default:
+        return html`<ox-data-sample-view .dataSample=${this.dataSample}></ox-data-sample-view>`
+        break
+    }
+  }
+
   onChangeInstruction(e: Event) {
     var output = {}
 
@@ -238,6 +260,8 @@ export class DataReviewActivityEdit extends localize(i18next)(LitElement) {
                 id
                 name
                 description
+                monitorType
+                monitorView
               }
               dataItems {
                 name
@@ -246,6 +270,7 @@ export class DataReviewActivityEdit extends localize(i18next)(LitElement) {
                 hidden
                 tag
                 group
+                subgroup
                 type
                 unit
                 options

package/client/activities/activity-data-review-view.ts

@@ -1,4 +1,5 @@
 import '@operato/dataset/ox-data-entry-form.js'
+import '@operato/dataset/ox-checklist-sample-view.js'
 
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
@@ -103,9 +104,7 @@ export class DataReviewActivityView extends localize(i18next)(LitElement) {
     const { judgment, instruction } = this.output || {}
 
     return html`
-      <div content>
-        <ox-data-sample-view .dataSample=${this.dataSample}></ox-data-sample-view>
-      </div>
+      <div content>${this.showDataSampleView()}</div>
 
       <form>
         <label>
@@ -186,6 +185,8 @@ export class DataReviewActivityView extends localize(i18next)(LitElement) {
                 id
                 name
                 description
+                monitorType
+                monitorView
               }
               dataItems {
                 name
@@ -194,6 +195,7 @@ export class DataReviewActivityView extends localize(i18next)(LitElement) {
                 hidden
                 tag
                 group
+                subgroup
                 type
                 unit
                 options
@@ -223,4 +225,27 @@ export class DataReviewActivityView extends localize(i18next)(LitElement) {
       }
     }
   }
+
+  private showDataSampleView() {
+    const dataSet = this.dataSample?.dataSet
+    const monitorType = dataSet?.monitorType
+    const monitorView = dataSet?.monitorView
+
+    switch (monitorType) {
+      case 'generated':
+        if (!monitorView || monitorView === 'DEFAULT') {
+          return html`<ox-data-sample-view .dataSample=${this.dataSample}></ox-data-sample-view>`
+        } else if (monitorView === 'CHECKLIST') {
+          return html`<ox-checklist-sample-view .dataSample=${this.dataSample}></ox-checklist-sample-view>`
+        }
+        break
+      case 'board':
+        break
+      case 'page':
+        break
+      default:
+        return html`<ox-data-sample-view .dataSample=${this.dataSample}></ox-data-sample-view>`
+        break
+    }
+  }
 }

package/client/activities/activity-ooc-resolve-edit.ts

@@ -144,6 +144,12 @@ class OocResolveActivityEdit extends localize(i18next)(LitElement) {
               history
               correctiveAction
               correctiveInstruction
+              dataSet {
+                id
+                name
+                monitorType
+                monitorView
+              }
               dataItems {
                 name
                 description
@@ -151,6 +157,7 @@ class OocResolveActivityEdit extends localize(i18next)(LitElement) {
                 hidden
                 tag
                 group
+                subgroup
                 type
                 unit
                 options

package/client/activities/activity-ooc-resolve-view.ts

@@ -89,6 +89,12 @@ export class OocResolveActivityView extends localize(i18next)(LitElement) {
               history
               correctiveAction
               correctiveInstruction
+              dataSet {
+                id
+                name
+                monitorType
+                monitorView
+              }
               dataItems {
                 name
                 description
@@ -96,6 +102,7 @@ export class OocResolveActivityView extends localize(i18next)(LitElement) {
                 hidden
                 tag
                 group
+                subgroup
                 type
                 unit
                 options

package/client/activities/activity-ooc-review-edit.ts

@@ -1,6 +1,6 @@
 import '@material/web/icon/icon.js'
 import '@operato/dataset/ox-data-sample-view.js'
-
+import '@operato/dataset/ox-checklist-sample-view.js'
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
 import { customElement, property, query, state } from 'lit/decorators.js'
@@ -89,7 +89,8 @@ class OocReviewActivityEdit extends localize(i18next)(LitElement) {
 
     return html`
       <div content>
-        <ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view>
+        ${this.showDataSampleView()}
+        <!-- <ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view> -->
       </div>
 
       <label instruction>
@@ -142,6 +143,12 @@ class OocReviewActivityEdit extends localize(i18next)(LitElement) {
               useCase
               data
               judgment
+              dataSet {
+                id
+                name
+                monitorType
+                monitorView
+              }
               dataItems {
                 name
                 description
@@ -149,6 +156,7 @@ class OocReviewActivityEdit extends localize(i18next)(LitElement) {
                 hidden
                 tag
                 group
+                subgroup
                 type
                 unit
                 options
@@ -170,4 +178,27 @@ class OocReviewActivityEdit extends localize(i18next)(LitElement) {
       this.dataOoc = response.data.dataOoc
     }
   }
+
+  private showDataSampleView() {
+    const dataSet = this.dataOoc?.dataSet
+    const monitorType = dataSet?.monitorType
+    const monitorView = dataSet?.monitorView
+
+    switch (monitorType) {
+      case 'generated':
+        if (!monitorView || monitorView === 'DEFAULT') {
+          return html`<ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view>`
+        } else if (monitorView === 'CHECKLIST') {
+          return html`<ox-checklist-sample-view .dataSample=${this.dataOoc}></ox-checklist-sample-view>`
+        }
+        break
+      case 'board':
+        break
+      case 'page':
+        break
+      default:
+        return html`<ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view>`
+        break
+    }
+  }
 }

package/client/activities/activity-ooc-review-view.ts

@@ -88,6 +88,12 @@ class OocReviewActivityView extends localize(i18next)(LitElement) {
               history
               correctiveAction
               correctiveInstruction
+              dataSet {
+                id
+                name
+                monitorType
+                monitorView
+              }
               dataItems {
                 name
                 description
@@ -95,6 +101,7 @@ class OocReviewActivityView extends localize(i18next)(LitElement) {
                 hidden
                 tag
                 group
+                subgroup
                 type
                 unit
                 options

package/client/components/data-entry-form.ts

@@ -1,5 +1,6 @@
 import '@material/web/icon/icon.js'
 import '@operato/dataset/ox-data-entry-form.js'
+import '@operato/dataset/ox-checklist-entry-form.js'
 
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit'
@@ -8,8 +9,9 @@ import { customElement, property, query, state } from 'lit/decorators.js'
 import { client } from '@operato/graphql'
 import { i18next, localize } from '@operato/i18n'
 import { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'
-import { OxDataEntryForm } from '@operato/dataset/ox-data-entry-form.js'
 import { DataSet } from '@operato/dataset'
+import { OxDataEntryForm } from '@operato/dataset/ox-data-entry-form.js'
+import { OxChecklistEntryForm } from '@operato/dataset/ox-checklist-entry-form.js'
 
 @customElement('data-entry-form')
 export class DataEntryForm extends localize(i18next)(LitElement) {
@@ -39,15 +41,38 @@ export class DataEntryForm extends localize(i18next)(LitElement) {
     `
   ]
 
-  @property({ type: Object }) dataSet?: DataSet & { id: string }
+  @property({ type: Object }) dataSet?: DataSet & { id: string; entryType?: string; entryView?: string }
 
   @state() dataSample?: { id: string; collectedAt: Date }
 
-  @query('ox-data-entry-form') entryForm!: OxDataEntryForm
+  @query('ox-data-entry-form') dataEntryForm?: OxDataEntryForm
+  @query('ox-checklist-entry-form') checklistEntryForm?: OxChecklistEntryForm
+
+  get entryForm() {
+    const entryType = this.dataSet?.entryType
+    const entryView = this.dataSet?.entryView
+
+    switch (entryType) {
+      case 'generated':
+        if (!entryView || entryView === 'DEFAULT') {
+          return this.dataEntryForm
+        } else if (entryView === 'CHECKLIST') {
+          return this.checklistEntryForm
+        }
+        break
+      case 'board':
+        break
+      case 'page':
+        break
+      default:
+        return this.dataEntryForm
+        break
+    }
+  }
 
   render() {
     return html`
-      <ox-data-entry-form .dataSet=${this.dataSet}></ox-data-entry-form>
+      ${this.showEntryView()}
 
       <div class="footer">
         <div filler></div>
@@ -62,6 +87,28 @@ export class DataEntryForm extends localize(i18next)(LitElement) {
     `
   }
 
+  private showEntryView() {
+    const entryType = this.dataSet?.entryType
+    const entryView = this.dataSet?.entryView
+
+    switch (entryType) {
+      case 'generated':
+        if (!entryView || entryView === 'DEFAULT') {
+          return html`<ox-data-entry-form .dataSet=${this.dataSet}></ox-data-entry-form>`
+        } else if (entryView === 'CHECKLIST') {
+          return html`<ox-checklist-entry-form .dataSet=${this.dataSet}></ox-checklist-entry-form>`
+        }
+        break
+      case 'board':
+        break
+      case 'page':
+        break
+      default:
+        return html`<ox-data-entry-form .dataSet=${this.dataSet}></ox-data-entry-form>`
+        break
+    }
+  }
+
   private async updateDataItems() {
     //@ts-ignore TODO replace with following line and confirm
     const data = this.entryForm.buildValue()

package/client/pages/data-entry/checklist-entry-page.ts

@@ -173,7 +173,7 @@ export class ChecklistEntryPage extends localize(i18next)(PageView) {
         id: this.dataSetId
       },
       data
-    } as DataSample | { id: string; collectedAt: Date }
+    } as any
 
     if (this.dataSample?.collectedAt) {
       dataSample.collectedAt = this.dataSample.collectedAt

package/client/pages/data-entry/data-entry-list-page.ts

@@ -432,6 +432,7 @@ export class DataEntryListPage extends connect(store)(localize(i18next)(PageView
                 hidden
                 tag
                 group
+                subgroup
                 type
                 unit
                 options

package/client/pages/data-ooc/data-ooc-page.ts

@@ -68,6 +68,8 @@ export class DataOocViewPage extends localize(i18next)(PageView) {
             dataSet {
               id
               name
+              monitorType
+              monitorView
             }
             key01
             key02
@@ -82,6 +84,7 @@ export class DataOocViewPage extends localize(i18next)(PageView) {
               hidden
               tag
               group
+              subgroup
               type
               unit
               options

package/client/pages/data-ooc/data-ooc-view.ts

@@ -120,6 +120,8 @@ export class DataOocView extends localize(i18next)(LitElement) {
             dataSet {
               id
               name
+              monitorType
+              monitorView
             }
             key01
             key02
@@ -134,6 +136,7 @@ export class DataOocView extends localize(i18next)(LitElement) {
               hidden
               tag
               group
+              subgroup
               type
               unit
               options

package/client/pages/data-sample/data-sample-view.ts

@@ -2,6 +2,7 @@ import '@material/web/icon/icon.js'
 import '@material/web/fab/fab.js'
 import '@operato/dataset/ox-data-sample-view.js'
 import '@operato/dataset/ox-data-ooc-brief-view.js'
+import '@operato/dataset/ox-checklist-sample-view.js'
 import '@things-factory/worklist/dist-client/components/activity-thread-timeline.js'
 
 import gql from 'graphql-tag'
@@ -77,7 +78,7 @@ export class DataSampleView extends localize(i18next)(LitElement) {
 
     return html`
       ${!dataSample?.dataOoc
-        ? html` <ox-data-sample-view .dataSample=${dataSample}></ox-data-sample-view> `
+        ? html`${this.showDataSampleView()}`
         : html` <ox-data-ooc-brief-view .dataOoc=${dataSample!.dataOoc}></ox-data-ooc-brief-view>`}
       ${reviewActivityThread
         ? html`
@@ -118,6 +119,29 @@ export class DataSampleView extends localize(i18next)(LitElement) {
     }
   }
 
+  private showDataSampleView() {
+    const dataSet = this.dataSample?.dataSet
+    const monitorType = dataSet?.monitorType
+    const monitorView = dataSet?.monitorView
+
+    switch (monitorType) {
+      case 'generated':
+        if (!monitorView || monitorView === 'DEFAULT') {
+          return html`<ox-data-sample-view .dataSample=${this.dataSample}></ox-data-sample-view>`
+        } else if (monitorView === 'CHECKLIST') {
+          return html`<ox-checklist-sample-view .dataSample=${this.dataSample}></ox-checklist-sample-view>`
+        }
+        break
+      case 'board':
+        break
+      case 'page':
+        break
+      default:
+        return html`<ox-data-sample-view .dataSample=${this.dataSample}></ox-data-sample-view>`
+        break
+    }
+  }
+
   async fetchDataSample() {
     const id = this.dataSampleId
 
@@ -147,6 +171,8 @@ export class DataSampleView extends localize(i18next)(LitElement) {
               id
               name
               description
+              monitorType
+              monitorView
             }
             dataItems {
               name
@@ -155,6 +181,7 @@ export class DataSampleView extends localize(i18next)(LitElement) {
               hidden
               tag
               group
+              subgroup
               type
               unit
               options
@@ -175,6 +202,8 @@ export class DataSampleView extends localize(i18next)(LitElement) {
               dataSet {
                 id
                 name
+                monitorType
+                monitorView
               }
               key01
               key02
@@ -189,6 +218,7 @@ export class DataSampleView extends localize(i18next)(LitElement) {
                 hidden
                 tag
                 group
+                subgroup
                 type
                 unit
                 options

package/client/pages/data-set/data-set-list-page.ts

@@ -17,11 +17,12 @@ import { OxDataUseCase } from '@operato/dataset'
 import { client } from '@operato/graphql'
 import { i18next, localize } from '@operato/i18n'
 import { notify, openPopup } from '@operato/layout'
-import { PageView, store } from '@operato/shell'
+import { PageView, store, navigate } from '@operato/shell'
 import { CommonGristStyles, CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'
 import { isMobileDevice, sleep } from '@operato/utils'
 
 import { p13n } from '@operato/p13n'
+import { provider } from '@things-factory/board-ui/dist-client'
 
 const MIN = 60
 const HOUR = 60 * MIN
@@ -89,6 +90,54 @@ const USECASE_OPTIONS = () => {
   })
 }
 
+export const showEntryView = async (columns, data, column, record, rowIndex) => {
+  const { name, entryType, entryView } = record
+  const title = `${name} - ${i18next.t('title.data-entry-form')}`
+
+  switch (entryType) {
+    case 'generated':
+      openPopup(html` <data-entry-form .dataSet=${record} style="background-color: white;"></data-entry-form> `, {
+        closable: true,
+        backdrop: true,
+        size: 'large',
+        title
+      })
+      break
+
+    case 'board':
+      const board = {
+        id: entryView
+      }
+      openPopup(
+        html`
+          <ox-board-viewer
+            style="background-color: white;"
+            .board=${board}
+            .provider=${provider}
+            hide-fullscreen
+            hide-navigation
+          ></ox-board-viewer>
+        `,
+        {
+          closable: true,
+          backdrop: true,
+          size: 'large',
+          title
+        }
+      )
+
+      // navigate(`board-viewer/${entryView}?interactive=true&title=${title}`)
+      break
+    case 'page':
+      navigate(`${entryView}/${record.id}`)
+      break
+
+    case 'external':
+      window.open(entryView, '_blank')
+      break
+  }
+}
+
 @customElement('data-set-list-page')
 export class DataSetListPage extends connect(store)(p13n(localize(i18next)(PageView))) {
   static styles = [
@@ -255,16 +304,7 @@ export class DataSetListPage extends connect(store)(p13n(localize(i18next)(PageV
           title: record =>
             !record ? i18next.t('button.enter-data') : !record.id ? '' : i18next.t('button.enter-data'),
           handlers: {
-            click: (columns, data, column, record, rowIndex) => {
-              openPopup(
-                html` <data-entry-form .dataSet=${record} style="background-color: white;"></data-entry-form> `,
-                {
-                  backdrop: true,
-                  size: 'large',
-                  title: i18next.t('title.data-entry-form')
-                }
-              )
-            }
+            click: showEntryView
           }
         },
         {