Shaalikaaa

src/components/AddUserQuestion.vue

@@ -0,0 +1,135 @@
+<template>
+  <v-row justify="center">
+    <v-dialog v-model="dialog" persistent max-width="600px">
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" class="abc" dark v-on="on">Add Question</v-btn>
+      </template>
+      <v-card>
+
+        <v-card-text>
+          <v-container>
+            <v-row>
+              <v-col cols="12" sm="6" md="4">
+                  <span> Category: </span>
+         <select class="xyz" v-model="category"  @change="changeCategory($event)">
+        <option value="Fiction" selected>Fiction</option>
+        <option value="Non-Fiction">Non-Fiction</option>
+        <option value="Poetry">Poetry</option>
+        <option value="Short-stories">Short-stories</option>
+        <option value="Clothing">Clothing</option>
+        <option value="Footwear">Footwear</option>
+        <option value="Watches">Watches</option>
+        <option value="Accessories">Accessories</option>
+        <option value="Coding">Coding</option>
+        <option value="Android">Android</option>
+        <option value="iOS">iOS</option>
+        <option value="Bollywood">Bollywood</option>
+        <option value="Hollywood">Hollywood</option>
+        <option value="Tollywood">Tollywood</option>
+        <option value="Punjabi">Punjabi</option>
+        <option value="NorthIndian">NorthIndian</option>
+        <option value="SouthIndian">SouthIndian</option>
+        <option value="Italian">Italian</option>
+        <option value="Chinese">Chinese</option>
+        <option value="Football">Football</option>
+        <option value="Cricket">Cricket</option>
+        <option value="Badminton">Badminton</option>
+        <option value="Tennis">Tennis</option>
+        <!-- <option v-for="item in Category" v-bind:key="item.id" :value="item.id" >{{item.name}}</option> -->
+    </select>
+              </v-col>
+            <v-col cols="12">
+                <v-text-field placeholder="Ask Question" type="text" required v-model="text1"> </v-text-field>
+              </v-col>
+              <v-col cols="12">
+                <v-text-field placeholder="@username" label="TAG" type="text" required v-model="text2"></v-text-field>
+              </v-col>
+              <v-col cols="12" sm="6">
+              </v-col>
+            </v-row>
+          </v-container>
+        </v-card-text>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn color="blue darken-1" text v-on:click="dialog = false" @click="cancel()">Cancel</v-btn>
+          <v-btn color="blue darken-1" text v-on:click="dialog = false" @click="submitClicked()">Submit</v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  </v-row>
+</template>
+<script>
+  export default {
+    name: "Userprofile",
+    data: () => ({
+        return:{
+    //    Category: [
+    //             {
+    //                 id: 1,
+    //                 name: "sports"
+    //             },
+    //             {
+    //                 id: 2,
+    //                 name: "Quora"
+    //             },
+    //             {
+    //                 id: 3,
+    //                 name: "Quiz"
+    //             }
+    //         ],
+    },
+      dialog: false,
+      text1:'',
+      text2: '',
+    }),
+
+     methods: {
+        submitClicked() {
+        let userid=localStorage.getItem("userId");
+        this.$store.dispatch("addQuestion", {
+        questionBody: this.text1,
+        categoryId: this.category,
+        userId: userid,
+        orgId: null
+        })
+    },
+        cancel(){
+             let data = {
+                text1:this.text1,
+                text2: this.text2  
+            }
+             this.$store.dispatch('Userprofile', {
+                data: data,
+                success: function () {
+                    window.console.log('login successful...');
+                },
+                fail: function () {
+                    window.console.log('login failed ...');
+                }
+            })
+        } 
+     }
+  }
+
+
+
+    // data: function () {
+    // return {
+
+    // }
+    // }
+
+
+</script>
+<style scoped> 
+/* .abc{
+  margin-left: 800px;
+  margin-bottom: -95px;
+
+  margin-top: -50px;
+}  */
+.xyz{
+  margin-left: 0px;
+  background-color: skyblue;
+}
+</style>

src/components/Answer.vue

@@ -26,7 +26,8 @@
 </template>
 <script>
 export default {
-  name: "answer"
+  name: "answer",
+  props: ["questionDetails"]
 };
 </script>
 <style scoped>

src/components/LandingQuestion.vue

@@ -1,28 +1,29 @@
 <template>
-    <div class="click-question">
-        <div class="repeat" v-for="(item,index) in products" :key="index" @click="viewQuestion">
+  <div id="item-cards" class="flex">
+    <div class="repeat" v-for="(item,index) in question.data" :key="index">
+      <div class="click-question">
         <h4>QUESTION</h4>
-        <h5>What is India's capital?? {{item.question}}</h5>
-        </div>
+        <h5>{{item.questionBody}}</h5>
+        <v-btn class="view-button" @click="viewQuestion(item.questionId)">View</v-btn>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
 export default {
-    name: "landingquestion",
-    methods : {
-        viewQuestion(){
-            this.$router.push("/viewquestion")
-        }
-    },
-
-    props: ["question"]
-}
+  name: "landingquestion",
+  methods: {
+    viewQuestion(questionId) {
+      this.$router.push("/viewquestion/" + questionId);
+    }
+  },
+  props: ["question"]
+};
 </script>
 
 <style>
-
-.click-question{
+.click-question {
   border: 3px solid black;
   margin-left: 350px;
   margin-right: 350px;
@@ -31,8 +32,11 @@ export default {
   margin-top: 80px;
 }
 
-.abc{
+.abc {
   margin-left: 300px;
 }
 
+.view-button {
+  background-color: red;
+}
 </style>

src/components/OrganizationDescription.vue

@@ -1,6 +1,6 @@
 <template>
 <div class="organization-desc">
-  <v-app id="inspire">
+  <v-app id="organizationdesc">
     <v-card
       class="mx-auto"
       outlined
@@ -9,14 +9,13 @@
       <v-list-item three-line>
         <v-list-item-content>
           <div class="overline mb-4">Profile</div>
-          <v-list-item-title class="headline mb-1">NAME: </v-list-item-title>
+          <v-list-item-title class="headline mb-1">NAME: {{getOrganizationDetails.data.organizationName}}</v-list-item-title>
           <br><br><br>
           <div class="follower">
-              <span class="border">Followers: </span>
-              <span class="border">Following: </span>
+              <span class="border">Followers: {{getOrganizationDetails.data.organizationFollowers.length}} </span>
           </div>
           <br>
-          <v-list-item-subtitle id="subtitle">Members:</v-list-item-subtitle>
+          <v-list-item-subtitle id="subtitle">Members: {{getOrganizationDetails.data.organizationMembers}}</v-list-item-subtitle>
         </v-list-item-content>
 
         <v-list-item-avatar
@@ -39,7 +38,14 @@
 </div>
 </template>
 
-
+<script>
+import { mapGetters } from 'vuex'
+export default {
+  computed: {
+    ...mapGetters(["getOrganizationDetails"])
+  }
+}
+</script>
 
 <style scoped>
 .border{
@@ -66,4 +72,7 @@ box-shadow: 4px 4px 15px 0px black;
 .join-button{
     width:30%
 }
+#organizationdesc {
+  background-color: #EAEDED;
+}
 </style>

src/components/ProfileDescription.vue

@@ -1,6 +1,6 @@
 <template>
 <div class="profile-desc">
-  <v-app id="inspire">
+  <v-app id="profiledesc">
     <v-card
       class="mx-auto"
       outlined
@@ -9,14 +9,14 @@
       <v-list-item three-line>
         <v-list-item-content>
           <div class="overline mb-4">Profile</div>
-          <v-list-item-title class="headline mb-1">NAME: </v-list-item-title>
+          <v-list-item-title class="headline mb-1">NAME: {{userDetails.data.name}}</v-list-item-title>
           <br><br><br>
           <div class="follower">
-              <span class="border">Followers: </span>
-              <span class="border">Following: </span>
+              <span class="border">Followers: {{userDetails.data.followersCount}}</span>
+              <span class="border">Following: {{userDetails.data.followingCount}} </span>
           </div>
           <br>
-          <v-list-item-subtitle id="subtitle">E-mail:</v-list-item-subtitle>
+          <v-list-item-subtitle id="subtitle">E-mail: {{userDetails.data.userEmail}}</v-list-item-subtitle>
         </v-list-item-content>
 
         <v-list-item-avatar
@@ -30,7 +30,7 @@
         >
         </v-list-item-avatar>
       </v-list-item>
-      <v-card-actions>
+      <v-card-actions v-if="myProfile==false">
         <v-btn text class="follow-button">Follow</v-btn>
       </v-card-actions>
     </v-card>
@@ -41,10 +41,11 @@
 <script>
 export default {
   data() {
-    return{
-
+    return {
+        myProfile: false
     }
-  }
+  },
+  props: ["userDetails"]
 }
 </script>
 
@@ -70,4 +71,10 @@ box-shadow: 4px 4px 15px 0px black;
 #desc-card{
     width: 74%;
 }
+#profiledesc {
+  background-color: #EAEDED;
+}
+.follow-button:hover {
+  color: #83677B
+}
 </style>