@things-factory/compliance 0.0.0-stage → 10.1.254

package/dist-client/components/invention-report-form.js

@@ -0,0 +1,188 @@
+import { __decorate, __metadata } from "tslib";
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@operato/input/ox-input-file.js';
+import '@operato/input/ox-select.js';
+import '@operato/popup/ox-popup-actions.js';
+import '@operato/popup/ox-popup-list.js';
+import gql from 'graphql-tag';
+import { css, html, LitElement } from 'lit';
+import { customElement, state } from 'lit/decorators.js';
+import { client, uploadContext } from '@operato/graphql';
+import { i18next, localize } from '@operato/i18n';
+import { notify, openPopup } from '@operato/layout';
+import { CommonPopupStyles, FormFieldStyles, PopupBodyStyles, PopupFieldStyles } from '@operato/styles';
+import { failureOf } from '../words.js';
+/** Opens the form; resolves with the reported invention, or null when the person closed it. */
+export function openInventionReportForm() {
+    return new Promise(resolve => {
+        let done = null;
+        const handle = openPopup(html `<invention-report-form @close=${() => handle.close()} @reported=${(e) => ((done = e.detail), handle.close())}></invention-report-form>`, { backdrop: true, size: 'medium', title: i18next.t('title.invention-report') });
+        handle.onclosed = () => resolve(done);
+    });
+}
+const today = () => {
+    const now = new Date();
+    return new Date(now.getTime() - now.getTimezoneOffset() * 60000).toISOString().slice(0, 10);
+};
+/**
+ * 직무발명 신고 (ADR-0187 decision 24 · 발명진흥법 §12) - what the invention is, who invented it with the reporter, the
+ * papers that show it. The company tells whether it succeeds to the right within four months of the report.
+ */
+let InventionReportForm = class InventionReportForm extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.inventionTitle = '';
+        this.content = '';
+        this.reportedOn = today();
+        this.coInventorIds = [];
+        this.files = [];
+        this.people = [];
+        this.working = false;
+        this.message = '';
+    }
+    /* The house shape of a popup (page-standard sections 7, 8): only the body scrolls, fields are labels above native
+       inputs, the one button row is `ox-popup-actions`. */
+    static { this.styles = [
+        CommonPopupStyles,
+        PopupBodyStyles,
+        FormFieldStyles,
+        PopupFieldStyles,
+        css `
+      [invalid] {
+        color: var(--ui-crit, var(--md-sys-color-error));
+        font-size: var(--ui-t-small, 11.5px);
+      }
+      [invalid]:empty {
+        display: none;
+      }
+      [guide] p {
+        margin: 0;
+        color: var(--ui-muted);
+        line-height: var(--popup-line-height);
+      }
+      textarea {
+        min-height: 8em;
+        resize: vertical;
+      }
+      ox-select {
+        width: 100%;
+      }
+    `
+    ]; }
+    async connectedCallback() {
+        super.connectedCallback();
+        const response = await client.query({ query: gql `query { inventionColleagues { id name departmentName } }`, fetchPolicy: 'no-cache' });
+        this.people = (response.data?.inventionColleagues ?? []).map((one) => ({ value: one.id, display: one.departmentName ? `${one.name} · ${one.departmentName}` : one.name }));
+    }
+    render() {
+        const named = this.people.filter(one => this.coInventorIds.includes(one.value)).map(one => one.display);
+        return html `
+      <div class="body">
+        <div guide><p>${i18next.t('text.invention-report-guide')}</p></div>
+
+        <label class="field">
+          <span>${i18next.t('field.invention-title')}</span>
+          <input .value=${this.inventionTitle} @input=${(e) => (this.inventionTitle = e.target.value)} />
+        </label>
+
+        <label class="field">
+          <span>${i18next.t('field.invention-content')}</span>
+          <textarea .value=${this.content} @input=${(e) => (this.content = e.target.value)}></textarea>
+        </label>
+
+        <label class="field">
+          <span>${i18next.t('field.invention-reported-on')}</span>
+          <input type="date" .value=${this.reportedOn} @input=${(e) => (this.reportedOn = e.target.value)} />
+        </label>
+
+        <label class="field">
+          <span>${i18next.t('field.invention-co-inventors')}</span>
+          <ox-select multiple .value=${this.coInventorIds} @change=${(e) => (this.coInventorIds = [].concat(e.detail ?? []).filter(Boolean))}>
+            <span slot="label">${named.length ? named.join(', ') : '—'}</span>
+            <ox-popup-list align-left nowrap with-search multiple>${this.people.map(one => html `<div option value=${one.value}>${one.display}</div>`)}</ox-popup-list>
+          </ox-select>
+        </label>
+
+        <div class="field">
+          <span>${i18next.t('field.invention-files')}</span>
+          <ox-input-file multiple .progress=${this.progress} @change=${(e) => (this.files = [...(e.detail ?? [])])}></ox-input-file>
+          <span invalid>${this.message}</span>
+        </div>
+      </div>
+
+      <ox-popup-actions>
+        <md-text-button slot="cancel" @click=${() => this.dispatchEvent(new CustomEvent('close'))}>${i18next.t('button.cancel')}</md-text-button>
+        <md-filled-button slot="confirm" ?disabled=${this.working} @click=${() => this.report()}>${i18next.t('button.invention-report')}</md-filled-button>
+      </ox-popup-actions>
+    `;
+    }
+    async report() {
+        this.message = '';
+        this.working = true;
+        try {
+            const response = await client.mutate({
+                mutation: gql `
+          mutation ($invention: NewInvention!, $files: [Upload!]) {
+            reportInvention(invention: $invention, files: $files) { id decisionDueOn }
+          }
+        `,
+                variables: { invention: { title: this.inventionTitle, content: this.content, reportedOn: this.reportedOn || null, coInventorIds: this.coInventorIds }, files: this.files },
+                ...(this.files.length ? { context: uploadContext((fraction) => (this.progress = fraction)) } : {})
+            });
+            if (response.errors?.length)
+                throw response;
+            const reported = response.data.reportInvention;
+            notify({ message: i18next.t('text.invention-reported', { day: reported.decisionDueOn }) });
+            this.dispatchEvent(new CustomEvent('reported', { detail: reported }));
+        }
+        catch (error) {
+            this.message = failureOf(error);
+        }
+        finally {
+            this.working = false;
+            this.progress = undefined;
+        }
+    }
+};
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], InventionReportForm.prototype, "inventionTitle", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], InventionReportForm.prototype, "content", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], InventionReportForm.prototype, "reportedOn", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], InventionReportForm.prototype, "coInventorIds", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], InventionReportForm.prototype, "files", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], InventionReportForm.prototype, "people", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], InventionReportForm.prototype, "working", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Number)
+], InventionReportForm.prototype, "progress", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], InventionReportForm.prototype, "message", void 0);
+InventionReportForm = __decorate([
+    customElement('invention-report-form')
+], InventionReportForm);
+export { InventionReportForm };
+//# sourceMappingURL=invention-report-form.js.map

package/dist-client/components/invention-report-form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"invention-report-form.js","sourceRoot":"","sources":["../../client/components/invention-report-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/button/filled-button.js'\nimport '@material/web/button/text-button.js'\nimport '@operato/input/ox-input-file.js'\nimport '@operato/input/ox-select.js'\nimport '@operato/popup/ox-popup-actions.js'\nimport '@operato/popup/ox-popup-list.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\n\nimport { client, uploadContext } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { notify, openPopup } from '@operato/layout'\nimport { CommonPopupStyles, FormFieldStyles, PopupBodyStyles, PopupFieldStyles } from '@operato/styles'\n\nimport { failureOf } from '../words.js'\n\ntype Choice = { value: string; display: string }\n\n/** Opens the form; resolves with the reported invention, or null when the person closed it. */\nexport function openInventionReportForm(): Promise<any | null> {\n  return new Promise(resolve => {\n    let done: any = null\n    const handle: any = openPopup(\n      html`<invention-report-form @close=${() => handle.close()} @reported=${(e: CustomEvent) => ((done = e.detail), handle.close())}></invention-report-form>`,\n      { backdrop: true, size: 'medium', title: i18next.t('title.invention-report') }\n    )\n    handle.onclosed = () => resolve(done)\n  })\n}\n\nconst today = () => {\n  const now = new Date()\n  return new Date(now.getTime() - now.getTimezoneOffset() * 60000).toISOString().slice(0, 10)\n}\n\n/**\n * 직무발명 신고 (ADR-0187 decision 24 · 발명진흥법 §12) - what the invention is, who invented it with the reporter, the\n * papers that show it. The company tells whether it succeeds to the right within four months of the report.\n */\n@customElement('invention-report-form')\nexport class InventionReportForm extends localize(i18next)(LitElement) {\n  /* The house shape of a popup (page-standard sections 7, 8): only the body scrolls, fields are labels above native\n     inputs, the one button row is `ox-popup-actions`. */\n  static styles = [\n    CommonPopupStyles,\n    PopupBodyStyles,\n    FormFieldStyles,\n    PopupFieldStyles,\n    css`\n      [invalid] {\n        color: var(--ui-crit, var(--md-sys-color-error));\n        font-size: var(--ui-t-small, 11.5px);\n      }\n      [invalid]:empty {\n        display: none;\n      }\n      [guide] p {\n        margin: 0;\n        color: var(--ui-muted);\n        line-height: var(--popup-line-height);\n      }\n      textarea {\n        min-height: 8em;\n        resize: vertical;\n      }\n      ox-select {\n        width: 100%;\n      }\n    `\n  ]\n\n  @state() private inventionTitle = ''\n  @state() private content = ''\n  @state() private reportedOn = today()\n  @state() private coInventorIds: string[] = []\n  @state() private files: File[] = []\n  @state() private people: Choice[] = []\n  @state() private working = false\n  @state() private progress?: number\n  @state() private message = ''\n\n  async connectedCallback() {\n    super.connectedCallback()\n    const response = await client.query({ query: gql`query { inventionColleagues { id name departmentName } }`, fetchPolicy: 'no-cache' })\n    this.people = (response.data?.inventionColleagues ?? []).map((one: any) => ({ value: one.id, display: one.departmentName ? `${one.name} · ${one.departmentName}` : one.name }))\n  }\n\n  render() {\n    const named = this.people.filter(one => this.coInventorIds.includes(one.value)).map(one => one.display)\n    return html`\n      <div class=\"body\">\n        <div guide><p>${i18next.t('text.invention-report-guide')}</p></div>\n\n        <label class=\"field\">\n          <span>${i18next.t('field.invention-title')}</span>\n          <input .value=${this.inventionTitle} @input=${(e: any) => (this.inventionTitle = e.target.value)} />\n        </label>\n\n        <label class=\"field\">\n          <span>${i18next.t('field.invention-content')}</span>\n          <textarea .value=${this.content} @input=${(e: any) => (this.content = e.target.value)}></textarea>\n        </label>\n\n        <label class=\"field\">\n          <span>${i18next.t('field.invention-reported-on')}</span>\n          <input type=\"date\" .value=${this.reportedOn} @input=${(e: any) => (this.reportedOn = e.target.value)} />\n        </label>\n\n        <label class=\"field\">\n          <span>${i18next.t('field.invention-co-inventors')}</span>\n          <ox-select multiple .value=${this.coInventorIds} @change=${(e: CustomEvent) => (this.coInventorIds = [].concat(e.detail ?? []).filter(Boolean))}>\n            <span slot=\"label\">${named.length ? named.join(', ') : '—'}</span>\n            <ox-popup-list align-left nowrap with-search multiple>${this.people.map(one => html`<div option value=${one.value}>${one.display}</div>`)}</ox-popup-list>\n          </ox-select>\n        </label>\n\n        <div class=\"field\">\n          <span>${i18next.t('field.invention-files')}</span>\n          <ox-input-file multiple .progress=${this.progress} @change=${(e: CustomEvent) => (this.files = [...(e.detail ?? [])])}></ox-input-file>\n          <span invalid>${this.message}</span>\n        </div>\n      </div>\n\n      <ox-popup-actions>\n        <md-text-button slot=\"cancel\" @click=${() => this.dispatchEvent(new CustomEvent('close'))}>${i18next.t('button.cancel')}</md-text-button>\n        <md-filled-button slot=\"confirm\" ?disabled=${this.working} @click=${() => this.report()}>${i18next.t('button.invention-report')}</md-filled-button>\n      </ox-popup-actions>\n    `\n  }\n\n  private async report() {\n    this.message = ''\n    this.working = true\n    try {\n      const response = await client.mutate({\n        mutation: gql`\n          mutation ($invention: NewInvention!, $files: [Upload!]) {\n            reportInvention(invention: $invention, files: $files) { id decisionDueOn }\n          }\n        `,\n        variables: { invention: { title: this.inventionTitle, content: this.content, reportedOn: this.reportedOn || null, coInventorIds: this.coInventorIds }, files: this.files },\n        ...(this.files.length ? { context: uploadContext((fraction: number) => (this.progress = fraction)) } : {})\n      })\n      if ((response as any).errors?.length) throw response\n      const reported = response.data.reportInvention\n      notify({ message: i18next.t('text.invention-reported', { day: reported.decisionDueOn }) })\n      this.dispatchEvent(new CustomEvent('reported', { detail: reported }))\n    } catch (error) {\n      this.message = failureOf(error)\n    } finally {\n      this.working = false\n      this.progress = undefined\n    }\n  }\n}\n"]}

package/dist-client/components/legal-todo.d.ts

@@ -0,0 +1,10 @@
+import '@material/web/button/filled-button.js';
+import { LitElement } from 'lit';
+export declare class ComplianceTodo extends LitElement {
+    static styles: import("lit").CSSResult;
+    input: {
+        headline?: string;
+        address?: string;
+    };
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist-client/components/legal-todo.js

@@ -0,0 +1,43 @@
+import { __decorate, __metadata } from "tslib";
+import '@material/web/button/filled-button.js';
+import { css, html, LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { i18next } from '@operato/i18n';
+import { navigate } from '@operato/shell';
+/*
+ * 법무 할 일 (ADR-0187 decisions 18, 23) - what the worklist to-do shows: what is asked, by when, and the way to the
+ * record. Recording it there closes the to-do; nothing is answered here.
+ */
+let ComplianceTodo = class ComplianceTodo extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.input = {};
+    }
+    static { this.styles = css `
+    :host {
+      display: block;
+      padding: var(--spacing-large, 12px);
+      font-size: var(--ui-t-body, 13px);
+      line-height: 1.6;
+      color: var(--ui-ink);
+    }
+
+    p {
+      margin: 0 0 var(--spacing-medium, 8px);
+    }
+  `; }
+    render() {
+        const { headline = '', address } = this.input ?? {};
+        return html `<p>${headline}</p>
+      ${address ? html `<md-filled-button @click=${() => navigate(address)}>${i18next.t('button.compliance-todo-open')}</md-filled-button>` : ''}`;
+    }
+};
+__decorate([
+    property({ attribute: false }),
+    __metadata("design:type", Object)
+], ComplianceTodo.prototype, "input", void 0);
+ComplianceTodo = __decorate([
+    customElement('compliance-todo')
+], ComplianceTodo);
+export { ComplianceTodo };
+//# sourceMappingURL=legal-todo.js.map

package/dist-client/components/legal-todo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"legal-todo.js","sourceRoot":"","sources":["../../client/components/legal-todo.ts"],"names":[],"mappings":";AAAA,OAAO,uCAAuC,CAAA;AAE9C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAEzC;;;GAGG;AAEI,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAe2B,UAAK,GAA4C,EAAE,CAAA;IAOrF,CAAC;aArBQ,WAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;GAYlB,AAZY,CAYZ;IAID,MAAM;QACJ,MAAM,EAAE,QAAQ,GAAG,EAAE,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;QACnD,OAAO,IAAI,CAAA,MAAM,QAAQ;QACrB,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA,4BAA4B,GAAG,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,6BAA6B,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,EAAE,CAAA;IAC/I,CAAC;;AAN+B;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;;6CAAoD;AAfxE,cAAc;IAD1B,aAAa,CAAC,iBAAiB,CAAC;GACpB,cAAc,CAsB1B","sourcesContent":["import '@material/web/button/filled-button.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { navigate } from '@operato/shell'\n\n/*\n * 법무 할 일 (ADR-0187 decisions 18, 23) - what the worklist to-do shows: what is asked, by when, and the way to the\n * record. Recording it there closes the to-do; nothing is answered here.\n */\n@customElement('compliance-todo')\nexport class ComplianceTodo extends LitElement {\n  static styles = css`\n    :host {\n      display: block;\n      padding: var(--spacing-large, 12px);\n      font-size: var(--ui-t-body, 13px);\n      line-height: 1.6;\n      color: var(--ui-ink);\n    }\n\n    p {\n      margin: 0 0 var(--spacing-medium, 8px);\n    }\n  `\n\n  @property({ attribute: false }) input: { headline?: string; address?: string } = {}\n\n  render() {\n    const { headline = '', address } = this.input ?? {}\n    return html`<p>${headline}</p>\n      ${address ? html`<md-filled-button @click=${() => navigate(address)}>${i18next.t('button.compliance-todo-open')}</md-filled-button>` : ''}`\n  }\n}\n"]}

package/dist-client/components/my-trainings.d.ts

@@ -0,0 +1,18 @@
+import '@material/web/button/text-button.js';
+import { LitElement, nothing } from 'lit';
+declare const ComplianceMyTrainings_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+/**
+ * 내 의무 교육 (ADR-0187 decisions 10, 17, 18) - this year's trainings the person must take: by when, whether done, the
+ * sessions of it, and the certificate of one taken elsewhere. Only a certificate the manager confirmed is done.
+ */
+export declare class ComplianceMyTrainings extends ComplianceMyTrainings_base {
+    static styles: import("lit").CSSResult;
+    private rows;
+    private loaded;
+    private message;
+    connectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
+    private fetch;
+    private upload;
+}
+export {};

package/dist-client/components/my-trainings.js

@@ -0,0 +1,149 @@
+import { __decorate, __metadata } from "tslib";
+import '@material/web/button/text-button.js';
+import gql from 'graphql-tag';
+import { css, html, LitElement, nothing } from 'lit';
+import { customElement, state } from 'lit/decorators.js';
+import { client } from '@operato/graphql';
+import { i18next, localize } from '@operato/i18n';
+import { trainingWord } from '../training-words.js';
+import { failureOf } from '../words.js';
+import { openTrainingCertificateForm } from './training-certificate-form.js';
+/**
+ * 내 의무 교육 (ADR-0187 decisions 10, 17, 18) - this year's trainings the person must take: by when, whether done, the
+ * sessions of it, and the certificate of one taken elsewhere. Only a certificate the manager confirmed is done.
+ */
+let ComplianceMyTrainings = class ComplianceMyTrainings extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.rows = [];
+        this.loaded = false;
+        this.message = '';
+    }
+    static { this.styles = css `
+    :host {
+      display: block;
+      color: var(--ui-ink);
+      font-size: var(--ui-t-body, 13px);
+    }
+    table {
+      width: 100%;
+      border-collapse: collapse;
+    }
+    th,
+    td {
+      text-align: left;
+      vertical-align: top;
+      padding: var(--spacing-small, 4px) var(--spacing-medium, 8px);
+      border-bottom: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));
+    }
+    th {
+      color: var(--ui-muted);
+      font-weight: normal;
+    }
+    [state='DONE'] {
+      color: var(--ui-ok, var(--md-sys-color-primary));
+    }
+    [state='NOT_DONE'] {
+      color: var(--ui-crit, var(--md-sys-color-error));
+    }
+    [muted] {
+      color: var(--ui-muted);
+    }
+    p {
+      margin: 0;
+    }
+  `; }
+    connectedCallback() {
+        super.connectedCallback();
+        this.fetch();
+    }
+    render() {
+        if (this.message)
+            return html `<p muted>${this.message}</p>`;
+        if (!this.loaded)
+            return nothing;
+        if (!this.rows.length)
+            return html `<p muted>${i18next.t('text.training-mine-empty')}</p>`;
+        return html `<table>
+      <thead>
+        <tr>
+          <th>${i18next.t('field.training-kind')}</th>
+          <th>${i18next.t('field.training-due-on')}</th>
+          <th>${i18next.t('field.training-state')}</th>
+          <th>${i18next.t('field.training-session')}</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        ${this.rows.map(row => html `<tr>
+            <td>${trainingWord('kind', row.kind)}</td>
+            <td>${row.dueOn}</td>
+            <td>
+              <p state=${row.state}>${trainingWord('state', row.state)}</p>
+              ${row.completion?.status === 'CONFIRMED' ? html `<p muted>${row.completion.completedOn}</p>` : nothing}
+              ${row.state === 'NOT_DONE' && row.completion?.status === 'RETURNED'
+            ? html `<p muted>${i18next.t('text.training-returned', { reason: row.completion.returnReason ?? '' })}</p>`
+            : nothing}
+            </td>
+            <td>
+              ${row.sessions.length
+            ? row.sessions.map((one) => html `<p>${one.name} · ${one.endsOn && one.endsOn !== one.startsOn ? `${one.startsOn} ~ ${one.endsOn}` : one.startsOn} · ${trainingWord('method', one.method)}</p>`)
+            : html `<p muted>${i18next.t('text.training-no-session-yet')}</p>`}
+            </td>
+            <td>
+              ${row.state === 'NOT_DONE'
+            ? html `<md-text-button @click=${() => this.upload(row)}>${i18next.t('button.training-certificate-upload')}</md-text-button>`
+            : nothing}
+            </td>
+          </tr>`)}
+      </tbody>
+    </table>`;
+    }
+    async fetch() {
+        try {
+            const response = await client.query({
+                query: gql `
+          query {
+            myTrainings {
+              kind year dueOn state
+              completion { id status completedOn returnReason }
+              sessions { id name method startsOn endsOn }
+            }
+          }
+        `,
+                fetchPolicy: 'network-only'
+            });
+            if (response.errors?.length)
+                throw response;
+            this.rows = response.data.myTrainings;
+            this.message = '';
+        }
+        catch (error) {
+            this.message = failureOf(error);
+        }
+        finally {
+            this.loaded = true;
+        }
+    }
+    async upload(row) {
+        if (await openTrainingCertificateForm({ kind: row.kind, year: row.year, sessions: row.sessions }))
+            this.fetch();
+    }
+};
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], ComplianceMyTrainings.prototype, "rows", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], ComplianceMyTrainings.prototype, "loaded", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], ComplianceMyTrainings.prototype, "message", void 0);
+ComplianceMyTrainings = __decorate([
+    customElement('compliance-my-trainings')
+], ComplianceMyTrainings);
+export { ComplianceMyTrainings };
+//# sourceMappingURL=my-trainings.js.map

package/dist-client/components/my-trainings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"my-trainings.js","sourceRoot":"","sources":["../../client/components/my-trainings.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/button/text-button.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\n\nimport { trainingWord } from '../training-words.js'\nimport { failureOf } from '../words.js'\nimport { openTrainingCertificateForm } from './training-certificate-form.js'\n\n/**\n * 내 의무 교육 (ADR-0187 decisions 10, 17, 18) - this year's trainings the person must take: by when, whether done, the\n * sessions of it, and the certificate of one taken elsewhere. Only a certificate the manager confirmed is done.\n */\n@customElement('compliance-my-trainings')\nexport class ComplianceMyTrainings extends localize(i18next)(LitElement) {\n  static styles = css`\n    :host {\n      display: block;\n      color: var(--ui-ink);\n      font-size: var(--ui-t-body, 13px);\n    }\n    table {\n      width: 100%;\n      border-collapse: collapse;\n    }\n    th,\n    td {\n      text-align: left;\n      vertical-align: top;\n      padding: var(--spacing-small, 4px) var(--spacing-medium, 8px);\n      border-bottom: 1px solid var(--ui-line-soft, var(--md-sys-color-outline-variant));\n    }\n    th {\n      color: var(--ui-muted);\n      font-weight: normal;\n    }\n    [state='DONE'] {\n      color: var(--ui-ok, var(--md-sys-color-primary));\n    }\n    [state='NOT_DONE'] {\n      color: var(--ui-crit, var(--md-sys-color-error));\n    }\n    [muted] {\n      color: var(--ui-muted);\n    }\n    p {\n      margin: 0;\n    }\n  `\n\n  @state() private rows: any[] = []\n  @state() private loaded = false\n  @state() private message = ''\n\n  connectedCallback() {\n    super.connectedCallback()\n    this.fetch()\n  }\n\n  render() {\n    if (this.message) return html`<p muted>${this.message}</p>`\n    if (!this.loaded) return nothing\n    if (!this.rows.length) return html`<p muted>${i18next.t('text.training-mine-empty')}</p>`\n    return html`<table>\n      <thead>\n        <tr>\n          <th>${i18next.t('field.training-kind')}</th>\n          <th>${i18next.t('field.training-due-on')}</th>\n          <th>${i18next.t('field.training-state')}</th>\n          <th>${i18next.t('field.training-session')}</th>\n          <th></th>\n        </tr>\n      </thead>\n      <tbody>\n        ${this.rows.map(\n          row => html`<tr>\n            <td>${trainingWord('kind', row.kind)}</td>\n            <td>${row.dueOn}</td>\n            <td>\n              <p state=${row.state}>${trainingWord('state', row.state)}</p>\n              ${row.completion?.status === 'CONFIRMED' ? html`<p muted>${row.completion.completedOn}</p>` : nothing}\n              ${row.state === 'NOT_DONE' && row.completion?.status === 'RETURNED'\n                ? html`<p muted>${i18next.t('text.training-returned', { reason: row.completion.returnReason ?? '' })}</p>`\n                : nothing}\n            </td>\n            <td>\n              ${row.sessions.length\n                ? row.sessions.map(\n                    (one: any) =>\n                      html`<p>${one.name} · ${one.endsOn && one.endsOn !== one.startsOn ? `${one.startsOn} ~ ${one.endsOn}` : one.startsOn} · ${trainingWord('method', one.method)}</p>`\n                  )\n                : html`<p muted>${i18next.t('text.training-no-session-yet')}</p>`}\n            </td>\n            <td>\n              ${row.state === 'NOT_DONE'\n                ? html`<md-text-button @click=${() => this.upload(row)}>${i18next.t('button.training-certificate-upload')}</md-text-button>`\n                : nothing}\n            </td>\n          </tr>`\n        )}\n      </tbody>\n    </table>`\n  }\n\n  private async fetch() {\n    try {\n      const response = await client.query({\n        query: gql`\n          query {\n            myTrainings {\n              kind year dueOn state\n              completion { id status completedOn returnReason }\n              sessions { id name method startsOn endsOn }\n            }\n          }\n        `,\n        fetchPolicy: 'network-only'\n      })\n      if ((response as any).errors?.length) throw response\n      this.rows = response.data.myTrainings\n      this.message = ''\n    } catch (error) {\n      this.message = failureOf(error)\n    } finally {\n      this.loaded = true\n    }\n  }\n\n  private async upload(row: any) {\n    if (await openTrainingCertificateForm({ kind: row.kind, year: row.year, sessions: row.sessions })) this.fetch()\n  }\n}\n"]}

package/dist-client/components/regulation-form.d.ts

@@ -0,0 +1,26 @@
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@operato/input/ox-input-select-buttons.js';
+import '@operato/popup/ox-popup-actions.js';
+import { LitElement } from 'lit';
+/** Opens the form; resolves with the new rule, or null when the person closed it. */
+export declare function openRegulationForm(): Promise<any | null>;
+declare const RegulationForm_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+/**
+ * 새 규정 (ADR-0187 decision 2) - the code, the name, what it is, and the guide's sections it answers. A rule of working
+ * conditions is an annex of the work rules, not 「그 밖」 - the form says so beside the kind.
+ */
+export declare class RegulationForm extends RegulationForm_base {
+    static styles: import("lit").CSSResult[];
+    private code;
+    private name;
+    private kind;
+    private topics;
+    private sections;
+    private working;
+    private message;
+    connectedCallback(): Promise<void>;
+    render(): import("lit-html").TemplateResult<1>;
+    private create;
+}
+export {};

package/dist-client/components/regulation-form.js

@@ -0,0 +1,161 @@
+import { __decorate, __metadata } from "tslib";
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@operato/input/ox-input-select-buttons.js';
+import '@operato/popup/ox-popup-actions.js';
+import gql from 'graphql-tag';
+import { css, html, LitElement, nothing } from 'lit';
+import { customElement, state } from 'lit/decorators.js';
+import { client } from '@operato/graphql';
+import { i18next, localize } from '@operato/i18n';
+import { openPopup } from '@operato/layout';
+import { CommonPopupStyles, FormFieldStyles, PopupBodyStyles, PopupFieldStyles } from '@operato/styles';
+import { guideSections } from '../regulation/regulation-guide.js';
+import { failureOf, REGULATION_KINDS, wordOf } from '../words.js';
+/** Opens the form; resolves with the new rule, or null when the person closed it. */
+export function openRegulationForm() {
+    return new Promise(resolve => {
+        let done = null;
+        const handle = openPopup(html `<regulation-form @close=${() => handle.close()} @created=${(e) => ((done = e.detail), handle.close())}></regulation-form>`, {
+            backdrop: true,
+            size: 'medium',
+            title: i18next.t('title.regulation-new')
+        });
+        handle.onclosed = () => resolve(done);
+    });
+}
+/**
+ * 새 규정 (ADR-0187 decision 2) - the code, the name, what it is, and the guide's sections it answers. A rule of working
+ * conditions is an annex of the work rules, not 「그 밖」 - the form says so beside the kind.
+ */
+let RegulationForm = class RegulationForm extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.code = '';
+        this.name = '';
+        this.kind = 'WORK_RULES_ANNEX';
+        this.topics = [];
+        this.sections = [];
+        this.working = false;
+        this.message = '';
+    }
+    static { this.styles = [
+        CommonPopupStyles,
+        PopupBodyStyles,
+        FormFieldStyles,
+        PopupFieldStyles,
+        css `
+      [invalid] {
+        color: var(--ui-crit, var(--md-sys-color-error));
+        font-size: var(--ui-t-small, 11.5px);
+      }
+      [invalid]:empty {
+        display: none;
+      }
+      [guide] p {
+        margin: 0;
+        color: var(--ui-muted);
+        line-height: var(--popup-line-height);
+      }
+      ox-input-select-buttons {
+        align-self: flex-start;
+      }
+    `
+    ]; }
+    async connectedCallback() {
+        super.connectedCallback();
+        this.sections = await guideSections();
+    }
+    render() {
+        return html `
+      <div class="body">
+        <label class="field">
+          <span>${i18next.t('field.regulation-code')}</span>
+          <input .value=${this.code} maxlength="40" @input=${(e) => (this.code = e.target.value)} />
+          <span>${i18next.t('text.regulation-code-hint')}</span>
+        </label>
+        <label class="field">
+          <span>${i18next.t('field.regulation-name')}</span>
+          <input .value=${this.name} @input=${(e) => (this.name = e.target.value)} />
+        </label>
+        <div class="field">
+          <span>${i18next.t('field.regulation-kind')}</span>
+          <ox-input-select-buttons
+            .value=${this.kind}
+            .options=${REGULATION_KINDS.map(code => ({ display: wordOf('regulation-kind', code), value: code }))}
+            @change=${(e) => e.detail && (this.kind = e.detail)}
+          ></ox-input-select-buttons>
+          <div guide><p>${i18next.t(`text.regulation-kind-guide-${this.kind.toLowerCase().replace(/_/g, '-')}`)}</p></div>
+        </div>
+        ${this.sections.length
+            ? html `<div class="field">
+              <span>${i18next.t('field.regulation-topics')}</span>
+              <ox-input-select-buttons multiple .value=${this.topics} .options=${this.sections.map(one => ({ display: one.title, value: one.id }))} @change=${(e) => (this.topics = e.detail ?? [])}></ox-input-select-buttons>
+            </div>`
+            : nothing}
+        <span invalid>${this.message}</span>
+      </div>
+
+      <ox-popup-actions>
+        <md-text-button slot="cancel" @click=${() => this.dispatchEvent(new CustomEvent('close'))}>${i18next.t('button.cancel')}</md-text-button>
+        <md-filled-button slot="confirm" ?disabled=${this.working} @click=${() => this.create()}>${i18next.t('button.regulation-new')}</md-filled-button>
+      </ox-popup-actions>
+    `;
+    }
+    async create() {
+        this.message = '';
+        this.working = true;
+        try {
+            const response = await client.mutate({
+                mutation: gql `
+          mutation ($regulation: NewRegulation!) {
+            createRegulation(regulation: $regulation) { id }
+          }
+        `,
+                variables: { regulation: { code: this.code.trim(), name: this.name.trim(), kind: this.kind, topics: this.topics } }
+            });
+            if (response.errors?.length)
+                throw response;
+            this.dispatchEvent(new CustomEvent('created', { detail: response.data.createRegulation }));
+        }
+        catch (error) {
+            this.message = failureOf(error);
+        }
+        finally {
+            this.working = false;
+        }
+    }
+};
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], RegulationForm.prototype, "code", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], RegulationForm.prototype, "name", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], RegulationForm.prototype, "kind", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], RegulationForm.prototype, "topics", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], RegulationForm.prototype, "sections", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], RegulationForm.prototype, "working", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], RegulationForm.prototype, "message", void 0);
+RegulationForm = __decorate([
+    customElement('regulation-form')
+], RegulationForm);
+export { RegulationForm };
+//# sourceMappingURL=regulation-form.js.map