@omniumretail/component-library 1.2.70 → 1.2.72

package/src/components/Category/Category.stories.tsx

@@ -1,371 +0,0 @@
-import { Meta, StoryFn } from "@storybook/react-webpack5";
-import { useEffect, useState } from "react";
-import { Category } from '.';
-
-export default {
-    title: 'Category',
-    component: Category,
-} as Meta;
-
-const Template: StoryFn<any> = (args: any) => {
-    const [serverData, setServerData] = useState<any>();
-
-    useEffect(() => {
-        console.log(serverData);
-    }, [serverData])
-
-    const getAnswerTypeOptions = [
-        {
-            "Id": "CD8D0F30-6229-4BA9-9888-4398CB21D392",
-            "Name": "Resposta Numérica",
-            "IsOpenAnswer": false,
-            "IsCheckBox": false,
-            "IsNumerical": true,
-            "IsDate": false,
-            "HasGrade": true,
-            "IsEmphasis": false,
-            "IsMultipleChoise": false,
-            "State": "Deleted",
-            "Grade": 4,
-            "Rank": 1,
-            "Options": [
-                {
-                    "Value": "string",
-                    "Grade": 5,
-                    "Color": "string",
-                    "NeedsAction": true
-                }
-            ],
-            "CreateDate": "2024-02-29T10:21:18.448Z",
-            "UpdateDate": "2024-08-09T10:48:32.487Z",
-            "StartDate": "2024-06-04T14:51:29.942Z",
-            "Status": "A",
-            "ShowAnswerType": false
-        },
-        {
-            "Id": "DF873E84-1941-45E1-84C5-D2D12A0E305D",
-            "Name": "Sim ou Não",
-            "IsOpenAnswer": false,
-            "IsCheckBox": false,
-            "IsNumerical": false,
-            "IsDate": false,
-            "HasGrade": false,
-            "IsEmphasis": true,
-            "IsMultipleChoise": true,
-            "State": "Finished",
-            "Grade": 0,
-            "Rank": 0,
-            "UseName": true,
-            "Options": [
-                {
-                    "Value": "Sim",
-                    "Grade": 5,
-                    "Color": "#b75959",
-                    "NeedsAction": false
-                },
-                {
-                    "Value": "Nao",
-                    "Grade": 10,
-                    "Color": "#00000",
-                    "NeedsAction": true
-                },
-                {
-                    "Value": "xpto",
-                    "Grade": 10,
-                    "Color": "#00000",
-                    "NeedsAction": true
-                }
-            ],
-            "CreateDate": "2024-04-12T14:58:32.085Z",
-            "UpdateDate": "2024-08-23T15:27:35.196Z",
-            "StartDate": "2024-08-23T15:27:35.196Z",
-            "Status": "A",
-            "ShowAnswerType": true
-        },
-        {
-            "Id": "058D4541-8739-49C2-85D0-A6BF3BA19E4E",
-            "Name": "Verdade ou mentira",
-            "IsOpenAnswer": false,
-            "IsCheckBox": false,
-            "IsNumerical": false,
-            "IsDate": false,
-            "HasGrade": false,
-            "IsEmphasis": true,
-            "IsMultipleChoise": true,
-            "State": "Draft",
-            "Grade": 0,
-            "Rank": 4,
-            "Options": [
-                {
-                    "Value": "Verdadeiro",
-                    "Grade": 1,
-                    "Color": "#00ff12",
-                    "NeedsAction": false
-                },
-                {
-                    "Value": "Mentira",
-                    "Grade": 0,
-                    "Color": "5B95E5D8-6E78-4B53-8196-CD6996BB824A",
-                    "NeedsAction": true
-                }
-            ],
-            "CreateDate": "2024-04-18T16:11:59.622Z",
-            "UpdateDate": "2024-07-17T13:26:55.766Z",
-            "StartDate": "2024-04-18T16:12:13.135Z",
-            "Status": "A",
-            "ShowAnswerType": true
-        },
-        {
-            "Id": "65E6051B-E9D1-46BA-9486-4099D470613F",
-            "Name": "Sim/Não/Não Sei",
-            "IsOpenAnswer": false,
-            "IsCheckBox": false,
-            "IsNumerical": false,
-            "IsDate": false,
-            "HasGrade": false,
-            "IsEmphasis": false,
-            "IsMultipleChoise": true,
-            "State": "Draft",
-            "Grade": 0,
-            "Rank": 5,
-            "Options": [
-                {
-                    "Value": "Sim",
-                    "Grade": 2,
-                    "Color": "#14f116",
-                    "NeedsAction": false
-                },
-                {
-                    "Value": "Não",
-                    "Grade": 1,
-                    "Color": "#ef0f0f",
-                    "NeedsAction": true
-                },
-                {
-                    "Value": "Não sei",
-                    "Grade": 0,
-                    "Color": "#0003f7",
-                    "NeedsAction": false
-                }
-            ],
-            "CreateDate": "2024-07-02T10:31:08.974Z",
-            "UpdateDate": "2024-07-17T13:27:17.646Z",
-            "StartDate": "0001-01-01T00:00:00Z",
-            "Status": "A",
-            "ShowAnswerType": true
-        },
-        {
-            "Id": "93AF03D8-07B4-4622-A45C-D0206AB2A98D",
-            "Name": "Verdadeiro e falso",
-            "IsOpenAnswer": false,
-            "IsCheckBox": false,
-            "IsNumerical": false,
-            "IsDate": false,
-            "HasGrade": false,
-            "IsEmphasis": false,
-            "IsMultipleChoise": true,
-            "State": "Finished",
-            "Grade": 0,
-            "Rank": 6,
-            "Options": [
-                {
-                    "Value": "V",
-                    "Grade": 1,
-                    "Color": "#12e662",
-                    "NeedsAction": false
-                },
-                {
-                    "Value": "F",
-                    "Grade": 0,
-                    "Color": "#d91818",
-                    "NeedsAction": true
-                }
-            ],
-            "CreateDate": "2024-07-02T16:29:26.101Z",
-            "UpdateDate": "2024-07-02T16:29:27.755Z",
-            "StartDate": "2024-07-02T16:29:27.755Z",
-            "Status": "A",
-            "ShowAnswerType": true
-        },
-        {
-            "Id": "F0CCAFB5-A9E7-42A3-9E9D-3827C1461065",
-            "Name": "Sim / Não / N/A",
-            "IsOpenAnswer": false,
-            "IsCheckBox": false,
-            "IsNumerical": false,
-            "IsDate": false,
-            "HasGrade": false,
-            "IsEmphasis": false,
-            "IsMultipleChoise": true,
-            "State": "Finished",
-            "Grade": 0,
-            "Rank": 7,
-            "Options": [
-                {
-                    "Value": "Sim",
-                    "Grade": 2,
-                    "Color": "#02e235",
-                    "NeedsAction": false
-                },
-                {
-                    "Value": "Não",
-                    "Grade": 0,
-                    "Color": "#f40000",
-                    "NeedsAction": false
-                },
-                {
-                    "Value": "N/A",
-                    "Grade": 0,
-                    "Color": "#00000",
-                    "NeedsAction": false
-                }
-            ],
-            "CreateDate": "2024-07-04T10:02:07.001Z",
-            "UpdateDate": "2024-07-04T10:02:08.783Z",
-            "StartDate": "2024-07-04T10:02:08.783Z",
-            "Status": "A",
-            "ShowAnswerType": true
-        },
-        {
-            "Id": "57859452-4B79-4005-BB6C-3695C78270FD",
-            "Name": "Lojas",
-            "IsOpenAnswer": false,
-            "IsCheckBox": false,
-            "IsNumerical": false,
-            "IsDate": false,
-            "HasGrade": false,
-            "IsEmphasis": false,
-            "IsMultipleChoise": true,
-            "State": "Finished",
-            "Grade": 0,
-            "Rank": 8,
-            "Options": [
-                {
-                    "Value": "NorteShopping",
-                    "Grade": 0,
-                    "Color": "#f12a2a",
-                    "NeedsAction": true
-                },
-                {
-                    "Value": "GaiaShopping",
-                    "Grade": 0,
-                    "Color": "#191be7",
-                    "NeedsAction": false
-                },
-                {
-                    "Value": "CatarinaShopping",
-                    "Grade": 0,
-                    "Color": "#00000",
-                    "NeedsAction": false
-                }
-            ],
-            "CreateDate": "2024-07-04T11:32:36.118Z",
-            "UpdateDate": "2024-08-23T15:28:07.14Z",
-            "StartDate": "2024-08-23T15:28:07.14Z",
-            "Status": "A",
-            "ShowAnswerType": true
-        },
-        {
-            "Id": "90DA4D64-9DB6-4D7D-A9C6-5E128905B71C",
-            "Name": "teste",
-            "IsOpenAnswer": false,
-            "IsCheckBox": false,
-            "IsNumerical": false,
-            "IsDate": false,
-            "HasGrade": false,
-            "IsEmphasis": false,
-            "IsMultipleChoise": true,
-            "State": "Draft",
-            "Grade": 0,
-            "Rank": 8,
-            "Options": [
-                {
-                    "Value": "teste",
-                    "Grade": 0,
-                    "Color": "#00000",
-                    "NeedsAction": true
-                }
-            ],
-            "CreateDate": "2024-08-23T08:35:24.04Z",
-            "UpdateDate": "2024-08-23T08:35:24.041Z",
-            "StartDate": "0001-01-01T00:00:00Z",
-            "Status": "A",
-            "ShowAnswerType": true
-        },
-        {
-            "Id": "CD8D0F30-6229-4BA9-9888-4398CB333392",
-            "Name": "Data",
-            "IsOpenAnswer": false,
-            "IsCheckBox": false,
-            "IsNumerical": true,
-            "IsDate": true,
-            "HasGrade": true,
-            "IsEmphasis": false,
-            "IsMultipleChoise": false,
-            "State": "Finished",
-            "Grade": 4,
-            "Rank": 2,
-            "Options": [
-                {
-                    "Value": "string",
-                    "Grade": 5,
-                    "Color": "string",
-                    "NeedsAction": true
-                }
-            ],
-            "CreateDate": "2024-02-29T10:21:18.448Z",
-            "UpdateDate": "2024-08-09T10:48:32.487Z",
-            "StartDate": "2024-06-04T14:51:29.942Z",
-            "Status": "A",
-            "ShowAnswerType": false
-        },
-        {
-            "Id": "A45656EF-27D3-42C0-AE91-550289415357",
-            "Name": "Horas de inspeção",
-            "IsOpenAnswer": false,
-            "IsCheckBox": false,
-            "IsNumerical": false,
-            "IsDate": false,
-            "HasGrade": false,
-            "IsEmphasis": false,
-            "IsMultipleChoise": true,
-            "State": "Finished",
-            "Grade": 0,
-            "Rank": 8,
-            "Options": [
-                {
-                    "Value": "1",
-                    "Grade": 1,
-                    "Color": "#00000",
-                    "NeedsAction": false
-                },
-                {
-                    "Value": "2",
-                    "Grade": 0,
-                    "Color": "#00000",
-                    "NeedsAction": false
-                },
-                {
-                    "Value": "3+",
-                    "Grade": 0,
-                    "Color": "#00000",
-                    "NeedsAction": false
-                }
-            ],
-            "CreateDate": "2024-08-27T16:18:45.76Z",
-            "UpdateDate": "2024-08-27T16:18:46.187Z",
-            "StartDate": "2024-08-27T16:18:46.187Z",
-            "Status": "A",
-            "ShowAnswerType": true
-        }
-    ]
-
-    return <Category {...args} serverReadyData={setServerData} responseTypeOptions={getAnswerTypeOptions} data={[]}></Category>
-};
-
-export const Primary = Template.bind({});
-Primary.args = {
-};
-
-
-

package/src/components/Category/CategoryContent/index.tsx

@@ -1,255 +0,0 @@
-import { Form, Select } from 'antd';
-import { useForm } from 'antd/es/form/Form';
-import { Button } from '../../Button';
-import { InputField } from '../../Input';
-import { Label } from '../../Label';
-import { Questions } from '../../Questions';
-import { Switch } from '../../Switch';
-import { SetStateAction, useCallback, useEffect, useState } from 'react';
-import styles from './styles.module.scss';
-import { t } from 'i18next';
-
-interface categoryContent {
-    categoryContentShow: boolean;
-    categoryContentInfo: any;
-    categorySidebarData: any;
-    chooseResponseType?: boolean;
-    responseTypeOptions?: any;
-    hasHeader?: boolean;
-}
-
-const defaultInitialValues = {
-    generalEvaluationLevel: "0",
-    questions: [],
-    openAnswer: false,
-    isYesOrNo: false,
-    emphasis: false
-};
-
-export const CategoryContent = (props: categoryContent) => {
-    const {
-        categoryContentShow,
-        categorySidebarData,
-        chooseResponseType,
-        responseTypeOptions,
-        hasHeader
-    } = props;
-
-    const [contentInfo, setContentInfo] = useState<any>(defaultInitialValues);
-    const [switchOpenAnswStatus, setSwitchOpenAnswStatus] = useState<boolean>(false);
-    const [switchYesOrNoAnswStatus, setSwitchYesOrNoAnswStatus] = useState<boolean>(false);
-    const [initialValues, setInitialValues] = useState<any>(categorySidebarData?.data || defaultInitialValues)
-    const [form] = useForm();
-
-    const onFinish = (values: any) => {
-        const combinedValues = { ...initialValues, ...values };
-        setContentInfo(combinedValues);
-    };
-
-    const openSwitchHandler = (enabled: boolean) => {
-        setSwitchOpenAnswStatus(enabled);
-        handleInputChange();
-    }
-
-    const yesNoSwitchHandler = (enabled: boolean) => {
-        setSwitchYesOrNoAnswStatus(enabled);
-        handleInputChange();
-    }
-
-    const handleInputChange = useCallback(() => {
-        // Check if all required fields are filled
-        const allRequiredFieldsFilled = form.getFieldsError().every(fieldError => !fieldError.errors.length);
-
-        if (allRequiredFieldsFilled) {
-            // Add a small delay before submitting the form
-            form.submit();
-        }
-    }, [form]);
-
-    useEffect(() => {
-        props.categoryContentInfo(contentInfo);
-    }, [contentInfo]);
-
-    useEffect(() => {
-        setInitialValues(categorySidebarData?.data?.data);
-    }, [categorySidebarData]);
-
-    useEffect(() => {
-        form.resetFields();
-        form.setFieldsValue(initialValues);
-        setSwitchOpenAnswStatus(initialValues?.openAnswer || false);
-        setSwitchYesOrNoAnswStatus(initialValues?.isYesOrNo || false);
-    }, [form, initialValues]);
-
-    return (
-        <div className={styles.categoryContent}>
-            <div className={styles.title}>{t('components.categoryContent.editCategory')}</div>
-
-            {
-                !categoryContentShow
-                    ? <div className={styles.uncheckedCategory}>
-                        {t('components.categoryContent.message')}
-                    </div>
-
-                    : <>
-                        <Form
-                            initialValues={defaultInitialValues}
-                            name="dynamic_form_nest_item"
-                            onFinish={onFinish}
-                            autoComplete="off"
-                            form={form}
-                        >
-                            <div className={styles.formHeader}>
-                                <div className={styles.categoryNameContainer}>
-                                    <div className={styles.categoryName}>
-                                        <Label isUppercase>
-                                            {t('components.categoryContent.categoryName')}
-                                        </Label>
-                                        <Form.Item
-                                            name={['categoryName']}
-                                            rules={[{ required: true, message: t('components.categoryContent.categoryNameError')! }]}
-                                            validateTrigger="onMouseLeave"
-                                        >
-                                            <InputField
-                                                disabled={categorySidebarData?.data?.key === "0" && hasHeader}
-                                                placeholder={t('components.categoryContent.categoryName')!}
-                                                onMouseLeave={handleInputChange}
-                                            />
-                                        </Form.Item>
-                                    </div>
-
-                                    { categorySidebarData?.data?.key === "0" && hasHeader &&
-                                        <div className={styles.categoryName}>
-                                            <Label isUppercase>
-                                                {t('components.categoryContent.tamplateName')}
-                                            </Label>
-                                            <Form.Item
-                                                name={['name']}
-                                                rules={[{ required: true, message: t('components.categoryContent.templateNameError')! }]}
-                                                validateTrigger="onMouseLeave"
-                                            >
-                                                <InputField
-                                                    placeholder={t('components.categoryContent.tamplateName')!}
-                                                    onMouseLeave={handleInputChange}
-                                                />
-                                            </Form.Item>
-                                        </div>
-                                    }
-                                </div>
-
-                                {categorySidebarData?.data?.children?.length > 0 &&
-                                    <div className={styles.grade}>
-                                        <Label isUppercase>
-                                            {t('components.categoryContent.weighting')}
-                                        </Label>
-                                        <Form.Item
-                                            name={['grade']}
-                                        >
-                                            <InputField placeholder={'EX: 15%'} onMouseLeave={handleInputChange} />
-                                        </Form.Item>
-                                    </div>
-                                }
-
-                                {!categorySidebarData?.data?.children?.length &&
-                                    <>
-                                        {(!switchYesOrNoAnswStatus && !chooseResponseType) &&
-                                            <div className={styles.openAnswer}>
-                                                <Label isUppercase>
-                                                    {t('components.categoryContent.openAnswer')}
-                                                </Label>
-                                                <Form.Item
-                                                    name={['openAnswer']}
-                                                    initialValue={switchOpenAnswStatus}
-                                                >
-                                                    <Switch onChange={(enabled: boolean) => { openSwitchHandler(enabled) }} checked={switchOpenAnswStatus} />
-                                                </Form.Item>
-                                            </div>
-                                        }
-
-                                        {(!switchOpenAnswStatus && !chooseResponseType) &&
-                                            <div className={styles.yesNoAnswer}>
-                                                <Label isUppercase>
-                                                    {t('components.categoryContent.yesNoAnswer')}
-                                                </Label>
-                                                <Form.Item
-                                                    name={['isYesOrNo']}
-                                                    initialValue={switchYesOrNoAnswStatus}
-                                                >
-                                                    <Switch onChange={(enabled: boolean) => { yesNoSwitchHandler(enabled) }} checked={switchYesOrNoAnswStatus} />
-                                                </Form.Item>
-                                            </div>
-                                        }
-
-                                        {
-                                            (!switchOpenAnswStatus && !switchYesOrNoAnswStatus && !chooseResponseType) &&
-                                            <>
-                                                <div className={styles.generalEvaluationLevel}>
-                                                    <Label isUppercase>
-                                                        {t('components.categoryContent.answerOption')}
-                                                    </Label>
-                                                    <Form.Item
-                                                        name={['generalEvaluationLevel']}
-                                                    >
-                                                        < Select
-                                                            options={[
-                                                                {
-                                                                    value: '0',
-                                                                    label: '1 a 5',
-                                                                },
-                                                                {
-                                                                    value: '1',
-                                                                    label: '1 a 4',
-                                                                },
-                                                                {
-                                                                    value: '2',
-                                                                    label: '1 a 5 ou “Não Aplicável”',
-                                                                },
-                                                            ]}
-                                                            onBlur={handleInputChange}
-                                                        />
-                                                    </Form.Item>
-                                                </div>
-
-                                                {!chooseResponseType &&
-                                                    <div className={styles.grade}>
-                                                        <Label isUppercase>
-                                                            {t('components.categoryContent.weighting')}
-                                                        </Label>
-                                                        <Form.Item
-                                                            name={['grade']}
-                                                        >
-                                                            <InputField placeholder={'EX: 15%'} onMouseLeave={handleInputChange} />
-                                                        </Form.Item>
-                                                    </div>
-                                                }
-
-                                            </>
-                                        }
-                                    </>
-                                }
-                            </div>
-
-                            {!categorySidebarData?.data?.children?.length &&
-                                <div className={styles.questionsWrapper}>
-                                    <Label isUppercase>
-                                        {t('components.categoryContent.answers')}
-                                    </Label>
-                                    <Form.Item>
-                                        <Questions
-                                            showGrade={(switchOpenAnswStatus || switchYesOrNoAnswStatus || chooseResponseType) === true ? false : true}
-                                            showCheckbox={chooseResponseType && true}
-                                            handleChanges={handleInputChange}
-                                            responseTypeOptions={responseTypeOptions}
-                                            hasHeader={hasHeader}
-                                            isTheHeader={categorySidebarData?.data?.key === "0" && hasHeader}
-                                            form={form}
-                                        />
-                                    </Form.Item>
-                                </div>
-                            }
-                        </Form>
-                    </>
-            }
-        </div>
-    );
-};