process: add lead-url reaction

Components/Calculation/builders/build-readonly.tsx

@@ -1,16 +1,23 @@
 import { observer } from 'mobx-react-lite';
 import type { ComponentType } from 'react';
+import { useStatus } from 'stores/calculation/statuses/hooks';
 import { useValue } from 'stores/calculation/values/hooks';
 import type { Values } from 'stores/calculation/values/types';
+import type { Elements } from '../config/map/values';
 
 type BuilderProps = {
+  elementName: Elements;
   valueName: Values;
 };
 
-export default function buildReadonly<T>(Component: ComponentType<T>, { valueName }: BuilderProps) {
+export default function buildReadonly<T>(
+  Component: ComponentType<T>,
+  { elementName, valueName }: BuilderProps
+) {
   return observer((props: T) => {
     const [value] = useValue(valueName);
+    const status = useStatus(elementName);
 
-    return <Component value={value} readOnly {...props} />;
+    return <Component value={value} status={status} readOnly {...props} />;
   });
 }

Components/Calculation/config/elements-builders.ts

@@ -1,6 +1,7 @@
 import buildAction from '../builders/build-action';
 import buildComputed from '../builders/build-computed';
 import buildOptions from '../builders/build-options';
+import buildReadonly from '../builders/build-readonly';
 import buildValue from '../builders/build-value';
 
 function wrapElementsBuilders<C, T extends Record<string, C>>(arg: T) {
@@ -70,7 +71,6 @@ const builders = wrapElementsBuilders({
   tbxVehicleTaxInLeasingPeriod: buildValue,
   labelSubsidySum: buildValue,
   tbxMinPriceChange: buildValue,
-  linkDownloadKp: buildValue,
 
   selectProduct: buildOptions,
   selectClientRisk: buildOptions,
@@ -137,6 +137,11 @@ const builders = wrapElementsBuilders({
   labelRegistrationDescription: buildComputed,
   btnCreateKP: buildAction,
   btnCalculate: buildAction,
+
+  linkDownloadKp: buildReadonly,
+  linkLeadUrl: buildReadonly,
+  linkOpportunityUrl: buildReadonly,
+  linkQuoteUrl: buildReadonly,
 });
 
 export default builders;

Components/Calculation/config/elements-components.ts

@@ -154,6 +154,9 @@ const components = wrapComponentsMap({
 
   /** Link Elements */
   linkDownloadKp: Link,
+  linkLeadUrl: Link,
+  linkOpportunityUrl: Link,
+  linkQuoteUrl: Link,
 });
 
 export default components;

Components/Calculation/config/elements-render/override.tsx

@@ -31,6 +31,7 @@ const overrideRender: Partial<Record<keyof typeof map, RenderProps>> = {
       });
 
       const LinkComponent = buildReadonly(Link, {
+        elementName: 'linkLeadUrl',
         valueName: 'leadUrl',
       });
 
@@ -57,6 +58,7 @@ const overrideRender: Partial<Record<keyof typeof map, RenderProps>> = {
       });
 
       const LinkComponent = buildReadonly(Link, {
+        elementName: 'linkOpportunityUrl',
         valueName: 'opportunityUrl',
       });
 
@@ -83,6 +85,7 @@ const overrideRender: Partial<Record<keyof typeof map, RenderProps>> = {
       });
 
       const LinkComponent = buildReadonly(Link, {
+        elementName: 'linkQuoteUrl',
         valueName: 'quoteUrl',
       });
 

Components/Calculation/config/elements-titles.ts

@@ -126,6 +126,9 @@ const titles: Record<ValuesElements | ComputedElements | ActionElements, string>
 
   /** Link Elements */
   linkDownloadKp: '',
+  linkLeadUrl: '',
+  linkOpportunityUrl: '',
+  linkQuoteUrl: '',
 
   /** Computed Elements */
   labelIrrInfo: 'Диапазон IRR (Номинал)',

Components/Calculation/config/map/values.ts

@@ -128,6 +128,9 @@ const elementsToValues = wrapElementsMap({
 
   /** Link Elements */
   linkDownloadKp: 'kpUrl',
+  linkLeadUrl: 'leadUrl',
+  linkOpportunityUrl: 'opportunityUrl',
+  linkQuoteUrl: 'quoteUrl',
 });
 
 export default elementsToValues;

Elements/Link.tsx

@@ -20,7 +20,7 @@ export default (function Link({
       rel="noopener"
       target="_blank"
       href={value}
-      disabled={status === 'Disabled'}
+      disabled={status === 'Disabled' || !value}
       loading={status === 'Loading'}
       {...props}
     >

pages/index.tsx

@@ -1,9 +1,10 @@
-import { gql } from '@apollo/client';
+import { gql, useApolloClient } from '@apollo/client';
 import initializeApollo from 'apollo/client';
 import * as Calculation from 'Components/Calculation';
 import Output from 'Components/Output';
 import type { GetServerSideProps } from 'next';
 import Head from 'next/head';
+import leadOpportunityUrlsReactions from 'process/lead-opportunity/reactions/urls';
 import { fetchUser } from 'services/user';
 import { getDomainName } from 'services/user/tools';
 import { useStore } from 'stores/hooks';
@@ -36,10 +37,22 @@ const Grid = styled(Box)`
 `;
 
 function Home({ data }: PageProps) {
+  const store = useStore();
+  const apolloClient = useApolloClient();
+
+  /**
+   * add reactions to store
+   */
+  leadOpportunityUrlsReactions(store, apolloClient);
+
+  /**
+   * set initial data to store
+   */
   const leads = data.leads ? convertEntitiesToOptions(data.leads) : [];
   const opportunities = data.opportunities ? convertEntitiesToOptions(data.opportunities) : [];
 
-  const { $calculation } = useStore();
+  const { $calculation } = store;
+
   $calculation.$options.setOptions({
     selectLead: leads,
     selectOpportunity: opportunities,

process/lead-opportunity/reactions/__generated__/GetLeadUrl.ts

@@ -0,0 +1,24 @@
+/* tslint:disable */
+/* eslint-disable */
+// @generated
+// This file was automatically generated and should not be edited.
+
+// ====================================================
+// GraphQL query operation: GetLeadUrl
+// ====================================================
+
+export interface GetLeadUrl_lead {
+  __typename: 'lead';
+  link: string | null;
+}
+
+export interface GetLeadUrl {
+  /**
+   * Лизинговые сделки. statecode по умолчанию 0, можно отфильтровать по ownerid и/или domainName
+   */
+  lead: GetLeadUrl_lead | null;
+}
+
+export interface GetLeadUrlVariables {
+  leadid: any;
+}

process/lead-opportunity/reactions/urls.ts

@@ -0,0 +1,56 @@
+import type { ApolloClient } from '@apollo/client';
+import { gql } from '@apollo/client';
+import { reaction } from 'mobx';
+import type RootStore from 'stores/root';
+import type { GetLeadUrl, GetLeadUrlVariables } from './__generated__/GetLeadUrl';
+
+export default function leadOpportunityUrlsReactions(
+  store: RootStore,
+  apolloClient: ApolloClient<object>
+) {
+  const { $calculation } = store;
+
+  /**
+   * При выборе Интереса скачиваем ссылку в CRM на него и записываем в linkLeadUrl
+   */
+
+  const QUERY_GET_LEAD_URL = gql`
+    query GetLeadUrl($leadid: Uuid!) {
+      lead(leadid: $leadid) {
+        link
+      }
+    }
+  `;
+
+  reaction(
+    () => $calculation.$values.getElementValue('selectLead'),
+    (leadid) => {
+      const timeoutId = setTimeout(() => {
+        $calculation.$status.setStatus('linkLeadUrl', 'Loading');
+      }, 1200);
+
+      apolloClient
+        .query<GetLeadUrl, GetLeadUrlVariables>({
+          query: QUERY_GET_LEAD_URL,
+          variables: {
+            leadid,
+          },
+        })
+        .then(({ data }) => {
+          clearTimeout(timeoutId);
+          if (data.lead?.link) $calculation.$values.setValue('leadUrl', data.lead?.link);
+        })
+        .catch(() => {
+          clearTimeout(timeoutId);
+          $calculation.$values.setValue('leadUrl', null);
+        });
+    }
+  );
+  reaction(
+    () => $calculation.$values.getElementValue('linkLeadUrl'),
+    (leadUrl) => {
+      const status = leadUrl ? 'Default' : 'Disabled';
+      $calculation.$status.setStatus('linkLeadUrl', status);
+    }
+  );
+}