diff --git a/src/app.js b/src/app.js index c6e5c7a..6f04ea0 100644 --- a/src/app.js +++ b/src/app.js @@ -82,7 +82,7 @@ export default class App extends React.Component { const adminPanes = [ { menuItem: 'Home', - render: () => + render: () => }, { menuItem: 'Event', render: () => }, { menuItem: 'All Bookings', render: () => }, @@ -94,7 +94,7 @@ export default class App extends React.Component { const user = [ { menuItem: 'Home', - render: () => + render: () => }, { menuItem: 'Event', render: () => }, { menuItem: 'My Bookings', render: () => }, @@ -127,7 +127,7 @@ export default class App extends React.Component { const guest = [ { menuItem: 'Home', - render: () => + render: () => }, { menuItem: 'Event', render: () => }, { menuItem: 'Activities', render: () => }, diff --git a/src/layouts/body/tabs/Home.jsx b/src/layouts/body/tabs/Home.jsx index 694ad1e..03f3be2 100644 --- a/src/layouts/body/tabs/Home.jsx +++ b/src/layouts/body/tabs/Home.jsx @@ -15,16 +15,18 @@ export default class Home extends Component { home_slider: [], test: [ { - IMAGE: 'https://patancollege.edu.np/wp-content/uploads/2019/05/sports-day-00040.jpg' + IMAGE: + 'https://pic.001all.com/Wallpaper/Desktop%20Wallpaper/Sports/FTP/1366%20x%20768/College%20basketball%20hot%20wallpapers%201366%20x%20768%20Pixels%20Resolution.jpg' }, { - IMAGE: 'https://patancollege.edu.np/wp-content/uploads/2019/05/sports-day-00022.jpg' + IMAGE: + 'https://patancollege.https://live-beds-uni-cdnep.azureedge.net/live-beds-uni-media/266390/breeam-thumbnail.jpg.np/wp-content/uploads/2019/05/sports-day-00022.jpg' }, { - IMAGE: 'https://patancollege.edu.np/wp-content/uploads/2019/05/sports-day-00083.jpg' + IMAGE: 'https://patancollege.edu.np/wp-content/uploads/2018/07/image055.jpg' }, { - IMAGE: 'https://patancollege.edu.np/wp-content/uploads/2018/05/IMG-20180411-WA0017.jpg' + IMAGE: 'https://images6.alphacoders.com/427/thumb-1920-427408.jpg' }, { IMAGE: 'https://patancollege.edu.np/wp-content/uploads/2019/04/PCPS-SW19-BB-00012.jpg' @@ -117,21 +119,23 @@ export default class Home extends Component { News And Notice - { - console.log('YOYOYOY'); - }} - > - Add Item - - } - /> + {this.props.role == 'Admin' ? ( + { + console.log('YOYOYOY'); + }} + > + Add Item + + } + /> + ) : null} diff --git a/src/layouts/component/Item.jsx b/src/layouts/component/Item.jsx index f34f473..aa3d2d0 100644 --- a/src/layouts/component/Item.jsx +++ b/src/layouts/component/Item.jsx @@ -7,6 +7,7 @@ import CardContent from '@material-ui/core/CardContent'; import Button from '@material-ui/core/Button'; import NoticeModal from '../component/noticeModal'; import moment from 'moment'; +import LinesEllipsis from 'react-lines-ellipsis'; export default ({ title, desc, created, type, onClick }) => ( ( {moment(created).fromNow()} - {desc} + diff --git a/src/layouts/component/addActivityModal.jsx b/src/layouts/component/addActivityModal.jsx index a19b7ed..eb947fe 100644 --- a/src/layouts/component/addActivityModal.jsx +++ b/src/layouts/component/addActivityModal.jsx @@ -33,7 +33,12 @@ export default class AddActivityModal extends React.Component { activityImage: '', activityType: '', file: '', - imagePreviewUrl: '' + imagePreviewUrl: '', + activityDescriptionError: false, + activityNameError: false, + activityImageError: false, + activityTypeError: false, + fileError: false }; this._handleImageChange = this._handleImageChange.bind(this); } @@ -87,6 +92,12 @@ export default class AddActivityModal extends React.Component { activityName: e.target.value, changed: true })} + error={this.state.activityNameError == true ? true : false} + helperText={ + this.state.activityNameError == true ? ( + 'Activity Name is invalid or already used' + ) : null + } label="Activity Name" margin="normal" variant="outlined" @@ -99,6 +110,12 @@ export default class AddActivityModal extends React.Component { activityDescription: e.target.value, changed: true })} + error={this.state.activityDescriptionError == true ? true : false} + helperText={ + this.state.activityDescriptionError == true ? ( + 'Description is invalid or already used' + ) : null + } multiline rowsMax="4" label="Activity Description" @@ -115,6 +132,12 @@ export default class AddActivityModal extends React.Component { activityType: e.target.value, changed: true })} + error={this.state.activityTypeError == true ? true : false} + helperText={ + this.state.activityTypeError == true ? ( + 'Type is invalid or already used' + ) : null + } row > } label="Sports" /> @@ -145,24 +168,72 @@ export default class AddActivityModal extends React.Component { primary disabled={this.state.changed ? false : true} onClick={() => { - var bodyFormData = new FormData(); - bodyFormData.append('imageFile', this.state.file); - bodyFormData.append('ACT_NAME', this.state.activityName); - bodyFormData.append('ACT_DESCRIPTION', this.state.activityDescription); - bodyFormData.append('ACT_TYPE', this.state.activityType); + if (this.state.activityDescription == '') { + this.setState({ + activityDescriptionError: true + }); + } else { + this.setState({ + activityDescriptionError: false + }); + } + if (this.state.activityName == '') { + this.setState({ + activityNameError: true + }); + } else { + this.setState({ + activityNameError: false + }); + } + if (this.state.activityType == '') { + this.setState({ + activityTypeError: true + }); + } else { + this.setState({ + activityTypeError: false + }); + } + if (this.state.file == '') { + this.setState({ + fileError: true + }); + alert('Image file Empty'); + } else { + this.setState({ + fileError: false + }); + } - axios({ - method: 'post', - url: apiurl + '/api/addactivity', - data: bodyFormData, - config: { headers: { 'Content-Type': 'multipart/form-data' } } - }) - .then(function(response) { - console.log(response); + if ( + this.state.activityDescriptionError == false && + this.state.activityNameError == false && + this.state.activityTypeError == false && + this.state.fileError == false + ) { + var bodyFormData = new FormData(); + bodyFormData.append('imageFile', this.state.file); + bodyFormData.append('ACT_NAME', this.state.activityName); + bodyFormData.append('ACT_DESCRIPTION', this.state.activityDescription); + bodyFormData.append('ACT_TYPE', this.state.activityType); + + axios({ + method: 'post', + url: apiurl + '/api/addactivity', + data: bodyFormData, + config: { headers: { 'Content-Type': 'multipart/form-data' } } }) - .catch(function(response) { - console.log(response); - }); + .then(function(response) { + alert('Success!'); + console.log(response); + }) + .catch(function(response) { + console.log(response); + }); + } else { + alert('Something went wrong!'); + } }} /> diff --git a/src/layouts/component/addEventModal.jsx b/src/layouts/component/addEventModal.jsx index e5d71e6..616396b 100644 --- a/src/layouts/component/addEventModal.jsx +++ b/src/layouts/component/addEventModal.jsx @@ -45,7 +45,8 @@ export default class AddEventModal extends React.Component { eventStatus: "", eventEndDate: Date.now(), file: "", - imagePreviewUrl: "" + imagePreviewUrl: "", + eventButton: "Add Event" }; this._handleImageChange = this._handleImageChange.bind(this); } @@ -218,7 +219,7 @@ export default class AddEventModal extends React.Component { }} > - + {/* KIOSK - + */} +
+ +
+ this.setState({ + title: e.target.value + })} style={style.input} placeholder="Search for some awesome Events and Programmes!!" /> - - - + {}}> + + + } + /> + + +
+ Search Result +
+
+ + + + + + {this.props.searchTitle} + + + {this.props.searchTitle != 'Gaming Competition' ? ( + 'Not Found!' + ) : ( + 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quisnostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eufugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt inculpa qui officia deserunt mollit anim id est laborum.' + )} + + + + + + +
+ +
+
+
+ + ); + } +} diff --git a/src/layouts/component/signUpModal.jsx b/src/layouts/component/signUpModal.jsx index 4d2f267..6238410 100644 --- a/src/layouts/component/signUpModal.jsx +++ b/src/layouts/component/signUpModal.jsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Modal, Grid, Button } from 'semantic-ui-react'; +import { Modal, Grid, Button, Image } from 'semantic-ui-react'; import { TextField, InputAdornment, @@ -19,6 +19,8 @@ export default class SignUpModal extends React.Component { constructor(props) { super(props); this.state = { + file: '', + imagePreviewUrl: '', username: '', password: '', firstname: '', @@ -43,14 +45,41 @@ export default class SignUpModal extends React.Component { passwordError: false, courseError: false, studylevelError: false, - genderError: false + genderError: false, + registerButton: 'Register' }; + this._handleImageChange = this._handleImageChange.bind(this); } handleClickShowPassword() { this.setState({ showPassword: !this.state.showPassword }); } + _handleImageChange(e) { + e.preventDefault(); + + let reader = new FileReader(); + let file = e.target.files[0]; + + reader.onloadend = () => { + this.setState({ + file: file, + imagePreviewUrl: reader.result + }); + }; + + reader.readAsDataURL(file); + } + render() { + let { imagePreviewUrl } = this.state; + let $imagePreview = null; + if (imagePreviewUrl) { + $imagePreview = ( +
+ ; +
+ ); + } return (
@@ -74,6 +103,10 @@ export default class SignUpModal extends React.Component { firstname: e.target.value, changed: true })} + error={this.state.firstnameError == true ? true : false} + helperText={ + this.state.firstnameError == true ? 'First name is Blank or invalid' : null + } label="First Name" margin="normal" variant="outlined" @@ -86,6 +119,10 @@ export default class SignUpModal extends React.Component { lastname: e.target.value, changed: true })} + error={this.state.lastnameError == true ? true : false} + helperText={ + this.state.lastnameError == true ? 'First name is Blank or invalid' : null + } label="Last Name" margin="normal" variant="outlined" @@ -100,6 +137,10 @@ export default class SignUpModal extends React.Component { username: e.target.value, changed: true })} + error={this.state.usernameError == true ? true : false} + helperText={ + this.state.usernameError == true ? 'Username is Blank or invalid' : null + } label="Username" margin="normal" variant="outlined" @@ -112,6 +153,8 @@ export default class SignUpModal extends React.Component { email: e.target.value, changed: true })} + error={this.state.emailError == true ? true : false} + helperText={this.state.emailError == true ? 'Email is Blank or invalid' : null} label="Email" margin="normal" variant="outlined" @@ -131,6 +174,10 @@ export default class SignUpModal extends React.Component { password: e.target.value, changed: true })} + error={this.state.passwordError == true ? true : false} + helperText={ + this.state.passwordError == true ? 'Password is Blank or invalid' : null + } InputProps={{ endAdornment: ( @@ -173,6 +220,12 @@ export default class SignUpModal extends React.Component { contact: e.target.value, changed: true })} + error={this.state.contactError == true ? true : false} + helperText={ + this.state.contactError == true ? ( + 'Contact is invalid or already used' + ) : null + } label="Contact" margin="normal" variant="outlined" @@ -181,12 +234,19 @@ export default class SignUpModal extends React.Component { this.setState({ study_level: e.target.value, changed: true })} + error={this.state.study_level == true ? true : false} + helperText={ + this.state.study_level == true ? ( + 'Study Level is invalid or already used' + ) : null + } SelectProps={{ native: true }} @@ -211,11 +271,16 @@ export default class SignUpModal extends React.Component { this.setState({ course: e.target.value, changed: true })} + error={this.state.course == true ? true : false} + helperText={ + this.state.course == true ? 'Course is invalid or already used' : null + } SelectProps={{ native: true }} @@ -235,11 +300,16 @@ export default class SignUpModal extends React.Component { this.setState({ gender: e.target.value, changed: true })} + error={this.state.genderError == true ? true : false} + helperText={ + this.state.genderError == true ? 'Gender is invalid or already used' : null + } row > } label="Female" /> @@ -247,6 +317,14 @@ export default class SignUpModal extends React.Component { } label="Other" /> + +
+
+ +
+ {$imagePreview} +
+
@@ -258,7 +336,7 @@ export default class SignUpModal extends React.Component { }} >
diff --git a/yarn.lock b/yarn.lock index 81836ca..ad7aa47 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3179,7 +3179,7 @@ fast-levenshtein@~2.0.4: version "2.0.6" resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917" -fbjs@^0.8.1, fbjs@^0.8.12: +fbjs@^0.8.1, fbjs@^0.8.12, fbjs@^0.8.16: version "0.8.17" resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd" dependencies: @@ -6344,7 +6344,7 @@ promzard@^0.3.0: dependencies: read "1" -prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.6.0, prop-types@^15.6.2, prop-types@^15.7.2: +prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2: version "15.7.2" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5" dependencies: @@ -6573,6 +6573,24 @@ react-user-avatar@^1.10.0: contrast "^1.0.1" initials "^2.1.5" +react-validation-framework@^5.1.0: + version "5.1.0" + resolved "https://registry.yarnpkg.com/react-validation-framework/-/react-validation-framework-5.1.0.tgz#7754ee114d69863004031c0f4e9c22610b1d08fa" + integrity sha512-dqXny7AdMC9yRmEm7iwG6odu6MTGhN3VQ5SQwa4HFR5n372xb4sX++Veb/S6bfN8YeuuvOZFO+88mmnDRF8LSA== + dependencies: + prop-types "^15.6.1" + react "16.1.1" + +react@16.1.1: + version "16.1.1" + resolved "https://registry.yarnpkg.com/react/-/react-16.1.1.tgz#d5c4ef795507e3012282dd51261ff9c0e824fe1f" + integrity sha512-FQfiFfk2z2Fk87OngNJHT05KyC9DOVn8LPeB7ZX+9u5+yU1JK6o5ozRlU3PeOMr0IFkWNvgn9jU8/IhRxR1F0g== + dependencies: + fbjs "^0.8.16" + loose-envify "^1.1.0" + object-assign "^4.1.1" + prop-types "^15.6.0" + react@16.8.6, react@^16.2.0, react@^16.3.2: version "16.8.6" resolved "https://registry.yarnpkg.com/react/-/react-16.8.6.tgz#ad6c3a9614fd3a4e9ef51117f54d888da01f2bbe"