@antscorp/antsomi-ui 1.3.5-beta.52 → 1.3.5-beta.521

package/es/components/organism/AccountProfile/components/AccountSetting/components/LanguageSelector/styles.js

@@ -0,0 +1,22 @@
+import { Select, Typography } from '@antscorp/antsomi-ui/es/components';
+import styled from 'styled-components';
+export const StyledSelect = styled(Select) `
+  .img-lang {
+    width: 21px;
+    height: 15px;
+    margin-right: 10px;
+  }
+  .img-lang-en {
+    background: url('~Assets/images/langs/english.png') no-repeat;
+  }
+  .img-lang-vi {
+    background: url('~Assets/images/langs/vietnam.png') no-repeat;
+  }
+`;
+export const StyledSelectOption = styled(Typography) `
+  display: flex !important;
+  justify-content: flex-start;
+  align-items: center;
+  cursor: pointer;
+  gap: 6px;
+`;

package/es/components/organism/AccountProfile/components/AccountSetting/components/UploadAvatar/index.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+declare const UploadAvatar: {
+    (props: any): React.JSX.Element;
+    defaultProps: {
+        maxFileSize: number;
+        extensions: string[];
+        fileParamName: string;
+    };
+};
+export default UploadAvatar;

package/es/components/organism/AccountProfile/components/AccountSetting/components/UploadAvatar/index.js

@@ -0,0 +1,83 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+// Libraries
+import React from 'react';
+import axios from 'axios';
+// Services
+import { handleError, validateFile } from '../../utils';
+// import { TYPE_FORMAT_DATA } from '../../constants';
+const PATH = 'Src/components/UploadLogo/index.jsx';
+const UploadAvatar = props => {
+    const handleFileSelect = (event) => __awaiter(void 0, void 0, void 0, function* () {
+        try {
+            // Monitor Log
+            //   this.props.monitorLog({
+            //     component: PATH,
+            //     action: 'uploadLogo',
+            //     args: {},
+            //   });
+            const { fileParamName, params = {}, onFileUploading, onFileUploaded, extensions, maxFileSize, dimensions, callbackFileError, iamDomain, authStr, setLoading, } = props;
+            const files = event.target.files || event.dataTransfer.files;
+            if (files && files[0]) {
+                const file = files[0];
+                if (yield validateFile(file, extensions, maxFileSize, dimensions, callbackFileError)) {
+                    const formData = new FormData();
+                    formData.append(fileParamName, file);
+                    //   formData.append('format', TYPE_FORMAT_DATA);
+                    onFileUploading();
+                    setLoading(true);
+                    const uploadFile = axios({
+                        url: `${iamDomain}/api/upload/index${authStr}`,
+                        method: 'post',
+                        data: formData,
+                        headers: { 'Content-Type': 'multipart/form-data' },
+                    });
+                    if (uploadFile) {
+                        uploadFile
+                            .then(res => {
+                            if (res.data && res.data.data) {
+                                onFileUploaded(Object.assign(Object.assign({}, res.data.data), { error: {} }));
+                            }
+                        })
+                            .finally(() => setLoading(false));
+                    }
+                    else {
+                        onFileUploaded({
+                            error: {
+                                uploadFailedMessage: 'Upload failed',
+                                sizeErrorMessage: '',
+                                extErrorMessage: '',
+                            },
+                        });
+                    }
+                }
+                // else {
+                //   onFileUploaded({
+                //     error: this.error,
+                //   });
+                // }
+            }
+        }
+        catch (error) {
+            handleError(error, {
+                component: PATH,
+                action: 'handleFileSelect',
+                args: {},
+            });
+        }
+    });
+    return React.createElement("input", { type: "file", id: "fileInput", name: "fileInput", onChange: handleFileSelect });
+};
+UploadAvatar.defaultProps = {
+    maxFileSize: 100,
+    extensions: ['jpg', 'png'],
+    fileParamName: 'image',
+};
+export default UploadAvatar;

package/es/components/organism/AccountProfile/components/AccountSetting/constants.d.ts

@@ -0,0 +1,126 @@
+import type { TForm } from './types';
+export declare const editSelections: {
+    name: string;
+    label: string;
+    className: string;
+    acceptableStatus: string[];
+}[];
+export declare const fieldsUI: {
+    user_id: {
+        fieldName: string;
+        fieldLabel: string;
+        allowNull: boolean;
+        fontBold: boolean;
+        isUpdate: boolean;
+        position: number[];
+    };
+    email: {
+        fieldName: string;
+        fieldLabel: string;
+        validate: string[];
+        verify: boolean;
+        messageVerify: string;
+        fontBold: boolean;
+        position: number[];
+        autoComplete: string;
+    };
+    password: {
+        fieldName: string;
+        fieldLabel: string;
+        fieldType: string;
+        minLength: number;
+        fontBold: boolean;
+        type: string;
+        position: number[];
+        autoComplete: string;
+    };
+    gender: {
+        fieldName: string;
+        fieldLabel: string;
+        fieldType: string;
+        fontBold: boolean;
+        arrRadios: {
+            value: number;
+            label: string;
+        }[];
+        isEditable: boolean;
+        position: number[];
+    };
+    birthday: {
+        fieldName: string;
+        fieldLabel: string;
+        fieldType: string;
+        fontBold: boolean;
+        isEditable: boolean;
+        allowNull: boolean;
+        position: number[];
+    };
+    phone: {
+        fieldName: string;
+        fieldLabel: string;
+        fontBold: boolean;
+        type: string;
+        minLength: number;
+        allowNull: boolean;
+        position: number[];
+    };
+    address: {
+        fieldName: string;
+        fieldLabel: string;
+        maxLength: number;
+        fontBold: boolean;
+        allowNull: boolean;
+        position: number[];
+    };
+    account_type: {
+        fieldName: string;
+        fieldLabel: string;
+        fieldType: string;
+        fontBold: boolean;
+        arrRadios: {
+            value: number;
+            label: string;
+        }[];
+        position: number[];
+        isUpdate: boolean;
+    };
+    language: {
+        fieldName: string;
+        fieldLabel: string;
+        fieldType: string;
+        fontBold: boolean;
+        options: {
+            value: string;
+            label: string;
+            icon: string;
+        }[];
+        position: number[];
+    };
+};
+export declare const initialForm: TForm;
+export declare const defaultVals: {
+    gender: number;
+    account_type: number;
+    language: string;
+};
+export declare const allowChangeFields: string[];
+export declare const VALUE_MAPPING: {
+    account_type: {
+        1: string;
+        2: string;
+    };
+    language: {
+        en: string;
+        vi: string;
+    };
+    gender: {
+        1: string;
+        2: string;
+    };
+};
+export declare const FILE_UPLOAD_ERROR: {
+    INVALID_FILE_TYPE: string;
+    INVALID_FILE_SIZE: string;
+    INVALID_FILE_DIMENSION: string;
+};
+export declare const ST_URL_UPLOAD_PLATFORM = "//st-platform.ants.tech/";

package/es/components/organism/AccountProfile/components/AccountSetting/constants.js

@@ -0,0 +1,179 @@
+export const editSelections = [
+    {
+        name: 'enable',
+        label: 'Enable',
+        className: 'confirm',
+        acceptableStatus: ['Deactive'],
+    },
+    {
+        name: 'pause',
+        label: 'Pause',
+        className: 'done',
+        acceptableStatus: ['Active'],
+    },
+];
+export const fieldsUI = {
+    user_id: {
+        fieldName: 'user_id',
+        fieldLabel: 'ID',
+        allowNull: true,
+        fontBold: false,
+        isUpdate: false,
+        position: [1, 0],
+    },
+    email: {
+        fieldName: 'email',
+        fieldLabel: 'Email',
+        // checkUnique: {
+        //   // service: AccountInfoService.getList,
+        //   params: {
+        //     type: 'check-email-network',
+        //   },
+        //   mapping: 'email',
+        // },
+        validate: ['email'],
+        verify: true,
+        messageVerify: 'Request verify email',
+        fontBold: false,
+        position: [2, 1],
+        autoComplete: 'off',
+    },
+    password: {
+        fieldName: 'password',
+        fieldLabel: 'Password',
+        fieldType: 'password',
+        minLength: 8,
+        fontBold: false,
+        type: 'password',
+        position: [2, 2],
+        autoComplete: 'new-password',
+    },
+    // full_name: {
+    //   fieldName: 'full_name',
+    //   fieldLabel: 'Full Name',
+    //   maxLength: 125,
+    //   fontBold: false,
+    //   position: [2, 3],
+    // },
+    gender: {
+        fieldName: 'gender',
+        fieldLabel: 'Gender',
+        fieldType: 'radio',
+        fontBold: false,
+        arrRadios: [
+            {
+                value: 1,
+                label: 'Male',
+            },
+            {
+                value: 2,
+                label: 'Female',
+            },
+        ],
+        isEditable: true,
+        position: [2, 4],
+    },
+    birthday: {
+        fieldName: 'birthday',
+        fieldLabel: 'Birthday',
+        fieldType: 'date',
+        fontBold: false,
+        isEditable: true,
+        allowNull: true,
+        position: [1, 1],
+    },
+    phone: {
+        fieldName: 'phone',
+        fieldLabel: 'Phone',
+        fontBold: false,
+        type: 'number',
+        minLength: 9,
+        allowNull: true,
+        position: [1, 2],
+    },
+    address: {
+        fieldName: 'address',
+        fieldLabel: 'Address',
+        maxLength: 255,
+        fontBold: false,
+        allowNull: true,
+        position: [1, 3],
+    },
+    account_type: {
+        fieldName: 'account_type',
+        fieldLabel: 'Account type',
+        fieldType: 'radio',
+        fontBold: false,
+        arrRadios: [
+            {
+                value: 1,
+                label: 'Account',
+            },
+            {
+                value: 2,
+                label: 'Manager Account',
+            },
+        ],
+        position: [3, 1],
+        isUpdate: false,
+    },
+    language: {
+        fieldName: 'language',
+        fieldLabel: 'Language',
+        fieldType: 'lang',
+        fontBold: false,
+        options: [
+            {
+                value: 'en',
+                label: 'English',
+                icon: 'img-lang-en',
+            },
+            {
+                value: 'vi',
+                label: 'Vietnamese',
+                icon: 'img-lang-vi',
+            },
+        ],
+        position: [4, 1],
+    },
+};
+export const initialForm = {
+    user_id: '',
+    full_name: '',
+    gender: 1,
+    birthday: '',
+    address: '',
+    phone: '',
+    email: '',
+    password: '',
+    account_type: 1,
+    language: 'en',
+    initDone: false,
+    validateEmail: false,
+};
+export const defaultVals = {
+    gender: 1,
+    account_type: 1,
+    language: 'en',
+};
+export const allowChangeFields = ['email', 'account_type', 'language'];
+export const VALUE_MAPPING = {
+    account_type: {
+        1: 'Account',
+        2: 'Manager Account',
+    },
+    language: {
+        en: 'English',
+        vi: 'Vietnamese',
+    },
+    gender: {
+        1: 'Male',
+        2: 'Female',
+    },
+};
+export const FILE_UPLOAD_ERROR = {
+    INVALID_FILE_TYPE: 'INVALID_FILE_TYPE',
+    INVALID_FILE_SIZE: 'INVALID_FILE_SIZE',
+    INVALID_FILE_DIMENSION: 'INVALID_FILE_DIMENSION',
+};
+export const ST_URL_UPLOAD_PLATFORM = '//st-platform.ants.tech/';

package/es/components/organism/AccountProfile/components/AccountSetting/index.d.ts

@@ -0,0 +1 @@
+export { AccountSetting, type AccountSettingProps } from './AccountSetting';

package/es/components/organism/AccountProfile/components/AccountSetting/index.js

@@ -0,0 +1 @@
+export { AccountSetting } from './AccountSetting';

package/es/components/organism/AccountProfile/components/AccountSetting/styled.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export declare const AccountDetail: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DrawerHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledRadioGroup: import("styled-components").StyledComponent<import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("antd").RadioGroupProps & import("react").RefAttributes<HTMLDivElement>>>, any, {}, never>;
+export declare const StyledDatePicker: import("styled-components").StyledComponent<import("../../../../molecules/DatePicker/DatePicker").TDatePicker, any, {}, never>;
+export declare const StyledCheckbox: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").CheckboxProps & import("react").RefAttributes<import("rc-checkbox").CheckboxRef>> & {
+    Group: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("antd/es/checkbox").CheckboxGroupProps & import("react").RefAttributes<HTMLDivElement>>>;
+}, any, {}, never>;