@things-factory/dataset 7.0.0-alpha.4 → 7.0.0-alpha.6

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

@@ -38,13 +38,7 @@ export class DataCollectActivityEdit extends localize(i18next)(LitElement) {
   @query('ox-data-entry-form') entryForm!: OxDataEntryForm
 
   render() {
-    return html`
-      <ox-data-entry-form
-        .dataSet=${this.dataSet}
-        .value=${this.output}
-        @change=${this._updateDataItems}
-      ></ox-data-entry-form>
-    `
+    return html` <ox-data-entry-form .dataSet=${this.dataSet} .value=${this.output} @change=${this._updateDataItems}></ox-data-entry-form> `
   }
 
   async _updateDataItems() {

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

@@ -31,34 +31,6 @@ export class DataReviewActivityEdit extends localize(i18next)(LitElement) {
         padding: var(--padding-wide);
         overflow: auto;
       }
-
-      label[instruction] {
-        display: flex;
-        flex-direction: column;
-
-        padding: var(--padding-wide);
-      }
-
-      label[instruction] div {
-        display: flex;
-      }
-
-      mwc-icon {
-        color: var(--status-danger-color);
-      }
-
-      textarea {
-        border: var(--input-field-border);
-        border-radius: var(--input-border-radius);
-        padding: var(--input-field-padding);
-        font: var(--input-field-font);
-      }
-
-      .button-container {
-        display: flex;
-        margin-left: auto;
-        padding: var(--padding-default);
-      }
     `
   ]
 

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

@@ -31,34 +31,6 @@ export class DataReviewActivityView extends localize(i18next)(LitElement) {
         padding: var(--padding-wide);
         overflow: auto;
       }
-
-      label[instruction] {
-        display: flex;
-        flex-direction: column;
-
-        padding: var(--padding-wide);
-      }
-
-      label[instruction] div {
-        display: flex;
-      }
-
-      mwc-icon {
-        color: var(--status-danger-color);
-      }
-
-      textarea {
-        border: var(--input-field-border);
-        border-radius: var(--input-border-radius);
-        padding: var(--input-field-padding);
-        font: var(--input-field-font);
-      }
-
-      .button-container {
-        display: flex;
-        margin-left: auto;
-        padding: var(--padding-default);
-      }
     `
   ]
 

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

@@ -1,7 +1,8 @@
-import '@operato/dataset/ox-data-sample-view.js'
+import '@operato/dataset/ox-data-ooc-brief-view.js'
+// import '@operato/dataset/ox-data-ooc-correction-part.js'
 
 import gql from 'graphql-tag'
-import { css, html, LitElement } from 'lit'
+import { css, html, LitElement, nothing } from 'lit'
 import { customElement, property, query, state } from 'lit/decorators.js'
 
 import { client } from '@operato/graphql'
@@ -28,35 +29,12 @@ class OocResolveActivityEdit extends localize(i18next)(LitElement) {
         overflow: auto;
       }
 
-      ox-data-sample-view {
+      ox-data-ooc-brief-view {
         flex: 1;
         padding: var(--padding-wide);
         overflow: auto;
       }
 
-      div[instruction] {
-        display: flex;
-        flex-direction: column;
-
-        padding: var(--padding-wide);
-      }
-
-      label[instruction] {
-        display: flex;
-        flex-direction: column;
-
-        padding: var(--padding-wide);
-      }
-
-      label[instruction] h2 {
-        display: flex;
-
-        color: var(--title-text-color);
-        text-transform: capitalize;
-        margin: var(--title-margin);
-        align-items: center;
-      }
-
       label[action] {
         display: flex;
         flex-direction: column;
@@ -79,25 +57,21 @@ class OocResolveActivityEdit extends localize(i18next)(LitElement) {
 
       textarea {
         border: var(--input-field-border);
-        border-radius: var(--input-border-radius);
-        padding: var(--input-field-padding);
+        border-radius: 10px;
+        margin: var(--margin-default);
+        padding: var(--input-padding);
         font: var(--input-field-font);
 
         resize: none;
         outline: none;
         min-height: 200px;
       }
-
-      .button-container {
-        display: flex;
-        margin-left: auto;
-        padding: var(--padding-default);
-      }
     `
   ]
 
   @property({ type: Object }) input?: any
   @property({ type: Object }) output?: any
+  @property({ type: Object }) activityThread?: any
 
   @state() dataOoc?: any
 
@@ -105,25 +79,24 @@ class OocResolveActivityEdit extends localize(i18next)(LitElement) {
 
   render() {
     const action = this.output?.action
+    const state = this.activityThread?.state
+    const editable = state == 'assigned' || state == 'started'
 
     return html`
       <div content>
-        <ox-data-sample-view .dataSample=${this.dataOoc}></ox-data-sample-view>
+        <ox-data-ooc-brief-view .dataOoc=${this.dataOoc}></ox-data-ooc-brief-view>
       </div>
 
-      <div instruction>
-        <h2><mwc-icon>build_circle</mwc-icon>&nbsp;<span>${i18next.t('label.corrective instruction')}</span></h2>
-        <div content>${this.input?.instruction}</div>
-      </div>
+      <!-- <ox-data-ooc-correction-part .dataOoc=${this.dataOoc}></ox-data-ooc-correction-part> -->
 
-      <label action>
-        <h2><mwc-icon>build_circle</mwc-icon>&nbsp;<span>${i18next.t('label.corrective action')}</span></h2>
-        <textarea
-          placeholder=${String(i18next.t('text.corrective action placeholder'))}
-          .value=${action || ''}
-          @change=${this.onChangeAction}
-        ></textarea>
-      </label>
+      ${editable
+        ? html`
+            <label action>
+              <h2><mwc-icon>build_circle</mwc-icon>&nbsp;<span>${i18next.t('label.corrective action')}</span></h2>
+              <textarea placeholder=${String(i18next.t('text.corrective action placeholder'))} .value=${action || ''} @change=${this.onChangeAction}></textarea>
+            </label>
+          `
+        : nothing}
     `
   }
 
@@ -162,6 +135,9 @@ class OocResolveActivityEdit extends localize(i18next)(LitElement) {
               useCase
               data
               judgment
+              history
+              correctiveAction
+              correctiveInstruction
               dataItems {
                 name
                 description
@@ -178,7 +154,17 @@ class OocResolveActivityEdit extends localize(i18next)(LitElement) {
               }
               workDate
               workShift
+              reviewer {
+                id
+                name
+              }
+              corrector {
+                id
+                name
+              }
               collectedAt
+              reviewedAt
+              correctedAt
             }
           }
         `,
@@ -187,7 +173,17 @@ class OocResolveActivityEdit extends localize(i18next)(LitElement) {
         }
       })
 
-      this.dataOoc = response.data.dataOoc
+      const dataOoc = {
+        ...response.data.dataOoc
+      }
+
+      if (this.activityThread?.output) {
+        dataOoc.correctiveAction = this.activityThread.output.action
+        dataOoc.correctedAt = this.activityThread.updatedAt
+        dataOoc.corrector = this.activityThread.assignee
+      }
+
+      this.dataOoc = dataOoc
     }
   }
 }

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

@@ -9,7 +9,7 @@ import { i18next, localize } from '@operato/i18n'
 import { ScrollbarStyles } from '@operato/styles'
 
 @customElement('activity-ooc-resolve-view')
-class OocResolveActivityView extends localize(i18next)(LitElement) {
+export class OocResolveActivityView extends localize(i18next)(LitElement) {
   static styles = [
     ScrollbarStyles,
     css`
@@ -33,47 +33,12 @@ class OocResolveActivityView extends localize(i18next)(LitElement) {
         padding: var(--padding-wide);
         overflow: auto;
       }
-
-      div[instruction] {
-        display: flex;
-        flex-direction: column;
-
-        padding: var(--padding-wide);
-      }
-
-      div[instruction] div {
-        display: flex;
-      }
-
-      div[instruction] div[content] {
-        display: flex;
-        min-height: 50px;
-      }
-
-      div[action] {
-        display: flex;
-        flex-direction: column;
-
-        padding: var(--padding-wide);
-      }
-
-      div[action] div {
-        display: flex;
-      }
-
-      div[action] div[content] {
-        display: flex;
-        min-height: 50px;
-      }
-
-      mwc-icon {
-        color: var(--status-danger-color);
-      }
     `
   ]
 
   @property({ type: Object }) input?: any
   @property({ type: Object }) output?: any
+  @property({ type: Object }) activityApproval?: any
 
   @state() dataOoc?: any
 
@@ -147,7 +112,20 @@ class OocResolveActivityView extends localize(i18next)(LitElement) {
         }
       })
 
-      this.dataOoc = response.data.dataOoc
+      const dataOoc = {
+        ...response.data.dataOoc
+      }
+
+      const activityThread = this.activityApproval?.activityThread
+
+      if (activityThread?.output) {
+        /* approval 에서 사용되는 경우 corrective 관련정보를 보완한다. - approval과정에서는 아직 dataOoc.correctiveAction 정보는 채워지지 않았기 때문. */
+        dataOoc.correctiveAction = activityThread.output.action
+        dataOoc.correctedAt = activityThread.updatedAt
+        dataOoc.corrector = activityThread.assignee
+      }
+
+      this.dataOoc = dataOoc
     }
   }
 }

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

@@ -39,47 +39,50 @@ class OocReviewActivityEdit extends localize(i18next)(LitElement) {
         flex-direction: column;
 
         padding: var(--padding-wide);
-      }
 
-      label[instruction] h2 {
-        display: flex;
+        h2 {
+          display: flex;
 
-        color: var(--title-text-color);
-        text-transform: capitalize;
-        margin: var(--title-margin);
-        align-items: center;
-      }
+          color: var(--title-text-color);
+          text-transform: capitalize;
+          margin: var(--title-margin);
+          align-items: center;
+        }
 
-      mwc-icon {
-        color: var(--status-danger-color);
-      }
+        div {
+          padding: var(--padding-wide);
+          font: var(--input-field-font);
+        }
 
-      textarea {
-        border: var(--input-field-border);
-        border-radius: var(--input-border-radius);
-        padding: var(--input-field-padding);
-        font: var(--input-field-font);
+        mwc-icon {
+          color: var(--status-danger-color);
+        }
 
-        resize: none;
-        outline: none;
-        min-height: 200px;
-      }
+        textarea {
+          border: var(--input-field-border);
+          border-radius: 10px;
+          margin: var(--margin-default);
+          padding: var(--input-padding);
+          font: var(--input-field-font);
 
-      .button-container {
-        display: flex;
-        margin-left: auto;
-        padding: var(--padding-default);
+          resize: none;
+          outline: none;
+          min-height: 200px;
+        }
       }
     `
   ]
 
   @property({ type: Object }) input?: any
   @property({ type: Object }) output?: any
+  @property({ type: Object }) activityThread?: any
 
   @state() dataOoc?: any
 
   render() {
     const instruction = this.output?.instruction
+    const { state } = this.activityThread || {}
+    const editable = state == 'assigned' || state == 'started' || state == 'submitted'
 
     return html`
       <div content>
@@ -88,11 +91,15 @@ class OocReviewActivityEdit extends localize(i18next)(LitElement) {
 
       <label instruction>
         <h2><mwc-icon>build_circle</mwc-icon>&nbsp;<span>${i18next.t('label.corrective instruction')}</span></h2>
-        <textarea
-          placeholder=${String(i18next.t('text.corrective instruction placeholder'))}
-          .value=${instruction || ''}
-          @change=${this.onChangeInstruction}
-        ></textarea>
+        ${editable
+          ? html`
+              <textarea
+                placeholder=${String(i18next.t('text.corrective instruction placeholder'))}
+                .value=${instruction || ''}
+                @change=${this.onChangeInstruction}
+              ></textarea>
+            `
+          : html`<div>${instruction}</div>`}
       </label>
     `
   }

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

@@ -33,26 +33,6 @@ class OocReviewActivityView extends localize(i18next)(LitElement) {
         padding: var(--padding-wide);
         overflow: auto;
       }
-
-      div[instruction] {
-        display: flex;
-        flex-direction: column;
-
-        padding: var(--padding-wide);
-      }
-
-      div[instruction] div {
-        display: flex;
-      }
-
-      div[instruction] div[content] {
-        display: flex;
-        min-height: 50px;
-      }
-
-      mwc-icon {
-        color: var(--status-danger-color);
-      }
     `
   ]
 
@@ -62,8 +42,6 @@ class OocReviewActivityView extends localize(i18next)(LitElement) {
   @state() dataOoc?: any
 
   render() {
-    const instruction = this.output?.instruction
-
     return html`
       <div content>
         <ox-data-ooc-brief-view .dataOoc=${this.dataOoc}></ox-data-ooc-brief-view>

package/client/bootstrap.ts

@@ -1,19 +1,15 @@
 import './activities/activity-data-collect-edit' /* refered by the activity template (activity-data-collect) on server */
-import './activities/activity-ooc-review-edit' /* refered by the activity template (activity-ooc-review) on server */
-import './activities/activity-ooc-resolve-edit' /* refered by the activity template (activity-ooc-resolve) on server */
 import './activities/activity-data-collect-view' /* refered by the activity template (activity-data-collect) on server */
-import './activities/activity-ooc-review-view' /* refered by the activity template (activity-ooc-review) on server */
-import './activities/activity-ooc-resolve-view' /* refered by the activity template (activity-ooc-resolve) on server */
 import './activities/activity-data-review-edit' /* refered by the activity template (activity-data-review) on server */
 import './activities/activity-data-review-view' /* refered by the activity template (activity-data-review) on server */
+import './activities/activity-ooc-review-edit' /* refered by the activity template (activity-ooc-review) on server */
+import './activities/activity-ooc-review-view' /* refered by the activity template (activity-ooc-review) on server */
+import './activities/activity-ooc-resolve-edit' /* refered by the activity template (activity-ooc-resolve) on server */
+import './activities/activity-ooc-resolve-view' /* refered by the activity template (activity-ooc-resolve) on server */
 import '@operato/app/filter-renderer.js' /* register resource-object filter renderer */
 
 import { OxGristEditorCode } from '@operato/app/grist-editor/ox-grist-editor-code.js'
-import {
-  OxGristRendererJson5,
-  registerEditor as registerGristEditor,
-  registerRenderer as registerGristRenderer
-} from '@operato/data-grist'
+import { OxGristRendererJson5, registerEditor as registerGristEditor, registerRenderer as registerGristRenderer } from '@operato/data-grist'
 import { OxGristEditorDataItemSpec } from '@operato/dataset/grist-editor/ox-grist-editor-data-item-spec.js'
 import { OxGristEditorPartitionKeys } from '@operato/grist-editor/ox-grist-editor-partition-keys.js'
 import { OxGristRendererPartitionKeys } from '@operato/grist-editor/ox-grist-renderer-partition-keys.js'

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

@@ -46,23 +46,12 @@ const showEntryView = async (columns, data, column, record, rowIndex) => {
       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
-        }
-      )
+      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
@@ -129,12 +118,7 @@ export class DataEntryListPage extends connect(store)(localize(i18next)(PageView
     const mode = 'CARD'
 
     return html`
-      <ox-grist
-        .mode=${mode}
-        .config=${this.gristConfig}
-        .fetchHandler=${this.fetchHandler.bind(this)}
-        ?url-params-sensitive=${this.active}
-      >
+      <ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)} ?url-params-sensitive=${this.active}>
         <div slot="headroom" class="header">
           <div class="title">
             <mwc-icon>summarize</mwc-icon>
@@ -300,6 +284,7 @@ export class DataEntryListPage extends connect(store)(localize(i18next)(PageView
       ],
       rows: {
         appendable: false,
+        editable: false,
         selectable: {
           multiple: false
         },

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

@@ -1,6 +1,7 @@
 import '@operato/data-grist'
 import '@operato/context/ox-context-page-toolbar.js'
 import '@operato/input/ox-input-select-buttons.js'
+
 import './data-ooc-view.js'
 
 import gql from 'graphql-tag'
@@ -8,6 +9,8 @@ import { css, html } from 'lit'
 import { customElement, property, query, state } from 'lit/decorators.js'
 import { connect } from 'pwa-helpers/connect-mixin'
 
+import { GhostPrint } from '@operato/ghost-print'
+
 function getOocStatus() {
   return [
     {
@@ -74,6 +77,13 @@ export class DataOocListPage extends connect(store)(localize(i18next)(PageView))
         }
       },
       help: 'dataset/data-ooc',
+      actions: [
+        {
+          title: i18next.t('button.print'),
+          action: this.printOocs.bind(this),
+          icon: 'print'
+        }
+      ],
       exportable: {
         name: i18next.t('title.data-ooc list'),
         data: this._exportableData.bind(this)
@@ -126,14 +136,11 @@ export class DataOocListPage extends connect(store)(localize(i18next)(PageView))
           title: i18next.t('title.view detail ooc data'),
           handlers: {
             click: (columns, data, column, record, rowIndex) => {
-              const popup = openPopup(
-                html` <data-ooc-view .dataOoc=${record} style="background-color: white;"></data-ooc-view> `,
-                {
-                  backdrop: true,
-                  size: 'large',
-                  title: i18next.t('title.data-ooc view')
-                }
-              )
+              const popup = openPopup(html` <data-ooc-view .dataOoc=${record} style="background-color: white;"></data-ooc-view> `, {
+                backdrop: true,
+                size: 'large',
+                title: i18next.t('title.data-ooc view')
+              })
               popup.onclosed = () => {
                 this.grist.fetch()
               }
@@ -479,9 +486,7 @@ export class DataOocListPage extends connect(store)(localize(i18next)(PageView))
           .filter(column => column.type !== 'gutter' && column.record !== undefined && column.imex !== undefined)
           .reduce((record, column) => {
             const key = column.imex === true ? column.name : column.imex.key
-            record[key] = key
-              .split('.')
-              .reduce((obj, key) => (obj && obj[key] !== 'undefined' ? obj[key] : undefined), item)
+            record[key] = key.split('.').reduce((obj, key) => (obj && obj[key] !== 'undefined' ? obj[key] : undefined), item)
             return record
           }, {})
       }
@@ -489,4 +494,14 @@ export class DataOocListPage extends connect(store)(localize(i18next)(PageView))
 
     return { header: headerSetting, data: data }
   }
+
+  printOocs() {
+    const selected = this.grist.selected
+    const ids = selected.map(record => record.id).join('|')
+
+    GhostPrint.print({
+      src: `./data-oocs?ids=${ids}`
+      // pending: 200 * selected.length
+    })
+  }
 }

package/client/pages/data-ooc/{data-ooc-view-page.ts → data-ooc-page.ts}

@@ -8,7 +8,7 @@ import { client } from '@operato/graphql'
 
 import './data-ooc-view.js'
 
-@customElement('data-ooc-view-page')
+@customElement('data-ooc-page')
 export class DataOocViewPage extends localize(i18next)(PageView) {
   static styles = [
     css`