From cee068f0abc5226aac095c664c05c165b7e9360d Mon Sep 17 00:00:00 2001 From: shams mosowi Date: Fri, 13 Sep 2019 09:56:17 +1000 Subject: [PATCH] more fields --- package.json | 3 +++ src/Fields/index.tsx | 18 ++++++++++++-- src/components/TableCell.tsx | 39 ++++++++++++++++++++++-------- yarn.lock | 47 ++++++++++++++++++++++++++++++++++-- 4 files changed, 93 insertions(+), 14 deletions(-) diff --git a/package.json b/package.json index d8c76ca6..f5a7e067 100644 --- a/package.json +++ b/package.json @@ -3,9 +3,11 @@ "version": "0.1.0", "private": true, "dependencies": { + "@date-io/date-fns": "^1.3.11", "@material-ui/core": "^4.4.0", "@material-ui/icons": "^4.4.1", "@material-ui/lab": "^4.0.0-alpha.26", + "@material-ui/pickers": "^3.2.5", "@types/jest": "24.0.18", "@types/lodash": "^4.14.138", "@types/node": "12.7.4", @@ -16,6 +18,7 @@ "@types/react-sortable-hoc": "^0.6.5", "@types/react-virtualized": "^9.21.4", "array-move": "^2.1.0", + "date-fns": "^2.0.0-beta.5", "firebase": "^6.6.0", "lodash": "^4.17.15", "ramda": "^0.26.1", diff --git a/src/Fields/index.tsx b/src/Fields/index.tsx index 81525f4d..0e938183 100644 --- a/src/Fields/index.tsx +++ b/src/Fields/index.tsx @@ -4,6 +4,10 @@ import CheckBoxIcon from "@material-ui/icons/CheckBox"; import SimpleTextIcon from "@material-ui/icons/TextFormat"; import LongTextIcon from "@material-ui/icons/Notes"; import PhoneIcon from "@material-ui/icons/Phone"; +import DateIcon from "@material-ui/icons/CalendarToday"; +import TimeIcon from "@material-ui/icons/AccessTime"; +import RatingIcon from "@material-ui/icons/StarHalf"; +import URLIcon from "@material-ui/icons/Explore"; import propEq from "ramda/es/propEq"; import find from "ramda/es/find"; export enum FieldType { @@ -11,7 +15,13 @@ export enum FieldType { longText = "LONG_TEXT", email = "EMAIL", PhoneNumber = "PHONE_NUMBER", - checkBox = "CHECK_BOX" + checkBox = "CHECK_BOX", + date = "DATE", + time = "TIME", + dateTime = "DATE_TIME", + number = "NUMBER", + url = "URL", + rating = "RATING" } export const FIELDS = [ @@ -19,7 +29,11 @@ export const FIELDS = [ { icon: , name: "Long Text", type: FieldType.longText }, { icon: , name: "Email", type: FieldType.email }, { icon: , name: "Phone", type: FieldType.PhoneNumber }, - { icon: , name: "Check Box", type: FieldType.checkBox } + { icon: , name: "Check Box", type: FieldType.checkBox }, + { icon: , name: "Date", type: FieldType.date }, + { icon: , name: "Time", type: FieldType.time }, + { icon: , name: "URL", type: FieldType.url }, + { icon: , name: "Rating", type: FieldType.rating } ]; export const getFieldIcon = (type: FieldType) => { diff --git a/src/components/TableCell.tsx b/src/components/TableCell.tsx index 0070a832..d0b01110 100644 --- a/src/components/TableCell.tsx +++ b/src/components/TableCell.tsx @@ -8,7 +8,7 @@ import { withStyles, WithStyles } from "@material-ui/core/styles"; - +import Rating from "@material-ui/lab/Rating"; import IconButton from "@material-ui/core/IconButton"; import DeleteIcon from "@material-ui/icons/Delete"; import AddIcon from "@material-ui/icons/AddCircle"; @@ -17,6 +17,12 @@ import Checkbox, { CheckboxProps } from "@material-ui/core/Checkbox"; import TextField from "@material-ui/core/TextField"; import CheckBoxIcon from "@material-ui/icons/CheckBox"; import CheckBoxOutlineIcon from "@material-ui/icons/CheckBoxOutlineBlank"; +import DateFnsUtils from "@date-io/date-fns"; +import { + MuiPickersUtilsProvider, + KeyboardTimePicker, + KeyboardDatePicker +} from "@material-ui/pickers"; const TableCell = (props: any) => { const { fieldType, @@ -45,7 +51,29 @@ const TableCell = (props: any) => { }} /> ); + case FieldType.date: + return ( + + { + console.log(date); + //cellActions.updateValue(e.target.value); + }} + KeyboardButtonProps={{ + "aria-label": "change date" + }} + /> + + ); + case FieldType.rating: + return ; default: return ( { const valueRenderer = () => { switch (fieldType) { case FieldType.checkBox: - // return ( - // { - // setState(!state); - // cellActions.updateValue(!state, true); - // }} - // /> - // ); return cellData === true ? : ; default: diff --git a/yarn.lock b/yarn.lock index a12e57ef..85b3a8f0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -851,7 +851,7 @@ dependencies: regenerator-runtime "^0.13.2" -"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4", "@babel/runtime@^7.4.0", "@babel/runtime@^7.4.2", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5": +"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.3.4", "@babel/runtime@^7.4.0", "@babel/runtime@^7.4.2", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5": version "7.6.0" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.6.0.tgz#4fc1d642a9fd0299754e8b5de62c631cf5568205" integrity sha512-89eSBLJsxNxOERC0Op4vd+0Bqm6wRMqMbFtV3i0/fbaWw/mJ8Q3eBvgX0G4SyrOOLCtbu98HspF8o09MRT+KzQ== @@ -909,6 +909,18 @@ resolved "https://registry.yarnpkg.com/@csstools/normalize.css/-/normalize.css-9.0.1.tgz#c27b391d8457d1e893f1eddeaf5e5412d12ffbb5" integrity sha512-6It2EVfGskxZCQhuykrfnALg7oVeiI6KclWSmGDqB0AiInVrTGB9Jp9i4/Ad21u9Jde/voVQz6eFX/eSg/UsPA== +"@date-io/core@^1.3.11": + version "1.3.11" + resolved "https://registry.yarnpkg.com/@date-io/core/-/core-1.3.11.tgz#98e3c366794dfff571e39227e5d718ac7f26b729" + integrity sha512-Yxf2ei0vjU38Fizswr/Uwub5QeRiLOHiTRiHUuTdg+biVB+1EUk+h5szas9SEWA2pZDlSo73F5TPuu+zKqOIBQ== + +"@date-io/date-fns@^1.3.11": + version "1.3.11" + resolved "https://registry.yarnpkg.com/@date-io/date-fns/-/date-fns-1.3.11.tgz#f0b320b9c5993b9914e3b4d71155ea40814a8d75" + integrity sha512-6Pvk4gwCU4L19XYzDUrro861JCQjZkJQjugxAA+M8wsDTW75A5rmSZGa6g2rQQXfg6ox4B7HBx9p6JYDsSPX0g== + dependencies: + "@date-io/core" "^1.3.11" + "@emotion/hash@^0.7.1": version "0.7.2" resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.7.2.tgz#53211e564604beb9befa7a4400ebf8147473eeef" @@ -1307,6 +1319,18 @@ prop-types "^15.7.2" warning "^4.0.3" +"@material-ui/pickers@^3.2.5": + version "3.2.5" + resolved "https://registry.yarnpkg.com/@material-ui/pickers/-/pickers-3.2.5.tgz#e5c9a56c8b57ceb8bca50c4fd7b7a03cb3c918e1" + integrity sha512-UV5UKslOcmcP4cB2wwOg1SFoXS6RTRRvCNkDclHtOa+Ni+gyZLEt3WcSQWH7oDx8A94gmkiZTpfweNFV7sC4sw== + dependencies: + "@babel/runtime" "^7.2.0" + "@types/styled-jsx" "^2.2.8" + clsx "^1.0.2" + react-transition-group "^4.0.0" + rifm "^0.7.0" + tslib "^1.9.3" + "@material-ui/styles@^4.4.1": version "4.4.1" resolved "https://registry.yarnpkg.com/@material-ui/styles/-/styles-4.4.1.tgz#a53fb39e373636bd2c296a78c54afecb80f68446" @@ -1710,6 +1734,13 @@ resolved "https://registry.yarnpkg.com/@types/stack-utils/-/stack-utils-1.0.1.tgz#0a851d3bd96498fa25c33ab7278ed3bd65f06c3e" integrity sha512-l42BggppR6zLmpfU6fq9HEa2oGPEI8yrSPL3GITjfRInppYFahObbIQOQK3UGxEnyQpltZLaPe75046NOZQikw== +"@types/styled-jsx@^2.2.8": + version "2.2.8" + resolved "https://registry.yarnpkg.com/@types/styled-jsx/-/styled-jsx-2.2.8.tgz#b50d13d8a3c34036282d65194554cf186bab7234" + integrity sha512-Yjye9VwMdYeXfS71ihueWRSxrruuXTwKCbzue4+5b2rjnQ//AtyM7myZ1BEhNhBQ/nL/RE7bdToUoLln2miKvg== + dependencies: + "@types/react" "*" + "@types/yargs-parser@*": version "13.1.0" resolved "https://registry.yarnpkg.com/@types/yargs-parser/-/yargs-parser-13.1.0.tgz#c563aa192f39350a1d18da36c5a8da382bbd8228" @@ -3570,6 +3601,11 @@ data-urls@^1.0.0, data-urls@^1.1.0: whatwg-mimetype "^2.2.0" whatwg-url "^7.0.0" +date-fns@^2.0.0-beta.5: + version "2.0.0-beta.5" + resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.0.0-beta.5.tgz#90885db3772802d55519cd12acd49de56aca1059" + integrity sha512-GS5yi964NDFNoja9yOdWFj9T97T67yLrUeJZgddHaVfc/6tHWtX7RXocuubmZkNzrZUZ9BqBOW7jTR5OoWjJ1w== + date-now@^0.1.4: version "0.1.4" resolved "https://registry.yarnpkg.com/date-now/-/date-now-0.1.4.tgz#eaf439fd4d4848ad74e5cc7dbef200672b9e345b" @@ -9328,6 +9364,13 @@ rgba-regex@^1.0.0: resolved "https://registry.yarnpkg.com/rgba-regex/-/rgba-regex-1.0.0.tgz#43374e2e2ca0968b0ef1523460b7d730ff22eeb3" integrity sha1-QzdOLiyglosO8VI0YLfXMP8i7rM= +rifm@^0.7.0: + version "0.7.0" + resolved "https://registry.yarnpkg.com/rifm/-/rifm-0.7.0.tgz#debe951a9c83549ca6b33e5919f716044c2230be" + integrity sha512-DSOJTWHD67860I5ojetXdEQRIBvF6YcpNe53j0vn1vp9EUb9N80EiZTxgP+FkDKorWC8PZw052kTF4C1GOivCQ== + dependencies: + "@babel/runtime" "^7.3.1" + rimraf@2.6.3: version "2.6.3" resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.3.tgz#b2d104fe0d8fb27cf9e0a1cda8262dd3833c6cab" @@ -10279,7 +10322,7 @@ ts-toolbelt@^3.8.4: resolved "https://registry.yarnpkg.com/ts-toolbelt/-/ts-toolbelt-3.8.72.tgz#647ba67a3bd55f1e5a8057c1a7621c38b2e418a5" integrity sha512-rVwnPRczAamCTIs/9iUgWW12YMscmDG79M0xiUmcmWgTk8lkjxrrwzUys72wsIxNohtiNQaOhbkgQPIxqIdwmA== -tslib@1.10.0, tslib@^1.8.1, tslib@^1.9.0: +tslib@1.10.0, tslib@^1.8.1, tslib@^1.9.0, tslib@^1.9.3: version "1.10.0" resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.10.0.tgz#c3c19f95973fb0a62973fb09d90d961ee43e5c8a" integrity sha512-qOebF53frne81cf0S9B41ByenJ3/IuH8yJKngAX35CmiZySA0khhkovshKK+jGCaMnVomla7gVlIcc3EvKPbTQ==