aq-fe-framework 0.1.156 → 0.1.157

package/dist/components/Buttons/ButtonPrintPDFTable/MyButtonPrintTablePDF.tsx

@@ -1,174 +0,0 @@
-import { MyHtmlWrapper } from "@/components/Layouts/HtmlWrapper/MyHtmlWrapper";
-import { Box, Table } from "@mantine/core";
-import { MRT_RowData } from "mantine-react-table";
-import { MyButtonPrintPDF } from "../ButtonPrintPDF/MyButtonPrintPDF";
-interface FieldConfig {
-  fieldName: string; // Field name in the data
-  header: string; // Header name for the print
-  isCenter?: boolean; // Optional flag to center align content, default is true
-  formatFunction?: (value: any, row: any) => any; // Optional formatting function
-}
-
-interface PrintConfig {
-  fields: FieldConfig[]; // Array of field configurations
-  title?: string; // Optional title for the printed table
-  showRowNumbers?: boolean; // Optional flag to show row numbers
-}
-
-interface AQButtonPrintTableProps<TData extends MRT_RowData = any> extends React.ComponentPropsWithoutRef<typeof MyButtonPrintPDF> {
-  printConfig?: PrintConfig; // Optional print configuration
-  objectName?: string; // Name of the file to print
-  data?: TData[]; // Data to print
-}
-
-export function MyButtonPrintTablePDF<TData extends MRT_RowData = any>({
-  printConfig,
-  data,
-  ...rest
-}: AQButtonPrintTableProps<TData>) {
-  const formatDate = (date: Date): string => {
-    const day = String(date.getDate()).padStart(2, '0');
-    const month = String(date.getMonth() + 1).padStart(2, '0');
-    const year = date.getFullYear();
-    return `${day}/${month}/${year}`;
-  };
-
-  // Hàm format giá trị theo kiểu dữ liệu
-  const formatValue = (value: any): string => {
-    if (value === undefined || value === null) {
-      return '';
-    }
-
-    // Xử lý định dạng ngày tháng
-    if (value instanceof Date) {
-      return formatDate(value);
-    }
-
-    // Xử lý các kiểu dữ liệu khác
-    return String(value);
-  };
-
-  const rows = data?.map((item, index) => {
-    if (!printConfig?.fields) return null;
-
-    return (
-      <Table.Tr key={index}>
-        {printConfig.showRowNumbers && (
-          <Table.Td ta="center" px="xs" style={{ border: "1px solid lightgray" }}>
-            {index + 1}
-          </Table.Td>
-        )}
-        {printConfig.fields.map((field) => {
-          let value = item[field.fieldName];
-
-          if (field.formatFunction) {
-            value = field.formatFunction(value, item);
-          } else {
-            value = formatValue(value);
-          }
-
-          const alignment = field.isCenter === false ? "left" : "center";
-
-          // Xử lý giá trị HTML
-          if (typeof value === 'string' && (value.includes('<') || value.includes('&lt;'))) {
-            return (
-              <Table.Td
-                key={field.fieldName}
-                px="xs"
-                ta={alignment}
-                style={{ border: "1px solid lightgray" }}
-              >
-                <MyHtmlWrapper html={value} />
-              </Table.Td>
-            );
-          }
-
-          // Xử lý giá trị boolean
-          if (value === 'true' || value === 'false') {
-            return (
-              <Table.Td
-                key={field.fieldName}
-                ta={alignment}
-                px="xs"
-                style={{ border: "1px solid lightgray" }}
-              >
-                <input type="checkbox" checked={value === 'true'} readOnly />
-              </Table.Td>
-            );
-          }
-
-          return (
-            <Table.Td
-              key={field.fieldName}
-              ta={alignment}
-              px="xs"
-              style={{ border: "1px solid lightgray" }}
-            >
-              {value}
-            </Table.Td>
-          );
-        })}
-      </Table.Tr>
-    );
-  });
-
-  const renderContent = () => {
-    if (!data || !printConfig?.fields) return null;
-
-    const today = new Date();
-    const formattedDate = today.toLocaleDateString('vi-VN', {
-      year: 'numeric',
-      month: 'long',
-      day: 'numeric',
-      hour: '2-digit',
-      minute: '2-digit'
-    });
-
-    const tableTitle = printConfig?.title || "Bảng dữ liệu";
-
-    return (
-      <Box p="lg" >
-        <div style={{ textAlign: 'center', marginTop: '10px', fontStyle: 'italic', color: '#666' }}>
-          Ngày in: {formattedDate}
-        </div>
-        <h2 style={{ textAlign: 'center', fontSize: '24px', fontWeight: 'bold', marginBottom: '20px' }}>
-          {tableTitle}
-        </h2>
-        <Table withColumnBorders highlightOnHover style={{ border: "1px solid lightgray" }}>
-          <Table.Thead>
-            <Table.Tr>
-              {printConfig.showRowNumbers && (
-                <Table.Th style={{ border: "1px solid lightgray" }} w="10%" ta="center" px="xs">
-                  STT
-                </Table.Th>
-              )}
-              {printConfig.fields.map((field) => {
-                const alignment = field.isCenter === false ? "left" : "center";
-                return (
-                  <Table.Th
-                    key={field.fieldName}
-                    style={{ border: "1px solid lightgray" }}
-                    ta={alignment}
-                    px="xs"
-                  >
-                    {field.header}
-                  </Table.Th>
-                );
-              })}
-            </Table.Tr>
-          </Table.Thead>
-          <Table.Tbody>
-            {rows}
-          </Table.Tbody>
-        </Table>
-      </Box>
-    );
-  };
-  return (
-    <MyButtonPrintPDF
-      contentToPrint={renderContent()}
-      {...rest}
-    />
-  );
-}
-

package/dist/components/Buttons/ButtonRouterBack/MyButtonRouterBack.tsx

@@ -1,29 +0,0 @@
-"use client";
-import { Button, ButtonProps } from "@mantine/core";
-import { IconArrowBack } from "@tabler/icons-react";
-import { useRouter } from "next/navigation";
-
-interface IMyButtonRouterBack extends ButtonProps {
-    url?: string;
-    label?: string;
-}
-
-export function MyButtonRouterBack({ url, label, ...rest }: IMyButtonRouterBack) {
-    const router = useRouter();
-    return (
-        <Button
-            variant="light"
-            leftSection={<IconArrowBack stroke={2} />}
-            onClick={() => {
-                if (url) {
-                    router.replace(url);
-                    return;
-                }
-                router.back();
-            }}
-            {...rest}
-        >
-            {label ? label : "Trở về"}
-        </Button>
-    );
-}

package/dist/components/Buttons/ButtonViewPDF/MyButtonViewPDF.tsx

@@ -1,121 +0,0 @@
-"use client";
-import baseAxios from "@/api/baseAxios";
-import {
-    ActionIcon,
-    Button,
-    Group,
-    LoadingOverlay,
-    Modal,
-    Paper,
-    Text,
-    Tooltip,
-} from "@mantine/core";
-import { useDisclosure } from "@mantine/hooks";
-import { IconLivePhoto, IconMaximize, IconMinimize } from "@tabler/icons-react";
-import { useQuery } from "@tanstack/react-query";
-import { useState } from "react";
-interface IMyButtonViewPDF {
-    modalSize?: string;
-    label?: string;
-    id?: number;
-    src?: string;
-    isActionIcon?: boolean;
-    filePath?: string
-}
-export function MyButtonViewPDF({
-    id,
-    modalSize = "80%",
-    label = "Xem file",
-    src = "https://datafiles.chinhphu.vn/cpp/files/vbpq/2016/07/85.signed.pdf",
-    isActionIcon = false,
-    filePath
-}: IMyButtonViewPDF) {
-    const disc = useDisclosure(false);
-    const fullScreen = useState(false);
-    const hSize = useState("80vh");
-    const query = useQuery({
-        queryKey: ["MyButtonViewPDF", id, filePath],
-        queryFn: async () => {
-            if (filePath) {
-                const res = await baseAxios.get("/AQ/GetFile?filePath=" + filePath);
-                return res.data.data;
-            }
-
-            const res = await baseAxios.get("/Document/Get?id=" + id);
-            return res.data.data;
-        },
-        enabled: disc[0] == true,
-    });
-    return (
-        <>
-            <Tooltip label="Xem tài liệu trực tiếp">
-                {isActionIcon ? (
-                    <ActionIcon
-                        onClick={() => {
-                            disc[1].open();
-                        }}
-                    >
-                        <IconLivePhoto />
-                    </ActionIcon>
-                ) : (
-                    <Button
-                        color="cyan"
-                        onClick={() => {
-                            disc[1].open();
-                        }}
-                        leftSection={<IconLivePhoto />}
-                    >
-                        {label}
-                    </Button>
-                )}
-            </Tooltip>
-            <Modal
-                fullScreen={fullScreen[0]}
-                opened={disc[0]}
-                onClose={disc[1].close}
-                size={modalSize}
-                title={
-                    <Group>
-                        <Text>Xem tài liệu trực tiếp</Text>
-                        {fullScreen[0] ? (
-                            <ActionIcon
-                                onClick={() => {
-                                    fullScreen[1](false);
-                                    hSize[1]("80vh");
-                                }}
-                            >
-                                <IconMinimize />
-                            </ActionIcon>
-                        ) : (
-                            <ActionIcon
-                                onClick={() => {
-                                    fullScreen[1](true);
-                                    hSize[1]("90vh");
-                                }}
-                            >
-                                <IconMaximize />
-                            </ActionIcon>
-                        )}
-                    </Group>
-                }
-            >
-                <Paper h={hSize[0]} p={"lg"} pos={"relative"}>
-                    <LoadingOverlay
-                        visible={query.isLoading}
-                        zIndex={1000}
-                        overlayProps={{ radius: "sm", blur: 2 }}
-                    />
-                    {query.data ? (
-                        <iframe
-                            src={`data:application/pdf;base64, ${filePath ? query.data?.fileBase64String : query.data?.fileDetail?.fileBase64String}`}
-                            width={"100%"}
-                            height={"100%"}
-                        />
-                    ) : (
-                        <iframe src={src} width={"100%"} height={"100%"} />
-                    )}
-                </Paper>
-            </Modal>
-        </>
-    );
-}

package/dist/components/Calendar/MyCalendar.tsx

@@ -1,118 +0,0 @@
-import {
-    createViewDay,
-    createViewMonthAgenda,
-    createViewMonthGrid,
-    createViewWeek
-} from '@schedule-x/calendar';
-import { createEventModalPlugin } from '@schedule-x/event-modal';
-import { createEventsServicePlugin } from '@schedule-x/events-service';
-import { ScheduleXCalendar, useNextCalendarApp } from '@schedule-x/react';
-
-import { Paper, Text } from '@mantine/core';
-import '@schedule-x/theme-default/dist/index.css';
-import { useEffect } from "react";
-import { MyFlexColumn } from '../Layouts/FlexColumn/MyFlexColumn';
-
-export function MyCalendar() {
-    const plugins = [createEventsServicePlugin(), createEventModalPlugin()]
-
-    const calendar = useNextCalendarApp({
-        locale: "vi-VN",
-        dayBoundaries: {
-            start: '05:00',
-            end: '21:00',
-        },
-        weekOptions: {
-            gridHeight: 700
-        },
-        views: [createViewDay(), createViewWeek(), createViewMonthGrid(), createViewMonthAgenda()],
-        events: [
-            {
-                id: '1',
-                giangvien: 'TDMU048- Bùi Đức Anh',
-                title: 'Tin học căn bản',
-                people: ['Sức chứa: 30'],
-                location: 'Phòng: B103',
-                start: '2024-12-17 06:00',
-                end: '2024-12-17 08:00',
-                laLichThi: false,
-                description: 'Giảng viên: TDMU048- Bùi Đức Anh',
-            },
-            {
-                id: '2',
-                giangvien: 'CNTT030- Nguyễn Thế Bảo',
-                title: 'Tin học căn bản',
-                people: ['Sức chứa: 30'],
-                location: 'Phòng: B103',
-                start: '2024-12-18 06:00',
-                end: '2024-12-18 08:00',
-                laLichThi: false,
-                description: 'Giảng viên: CNTT030- Nguyễn Thế Bảo',
-            },
-            {
-                id: 3,
-                giangvien: 'CNTT026- Võ Thị Diễm Hương',
-                title: 'Tin học căn bản',
-                people: ['Sức chứa: 30'],
-                location: 'Phòng: B103',
-                start: '2024-12-19 06:00',
-                end: '2024-12-19 08:00',
-                laLichThi: false,
-                description: "Giảng viên:  CNTT026- Võ Thị Diễm Hương"
-            },
-            {
-                id: 4,
-                giangvien: 'KHNN065- Nguyễn Xuân Tiến',
-                title: 'Tin học căn bản',
-                people: ['Sức chứa: 30'],
-                location: 'Phòng: B102',
-                start: '2024-12-20 06:00',
-                end: '2024-12-20 08:00',
-                laLichThi: false,
-                description: "Giảng viên: KHNN065- Nguyễn Xuân Tiến"
-            },
-            {
-                id: 5,
-                // giangvien: 'KHNN065- Nguyễn Xuân Tiến',
-                title: 'Tiếng anh thương mại',
-                people: ['Sức chứa: 30'],
-                location: 'Phòng: B102',
-                start: '2024-12-16 14:00',
-                end: '2024-12-16 16:00',
-                laLichThi: true,
-                // description: "Giảng viên: KHNN065- Nguyễn Xuân Tiến"
-            },
-        ],
-    }, plugins)
-
-    useEffect(() => {
-        // get all events
-        calendar?.events.getAll()
-    }, [])
-
-    return (
-        <div>
-            <ScheduleXCalendar calendarApp={calendar} customComponents={{
-                timeGridEvent: ({ calendarEvent }) => {
-                    console.log(calendarEvent);
-                    return (
-                        <Paper h={'100%'} bg={calendarEvent.laLichThi ? 'violet.2' : "blue.2"} p={4}>
-                            <MyFlexColumn gap={1}>
-                                <Text size='sm' fw={'bold'}>{calendarEvent.laLichThi ? "(Thi) " : "(Học) "}{calendarEvent.title}</Text>
-                                {calendarEvent.laLichThi == false && <Text size='sm'>{calendarEvent.giangvien}</Text>}
-                                <Text size='sm'>{calendarEvent.location}</Text>
-                            </MyFlexColumn>
-                        </Paper>
-                    )
-                },
-                // eventModal: ({ calendarEvent }) => {
-                //     return (
-                //         <Paper bg={'red'} style={{ position: 'relative', overflow: "hidden" }}>
-                //             âs
-                //         </Paper>
-                //     )
-                // }
-            }} />
-        </div>
-    )
-}

package/dist/components/CenterFull/MyCenterFull.tsx

@@ -1,10 +0,0 @@
-import { Center, Group } from "@mantine/core";
-import { ReactNode } from "react";
-
-export function MyCenterFull({ children }: { children: ReactNode }) {
-    return (
-        <Center w={"100%"}>
-            <Group>{children}</Group>
-        </Center>
-    );
-}

package/dist/components/Checkbox/MyCheckbox.tsx

@@ -1,9 +0,0 @@
-import { Checkbox, CheckboxProps } from "@mantine/core";
-
-interface I extends CheckboxProps { }
-
-export function MyCheckbox({ ...rest }: I) {
-    return (
-        <Checkbox {...rest}></Checkbox>
-    )
-}

package/dist/components/Combobox/Select/MySelect.tsx

@@ -1,12 +0,0 @@
-import { Select, SelectProps } from '@mantine/core';
-
-interface IMySelect extends SelectProps {
-    label?: string;
-    data: Array<string | { value: string; label: string }>; // Thêm `data` là mảng các lựa chọn
-}
-
-export function MySelect({ label, ...rest }: IMySelect) {
-    return (
-        <Select label={label} placeholder={label ? `Chọn ${label?.toLowerCase()}` : ""} {...rest} />
-    )
-}

package/dist/components/DataDisplay/Card/AQCard.tsx

@@ -1,49 +0,0 @@
-import { MyFlexRow } from '@/components/Layouts/FlexRow/MyFlexRow';
-import { Badge, Card, Center, Image, Text } from '@mantine/core';
-import Link from 'next/link';
-import { ReactNode } from 'react';
-export interface IAQCardProps {
-    imgSrc?: string | null,
-    title?: string
-    description?: string,
-    children?: ReactNode,
-    date?: string
-    status?: string,
-    href?: string
-}
-
-export function AQCard({
-    imgSrc = "https://raw.githubusercontent.com/mantinedev/mantine/master/.demo/images/bg-8.png",
-    title,
-    description,
-    date,
-    children,
-    status,
-    href = ""
-}: IAQCardProps) {
-    return (
-        <Card shadow="sm" padding="lg" radius="md" withBorder component={Link} href={href}>
-            <Card.Section >
-                <Center>
-                    <Image
-                        src={imgSrc}
-                        h={200}
-                        w="auto"
-                        fallbackSrc="https://placehold.co/600x400?text=Placeholder"
-                        alt="Norway"
-                    />
-                </Center>
-            </Card.Section>
-
-            <MyFlexRow justify="space-between" mt="md" mb="xs">
-                <Text fw={500} >{title}</Text>
-                {status && <Badge color='violet.5' w={'150px'}>{status}</Badge>}
-            </MyFlexRow>
-
-            <Text size="sm" c="dimmed" lineClamp={2}>
-                {description}
-            </Text>
-            {children}
-        </Card>
-    );
-}

package/dist/components/DataDisplay/CardInformation/MyCardInformation.tsx

@@ -1,77 +0,0 @@
-import { Box, Button, Flex, Group, Paper, Text } from "@mantine/core";
-import { IconArrowDownRight, IconArrowUpRight } from "@tabler/icons-react";
-import { ReactNode } from "react";
-
-interface MyCardInformationProps {
-    title?: string,
-    value?: string,
-    unit?: string,
-    description?: string,
-    icon?: ReactNode,
-    diff?: number,
-    extraControl?: ReactNode
-}
-
-export function MyCardInformation({
-    title,
-    value,
-    unit = "",
-    description,
-    icon,
-    diff = 0,
-    extraControl
-}: MyCardInformationProps) {
-    return (
-        <Paper withBorder
-            p="md"
-            radius="md"
-            key={title}>
-            <Group justify="space-between">
-                <Flex direction={"column"}>
-                    <Text
-                        tt="uppercase"
-                        size="lg"
-                        c="dimmed"
-                    >
-                        {title}
-                    </Text>
-                    {unit == "" ?
-                        <Text size="xs" style={{ visibility: 'hidden' }}>Đơn vị: <strong>{unit}</strong></Text>
-                        :
-                        <Text size="xs">Đơn vị: <strong>{unit}</strong></Text>
-                    }
-                </Flex>
-                <Box>
-                    {icon}
-                </Box>
-            </Group>
-
-            <Group
-                mt={"5"}
-                align="flex-end"
-                gap={"xs"}
-            >
-                <Text
-                    fw={700}
-                    fz="h1"
-                >{value}
-                </Text>
-                <Text
-                    mb={"2"}
-                    c={diff > 0 ? 'teal' : 'red'}
-                    fz="h2"
-                    fw={500}
-                >
-                    <span>{diff}%</span>{diff > 0 ? <IconArrowUpRight /> : <IconArrowDownRight />}
-                </Text>
-            </Group>
-
-            <Group justify="space-between">
-                <Text tt="uppercase" fz="xs" c="dimmed">
-                    {description}
-                </Text>
-                {extraControl}
-            </Group>
-        </Paper>
-    );
-}