File "HederCash.tsx"

Full Path: /var/www/html/gitep_front/src/pages/CashPage/HeaderCash/HederCash.tsx
File size: 2.54 KB
MIME-type: text/x-java
Charset: utf-8

import styles from './HeaderCash.module.scss';
import { useUnit } from "effector-react";
import { Button, Flex, Segmented, Typography } from "antd";
import Download from "@shared/assets/images/icons/shareExcel.svg";
import Settings from "@shared/assets/images/icons/settings.svg";
import whiteSettings from "@shared/assets/images/icons/whiteSettings.svg";
import { $roleStore } from "@features/roles/store/stores";

const segmentOptions = [
    {
        label: (
          <Flex align="center" gap={10}>
            По периодам
          </Flex>
        ),
        value: 'period'
      },
      {
        label: (
          <Flex align="center" gap={10}>
            По проектам
          </Flex>
        ),
        value: 'project',
      },
]

interface IHeaderCash {
    segmentTab: string
    handleSegmentChange: (value: string) => void
    clickEditPage: () => void
    isEditMode: boolean
    downloadExcelHadler: any
}

export const HeaderCash = ({segmentTab, handleSegmentChange, clickEditPage, isEditMode, downloadExcelHadler}: IHeaderCash) => {
    const roleStore = useUnit($roleStore).role
    return (
        <Flex className={styles.top} justify="space-between" align="end">
            <Flex gap={16}>
                <Typography.Text className={styles.title}>ДДС</Typography.Text>

                <Segmented
                    className={styles.filter}
                    size="large"
                    options={segmentOptions}
                    value={segmentTab}
                    onChange={handleSegmentChange}
                />
            </Flex>

            <Flex gap={16}>
                <Button
                    size="large"
                    className={styles.excel}
                    type="default"
                    onClick={downloadExcelHadler}
                    icon={<img src={Download} />}
                    style={{fontSize: '14px'}}
                >
                    Экспорт
                </Button>
                {(roleStore === "superAdmin" || roleStore === "accountant") && (
                <Button
                    size="large"
                    className={styles.excel}
                    type="default"
                    onClick={clickEditPage}
                    icon={<img src={isEditMode ? whiteSettings : Settings} />}
                    style={{fontSize: '14px', background: isEditMode ? '#722ED1' : '', color: isEditMode ? '#FFF' : '' }}
                >
                    Статьи
                </Button>
                )}
            </Flex>
        </Flex>
    )
}