View Events/Seminars Bugs, Announcement Bugs, View Profile (#83)

* Seminar mutation (#78)

* Validates seminar start/end datetimes with each other and corresponding event #59, closes #46

* Ignore frontend package-lock file

* Connect api (#80)

* search page done

* view seminar and event

* Fix query string construction

* displayed dates and follow/attend both events/seminars

* scroll fix and my events

* manage events done

* suggestions done and scroll 2.0

* Vivian branch seminar (#49)

* Parses input for create event page

* Create event will add to the datebase

* not broken

* Transfer div kind of works

* transfer model should add organizers to db

* fixes for transfer model

* create page event works

* create seminar page can pull event names from database

* trying fetch stuff

* please take the fetch attempt things

* calendar changes that apparently did not get pushed

* create seminar page displays events and it is selectable

* create seminar page connects to the database

* fixes for createSeminar dropdown for events reflect selection and seminar created succesfully

* transfer data div is fixed now it displays last name and it does not display yourself as a selectable user

* create event fixed, pushes two of the current user before

* Transfer data component is fixed, you as the user won't appear on the available organizer list. Event duration is ordered in terms of start date and time then end date and time.

* Transfer data component is fixed, you as the user won't appear on the available organizer list. Event duration is ordered in terms of start date and time then end date and time.

* Create event page now works like the seminar page with the date picker, time picker and transfer component fixed.

* Vivian branch (#71)

* Parses input for create event page

* Create event will add to the datebase

* not broken

* Transfer div kind of works

* transfer model should add organizers to db

* fixes for transfer model

* create page event works

* create seminar page can pull event names from database

* trying fetch stuff

* please take the fetch attempt things

* calendar changes that apparently did not get pushed

* create seminar page displays events and it is selectable

* create seminar page connects to the database

* fixes for createSeminar dropdown for events reflect selection and seminar created succesfully

* transfer data div is fixed now it displays last name and it does not display yourself as a selectable user

* create event fixed, pushes two of the current user before

* Transfer data component is fixed, you as the user won't appear on the available organizer list. Event duration is ordered in terms of start date and time then end date and time.

* Transfer data component is fixed, you as the user won't appear on the available organizer list. Event duration is ordered in terms of start date and time then end date and time.

* Create event page now works like the seminar page with the date picker, time picker and transfer component fixed.

* Vivian branch seminar (#49) (#60)

* Parses input for create event page

* Create event will add to the datebase

* not broken

* Transfer div kind of works

* transfer model should add organizers to db

* fixes for transfer model

* create page event works

* create seminar page can pull event names from database

* trying fetch stuff

* please take the fetch attempt things

* calendar changes that apparently did not get pushed

* create seminar page displays events and it is selectable

* create seminar page connects to the database

* fixes for createSeminar dropdown for events reflect selection and seminar created succesfully

* transfer data div is fixed now it displays last name and it does not display yourself as a selectable user

* create event fixed, pushes two of the current user before

* Transfer data component is fixed, you as the user won't appear on the available organizer list. Event duration is ordered in terms of start date and time then end date and time.

* Transfer data component is fixed, you as the user won't appear on the available organizer list. Event duration is ordered in terms of start date and time then end date and time.

* Create event page now works like the seminar page with the date picker, time picker and transfer component fixed.

* News are no longer all the same date. Newsfeed completed. Create event and seminar has default of FFA if nothing is chosen and decimals are rounded to whole numbers.

* merge fixes 2

* Changes to make newsfeed work that were deleted in last commit of VivianBranch

* helper functions and big fixes

* Connect api (#76)

* search page done

* view seminar and event

* Fix query string construction

* displayed dates and follow/attend both events/seminars

* scroll fix and my events

* manage events done

* suggestions done and scroll 2.0

* helper functions and big fixes

* bugs and profile

* Closes #79, Added announcement root resolver and fixed queryAnnouncementByTypeID to return  all parts of announcements (#82)

* Delete clg


closes #77 
closes #54 
closes #61 
closes #79

api/src/resolvers/announcement.js

@@ -8,6 +8,7 @@ async function queryAnnouncementByTypeID(
 ) {
   var queryStringEnding = "";
   var vals = [id];
+  const results = [];
   if (limit) {
     queryStringEnding += "LIMIT ?";
     vals.push(limit);
@@ -21,10 +22,10 @@ async function queryAnnouncementByTypeID(
 
   if (type === "Event") {
     queryString =
-      "select * from Event_Announcement where event_id = ? ORDER BY date_modified DESC ";
+      "SELECT Event_Announcement.event_id as type_id, Event_Announcement.id as id,Event_Announcement.message as message, Event_Announcement.date_created as date_created, Event_Announcement.date_modified as date_modified, Event.name as type_name, 'event_type' as type FROM(Event_Announcement INNER JOIN Event ON Event_Announcement.event_id = Event.id) WHERE Event_Announcement.event_id = ? ORDER BY date_modified DESC; ";
   } else {
     queryString =
-      "select * from Seminar_Announcement where seminar_id = ? ORDER BY date_modified DESC ";
+      "SELECT Seminar_Announcement.seminar_id as type_id, Seminar_Announcement.id as id,Seminar_Announcement.message as message, Seminar_Announcement.date_created as date_created, Seminar_Announcement.date_modified as date_modified, Seminar.name as type_name, 'event_type' as type FROM(Seminar_Announcement INNER JOIN Seminar ON Seminar_Announcement.seminar_id = Seminar.id) WHERE Seminar_Announcement.seminar_id = ? ORDER BY date_modified DESC; ";
   }
 
   if (queryStringEnding) {
@@ -33,15 +34,23 @@ async function queryAnnouncementByTypeID(
 
   queryString += ";";
 
-  return await db
-    .raw(queryString, vals)
-    .then(res => {
-      return res.rows;
-    })
-    .catch(err => {
-      console.log(err);
-      throw err;
-    });
+  const res = await db.raw(queryString, vals);
+
+  res.rows.forEach(result => {
+    const announcement = {
+      id: result.id,
+      type_id: result.type_id,
+      message: result.message,
+      date_created: result.date_created,
+      date_modified: result.date_modified,
+      type: result.type,
+      type_name: result.type_name
+    };
+
+    results.push(announcement);
+  });
+
+  return results;
 }
 // TODO: add functionality for filtering by following/attending + event/seminar
 async function queryMyAnnouncements(
@@ -63,19 +72,19 @@ async function queryMyAnnouncements(
   }
 
   var queryString = `
-SELECT Event_Announcement.event_id as type_id, Event_Announcement.id as id,Event_Announcement.message as message, 
-    Event_Announcement.date_created as date_created, Event_Announcement.date_modified as date_modified, Event.name as type_name,'event_type' as type 
-	FROM (Event_Announcement INNER JOIN Event_Participation ON Event_Announcement.event_id = Event_Participation.event_id ) 
-		INNER JOIN Event ON Event.id = Event_Participation.event_id  
-	WHERE user_id = ? AND ("attending" = true or "following" = true) 
+SELECT Event_Announcement.event_id as type_id, Event_Announcement.id as id,Event_Announcement.message as message,
+    Event_Announcement.date_created as date_created, Event_Announcement.date_modified as date_modified, Event.name as type_name,'event_type' as type
+	FROM (Event_Announcement INNER JOIN Event_Participation ON Event_Announcement.event_id = Event_Participation.event_id )
+		INNER JOIN Event ON Event.id = Event_Participation.event_id
+	WHERE user_id = ? AND ("attending" = true or "following" = true)
 UNION
-SELECT Seminar_Announcement.seminar_id as type_id, Seminar_Announcement.id as id,Seminar_Announcement.message as message, 
-    Seminar_Announcement.date_created as date_created, Seminar_Announcement.date_modified as date_modified, Seminar.name as type_name, 'seminar_type' as type 
-	FROM(Seminar_Announcement INNER JOIN Seminar_Participation ON Seminar_Announcement.seminar_id = Seminar_Participation.seminar_id) 
-		INNER JOIN seminar ON seminar.id = Seminar_Participation.seminar_id 
-	WHERE user_id = ? AND("attending" = true or "following" = true) 
-    
-order by date_modified desc 
+SELECT Seminar_Announcement.seminar_id as type_id, Seminar_Announcement.id as id,Seminar_Announcement.message as message,
+    Seminar_Announcement.date_created as date_created, Seminar_Announcement.date_modified as date_modified, Seminar.name as type_name, 'seminar_type' as type
+	FROM(Seminar_Announcement INNER JOIN Seminar_Participation ON Seminar_Announcement.seminar_id = Seminar_Participation.seminar_id)
+		INNER JOIN seminar ON seminar.id = Seminar_Participation.seminar_id
+	WHERE user_id = ? AND("attending" = true or "following" = true)
+
+order by date_modified desc
   `;
 
   if (queryStringEnding) {

api/src/resolvers/index.js

@@ -211,6 +211,15 @@ const rootResolvers = {
     picture_path: ({ picture_path }) => picture_path,
     announcements: ({ announcements }) => announcements,
     organizers: ({ organizers }) => organizers
+  },
+  Announcement: {
+    id: ({ id }) => id,
+    type_name: ({ type_name }) => type_name,
+    type_id: ({ type_id }) => type_id,
+    message: ({ message }) => message,
+    date_created: ({ date_created }) => date_created,
+    date_modified: ({ date_modified }) => date_modified,
+    type: ({ type }) => type
   }
 };
 

frontend/src/components/Profile/ProfileEdit.vue

@@ -1,40 +1,46 @@
 <template>
 	<div class="page-profile-edit">
 		<div class="label-switch-box">
-			<span>label: </span>
+			<el-button v-if="!edit" type="primary" @click="onEdit">Edit</el-button>
+			<!-- <span>label: </span>
 			<el-radio-group v-model="labelPosition" size="small">
 				<el-radio-button label="left">Left</el-radio-button>
 				<el-radio-button label="right">Right</el-radio-button>
 				<el-radio-button label="top">Top</el-radio-button>
-			</el-radio-group>
+			</el-radio-group> -->
 		</div>
 
 		<el-form ref="form" :model="form" label-width="120px" :label-position="labelPosition">
 			<el-col>
-				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
-					<el-form-item label="Username">
-						<el-input v-model="form.username"/>
-					</el-form-item>
-				</el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
 					<el-form-item label="Email">
-						<el-input v-model="form.email" type="email"/>
+						<el-input :disabled="!edit" v-model="form.email" type="email"/>
 					</el-form-item>
 				</el-col>
 			</el-col>
 			<el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
 					<el-form-item label="First name">
-						<el-input v-model="form.firstName"/>
+						<el-input :disabled="!edit" v-model="form.firstName"/>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
+					<el-form-item label="Middle name">
+						<el-input :disabled="!edit" v-model="form.middleName"/>
 					</el-form-item>
 				</el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
 					<el-form-item label="Last name">
-						<el-input v-model="form.lastName"/>
+						<el-input :disabled="!edit" v-model="form.lastName"/>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
+					<el-form-item label="Organization">
+						<el-input :disabled="!edit" v-model="form.orgnization"/>
 					</el-form-item>
 				</el-col>
 			</el-col>
-			<el-col>
+			<!-- <el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
 					<el-form-item label="Birthday">
 						<el-date-picker type="date" placeholder="Pick a date" v-model="form.birthday" style="width: 100%;"></el-date-picker>
@@ -48,44 +54,67 @@
 						</el-radio-group>
 					</el-form-item>
 				</el-col>
-			</el-col>
+			</el-col> -->
 			<el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
 					<el-form-item label="Phone">
-						<el-input v-model="form.phone" placeholder="+xx xxx xxx xxxx"/>
+						<el-input :disabled="!edit" v-model="form.phone" placeholder="+1 xxx xxx xxxx"/>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
+					<el-form-item label="LinkedIn">
+						<el-input :disabled="!edit" v-model="form.linkedIn" placeholder="LinkedIn.com">
+							 <template slot="prepend">Http://</template>
+						</el-input>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
+					<el-form-item label="Twitter">
+						<el-input :disabled="!edit" v-model="form.twitter" placeholder="Twitter.com">
+							 <template slot="prepend">Http://</template>
+						</el-input>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
+					<el-form-item label="Facebook">
+						<el-input :disabled="!edit" v-model="form.facebook" placeholder="facebook.com">
+							 <template slot="prepend">Http://</template>
+						</el-input>
 					</el-form-item>
 				</el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
-					<el-form-item label="Website">
-						<el-input v-model="form.website" placeholder="https://"/>
+					<el-form-item label="Instagram">
+						<el-input :disabled="!edit" v-model="form.insta" placeholder="Instagram.com">
+							 <template slot="prepend">Http://</template>
+						</el-input>
 					</el-form-item>
 				</el-col>
 			</el-col>
 			<el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
 					<el-form-item label="Address">
-						<el-input v-model="form.address"/>
+						<el-input :disabled="!edit" v-model="form.address"/>
 					</el-form-item>
 				</el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
 					<el-form-item label="Postal code">
-						<el-input v-model="form.postalCode"/>
+						<el-input :disabled="!edit" v-model="form.postalCode"/>
 					</el-form-item>
 				</el-col>
 			</el-col>
 			<el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
 					<el-form-item label="City">
-						<el-input v-model="form.city"/>
+						<el-input :disabled="!edit" v-model="form.city"/>
 					</el-form-item>
 				</el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
 					<el-form-item label="Country">
-						<el-input v-model="form.country"/>
+						<el-input :disabled="!edit" v-model="form.country"/>
 					</el-form-item>
 				</el-col>
 			</el-col>
-			<el-col>
+			<!-- <el-col>
 				<el-col :span="12" :md="12" :sm="24" :xs="24" class="col-p">
 					<el-form-item label="Hobbies">
 						<el-select
@@ -125,13 +154,13 @@
 					</el-form-item>
 				</el-col>
 			</el-col>
-
+						 -->
 			<el-col class="col-p">
 				<el-form-item label="About me">
-					<el-input type="textarea" v-model="form.aboutMe" autosize></el-input>
+					<el-input  :disabled="!edit" type="textarea" v-model="form.aboutMe" autosize></el-input>
 				</el-form-item>
 			</el-col>
-			<el-col class="col-p">
+			<el-col v-if="edit" class="col-p">
 				<el-form-item>
 					<el-button type="primary" @click="onSubmit">Save</el-button>
 					<el-button>Cancel</el-button>
@@ -147,22 +176,28 @@ export default {
 	name: 'ProfileEdit',
 	data() {
 		return {
+			user: this.$store.state.user,
+			edit: false,
 			form: {
-				username: 'aShenton',
-				email: '[email protected]',
-				firstName: 'Aurora',
-				lastName: 'Shenton',
-				birthday: '1991-02-13T23:00:00.000Z',
-				phone: '',
-				website: '',
-				hobbies: [],
-				skills: ['JavaScript', 'HTML', 'CSS', 'Vue.js'],
+				firstName: this.$store.state.user.first_name,
+				middleName: this.$store.state.user.middle_name,
+				lastName: this.$store.state.user.last_name,
+				email: this.$store.state.user.email,
+				orgnization: this.$store.state.user.orgnization,
+				// birthday: '1991-02-13T23:00:00.000Z',
+				phone: this.$store.state.user.phone_number,
+				linkedIn:this.$store.state.user.linked_in,
+				twitter: this.$store.state.user.twitter,
+				facebook: this.$store.state.user.facebook,
+				insta: this.$store.state.user.instagram,
+				// hobbies: [],
+				// skills: ['JavaScript', 'HTML', 'CSS', 'Vue.js'],
 				gender: 'Female',
 				address: '',
 				city: '',
 				country: '',
 				postalCode: '',
-				aboutMe: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dapibus posuere libero, nec convallis arcu ullamcorper a. Vestibulum diam neque, egestas scelerisque arcu a, fermentum ornare mauris. Ut venenatis vulputate maximus. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur scelerisque quis turpis ac tempus. Quisque dolor dolor, fermentum nec magna eget, fringilla auctor lacus. Aenean sagittis est ac ligula pharetra, quis imperdiet ante dignissim. Ut vehicula nec nisl a pretium. Quisque faucibus auctor viverra. Sed ultricies convallis magna. In blandit eros id efficitur vulputate. Duis efficitur sollicitudin dui non vehicula. Nullam ut eros fermentum, dapibus metus non, accumsan neque. Mauris sed pellentesque felis. Suspendisse viverra risus sit amet congue consectetur.'
+				aboutMe: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dapibus posuere libero, nec convallis arcu ullamcorper a. Vestibulum diam neque, egestas scelerisque arcu a, fermentum ornare mauris. Ut venenatis vulputate maximus. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.'
 			},
 			hobbies: [
 				{
@@ -194,11 +229,28 @@ export default {
 	methods: {
 		onSubmit() {
 			console.log('submit!');
+			this.edit = false
 		},
 		resizeLabelPosition() {
 			if(window.innerWidth <= 768) {
 				this.labelPosition = 'top'	
 			}
+		},
+		onEdit(){
+			this.edit = true
+		},
+		onCancel(){
+			this.firstName = this.$store.state.user.first_name
+			this.middleName = this.$store.state.user.middle_name
+			this.lastName = this.$store.state.user.last_name
+			this.email = this.$store.state.user.email
+			this.orgnization = this.$store.state.user.orgnization
+			this.phone = this.$store.state.user.phone_number
+			this.linkedIn =this.$store.state.user.linked_in
+			this.twitter = this.$store.state.user.twitter
+			this.facebook = this.$store.state.user.facebook
+			this.insta = this.$store.state.user.instagram
+			
 		}
 	},
 	mounted() {

frontend/src/core/nav.vue

@@ -24,7 +24,7 @@
 		<el-menu-item index="/manageevents">
 			<i class="mdi mdi-briefcase"></i><span slot="title">Manage Event</span>
 		</el-menu-item>
-		<el-menu-item index="/not-found">
+		<el-menu-item index="/profile">
 			<i class="mdi mdi-face"></i><span slot="title">Profile</span>
 		</el-menu-item>
 		<el-menu-item index="/not-found">

frontend/src/core/toolbar.vue

@@ -16,7 +16,7 @@
 					<img src="../assets/images/avatar.jpg" class="avatar" alt="avatar">
 				</span>
 				<el-dropdown-menu slot="dropdown">
-					<el-dropdown-item command="/not-found"><i class="mdi mdi-account mr-10"></i> Profile</el-dropdown-item>
+					<el-dropdown-item command="/profile"><i class="mdi mdi-account mr-10"></i> Profile</el-dropdown-item>
 					<el-dropdown-item command="/not-found"><i class="mdi mdi-calendar mr-10"></i> Calendar</el-dropdown-item>
 					<el-dropdown-item command="/logout" divided><i class="mdi mdi-logout mr-10"></i> Logout</el-dropdown-item>
 				</el-dropdown-menu>

frontend/src/router/index.js

@@ -2,7 +2,6 @@ import Vue from 'vue'
 import Router from 'vue-router'
 
 //apps
-import Dashboard from '../views/apps/Dashboard.vue'
 import Calendar from '../views/apps/Calendar.vue'
 import Contacts from '../views/apps/Contacts.vue'
 import Gallery from '../views/apps/Gallery.vue'
@@ -14,7 +13,6 @@ import Register from '../views/pages/authentication/Register.vue'
 import ForgotPassword from '../views/pages/authentication/ForgotPassword.vue'
 import Profile from '../views/pages/Profile.vue'
 import NotFound from '../views/pages/NotFound.vue'
-import Invoice from '../views/pages/Invoice.vue'
 import SearchPage from '../views/pages/Search.vue'
 import EventPage from '../views/pages/Event.vue'
 import SeminarPage from '../views/pages/Seminar.vue'
@@ -246,17 +244,6 @@ const router = new Router({
         tags: ["pages"]
       }
     },
-    {
-      path: "/invoice",
-      name: "invoice",
-      component: Invoice,
-      meta: {
-        auth: true,
-        layout: layouts.navLeft,
-        searchable: true,
-        tags: ["pages"]
-      }
-    },
     {
       path: "/login",
       name: "login",