From 75c6d206573dd69db0a5b1e7ef70470646a29b4d Mon Sep 17 00:00:00 2001 From: wrzesinski-hubert Date: Fri, 5 Jun 2020 14:31:48 +0200 Subject: [PATCH] kalendarz pre-pre-pre-alfa --- package-lock.json | 104 ++++++++++++++++++++++++ package.json | 3 + src/App.tsx | 2 + src/components/Calendar/appointments.js | 23 ++++++ src/components/Calendar/index.scss | 21 +++++ src/components/Calendar/index.tsx | 90 ++++++++++++++++++++ src/teest.tsx | 27 ++++++ 7 files changed, 270 insertions(+) create mode 100644 src/components/Calendar/appointments.js create mode 100644 src/components/Calendar/index.scss create mode 100644 src/components/Calendar/index.tsx create mode 100644 src/teest.tsx diff --git a/package-lock.json b/package-lock.json index 0d99b06..e7e54e9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1083,6 +1083,61 @@ "resolved": "https://registry.npmjs.org/@csstools/normalize.css/-/normalize.css-10.1.0.tgz", "integrity": "sha512-ij4wRiunFfaJxjB0BdrYHIH8FxBJpOwNPhhAcunlmPdXudL1WQV1qoP9un6JsEBAgQH+7UXyyjh0g7jTxXK6tg==" }, + "@date-io/core": { + "version": "1.3.13", + "resolved": "https://registry.npmjs.org/@date-io/core/-/core-1.3.13.tgz", + "integrity": "sha512-AlEKV7TxjeK+jxWVKcCFrfYAk8spX9aCyiToFIiLPtfQbsjmRGLIhb5VZgptQcJdHtLXo7+m0DuurwFgUToQuA==" + }, + "@date-io/moment": { + "version": "1.3.13", + "resolved": "https://registry.npmjs.org/@date-io/moment/-/moment-1.3.13.tgz", + "integrity": "sha512-3kJYusJtQuOIxq6byZlzAHoW/18iExJer9qfRF5DyyzdAk074seTuJfdofjz4RFfTd/Idk8WylOQpWtERqvFuQ==", + "requires": { + "@date-io/core": "^1.3.13" + } + }, + "@devexpress/dx-core": { + "version": "2.6.3", + "resolved": "https://registry.npmjs.org/@devexpress/dx-core/-/dx-core-2.6.3.tgz", + "integrity": "sha512-MMOPm+UQdxliq0IidfsgOryYCJsFVRHtILZeMyHMs9I8IFbV8DuDwkhzNNr2/RjRZ3GVm4ZuxnWjbeOSUdft8A==" + }, + "@devexpress/dx-react-core": { + "version": "2.6.3", + "resolved": "https://registry.npmjs.org/@devexpress/dx-react-core/-/dx-react-core-2.6.3.tgz", + "integrity": "sha512-lKmmhHCfOBfkEFaa/SOt7DjdMLvkHqgwIiWBXaZEqK6kJk4u0Y5+yWJLUo0O9RNszaKQzAoDMQUupi47fbCPWg==", + "requires": { + "@devexpress/dx-core": "2.6.3", + "prop-types": "^15.7.2" + } + }, + "@devexpress/dx-react-scheduler": { + "version": "2.6.3", + "resolved": "https://registry.npmjs.org/@devexpress/dx-react-scheduler/-/dx-react-scheduler-2.6.3.tgz", + "integrity": "sha512-trQMLbOlkTnmi0y0AYic369XzXu58IablHiUg5Ndp7XC8pz3eysERFFd9yziOUz0LnxcpPP204D9zUZQAPUfpA==", + "requires": { + "@devexpress/dx-scheduler-core": "2.6.3" + } + }, + "@devexpress/dx-react-scheduler-material-ui": { + "version": "2.6.3", + "resolved": "https://registry.npmjs.org/@devexpress/dx-react-scheduler-material-ui/-/dx-react-scheduler-material-ui-2.6.3.tgz", + "integrity": "sha512-UuORS7BSErFgjmVDfWTfrwDlDSTifBRM8Y6KiwDwn2ew25wHP8MKyCiPSY9A36H2s10iXX/D7tJokF//lA31AA==", + "requires": { + "@date-io/moment": "^1.3.11", + "@material-ui/pickers": "^3.2.10", + "clsx": "^1.0.4", + "prop-types": "^15.7.2" + } + }, + "@devexpress/dx-scheduler-core": { + "version": "2.6.3", + "resolved": "https://registry.npmjs.org/@devexpress/dx-scheduler-core/-/dx-scheduler-core-2.6.3.tgz", + "integrity": "sha512-yZp9vvzuLvkw+dUASp6WLxrqyvTqB9Nx+k56fnCYz8o18yMWBuYtGZvg34p3pdry930HEfLLRVrRXBWcQI8mzg==", + "requires": { + "moment": "^2.24.0", + "rrule": "^2.6.2" + } + }, "@emotion/hash": { "version": "0.8.0", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", @@ -1340,6 +1395,19 @@ "@babel/runtime": "^7.4.4" } }, + "@material-ui/pickers": { + "version": "3.2.10", + "resolved": "https://registry.npmjs.org/@material-ui/pickers/-/pickers-3.2.10.tgz", + "integrity": "sha512-B8G6Obn5S3RCl7hwahkQj9sKUapwXWFjiaz/Bsw1fhYFdNMnDUolRiWQSoKPb1/oKe37Dtfszoywi1Ynbo3y8w==", + "requires": { + "@babel/runtime": "^7.6.0", + "@date-io/core": "1.x", + "@types/styled-jsx": "^2.2.8", + "clsx": "^1.0.2", + "react-transition-group": "^4.0.0", + "rifm": "^0.7.0" + } + }, "@material-ui/styles": { "version": "4.10.0", "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.10.0.tgz", @@ -1799,6 +1867,14 @@ "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-1.0.1.tgz", "integrity": "sha512-l42BggppR6zLmpfU6fq9HEa2oGPEI8yrSPL3GITjfRInppYFahObbIQOQK3UGxEnyQpltZLaPe75046NOZQikw==" }, + "@types/styled-jsx": { + "version": "2.2.8", + "resolved": "https://registry.npmjs.org/@types/styled-jsx/-/styled-jsx-2.2.8.tgz", + "integrity": "sha512-Yjye9VwMdYeXfS71ihueWRSxrruuXTwKCbzue4+5b2rjnQ//AtyM7myZ1BEhNhBQ/nL/RE7bdToUoLln2miKvg==", + "requires": { + "@types/react": "*" + } + }, "@types/testing-library__dom": { "version": "6.14.0", "resolved": "https://registry.npmjs.org/@types/testing-library__dom/-/testing-library__dom-6.14.0.tgz", @@ -8282,6 +8358,12 @@ } } }, + "luxon": { + "version": "1.24.1", + "resolved": "https://registry.npmjs.org/luxon/-/luxon-1.24.1.tgz", + "integrity": "sha512-CgnIMKAWT0ghcuWFfCWBnWGOddM0zu6c4wZAWmD0NN7MZTnro0+833DF6tJep+xlxRPg4KtsYEHYLfTMBQKwYg==", + "optional": true + }, "make-dir": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz", @@ -8772,6 +8854,11 @@ "minimist": "^1.2.5" } }, + "moment": { + "version": "2.26.0", + "resolved": "https://registry.npmjs.org/moment/-/moment-2.26.0.tgz", + "integrity": "sha512-oIixUO+OamkUkwjhAVE18rAMfRJNsNe/Stid/gwHSOfHrOtw9EhAY2AHvdKZ/k/MggcYELFCJz/Sn2pL8b8JMw==" + }, "move-concurrently": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz", @@ -11831,6 +11918,14 @@ "resolved": "https://registry.npmjs.org/rgba-regex/-/rgba-regex-1.0.0.tgz", "integrity": "sha1-QzdOLiyglosO8VI0YLfXMP8i7rM=" }, + "rifm": { + "version": "0.7.0", + "resolved": "https://registry.npmjs.org/rifm/-/rifm-0.7.0.tgz", + "integrity": "sha512-DSOJTWHD67860I5ojetXdEQRIBvF6YcpNe53j0vn1vp9EUb9N80EiZTxgP+FkDKorWC8PZw052kTF4C1GOivCQ==", + "requires": { + "@babel/runtime": "^7.3.1" + } + }, "rimraf": { "version": "2.6.3", "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.3.tgz", @@ -11848,6 +11943,15 @@ "inherits": "^2.0.1" } }, + "rrule": { + "version": "2.6.4", + "resolved": "https://registry.npmjs.org/rrule/-/rrule-2.6.4.tgz", + "integrity": "sha512-sLdnh4lmjUqq8liFiOUXD5kWp/FcnbDLPwq5YAc/RrN6120XOPb86Ae5zxF7ttBVq8O3LxjjORMEit1baluahA==", + "requires": { + "luxon": "^1.21.3", + "tslib": "^1.10.0" + } + }, "rsvp": { "version": "4.8.5", "resolved": "https://registry.npmjs.org/rsvp/-/rsvp-4.8.5.tgz", diff --git a/package.json b/package.json index 708ca87..7bb8896 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,9 @@ "private": true, "dependencies": { "-": "0.0.1", + "@devexpress/dx-react-core": "^2.6.3", + "@devexpress/dx-react-scheduler": "^2.6.3", + "@devexpress/dx-react-scheduler-material-ui": "^2.6.3", "@material-ui/core": "^4.10.0", "@material-ui/icons": "^4.9.1", "@testing-library/jest-dom": "^4.2.4", diff --git a/src/App.tsx b/src/App.tsx index c8fcc5b..73b75af 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -2,6 +2,7 @@ import React, { useState } from "react"; import TopBar from "./components/TopBar/"; import Transfer from "./components/Transfer/"; import "./App.scss"; +import Schedule from "./components/Calendar/"; function App() { const [isOpen, setOpen] = useState(false); @@ -30,6 +31,7 @@ function App() { setOpen(!isOpen); }} /> +

{text}

); diff --git a/src/components/Calendar/appointments.js b/src/components/Calendar/appointments.js new file mode 100644 index 0000000..e6cf0dd --- /dev/null +++ b/src/components/Calendar/appointments.js @@ -0,0 +1,23 @@ +export const appointments = [ + { + title: 'Snmutna buzia', + startDate: new Date(2020, 5, 3, 9, 45), + endDate: new Date(2020, 5, 3, 11, 30), + id: 0, + location: 'Room 1', + }, + { + title: 'Twoja stara beszamel', + startDate: new Date(2020, 5, 1, 9, 45), + endDate: new Date(2020, 5, 1, 11, 30), + id: 0, + location: 'Room 1', + }, + { + title: 'Twoja stara beszamel', + startDate: new Date(2020, 5, 1, 9, 45), + endDate: new Date(2020, 5, 1, 11, 30), + id: 0, + location: 'Room 1', + }, +]; diff --git a/src/components/Calendar/index.scss b/src/components/Calendar/index.scss new file mode 100644 index 0000000..68fd41e --- /dev/null +++ b/src/components/Calendar/index.scss @@ -0,0 +1,21 @@ +.schedule{ +display: flex; + +} +.calendar{ +display: flex; + width: 85%; + + +} +.shop-cart{ + padding-top: 10px; + display: flex; + text-align: center; + font-family: Lato; + flex-grow: 1; +} +.chuj{ + padding-top: 20px !important; + padding-bottom: 20px !important; + } \ No newline at end of file diff --git a/src/components/Calendar/index.tsx b/src/components/Calendar/index.tsx new file mode 100644 index 0000000..bd48b34 --- /dev/null +++ b/src/components/Calendar/index.tsx @@ -0,0 +1,90 @@ +import * as React from "react"; +import { ViewState } from "@devexpress/dx-react-scheduler"; +import { AppointmentModel } from "@devexpress/dx-react-scheduler"; +import { + Scheduler, + WeekView, + Appointments, +} from "@devexpress/dx-react-scheduler-material-ui"; +import moment from "moment"; +import "moment/locale/pl"; +import { appointments } from "./appointments"; +import "./index.scss"; +import { makeStyles, Theme, createStyles } from '@material-ui/core/styles'; + +interface CalendarProps {} + +interface CalendarState { + data: Array; + currentDate: Date; +} + +const formatDayScaleDate = ( + date: moment.MomentInput, + options: { weekday: any } +) => { + const momentDate = moment(date).locale("pl"); + const { weekday } = options; + return momentDate.format(weekday ? "dddd" : " ").toUpperCase(); +}; + +const styles = makeStyles((theme: Theme) => + createStyles({ + dayScaleCell:{ + backgroundColor:"red" + } + }), +); + +const DayScaleCell = (({ formatDate,classes, ...restProps }: any) => ( + +)); + +export default class Calendar extends React.PureComponent< + CalendarProps, + CalendarState +> { + constructor(props: CalendarProps) { + super(props); + + this.state = { + data: appointments, + currentDate: new Date("2020-06-01"), + }; + } + + render() { + const { data, currentDate } = this.state; + + return ( +
+
+ + + + + +
+
+ Hubert Wrzesiński Semestr zimowy 2020/2021 +
+
+ ); + } +} diff --git a/src/teest.tsx b/src/teest.tsx new file mode 100644 index 0000000..639a670 --- /dev/null +++ b/src/teest.tsx @@ -0,0 +1,27 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { withStyles } from '@material-ui/core/styles'; +import Button from '@material-ui/core/Button'; + +const styles = { + root: { + background: 'linear-gradient(45deg, #FE6B8B 30%, #FF8E53 90%)', + border: 0, + borderRadius: 3, + boxShadow: '0 3px 5px 2px rgba(255, 105, 135, .3)', + color: 'white', + height: 48, + padding: '0 30px', + }, +}; + +function HigherOrderComponent(props: { classes: any; }) { + const { classes } = props; + return ; +} + +HigherOrderComponent.propTypes = { + classes: PropTypes.object.isRequired, +}; + +export default withStyles(styles)(HigherOrderComponent); \ No newline at end of file