hl-core 0.0.9-beta.9 → 0.0.10-beta.10

package/composables/index.ts

@@ -2,22 +2,15 @@ import { useDisplay } from 'vuetify';
 import jwt_decode from 'jwt-decode';
 import { XMLParser } from 'fast-xml-parser';
 import { AxiosError } from 'axios';
-
-export const getBaseCredentials = () => {
-  return {
-    production: { login: '', password: '' },
-    test: { login: '', password: '' },
-    development: { login: 'manager', password: 'asdqwe123' },
-    vercel: { login: '', password: 'asdqwe123' },
-  };
-};
+import { DocumentReaderApi, Scenario, TextFieldType, LCID } from '@regulaforensics/document-reader-webclient';
+import { PolicyholderClass } from '../composables/classes';
+import type { EnvModes, NestedKeyOf, ResponseStructure } from '../types';
 
 export const useEnv = () => {
   return {
     envMode: import.meta.env.VITE_MODE,
     isDev: import.meta.env.VITE_MODE === 'development',
     isTest: import.meta.env.VITE_MODE === 'test',
-    isVercel: import.meta.env.VITE_MODE === 'vercel',
     isProduction: import.meta.env.VITE_MODE === 'production',
   };
 };
@@ -25,11 +18,13 @@ export const useEnv = () => {
 export class Masks {
   numbers: string = '#*';
   otp: string = '# # # #';
+  spacedNumbers: string = '### ### ### ### ### ### ###';
   iin: string = '###-###-###-###';
   phone: string = '+7 (7##) ### ## ##';
   date: string = '##.##.####';
   post: string = '######';
   threeDigit: string = '###';
+  iik: string = 'KZXXXXXXXXXXXXXXXXXX';
 }
 
 export const useMask = () => new Masks();
@@ -62,6 +57,18 @@ export const formatDate = (date: string) => {
   }
 };
 
+export const formatToPlanDate = (date: string) => {
+  if (date) {
+    const data = date.split('.');
+    const day = data[0];
+    const month = data[1];
+    const year = data[2];
+    return `${year}-${month}-${day}`;
+  } else {
+    return null;
+  }
+};
+
 export const reformatDate = (date: string) => {
   if (date) {
     const data = new Date(date);
@@ -93,6 +100,8 @@ export const formatPhone = (phone: string) => {
   return phone?.replace(/(\(|\)|\+| )/g, '');
 };
 
+export const cleanWhiteSpace = (str: string) => String(str).replace(/\s+/g, '');
+
 export const jwtDecode = (token: string): any => {
   if (token) return jwt_decode(token);
   else return null;
@@ -183,18 +192,66 @@ export const ESBDMessage = (ESBDObject: any, initialPoint: any) => {
 
 export const ErrorHandler = (err: unknown, errorText?: string) => {
   console.log(err);
-  if (err instanceof AxiosError) {
-    if ('response' in err && err.response && err.response.data) {
-      if ('status' in err.response && err.response.status === 403) {
-        useDataStore().showToaster('error', useDataStore().t('toaster.noPermission'), 10000);
-      } else if (err.response.data) {
-        useDataStore().showToaster('error', errorText ? errorText : err.response.data, 10000);
+  if (useDataStore) {
+    const dataStore = useDataStore();
+    if (typeof err === 'string') dataStore.showToaster('error', err);
+    if (err instanceof AxiosError) {
+      if ('response' in err && err.response && err.response.data) {
+        if (err.response.data === Object(err.response.data) && 'errors' in err.response.data && 'title' in err.response.data && 'traceId' in err.response.data) {
+          Object.entries(err.response.data.errors).forEach(([field, errors]) => {
+            dataStore.showToaster('error', `Поле: ${field}. Ошибка: ${Array.isArray(errors) ? errors.join(', ') : errors}`, 10000);
+          });
+        } else {
+          dataStore.showToaster('error', errorText ? errorText : err.response.data, 10000);
+        }
       }
     }
   }
   return false;
 };
 
+export const policyholderToBeneficialOwner = (isPolicyholderBeneficialOwner: boolean, policyholder?: PolicyholderClass) => {
+  const formStore = useFormStore();
+  const dataStore = useDataStore();
+  const beneficialOwner = formStore.lfb.beneficialOwners[0].beneficialOwnerData;
+  if (isPolicyholderBeneficialOwner && policyholder) {
+    beneficialOwner.iin = policyholder.clientData.authoritedPerson.iin;
+    beneficialOwner.firstName = policyholder.clientData.authoritedPerson.firstName;
+    beneficialOwner.middleName = policyholder.clientData.authoritedPerson.middleName;
+    beneficialOwner.lastName = policyholder.clientData.authoritedPerson.lastName;
+    beneficialOwner.citizenship = policyholder.clientData.authoritedPerson.citizenship;
+    beneficialOwner.birthDate = policyholder.clientData.authoritedPerson.birthDate;
+    beneficialOwner.gender = policyholder.clientData.authoritedPerson.gender;
+    beneficialOwner.resident = policyholder.clientData.resident;
+    beneficialOwner.taxResidentCountry = policyholder.clientData.taxResidentCountry;
+    beneficialOwner.economySectorCode = policyholder.clientData.economySectorCode;
+    beneficialOwner.identityDocument.issuedOn = policyholder.clientData.authoritedPerson.identityDocument.issuedOn;
+    beneficialOwner.identityDocument.documentNumber = policyholder.clientData.authoritedPerson.identityDocument.documentNumber;
+    beneficialOwner.identityDocument.documentType = policyholder.clientData.authoritedPerson.identityDocument.documentType;
+    beneficialOwner.identityDocument.issuedBy = policyholder.clientData.authoritedPerson.identityDocument.issuedBy;
+    beneficialOwner.identityDocument.validUntil = policyholder.clientData.authoritedPerson.identityDocument.validUntil;
+    beneficialOwner.identityDocument.series = policyholder.clientData.authoritedPerson.identityDocument.series;
+    dataStore.showToaster('warning', dataStore.t('toaster.formFieldEmptyWarning'));
+  } else {
+    beneficialOwner.iin = '';
+    beneficialOwner.firstName = '';
+    beneficialOwner.middleName = '';
+    beneficialOwner.lastName = '';
+    beneficialOwner.citizenship = new Value();
+    beneficialOwner.birthDate = '';
+    beneficialOwner.gender = new Value();
+    beneficialOwner.resident = new Value();
+    beneficialOwner.taxResidentCountry = new Value();
+    beneficialOwner.economySectorCode = new Value();
+    beneficialOwner.identityDocument.issuedOn = '';
+    beneficialOwner.identityDocument.documentNumber = '';
+    beneficialOwner.identityDocument.documentType = new Value();
+    beneficialOwner.identityDocument.issuedBy = new Value();
+    beneficialOwner.identityDocument.validUntil = '';
+    beneficialOwner.identityDocument.series = '';
+  }
+};
+
 export const setAddressBeneficiary = (whichIndex: number, sameAddress: boolean) => {
   const formStore = useFormStore();
   const dataStore = useDataStore();
@@ -254,15 +311,82 @@ export const setAddressBeneficiary = (whichIndex: number, sameAddress: boolean)
     }
   }
 };
-
+export const setAddressInsured = (whichIndex: number, sameAddress: boolean) => {
+  const formStore = useFormStore();
+  const dataStore = useDataStore();
+  const insured = formStore.insuredForm[Number(whichIndex)];
+  const policyholder = formStore.policyholderForm;
+  if (sameAddress === true) {
+    insured.registrationCity = policyholder.registrationCity;
+    insured.registrationCountry = policyholder.registrationCountry;
+    insured.birthPlace = policyholder.birthPlace;
+    insured.registrationMicroDistrict = policyholder.registrationMicroDistrict;
+    insured.registrationNumberApartment = policyholder.registrationNumberApartment;
+    insured.registrationNumberApartment = policyholder.registrationNumberApartment;
+    insured.registrationNumberHouse = policyholder.registrationNumberHouse;
+    insured.registrationProvince = policyholder.registrationProvince;
+    insured.registrationQuarter = policyholder.registrationQuarter;
+    insured.registrationRegion = policyholder.registrationRegion;
+    insured.registrationRegionType = policyholder.registrationRegionType;
+    insured.registrationStreet = policyholder.registrationStreet;
+  } else {
+    if (insured.id === 0) {
+      insured.registrationCity = new Value();
+      insured.registrationCountry = new Value();
+      insured.registrationMicroDistrict = '';
+      insured.registrationNumberApartment = '';
+      insured.registrationNumberApartment = '';
+      insured.registrationNumberHouse = '';
+      insured.registrationProvince = new Value();
+      insured.registrationQuarter = '';
+      insured.registrationRegion = new Value();
+      insured.registrationRegionType = new Value();
+      insured.registrationStreet = '';
+    } else {
+      if (insured.response && insured.response.addresses && insured.response.addresses.length) {
+        const benAddress = insured.response.addresses;
+        const countryName = benAddress[0].countryName;
+        const cityName = benAddress[0].cityName;
+        if (countryName) {
+          const country = dataStore.countries.find(i => (i.nameRu as string).match(new RegExp(countryName, 'i')));
+          insured.registrationCountry = country ?? new Value();
+        }
+        if (cityName) {
+          const city = dataStore.cities.find(i => i.nameRu === cityName.replace('г.', ''));
+          insured.registrationCity = city ?? new Value();
+        }
+        const province = dataStore.states.find(i => i.ids === benAddress[0].stateCode);
+        const localityType = dataStore.localityTypes.find(i => i.nameRu === benAddress[0].cityTypeName);
+        const region = dataStore.regions.find(i => i.ids == benAddress[0].regionCode);
+        insured.registrationMicroDistrict = insured.response?.addresses[0].microRaion ?? '';
+        insured.registrationNumberApartment = insured.response?.addresses[0].apartmentNumber ?? '';
+        insured.registrationNumberHouse = insured.response?.addresses[0].blockNumber ?? '';
+        insured.registrationProvince = province ?? new Value();
+        insured.registrationQuarter = insured.response?.addresses[0].kvartal ?? '';
+        insured.registrationRegion = region ?? new Value();
+        insured.registrationRegionType = localityType ?? new Value();
+        insured.registrationStreet = insured.response?.addresses[0].streetName ?? '';
+      }
+    }
+  }
+};
 export const changeBridge = async (toBridge: 'efo' | 'lka', token: string) => {
-  const bridgeUrl = import.meta.env[`VITE_${toBridge.toUpperCase()}_URL`] as string;
+  const bridgeUrl = ref<string>(import.meta.env[`VITE_${toBridge.toUpperCase()}_URL`] as string);
   if (!toBridge) return;
-  if (!bridgeUrl || !token) {
+  if (!bridgeUrl.value || !token) {
     useDataStore().showToaster('error', `${useDataStore().t('toaster.noUrl')} [import.meta.env.VITE_${toBridge.toUpperCase()}_URL]`);
     return;
   }
-  window.open(`${bridgeUrl}/#/Token?token=${token}`, '_blank');
+  const host = window.location.hostname;
+  if (toBridge === 'efo') {
+    if (host.startsWith('bpmsrv02') && bridgeUrl.value !== 'http://bpmsrv02:88') bridgeUrl.value = 'http://bpmsrv02:88';
+    if (host.startsWith('vega') && bridgeUrl.value !== 'http://vega:800') bridgeUrl.value = 'http://vega:800';
+  }
+  if (toBridge === 'lka') {
+    if (host.startsWith('bpmsrv02') && bridgeUrl.value !== 'http://bpmsrv02:890') bridgeUrl.value = 'http://bpmsrv02:890';
+    if (host.startsWith('vega') && bridgeUrl.value !== 'http://vega:890') bridgeUrl.value = 'http://vega:890';
+  }
+  window.open(`${bridgeUrl.value}/#/Token?token=${token}`, '_blank');
 };
 
 export const getFirstDayOfMonth = (year: number, month: number) => {
@@ -274,3 +398,215 @@ export const getLastDayOfMonth = (year: number, month: number) => {
   const date = new Date();
   return new Date(year, month + 1, 0, (date.getTimezoneOffset() / 60) * -1).toISOString();
 };
+
+type WhichValuePerEnv =
+  | 'qrHubUrl'
+  | 'qrGenUrl'
+  | 'qrXmlGenUrl'
+  | 'gatewayApiUrl'
+  | 'gatewayApiUrlLocal'
+  | 'baseApi'
+  | 'baseApiLocal'
+  | 'efoBaseApi'
+  | 'efoBaseApiLocal'
+  | 'amlBaseApi'
+  | 'amlBaseApiLocal';
+
+export const getStrValuePerEnv = (which: WhichValuePerEnv) => {
+  const valuesPerEnv: {
+    [key in WhichValuePerEnv]: {
+      [key in EnvModes]: string;
+    };
+  } = {
+    qrHubUrl: {
+      production: 'https://prod-sign.halyklife.kz/qrhub',
+      development: 'https://test-sign.halyklife.kz/qrhub',
+      test: 'https://test-sign.halyklife.kz/qrhub',
+    },
+    qrGenUrl: {
+      production: 'https://prod-sign.halyklife.kz/EgovQrCms',
+      development: 'https://test-sign.halyklife.kz/EgovQrCms',
+      test: 'https://test-sign.halyklife.kz/EgovQrCms',
+    },
+    qrXmlGenUrl: {
+      production: 'https://prod-sign.halyklife.kz/EgovQrXml',
+      development: 'https://test-sign.halyklife.kz/EgovQrXml',
+      test: 'https://test-sign.halyklife.kz/EgovQrXml',
+    },
+    gatewayApiUrl: {
+      production: 'https://products.halyklife.kz/gateway',
+      development: 'https://products.halyklife.kz/test/gateway',
+      test: 'https://products.halyklife.kz/test/gateway',
+    },
+    gatewayApiUrlLocal: {
+      production: 'http://products.halyklife.nb/gateway',
+      development: 'http://products.halyklife.nb/test/gateway',
+      test: 'http://products.halyklife.nb/test/gateway',
+    },
+    baseApi: {
+      production: 'https://products.halyklife.kz/api/v1/insis',
+      development: 'https://products.halyklife.kz/api/v1/test/insis',
+      test: 'https://products.halyklife.kz/api/v1/test/insis',
+    },
+    baseApiLocal: {
+      production: 'http://bpmsrv02.halyklife.nb',
+      development: 'http://vega:84',
+      test: 'http://vega:84',
+    },
+    efoBaseApi: {
+      production: 'https://products.halyklife.kz/efo/api',
+      development: 'https://products.halyklife.kz/test/efo/api',
+      test: 'https://products.halyklife.kz/test/efo/api',
+    },
+    efoBaseApiLocal: {
+      production: 'http://efo-prod.halyklife.nb/api',
+      development: 'http://efo-dev.halyklife.nb/api',
+      test: 'http://efo-dev.halyklife.nb/api',
+    },
+    amlBaseApi: {
+      production: 'https://products.halyklife.kz/aml/api',
+      development: 'https://products.halyklife.kz/test/aml/api',
+      test: 'https://products.halyklife.kz/test/aml/api',
+    },
+    amlBaseApiLocal: {
+      production: 'http://aml-prod.halyklife.nb/api',
+      development: 'http://aml-dev.halyklife.nb/api',
+      test: 'http://aml-dev.halyklife.nb/api',
+    },
+  };
+  return valuesPerEnv[which][import.meta.env.VITE_MODE as EnvModes];
+};
+
+export const getMainPageRoute = () => {
+  const dataStore = useDataStore();
+  if (dataStore.isEFO || dataStore.isAULETTI) {
+    return 'Insurance-Product';
+  }
+  if (dataStore.isLKA || dataStore.isLKA_A) {
+    return 'Menu';
+  }
+  if (dataStore.isAML) {
+    return 'Main';
+  }
+  return 'index';
+};
+
+export const keyDeleter = <T extends object>(data: T, keys: Array<NestedKeyOf<T>>) => {
+  if (typeof data === 'object' && !!data && keys && Array.isArray(keys) && keys.length) {
+    keys.forEach(key => {
+      if (key) {
+        if (String(key).includes('.')) {
+          const childKey = String(key).substring(0, String(key).indexOf('.'));
+          const keyChain = [String(key).substring(String(key).indexOf('.') + 1)];
+          // @ts-ignore
+          keyDeleter(data[childKey], keyChain);
+        } else {
+          //@ts-ignore
+          delete data[key];
+        }
+      }
+    });
+  }
+};
+
+export const formatDateProperty = (item: any, to: 'front' | 'back', additionalKeys?: string[]) => {
+  try {
+    if (item) {
+      Object.keys(item).forEach((key: string) => {
+        if (item[key] === Object(item[key])) {
+          formatDateProperty(item[key], to);
+        } else {
+          if (Array.isArray(additionalKeys)) {
+            additionalKeys.forEach(k => {
+              if (String(key).includes(k) && typeof item[key] === 'string' && !!item[key]) {
+                item[key] = to === 'front' ? reformatDate(item[key]) : formatDate(item[key])!.toISOString();
+              }
+            });
+          }
+          if ((String(key).includes('date') || String(key).includes('Date')) && typeof item[key] === 'string' && !!item[key]) {
+            item[key] = to === 'front' ? reformatDate(item[key]) : formatDate(item[key])!.toISOString();
+          }
+        }
+      });
+    }
+  } catch (err) {
+    console.log(err);
+  }
+};
+
+export const callDocumentReader = async (imageBase64: string | string[]) => {
+  if (!imageBase64) return false;
+  const dataStore = useDataStore();
+  try {
+    const api = new DocumentReaderApi({
+      basePath: `${getStrValuePerEnv('gatewayApiUrl')}/regulaforensics`,
+      baseOptions: { headers: { Authorization: `Bearer ${dataStore.accessToken}` } },
+    });
+    const result = await api.process({
+      images: Array.isArray(imageBase64) ? imageBase64 : [imageBase64],
+      processParam: { scenario: Scenario.FULL_PROCESS, doublePageSpread: true, measureSystem: 0 },
+    });
+    const documentName = ref<string | undefined>(undefined);
+    if (result.rawResponse && result.rawResponse.ContainerList) {
+      const dType = result.rawResponse.ContainerList.List.find(i => i.result_type === 9);
+      if (dType && 'OneCandidate' in dType && dType.OneCandidate && dType.OneCandidate.DocumentName) {
+        documentName.value = dType.OneCandidate.DocumentName;
+      }
+    }
+    if (result.text) {
+      const iin = result.text.getField(TextFieldType.PERSONAL_NUMBER);
+      const lastName = result.text.getField(TextFieldType.SURNAME, LCID.KAZAKH);
+      const firstName = result.text.getField(TextFieldType.GIVEN_NAMES_RUS, LCID.KAZAKH) ?? result.text.getField(TextFieldType.GIVEN_NAMES, LCID.KAZAKH);
+      const middleName = result.text.getField(TextFieldType.FATHERS_NAME_RUS, LCID.KAZAKH) ?? result.text.getField(TextFieldType.FATHERS_NAME, LCID.KAZAKH);
+      const fullName = result.text.getField(TextFieldType.SURNAME_AND_GIVEN_NAMES, LCID.KAZAKH);
+      const birthDate = result.text.getField(TextFieldType.DATE_OF_BIRTH);
+      const age = result.text.getField(TextFieldType.AGE);
+      const gender = result.text.getField(TextFieldType.SEX);
+      const documentNumber = result.text.getField(TextFieldType.DOCUMENT_NUMBER);
+      const documentIssuer = result.text.getField(TextFieldType.AUTHORITY_RUS) ?? result.text.getField(TextFieldType.AUTHORITY);
+      const documentIssueDate = result.text.getField(TextFieldType.DATE_OF_ISSUE);
+      const documentExpireDate = result.text.getField(TextFieldType.DATE_OF_EXPIRY);
+      const parsedDocument = {
+        iin: iin?.value,
+        lastName: lastName?.value,
+        firstName: firstName?.value,
+        middleName: middleName?.value,
+        fullName: fullName?.value,
+        birthDate: birthDate?.value,
+        age: age?.value,
+        gender: gender?.value,
+        documentName: documentName.value,
+        documentNumber: documentNumber?.value,
+        documentIssuer: documentIssuer?.value,
+        documentIssueDate: documentIssueDate?.value,
+        documentExpireDate: documentExpireDate?.value,
+      };
+      if (Object.values(parsedDocument).every(i => !i)) {
+        dataStore.showToaster('error', dataStore.t('toaster.notParsedDocument'));
+        return false;
+      }
+      return parsedDocument;
+    } else {
+      dataStore.showToaster('error', dataStore.t('toaster.notParsedDocument'));
+    }
+    return false;
+  } catch (err) {
+    return ErrorHandler(err);
+  }
+};
+
+export const validateResponseStructure = <T>(res: ResponseStructure<T>) => {
+  if (res && res.code === 0) {
+    return res.data;
+  } else {
+    useDataStore().showToaster('error', res.message);
+    return null;
+  }
+};
+
+export const isEveryFormDisabled = (isDisabledForm: any) => {
+  if (!isDisabledForm) return false;
+  return Object.values(isDisabledForm).every(i => i === true);
+};
+
+export class ApiError extends AxiosError<any, any> {}

package/composables/styles.ts

@@ -15,12 +15,24 @@ export class Styles {
   blueTextLight: string = 'text-[#F3F6FC]';
 
   // Green
-  greenBg: string = 'bg-[#009C73]';
-  greenBgHover: string = 'hover:bg-[#00a277]';
-  greenBgLight: string = 'bg-[#EAF6EF]';
+  greenBg: string =
+    import.meta.env.VITE_PRODUCT === 'auletti' || import.meta.env.VITE_PARENT_PRODUCT === 'auletti' || import.meta.env.VITE_PRODUCT === 'lka-auletti'
+      ? 'bg-[#DEBE8C]'
+      : 'bg-[#009C73]';
+  greenBgHover: string =
+    import.meta.env.VITE_PRODUCT === 'auletti' || import.meta.env.VITE_PARENT_PRODUCT === 'auletti' || import.meta.env.VITE_PRODUCT === 'lka-auletti'
+      ? 'bg-[#C19B5F]'
+      : 'hover:bg-[#00a277]';
+  greenBgLight: string =
+    import.meta.env.VITE_PRODUCT === 'auletti' || import.meta.env.VITE_PARENT_PRODUCT === 'auletti' || import.meta.env.VITE_PRODUCT === 'lka-auletti'
+      ? 'bg-[#e8d2af]'
+      : 'bg-[#EAF6EF]';
   greenText: string = '!text-[#009C73]';
   greenTextHover: string = 'hover:text-[#009C73]';
-  greenBgLightHover: string = 'hover:bg-[#dbf0e4]';
+  greenBgLightHover: string =
+    import.meta.env.VITE_PRODUCT === 'auletti' || import.meta.env.VITE_PARENT_PRODUCT === 'auletti' || import.meta.env.VITE_PRODUCT === 'lka-auletti'
+      ? 'hover:bg-[#efdfc6]'
+      : 'hover:bg-[#dbf0e4]';
 
   // Yellow
   yellowText: string = '!text-[#FAB31C]';
@@ -52,7 +64,10 @@ export class Styles {
   roundedB: string = 'rounded-b-[8px]';
   blueBorder: string = 'border-[1px] border-[#A0B3D8]';
   blueLightBorder: string = 'border-[1px] border-[#F3F6FC]';
-  greenBorder: string = 'border-[1px] border-[#009C73]';
+  greenBorder: string =
+    import.meta.env.VITE_PRODUCT === 'auletti' || import.meta.env.VITE_PARENT_PRODUCT === 'auletti' || import.meta.env.VITE_PRODUCT === 'lka-auletti'
+      ? 'border-[1px] border-[#DEBE8C]'
+      : 'border-[1px] border-[#009C73]';
   redBorder: string = 'border-[1px] border-[#FD2D39]';
   yellowBorder: string = 'border-[1px] border-[#FAB31C]';
 
@@ -70,6 +85,7 @@ export class Styles {
   redBtn: string;
   yellowBtn: string;
   whiteBtn: string;
+  whiteBorderBtn: string;
   whiteBtnBlueBr: string;
   blueLightBtn: string;
   greenLightBtn: string;
@@ -92,13 +108,14 @@ export class Styles {
     this.blueBtn = `${this.blueBg} ${this.whiteText} ${this.textTitle} ${this.rounded} w-full ${this.blueBgHover}`;
     this.whiteBtnBlueBr = `${this.whiteBg} ${this.blueText} ${this.textTitle} ${this.rounded} w-full ${this.blueBgLightHover} ${this.blueBorder}`;
     this.whiteBtn = ` ${this.blackText} ${this.textTitle} ${this.rounded} w-full ${this.blueLightBgHover}`;
+    this.whiteBorderBtn = ` ${this.blackText} ${this.textTitle} ${this.rounded} w-full ${this.blueLightBgHover} border-[#A0B3D8] border-[1px]`;
     this.blueLightBtn = `${this.blueBgLight} ${this.greyTextLight} ${this.textTitle} ${this.rounded} w-full ${this.blueBgLightHover}`;
     this.greenLightBtn = `${this.greenBgLight} ${this.greenText} ${this.textTitle} ${this.rounded} w-full ${this.greenBgLightHover}`;
 
     // Complex
     this.flexColNav = 'flex flex-col gap-[10px] px-2 pt-[14px]';
     this.emptyBlockCol = 'w-[60px] sm:w-[100px] h-[30%] rounded-[8px] bg-[#f5f5f5]';
-    this.scrollPage = 'max-h-[90vh] overflow-y-scroll';
+    this.scrollPage = 'max-h-[85svh] overflow-y-scroll';
   }
 }
 

package/configs/pwa.ts

@@ -0,0 +1,63 @@
+import type { ModuleOptions } from '@vite-pwa/nuxt';
+
+export const pwaBaseConfig: Partial<ModuleOptions> = {
+  registerType: 'autoUpdate',
+  workbox: {
+    globPatterns: ['**/*.{js,css,html,txt,png,ico,svg}'],
+    navigateFallbackDenylist: [/^\/api\//],
+    navigateFallback: '/',
+    cleanupOutdatedCaches: true,
+    runtimeCaching: [
+      {
+        urlPattern: /^https:\/\/fonts.googleapis.com\/.*/i,
+        handler: 'CacheFirst',
+        options: {
+          cacheName: 'google-fonts-cache',
+          expiration: {
+            maxEntries: 10,
+            maxAgeSeconds: 60 * 60 * 24 * 365,
+          },
+          cacheableResponse: {
+            statuses: [0, 200],
+          },
+        },
+      },
+      {
+        urlPattern: /^https:\/\/fonts.gstatic.com\/.*/i,
+        handler: 'CacheFirst',
+        options: {
+          cacheName: 'gstatic-fonts-cache',
+          expiration: {
+            maxEntries: 10,
+            maxAgeSeconds: 60 * 60 * 24 * 365,
+          },
+          cacheableResponse: {
+            statuses: [0, 200],
+          },
+        },
+      },
+      {
+        urlPattern: /^https:\/\/cdn.jsdelivr.net\/.*/i,
+        handler: 'CacheFirst',
+        options: {
+          cacheName: 'cdn-jsdelivr-cache',
+          expiration: {
+            maxEntries: 10,
+            maxAgeSeconds: 60 * 60 * 24 * 365,
+          },
+          cacheableResponse: {
+            statuses: [0, 200],
+          },
+        },
+      },
+    ],
+  },
+  registerWebManifestInRouteRules: true,
+  writePlugin: true,
+  devOptions: {
+    enabled: true,
+    suppressWarnings: true,
+    navigateFallback: '/',
+    type: 'module',
+  },
+};

package/layouts/clear.vue

@@ -1,3 +1,24 @@
 <template>
   <div class="h-full w-full"><slot></slot></div>
 </template>
+
+<script setup lang="ts">
+const dataStore = useDataStore();
+const { $pwa } = useNuxtApp();
+
+const onInit = async () => {
+  const projectConfig = dataStore.projectConfig;
+  if (!useEnv().isProduction && process.env.NODE_ENV === 'production' && $pwa && projectConfig === null) {
+    const hasConfig = await dataStore.getProjectConfig();
+    if (hasConfig === true) {
+      const commitVersion = String(import.meta.env.VITE_COMMIT_VERSION);
+      if (dataStore.projectConfig !== null && commitVersion !== dataStore.projectConfig.version) {
+        //@ts-ignore
+        await $pwa.updateServiceWorker(true);
+      }
+    }
+  }
+};
+
+onInit();
+</script>