@things-factory/sales 10.1.255 → 10.1.257

package/dist-client/pages/quotation-editor.js

@@ -7,14 +7,13 @@ import gql from 'graphql-tag';
 import { css, html, nothing } from 'lit';
 import { customElement, query, state } from 'lit/decorators.js';
 import { DataGrist } from '@operato/data-grist';
-import { client } from '@operato/graphql';
+import { client, MutationController, QueryController } from '@operato/graphql';
 import { i18next, localize } from '@operato/i18n';
-import { notify } from '@operato/layout';
 import { OxPrompt } from '@operato/popup/ox-prompt.js';
-import { navigate, PageView } from '@operato/shell';
+import { navigate, PageView, DraftController } from '@operato/shell';
 import { ButtonStyles, CommonGristStyles, DocumentPageStyles, FormFieldStyles, ScrollbarStyles } from '@operato/styles';
 import { hasPrivilege } from '@things-factory/auth-base/dist-client';
-import { daysAfter, documentAmount, DocumentFormStyles, documentLinesConfig, linesOf, onLineChange, openDocumentPreview, reckonLines, renderDocumentHead, renderDocumentTotals, documentDefaults, headFromDefaults, nextInvoiceNumber, OUR_SIDE_FIELDS, oursFromLast, partyOfName } from '@things-factory/invoice/dist-client';
+import { daysAfter, documentAmount, DocumentFormStyles, documentLinesConfig, linesOf, onLineChange, openDocumentPreview, reckonLines, renderDocumentHead, renderDocumentTotals, DOCUMENT_DEFAULTS, DOCUMENT_DEFAULTS_READER, headFromDefaults, nextInvoiceNumber, OUR_SIDE_FIELDS, oursFromLast, partyOfName } from '@things-factory/invoice/dist-client';
 import '@things-factory/invoice/dist-client/document/document-party.js';
 import { quotationSection } from '../quotation-attach';
 import '../sales-product-pick';
@@ -64,6 +63,10 @@ const INVOICE_HEAD = [
     'bankDetails',
     'notes'
 ];
+/** A step of a quotation's life - each answers with the quotation it leaves (a revision is a new one). */
+const step = (name, reason = false) => gql(reason
+    ? `mutation ($id: String!, $reason: String!) { quotation: ${name}(id: $id, reason: $reason) { id } }`
+    : `mutation ($id: String!) { quotation: ${name}(id: $id) { id } }`);
 /** How long an offer holds unless the person writes another last day. */
 const VALID_DAYS = 30;
 /** Days an invoice made from a quotation is due unless the company says otherwise - the invoice editor's. */
@@ -83,24 +86,62 @@ export function nextQuotationNumber(numbers, year) {
 let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView) {
     constructor() {
         super(...arguments);
-        this.quotation = null;
-        this.form = blank();
-        this.loading = false;
-        this.error = null;
-        this.busy = false;
-        this.reason = '';
-        /** The open opportunities a draft may answer, and the one it answers when that one is closed. */
-        this.opportunities = [];
-        /** The company's words a new quotation starts with, the terms it offers and how long an offer holds (ADR-0170). */
-        this.defaults = null;
-        /** The counterparty the buyer was taken from on this screen - shown in the picker. */
-        this.party = null;
+        /** Whether this person may read the company's words - unknown, and nothing read, until asked. */
+        this.defaultsReadable = false;
         /** The totals of the lines as typed - reckoned as the quotation will keep them, shown before it is saved. */
-        this.amounts = {};
+        this.typedAmounts = null;
         /** Whether this person may write invoices - an accepted quotation then makes one. */
         this.invoiceWriter = false;
         /** Whether the application's section is this person's to read - asked once, before it is shown. */
         this.sectionReadable = false;
+        /** An invoice being made of this quotation - its look-ups and its save. */
+        this.making = false;
+        /* The company's words, the open opportunities a draft may answer, the quotation the address names, and what a new one starts from (ADR-0190). */
+        this.companyDefaults = new QueryController(this, DOCUMENT_DEFAULTS, { variables: () => (this.defaultsReadable ? {} : undefined) });
+        this.openOpportunities = new QueryController(this, gql `
+      query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {
+        opportunities(filters: $filters, pagination: $pagination, sortings: $sortings) {
+          items { id name counterparty { id name businessNumber } }
+        }
+      }
+    `, {
+            variables: () => ({
+                filters: [{ name: 'stage', operator: 'in', value: ['LEAD', 'PROPOSAL', 'QUOTED', 'NEGOTIATION'] }],
+                pagination: { page: 1, limit: 500 },
+                sortings: [{ name: 'name' }]
+            })
+        });
+        this.record = new QueryController(this, gql(`query ($id: String!) { quotation(id: $id) { ${FIELDS} } }`), {
+            variables: () => (this.quotationId ? { id: this.quotationId } : undefined)
+        });
+        this.starts = new QueryController(this, gql `
+      query ($filters: [Filter!], $sortings: [Sorting!]) {
+        numbered: quotations(filters: $filters, pagination: { page: 1, limit: 1000 }) { items { number } }
+        last: quotations(pagination: { page: 1, limit: 1 }, sortings: $sortings) { items { direction ${OUR_SIDE_FIELDS.join(' ')} } }
+      }
+    `, {
+            variables: () => this.address && !this.address.id ? { filters: [{ name: 'number', operator: 'like', value: `Q${today().slice(0, 4)}-%` }], sortings: [{ name: 'createdAt', desc: true }] } : undefined
+        });
+        /* What is typed over the quotation read, or over what a new one starts with; the lines are the grid's. */
+        this.draft = new DraftController(this, { read: () => this.formRead, key: () => this.address });
+        /* The reason the buyer declined with. */
+        this.decline = new DraftController(this, { read: () => ({ reason: '' }), key: () => this.address });
+        /* Every change of the quotation reads it again once it is done. */
+        this.saves = {
+            create: new MutationController(this, gql `mutation ($quotation: NewQuotation!) { quotation: createQuotation(quotation: $quotation) { id } }`),
+            update: this.saving(gql `mutation ($id: String!, $quotation: NewQuotation!) { quotation: updateQuotation(id: $id, quotation: $quotation) { id } }`),
+            sendQuotation: this.saving(step('sendQuotation')),
+            expireQuotation: this.saving(step('expireQuotation')),
+            acceptQuotation: this.saving(step('acceptQuotation')),
+            reviseQuotation: this.saving(step('reviseQuotation')),
+            rejectQuotation: this.saving(step('rejectQuotation', true)),
+            invoice: new MutationController(this, gql `
+        mutation ($invoice: NewInvoice!) {
+          created: createInvoice(invoice: $invoice) { id }
+        }
+      `)
+        };
+        this.relined = false;
     }
     static { this.styles = [
         FormFieldStyles,
@@ -125,6 +166,51 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
       }
     `
     ]; }
+    saving(mutation) {
+        return new MutationController(this, mutation, { refetch: () => [this.record] });
+    }
+    get quotationId() {
+        return this.address?.id ?? '';
+    }
+    /** The company's words a new quotation starts with, the terms it offers and how long an offer holds (ADR-0170) - none until read. */
+    get defaults() {
+        return this.companyDefaults.data?.documentDefaults ?? null;
+    }
+    get quotation() {
+        return (this.quotationId && this.record.data?.quotation) || null;
+    }
+    get opportunities() {
+        return this.openOpportunities.data?.opportunities?.items ?? [];
+    }
+    /** What the form shows unedited: the quotation read, or what a new one starts with. */
+    get formRead() {
+        if (!this.address)
+            return undefined;
+        return this.address.id ? (this.quotation ?? undefined) : this.start;
+    }
+    /** The form as it shows: each field's edit, else what was read. */
+    get form() {
+        return { ...blank(), ...this.formRead, ...this.draft.edits };
+    }
+    /** The totals of the lines as typed, else as the quotation keeps them. */
+    get amounts() {
+        return this.typedAmounts ?? this.quotation ?? {};
+    }
+    get reason() {
+        return this.decline.value('reason') ?? '';
+    }
+    /** A failed read, or a quotation the address names that is not there. */
+    get error() {
+        if (this.record.error)
+            return this.record.error;
+        return this.quotationId && this.record.data && !this.record.data.quotation ? new Error(i18next.t('text.quotation-not-found')) : null;
+    }
+    get loading() {
+        return this.record.loading;
+    }
+    get busy() {
+        return this.making || Object.values(this.saves).some(save => save.pending);
+    }
     get editable() {
         return !this.quotation || this.quotation.status === 'DRAFT';
     }
@@ -156,14 +242,12 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
             actions: this.error ? [] : actions
         };
     }
-    async pageUpdated(changes, lifecycle) {
+    pageUpdated(changes, lifecycle) {
         if (!this.active || !(changes.active || changes.params))
             return;
-        const id = lifecycle?.params?.id;
-        if (!this.opportunities.length)
-            await this.readOpportunities();
-        if (!this.defaults)
-            this.defaults = await documentDefaults();
+        const { id, opportunity } = lifecycle?.params ?? {};
+        if (!this.defaultsReadable)
+            hasPrivilege(DOCUMENT_DEFAULTS_READER).then(may => (this.defaultsReadable = !!may));
         const section = quotationSection();
         if (section && !this.sectionReadable)
             (section.readable?.() ?? Promise.resolve(true)).then(may => (this.sectionReadable = !!may));
@@ -171,37 +255,43 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
             this.invoiceWriter = !!writer;
             this.updateContext();
         });
-        if (!id) {
-            this.quotation = null;
-            /* Written from an opportunity, the draft answers it. */
-            this.form = { ...blank(), opportunityId: lifecycle?.params?.opportunity ?? '' };
-            this.amounts = {};
-            this.party = null;
-            this.configure();
-            await this.prefill();
-            this.updateContext();
+        /* Written from an opportunity, the draft answers it. */
+        this.address = id ? { id } : { opportunity: opportunity ?? '' };
+    }
+    willUpdate(changes) {
+        super.willUpdate(changes);
+        const source = this.quotationId ? this.quotation : JSON.stringify(this.address ?? null);
+        if (source === this.lined)
             return;
-        }
-        if (id !== this.quotation?.id)
-            await this.load(id);
+        this.lined = source;
+        this.typedAmounts = null;
+        this.configure();
+        this.relined = true;
+    }
+    updated(changes) {
+        super.updated(changes);
+        if (!this.relined)
+            return;
+        this.relined = false;
+        this.grist?.fetch();
     }
     render() {
         const attached = this.quotation && this.sectionReadable ? quotationSection() : undefined;
         const editable = this.editable && !this.busy;
-        return html `<ox-page-state .loading=${this.loading} .error=${this.error} @retry=${() => this.quotation && this.load(this.quotation.id)}>
+        return html `<ox-page-state .loading=${this.loading} .error=${this.error} @retry=${() => this.record.refetch()}>
       <div class="page">
         <section class="page-section">
           <header class="page-section-header"><h3>${i18next.t('text.quotation-section-head')}</h3></header>
           ${renderDocumentHead(this.form, editable, patch => this.edit(patch), html `<label
                 >${i18next.t('field.quotation-valid-until')}
-                <input type="date" .value=${this.form.validUntil ?? ''} ?disabled=${!editable} @input=${(e) => (this.form = { ...this.form, validUntil: e.target.value })}
+                <input type="date" .value=${this.form.validUntil ?? ''} ?disabled=${!editable} @input=${(e) => this.put({ validUntil: e.target.value })}
               /></label>
               ${this.renderOpportunity(editable)}`, 'field.quotation-number', {
             terms: this.defaults?.paymentTerms,
             /* In the group it fills - the buyer's of a sale, the supplier's of a purchase. */
             party: html `<label
                 >${i18next.t('field.counterparty')}
-                <document-party-select .party=${this.party} ?disabled=${!editable} @party=${(e) => this.takeParty(e.detail)}></document-party-select>
+                <document-party-select .party=${this.form.party ?? null} ?disabled=${!editable} @party=${(e) => this.takeParty(e.detail)}></document-party-select>
               </label>`
         })}
         </section>
@@ -216,8 +306,8 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
           <ox-grist
             mode="GRID"
             .config=${this.gristConfig}
-            .fetchHandler=${() => ({ total: this.form.items.length, records: this.form.items })}
-            @record-change=${(e) => (this.amounts = onLineChange(this.grist, e, this.form.currency, false, this.form.discountAmount))}
+            .fetchHandler=${() => ({ total: (this.form.items ?? []).length, records: (this.form.items ?? []).map((item) => ({ ...item })) })}
+            @record-change=${(e) => (this.typedAmounts = onLineChange(this.grist, e, this.form.currency, false, this.form.discountAmount))}
           ></ox-grist>
         </section>
         <section class="page-section">
@@ -245,13 +335,13 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
       <header class="page-section-header">
         <h3>${i18next.t('text.quotation-section-decline')}</h3>
         <div class="page-section-actions">
-          <button ?disabled=${this.busy || !this.reason.trim()} @click=${() => this.change('rejectQuotation', this.reason.trim())}>${i18next.t('button.quotation-reject')}</button>
+          <button ?disabled=${this.busy || !this.reason.trim()} @click=${() => this.decline.submit(sent => this.change('rejectQuotation', (sent.reason ?? '').trim()))}>${i18next.t('button.quotation-reject')}</button>
         </div>
       </header>
       <div class="form">
         <label class="wide"
           >${i18next.t('field.quotation-outcome-reason')}
-          <input .value=${this.reason} ?disabled=${this.busy} @input=${(e) => (this.reason = e.target.value)}
+          <input .value=${this.reason} ?disabled=${this.busy} @input=${(e) => this.decline.set('reason', e.target.value)}
         /></label>
       </div>
     </section>`;
@@ -266,22 +356,27 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
             return;
         grist.addRecord(lineOfProduct(product));
         await grist.updateComplete;
-        this.amounts = reckonLines(grist, this.form.currency, false, this.form.discountAmount);
+        this.typedAmounts = reckonLines(grist, this.form.currency, false, this.form.discountAmount);
         grist.refresh();
     }
     /** The discount of the whole quotation as typed, and the totals after it. */
     discount(value) {
-        this.form = { ...this.form, discountAmount: value };
-        this.amounts = reckonLines(this.grist, this.form.currency, false, value);
+        this.put({ discountAmount: value });
+        this.typedAmounts = reckonLines(this.grist, this.form.currency, false, value);
+    }
+    /** Edits of several fields at once. */
+    put(patch) {
+        for (const [name, value] of Object.entries(patch))
+            this.draft.set(name, value);
     }
     /** A change of the head; a new currency reckons the lines in its minor unit; the last day follows a moved issue day. */
     edit(patch) {
         const currency = this.form.currency;
         const following = patch.issueDate && this.form.validUntil === daysAfter(this.form.issueDate, this.validDays);
-        this.form = { ...this.form, ...patch, ...(following ? { validUntil: daysAfter(patch.issueDate, this.validDays) } : {}) };
+        this.put({ ...patch, ...(following ? { validUntil: daysAfter(patch.issueDate, this.validDays) } : {}) });
         if (patch.currency && patch.currency !== currency) {
             this.configure();
-            this.amounts = reckonLines(this.grist, this.form.currency, false, this.form.discountAmount);
+            this.typedAmounts = reckonLines(this.grist, this.form.currency, false, this.form.discountAmount);
         }
     }
     /** The opportunity it answers - found by typing; choosing one takes its counterparty as the buyer when none is written. */
@@ -300,7 +395,7 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
             if (id === (this.form.opportunityId ?? ''))
                 return;
             const opportunity = choices.find(one => one.id === id);
-            this.form = { ...this.form, opportunityId: id };
+            this.put({ opportunityId: id });
             if (opportunity?.counterparty && !String(this.form.buyerName ?? '').trim())
                 this.takeParty(opportunity.counterparty);
         }}
@@ -315,45 +410,26 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
     }
     /** A counterparty as the other side: the buyer of a sale, the supplier of a purchase. */
     takeParty(party) {
-        this.party = party;
-        if (!party)
-            return;
-        const side = this.form.direction === 'PURCHASE' ? 'supplier' : 'buyer';
-        this.form = { ...this.form, [`${side}Name`]: party.name, [`${side}RegistrationNumber`]: party.businessNumber ?? this.form[`${side}RegistrationNumber`] ?? '' };
+        this.put(party ? partyFields(this.form, party) : { party: null });
     }
     /**
      * What a new quotation starts with, so a person writes only what is new: the next number of the year, the last day an
-     * offer holds, the company's own words (ADR-0170), and what they leave blank of our side as the last sales quotation
-     * wrote it.
+     * offer holds, the company's own words (ADR-0170), what they leave blank of our side as the last sales quotation
+     * wrote it, and the counterparty of the opportunity it answers.
      */
-    async prefill() {
-        try {
-            const year = Number(this.form.issueDate.slice(0, 4));
-            const response = await client.query({
-                query: gql `
-          query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {
-            numbered: quotations(filters: $filters, pagination: { page: 1, limit: 1000 }) { items { number } }
-            last: quotations(pagination: $pagination, sortings: $sortings) { items { direction ${OUR_SIDE_FIELDS.join(' ')} } }
-          }
-        `,
-                variables: { filters: [{ name: 'number', operator: 'like', value: `Q${year}-%` }], pagination: { page: 1, limit: 1 }, sortings: [{ name: 'createdAt', desc: true }] },
-                fetchPolicy: 'no-cache'
-            });
-            const last = (response.data?.last?.items ?? []).find((one) => one.direction === 'SALES');
-            this.form = { ...this.form, ...headFromDefaults(this.form, this.defaults) };
-            this.form = {
-                ...this.form,
-                ...oursFromLast(this.form, last),
-                number: this.form.number || nextQuotationNumber((response.data?.numbered?.items ?? []).map((one) => one.number), year),
-                validUntil: this.form.validUntil || daysAfter(this.form.issueDate, this.validDays)
-            };
-        }
-        catch {
-            /* Nothing to start from - the person writes it, as before. */
-        }
-        const opportunity = this.opportunities.find(one => one.id === this.form.opportunityId);
-        if (opportunity?.counterparty && !String(this.form.buyerName ?? '').trim())
-            this.takeParty(opportunity.counterparty);
+    get start() {
+        const form = { ...blank(), opportunityId: this.address?.opportunity ?? '' };
+        const started = this.starts.data;
+        const last = (started?.last?.items ?? []).find((one) => one.direction === 'SALES');
+        const head = { ...form, ...headFromDefaults(form, this.defaults) };
+        const filled = {
+            ...head,
+            ...oursFromLast(head, last),
+            number: started ? nextQuotationNumber((started.numbered?.items ?? []).map((one) => one.number), Number(form.issueDate.slice(0, 4))) : '',
+            validUntil: daysAfter(form.issueDate, this.validDays)
+        };
+        const opportunity = this.opportunities.find(one => one.id === form.opportunityId);
+        return opportunity?.counterparty ? { ...filled, ...partyFields(filled, opportunity.counterparty) } : filled;
     }
     /** Days an offer holds - the company's, or thirty. */
     get validDays() {
@@ -363,100 +439,29 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
         const answered = this.quotation?.opportunity;
         return answered && !this.opportunities.some(one => one.id === answered.id) ? [answered, ...this.opportunities] : this.opportunities;
     }
-    async readOpportunities() {
-        try {
-            const response = await client.query({
-                query: gql `
-          query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {
-            opportunities(filters: $filters, pagination: $pagination, sortings: $sortings) {
-              items { id name counterparty { id name businessNumber } }
-            }
-          }
-        `,
-                variables: {
-                    filters: [{ name: 'stage', operator: 'in', value: ['LEAD', 'PROPOSAL', 'QUOTED', 'NEGOTIATION'] }],
-                    pagination: { page: 1, limit: 500 },
-                    sortings: [{ name: 'name' }]
-                },
-                fetchPolicy: 'no-cache'
-            });
-            this.opportunities = response.data?.opportunities?.items ?? [];
-        }
-        catch (error) {
-            notify({ level: 'error', message: error?.graphQLErrors?.[0]?.message ?? error?.message ?? String(error) });
-        }
-    }
     configure() {
         this.gristConfig = documentLinesConfig({ editable: this.editable, currency: this.form.currency || 'KRW' });
     }
-    async load(id) {
-        this.loading = true;
-        this.error = null;
-        try {
-            const response = await client.query({ query: gql(`query ($id: String!) { quotation(id: $id) { ${FIELDS} } }`), variables: { id }, fetchPolicy: 'no-cache' });
-            if (response.errors?.length)
-                throw response;
-            if (!response.data.quotation)
-                throw new Error(i18next.t('text.quotation-not-found'));
-            this.show(response.data.quotation);
-        }
-        catch (error) {
-            this.error = error;
-        }
-        finally {
-            this.loading = false;
-            this.updateContext();
-        }
-    }
-    show(quotation) {
-        this.quotation = quotation;
-        this.form = { ...quotation, items: quotation.items.map((item) => ({ ...item })) };
-        this.amounts = quotation;
-        this.reason = '';
-        this.configure();
-        this.grist?.fetch();
-    }
-    async run(work) {
-        if (this.busy)
-            return undefined;
-        this.busy = true;
-        try {
-            return await work();
-        }
-        catch (error) {
-            notify({ level: 'error', message: error?.graphQLErrors?.[0]?.message ?? error?.errors?.[0]?.message ?? error?.message ?? String(error) });
-            return undefined;
-        }
-        finally {
-            this.busy = false;
-        }
-    }
     input() {
         const input = Object.fromEntries(HEAD.map(key => [key, this.form[key] === '' ? null : this.form[key] ?? null]));
         input.items = linesOf(this.grist).map(({ receivedTaxAmount, ...line }) => line);
         input.discountAmount = input.discountAmount === null ? 0 : Number(input.discountAmount);
         return input;
     }
+    /** A new one is opened once it is made; the edits sent are cleared once the save answered. Answers the quotation's id. */
     async save() {
-        const id = this.quotation?.id;
-        const saved = await this.run(async () => {
-            const response = await client.mutate({
-                mutation: gql(id
-                    ? `mutation ($id: String!, $quotation: NewQuotation!) { quotation: updateQuotation(id: $id, quotation: $quotation) { ${FIELDS} } }`
-                    : `mutation ($quotation: NewQuotation!) { quotation: createQuotation(quotation: $quotation) { ${FIELDS} } }`),
-                variables: { ...(id ? { id } : {}), quotation: this.input() }
-            });
-            if (response.errors?.length)
-                throw response;
-            return response.data.quotation;
-        });
+        if (this.busy)
+            return undefined;
+        const id = this.quotationId;
+        const saved = await this.draft.submit(() => (id ? this.saves.update.run({ id, quotation: this.input() }) : this.saves.create.run({ quotation: this.input() })));
         if (!saved)
             return undefined;
-        this.show(saved);
-        this.updateContext();
-        if (!id)
-            navigate(`quotation-editor?id=${saved.id}`);
-        return saved;
+        if (!id) {
+            /* The lines went with it: the grid keeps them as saved while the new quotation opens. */
+            this.grist?.commit();
+            navigate(`quotation-editor?id=${saved.quotation.id}`);
+        }
+        return saved.quotation.id;
     }
     /** Asked first - to whom and how much, fixed after - then save what is on screen and send it. */
     async send() {
@@ -475,26 +480,16 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
             return;
         const saved = await this.save();
         if (saved)
-            await this.change('sendQuotation');
-    }
-    async change(mutation, reason) {
-        const changed = await this.run(async () => {
-            const response = await client.mutate({
-                mutation: gql(reason === undefined
-                    ? `mutation ($id: String!) { quotation: ${mutation}(id: $id) { ${FIELDS} } }`
-                    : `mutation ($id: String!, $reason: String!) { quotation: ${mutation}(id: $id, reason: $reason) { ${FIELDS} } }`),
-                variables: { id: this.quotation.id, ...(reason === undefined ? {} : { reason }) }
-            });
-            if (response.errors?.length)
-                throw response;
-            return response.data.quotation;
-        });
-        if (!changed)
-            return;
-        if (changed.id !== this.quotation?.id)
-            navigate(`quotation-editor?id=${changed.id}`);
-        this.show(changed);
-        this.updateContext();
+            await this.change('sendQuotation', undefined, saved);
+    }
+    /** A step of the quotation's life; a revision opens the new version. */
+    async change(name, reason, id = this.quotationId) {
+        if (this.busy)
+            return undefined;
+        const changed = await this.saves[name].run({ id, ...(reason === undefined ? {} : { reason }) });
+        if (changed && changed.quotation.id !== id)
+            navigate(`quotation-editor?id=${changed.quotation.id}`);
+        return changed;
     }
     /**
      * An invoice draft of an accepted quotation (ADR-0170 decision 11): its parties, currency, language, terms, account,
@@ -503,8 +498,12 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
      * as the invoice editor links it.
      */
     async makeInvoice() {
+        if (this.busy)
+            return;
         const quotation = this.quotation;
-        const created = await this.run(async () => {
+        this.making = true;
+        try {
+            /* Looked up for the invoice, shown nowhere: the number after the last sales invoice's, and the counterparty. */
             const last = await client.query({
                 query: gql `
           query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {
@@ -516,40 +515,37 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
             });
             const issueDate = today();
             const party = await partyOfName(quotation.direction === 'PURCHASE' ? quotation.supplierName : quotation.buyerName);
-            const response = await client.mutate({
-                mutation: gql `
-          mutation ($invoice: NewInvoice!) {
-            createInvoice(invoice: $invoice) { id }
-          }
-        `,
-                variables: {
-                    invoice: {
-                        number: nextInvoiceNumber(last.data?.invoices?.items?.[0]?.number, Number(issueDate.slice(0, 4))),
-                        counterpartyId: party?.id ?? null,
-                        ...Object.fromEntries(INVOICE_HEAD.map(key => [key, quotation[key] ?? null])),
-                        issueDate,
-                        dueDate: daysAfter(issueDate, this.defaults?.paymentDays ?? PAYMENT_DAYS),
-                        sourceReference: i18next.t('text.quotation-invoice-source', { number: quotation.number, version: quotation.version }),
-                        taxBasis: 'CALCULATED',
-                        discountAmount: Number(quotation.discountAmount ?? 0),
-                        items: quotation.items.map(({ description, quantity, unit, unitPrice, discount, taxKind, taxRate }) => ({
-                            description,
-                            quantity,
-                            unit: unit ?? null,
-                            unitPrice,
-                            discount,
-                            taxKind,
-                            taxRate
-                        }))
-                    }
+            const made = await this.saves.invoice.run({
+                invoice: {
+                    number: nextInvoiceNumber(last.data?.invoices?.items?.[0]?.number, Number(issueDate.slice(0, 4))),
+                    counterpartyId: party?.id ?? null,
+                    ...Object.fromEntries(INVOICE_HEAD.map(key => [key, quotation[key] ?? null])),
+                    issueDate,
+                    dueDate: daysAfter(issueDate, this.defaults?.paymentDays ?? PAYMENT_DAYS),
+                    sourceReference: i18next.t('text.quotation-invoice-source', { number: quotation.number, version: quotation.version }),
+                    taxBasis: 'CALCULATED',
+                    discountAmount: Number(quotation.discountAmount ?? 0),
+                    items: quotation.items.map(({ description, quantity, unit, unitPrice, discount, taxKind, taxRate }) => ({
+                        description,
+                        quantity,
+                        unit: unit ?? null,
+                        unitPrice,
+                        discount,
+                        taxKind,
+                        taxRate
+                    }))
                 }
             });
-            if (response.errors?.length)
-                throw response;
-            return response.data.createInvoice;
-        });
-        if (created)
-            navigate(`invoice-editor?id=${created.id}`);
+            const created = made?.created;
+            if (created)
+                navigate(`invoice-editor?id=${created.id}`);
+        }
+        catch {
+            /* The look-up's failure is told by the GraphQL link. */
+        }
+        finally {
+            this.making = false;
+        }
     }
     /**
      * The saved quotation as it goes out (ADR-0170 decision 10) - the server's page in the language chosen there, the
@@ -576,55 +572,31 @@ let QuotationEditor = class QuotationEditor extends localize(i18next)(PageView)
 __decorate([
     state(),
     __metadata("design:type", Object)
-], QuotationEditor.prototype, "quotation", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], QuotationEditor.prototype, "form", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], QuotationEditor.prototype, "loading", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], QuotationEditor.prototype, "error", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], QuotationEditor.prototype, "busy", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], QuotationEditor.prototype, "reason", void 0);
+], QuotationEditor.prototype, "address", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)
 ], QuotationEditor.prototype, "gristConfig", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Array)
-], QuotationEditor.prototype, "opportunities", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)
-], QuotationEditor.prototype, "defaults", void 0);
+], QuotationEditor.prototype, "defaultsReadable", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)
-], QuotationEditor.prototype, "party", void 0);
+], QuotationEditor.prototype, "typedAmounts", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)
-], QuotationEditor.prototype, "amounts", void 0);
+], QuotationEditor.prototype, "invoiceWriter", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)
-], QuotationEditor.prototype, "invoiceWriter", void 0);
+], QuotationEditor.prototype, "sectionReadable", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)
-], QuotationEditor.prototype, "sectionReadable", void 0);
+], QuotationEditor.prototype, "making", void 0);
 __decorate([
     query('ox-grist'),
     __metadata("design:type", DataGrist)
@@ -633,6 +605,11 @@ QuotationEditor = __decorate([
     customElement('quotation-editor')
 ], QuotationEditor);
 export { QuotationEditor };
+/** A counterparty as the other side of `form`: the buyer of a sale, the supplier of a purchase. */
+function partyFields(form, party) {
+    const side = form.direction === 'PURCHASE' ? 'supplier' : 'buyer';
+    return { party, [`${side}Name`]: party.name, [`${side}RegistrationNumber`]: party.businessNumber ?? form[`${side}RegistrationNumber`] ?? '' };
+}
 function blank() {
     return { number: '', direction: 'SALES', currency: 'KRW', language: 'ko', supplierName: '', buyerName: '', issueDate: today(), validUntil: '', discountAmount: 0, items: [] };
 }