@things-factory/compliance 0.0.0-stage → 10.1.254

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

@@ -0,0 +1 @@
+{"version":3,"file":"regulation-form.js","sourceRoot":"","sources":["../../client/components/regulation-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-select-buttons.js'\nimport '@operato/popup/ox-popup-actions.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'\nimport { openPopup } from '@operato/layout'\nimport { CommonPopupStyles, FormFieldStyles, PopupBodyStyles, PopupFieldStyles } from '@operato/styles'\n\nimport { guideSections, type GuideSection } from '../regulation/regulation-guide.js'\nimport { failureOf, REGULATION_KINDS, wordOf } from '../words.js'\n\n/** Opens the form; resolves with the new rule, or null when the person closed it. */\nexport function openRegulationForm(): Promise<any | null> {\n  return new Promise(resolve => {\n    let done: any = null\n    const handle: any = openPopup(html`<regulation-form @close=${() => handle.close()} @created=${(e: CustomEvent) => ((done = e.detail), handle.close())}></regulation-form>`, {\n      backdrop: true,\n      size: 'medium',\n      title: i18next.t('title.regulation-new')\n    })\n    handle.onclosed = () => resolve(done)\n  })\n}\n\n/**\n * 새 규정 (ADR-0187 decision 2) - the code, the name, what it is, and the guide's sections it answers. A rule of working\n * conditions is an annex of the work rules, not 「그 밖」 - the form says so beside the kind.\n */\n@customElement('regulation-form')\nexport class RegulationForm extends localize(i18next)(LitElement) {\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      ox-input-select-buttons {\n        align-self: flex-start;\n      }\n    `\n  ]\n\n  @state() private code = ''\n  @state() private name = ''\n  @state() private kind = 'WORK_RULES_ANNEX'\n  @state() private topics: string[] = []\n  @state() private sections: GuideSection[] = []\n  @state() private working = false\n  @state() private message = ''\n\n  async connectedCallback() {\n    super.connectedCallback()\n    this.sections = await guideSections()\n  }\n\n  render() {\n    return html`\n      <div class=\"body\">\n        <label class=\"field\">\n          <span>${i18next.t('field.regulation-code')}</span>\n          <input .value=${this.code} maxlength=\"40\" @input=${(e: any) => (this.code = e.target.value)} />\n          <span>${i18next.t('text.regulation-code-hint')}</span>\n        </label>\n        <label class=\"field\">\n          <span>${i18next.t('field.regulation-name')}</span>\n          <input .value=${this.name} @input=${(e: any) => (this.name = e.target.value)} />\n        </label>\n        <div class=\"field\">\n          <span>${i18next.t('field.regulation-kind')}</span>\n          <ox-input-select-buttons\n            .value=${this.kind}\n            .options=${REGULATION_KINDS.map(code => ({ display: wordOf('regulation-kind', code), value: code }))}\n            @change=${(e: CustomEvent) => e.detail && (this.kind = e.detail)}\n          ></ox-input-select-buttons>\n          <div guide><p>${i18next.t(`text.regulation-kind-guide-${this.kind.toLowerCase().replace(/_/g, '-')}`)}</p></div>\n        </div>\n        ${this.sections.length\n          ? html`<div class=\"field\">\n              <span>${i18next.t('field.regulation-topics')}</span>\n              <ox-input-select-buttons multiple .value=${this.topics} .options=${this.sections.map(one => ({ display: one.title, value: one.id }))} @change=${(e: CustomEvent) => (this.topics = e.detail ?? [])}></ox-input-select-buttons>\n            </div>`\n          : nothing}\n        <span invalid>${this.message}</span>\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.create()}>${i18next.t('button.regulation-new')}</md-filled-button>\n      </ox-popup-actions>\n    `\n  }\n\n  private async create() {\n    this.message = ''\n    this.working = true\n    try {\n      const response = await client.mutate({\n        mutation: gql`\n          mutation ($regulation: NewRegulation!) {\n            createRegulation(regulation: $regulation) { id }\n          }\n        `,\n        variables: { regulation: { code: this.code.trim(), name: this.name.trim(), kind: this.kind, topics: this.topics } }\n      })\n      if ((response as any).errors?.length) throw response\n      this.dispatchEvent(new CustomEvent('created', { detail: response.data.createRegulation }))\n    } catch (error) {\n      this.message = failureOf(error)\n    } finally {\n      this.working = false\n    }\n  }\n}\n"]}

package/dist-client/components/seal-use-form.d.ts

@@ -0,0 +1,47 @@
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@operato/input/ox-input-select-buttons.js';
+import '@operato/input/ox-select.js';
+import '@operato/popup/ox-popup-actions.js';
+import '@operato/popup/ox-popup-list.js';
+import { LitElement } from 'lit';
+/** What the form is opened with - a 사용인감계 just issued asks for the corporate seal's stamp on it. */
+export interface SealUsePrefill {
+    kind?: string;
+    sealKind?: string;
+    document?: string;
+    purpose?: string;
+    submittedTo?: string;
+}
+/** Opens the form; resolves with the written use, or null when the person closed it. */
+export declare function openSealUseForm(prefill?: SealUsePrefill): Promise<any | null>;
+declare const SealUseForm_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+/**
+ * 날인 기록 쓰기 (ADR-0188 decision 2) - which seal, what was done with it, who asked, for which paper and where it goes.
+ * The server decides whether it goes up for approval; the guide says when.
+ */
+export declare class SealUseForm extends SealUseForm_base {
+    static styles: import("lit").CSSResult[];
+    prefill: SealUsePrefill;
+    private kind;
+    private sealId;
+    private requesterId;
+    private usedOn;
+    private document;
+    private purpose;
+    private submittedTo;
+    private returnDueOn;
+    private copies;
+    private usableUntil;
+    private notes;
+    private seals;
+    private people;
+    private working;
+    private message;
+    connectedCallback(): Promise<void>;
+    render(): import("lit-html").TemplateResult<1>;
+    /** One value among many - the framework popup list with its search box on top. */
+    private chooser;
+    private record;
+}
+export {};

package/dist-client/components/seal-use-form.js

@@ -0,0 +1,300 @@
+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/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, nothing } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { client } 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, USE_KINDS, wordOf } from '../words.js';
+/** Opens the form; resolves with the written use, or null when the person closed it. */
+export function openSealUseForm(prefill = {}) {
+    return new Promise(resolve => {
+        let done = null;
+        const handle = openPopup(html `<seal-use-form .prefill=${prefill} @close=${() => handle.close()} @recorded=${(e) => ((done = e.detail), handle.close())}></seal-use-form>`, { backdrop: true, size: 'medium', title: i18next.t('title.seal-use-record') });
+        handle.onclosed = () => resolve(done);
+    });
+}
+const today = () => {
+    const now = new Date();
+    return new Date(now.getTime() - now.getTimezoneOffset() * 60000).toISOString().slice(0, 10);
+};
+/**
+ * 날인 기록 쓰기 (ADR-0188 decision 2) - which seal, what was done with it, who asked, for which paper and where it goes.
+ * The server decides whether it goes up for approval; the guide says when.
+ */
+let SealUseForm = class SealUseForm extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.prefill = {};
+        this.kind = 'STAMP';
+        this.sealId = '';
+        this.requesterId = '';
+        this.usedOn = today();
+        this.document = '';
+        this.purpose = '';
+        this.submittedTo = '';
+        this.returnDueOn = '';
+        this.copies = '1';
+        this.usableUntil = '';
+        this.notes = '';
+        this.seals = [];
+        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);
+      }
+      ox-input-select-buttons {
+        align-self: flex-start;
+      }
+      ox-select {
+        width: 100%;
+      }
+    `
+    ]; }
+    async connectedCallback() {
+        super.connectedCallback();
+        const { kind, document, purpose, submittedTo } = this.prefill ?? {};
+        Object.assign(this, { kind: kind ?? this.kind, document: document ?? '', purpose: purpose ?? '', submittedTo: submittedTo ?? '' });
+        const response = await client.query({
+            query: gql `
+        query {
+          companySeals(filters: [{ name: "disposedOn", operator: "is_null" }], pagination: { page: 1, limit: 100 }) {
+            items { id kind name }
+          }
+          employees(filters: [{ name: "retiredOn", operator: "is_null" }], pagination: { page: 1, limit: 500 }, sortings: [{ name: "name" }]) {
+            items { id name controlNo }
+          }
+        }
+      `,
+            fetchPolicy: 'no-cache'
+        });
+        /* The kind is said beside a name that does not say it already - 「사용인감 1호」, not 「법인인감 (법인인감)」. */
+        const named = (one) => (one.name.includes(wordOf('company-seal-kind', one.kind)) ? one.name : `${one.name} (${wordOf('company-seal-kind', one.kind)})`);
+        this.seals = (response.data?.companySeals?.items ?? []).map((one) => ({ value: one.id, display: named(one), kind: one.kind }));
+        this.people = (response.data?.employees?.items ?? []).map((one) => ({ value: one.id, display: one.controlNo ? `${one.name} · ${one.controlNo}` : one.name }));
+        const wanted = this.prefill?.sealKind;
+        if (wanted)
+            this.sealId = this.seals.find(one => one.kind === wanted)?.value ?? '';
+    }
+    render() {
+        const certificate = this.kind === 'CERTIFICATE';
+        const seals = certificate ? this.seals.filter(one => one.kind === 'CORPORATE') : this.seals;
+        return html `
+      <div class="body">
+        <div guide><p>${i18next.t('text.seal-use-approval-guide')}</p></div>
+
+        <div class="field">
+          <ox-input-select-buttons
+            .value=${this.kind}
+            .options=${USE_KINDS.map(code => ({ display: wordOf('seal-use-kind', code), value: code }))}
+            @change=${(e) => e.detail && (this.kind = e.detail)}
+          ></ox-input-select-buttons>
+        </div>
+
+        <label class="field">
+          <span>${i18next.t('field.seal-use-seal')}</span>
+          ${this.chooser(seals, this.sealId, value => (this.sealId = value))}
+        </label>
+
+        <label class="field">
+          <span>${i18next.t('field.seal-use-requester')}</span>
+          ${this.chooser(this.people, this.requesterId, value => (this.requesterId = value))}
+        </label>
+
+        <label class="field">
+          <span>${i18next.t(`field.seal-use-used-on-${this.kind.toLowerCase().replace('_', '-')}`)}</span>
+          <input type="date" .value=${this.usedOn} @input=${(e) => (this.usedOn = e.target.value)} />
+        </label>
+
+        ${certificate
+            ? nothing
+            : html `<label class="field">
+              <span>${i18next.t('field.seal-use-document')}</span>
+              <input .value=${this.document} @input=${(e) => (this.document = e.target.value)} />
+            </label>`}
+
+        <label class="field">
+          <span>${i18next.t('field.seal-use-purpose')}</span>
+          <input .value=${this.purpose} @input=${(e) => (this.purpose = e.target.value)} />
+        </label>
+
+        <label class="field">
+          <span>${i18next.t('field.seal-use-submitted-to')}</span>
+          <input .value=${this.submittedTo} @input=${(e) => (this.submittedTo = e.target.value)} />
+        </label>
+
+        ${this.kind === 'TAKE_OUT'
+            ? html `<label class="field">
+              <span>${i18next.t('field.seal-use-return-due-on')}</span>
+              <input type="date" .value=${this.returnDueOn} @input=${(e) => (this.returnDueOn = e.target.value)} />
+            </label>`
+            : nothing}
+        ${certificate
+            ? html `<label class="field">
+                <span>${i18next.t('field.seal-use-copies')}</span>
+                <input type="number" min="1" .value=${this.copies} @input=${(e) => (this.copies = e.target.value)} />
+              </label>
+              <label class="field">
+                <span>${i18next.t('field.seal-use-usable-until')}</span>
+                <input type="date" .value=${this.usableUntil} @input=${(e) => (this.usableUntil = e.target.value)} />
+                <span>${i18next.t('text.seal-use-usable-until-hint')}</span>
+              </label>`
+            : nothing}
+
+        <label class="field">
+          <span>${i18next.t('field.seal-use-notes')}</span>
+          <input .value=${this.notes} @input=${(e) => (this.notes = e.target.value)} />
+          <span invalid>${this.message}</span>
+        </label>
+      </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.record()}>${i18next.t('button.seal-use-record')}</md-filled-button>
+      </ox-popup-actions>
+    `;
+    }
+    /** One value among many - the framework popup list with its search box on top. */
+    chooser(options, value, change) {
+        const shown = options.find(one => one.value === value)?.display ?? '—';
+        return html `<ox-select .value=${value} @change=${(e) => String(e.detail ?? '') !== value && change(String(e.detail ?? ''))}>
+      <span slot="label">${shown}</span>
+      <ox-popup-list align-left nowrap with-search>${options.map(one => html `<div option value=${one.value}>${one.display}</div>`)}</ox-popup-list>
+    </ox-select>`;
+    }
+    async record() {
+        this.message = '';
+        this.working = true;
+        try {
+            const certificate = this.kind === 'CERTIFICATE';
+            const response = await client.mutate({
+                mutation: gql `
+          mutation ($use: NewSealUse!) {
+            recordSealUse(use: $use) { id status }
+          }
+        `,
+                variables: {
+                    use: {
+                        kind: this.kind,
+                        sealId: this.sealId,
+                        requesterId: this.requesterId || null,
+                        usedOn: this.usedOn,
+                        document: certificate ? null : this.document,
+                        purpose: this.purpose,
+                        submittedTo: this.submittedTo,
+                        returnDueOn: this.kind === 'TAKE_OUT' ? this.returnDueOn || null : null,
+                        copies: certificate ? Number(this.copies) || null : null,
+                        usableUntil: certificate ? this.usableUntil || null : null,
+                        notes: this.notes
+                    }
+                }
+            });
+            if (response.errors?.length)
+                throw response;
+            const written = response.data.recordSealUse;
+            notify({ message: i18next.t(written.status === 'SUBMITTED' ? 'text.seal-use-submitted' : 'text.seal-use-recorded') });
+            this.dispatchEvent(new CustomEvent('recorded', { detail: written }));
+        }
+        catch (error) {
+            this.message = failureOf(error);
+        }
+        finally {
+            this.working = false;
+        }
+    }
+};
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "prefill", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "kind", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "sealId", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "requesterId", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "usedOn", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "document", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "purpose", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "submittedTo", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "returnDueOn", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "copies", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "usableUntil", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "notes", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], SealUseForm.prototype, "seals", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], SealUseForm.prototype, "people", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "working", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], SealUseForm.prototype, "message", void 0);
+SealUseForm = __decorate([
+    customElement('seal-use-form')
+], SealUseForm);
+export { SealUseForm };
+//# sourceMappingURL=seal-use-form.js.map

package/dist-client/components/seal-use-form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"seal-use-form.js","sourceRoot":"","sources":["../../client/components/seal-use-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-select-buttons.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, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { client } 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, USE_KINDS, wordOf } from '../words.js'\n\n/** What the form is opened with - a 사용인감계 just issued asks for the corporate seal's stamp on it. */\nexport interface SealUsePrefill {\n  kind?: string\n  sealKind?: string\n  document?: string\n  purpose?: string\n  submittedTo?: string\n}\n\ntype Choice = { value: string; display: string; kind?: string }\n\n/** Opens the form; resolves with the written use, or null when the person closed it. */\nexport function openSealUseForm(prefill: SealUsePrefill = {}): Promise<any | null> {\n  return new Promise(resolve => {\n    let done: any = null\n    const handle: any = openPopup(\n      html`<seal-use-form .prefill=${prefill} @close=${() => handle.close()} @recorded=${(e: CustomEvent) => ((done = e.detail), handle.close())}></seal-use-form>`,\n      { backdrop: true, size: 'medium', title: i18next.t('title.seal-use-record') }\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-0188 decision 2) - which seal, what was done with it, who asked, for which paper and where it goes.\n * The server decides whether it goes up for approval; the guide says when.\n */\n@customElement('seal-use-form')\nexport class SealUseForm 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      ox-input-select-buttons {\n        align-self: flex-start;\n      }\n      ox-select {\n        width: 100%;\n      }\n    `\n  ]\n\n  @property({ type: Object }) prefill: SealUsePrefill = {}\n\n  @state() private kind = 'STAMP'\n  @state() private sealId = ''\n  @state() private requesterId = ''\n  @state() private usedOn = today()\n  @state() private document = ''\n  @state() private purpose = ''\n  @state() private submittedTo = ''\n  @state() private returnDueOn = ''\n  @state() private copies = '1'\n  @state() private usableUntil = ''\n  @state() private notes = ''\n  @state() private seals: Choice[] = []\n  @state() private people: Choice[] = []\n  @state() private working = false\n  @state() private message = ''\n\n  async connectedCallback() {\n    super.connectedCallback()\n    const { kind, document, purpose, submittedTo } = this.prefill ?? {}\n    Object.assign(this, { kind: kind ?? this.kind, document: document ?? '', purpose: purpose ?? '', submittedTo: submittedTo ?? '' })\n    const response = await client.query({\n      query: gql`\n        query {\n          companySeals(filters: [{ name: \"disposedOn\", operator: \"is_null\" }], pagination: { page: 1, limit: 100 }) {\n            items { id kind name }\n          }\n          employees(filters: [{ name: \"retiredOn\", operator: \"is_null\" }], pagination: { page: 1, limit: 500 }, sortings: [{ name: \"name\" }]) {\n            items { id name controlNo }\n          }\n        }\n      `,\n      fetchPolicy: 'no-cache'\n    })\n    /* The kind is said beside a name that does not say it already - 「사용인감 1호」, not 「법인인감 (법인인감)」. */\n    const named = (one: any) => (one.name.includes(wordOf('company-seal-kind', one.kind)) ? one.name : `${one.name} (${wordOf('company-seal-kind', one.kind)})`)\n    this.seals = (response.data?.companySeals?.items ?? []).map((one: any) => ({ value: one.id, display: named(one), kind: one.kind }))\n    this.people = (response.data?.employees?.items ?? []).map((one: any) => ({ value: one.id, display: one.controlNo ? `${one.name} · ${one.controlNo}` : one.name }))\n    const wanted = this.prefill?.sealKind\n    if (wanted) this.sealId = this.seals.find(one => one.kind === wanted)?.value ?? ''\n  }\n\n  render() {\n    const certificate = this.kind === 'CERTIFICATE'\n    const seals = certificate ? this.seals.filter(one => one.kind === 'CORPORATE') : this.seals\n    return html`\n      <div class=\"body\">\n        <div guide><p>${i18next.t('text.seal-use-approval-guide')}</p></div>\n\n        <div class=\"field\">\n          <ox-input-select-buttons\n            .value=${this.kind}\n            .options=${USE_KINDS.map(code => ({ display: wordOf('seal-use-kind', code), value: code }))}\n            @change=${(e: CustomEvent) => e.detail && (this.kind = e.detail)}\n          ></ox-input-select-buttons>\n        </div>\n\n        <label class=\"field\">\n          <span>${i18next.t('field.seal-use-seal')}</span>\n          ${this.chooser(seals, this.sealId, value => (this.sealId = value))}\n        </label>\n\n        <label class=\"field\">\n          <span>${i18next.t('field.seal-use-requester')}</span>\n          ${this.chooser(this.people, this.requesterId, value => (this.requesterId = value))}\n        </label>\n\n        <label class=\"field\">\n          <span>${i18next.t(`field.seal-use-used-on-${this.kind.toLowerCase().replace('_', '-')}`)}</span>\n          <input type=\"date\" .value=${this.usedOn} @input=${(e: any) => (this.usedOn = e.target.value)} />\n        </label>\n\n        ${certificate\n          ? nothing\n          : html`<label class=\"field\">\n              <span>${i18next.t('field.seal-use-document')}</span>\n              <input .value=${this.document} @input=${(e: any) => (this.document = e.target.value)} />\n            </label>`}\n\n        <label class=\"field\">\n          <span>${i18next.t('field.seal-use-purpose')}</span>\n          <input .value=${this.purpose} @input=${(e: any) => (this.purpose = e.target.value)} />\n        </label>\n\n        <label class=\"field\">\n          <span>${i18next.t('field.seal-use-submitted-to')}</span>\n          <input .value=${this.submittedTo} @input=${(e: any) => (this.submittedTo = e.target.value)} />\n        </label>\n\n        ${this.kind === 'TAKE_OUT'\n          ? html`<label class=\"field\">\n              <span>${i18next.t('field.seal-use-return-due-on')}</span>\n              <input type=\"date\" .value=${this.returnDueOn} @input=${(e: any) => (this.returnDueOn = e.target.value)} />\n            </label>`\n          : nothing}\n        ${certificate\n          ? html`<label class=\"field\">\n                <span>${i18next.t('field.seal-use-copies')}</span>\n                <input type=\"number\" min=\"1\" .value=${this.copies} @input=${(e: any) => (this.copies = e.target.value)} />\n              </label>\n              <label class=\"field\">\n                <span>${i18next.t('field.seal-use-usable-until')}</span>\n                <input type=\"date\" .value=${this.usableUntil} @input=${(e: any) => (this.usableUntil = e.target.value)} />\n                <span>${i18next.t('text.seal-use-usable-until-hint')}</span>\n              </label>`\n          : nothing}\n\n        <label class=\"field\">\n          <span>${i18next.t('field.seal-use-notes')}</span>\n          <input .value=${this.notes} @input=${(e: any) => (this.notes = e.target.value)} />\n          <span invalid>${this.message}</span>\n        </label>\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.record()}>${i18next.t('button.seal-use-record')}</md-filled-button>\n      </ox-popup-actions>\n    `\n  }\n\n  /** One value among many - the framework popup list with its search box on top. */\n  private chooser(options: Choice[], value: string, change: (value: string) => void) {\n    const shown = options.find(one => one.value === value)?.display ?? '—'\n    return html`<ox-select .value=${value} @change=${(e: CustomEvent) => String(e.detail ?? '') !== value && change(String(e.detail ?? ''))}>\n      <span slot=\"label\">${shown}</span>\n      <ox-popup-list align-left nowrap with-search>${options.map(one => html`<div option value=${one.value}>${one.display}</div>`)}</ox-popup-list>\n    </ox-select>`\n  }\n\n  private async record() {\n    this.message = ''\n    this.working = true\n    try {\n      const certificate = this.kind === 'CERTIFICATE'\n      const response = await client.mutate({\n        mutation: gql`\n          mutation ($use: NewSealUse!) {\n            recordSealUse(use: $use) { id status }\n          }\n        `,\n        variables: {\n          use: {\n            kind: this.kind,\n            sealId: this.sealId,\n            requesterId: this.requesterId || null,\n            usedOn: this.usedOn,\n            document: certificate ? null : this.document,\n            purpose: this.purpose,\n            submittedTo: this.submittedTo,\n            returnDueOn: this.kind === 'TAKE_OUT' ? this.returnDueOn || null : null,\n            copies: certificate ? Number(this.copies) || null : null,\n            usableUntil: certificate ? this.usableUntil || null : null,\n            notes: this.notes\n          }\n        }\n      })\n      if ((response as any).errors?.length) throw response\n      const written = response.data.recordSealUse\n      notify({ message: i18next.t(written.status === 'SUBMITTED' ? 'text.seal-use-submitted' : 'text.seal-use-recorded') })\n      this.dispatchEvent(new CustomEvent('recorded', { detail: written }))\n    } catch (error) {\n      this.message = failureOf(error)\n    } finally {\n      this.working = false\n    }\n  }\n}\n"]}

package/dist-client/components/training-attendance-form.d.ts

@@ -0,0 +1,37 @@
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@material/web/icon/icon.js';
+import '@operato/input/ox-select.js';
+import '@operato/popup/ox-popup-actions.js';
+import '@operato/popup/ox-popup-list.js';
+import { LitElement } from 'lit';
+/** Opens the form for a session; resolves true when the attendance was recorded. */
+export declare function openTrainingAttendanceForm(session: {
+    id: string;
+    name: string;
+    startsOn: string;
+    endsOn?: string | null;
+}): Promise<boolean>;
+declare const TrainingAttendanceForm_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+/**
+ * 출석 기록 (ADR-0187 decision 17) - the people who attended a session, recorded at once as completed. Someone done
+ * already for the kind and year is left as they are.
+ */
+export declare class TrainingAttendanceForm extends TrainingAttendanceForm_base {
+    static styles: import("lit").CSSResult[];
+    session: {
+        id: string;
+        name: string;
+        startsOn: string;
+        endsOn?: string | null;
+    };
+    private people;
+    private chosen;
+    private completedOn;
+    private working;
+    private message;
+    connectedCallback(): Promise<void>;
+    render(): import("lit-html").TemplateResult<1>;
+    private record;
+}
+export {};

package/dist-client/components/training-attendance-form.js

@@ -0,0 +1,186 @@
+import { __decorate, __metadata } from "tslib";
+import '@material/web/button/filled-button.js';
+import '@material/web/button/text-button.js';
+import '@material/web/icon/icon.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, property, state } from 'lit/decorators.js';
+import { client } 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 for a session; resolves true when the attendance was recorded. */
+export function openTrainingAttendanceForm(session) {
+    return new Promise(resolve => {
+        let done = false;
+        const handle = openPopup(html `<training-attendance-form .session=${session} @close=${() => handle.close()} @recorded=${() => ((done = true), handle.close())}></training-attendance-form>`, { backdrop: true, size: 'medium', title: i18next.t('title.training-attendance', { name: session.name }) });
+        handle.onclosed = () => resolve(done);
+    });
+}
+/**
+ * 출석 기록 (ADR-0187 decision 17) - the people who attended a session, recorded at once as completed. Someone done
+ * already for the kind and year is left as they are.
+ */
+let TrainingAttendanceForm = class TrainingAttendanceForm extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.people = [];
+        this.chosen = [];
+        this.completedOn = '';
+        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-select {
+        width: 100%;
+      }
+      .chosen {
+        display: flex;
+        flex-wrap: wrap;
+        gap: var(--spacing-small, 4px);
+      }
+      .chip {
+        display: inline-flex;
+        align-items: center;
+        gap: 4px;
+        padding: 2px 4px 2px 8px;
+        border-radius: 999px;
+        background: var(--md-sys-color-secondary-container);
+        color: var(--md-sys-color-on-secondary-container);
+      }
+      .chip button {
+        border: 0;
+        background: none;
+        cursor: pointer;
+        color: inherit;
+        display: inline-flex;
+        padding: 0;
+      }
+      .chip md-icon {
+        --md-icon-size: 16px;
+      }
+    `
+    ]; }
+    async connectedCallback() {
+        super.connectedCallback();
+        this.completedOn = this.session.endsOn || this.session.startsOn;
+        const response = await client.query({
+            query: gql `
+        query {
+          employees(filters: [{ name: "retiredOn", operator: "is_null" }], pagination: { page: 1, limit: 500 }, sortings: [{ name: "name" }]) {
+            items { id name controlNo }
+          }
+        }
+      `,
+            fetchPolicy: 'no-cache'
+        });
+        this.people = (response.data?.employees?.items ?? []).map((one) => ({ value: one.id, display: one.controlNo ? `${one.name} · ${one.controlNo}` : one.name }));
+    }
+    render() {
+        const left = this.people.filter(one => !this.chosen.includes(one.value));
+        return html `
+      <div class="body">
+        <div guide><p>${i18next.t('text.training-attendance-guide')}</p></div>
+
+        <label class="field">
+          <span>${i18next.t('field.training-completed-on')}</span>
+          <input type="date" .value=${this.completedOn} min=${this.session.startsOn} @input=${(e) => (this.completedOn = e.target.value)} />
+        </label>
+
+        <div class="field">
+          <span>${i18next.t('field.training-attendees')} (${this.chosen.length})</span>
+          <div class="chosen">
+            ${this.chosen.map(id => html `<span class="chip"
+                >${this.people.find(one => one.value === id)?.display ?? id}
+                <button aria-label=${i18next.t('button.delete')} @click=${() => (this.chosen = this.chosen.filter(one => one !== id))}><md-icon>close</md-icon></button></span
+              >`)}
+          </div>
+          <ox-select value="" @change=${(e) => e.detail && (this.chosen = [...this.chosen, String(e.detail)])}>
+            <span slot="label">${i18next.t('text.training-attendee-add')}</span>
+            <ox-popup-list align-left nowrap with-search>${left.map(one => html `<div option value=${one.value}>${one.display}</div>`)}</ox-popup-list>
+          </ox-select>
+          <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.record()}>${i18next.t('button.training-attendance-record')}</md-filled-button>
+      </ox-popup-actions>
+    `;
+    }
+    async record() {
+        this.message = '';
+        this.working = true;
+        try {
+            const response = await client.mutate({
+                mutation: gql `
+          mutation ($sessionId: String!, $employeeIds: [String!]!, $completedOn: String) {
+            recordTrainingAttendance(sessionId: $sessionId, employeeIds: $employeeIds, completedOn: $completedOn) { id }
+          }
+        `,
+                variables: { sessionId: this.session.id, employeeIds: this.chosen, completedOn: this.completedOn || null }
+            });
+            if (response.errors?.length)
+                throw response;
+            notify({ message: i18next.t('text.training-attendance-recorded', { count: response.data.recordTrainingAttendance.length }) });
+            this.dispatchEvent(new CustomEvent('recorded'));
+        }
+        catch (error) {
+            this.message = failureOf(error);
+        }
+        finally {
+            this.working = false;
+        }
+    }
+};
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], TrainingAttendanceForm.prototype, "session", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], TrainingAttendanceForm.prototype, "people", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Array)
+], TrainingAttendanceForm.prototype, "chosen", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], TrainingAttendanceForm.prototype, "completedOn", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], TrainingAttendanceForm.prototype, "working", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], TrainingAttendanceForm.prototype, "message", void 0);
+TrainingAttendanceForm = __decorate([
+    customElement('training-attendance-form')
+], TrainingAttendanceForm);
+export { TrainingAttendanceForm };
+//# sourceMappingURL=training-attendance-form.js.map