Untitled

 avatar
unknown
plain_text
a year ago
12 kB
4
Indexable
export const convertNotificationText = (notification: any) => {
    let urlRedirect = checkPath('/project-manager/orders') ? '/orders/project' : '/project/detail'
    switch (notification?.action) {
        case "CREATE":
            return <Link
                to={`/project-manager${urlRedirect}/${slug(notification?.value?.project?.name)}/${notification?.value?.projectId}?tab=milestones${projectStore.subBreadCrumb ? `&redirect=${projectStore.subBreadCrumb}` : ''}${notification?.objectName === 'TASK' ? `&milestoneId=${notification?.value?.milestoneId}&taskId=${notification?.value?.id}` : ''}`}
                className='history_project__item--content'>
                <div className='history_project__item--info'>
                    <span className='history_project__item--name me-2'>{notification?.performedBy?.name}</span>
                    <span
                        className='history_project__item--text me-1'>{convertNameActivity(notification?.action)}</span>
                    <span
                        className='history_project__item--text me-1'>{convertObjectNameActivity(notification?.objectName)}</span>
                    {convertCreateTaskName(notification?.objectName, notification?.value)}
                </div>
                <div className='history_project__item--time'>
                    <span>{dateUtils.convertTimeLog(notification?.createdAt)}</span>
                </div>
            </Link>
        case "CHANGE_STATE":
            return <Link
                to={`/project-manager${urlRedirect}/${slug(notification?.value?.project?.name)}/${notification?.value?.projectId}?tab=milestones${projectStore.subBreadCrumb ? `&redirect=${projectStore.subBreadCrumb}` : ''}${notification?.objectName === 'TASK' ? `&milestoneId=${notification?.value?.milestoneId}&taskId=${notification?.value?.id}` : ''}`}
                className='history_project__item--content'>
                <div className='history_project__item--info'>
                    <span className='history_project__item--name me-2'>{notification?.performedBy?.name}</span>
                    <span
                        className='history_project__item--text me-1'>{convertNameActivity(notification?.action)}</span>
                    <span
                        className='history_project__item--text me-1'>{convertObjectNameActivity(notification?.objectName)}</span>
                    {convertContentChangeState(notification?.objectName, notification?.preValue, notification?.value)}
                </div>
                <div className='history_project__item--time'>
                    <span>{dateUtils.convertTimeLog(notification?.createdAt)}</span>
                </div>
            </Link>
        case "DELETE":
            return <Link
                to={`/project-manager${urlRedirect}/${slug(notification?.value?.project?.name)}/${notification?.value?.projectId}?tab=milestones${projectStore.subBreadCrumb ? `&redirect=${projectStore.subBreadCrumb}` : ''}${notification?.objectName === 'TASK' ? `&milestoneId=${notification?.value?.milestoneId}&taskId=${notification?.value?.id}` : ''}`}
                className='history_project__item--content'>
                <div className='history_project__item--info'>
                    <span className='history_project__item--name me-2'>{notification?.performedBy?.name}</span>
                    <span
                        className='history_project__item--text me-1'>{convertNameActivity(notification?.action)}</span>
                    <span
                        className='history_project__item--text me-1'>{convertObjectNameActivity(notification?.objectName)}</span>
                    {convertCreateTaskName(notification?.objectName, notification?.value)}
                </div>
                <div className='history_project__item--time'>
                    <span>{dateUtils.convertTimeLog(notification?.createdAt)}</span>
                </div>
            </Link>
        case "UPDATE":
            return <Link
                to={`/project-manager${urlRedirect}/${slug(notification?.value?.project?.name)}/${notification?.value?.projectId}?tab=milestones${projectStore.subBreadCrumb ? `&redirect=${projectStore.subBreadCrumb}` : ''}${notification?.objectName === 'TASK' ? `&milestoneId=${notification?.value?.milestoneId}&taskId=${notification?.value?.id}` : ''}`}
                className='history_project__item--content'>
                <div className='history_project__item--info'>
                    <span className='history_project__item--name me-2'>{notification?.performedBy?.name}</span>
                    <span
                        className='history_project__item--text me-1'>{convertNameActivity(notification?.action)}</span>
                    <span
                        className='history_project__item--text me-1'>{convertObjectNameActivity(notification?.objectName)}</span>
                    {convertCreateTaskName(notification?.objectName, notification?.value)}
                </div>
                <div className='history_project__item--time'>
                    <span>{dateUtils.convertTimeLog(notification?.createdAt)}</span>
                </div>
            </Link>
        default:
            return null;
    }
};
export const convertNameActivity = (value: string) => {
    switch (value) {
        case "CHANGE_STATE":
            return 'chuyển trạng thái của'
        case "CREATE":
            return 'tạo mới'
        case "DELETE":
            return 'xóa'
        case "DETAIL":
            return 'chi tiết'
        case "FILTER":
            return 'lọc'
        case "UPDATE":
            return 'cập nhật thông tin'
        default:
            return null;
    }
};

export const convertObjectNameActivity = (value: string) => {
    switch (value) {
        case "TASK":
            return 'công việc'
        case "MILESTONE":
            return 'giai đoạn'
        default:
            return null;
    }
};

export const convertCreateTaskName = (type: any, taskValue: any) => {
    const convertLevelTask = (value: any) => {
        switch (value) {
            case 'URGENT':
                return (
                    <img width={12} className='me-1' src="/assets/ico/level_task/URGENT.svg" alt=""/>
                );
            case 'HIGH':
                return (
                    <img  width={12} className='me-1' src="/assets/ico/level_task/HIGH.svg" alt=""/>
                );
            case 'NORMAL' :
                return (
                    <img  width={12} className='me-1' src="/assets/ico/level_task/NORMAL.svg" alt=""/>
                );
            case 'LOW' :
                return (
                    <img  width={12} className='me-1' src="/assets/ico/level_task/LOW.svg" alt=""/>
                );
            default:
                return null;
        }
    };
    const convertColorLevelTask = (value: any) => {
        switch (value) {
            case 'URGENT':
                return {
                    color: 'rgba(255, 66, 79)',
                    backgroundColor: 'rgba(255, 66, 79, 0.1)'
                };

            case 'HIGH':
                return {
                    color: 'rgba(255, 165, 0)',
                    backgroundColor: 'rgba(255, 165, 0, 0.1)'
                };

            case 'NORMAL' :
                return {
                    color: 'rgba(0, 106, 166)',
                    backgroundColor: 'rgba(0, 106, 166, 0.1)'
                };
            case 'LOW' :
                return {
                    color: 'rgba(143, 143, 143)',
                    backgroundColor: 'rgba(143, 143, 143, 0.1)'
                };
            default:
                return null;
        }
    };
    switch (type) {
        case "TASK":
            return <div className='d-flex align-items-center flex-wrap'>
                        <span className='me-1' style={
                            {
                                ...convertColorLevelTask(taskValue?.priority),
                                fontSize: '14px',
                                padding: '2px 6px',
                                borderRadius: '4px',
                                display: 'flex',
                                alignItems: 'center',
                                width: 'auto'
                            }}
                        >
                            {convertLevelTask(taskValue?.priority)}
                            {taskValue?.name}
                        </span>
                <span className='history_project__item--text'>
                                    bên trong giai đoạn
                        </span>
                <span style={{
                    fontSize: '14px',
                    whiteSpace: 'nowrap',
                    padding: '2px 6px',
                    fontWeight: '500',
                }}>{taskValue?.milestone?.name}</span>
            </div>
        case "MILESTONE":
            return <div className='d-flex align-items-center flex-wrap'>
                        <span style={{
                            fontSize: '14px',
                            padding: '2px 6px',
                            fontWeight: '500',
                        }}>{taskValue?.name}</span>
            </div>
        default:
            return null;
    }

};

export const convertContentChangeState = (type: string, preValue: any, value: any) => {
    switch (type) {
        case "TASK":
            return convertTaskName(preValue, value)
        case "MILESTONE":
            return convertMilestoneName(preValue, value)
        default:
            return null;
    }
};

export const convertTaskName = (preValue: any, value: any) => {
    return <div className='d-flex align-items-center'>
        <span style={{fontSize: '14px'}} className='fw-500 mx-1'>{preValue?.name}</span>
        <span className='history_project__item--text me-1'>từ</span>
        <span style={{
            whiteSpace: 'nowrap',
            color: preValue?.state?.color,
            padding: '2px 6px',
            borderRadius: '4px',
            fontSize: '14px',
            backgroundColor: hexToRGBA(preValue?.state?.color, 0.15) ?? '#ebeeef'
        }}
        >
            {
                preValue?.state?.name
            }
        </span>
        <span className='history_project__item--text mx-1'>sang</span>
        <span style={{
            whiteSpace: 'nowrap',
            color: value?.state?.color,
            padding: '2px 6px',
            borderRadius: '4px',
            fontSize: '14px',
            backgroundColor: hexToRGBA(value?.state?.color, 0.15) ?? '#ebeeef'
        }}
        >
            {
                value?.state?.name
            }
        </span>
    </div>
};
export const convertMilestoneName = (preValue: any, value: any) => {
    return <div className='d-flex align-items-center'>
        <span style={{fontSize: '14px'}} className='fw-500 mx-1'>{preValue?.name}</span>
        <span className='history_project__item--text ms-1'>từ</span>
        <span style={
            {
                fontSize: '14px',
                whiteSpace: 'nowrap',
                padding: '2px 6px',
                borderRadius: '4px',
                display: 'flex',
                alignItems: 'center',
                width: 'auto'
            }}
        >
            {
                convertStatusMilestone(preValue?.state)
            }
        </span>
        <span className='history_project__item--text'>sang</span>
        <span style={
            {
                fontSize: '14px',
                whiteSpace: 'nowrap',
                padding: '2px 6px',
                borderRadius: '4px',
                display: 'flex',
                alignItems: 'center',
                width: 'auto'
            }}
        >
            {
                convertStatusMilestone(value?.state)
            }
        </span>
    </div>
};
Editor is loading...
Leave a Comment