npm - @things-factory/worklist - Versions diffs - 6.2.96 → 6.2.98 - Mend

@things-factory/worklist 6.2.96 → 6.2.98

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (54) hide show

package/dist-client/components/activity-approval-timeline.js ADDED Viewed

@@ -0,0 +1,143 @@
+import { __decorate, __metadata } from "tslib";
+import '@material/mwc-icon';
+import '@things-factory/organization/dist-client/component/approval-line-view.js';
+import { html, css, LitElement, nothing } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { connect } from 'pwa-helpers/connect-mixin';
+import { store } from '@operato/shell';
+import { i18next } from '@operato/i18n';
+const formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle: 'full', timeStyle: 'short' });
+let ActivityApprovalTimeline = class ActivityApprovalTimeline extends connect(store)(LitElement) {
+    render() {
+        const { activityApprovals = [] } = this.activityThread || {};
+        return html ` ${activityApprovals.length > 0
+            ? html `
+          <span subtitle>${i18next.t('label.review-and-approval')}</span>
+          <ol>
+            ${activityApprovals.map(approval => this.renderActivityApproval(approval))}
+          </ol>
+        `
+            : nothing}`;
+    }
+    renderActivityApproval(activityApproval) {
+        const { judgment, approver, comment, createdAt, terminatedAt } = activityApproval;
+        const { name } = approver || {};
+        return html `
+      <li>
+        <span date>${formatter.format(new Date(terminatedAt || createdAt))}</span>
+        <span status></span>
+        <span info>
+          ${i18next.t('label.activity-state-' + (judgment || 'started'))}
+          <strong><mwc-icon>account_circle</mwc-icon>${name}</strong>
+          <p>${comment}</p>
+        </span>
+      </li>
+    `;
+    }
+};
+ActivityApprovalTimeline.styles = [
+    css `
+      :host {
+        display: block;
+      }
+      [subtitle] {
+        padding: var(--padding-narrow) var(--padding-default);
+        background-color: var(--theme-white-color);
+        border: 2px solid var(--secondary-text-color);
+        border-radius: 15px;
+        box-shadow: var(--box-shadow);
+        color: var(--secondary-text-color);
+        font-weight: bold;
+      }
+      ol {
+        list-style: none;
+        margin: var(--margin-default) 0 0 var(--margin-narrow);
+        padding: 0;
+      }
+      li {
+        display: flex;
+        border: none;
+      }
+      [info] {
+        flex: 1;
+        color: var(--secondary-color);
+        strong {
+          float: right;
+        }
+        mwc-icon {
+          position: relative;
+          top: 3px;
+          font-size: var(--fontsize-large);
+        }
+        p {
+          background-color: #f4f4f4;
+          margin: var(--margin-narrow) 0 var(--margin-default) 0;
+          padding: var(--padding-narrow) var(--padding-default);
+          font-size: var(--fontsize-small);
+          text-align: justify;
+          min-height: 20px;
+        }
+        p::before {
+          content: '';
+          float: right;
+          margin-top: -10px;
+          margin-right: 20px;
+          border: 7px solid transparent;
+          border-bottom-color: #f4f4f4;
+          border-top: 0;
+        }
+      }
+      [date] {
+        opacity: 0.7;
+        flex: initial;
+        width: 200px;
+        max-width: 30%;
+        font-size: var(--fontsize-small);
+        color: var(--primary-text-color);
+      }
+      [status] {
+        margin: 0 var(--margin-narrow);
+        display: block;
+        border-radius: 50%;
+        flex: initial;
+        width: 12px;
+        height: 12px;
+        position: relative;
+        top: 3px;
+        border: 2px solid #fff;
+        background-color: var(--worklist-status-color, tomato);
+        color: var(--primary-text-color);
+      }
+      [status]::before {
+        content: '';
+        height: 60px;
+        width: 2px;
+        display: block;
+        position: relative;
+        margin-left: 5px;
+        background-color: var(--worklist-status-color, tomato);
+        opacity: 0.2;
+      }
+    `
+];
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], ActivityApprovalTimeline.prototype, "activityThread", void 0);
+ActivityApprovalTimeline = __decorate([
+    customElement('activity-approval-timeline')
+], ActivityApprovalTimeline);
+export { ActivityApprovalTimeline };
+//# sourceMappingURL=activity-approval-timeline.js.map

package/dist-client/components/activity-approval-timeline.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"activity-approval-timeline.js","sourceRoot":"","sources":["../../client/components/activity-approval-timeline.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,0EAA0E,CAAA;AAEjF,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAA;AAEnD,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAA;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAIvC,MAAM,SAAS,GAAG,IAAI,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAAA;AAGjG,IAAM,wBAAwB,GAA9B,MAAM,wBAAyB,SAAQ,OAAO,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC;IAoGtE,MAAM;QACJ,MAAM,EAAE,iBAAiB,GAAG,EAAE,EAAE,GAAG,IAAI,CAAC,cAAc,IAAI,EAAE,CAAA;QAE5D,OAAO,IAAI,CAAA,IAAI,iBAAiB,CAAC,MAAM,GAAG,CAAC;YACzC,CAAC,CAAC,IAAI,CAAA;2BACe,OAAO,CAAC,CAAC,CAAC,2BAA2B,CAAC;;;cAGnD,iBAAiB,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAC,sBAAsB,CAAC,QAAQ,CAAC,CAAC;;SAE7E;YACH,CAAC,CAAC,OAAO,EAAE,CAAA;IACf,CAAC;IAED,sBAAsB,CAAC,gBAAkC;QACvD,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,gBAAgB,CAAA;QACjF,MAAM,EAAE,IAAI,EAAE,GAAG,QAAQ,IAAI,EAAE,CAAA;QAE/B,OAAO,IAAI,CAAA;;qBAEM,SAAS,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,YAAY,IAAI,SAAU,CAAC,CAAC;;;YAG/D,OAAO,CAAC,CAAC,CAAC,uBAAuB,GAAG,CAAC,QAAQ,IAAI,SAAS,CAAC,CAAC;uDACjB,IAAI;eAC5C,OAAO;;;KAGjB,CAAA;IACH,CAAC;;AAhIM,+BAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA6FF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;gEAAuB;AAlGvC,wBAAwB;IADpC,aAAa,CAAC,4BAA4B,CAAC;GAC/B,wBAAwB,CAkIpC;SAlIY,wBAAwB","sourcesContent":["import '@material/mwc-icon'\nimport '@things-factory/organization/dist-client/component/approval-line-view.js'\n\nimport { html, css, LitElement, nothing } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { connect } from 'pwa-helpers/connect-mixin'\n\nimport { store } from '@operato/shell'\nimport { i18next } from '@operato/i18n'\n\nimport { ActivityApproval } from '../types/activity-approval'\n\nconst formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle: 'full', timeStyle: 'short' })\n\n@customElement('activity-approval-timeline')\nexport class ActivityApprovalTimeline extends connect(store)(LitElement) {\n static styles = [\n css`\n :host {\n display: block;\n }\n\n [subtitle] {\n padding: var(--padding-narrow) var(--padding-default);\n background-color: var(--theme-white-color);\n border: 2px solid var(--secondary-text-color);\n border-radius: 15px;\n box-shadow: var(--box-shadow);\n color: var(--secondary-text-color);\n font-weight: bold;\n }\n\n ol {\n list-style: none;\n margin: var(--margin-default) 0 0 var(--margin-narrow);\n padding: 0;\n }\n\n li {\n display: flex;\n border: none;\n }\n\n [info] {\n flex: 1;\n color: var(--secondary-color);\n\n strong {\n float: right;\n }\n\n mwc-icon {\n position: relative;\n top: 3px;\n font-size: var(--fontsize-large);\n }\n\n p {\n background-color: #f4f4f4;\n margin: var(--margin-narrow) 0 var(--margin-default) 0;\n padding: var(--padding-narrow) var(--padding-default);\n font-size: var(--fontsize-small);\n text-align: justify;\n min-height: 20px;\n }\n\n p::before {\n content: '';\n float: right;\n margin-top: -10px;\n margin-right: 20px;\n border: 7px solid transparent;\n border-bottom-color: #f4f4f4;\n border-top: 0;\n }\n }\n\n [date] {\n opacity: 0.7;\n flex: initial;\n width: 200px;\n max-width: 30%;\n font-size: var(--fontsize-small);\n color: var(--primary-text-color);\n }\n\n [status] {\n margin: 0 var(--margin-narrow);\n display: block;\n border-radius: 50%;\n flex: initial;\n width: 12px;\n height: 12px;\n position: relative;\n top: 3px;\n border: 2px solid #fff;\n background-color: var(--worklist-status-color, tomato);\n color: var(--primary-text-color);\n }\n\n [status]::before {\n content: '';\n height: 60px;\n width: 2px;\n display: block;\n position: relative;\n margin-left: 5px;\n background-color: var(--worklist-status-color, tomato);\n opacity: 0.2;\n }\n `\n ]\n\n @property({ type: Object }) private activityThread\n\n render() {\n const { activityApprovals = [] } = this.activityThread || {}\n\n return html` ${activityApprovals.length > 0\n ? html`\n ${i18next.t('label.review-and-approval')}\n\n <ol>\n ${activityApprovals.map(approval => this.renderActivityApproval(approval))}\n </ol>\n `\n : nothing}`\n }\n\n renderActivityApproval(activityApproval: ActivityApproval) {\n const { judgment, approver, comment, createdAt, terminatedAt } = activityApproval\n const { name } = approver || {}\n\n return html`\n <li>\n ${formatter.format(new Date(terminatedAt || createdAt!))}\n \n \n ${i18next.t('label.activity-state-' + (judgment || 'started'))}\n <mwc-icon>account_circle</mwc-icon>${name}\n ${comment}\n \n </li>\n `\n }\n}\n"]}

package/dist-client/pages/activity-approval/activity-approval-page.d.ts CHANGED Viewed

@@ -1,8 +1,8 @@
 import '@operato/property-editor/ox-properties-dynamic-view.js';
 import '@operato/board/ox-board-viewer.js';
 import '../../components/activity-approval-ribon.js';
+import '../../components/activity-approval-timeline.js';
 import { PageView } from '@operato/shell';
-import { ActivityApproval } from '../../types/activity-approval.js';
 export declare const ActivityThreadStatus: {
     Assigned: string;
     Started: string;
@@ -39,7 +39,6 @@ export declare class ActivityApprovalPage extends ActivityApprovalPage_base {
         }[];
     };
     render(): import("lit-html").TemplateResult<1>;
-    renderActivityApproval(activityApproval: ActivityApproval): import("lit-html").TemplateResult<1>;
     activityContent(): any;
     templateContent(): import("lit-html/directive.js").DirectiveResult<typeof import("lit-html/directives/unsafe-html.js").UnsafeHTMLDirective>;
     getInputSpec(): any;

package/dist-client/pages/activity-approval/activity-approval-page.js CHANGED Viewed

@@ -2,8 +2,9 @@ import { __decorate, __metadata } from "tslib";
 import '@operato/property-editor/ox-properties-dynamic-view.js';
 import '@operato/board/ox-board-viewer.js';
 import '../../components/activity-approval-ribon.js';
+import '../../components/activity-approval-timeline.js';
 import gql from 'graphql-tag';
-import { css, html } from 'lit';
+import { css, html, nothing } from 'lit';
 import { unsafeHTML } from 'lit-html/directives/unsafe-html.js';
 import { customElement, query, state } from 'lit/decorators.js';
 import { keyed } from 'lit/directives/keyed.js';
@@ -13,7 +14,6 @@ import { i18next, localize } from '@operato/i18n';
 import { PageView, store } from '@operato/shell';
 import { CommonButtonStyles, ScrollbarStyles } from '@operato/styles';
 import { provider } from '@things-factory/board-ui';
-const formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle: 'short', timeStyle: 'short' });
 const ActivityApprovalFetchResult = `\
 {
   id
@@ -26,6 +26,7 @@ const ActivityApprovalFetchResult = `\
   round
   order
   createdAt
+  terminatedAt
   activityThread {
     state
     dueAt
@@ -116,45 +117,27 @@ let ActivityApprovalPage = class ActivityApprovalPage extends connect(store)(loc
     render() {
         var _a;
         if (!this.activityThread) {
-            return html `<div>no activity thread info.</div>`;
+            return html `<div empty>no activity thread info.</div>`;
         }
-        const { activityApprovals = [] } = this.activityThread;
-        const approvals = activityApprovals.sort((a, b) => (a.round > b.round ? 1 : a.round < b.round ? -1 : a.order > b.order ? 1 : -1)).slice(0, -1);
+        const { terminatedAt } = this.activityApproval;
+        const editable = !terminatedAt;
         return html `
       <activity-approval-ribon .activityApproval=${this.activityApproval}></activity-approval-ribon>
       ${this.activityContent()}
-      <div comment>
-        <div timeline>
-          <span subtitle>${i18next.t('label.review-and-approval')}</span>
-          <ol>
-            ${approvals.map(approval => this.renderActivityApproval(approval))}
-          </ol>
-        </div>
-        <textarea
-          placeholder=${String(i18next.t('text.explain the reason for approval/rejection'))}
-          .value=${(_a = this.activityApproval) === null || _a === void 0 ? void 0 : _a.comment}
-          @change=${(e) => {
-            this.activityApproval.comment = e.target.value;
-        }}
-        ></textarea>
-      </div>
-    `;
-    }
-    renderActivityApproval(activityApproval) {
-        const { judgment, approver, comment, round, order, createdAt, terminatedAt } = activityApproval;
-        const { name, email } = approver || {};
-        return html `
-      <li>
-        <span date>${formatter.format(new Date(terminatedAt || createdAt))}</span>
-        <span status></span>
-        <span info>
-          ${i18next.t('label.activity-state-' + (judgment || 'started'))}
-          <strong><mwc-icon>account_circle</mwc-icon>${name}</strong>
-          <p>${comment}</p>
-        </span>
-      </li>
+      <activity-approval-timeline .activityThread=${this.activityThread}></activity-approval-timeline>
+      ${editable
+            ? html `
+            <div comment>
+              <textarea
+                placeholder=${String(i18next.t('text.explain the reason for approval/rejection'))}
+                .value=${(_a = this.activityApproval) === null || _a === void 0 ? void 0 : _a.comment}
+                @change=${(e) => {
+                this.activityApproval.comment = e.target.value;
+            }}
+              ></textarea>
+            </div>
+          `
+            : nothing}
     `;
     }
     activityContent() {
@@ -338,18 +321,9 @@ let ActivityApprovalPage = class ActivityApprovalPage extends connect(store)(loc
     }
     async approveActivityApproval() {
         var { id, comment } = this.activityApproval;
-        if (!comment) {
-            document.dispatchEvent(new CustomEvent('notify', {
-                detail: {
-                    message: i18next.t('text.enter a comment')
-                }
-            }));
-            this.commentInput.focus();
-            return;
-        }
         const response = await client.mutate({
             mutation: gql `
-        mutation ($id: String!, $comment: String!) {
+        mutation ($id: String!, $comment: String) {
           approveActivityApproval(id: $id,  comment: $comment) ${ActivityApprovalFetchResult}
         }
       `,
@@ -412,106 +386,35 @@ ActivityApprovalPage.styles = [
         height: 100%;
       }
-      #custom-content {
-        overflow: auto;
+      activity-approval-timeline {
+        margin: var(--margin-default);
+        padding: var(--padding-default);
       }
       div[comment] {
         display: flex;
-        flex-direction: column;
-        width: 100%;
-        right: 0;
+        position: sticky;
         bottom: 0;
         margin: 0;
         padding: 0;
-        opacity: 0.8;
-        margin-top: auto;
+        width: 100%;
+        background-color: var(--main-section-background-color);
-        max-height: 40%;
+        textarea {
+          flex: 1;
+          margin: var(--margin-default);
+          padding: var(--input-padding);
+          font: var(--input-font);
+          outline: none;
+          height: 80px;
+          border-radius: 10px;
+          border: var(--input-field-border);
+          resize: none;
+        }
       }
-      div[timeline] {
-        margin-bottom: var(--margin-default);
-        padding: var(--padding-default);
-        border-bottom: var(--border-dark-color);
-        overflow: auto;
-      }
-      div[timeline] [subtitle] {
-        padding: var(--padding-narrow) var(--padding-default);
-        background-color: var(--theme-white-color);
-        border: 2px solid var(--secondary-text-color);
-        border-radius: 15px;
-        box-shadow: var(--box-shadow);
-        color: var(--secondary-text-color);
-        font-weight: bold;
-      }
-      div[timeline] ol {
-        list-style: none;
-        margin: var(--margin-default) 0 0 var(--margin-narrow);
-        padding: 0;
-      }
-      [timeline] li {
-        display: flex;
-      }
-      [timeline] [info] {
-        flex: 1;
-      }
-      [timeline] [date] {
-        opacity: 0.7;
-        width: 130px;
-        font-size: var(--fontsize-small);
-      }
-      [timeline] [info] strong {
-        float: right;
-      }
-      [timeline] [status] {
-        margin: 0 var(--margin-narrow);
-        display: block;
-        border-radius: 50%;
-        width: 12px;
-        height: 12px;
-        position: relative;
-        top: 3px;
-        border: 2px solid #fff;
-        background-color: var(--worklist-status-color, tomato);
-      }
-      [timeline] [status]::before {
-        content: '';
-        height: 60px;
-        width: 2px;
-        display: block;
-        position: relative;
-        margin-left: 5px;
-        background-color: var(--worklist-status-color, tomato);
-        opacity: 0.2;
-      }
-      [timeline] [info] mwc-icon {
-        position: relative;
-        top: 3px;
-        font-size: var(--fontsize-large);
-      }
-      [timeline] [info] p {
-        background-color: var(--theme-white-color);
-        margin: var(--margin-narrow) 0 var(--margin-default) 0;
-        padding: var(--padding-narrow) var(--padding-default);
-        font-size: var(--fontsize-small);
-        text-align: justify;
-      }
-      [timeline] [info] p::before {
-        content: '';
-        float: right;
-        margin-top: -10px;
-        margin-right: 20px;
-        border: 7px solid transparent;
-        border-bottom-color: #f4f4f4;
-        border-top: 0;
-      }
-      div[comment] textarea {
-        margin: 0 var(--margin-default) var(--margin-default) var(--margin-default);
-        padding: var(--input-padding);
-        resize: none;
-        font: var(--input-font);
-        outline: none;
+      div[empty] {
+        align-self: center;
       }
     `
 ];

package/dist-client/pages/activity-approval/activity-approval-page.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"activity-approval-page.js","sourceRoot":"","sources":["../../../client/pages/activity-approval/activity-approval-page.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@operato/board/ox-board-viewer.js'\nimport '../../components/activity-approval-ribon.js'\n\nimport gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { unsafeHTML } from 'lit-html/directives/unsafe-html.js'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { keyed } from 'lit/directives/keyed.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { PageView, store } from '@operato/shell'\nimport { CommonButtonStyles, ScrollbarStyles } from '@operato/styles'\nimport { provider } from '@things-factory/board-ui'\nimport { ActivityApproval } from '../../types/activity-approval.js'\n\nconst formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle: 'short', timeStyle: 'short' })\n\nconst ActivityApprovalFetchResult = `\\\n{\n id\n judgment\n comment\n approver {\n id\n name\n }\n round\n order\n createdAt\n activityThread {\n state\n dueAt\n assignedAt\n assignee {\n id\n name\n }\n updatedAt\n terminatedAt\n output\n activityApprovals {\n round\n order\n approver {\n name\n email\n }\n judgment\n comment\n createdAt\n terminatedAt\n }\n activityInstance {\n id\n name\n description\n state\n activity {\n id\n model {\n name\n description\n active\n tag\n inout\n type\n unit\n options\n quantifier\n spec\n }\n }\n approvalLine {\n type\n value\n approver {\n id\n name\n description\n controlNo\n }\n }\n thumbnail\n input\n output\n viewType\n viewSource\n dueAt\n createdAt\n } \n }\n}`\n\nexport const ActivityThreadStatus = {\n Assigned: 'assigned',\n Started: 'started',\n Delegated: 'delegated',\n Ended: 'ended',\n Aborted: 'aborted'\n}\n\n@customElement('activity-approval-page')\nexport class ActivityApprovalPage extends connect(store)(localize(i18next)(PageView)) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n position: relative;\n\n width: 100%;\n overflow: auto;\n background-color: var(--main-section-background-color);\n }\n\n ox-board-viewer {\n width: 100%;\n height: 100%;\n }\n\n #custom-content {\n overflow: auto;\n }\n\n div[comment] {\n display: flex;\n flex-direction: column;\n width: 100%;\n right: 0;\n bottom: 0;\n margin: 0;\n padding: 0;\n opacity: 0.8;\n margin-top: auto;\n\n max-height: 40%;\n }\n\n div[timeline] {\n margin-bottom: var(--margin-default);\n padding: var(--padding-default);\n border-bottom: var(--border-dark-color);\n overflow: auto;\n }\n div[timeline] [subtitle] {\n padding: var(--padding-narrow) var(--padding-default);\n background-color: var(--theme-white-color);\n border: 2px solid var(--secondary-text-color);\n border-radius: 15px;\n box-shadow: var(--box-shadow);\n color: var(--secondary-text-color);\n font-weight: bold;\n }\n div[timeline] ol {\n list-style: none;\n margin: var(--margin-default) 0 0 var(--margin-narrow);\n padding: 0;\n }\n [timeline] li {\n display: flex;\n }\n [timeline] [info] {\n flex: 1;\n }\n [timeline] [date] {\n opacity: 0.7;\n width: 130px;\n font-size: var(--fontsize-small);\n }\n [timeline] [info] strong {\n float: right;\n }\n [timeline] [status] {\n margin: 0 var(--margin-narrow);\n display: block;\n border-radius: 50%;\n width: 12px;\n height: 12px;\n position: relative;\n top: 3px;\n border: 2px solid #fff;\n background-color: var(--worklist-status-color, tomato);\n }\n [timeline] [status]::before {\n content: '';\n height: 60px;\n width: 2px;\n display: block;\n position: relative;\n margin-left: 5px;\n background-color: var(--worklist-status-color, tomato);\n opacity: 0.2;\n }\n [timeline] [info] mwc-icon {\n position: relative;\n top: 3px;\n font-size: var(--fontsize-large);\n }\n [timeline] [info] p {\n background-color: var(--theme-white-color);\n margin: var(--margin-narrow) 0 var(--margin-default) 0;\n padding: var(--padding-narrow) var(--padding-default);\n font-size: var(--fontsize-small);\n text-align: justify;\n }\n [timeline] [info] p::before {\n content: '';\n float: right;\n margin-top: -10px;\n margin-right: 20px;\n border: 7px solid transparent;\n border-bottom-color: #f4f4f4;\n border-top: 0;\n }\n div[comment] textarea {\n margin: 0 var(--margin-default) var(--margin-default) var(--margin-default);\n padding: var(--input-padding);\n resize: none;\n font: var(--input-font);\n outline: none;\n }\n `\n ]\n\n @state() activityApproval: any\n @state() activityThread: any\n @state() board: any\n\n @query('textarea') commentInput!: HTMLTextAreaElement\n\n get context() {\n const judgment = this.activityApproval?.judgment\n\n return {\n title: this.lifecycle?.params?.['title'] \|\| i18next.t('title.activity approval'),\n help: 'worklist/activity-approval',\n actions: judgment\n ? []\n : [\n {\n title: i18next.t('button.reject'),\n action: this.rejectActivityApproval.bind(this),\n ...CommonButtonStyles.play\n },\n\n {\n title: i18next.t('button.approve'),\n action: this.approveActivityApproval.bind(this),\n ...CommonButtonStyles.save\n },\n\n {\n title: i18next.t('button.save'),\n action: this.saveActivityApproval.bind(this),\n ...CommonButtonStyles.save\n }\n ]\n // activityApproval: this.activityApproval\n }\n }\n\n render() {\n if (!this.activityThread) {\n return html`<div>no activity thread info.</div>`\n }\n\n const { activityApprovals = [] } = this.activityThread\n const approvals = activityApprovals.sort((a, b) => (a.round > b.round ? 1 : a.round < b.round ? -1 : a.order! > b.order! ? 1 : -1)).slice(0, -1)\n\n return html`\n <activity-approval-ribon .activityApproval=${this.activityApproval}></activity-approval-ribon>\n ${this.activityContent()}\n <div comment>\n <div timeline>\n <span subtitle>${i18next.t('label.review-and-approval')}</span>\n\n <ol>\n ${approvals.map(approval => this.renderActivityApproval(approval))}\n </ol>\n </div>\n\n <textarea\n placeholder=${String(i18next.t('text.explain the reason for approval/rejection'))}\n .value=${this.activityApproval?.comment}\n @change=${(e: Event) => {\n this.activityApproval.comment = (e.target as HTMLTextAreaElement).value\n }}\n ></textarea>\n </div>\n `\n }\n\n renderActivityApproval(activityApproval: ActivityApproval) {\n const { judgment, approver, comment, round, order, createdAt, terminatedAt } = activityApproval\n const { name, email } = approver \|\| {}\n\n return html`\n <li>\n <span date>${formatter.format(new Date(terminatedAt \|\| createdAt!))}</span>\n <span status></span>\n <span info>\n ${i18next.t('label.activity-state-' + (judgment \|\| 'started'))}\n <strong><mwc-icon>account_circle</mwc-icon>${name}</strong>\n <p>${comment}</p>\n </span>\n </li>\n `\n }\n\n activityContent() {\n switch (this.activityThread?.activityInstance?.viewType) {\n case 'template':\n return this.templateContent()\n case 'generated':\n return this.generatedContent()\n case 'board':\n return this.boardContent()\n case 'custom-element':\n return this.customElementContent()\n case 'page':\n case 'external':\n return html``\n default:\n return this.generatedContent()\n }\n }\n\n templateContent() {\n if (!this.activityApproval) {\n return html``\n }\n\n const { viewSource: template } = this.activityThread?.activityInstance\n return unsafeHTML(template)\n }\n\n getInputSpec() {\n const model = this.activityThread?.activityInstance?.activity?.model\n\n return (model \|\| [])\n .filter(item => item.inout === 'in' \|\| item.inout === 'inout')\n .map(item => {\n return {\n ...item,\n name: item.tag,\n label: item.tKey \|\| item.name,\n property: item.options\n }\n })\n }\n\n getOutputSpec() {\n const model = this.activityThread?.activityInstance?.activity?.model\n\n return (model \|\| [])\n .filter(item => item.inout === 'inout' \|\| item.inout === 'out')\n .map(item => {\n return {\n ...item,\n name: item.tag,\n label: item.tKey \|\| item.name,\n property: item.options\n }\n })\n }\n\n generatedContent() {\n if (!this.activityApproval) {\n return html``\n }\n\n var { output, activityInstance } = this.activityThread \|\| {}\n var { input } = activityInstance \|\| {}\n\n const inputSpec = this.getInputSpec()\n const outputSpec = this.getOutputSpec()\n\n if (!output) {\n output = inputSpec\n .filter(item => item.inout === 'inout')\n .reduce((inout, item) => {\n inout[item.name] = input[item.name]\n return inout\n }, {})\n }\n\n return keyed(\n this.activityApproval.id,\n html`\n <fieldset>\n <legend>Input</legend>\n <ox-properties-dynamic-view data-name=\"input\" .props=${inputSpec} .value=${input}></ox-properties-dynamic-view>\n </fieldset>\n\n <fieldset>\n <legend>Output</legend>\n <ox-properties-dynamic-view\n data-name=\"output\"\n .props=${outputSpec}\n .value=${output}\n @property-change=${e => (this.activityApproval.output = e.currentTarget.value)}\n ></ox-properties-dynamic-view>\n </fieldset>\n `\n )\n }\n\n boardContent() {\n if (!this.activityApproval) {\n return html``\n }\n\n const { output, activityInstance } = this.activityThread\n const { viewSource: boardId, input } = activityInstance \|\| {}\n\n if (!this.board \|\| this.board.id !== boardId) {\n this.board = {\n id: boardId\n }\n }\n\n return keyed(\n this.activityApproval.id,\n html`\n <ox-board-viewer\n style=\"background-color: white;\"\n .board=${this.board}\n .provider=${provider}\n .values=${{ ...input, ...output }}\n hide-fullscreen\n hide-navigation\n ></ox-board-viewer>\n `\n )\n }\n\n customElementContent() {\n if (!this.activityApproval) {\n return html``\n }\n\n const { output, activityInstance } = this.activityThread\n const { viewSource: tagName, input } = activityInstance \|\| {}\n\n const element = document.createElement(tagName)\n element.id = 'custom-content'\n element.activityId = activityInstance.activity.id\n element.input = input\n element.output = output\n element.activityApproval = this.activityApproval\n\n return element\n }\n\n @query('ox-board-viewer') oxBoardViewer: any\n\n getOutputFromBoard() {\n const outputSpec = this.getOutputSpec()\n const data = this.oxBoardViewer.getSceneValues()\n\n return outputSpec.reduce((output, spec) => {\n output[spec.name] = data[spec.name]\n return output\n }, {})\n }\n\n updated(changes) {\n if (changes.has('activityApproval')) {\n this.updateContext()\n }\n }\n\n async pageUpdated(changes, lifecycle, changedBefore) {\n if (this.active && lifecycle.resourceId) {\n this.fetchActivityApproval(lifecycle.resourceId)\n }\n }\n\n async fetchActivityApproval(id) {\n const response = await client.query({\n query: gql`\n query activityApproval($id: String!) {\n activityApproval(id: $id) ${ActivityApprovalFetchResult}\n }\n `,\n variables: {\n id\n }\n })\n\n this.activityApproval = response.data.activityApproval\n this.activityThread = this.activityApproval.activityThread\n\n this.updateContext()\n }\n\n async rejectActivityApproval() {\n var { id, comment } = this.activityApproval\n\n if (!comment) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n message: i18next.t('text.enter a comment')\n }\n })\n )\n this.commentInput.focus()\n return\n }\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $comment: String!) {\n rejectActivityApproval(id: $id, comment: $comment) ${ActivityApprovalFetchResult}\n }\n `,\n variables: {\n id,\n comment\n }\n })\n\n if (!response.errors) {\n this.activityApproval = response.data.rejectActivityApproval\n this.activityThread = this.activityApproval.activityThread\n\n this.updateContext()\n\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n message: i18next.t('text.task_is_rejected_successfully')\n }\n })\n )\n }\n }\n\n async approveActivityApproval() {\n var { id, comment } = this.activityApproval\n\n if (!comment) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n message: i18next.t('text.enter a comment')\n }\n })\n )\n this.commentInput.focus()\n return\n }\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $comment: String!) {\n approveActivityApproval(id: $id, comment: $comment) ${ActivityApprovalFetchResult}\n }\n `,\n variables: {\n id,\n comment\n }\n })\n\n if (!response.errors) {\n this.activityApproval = response.data.approveActivityApproval\n this.activityThread = this.activityApproval.activityThread\n\n this.updateContext()\n\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n message: i18next.t('text.task_is_approved_successfully')\n }\n })\n )\n }\n }\n\n async saveActivityApproval() {\n var { id, comment } = this.activityApproval\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $comment: String) {\n saveActivityApproval(id: $id, comment: $comment) ${ActivityApprovalFetchResult}\n }\n `,\n variables: {\n id,\n comment\n }\n })\n\n if (!response.errors) {\n this.activityApproval = response.data.saveActivityApproval\n this.activityThread = this.activityApproval.activityThread\n\n this.updateContext()\n\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n message: i18next.t('text.task_is_saved_successfully')\n }\n })\n )\n }\n }\n}\n"]}
1	+ {"version":3,"file":"activity-approval-page.js","sourceRoot":"","sources":["../../../client/pages/activity-approval/activity-approval-page.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@operato/board/ox-board-viewer.js'\nimport '../../components/activity-approval-ribon.js'\nimport '../../components/activity-approval-timeline.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, nothing } from 'lit'\nimport { unsafeHTML } from 'lit-html/directives/unsafe-html.js'\nimport { customElement, query, state } from 'lit/decorators.js'\nimport { keyed } from 'lit/directives/keyed.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { PageView, store } from '@operato/shell'\nimport { CommonButtonStyles, ScrollbarStyles } from '@operato/styles'\nimport { provider } from '@things-factory/board-ui'\n\nconst ActivityApprovalFetchResult = `\\\n{\n id\n judgment\n comment\n approver {\n id\n name\n }\n round\n order\n createdAt\n terminatedAt\n activityThread {\n state\n dueAt\n assignedAt\n assignee {\n id\n name\n }\n updatedAt\n terminatedAt\n output\n activityApprovals {\n round\n order\n approver {\n name\n email\n }\n judgment\n comment\n createdAt\n terminatedAt\n }\n activityInstance {\n id\n name\n description\n state\n activity {\n id\n model {\n name\n description\n active\n tag\n inout\n type\n unit\n options\n quantifier\n spec\n }\n }\n approvalLine {\n type\n value\n approver {\n id\n name\n description\n controlNo\n }\n }\n thumbnail\n input\n output\n viewType\n viewSource\n dueAt\n createdAt\n } \n }\n}`\n\nexport const ActivityThreadStatus = {\n Assigned: 'assigned',\n Started: 'started',\n Delegated: 'delegated',\n Ended: 'ended',\n Aborted: 'aborted'\n}\n\n@customElement('activity-approval-page')\nexport class ActivityApprovalPage extends connect(store)(localize(i18next)(PageView)) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n position: relative;\n\n width: 100%;\n overflow: auto;\n background-color: var(--main-section-background-color);\n }\n\n ox-board-viewer {\n width: 100%;\n height: 100%;\n }\n\n activity-approval-timeline {\n margin: var(--margin-default);\n padding: var(--padding-default);\n }\n\n div[comment] {\n display: flex;\n position: sticky;\n bottom: 0;\n margin: 0;\n padding: 0;\n width: 100%;\n background-color: var(--main-section-background-color);\n\n textarea {\n flex: 1;\n margin: var(--margin-default);\n padding: var(--input-padding);\n font: var(--input-font);\n outline: none;\n height: 80px;\n border-radius: 10px;\n border: var(--input-field-border);\n resize: none;\n }\n }\n\n div[empty] {\n align-self: center;\n }\n `\n ]\n\n @state() activityApproval: any\n @state() activityThread: any\n @state() board: any\n\n @query('textarea') commentInput!: HTMLTextAreaElement\n\n get context() {\n const judgment = this.activityApproval?.judgment\n\n return {\n title: this.lifecycle?.params?.['title'] \|\| i18next.t('title.activity approval'),\n help: 'worklist/activity-approval',\n actions: judgment\n ? []\n : [\n {\n title: i18next.t('button.reject'),\n action: this.rejectActivityApproval.bind(this),\n ...CommonButtonStyles.play\n },\n\n {\n title: i18next.t('button.approve'),\n action: this.approveActivityApproval.bind(this),\n ...CommonButtonStyles.save\n },\n\n {\n title: i18next.t('button.save'),\n action: this.saveActivityApproval.bind(this),\n ...CommonButtonStyles.save\n }\n ]\n // activityApproval: this.activityApproval\n }\n }\n\n render() {\n if (!this.activityThread) {\n return html`<div empty>no activity thread info.</div>`\n }\n\n const { terminatedAt } = this.activityApproval\n const editable = !terminatedAt\n\n return html`\n <activity-approval-ribon .activityApproval=${this.activityApproval}></activity-approval-ribon>\n ${this.activityContent()}\n <activity-approval-timeline .activityThread=${this.activityThread}></activity-approval-timeline>\n ${editable\n ? html`\n <div comment>\n <textarea\n placeholder=${String(i18next.t('text.explain the reason for approval/rejection'))}\n .value=${this.activityApproval?.comment}\n @change=${(e: Event) => {\n this.activityApproval.comment = (e.target as HTMLTextAreaElement).value\n }}\n ></textarea>\n </div>\n `\n : nothing}\n `\n }\n\n activityContent() {\n switch (this.activityThread?.activityInstance?.viewType) {\n case 'template':\n return this.templateContent()\n case 'generated':\n return this.generatedContent()\n case 'board':\n return this.boardContent()\n case 'custom-element':\n return this.customElementContent()\n case 'page':\n case 'external':\n return html``\n default:\n return this.generatedContent()\n }\n }\n\n templateContent() {\n if (!this.activityApproval) {\n return html``\n }\n\n const { viewSource: template } = this.activityThread?.activityInstance\n return unsafeHTML(template)\n }\n\n getInputSpec() {\n const model = this.activityThread?.activityInstance?.activity?.model\n\n return (model \|\| [])\n .filter(item => item.inout === 'in' \|\| item.inout === 'inout')\n .map(item => {\n return {\n ...item,\n name: item.tag,\n label: item.tKey \|\| item.name,\n property: item.options\n }\n })\n }\n\n getOutputSpec() {\n const model = this.activityThread?.activityInstance?.activity?.model\n\n return (model \|\| [])\n .filter(item => item.inout === 'inout' \|\| item.inout === 'out')\n .map(item => {\n return {\n ...item,\n name: item.tag,\n label: item.tKey \|\| item.name,\n property: item.options\n }\n })\n }\n\n generatedContent() {\n if (!this.activityApproval) {\n return html``\n }\n\n var { output, activityInstance } = this.activityThread \|\| {}\n var { input } = activityInstance \|\| {}\n\n const inputSpec = this.getInputSpec()\n const outputSpec = this.getOutputSpec()\n\n if (!output) {\n output = inputSpec\n .filter(item => item.inout === 'inout')\n .reduce((inout, item) => {\n inout[item.name] = input[item.name]\n return inout\n }, {})\n }\n\n return keyed(\n this.activityApproval.id,\n html`\n <fieldset>\n <legend>Input</legend>\n <ox-properties-dynamic-view data-name=\"input\" .props=${inputSpec} .value=${input}></ox-properties-dynamic-view>\n </fieldset>\n\n <fieldset>\n <legend>Output</legend>\n <ox-properties-dynamic-view\n data-name=\"output\"\n .props=${outputSpec}\n .value=${output}\n @property-change=${e => (this.activityApproval.output = e.currentTarget.value)}\n ></ox-properties-dynamic-view>\n </fieldset>\n `\n )\n }\n\n boardContent() {\n if (!this.activityApproval) {\n return html``\n }\n\n const { output, activityInstance } = this.activityThread\n const { viewSource: boardId, input } = activityInstance \|\| {}\n\n if (!this.board \|\| this.board.id !== boardId) {\n this.board = {\n id: boardId\n }\n }\n\n return keyed(\n this.activityApproval.id,\n html`\n <ox-board-viewer\n style=\"background-color: white;\"\n .board=${this.board}\n .provider=${provider}\n .values=${{ ...input, ...output }}\n hide-fullscreen\n hide-navigation\n ></ox-board-viewer>\n `\n )\n }\n\n customElementContent() {\n if (!this.activityApproval) {\n return html``\n }\n\n const { output, activityInstance } = this.activityThread\n const { viewSource: tagName, input } = activityInstance \|\| {}\n\n const element = document.createElement(tagName)\n element.id = 'custom-content'\n element.activityId = activityInstance.activity.id\n element.input = input\n element.output = output\n element.activityApproval = this.activityApproval\n\n return element\n }\n\n @query('ox-board-viewer') oxBoardViewer: any\n\n getOutputFromBoard() {\n const outputSpec = this.getOutputSpec()\n const data = this.oxBoardViewer.getSceneValues()\n\n return outputSpec.reduce((output, spec) => {\n output[spec.name] = data[spec.name]\n return output\n }, {})\n }\n\n updated(changes) {\n if (changes.has('activityApproval')) {\n this.updateContext()\n }\n }\n\n async pageUpdated(changes, lifecycle, changedBefore) {\n if (this.active && lifecycle.resourceId) {\n this.fetchActivityApproval(lifecycle.resourceId)\n }\n }\n\n async fetchActivityApproval(id) {\n const response = await client.query({\n query: gql`\n query activityApproval($id: String!) {\n activityApproval(id: $id) ${ActivityApprovalFetchResult}\n }\n `,\n variables: {\n id\n }\n })\n\n this.activityApproval = response.data.activityApproval\n this.activityThread = this.activityApproval.activityThread\n\n this.updateContext()\n }\n\n async rejectActivityApproval() {\n var { id, comment } = this.activityApproval\n\n if (!comment) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n message: i18next.t('text.enter a comment')\n }\n })\n )\n this.commentInput.focus()\n return\n }\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $comment: String!) {\n rejectActivityApproval(id: $id, comment: $comment) ${ActivityApprovalFetchResult}\n }\n `,\n variables: {\n id,\n comment\n }\n })\n\n if (!response.errors) {\n this.activityApproval = response.data.rejectActivityApproval\n this.activityThread = this.activityApproval.activityThread\n\n this.updateContext()\n\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n message: i18next.t('text.task_is_rejected_successfully')\n }\n })\n )\n }\n }\n\n async approveActivityApproval() {\n var { id, comment } = this.activityApproval\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $comment: String) {\n approveActivityApproval(id: $id, comment: $comment) ${ActivityApprovalFetchResult}\n }\n `,\n variables: {\n id,\n comment\n }\n })\n\n if (!response.errors) {\n this.activityApproval = response.data.approveActivityApproval\n this.activityThread = this.activityApproval.activityThread\n\n this.updateContext()\n\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n message: i18next.t('text.task_is_approved_successfully')\n }\n })\n )\n }\n }\n\n async saveActivityApproval() {\n var { id, comment } = this.activityApproval\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $comment: String) {\n saveActivityApproval(id: $id, comment: $comment) ${ActivityApprovalFetchResult}\n }\n `,\n variables: {\n id,\n comment\n }\n })\n\n if (!response.errors) {\n this.activityApproval = response.data.saveActivityApproval\n this.activityThread = this.activityApproval.activityThread\n\n this.updateContext()\n\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n message: i18next.t('text.task_is_saved_successfully')\n }\n })\n )\n }\n }\n}\n"]}

package/dist-client/pages/activity-thread/activity-thread-page.js CHANGED Viewed

@@ -122,7 +122,14 @@ let ActivityThreadPage = class ActivityThreadPage extends connect(store)(localiz
     }
     render() {
         const activityThread = this.activityThread;
-        return html ` ${activityThread ? html `<activity-thread-ribon .activityThread=${activityThread}></activity-thread-ribon>` : html ``} ${this.activityContent()}`;
+        if (!activityThread) {
+            return html `<div empty>no activity thread info.</div> `;
+        }
+        return html `
+      <activity-thread-ribon .activityThread=${activityThread}></activity-thread-ribon>
+      ${this.activityContent()}
+      <activity-approval-timeline .activityThread=${activityThread}></activity-approval-timeline>
+    `;
     }
     activityContent() {
         var _a, _b;
@@ -427,8 +434,13 @@ ActivityThreadPage.styles = [
         height: 100%;
       }
-      #custom-content {
-        flex: 1;
+      activity-approval-timeline {
+        margin: var(--margin-default);
+        padding: var(--padding-default);
+      }
+      div[empty] {
+        align-self: center;
       }
     `
 ];