init

worklenz-frontend/src/features/schedule-old/ProjectTimelineModal.tsx

@@ -0,0 +1,57 @@
+import { Button, Col, DatePicker, Flex, Input, Row } from 'antd';
+import React from 'react';
+import { useDispatch } from 'react-redux';
+import { toggleModal } from './scheduleSlice';
+import { useTranslation } from 'react-i18next';
+
+const ProjectTimelineModal = () => {
+  const dispatch = useDispatch();
+  const { t } = useTranslation('schedule');
+
+  const handleSave = () => {
+    dispatch(toggleModal());
+  };
+
+  return (
+    <Flex vertical gap={10} style={{ width: '480px' }}>
+      <Row>
+        <Col span={12} style={{ display: 'flex', flexDirection: 'column', paddingRight: '20px' }}>
+          <span>{t('startDate')}</span>
+          <DatePicker />
+        </Col>
+        <Col span={12} style={{ display: 'flex', flexDirection: 'column', paddingLeft: '20px' }}>
+          <span>{t('endDate')}</span>
+          <DatePicker />
+        </Col>
+      </Row>
+      <Row>
+        <Col span={12} style={{ paddingRight: '20px' }}>
+          <span>{t('hoursPerDay')}</span>
+          <Input max={24} defaultValue={8} type="number" suffix="hours" />
+        </Col>
+
+        <Col span={12} style={{ paddingLeft: '20px' }}>
+          <span>{t('totalHours')}</span>
+          <Input max={24} defaultValue={8} type="number" suffix="hours" />
+        </Col>
+      </Row>
+      <div
+        style={{
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'space-between',
+        }}
+      >
+        <Button type="link">{t('deleteButton')}</Button>
+        <div style={{ display: 'flex', gap: '5px' }}>
+          <Button onClick={() => dispatch(toggleModal())}>{t('cancelButton')}</Button>
+          <Button type="primary" onClick={handleSave}>
+            {t('saveButton')}
+          </Button>
+        </div>
+      </div>
+    </Flex>
+  );
+};
+
+export default ProjectTimelineModal;