@operato/dataset 7.1.31 → 7.1.33

package/src/ox-data-summary-view.ts

@@ -1,198 +0,0 @@
-import '@operato/input/ox-input-file.js'
-import '@operato/input/ox-input-signature.js'
-
-import { css, html, LitElement } from 'lit'
-import { customElement, property } from 'lit/decorators.js'
-
-import { i18next } from '@operato/i18n'
-
-import { DataSummary, DataSpecLimitSet } from './types.js'
-import { OxDataUseCase } from './usecase/ox-data-use-case.js'
-
-@customElement('ox-data-summary-view')
-export class OxDataSummaryView extends LitElement {
-  static styles = css`
-    :host {
-      display: flex;
-      flex-direction: column;
-    }
-
-    form {
-      flex: 1;
-
-      display: flex;
-      flex-direction: column;
-    }
-
-    h2 {
-      margin: var(--title-margin);
-      font: var(--title-font);
-      color: var(--title-text-color);
-      text-transform: capitalize;
-    }
-    [page-description] {
-      margin: var(--page-description-margin);
-      opacity: 0.7;
-      font: var(--page-description-font);
-      color: var(--md-sys-color-on-secondary-container);
-      text-transform: capitalize;
-    }
-    [page-description] * {
-      vertical-align: middle;
-    }
-    [page-description] md-icon {
-      margin-top: -2px;
-      font-size: 0.9rem;
-      color: var(--page-description-color);
-    }
-
-    table {
-      border-collapse: collapse;
-      margin-bottom: var(--spacing-medium);
-    }
-    th {
-      padding: var(--th-padding);
-      border-top: var(--th-border-top);
-      border-bottom: var(--td-border-bottom);
-      text-transform: var(--th-text-transform);
-      font: var(--th-font);
-      color: var(--th-color);
-      text-align: left;
-    }
-    th[item] {
-      min-width: 100px;
-    }
-    th[value] {
-      min-width: 100px;
-    }
-    tr {
-      background-color: var(--tr-background-color);
-    }
-    tr:nth-child(odd) {
-      background-color: var(--tr-background-odd-color);
-    }
-    tr:hover {
-      background-color: var(--tr-background-hover-color);
-    }
-    tr[ooc],
-    tr[oos] {
-      background-color: #fefbdf;
-    }
-    td {
-      border-bottom: var(--td-border-bottom);
-      padding: var(--td-padding);
-      font: var(--td-font);
-      color: var(--td-color);
-    }
-    td[name] {
-      font-weight: bold;
-    }
-    td md-icon {
-      color: var(--md-sys-color-error);
-    }
-
-    pre {
-      tab-size: 2;
-    }
-
-    @media screen and (max-width: 480px) {
-      th {
-        min-width: 50px;
-      }
-    }
-  `
-
-  @property({ type: Object }) dataSummary?: DataSummary
-
-  render() {
-    if (!this.dataSummary) {
-      return html``
-    }
-
-    const { name, description, date, period, summary = {}, dataItems = [], useCase } = this.dataSummary
-    const useCaseNames = useCase?.split(',').filter(useCase => useCase.trim()) || []
-
-    return html` <h2>${name}</h2>
-      <p page-description>
-        <md-icon>info</md-icon> ${description}<br />
-        <md-icon>alarm</md-icon> ${i18next.t('field.date')}: ${date} ${period}
-      </p>
-
-      <form>
-        <table>
-          <tr>
-            <th item>${i18next.t('field.item')}</th>
-            <th>${i18next.t('field.description')}</th>
-            <th>${i18next.t('field.finalizing-function')}</th>
-            <th>${i18next.t('field.unit')}</th>
-            <th value>${i18next.t('field.value')}</th>
-            <th>${i18next.t('field.spec')}</th>
-          </tr>
-          ${dataItems
-            .filter(dataItem => dataItem.stat)
-            .map(dataItem => {
-              const { name = '', tag = '', description = '', stat, unit = '', spec = {}, type } = dataItem
-              const value = summary[tag]
-
-              return html`
-                <tr>
-                  <td name>${name}</td>
-                  <td>${description}</td>
-                  <td>${stat}</td>
-                  <td>${unit}</td>
-                  <td>${this.buildValue(type, value)}</td>
-                  <td><pre>${this.buildSpec(useCaseNames, spec)}</pre></td>
-                </tr>
-              `
-            })}
-        </table>
-      </form>`
-  }
-
-  private buildSpec(useCaseNames: string[], spec: DataSpecLimitSet): string {
-    return OxDataUseCase.elaborateDataItemSpec(useCaseNames, spec)
-  }
-
-  private download(file: { mimetype: string; name: string; fullpath: string }) {
-    const element = document.createElement('a')
-    element.setAttribute('href', file.fullpath)
-    element.setAttribute('download', file.name!)
-    document.body.appendChild(element)
-    element.click()
-  }
-
-  private buildValue(type: string, value: any | any[]) {
-    if (value === undefined) {
-      return ''
-    }
-    const values = value instanceof Array ? value : [value]
-
-    if (type == 'file') {
-      const files = values.flat() as { mimetype: string; name: string; fullpath: string }[]
-
-      return files.filter(Boolean).map(file => html`<a @click=${() => this.download(file)}>${file.name}</a></br>`)
-    }
-
-    if (type == 'signature') {
-      return html` <ox-input-signature .value=${value} disabled></ox-input-signature>`
-    }
-
-    const elements = values.map((v: any, idx) => {
-      switch (typeof v) {
-        case 'boolean':
-          return html` <input type="checkbox" .checked=${v} disabled />`
-          break
-
-        default:
-          if (type == 'date') {
-            return new Date(v).toLocaleDateString()
-          } else if (type == 'datetime') {
-            return new Date(v).toLocaleString()
-          }
-          return v ?? ''
-      }
-    })
-
-    return typeof values[0] === 'boolean' ? elements : elements.join(', ')
-  }
-}

package/src/types.ts

@@ -1,178 +0,0 @@
-/**
- * Represents a selectable option with a text label and a value.
- */
-export type SelectOption = {
-  text: string
-  value: string
-}
-/**
- * An array of selectable options.
- */
-export type SelectOptions = SelectOption[]
-/**
- * Defines the options and additional properties for a type.
- */
-export type TypeOptions = {
-  options?: SelectOptions
-  [prop: string]: any
-}
-/**
- * Describes the structure and properties of a data item.
- */
-export type DataItem = {
-  name: string
-  description: string
-  sequence: number
-  tag: string
-  group: string
-  type: string
-  stat: string
-  active: boolean
-  options: TypeOptions
-  unit: string
-  quota: number
-  hidden: boolean
-  spec: {
-    [useCase: string]: {
-      [limit: string]: number | string | string[] | boolean
-    }
-  }
-}
-/**
- * Defines the structure of a dataset, including its name, description, type, use case, and data items.
- */
-export type DataSet = {
-  name: string
-  description: string
-  type: 'manual' | 'automatic'
-  useCase: string
-  active: boolean
-  dataItems: DataItem[]
-  spec: {
-    [dataItem: string]: {
-      [useCase: string]: any
-    }
-  }
-}
-/**
- * Describes the definition of a data specification, including its type, label, name, and optional properties.
- */
-export type DataSpecDefinition = {
-  type: string
-  label: string
-  name: string
-  property?: {
-    [option: string]: any
-  }
-}
-/**
- * Describes a use case definition, including its name, description, help text, and specifications.
- */
-export type UseCaseDefinition = {
-  name: string
-  description: string
-  help: string
-  specs: DataSpecDefinition[]
-}
-/**
- * Represents the limits for a data specification.
- */
-export type DataSpecLimit = {
-  [limit: string]: number | string | string[] | boolean
-}
-/**
- * A set of data specification limits, keyed by use case.
- */
-export type DataSpecLimitSet = {
-  [useCase: string]: DataSpecLimit
-}
-/**
- * Represents a collection of data, keyed by a tag.
- */
-export type DataCollection = {
-  [tag: string]: any
-}
-/**
- * Represents a judgment on data, indicating if it is out of control or out of specification.
- */
-export type Judgment = {
-  [tag: string]: {
-    ooc: boolean
-    oos: boolean
-  }
-}
-/**
- * Describes a data sample, including its name, description, use case, and associated data and judgments.
- */
-export type DataSample = {
-  name?: string
-  description?: string
-  useCase?: string
-  data?: DataCollection
-  judgment?: Judgment
-  dataItems?: DataItem[]
-  quota?: number
-  workDate?: string
-  workShift?: string
-  collectedAt?: Date
-  reviewActivityInstance?: any
-  dataOoc?: DataOoc
-}
-export type DataOocState = 'ISSUED' | 'REVIEWED' | 'CORRECTED'
-/**
- * Extends DataSample with additional fields specific to an out of control state, including state, corrective actions, and review history.
- */
-export type DataOoc = DataSample & {
-  state?: DataOocState
-  correctiveInstruction?: string
-  correctiveAction?: string
-  reviewer?: {
-    id: string
-    name: string
-  }
-  reviewedAt?: Date
-  corrector?: {
-    id: string
-    name: string
-  }
-  correctedAt?: Date
-  history?: {
-    user: {
-      id: string
-      name: string
-    }
-    state: DataOocState
-    comment: string
-    timestamp: number
-  }[]
-  resolveActivityInstance?: any
-}
-/**
- * Describes a summary of data, including its name, description, relevant data items, and key metrics.
- */
-export type DataSummary = {
-  name: string
-  description: string
-  dataItems?: DataItem[]
-  date?: string
-  period?: string
-  key01?: string
-  key02?: string
-  key03?: string
-  key04?: string
-  key05?: string
-  count?: number
-  countOoc?: number
-  countOos?: number
-  useCase?: string
-  summary?: {
-    [key: string]: any
-  }
-}
-/**
- * Represents the result of an evaluation, indicating if data is out of specification or out of control.
- */
-export type EvaluationResult = {
-  oos: boolean
-  ooc: boolean
-}

package/src/usecase/ccp/index.ts

@@ -1,10 +0,0 @@
-/* Here, only the common module of client and server is imported/exported. Be careful not to use a module dedicated to client or server. */
-
-import { OxDataUseCase } from '../ox-data-use-case'
-import { OxDataUseCaseCCP } from './ox-data-use-case-ccp'
-
-// OxPropertyEditor.register({
-//   'ccp-limits': 'ox-property-editor-ccp-limits'
-// })
-
-OxDataUseCase.registerUseCase('CCP', new OxDataUseCaseCCP())

package/src/usecase/ccp/ox-data-use-case-ccp.ts

@@ -1,147 +0,0 @@
-import i18next from 'i18next' // Since this is a common module, @operato/i18n was deliberately avoided.
-
-import { DataItem, EvaluationResult, UseCaseDefinition } from '../../types'
-import { OxDataUseCase } from '../ox-data-use-case.js'
-
-export class OxDataUseCaseCCP extends OxDataUseCase {
-  getSpecification(dataItem: DataItem): UseCaseDefinition {
-    return {
-      name: 'CCP',
-      description: 'Critical Control Point Data Spec',
-      help: '',
-      specs: [
-        {
-          type: 'ccp-limits' /* A value which seperates acceptability from unacceptability */,
-          label: 'critical-limits',
-          name: 'criticalLimits',
-          property: dataItem
-        },
-        {
-          type: 'ccp-limits',
-          label: 'target-limits',
-          name: 'targetLimits',
-          property: dataItem
-        }
-      ]
-    }
-  }
-
-  evaluate(spec: any, values: any | any[]): EvaluationResult | undefined {
-    if (!spec || typeof values === 'undefined') {
-      return
-    }
-
-    if (!(values instanceof Array)) {
-      values = [values]
-    }
-
-    const {
-      minimum: criticalMinimum,
-      maximum: criticalMaximum,
-      acceptables: criticalAcceptables
-    } = spec['criticalLimits'] || {}
-
-    const {
-      minimum: targetMinimum,
-      maximum: targetMaximum,
-      acceptables: targetAcceptables
-    } = spec['targetLimits'] || {}
-
-    var oos = false
-    var ooc = false
-
-    for (let i = 0; i < values.length; i++) {
-      const value = values[i]
-
-      if (criticalMinimum != null && value < criticalMinimum) {
-        oos = true
-        break
-      }
-
-      if (criticalMaximum != null && value > criticalMaximum) {
-        oos = true
-        break
-      }
-
-      if (criticalAcceptables != null && !criticalAcceptables.includes(value)) {
-        oos = true
-        break
-      }
-    }
-
-    for (let i = 0; i < values.length; i++) {
-      const value = values[i]
-
-      if (targetMinimum != null && value < targetMinimum) {
-        ooc = true
-        break
-      }
-
-      if (targetMaximum != null && value > targetMaximum) {
-        ooc = true
-        break
-      }
-
-      if (targetAcceptables != null && !targetAcceptables.includes(value)) {
-        ooc = true
-        break
-      }
-    }
-
-    return { oos, ooc }
-  }
-
-  elaborateUseCaseSpec(limits: any): string | undefined {
-    if (!limits) {
-      return
-    }
-
-    var text = ''
-
-    const {
-      minimum: criticalMinimum,
-      maximum: criticalMaximum,
-      acceptables: criticalAcceptables
-    } = limits['criticalLimits'] || {}
-
-    if (criticalMinimum != null || criticalMaximum != null || criticalAcceptables != null) {
-      text += `${i18next.t('label.critical-limits')}\n`
-    }
-
-    if (criticalMinimum != null) {
-      text += `\t${i18next.t('label.minimum value')} : ${criticalMinimum}\n`
-    }
-    if (criticalMaximum != null) {
-      text += `\t${i18next.t('label.maximum value')} : ${criticalMaximum}\n`
-    }
-    if (criticalAcceptables != null) {
-      text += `\t${i18next.t('label.acceptables')} : ${
-        criticalAcceptables instanceof Array ? criticalAcceptables.join(', ') : criticalAcceptables
-      }\n`
-    }
-
-    const {
-      minimum: targetMinimum,
-      maximum: targetMaximum,
-      acceptables: targetAcceptables
-    } = limits['targetLimits'] || {}
-
-    if (targetMinimum != null || targetMaximum != null || targetAcceptables != null) {
-      text += `${i18next.t('label.target-limits')}\n`
-    }
-
-    if (targetMinimum != null) {
-      text += `\t${i18next.t('label.minimum value')} : ${targetMinimum}\n`
-    }
-    if (targetMaximum != null) {
-      text += `\t${i18next.t('label.maximum value')} : ${targetMaximum}\n`
-    }
-    if (targetAcceptables != null) {
-      text += `\t${i18next.t('label.acceptables')} : ${
-        targetAcceptables instanceof Array ? targetAcceptables.join(', ') : targetAcceptables
-      }\n`
-    }
-
-    return text
-  }
-}

package/src/usecase/ccp/ox-input-ccp-limits.ts

@@ -1,184 +0,0 @@
-/**
- * @license Copyright © HatioLab Inc. All rights reserved.
- */
-
-import { css, html, LitElement } from 'lit'
-import { customElement, property, query, queryAll } from 'lit/decorators.js'
-
-import { i18next } from '@operato/i18n'
-
-export enum DataItemType {
-  number = 'number',
-  text = 'text',
-  boolean = 'boolean',
-  select = 'select',
-  radio = 'radio',
-  file = 'file',
-  signature = 'signature'
-}
-
-export type CcpLimitValue = {
-  minimum?: number
-  maximum?: number
-  acceptables?: string[] | boolean[]
-}
-
-/**
- element for CCP limits
- 
- Example:
- 
-   <ox-input-ccp-limits
-     .value=${value}
-     .type=${type}>
-   </ox-input-ccp-limits>
- */
-@customElement('ox-input-ccp-limits')
-export class OxInputCcpLimits extends LitElement {
-  static styles = css`
-    :host {
-      display: flex;
-      flex-direction: column;
-      align-content: center;
-    }
-
-    label {
-      margin: 0 var(--margin-default) var(--margin-default) 0;
-    }
-
-    label div > * {
-      vertical-align: middle;
-    }
-
-    button {
-      width: 20px;
-      text-align: center;
-    }
-
-    div[name],
-    input[type='checkbox'] + span {
-      display: inline-block;
-      font: var(--label-font);
-      color: var(--label-color, var(--md-sys-color-on-surface));
-      text-align: right;
-    }
-    input,
-    select {
-      border: var(--input-field-border);
-      border-radius: var(--input-field-border-radius);
-      padding: var(--input-field-padding);
-      font: var(--input-field-font);
-    }
-
-    input[type='checkbox'] {
-      width: initial;
-    }
-    input[checked] + span {
-      font-weight: bold;
-    }
-    [unit],
-    [value] {
-      display: inline-block;
-      opacity: 0.7;
-      font: var(--form-sublabel-font);
-    }
-    [properties] {
-      font: var(--input-field-font);
-      color: var(--label-color, var(--md-sys-color-on-surface));
-    }
-  `
-
-  @property({ type: Object }) value: CcpLimitValue = {}
-  @property({ type: String }) type: DataItemType = DataItemType.number
-  @property({ type: String }) unit?: string
-  @property({ type: Object }) options: { options?: { text: string; value: string }[] } = {}
-
-  @query('[name=minimum]') minimum!: HTMLInputElement
-  @query('[name=maximum]') maximum!: HTMLInputElement
-  @queryAll('[type=checkbox]:checked') checkedAll!: NodeListOf<HTMLInputElement>
-
-  firstUpdated() {
-    this.renderRoot.addEventListener('change', this.onChange.bind(this))
-  }
-
-  render() {
-    const { minimum, maximum, acceptables = [] } = this.value || {}
-
-    return html`
-      <div>
-        ${this.type === DataItemType.number
-          ? html`
-              <label>
-                <div name>${i18next.t('text.minimum value')}</div>
-                <input type="number" name="minimum" .value=${minimum} />
-                <div unit>${this.unit}</div>
-              </select>
-              </label>
-              <label>
-                <div name>${i18next.t('text.maximum value')}</div>
-                <input type="number" name="maximum" .value=${maximum} />
-                <div unit>${this.unit}</div>
-              </label>
-            `
-          : this.type === DataItemType.select || this.type === DataItemType.radio
-            ? html`
-                <!-- <div>Acceptables</div> -->
-                ${this.options?.options?.map(
-                  option => html`
-                    <div>
-                      <input
-                        type="checkbox"
-                        data-value=${option.value}
-                        ?checked=${(acceptables as string[]).includes(option.value)}
-                      />
-                      <span>${option.text}</span>
-                      <span value>(${option.value})</span>
-                    </div>
-                  `
-                )}
-              `
-            : this.type === DataItemType.boolean
-              ? html`
-                  <div>
-                    <input type="checkbox" data-value=${true} ?checked=${(acceptables as boolean[]).includes(true)} />
-                    <span value>true</span>
-                  </div>
-                  <div>
-                    <input type="checkbox" data-value=${false} ?checked=${(acceptables as boolean[]).includes(false)} />
-                    <span value>false</span>
-                  </div>
-                `
-              : html` <div properties>${i18next.t('text.no properties to set')}</div> `}
-      </div>
-    `
-  }
-
-  private onChange(e: Event) {
-    if (this.type === DataItemType.number) {
-      this.value = {
-        minimum: this.minimum.valueAsNumber,
-        maximum: this.maximum.valueAsNumber
-      }
-    } else if (this.type === DataItemType.select) {
-      this.value = {
-        acceptables: Array.from(this.checkedAll).map(checked => {
-          const x = checked.getAttribute('data-value')!
-          console.log(x)
-          return x
-        })
-      }
-    } else if (this.type === DataItemType.boolean) {
-      this.value = {
-        acceptables: Array.from(this.checkedAll).map(checked => {
-          const x = checked.getAttribute('data-value')! === 'true'
-          console.log(x)
-          return x
-        })
-      }
-    } else {
-      this.value = {}
-    }
-
-    this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true, detail: this.value }))
-  }
-}