@redneckz/wildless-cms-uni-blocks 0.14.964 → 0.14.966

package/src/retail/components/Fields/CardCategoryField.tsx

@@ -5,13 +5,19 @@ import { type CustomFieldProps } from '../../../ui-kit/FormField/CustomFieldProp
 import { InfoCard } from '../../../ui-kit/InfoCard/InfoCard';
 import { type Option } from '../../../ui-kit/Select/Option';
 import { getCardTypes, type CardTypeData } from '../../api/getCardTypes';
+import { useRetailFormStore } from '../../hooks/useRetailFormStore';
 import { SelectField } from './SelectField';
 
 export const CardCategoryField = JSX<CustomFieldProps>(({ field, input }) => {
   const [cardTypes, setCardTypes] = useState<CardTypeData[]>([]);
   const [programId] = useLocalStorage<string>('programId');
+  const { productType } = useRetailFormStore();
+  const isSalaryCard = programId === '38';
+  const isDebit = productType === 'debitCard';
+  const isEsiaAuth = Boolean(field('esiaAccountTypeCd')?.value?.key);
   const { value: selectedCardCategory, onChange: cardCategoryChange } = field('cardCategory');
   const selectedPaymentSystem = field('paymentSystem')?.value?.key;
+  const handleChangeIsMomentDebitCard = field('isMomentDebitCard')?.onChange;
 
   const getCardCategoryValue = useCallback(
     (fetchedCardTypes: CardTypeData[]) =>
@@ -24,14 +30,23 @@ export const CardCategoryField = JSX<CustomFieldProps>(({ field, input }) => {
     [],
   );
 
+  const onChange = useCallback((value: Option) => {
+    cardCategoryChange?.(value);
+    handleChangeIsMomentDebitCard?.(value?.text?.toLowerCase()?.includes('неимен'));
+  }, []);
+
   useEffect(() => {
     if (selectedPaymentSystem && programId) {
       (async () => {
         const fetchedCardTypes = await getCardTypes(selectedPaymentSystem as string, programId);
-        setCardTypes(fetchedCardTypes);
+        const actualCardTypes =
+          isDebit && !isEsiaAuth && !isSalaryCard
+            ? excludeSomeСategoriesCards(fetchedCardTypes)
+            : fetchedCardTypes;
+        setCardTypes(actualCardTypes);
 
-        if (!isValidCardCategory(fetchedCardTypes, selectedCardCategory as Option)) {
-          cardCategoryChange?.(getCardCategoryValue(fetchedCardTypes));
+        if (!isValidCardCategory(actualCardTypes, selectedCardCategory as Option)) {
+          cardCategoryChange?.(getCardCategoryValue(actualCardTypes));
         }
       })();
     }
@@ -50,6 +65,7 @@ export const CardCategoryField = JSX<CustomFieldProps>(({ field, input }) => {
         label="Категория карты"
         fieldName="cardCategory"
         input={input}
+        onChange={onChange}
       />
       {description ? <InfoCard __html={description} /> : null}
     </div>
@@ -58,3 +74,8 @@ export const CardCategoryField = JSX<CustomFieldProps>(({ field, input }) => {
 
 const isValidCardCategory = (cardTypes: CardTypeData[], selectedCardCategory: Option | null) =>
   cardTypes.some((cardType) => cardType.key === selectedCardCategory?.key);
+
+const excludeSomeСategoriesCards = (cardTypes: CardTypeData[]) =>
+  cardTypes.filter(
+    (cardType) => cardType.value && cardType.value.toLowerCase().includes(' именная'),
+  );

package/src/retail/components/Fields/DeliveryDateFiels.tsx

@@ -1,7 +1,33 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { useMemo } from '@redneckz/uni-jsx/lib/hooks';
 import { DatePickerControl } from '../../../ui-kit/DatePicker/DatePickerControl';
 import { type CustomFieldProps } from '../../../ui-kit/FormField/CustomFieldProps';
+import { useLeadFormData } from '../../hooks/useLeadFormData';
+import { useRetailFormStore } from '../../hooks/useRetailFormStore';
 
-export const DeliveryDateFiels = JSX<CustomFieldProps>(({ field, input }) => (
-  <DatePickerControl label="Дата доставки" {...field(input?.name ?? '')} minDate={new Date()} />
-));
+const MIN_DATE = new Date(Date.now() + 1 * 24 * 60 * 60 * 1000);
+
+export const DeliveryDateFiels = JSX<CustomFieldProps>(({ field, input }) => {
+  const { productType } = useRetailFormStore();
+  const isDebit = productType === 'debitCard';
+  const minDate = isDebit ? MIN_DATE : new Date();
+  const { data } = useLeadFormData('DAYS_DELIVERY_SETTINGS');
+
+  const weekends: number[] = useMemo(() => {
+    const weekendItem = data?.find((item) => item.key === 'WEEKEND');
+    if (weekendItem && weekendItem.value) {
+      return weekendItem.value.split(',').map(Number);
+    }
+
+    return [];
+  }, [data]);
+
+  return (
+    <DatePickerControl
+      label="Дата доставки"
+      {...field(input?.name ?? '')}
+      minDate={minDate}
+      weekends={isDebit ? weekends : []}
+    />
+  );
+});

package/src/retail/components/Fields/DeliveryTimeField.tsx

@@ -4,17 +4,25 @@ import { type CustomFieldProps } from '../../../ui-kit/FormField/CustomFieldProp
 import { type RadioButtonItem } from '../../../ui-kit/RadioButtonGroup/RadioButtonGroup';
 import { RadioButtonGroupControl } from '../../../ui-kit/RadioButtonGroup/RadioButtonGroupControl';
 import { useLeadFormData } from '../../hooks/useLeadFormData';
+import { useRetailFormStore } from '../../hooks/useRetailFormStore';
 
 export const DeliveryTimeField = JSX<CustomFieldProps>(({ field, input }) => {
+  const { productType } = useRetailFormStore();
+  const isDebit = productType === 'debitCard';
   const { data } = useLeadFormData('COURIER_DELIVERY_TIME');
-  const deliveryTime: RadioButtonItem[] = useMemo(
-    () =>
-      data?.map((_) => ({
-        id: _.key as string,
-        text: _.value,
-      })) ?? [],
-    [data],
-  );
+  const creditDeliveryTime = ['TIME_1', 'TIME_2', 'TIME_3'];
+  const debitDeliveryTime = ['TIME_4', 'TIME_5'];
+
+  const deliveryTime: RadioButtonItem[] = useMemo(() => {
+    const allowedTimes = isDebit ? debitDeliveryTime : creditDeliveryTime;
+
+    return (data || [])
+      .filter((item) => item.key && allowedTimes.includes(item.key))
+      .map((item) => ({
+        id: item.key as string,
+        text: item.value,
+      }));
+  }, [data, isDebit]);
 
   return (
     <RadioButtonGroupControl

package/src/retail/components/Fields/RegionRetailField.tsx

@@ -10,12 +10,11 @@ import { useLeadFormData } from '../../hooks/useLeadFormData';
 import { useRetailFormStore } from '../../hooks/useRetailFormStore';
 
 export const RegionRetailField = JSX<CustomFieldProps>(({ field, input }) => {
-  const { programId, productType } = useRetailFormStore();
+  const { productType } = useRetailFormStore();
   const { data: regions } = useLeadFormData('REGION_RF');
   const { data: regionsDelivery } = useAsyncData('regionsDelivery', getRegionsCardDelivery);
   const { data: productSettings } = useLeadFormData(getCurrentProductSettings(productType));
-
-  const isSalaryCard = programId === '38';
+  const isEsiaAuth = field('esiaAccountTypeCd')?.value?.key;
   const formatRegions = regions?.map(({ key, value }) => ({ key, text: value }));
   const isDeliveryActive =
     productSettings?.find((_) => _?.key === 'DELIVERY_ACTIVE')?.value === 'true';
@@ -28,12 +27,13 @@ export const RegionRetailField = JSX<CustomFieldProps>(({ field, input }) => {
       const regionHasDelivery =
         isDeliveryActive &&
         regionsDelivery?.find((_) => _.regionCode === value.key)?.deliveryFlg &&
-        !isSalaryCard;
+        Boolean(isEsiaAuth);
+
       handleChangeRegionHasDelivery?.(regionHasDelivery);
       handleChangeMethodObtain?.(regionHasDelivery ? 'courier' : 'office');
       handleChangeRegion?.(value);
     },
-    [regionsDelivery, isDeliveryActive],
+    [regionsDelivery, isDeliveryActive, isEsiaAuth],
   );
 
   return (

package/src/retail/components/Fields/SelectField.tsx

@@ -18,6 +18,7 @@ export interface SelectFieldProps
   fieldName: string;
   isSearch?: boolean;
   isManualInput?: boolean;
+  onChange?: (value: Option) => void;
 }
 
 export const SelectField = UniBlock<SelectFieldProps>(
@@ -28,6 +29,7 @@ export const SelectField = UniBlock<SelectFieldProps>(
     placeholder = 'Выберите из списка',
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     options,
+    onChange,
     ...rest
   }) => {
     const leadOptions: Option[] =
@@ -42,6 +44,7 @@ export const SelectField = UniBlock<SelectFieldProps>(
         options={leadOptions}
         {...field(fieldName)}
         {...rest}
+        onChange={onChange ?? field(fieldName)?.onChange}
       />
     );
   },

package/src/retail/model/LeadFormState.ts

@@ -186,6 +186,7 @@ export interface LeadFormState extends FormRetailConsents, FormStateDeliveryType
   latinName?: string;
   latinSurname?: string;
   regionHasDelivery?: boolean;
+  isMomentDebitCard?: boolean;
   files?: File[];
   deliveryTime?: string;
 }

package/src/retail/model/NameFieldDef.ts

@@ -28,6 +28,7 @@ type NameFieldCreditCardDef =
   | 'deliveryDate'
   | 'regionHasDelivery'
   | 'latinName'
+  | 'isMomentDebitCard'
   | 'latinSurname';
 
 type NameFieldRetailDef =

package/src/ui-kit/DatePicker/Calendar.tsx

@@ -11,11 +11,12 @@ interface CalendarProps {
   currentYear: number;
   min?: Date;
   max?: Date;
+  weekends?: number[];
   onDateSelect?: (date: Date) => void;
 }
 
 export const Calendar = JSX<CalendarProps>(
-  ({ today, currentMonth, currentYear, min, max, onDateSelect = noop }) => {
+  ({ today, currentMonth, currentYear, min, max, weekends, onDateSelect = noop }) => {
     const { firstDayOfWeek, totalDays } = useMemo(
       () => ({
         firstDayOfWeek: new Date(currentYear, currentMonth, 1).getDay() - 1,
@@ -44,6 +45,7 @@ export const Calendar = JSX<CalendarProps>(
             currentMonth,
             min,
             max,
+            weekends,
             onDateClick: onDateSelect,
           })}
         </tbody>

package/src/ui-kit/DatePicker/DatePicker.tsx

@@ -34,11 +34,22 @@ interface DatePickerProps extends ControlProps<Date>, ComponentType, LabelProps,
   minDate?: Date;
   maxDate?: Date;
   valid?: boolean;
+  weekends?: number[];
 }
 
 export const DatePicker = JSX<DatePickerProps>(
   // eslint-disable-next-line max-lines-per-function
-  ({ className = '', label = '', value, valid = true, minDate, maxDate, disabled, onChange }) => {
+  ({
+    className = '',
+    label = '',
+    value,
+    valid = true,
+    minDate,
+    maxDate,
+    disabled,
+    weekends,
+    onChange,
+  }) => {
     const [isCalendarVisible, { setValue, setFalse: hideCalendar }] = useBool(false);
     const [selectedMonth, setSelectedMonth] = useState(value?.getMonth() || new Date().getMonth());
     const [selectedYear, setSelectedYear] = useState(
@@ -120,6 +131,7 @@ export const DatePicker = JSX<DatePickerProps>(
                 currentYear={selectedYear}
                 min={minDate}
                 max={maxDate}
+                weekends={weekends}
                 onDateSelect={handleDateSelect}
               />
             </div>

package/src/ui-kit/DatePicker/DatePickerControl.tsx

@@ -9,6 +9,7 @@ import { DatePicker } from './DatePicker';
 export interface DatePickerControlProps extends DefaultControlType, ControlProps<Date> {
   minDate?: Date;
   maxDate?: Date;
+  weekends?: number[];
 }
 
 export const DatePickerControl = JSX<DatePickerControlProps>(

package/src/ui-kit/DatePicker/renderCalendarCells.tsx

@@ -12,6 +12,7 @@ interface RenderCalendarCellsParams {
   currentMonth: number;
   min?: Date;
   max?: Date;
+  weekends?: number[];
   onDateClick: (date: Date) => void;
 }
 
@@ -23,11 +24,11 @@ export const renderCalendarCells = ({
   currentYear,
   min,
   max,
+  weekends,
   onDateClick,
 }: RenderCalendarCellsParams) => {
   const calendarCells: VNode = [];
   let dayCounter = 1;
-
   for (let i = 0; i < DAY_COUNT; i++) {
     const rowCells: VNode = [];
 
@@ -40,12 +41,15 @@ export const renderCalendarCells = ({
         const currentDate = new Date(currentYear, currentMonth, dayCounter);
         const isToday = checkIsToday(currentDate, today);
         const isDisabled = checkIsDisabled(currentDate, min, max);
+        const isWeekend = checkIsWeekend(currentDate, weekends);
+
+        const isBlocked = isDisabled || isWeekend;
 
         rowCells.push(
           <td key={`day-${dayCounter}`}>
             <div
-              className={getDayStyles(isToday, isDisabled)}
-              onClick={() => !isDisabled && onDateClick(currentDate)}
+              className={getDayStyles(isToday, isBlocked)}
+              onClick={() => !isBlocked && onDateClick(currentDate)}
             >
               {dayCounter}
             </div>
@@ -68,11 +72,20 @@ const checkIsToday = (currentDate: Date, today: Date | undefined) =>
 const checkIsDisabled = (currentDate: Date, min: Date | undefined, max: Date | undefined) =>
   (min && currentDate.getTime() < min.getTime()) || (max && currentDate.getTime() > max.getTime());
 
-const getDayStyles = (isToday = false, isDisabled = false) =>
+const checkIsWeekend = (currentDate: Date, weekends?: number[]) => {
+  if (!weekends || weekends.length === 0) {
+    return false;
+  }
+  const dayOfWeek = currentDate.getDay() === 0 ? 7 : currentDate.getDay();
+
+  return weekends.includes(dayOfWeek);
+};
+
+const getDayStyles = (isToday = false, isBlocked = false) =>
   style(
     'p-s text-center rounded-md border',
     {
       'border-transparent hover:bg-gray': !isToday,
     },
-    isDisabled ? 'text-gray hover:bg-transparent' : 'cursor-pointer',
+    isBlocked ? 'text-gray hover:bg-transparent' : 'cursor-pointer',
   );