@things-factory/worklist 6.1.64 → 6.1.67

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 (29) hide show
  1. package/client/pages/activity-instance/activity-instance-search-page.ts +1 -1
  2. package/client/pages/activity-instance/activity-instance-view.ts +43 -24
  3. package/client/pages/activity-thread/activity-thread-view.ts +15 -8
  4. package/client/pages/dashboard/dashboard-home.ts +8 -1
  5. package/client/types/activity-instance.ts +4 -0
  6. package/dist-client/pages/activity-instance/activity-instance-search-page.js +1 -1
  7. package/dist-client/pages/activity-instance/activity-instance-search-page.js.map +1 -1
  8. package/dist-client/pages/activity-instance/activity-instance-view.d.ts +1 -1
  9. package/dist-client/pages/activity-instance/activity-instance-view.js +41 -11
  10. package/dist-client/pages/activity-instance/activity-instance-view.js.map +1 -1
  11. package/dist-client/pages/activity-thread/activity-thread-view.d.ts +0 -1
  12. package/dist-client/pages/activity-thread/activity-thread-view.js +14 -7
  13. package/dist-client/pages/activity-thread/activity-thread-view.js.map +1 -1
  14. package/dist-client/pages/dashboard/dashboard-home.js +7 -1
  15. package/dist-client/pages/dashboard/dashboard-home.js.map +1 -1
  16. package/dist-client/route.d.ts +1 -1
  17. package/dist-client/tsconfig.tsbuildinfo +1 -1
  18. package/dist-client/types/activity-instance.d.ts +2 -0
  19. package/dist-client/types/activity-instance.js.map +1 -1
  20. package/dist-server/service/activity-instance/activity-instance-query.js +20 -0
  21. package/dist-server/service/activity-instance/activity-instance-query.js.map +1 -1
  22. package/dist-server/tsconfig.tsbuildinfo +1 -1
  23. package/package.json +9 -9
  24. package/server/service/activity-instance/activity-instance-query.ts +10 -0
  25. package/translations/en.json +3 -2
  26. package/translations/ja.json +3 -2
  27. package/translations/ko.json +3 -2
  28. package/translations/ms.json +3 -2
  29. package/translations/zh.json +3 -2
@@ -231,7 +231,7 @@ export class ActivityInstanceSearchPage extends connect(store)(localize(i18next)
231
231
  {
232
232
  type: 'json5',
233
233
  name: 'output',
234
- header: i18next.t('field.output'),
234
+ header: i18next.t('field.artifact'),
235
235
  record: {
236
236
  editable: false
237
237
  },
@@ -92,10 +92,19 @@ export class ActivityInstanceView extends localize(i18next)(LitElement) {
92
92
  [instance-container] div label {
93
93
  display: inline-block;
94
94
  margin-right: var(--margin-default);
95
+ min-width:50px;
96
+ }
97
+ [issuer] mwc-icon{
98
+ opacity:.5;
99
+ position:relative;
100
+ top: 4px;
101
+ font-size: 20px;
95
102
  }
96
103
  span[status] {
97
104
  width: 15px;
98
105
  height: 15px;
106
+ position: relative;
107
+ top: 2px;
99
108
  background-color: var(--worklist-status-color, tomato);
100
109
  display: inline-block;
101
110
  margin-right: var(--margin-narrow);
@@ -219,20 +228,8 @@ export class ActivityInstanceView extends localize(i18next)(LitElement) {
219
228
  return html`<div>no activity instance info.</div>`
220
229
  }
221
230
 
222
- const {
223
- id,
224
- name,
225
- description,
226
- input,
227
- output,
228
- state,
229
- assignedAt,
230
- startedAt,
231
- approvalLine,
232
- activityThreads,
233
- terminatedAt,
234
- updatedAt
235
- } = this.activityInstance
231
+ const { id, name, description, state, issuer, assignedAt, startedAt, activityThreads, terminatedAt, updatedAt } =
232
+ this.activityInstance
236
233
 
237
234
  return html`
238
235
  <div instance-container>
@@ -241,9 +238,6 @@ export class ActivityInstanceView extends localize(i18next)(LitElement) {
241
238
  <strong>${name}</strong>
242
239
  ${description}
243
240
  </div>
244
- <div>
245
- ${approvalLine ? html`<approval-line-view .model=${approvalLine}></approval-line-view>` : html``}
246
- </div>
247
241
 
248
242
  <div>
249
243
  <label>${i18next.t('label.status')}</label>
@@ -251,6 +245,11 @@ export class ActivityInstanceView extends localize(i18next)(LitElement) {
251
245
  <strong>${i18next.t('label.activity-state-' + state)}</strong>
252
246
  </div>
253
247
 
248
+ <div issuer>
249
+ <label>${i18next.t('field.issuer')}</label>
250
+ <mwc-icon>account_circle</mwc-icon>
251
+ <strong>${issuer?.name || ''}</strong>
252
+ </div>
254
253
  <div>
255
254
  <label>${i18next.t('field.assigned-at')}</label>${assignedAt && formatter.format(new Date(assignedAt))}
256
255
  </div>
@@ -260,11 +259,13 @@ export class ActivityInstanceView extends localize(i18next)(LitElement) {
260
259
  <label>${i18next.t('field.terminated-at')}</label>${terminatedAt && formatter.format(new Date(terminatedAt))}
261
260
  </div>
262
261
  </div>
263
- <div thread-container>${activityThreads?.map(activityThread => this.renderActivityThread(activityThread))}</div>
262
+ <div thread-container>
263
+ ${activityThreads?.map(activityThread => this.renderActivityThread(this.activityInstance!, activityThread))}
264
+ </div>
264
265
  `
265
266
  }
266
267
 
267
- renderActivityThread(activityThread: ActivityThread) {
268
+ renderActivityThread(activityInstance: ActivityInstance, activityThread: ActivityThread) {
268
269
  const {
269
270
  state,
270
271
  assignee,
@@ -275,7 +276,12 @@ export class ActivityInstanceView extends localize(i18next)(LitElement) {
275
276
  startedAt,
276
277
  terminatedAt
277
278
  } = activityThread
279
+ const { approvalLine } = activityInstance!
278
280
  const { name, email } = assignee || {}
281
+ const approvals = activityApprovals.sort((a, b) =>
282
+ a.round < b.round ? 1 : a.round > b.round ? -1 : a.order! < b.order! ? 1 : -1
283
+ )
284
+ const current = approvals[0]?.round == round ? approvals[0].order : -1
279
285
 
280
286
  return html`
281
287
  <div assignee>
@@ -301,15 +307,20 @@ export class ActivityInstanceView extends localize(i18next)(LitElement) {
301
307
  </div>
302
308
 
303
309
  <div>
304
- <span subtitle>${i18next.t('field.output')}</span>
310
+ <span subtitle>${i18next.t('field.artifact')}</span>
305
311
  ${this.renderInOut(output || {})}
306
312
  </div>
307
313
  <div timeline>
308
- <span subtitle>승인 검토 이력</span>
314
+ <span subtitle>${i18next.t('label.review-and-approval')}</span>
315
+
316
+ <div>
317
+ ${approvalLine
318
+ ? html`<approval-line-view .model=${approvalLine} .current=${current}></approval-line-view>`
319
+ : html``}
320
+ </div>
321
+
309
322
  <ol>
310
- ${activityApprovals
311
- .sort((a, b) => (a.round < b.round ? 1 : a.round > b.round ? -1 : a.order! < b.order! ? 1 : -1))
312
- .map(approval => this.renderActivityApproval(approval))}
323
+ ${approvals.map(approval => this.renderActivityApproval(approval))}
313
324
  </ol>
314
325
  </div>
315
326
  `
@@ -401,6 +412,14 @@ export class ActivityInstanceView extends localize(i18next)(LitElement) {
401
412
  key05
402
413
  input
403
414
  output
415
+ issuer {
416
+ name
417
+ email
418
+ }
419
+ starter {
420
+ name
421
+ email
422
+ }
404
423
  activity {
405
424
  id
406
425
  name
@@ -214,8 +214,12 @@ export class ActivityThreadView extends localize(i18next)(LitElement) {
214
214
  terminatedAt,
215
215
  activityInstance
216
216
  } = this.activityThread
217
- const { input } = activityInstance!
217
+ const { input, approvalLine } = activityInstance!
218
218
  const { name, email } = assignee || {}
219
+ const approvals = activityApprovals.sort((a, b) =>
220
+ a.round < b.round ? 1 : a.round > b.round ? -1 : a.order! < b.order! ? 1 : -1
221
+ )
222
+ const current = approvals[0]?.round == round ? approvals[0].order : -1
219
223
 
220
224
  return html`
221
225
  <div assignee>
@@ -241,22 +245,25 @@ export class ActivityThreadView extends localize(i18next)(LitElement) {
241
245
  </div>
242
246
 
243
247
  <div>
244
- <span subtitle>${i18next.t('field.output')}</span>
248
+ <span subtitle>${i18next.t('field.artifact')}</span>
245
249
  ${this.renderInOut({ ...input, ...output })}
246
250
  </div>
247
251
  <div timeline>
248
- <span subtitle>승인 검토 이력</span>
252
+ <span subtitle>${i18next.t('label.review-and-approval')}</span>
253
+
254
+ <div>
255
+ ${approvalLine
256
+ ? html`<approval-line-view .model=${approvalLine} .current=${current}></approval-line-view>`
257
+ : html``}
258
+ </div>
259
+
249
260
  <ol>
250
- ${activityApprovals
251
- .sort((a, b) => (a.round < b.round ? 1 : a.round > b.round ? -1 : a.order! < b.order! ? 1 : -1))
252
- .map(approval => this.renderActivityApproval(approval))}
261
+ ${approvals.map(approval => this.renderActivityApproval(approval))}
253
262
  </ol>
254
263
  </div>
255
264
  `
256
265
  }
257
266
 
258
- renderActivityThread(activityThread: ActivityThread) {}
259
-
260
267
  renderActivityApproval(activityApproval: ActivityApproval) {
261
268
  const { judgment, approver, comment, round, order, createdAt, terminatedAt } = activityApproval
262
269
  const { name, email } = approver || {}
@@ -3,9 +3,16 @@ import { customElement } from 'lit/decorators.js'
3
3
  import { connect } from 'pwa-helpers/connect-mixin.js'
4
4
 
5
5
  import { PageView, store } from '@operato/shell'
6
+ import { i18next, localize } from '@operato/i18n'
6
7
 
7
8
  @customElement('worklist-dashboard')
8
- class WorklistDashboardHome extends connect(store)(PageView) {
9
+ class WorklistDashboardHome extends connect(store)(localize(i18next)(PageView)) {
10
+ get context() {
11
+ return {
12
+ title: i18next.t('title.worklist dashboard')
13
+ }
14
+ }
15
+
9
16
  render() {
10
17
  return html`
11
18
  <section>
@@ -102,6 +102,10 @@ export class ActivityInstance {
102
102
 
103
103
  updaterId?: string
104
104
 
105
+ issuer?: User
106
+
107
+ issuerId?: string
108
+
105
109
  starter?: User
106
110
 
107
111
  starterId?: string
@@ -194,7 +194,7 @@ let ActivityInstanceSearchPage = class ActivityInstanceSearchPage extends connec
194
194
  {
195
195
  type: 'json5',
196
196
  name: 'output',
197
- header: i18next.t('field.output'),
197
+ header: i18next.t('field.artifact'),
198
198
  record: {
199
199
  editable: false
200
200
  },
@@ -1 +1 @@
1
- {"version":3,"file":"activity-instance-search-page.js","sourceRoot":"","sources":["../../../client/pages/activity-instance/activity-instance-search-page.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/data-grist'\nimport './activity-instance-view.js'\n\nimport gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin'\n\nimport { DataGrist, FetchOption, GristRecord } from '@operato/data-grist'\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { openPopup } from '@operato/layout'\nimport { PageView, store } from '@operato/shell'\nimport { CommonGristStyles, ScrollbarStyles } from '@operato/styles'\nimport { isMobileDevice } from '@operato/utils'\nimport { OxPopup } from '@operato/popup'\nimport { ActivitySearchKeyItem } from '../../types/activity-search-key-item-type'\n\n@customElement('activity-instance-search-page')\nexport class ActivityInstanceSearchPage extends connect(store)(localize(i18next)(PageView)) {\n static styles = [\n ScrollbarStyles,\n CommonGristStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n overflow: hidden;\n }\n\n ox-grist {\n overflow-y: auto;\n flex: 1;\n }\n `\n ]\n\n @state() activityId?: string\n @state() activity: any\n @state() searchKeys: ActivitySearchKeyItem[] = []\n\n @state() gristConfig: any\n @state() mode: 'CARD' | 'GRID' | 'LIST' = isMobileDevice() ? 'CARD' : 'GRID'\n\n @query('ox-grist') private grist!: DataGrist\n @query('#sorter-control') private sortersControl!: OxPopup\n\n get context() {\n return {\n search: {\n handler: (search: string) => {\n this.grist.searchText = search\n },\n placeholder: i18next.t('title.activity instance search'),\n value: this.grist.searchText\n },\n filter: {\n handler: () => {\n this.grist.toggleHeadroom()\n }\n },\n help: 'dataset/activity-instance-search',\n actions: [],\n exportable: {\n name: i18next.t('title.activity instance search'),\n data: this._exportableData.bind(this)\n }\n }\n }\n\n render() {\n const mode = this.mode || (isMobileDevice() ? 'LIST' : 'GRID')\n\n return html`\n <ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>\n <div slot=\"headroom\">\n <div id=\"filters\">\n <ox-filters-form autofocus without-search></ox-filters-form>\n </div>\n\n <div id=\"sorters\">\n Sort\n <mwc-icon\n @click=${e => {\n const target = e.currentTarget\n this.sortersControl.open({\n right: 0,\n top: target.offsetTop + target.offsetHeight\n })\n }}\n >expand_more</mwc-icon\n >\n <ox-popup id=\"sorter-control\">\n <ox-sorters-control> </ox-sorters-control>\n </ox-popup>\n </div>\n\n <div id=\"modes\">\n <mwc-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</mwc-icon>\n <mwc-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</mwc-icon>\n <mwc-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</mwc-icon>\n </div>\n </div>\n </ox-grist>\n `\n }\n\n pageUpdated(changes, lifecycle) {\n if (this.active) {\n this.activityId = lifecycle.resourceId\n return\n }\n }\n\n async updated(changes) {\n if (changes.has('activityId')) {\n const response = await client.query({\n query: gql`\n query ($id: String!) {\n activity(id: $id) {\n id\n name\n description\n searchKeys {\n name\n description\n inputKey\n tKey\n }\n }\n }\n `,\n variables: {\n id: this.activityId\n }\n })\n\n this.activity = response.data.activity\n this.searchKeys = this.activity?.searchKeys\n this.refreshGristConfig()\n }\n }\n\n getSearchKeyColumns() {\n return (\n this.searchKeys?.map((item, index) => {\n return {\n type: 'string',\n name: `key0${index + 1}`,\n header: item.tKey ? i18next.t(item.tKey) : `key0${index + 1}`,\n record: {\n editable: false\n },\n sortable: true,\n filter: 'i_like',\n width: 120,\n imex: true\n }\n }) || []\n )\n }\n\n refreshGristConfig() {\n this.gristConfig = {\n list: {\n fields: ['name', 'description'],\n details: ['input', 'updatedAt']\n },\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: true },\n {\n type: 'gutter',\n gutterName: 'button',\n icon: 'assignment',\n handlers: {\n click: (columns, data, column, record, rowIndex) => {\n openPopup(\n html`\n <activity-instance-view\n activity-instance-id=${record.id}\n style=\"background-color: white;\"\n ></activity-instance-view>\n `,\n {\n backdrop: true,\n size: 'large',\n title: i18next.t('title.activity instance view')\n }\n )\n }\n }\n },\n {\n type: 'string',\n name: 'name',\n label: true,\n header: i18next.t('field.name'),\n record: {\n editable: false\n },\n filter: 'search',\n sortable: true,\n width: 235,\n imex: true\n },\n {\n type: 'string',\n name: 'description',\n label: true,\n header: i18next.t('field.description'),\n record: {\n editable: false\n },\n filter: 'search',\n width: 250,\n imex: true\n },\n ...this.getSearchKeyColumns(),\n {\n type: 'json5',\n name: 'input',\n header: i18next.t('field.input'),\n record: {\n editable: false\n },\n hidden: true,\n imex: true\n },\n {\n type: 'json5',\n name: 'output',\n header: i18next.t('field.output'),\n record: {\n editable: false\n },\n hidden: true,\n imex: true\n },\n {\n type: 'resource-object',\n name: 'updater',\n header: i18next.t('field.updater'),\n sortable: true,\n width: 100,\n imex: true\n },\n {\n type: 'datetime',\n name: 'updatedAt',\n header: i18next.t('field.updated_at'),\n sortable: true,\n width: 180,\n imex: true\n }\n ],\n rows: {\n appendable: false,\n selectable: {\n multiple: true\n }\n },\n sorters: [\n {\n name: 'updatedAt',\n desc: true\n }\n ]\n }\n }\n\n async fetchHandler({ page, limit, sortings = [], filters = [] }: FetchOption) {\n if (!this.activity) {\n return { records: [], total: 0 }\n }\n\n const response = await client.query({\n query: gql`\n query ($activityId: String!, $filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {\n responses: activityInstancesByActivity(\n activityId: $activityId\n filters: $filters\n pagination: $pagination\n sortings: $sortings\n ) {\n items {\n id\n name\n description\n key01\n key02\n key03\n key04\n key05\n input\n output\n updater {\n id\n name\n }\n updatedAt\n }\n total\n }\n }\n `,\n variables: {\n activityId: this.activityId,\n filters,\n pagination: { page, limit },\n sortings\n }\n })\n\n return {\n total: response.data.responses.total || 0,\n records: response.data.responses.items || []\n }\n }\n\n _exportableData() {\n let records = [] as GristRecord[]\n if (this.grist.selected && this.grist.selected.length > 0) {\n records = this.grist.selected\n } else {\n records = this.grist.data.records\n }\n\n var headerSetting = this.grist.compiledConfig.columns\n .filter(column => column.type !== 'gutter' && column.record !== undefined && column.imex !== undefined)\n .map(column => {\n return column.imex === true\n ? {\n header: column.header.renderer(column),\n key: column.name,\n width: column.width,\n type: column.type\n }\n : column.imex\n })\n\n var data = records.map(item => {\n return {\n id: item.id,\n ...this.gristConfig.columns\n .filter(column => column.type !== 'gutter' && column.record !== undefined && column.imex !== undefined)\n .reduce((record, column) => {\n const key = column.imex === true ? column.name : column.imex.key\n record[key] = key\n .split('.')\n .reduce((obj, key) => (obj && obj[key] !== 'undefined' ? obj[key] : undefined), item)\n return record\n }, {})\n }\n })\n\n return { header: headerSetting, data: data }\n }\n}\n"]}
1
+ {"version":3,"file":"activity-instance-search-page.js","sourceRoot":"","sources":["../../../client/pages/activity-instance/activity-instance-search-page.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/data-grist'\nimport './activity-instance-view.js'\n\nimport gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin'\n\nimport { DataGrist, FetchOption, GristRecord } from '@operato/data-grist'\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { openPopup } from '@operato/layout'\nimport { PageView, store } from '@operato/shell'\nimport { CommonGristStyles, ScrollbarStyles } from '@operato/styles'\nimport { isMobileDevice } from '@operato/utils'\nimport { OxPopup } from '@operato/popup'\nimport { ActivitySearchKeyItem } from '../../types/activity-search-key-item-type'\n\n@customElement('activity-instance-search-page')\nexport class ActivityInstanceSearchPage extends connect(store)(localize(i18next)(PageView)) {\n static styles = [\n ScrollbarStyles,\n CommonGristStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n overflow: hidden;\n }\n\n ox-grist {\n overflow-y: auto;\n flex: 1;\n }\n `\n ]\n\n @state() activityId?: string\n @state() activity: any\n @state() searchKeys: ActivitySearchKeyItem[] = []\n\n @state() gristConfig: any\n @state() mode: 'CARD' | 'GRID' | 'LIST' = isMobileDevice() ? 'CARD' : 'GRID'\n\n @query('ox-grist') private grist!: DataGrist\n @query('#sorter-control') private sortersControl!: OxPopup\n\n get context() {\n return {\n search: {\n handler: (search: string) => {\n this.grist.searchText = search\n },\n placeholder: i18next.t('title.activity instance search'),\n value: this.grist.searchText\n },\n filter: {\n handler: () => {\n this.grist.toggleHeadroom()\n }\n },\n help: 'dataset/activity-instance-search',\n actions: [],\n exportable: {\n name: i18next.t('title.activity instance search'),\n data: this._exportableData.bind(this)\n }\n }\n }\n\n render() {\n const mode = this.mode || (isMobileDevice() ? 'LIST' : 'GRID')\n\n return html`\n <ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>\n <div slot=\"headroom\">\n <div id=\"filters\">\n <ox-filters-form autofocus without-search></ox-filters-form>\n </div>\n\n <div id=\"sorters\">\n Sort\n <mwc-icon\n @click=${e => {\n const target = e.currentTarget\n this.sortersControl.open({\n right: 0,\n top: target.offsetTop + target.offsetHeight\n })\n }}\n >expand_more</mwc-icon\n >\n <ox-popup id=\"sorter-control\">\n <ox-sorters-control> </ox-sorters-control>\n </ox-popup>\n </div>\n\n <div id=\"modes\">\n <mwc-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</mwc-icon>\n <mwc-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</mwc-icon>\n <mwc-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</mwc-icon>\n </div>\n </div>\n </ox-grist>\n `\n }\n\n pageUpdated(changes, lifecycle) {\n if (this.active) {\n this.activityId = lifecycle.resourceId\n return\n }\n }\n\n async updated(changes) {\n if (changes.has('activityId')) {\n const response = await client.query({\n query: gql`\n query ($id: String!) {\n activity(id: $id) {\n id\n name\n description\n searchKeys {\n name\n description\n inputKey\n tKey\n }\n }\n }\n `,\n variables: {\n id: this.activityId\n }\n })\n\n this.activity = response.data.activity\n this.searchKeys = this.activity?.searchKeys\n this.refreshGristConfig()\n }\n }\n\n getSearchKeyColumns() {\n return (\n this.searchKeys?.map((item, index) => {\n return {\n type: 'string',\n name: `key0${index + 1}`,\n header: item.tKey ? i18next.t(item.tKey) : `key0${index + 1}`,\n record: {\n editable: false\n },\n sortable: true,\n filter: 'i_like',\n width: 120,\n imex: true\n }\n }) || []\n )\n }\n\n refreshGristConfig() {\n this.gristConfig = {\n list: {\n fields: ['name', 'description'],\n details: ['input', 'updatedAt']\n },\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: true },\n {\n type: 'gutter',\n gutterName: 'button',\n icon: 'assignment',\n handlers: {\n click: (columns, data, column, record, rowIndex) => {\n openPopup(\n html`\n <activity-instance-view\n activity-instance-id=${record.id}\n style=\"background-color: white;\"\n ></activity-instance-view>\n `,\n {\n backdrop: true,\n size: 'large',\n title: i18next.t('title.activity instance view')\n }\n )\n }\n }\n },\n {\n type: 'string',\n name: 'name',\n label: true,\n header: i18next.t('field.name'),\n record: {\n editable: false\n },\n filter: 'search',\n sortable: true,\n width: 235,\n imex: true\n },\n {\n type: 'string',\n name: 'description',\n label: true,\n header: i18next.t('field.description'),\n record: {\n editable: false\n },\n filter: 'search',\n width: 250,\n imex: true\n },\n ...this.getSearchKeyColumns(),\n {\n type: 'json5',\n name: 'input',\n header: i18next.t('field.input'),\n record: {\n editable: false\n },\n hidden: true,\n imex: true\n },\n {\n type: 'json5',\n name: 'output',\n header: i18next.t('field.artifact'),\n record: {\n editable: false\n },\n hidden: true,\n imex: true\n },\n {\n type: 'resource-object',\n name: 'updater',\n header: i18next.t('field.updater'),\n sortable: true,\n width: 100,\n imex: true\n },\n {\n type: 'datetime',\n name: 'updatedAt',\n header: i18next.t('field.updated_at'),\n sortable: true,\n width: 180,\n imex: true\n }\n ],\n rows: {\n appendable: false,\n selectable: {\n multiple: true\n }\n },\n sorters: [\n {\n name: 'updatedAt',\n desc: true\n }\n ]\n }\n }\n\n async fetchHandler({ page, limit, sortings = [], filters = [] }: FetchOption) {\n if (!this.activity) {\n return { records: [], total: 0 }\n }\n\n const response = await client.query({\n query: gql`\n query ($activityId: String!, $filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {\n responses: activityInstancesByActivity(\n activityId: $activityId\n filters: $filters\n pagination: $pagination\n sortings: $sortings\n ) {\n items {\n id\n name\n description\n key01\n key02\n key03\n key04\n key05\n input\n output\n updater {\n id\n name\n }\n updatedAt\n }\n total\n }\n }\n `,\n variables: {\n activityId: this.activityId,\n filters,\n pagination: { page, limit },\n sortings\n }\n })\n\n return {\n total: response.data.responses.total || 0,\n records: response.data.responses.items || []\n }\n }\n\n _exportableData() {\n let records = [] as GristRecord[]\n if (this.grist.selected && this.grist.selected.length > 0) {\n records = this.grist.selected\n } else {\n records = this.grist.data.records\n }\n\n var headerSetting = this.grist.compiledConfig.columns\n .filter(column => column.type !== 'gutter' && column.record !== undefined && column.imex !== undefined)\n .map(column => {\n return column.imex === true\n ? {\n header: column.header.renderer(column),\n key: column.name,\n width: column.width,\n type: column.type\n }\n : column.imex\n })\n\n var data = records.map(item => {\n return {\n id: item.id,\n ...this.gristConfig.columns\n .filter(column => column.type !== 'gutter' && column.record !== undefined && column.imex !== undefined)\n .reduce((record, column) => {\n const key = column.imex === true ? column.name : column.imex.key\n record[key] = key\n .split('.')\n .reduce((obj, key) => (obj && obj[key] !== 'undefined' ? obj[key] : undefined), item)\n return record\n }, {})\n }\n })\n\n return { header: headerSetting, data: data }\n }\n}\n"]}
@@ -9,7 +9,7 @@ export declare class ActivityInstanceView extends ActivityInstanceView_base {
9
9
  activityInstanceId?: string;
10
10
  activityInstance?: ActivityInstance;
11
11
  render(): import("lit-html").TemplateResult<1>;
12
- renderActivityThread(activityThread: ActivityThread): import("lit-html").TemplateResult<1>;
12
+ renderActivityThread(activityInstance: ActivityInstance, activityThread: ActivityThread): import("lit-html").TemplateResult<1>;
13
13
  renderActivityApproval(activityApproval: ActivityApproval): import("lit-html").TemplateResult<1>;
14
14
  renderSearchKeys(): import("lit-html").TemplateResult<1>;
15
15
  renderInOut(data: any): import("lit-html").TemplateResult<1>;
@@ -13,7 +13,7 @@ let ActivityInstanceView = class ActivityInstanceView extends localize(i18next)(
13
13
  if (!this.activityInstance) {
14
14
  return html `<div>no activity instance info.</div>`;
15
15
  }
16
- const { id, name, description, input, output, state, assignedAt, startedAt, approvalLine, activityThreads, terminatedAt, updatedAt } = this.activityInstance;
16
+ const { id, name, description, state, issuer, assignedAt, startedAt, activityThreads, terminatedAt, updatedAt } = this.activityInstance;
17
17
  return html `
18
18
  <div instance-container>
19
19
  <div header>
@@ -21,9 +21,6 @@ let ActivityInstanceView = class ActivityInstanceView extends localize(i18next)(
21
21
  <strong>${name}</strong>
22
22
  ${description}
23
23
  </div>
24
- <div>
25
- ${approvalLine ? html `<approval-line-view .model=${approvalLine}></approval-line-view>` : html ``}
26
- </div>
27
24
 
28
25
  <div>
29
26
  <label>${i18next.t('label.status')}</label>
@@ -31,6 +28,11 @@ let ActivityInstanceView = class ActivityInstanceView extends localize(i18next)(
31
28
  <strong>${i18next.t('label.activity-state-' + state)}</strong>
32
29
  </div>
33
30
 
31
+ <div issuer>
32
+ <label>${i18next.t('field.issuer')}</label>
33
+ <mwc-icon>account_circle</mwc-icon>
34
+ <strong>${(issuer === null || issuer === void 0 ? void 0 : issuer.name) || ''}</strong>
35
+ </div>
34
36
  <div>
35
37
  <label>${i18next.t('field.assigned-at')}</label>${assignedAt && formatter.format(new Date(assignedAt))}
36
38
  </div>
@@ -40,12 +42,18 @@ let ActivityInstanceView = class ActivityInstanceView extends localize(i18next)(
40
42
  <label>${i18next.t('field.terminated-at')}</label>${terminatedAt && formatter.format(new Date(terminatedAt))}
41
43
  </div>
42
44
  </div>
43
- <div thread-container>${activityThreads === null || activityThreads === void 0 ? void 0 : activityThreads.map(activityThread => this.renderActivityThread(activityThread))}</div>
45
+ <div thread-container>
46
+ ${activityThreads === null || activityThreads === void 0 ? void 0 : activityThreads.map(activityThread => this.renderActivityThread(this.activityInstance, activityThread))}
47
+ </div>
44
48
  `;
45
49
  }
46
- renderActivityThread(activityThread) {
50
+ renderActivityThread(activityInstance, activityThread) {
51
+ var _a;
47
52
  const { state, assignee, output, round, activityApprovals = [], assignedAt, startedAt, terminatedAt } = activityThread;
53
+ const { approvalLine } = activityInstance;
48
54
  const { name, email } = assignee || {};
55
+ const approvals = activityApprovals.sort((a, b) => a.round < b.round ? 1 : a.round > b.round ? -1 : a.order < b.order ? 1 : -1);
56
+ const current = ((_a = approvals[0]) === null || _a === void 0 ? void 0 : _a.round) == round ? approvals[0].order : -1;
49
57
  return html `
50
58
  <div assignee>
51
59
  <mwc-icon>account_circle</mwc-icon>
@@ -70,15 +78,20 @@ let ActivityInstanceView = class ActivityInstanceView extends localize(i18next)(
70
78
  </div>
71
79
 
72
80
  <div>
73
- <span subtitle>${i18next.t('field.output')}</span>
81
+ <span subtitle>${i18next.t('field.artifact')}</span>
74
82
  ${this.renderInOut(output || {})}
75
83
  </div>
76
84
  <div timeline>
77
- <span subtitle>승인 검토 이력</span>
85
+ <span subtitle>${i18next.t('label.review-and-approval')}</span>
86
+
87
+ <div>
88
+ ${approvalLine
89
+ ? html `<approval-line-view .model=${approvalLine} .current=${current}></approval-line-view>`
90
+ : html ``}
91
+ </div>
92
+
78
93
  <ol>
79
- ${activityApprovals
80
- .sort((a, b) => (a.round < b.round ? 1 : a.round > b.round ? -1 : a.order < b.order ? 1 : -1))
81
- .map(approval => this.renderActivityApproval(approval))}
94
+ ${approvals.map(approval => this.renderActivityApproval(approval))}
82
95
  </ol>
83
96
  </div>
84
97
  `;
@@ -158,6 +171,14 @@ let ActivityInstanceView = class ActivityInstanceView extends localize(i18next)(
158
171
  key05
159
172
  input
160
173
  output
174
+ issuer {
175
+ name
176
+ email
177
+ }
178
+ starter {
179
+ name
180
+ email
181
+ }
161
182
  activity {
162
183
  id
163
184
  name
@@ -312,10 +333,19 @@ ActivityInstanceView.styles = [
312
333
  [instance-container] div label {
313
334
  display: inline-block;
314
335
  margin-right: var(--margin-default);
336
+ min-width:50px;
337
+ }
338
+ [issuer] mwc-icon{
339
+ opacity:.5;
340
+ position:relative;
341
+ top: 4px;
342
+ font-size: 20px;
315
343
  }
316
344
  span[status] {
317
345
  width: 15px;
318
346
  height: 15px;
347
+ position: relative;
348
+ top: 2px;
319
349
  background-color: var(--worklist-status-color, tomato);
320
350
  display: inline-block;
321
351
  margin-right: var(--margin-narrow);
@@ -1 +1 @@
1
- {"version":3,"file":"activity-instance-view.js","sourceRoot":"","sources":["../../../client/pages/activity-instance/activity-instance-view.ts"],"names":[],"mappings":"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","sourcesContent":["import '@things-factory/organization/dist-client/component/approval-line-view.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { ActivityInstance } from '../../types/activity-instance'\nimport { ActivityThread } from '../../types/activity-thread'\nimport { ActivityApproval } from '../../types/activity-approval'\n\nconst formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle: 'short', timeStyle: 'short' })\n\n@customElement('activity-instance-view')\nexport class ActivityInstanceView extends localize(i18next)(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n overflow: auto;\n font-size: var(--fontsize-default);\n }\n :host([state='assigned']) {\n --worklist-status-color: #5f7184;\n }\n\n :host([state='started']) {\n --worklist-status-color: #56af45;\n }\n\n :host([state='delegated']) {\n --worklist-status-color: #8654b0;\n }\n\n :host([state='submitted']) {\n --worklist-status-color: #428df3;\n }\n\n :host([state='escalated']) {\n --worklist-status-color: #595de5;\n }\n\n :host([state='rejected']) {\n --worklist-status-color: #f27429;\n }\n\n :host([state='ended']) {\n --worklist-status-color: #02acae;\n }\n\n :host([state='aborted']) {\n --worklist-status-color: #cb3a33;\n }\n [instance-container] {\n flex: 1;\n background-color: var(--main-section-background-color);\n border-right: var(--border-dark-color);\n padding: var(--padding-wide);\n color: var(--primary-text-color);\n }\n [thread-container] {\n flex: 2;\n padding: var(--padding-wide);\n }\n [instance-container] div {\n margin-bottom: var(--margin-default);\n padding-bottom: var(--padding-default);\n border-bottom: var(--border-dark-color);\n }\n [header] mwc-icon {\n background-color: var(--worklist-status-color, tomato);\n float: left;\n margin-right: var(--margin-default);\n padding: var(--padding-default);\n border-radius: 50%;\n float: left;\n font-size: 1.8em;\n color: var(--theme-white-color);\n }\n [header] strong {\n display: block;\n font: bold 22px / 1.1 var(--theme-font);\n }\n [header] {\n overflow: hidden;\n font-size: var(--fontsize-small);\n }\n [instance-container] div label {\n display: inline-block;\n margin-right: var(--margin-default);\n }\n span[status] {\n width: 15px;\n height: 15px;\n background-color: var(--worklist-status-color, tomato);\n display: inline-block;\n margin-right: var(--margin-narrow);\n border-radius: 50%;\n }\n [thread-container] table {\n width: 100%;\n border-collapse: collapse;\n }\n [thread-container] th {\n background-color: rgba(var(--primary-color-rgb), 0.05);\n border-top: var(--grid-header-top-border);\n border-bottom: var(--grid-header-bottom-border);\n padding: var(--grid-header-padding);\n text-overflow: ellipsis;\n font: var(--grid-header-font);\n color: var(--grid-header-color);\n }\n [thread-container] td {\n padding: var(--padding-narrow);\n border-bottom: var(--grid-record-border-bottom);\n }\n [assignee] * {\n vertical-align: middle;\n }\n [assignee] mwc-icon {\n opacity: 0.5;\n }\n [subtitle] {\n display: block;\n margin: var(--margin-wide) 0 var(--margin-narrow) 0;\n font: bold 16px var(--theme-font);\n color: var(--secondary-text-color);\n }\n [timeline] ol {\n list-style: none;\n margin: 0;\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: 120px;\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: #f4f4f4;\n margin: var(--margin-narrow) 0 var(--margin-default) 0;\n padding: var(--padding-narrow) var(--padding-default);\n border-radius: var(--border-radius);\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 [thread] div {\n border-bottom: var(--border-dark-color);\n padding: var(--padding-narrow);\n text-align: right;\n overflow: hidden;\n }\n [thread] div label {\n float: left;\n width: 25%;\n text-align: left;\n }\n `\n ]\n\n @property({\n type: String,\n attribute: 'activity-instance-id'\n })\n activityInstanceId?: string\n\n @state() activityInstance?: ActivityInstance\n\n render() {\n if (!this.activityInstance) {\n return html`<div>no activity instance info.</div>`\n }\n\n const {\n id,\n name,\n description,\n input,\n output,\n state,\n assignedAt,\n startedAt,\n approvalLine,\n activityThreads,\n terminatedAt,\n updatedAt\n } = this.activityInstance\n\n return html`\n <div instance-container>\n <div header>\n <mwc-icon>description</mwc-icon>\n <strong>${name}</strong>\n ${description}\n </div>\n <div>\n ${approvalLine ? html`<approval-line-view .model=${approvalLine}></approval-line-view>` : html``}\n </div> \n\n <div>\n <label>${i18next.t('label.status')}</label>\n <span status></span>\n <strong>${i18next.t('label.activity-state-' + state)}</strong>\n </div>\n\n <div>\n <label>${i18next.t('field.assigned-at')}</label>${assignedAt && formatter.format(new Date(assignedAt))}\n </div>\n <div><label>${i18next.t('field.started-at')}</label>${startedAt && formatter.format(new Date(startedAt))}</div>\n <div><label>${i18next.t('field.updated-at')}</label>${updatedAt && formatter.format(new Date(updatedAt))}</div>\n <div>\n <label>${i18next.t('field.terminated-at')}</label>${terminatedAt && formatter.format(new Date(terminatedAt))}\n </div>\n </div>\n <div thread-container>${activityThreads?.map(activityThread => this.renderActivityThread(activityThread))}</div>\n `\n }\n\n renderActivityThread(activityThread: ActivityThread) {\n const {\n state,\n assignee,\n output,\n round,\n activityApprovals = [],\n assignedAt,\n startedAt,\n terminatedAt\n } = activityThread\n const { name, email } = assignee || {}\n\n return html`\n <div assignee>\n <mwc-icon>account_circle</mwc-icon>\n <strong>${name}</strong>\n </div>\n\n <div thread>\n <span subtitle>${i18next.t('label.information')}</span>\n <div>\n <label>${i18next.t('label.status')}</label>\n <span status></span>\n <strong>${i18next.t('label.activity-state-' + state)}</strong>\n </div>\n <div>\n <label>${i18next.t('field.assigned-at')}</label> ${assignedAt && formatter.format(new Date(assignedAt))}\n </div>\n <div><label>${i18next.t('field.started-at')}</label> ${startedAt && formatter.format(new Date(startedAt))}</div>\n <div>\n <label>${i18next.t('field.terminated-at')}</label> ${terminatedAt && formatter.format(new Date(terminatedAt))}\n </div>\n <div><label>${i18next.t('field.round')}</label> ${round}</div>\n </div>\n\n <div>\n <span subtitle>${i18next.t('field.output')}</span>\n ${this.renderInOut(output || {})}\n </div>\n <div timeline>\n <span subtitle>승인 검토 이력</span>\n <ol>\n ${activityApprovals\n .sort((a, b) => (a.round < b.round ? 1 : a.round > b.round ? -1 : a.order! < b.order! ? 1 : -1))\n .map(approval => this.renderActivityApproval(approval))}\n </ol>\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 renderSearchKeys() {\n const { activity } = this.activityInstance!\n const { searchKeys = [] } = activity! || {}\n\n return html`\n <table>\n <tr>\n <th>${i18next.t('label.name')}</th>\n <th>${i18next.t('label.value')}</th>\n </tr>\n\n ${searchKeys?.map(\n (item, index) => html`\n <tr>\n <td>${item.tKey ? i18next.t(item.tKey) : item.name}</td>\n <td>${this.activityInstance![`key0${index + 1}`]}</td>\n </tr>\n `\n )}\n </table>\n `\n }\n\n renderInOut(data) {\n const { activity } = this.activityInstance!\n const { model } = activity || {}\n\n return html`\n <table>\n <tr>\n <th>${i18next.t('label.name')}</th>\n <th>${i18next.t('label.value')}</th>\n </tr>\n ${model?.map(\n item => html`\n <tr>\n <td>${item.name}</td>\n <td>${item.tag ? data[item.tag] : ''}</td>\n </tr>\n `\n )}\n </table>\n `\n }\n\n updated(changes) {\n if (changes.has('activityInstanceId')) {\n this.fetchActivityInstance()\n }\n }\n\n async fetchActivityInstance() {\n const id = this.activityInstanceId\n\n const response = await client.query({\n query: gql`\n query ($id: String!) {\n activityInstance(id: $id) {\n id\n name\n description\n state\n key01\n key02\n key03\n key04\n key05\n input\n output\n activity {\n id\n name\n description\n searchKeys {\n name\n description\n inputKey\n tKey\n }\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 activityThreads {\n state\n transaction\n output\n assignee {\n id\n name\n email\n }\n round\n activityApprovals {\n round\n order\n approver {\n name\n email\n }\n judgment\n comment\n createdAt\n terminatedAt\n }\n assignedAt\n startedAt\n terminatedAt\n }\n updater {\n id\n name\n }\n assignedAt\n startedAt\n terminatedAt\n updatedAt\n }\n }\n `,\n variables: {\n id\n }\n })\n\n this.activityInstance = response.data.activityInstance\n this.setAttribute('state', this.activityInstance?.state || '')\n }\n}\n"]}
1
+ {"version":3,"file":"activity-instance-view.js","sourceRoot":"","sources":["../../../client/pages/activity-instance/activity-instance-view.ts"],"names":[],"mappings":"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","sourcesContent":["import '@things-factory/organization/dist-client/component/approval-line-view.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { ActivityInstance } from '../../types/activity-instance'\nimport { ActivityThread } from '../../types/activity-thread'\nimport { ActivityApproval } from '../../types/activity-approval'\n\nconst formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle: 'short', timeStyle: 'short' })\n\n@customElement('activity-instance-view')\nexport class ActivityInstanceView extends localize(i18next)(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n overflow: auto;\n font-size: var(--fontsize-default);\n }\n :host([state='assigned']) {\n --worklist-status-color: #5f7184;\n }\n\n :host([state='started']) {\n --worklist-status-color: #56af45;\n }\n\n :host([state='delegated']) {\n --worklist-status-color: #8654b0;\n }\n\n :host([state='submitted']) {\n --worklist-status-color: #428df3;\n }\n\n :host([state='escalated']) {\n --worklist-status-color: #595de5;\n }\n\n :host([state='rejected']) {\n --worklist-status-color: #f27429;\n }\n\n :host([state='ended']) {\n --worklist-status-color: #02acae;\n }\n\n :host([state='aborted']) {\n --worklist-status-color: #cb3a33;\n }\n [instance-container] {\n flex: 1;\n background-color: var(--main-section-background-color);\n border-right: var(--border-dark-color);\n padding: var(--padding-wide);\n color: var(--primary-text-color);\n }\n [thread-container] {\n flex: 2;\n padding: var(--padding-wide);\n }\n [instance-container] div {\n margin-bottom: var(--margin-default);\n padding-bottom: var(--padding-default);\n border-bottom: var(--border-dark-color);\n }\n [header] mwc-icon {\n background-color: var(--worklist-status-color, tomato);\n float: left;\n margin-right: var(--margin-default);\n padding: var(--padding-default);\n border-radius: 50%;\n float: left;\n font-size: 1.8em;\n color: var(--theme-white-color);\n }\n [header] strong {\n display: block;\n font: bold 22px / 1.1 var(--theme-font);\n }\n [header] {\n overflow: hidden;\n font-size: var(--fontsize-small);\n }\n [instance-container] div label {\n display: inline-block;\n margin-right: var(--margin-default);\n min-width:50px;\n }\n [issuer] mwc-icon{\n opacity:.5;\n position:relative;\n top: 4px;\n font-size: 20px;\n }\n span[status] {\n width: 15px;\n height: 15px;\n position: relative;\n top: 2px;\n background-color: var(--worklist-status-color, tomato);\n display: inline-block;\n margin-right: var(--margin-narrow);\n border-radius: 50%;\n }\n [thread-container] table {\n width: 100%;\n border-collapse: collapse;\n }\n [thread-container] th {\n background-color: rgba(var(--primary-color-rgb), 0.05);\n border-top: var(--grid-header-top-border);\n border-bottom: var(--grid-header-bottom-border);\n padding: var(--grid-header-padding);\n text-overflow: ellipsis;\n font: var(--grid-header-font);\n color: var(--grid-header-color);\n }\n [thread-container] td {\n padding: var(--padding-narrow);\n border-bottom: var(--grid-record-border-bottom);\n }\n [assignee] * {\n vertical-align: middle;\n }\n [assignee] mwc-icon {\n opacity: 0.5;\n }\n [subtitle] {\n display: block;\n margin: var(--margin-wide) 0 var(--margin-narrow) 0;\n font: bold 16px var(--theme-font);\n color: var(--secondary-text-color);\n }\n [timeline] ol {\n list-style: none;\n margin: 0;\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: 120px;\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: #f4f4f4;\n margin: var(--margin-narrow) 0 var(--margin-default) 0;\n padding: var(--padding-narrow) var(--padding-default);\n border-radius: var(--border-radius);\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 [thread] div {\n border-bottom: var(--border-dark-color);\n padding: var(--padding-narrow);\n text-align: right;\n overflow: hidden;\n }\n [thread] div label {\n float: left;\n width: 25%;\n text-align: left;\n }\n `\n ]\n\n @property({\n type: String,\n attribute: 'activity-instance-id'\n })\n activityInstanceId?: string\n\n @state() activityInstance?: ActivityInstance\n\n render() {\n if (!this.activityInstance) {\n return html`<div>no activity instance info.</div>`\n }\n\n const { id, name, description, state, issuer, assignedAt, startedAt, activityThreads, terminatedAt, updatedAt } =\n this.activityInstance\n\n return html`\n <div instance-container>\n <div header>\n <mwc-icon>description</mwc-icon>\n <strong>${name}</strong>\n ${description}\n </div>\n\n <div>\n <label>${i18next.t('label.status')}</label>\n <span status></span>\n <strong>${i18next.t('label.activity-state-' + state)}</strong>\n </div>\n\n <div issuer>\n <label>${i18next.t('field.issuer')}</label>\n <mwc-icon>account_circle</mwc-icon>\n <strong>${issuer?.name || ''}</strong>\n </div>\n <div>\n <label>${i18next.t('field.assigned-at')}</label>${assignedAt && formatter.format(new Date(assignedAt))}\n </div>\n <div><label>${i18next.t('field.started-at')}</label>${startedAt && formatter.format(new Date(startedAt))}</div>\n <div><label>${i18next.t('field.updated-at')}</label>${updatedAt && formatter.format(new Date(updatedAt))}</div>\n <div>\n <label>${i18next.t('field.terminated-at')}</label>${terminatedAt && formatter.format(new Date(terminatedAt))}\n </div>\n </div>\n <div thread-container>\n ${activityThreads?.map(activityThread => this.renderActivityThread(this.activityInstance!, activityThread))}\n </div>\n `\n }\n\n renderActivityThread(activityInstance: ActivityInstance, activityThread: ActivityThread) {\n const {\n state,\n assignee,\n output,\n round,\n activityApprovals = [],\n assignedAt,\n startedAt,\n terminatedAt\n } = activityThread\n const { approvalLine } = activityInstance!\n const { name, email } = assignee || {}\n const approvals = activityApprovals.sort((a, b) =>\n a.round < b.round ? 1 : a.round > b.round ? -1 : a.order! < b.order! ? 1 : -1\n )\n const current = approvals[0]?.round == round ? approvals[0].order : -1\n\n return html`\n <div assignee>\n <mwc-icon>account_circle</mwc-icon>\n <strong>${name}</strong>\n </div>\n\n <div thread>\n <span subtitle>${i18next.t('label.information')}</span>\n <div>\n <label>${i18next.t('label.status')}</label>\n <span status></span>\n <strong>${i18next.t('label.activity-state-' + state)}</strong>\n </div>\n <div>\n <label>${i18next.t('field.assigned-at')}</label> ${assignedAt && formatter.format(new Date(assignedAt))}\n </div>\n <div><label>${i18next.t('field.started-at')}</label> ${startedAt && formatter.format(new Date(startedAt))}</div>\n <div>\n <label>${i18next.t('field.terminated-at')}</label> ${terminatedAt && formatter.format(new Date(terminatedAt))}\n </div>\n <div><label>${i18next.t('field.round')}</label> ${round}</div>\n </div>\n\n <div>\n <span subtitle>${i18next.t('field.artifact')}</span>\n ${this.renderInOut(output || {})}\n </div>\n <div timeline>\n <span subtitle>${i18next.t('label.review-and-approval')}</span>\n\n <div>\n ${approvalLine\n ? html`<approval-line-view .model=${approvalLine} .current=${current}></approval-line-view>`\n : html``}\n </div>\n\n <ol>\n ${approvals.map(approval => this.renderActivityApproval(approval))}\n </ol>\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 renderSearchKeys() {\n const { activity } = this.activityInstance!\n const { searchKeys = [] } = activity! || {}\n\n return html`\n <table>\n <tr>\n <th>${i18next.t('label.name')}</th>\n <th>${i18next.t('label.value')}</th>\n </tr>\n\n ${searchKeys?.map(\n (item, index) => html`\n <tr>\n <td>${item.tKey ? i18next.t(item.tKey) : item.name}</td>\n <td>${this.activityInstance![`key0${index + 1}`]}</td>\n </tr>\n `\n )}\n </table>\n `\n }\n\n renderInOut(data) {\n const { activity } = this.activityInstance!\n const { model } = activity || {}\n\n return html`\n <table>\n <tr>\n <th>${i18next.t('label.name')}</th>\n <th>${i18next.t('label.value')}</th>\n </tr>\n ${model?.map(\n item => html`\n <tr>\n <td>${item.name}</td>\n <td>${item.tag ? data[item.tag] : ''}</td>\n </tr>\n `\n )}\n </table>\n `\n }\n\n updated(changes) {\n if (changes.has('activityInstanceId')) {\n this.fetchActivityInstance()\n }\n }\n\n async fetchActivityInstance() {\n const id = this.activityInstanceId\n\n const response = await client.query({\n query: gql`\n query ($id: String!) {\n activityInstance(id: $id) {\n id\n name\n description\n state\n key01\n key02\n key03\n key04\n key05\n input\n output\n issuer {\n name\n email\n }\n starter {\n name\n email\n }\n activity {\n id\n name\n description\n searchKeys {\n name\n description\n inputKey\n tKey\n }\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 activityThreads {\n state\n transaction\n output\n assignee {\n id\n name\n email\n }\n round\n activityApprovals {\n round\n order\n approver {\n name\n email\n }\n judgment\n comment\n createdAt\n terminatedAt\n }\n assignedAt\n startedAt\n terminatedAt\n }\n updater {\n id\n name\n }\n assignedAt\n startedAt\n terminatedAt\n updatedAt\n }\n }\n `,\n variables: {\n id\n }\n })\n\n this.activityInstance = response.data.activityInstance\n this.setAttribute('state', this.activityInstance?.state || '')\n }\n}\n"]}
@@ -8,7 +8,6 @@ export declare class ActivityThreadView extends ActivityThreadView_base {
8
8
  activityThreadId?: string;
9
9
  activityThread?: ActivityThread;
10
10
  render(): import("lit-html").TemplateResult<1>;
11
- renderActivityThread(activityThread: ActivityThread): void;
12
11
  renderActivityApproval(activityApproval: ActivityApproval): import("lit-html").TemplateResult<1>;
13
12
  renderInOut(data: any): import("lit-html").TemplateResult<1>;
14
13
  updated(changes: any): void;
@@ -10,12 +10,15 @@ import { ActivityThread } from '../../types/activity-thread';
10
10
  const formatter = new Intl.DateTimeFormat(navigator.language, { dateStyle: 'short', timeStyle: 'short' });
11
11
  let ActivityThreadView = class ActivityThreadView extends localize(i18next)(LitElement) {
12
12
  render() {
13
+ var _a;
13
14
  if (!this.activityThread) {
14
15
  return html `<div>no activity thread info.</div>`;
15
16
  }
16
17
  const { state, assignee, output, round, activityApprovals = [], assignedAt, startedAt, terminatedAt, activityInstance } = this.activityThread;
17
- const { input } = activityInstance;
18
+ const { input, approvalLine } = activityInstance;
18
19
  const { name, email } = assignee || {};
20
+ const approvals = activityApprovals.sort((a, b) => a.round < b.round ? 1 : a.round > b.round ? -1 : a.order < b.order ? 1 : -1);
21
+ const current = ((_a = approvals[0]) === null || _a === void 0 ? void 0 : _a.round) == round ? approvals[0].order : -1;
19
22
  return html `
20
23
  <div assignee>
21
24
  <mwc-icon>account_circle</mwc-icon>
@@ -40,20 +43,24 @@ let ActivityThreadView = class ActivityThreadView extends localize(i18next)(LitE
40
43
  </div>
41
44
 
42
45
  <div>
43
- <span subtitle>${i18next.t('field.output')}</span>
46
+ <span subtitle>${i18next.t('field.artifact')}</span>
44
47
  ${this.renderInOut(Object.assign(Object.assign({}, input), output))}
45
48
  </div>
46
49
  <div timeline>
47
- <span subtitle>승인 검토 이력</span>
50
+ <span subtitle>${i18next.t('label.review-and-approval')}</span>
51
+
52
+ <div>
53
+ ${approvalLine
54
+ ? html `<approval-line-view .model=${approvalLine} .current=${current}></approval-line-view>`
55
+ : html ``}
56
+ </div>
57
+
48
58
  <ol>
49
- ${activityApprovals
50
- .sort((a, b) => (a.round < b.round ? 1 : a.round > b.round ? -1 : a.order < b.order ? 1 : -1))
51
- .map(approval => this.renderActivityApproval(approval))}
59
+ ${approvals.map(approval => this.renderActivityApproval(approval))}
52
60
  </ol>
53
61
  </div>
54
62
  `;
55
63
  }
56
- renderActivityThread(activityThread) { }
57
64
  renderActivityApproval(activityApproval) {
58
65
  const { judgment, approver, comment, round, order, createdAt, terminatedAt } = activityApproval;
59
66
  const { name, email } = approver || {};