Merge pull request #115 from Fabszn/open_planning_to_all

add an access to redcoat to the planning screen

front/src/app/components/adminMenu.vue

@@ -55,13 +55,13 @@
         Statistics
       </button>
     </div>
-    <button
+    <!--<button
       type="button"
       class="btn btn-primary block"
       v-on:click="navToDesktopMenu"
     >
       Planning
-    </button>
+    </button>-->
   </div>
 </template>
 
@@ -87,9 +87,6 @@ export default {
     navToMapping: function () {
       this.$router.push("/mappingRC");
     },
-    navToDesktopMenu: function () {
-      this.$router.push("/planning");
-    },
     navToStats: function () {
       this.$router.push("/statistics");
     },

front/src/app/components/mainMenu.vue

@@ -45,7 +45,7 @@
       <button
         type="button"
         class="btn btn-secondary btn-lg block"
-        v-on:click="informations"
+        v-on:click="navToInformations"
       >
         Informations
         <span
@@ -55,6 +55,16 @@
         >
       </button>
     </div>
+    <div>
+      <button
+        type="button"
+        class="btn btn-secondary btn-lg block"
+        v-on:click="navToPlanning"
+      >
+        Planning
+
+      </button>
+    </div>
     <div v-if="adminState">
       <button
         type="button"
@@ -72,7 +82,7 @@ import _ from "lodash";
 export default {
   data() {
     return {
-      adminState: true,
+      adminState: false,
       isUnreadMessage: false,
       nbUnreadMessage: 0,
     };
@@ -106,9 +116,13 @@ export default {
     navToAllActSlots: function () {
       this.$router.push("/allactivesslots");
     },
-    informations: function () {
+    navToInformations: function () {
       this.$router.push("/informations");
     },
+    navToPlanning: function () {
+      this.$router.push("/planning");
+    },
+    
     backDisconnect: function () {
       shared.cleanToken();
       this.$store.commit("setUsername", "");

front/src/app/components/desktop/planning.vue → front/src/app/components/planning.vue

@@ -30,15 +30,18 @@
 
                 <div
                   v-on:click="show(slot.slot.slotId, slot.user)"
-                  v-bind:class="isAffected(slot.user)"
+                  v-bind:class="isAffectedClass(slot.user)"
                   class="block"
                   v-for="slot in room.slots"
                   :key="slot.slot.slotId"
                 >
-                  {{ slot.slot.fromTime }}
-                  {{ slot.slot.toTime }}
+                  <div v-if="isSlotShouldBeDisplay(slot.user)">
+                    {{ slot.slot.fromTime }}
+                    {{ slot.slot.toTime }}
 
-                  <div class="affected">{{ displayUser(slot.user) }}</div>
+                    <div class="affected">{{ displayUser(slot.user) }}</div>
+                  </div>
+                  <div v-else></div>
                 </div>
               </div>
             </div>
@@ -54,15 +57,18 @@
 
                 <div
                   v-on:click="show(slot.slot.slotId, slot.user)"
-                  v-bind:class="isAffected(slot.user)"
+                  v-bind:class="isAffectedClass(slot.user)"
                   class="block"
                   v-for="slot in room.slots"
                   :key="slot.slot.slotId"
                 >
-                  {{ slot.slot.fromTime }}
-                  {{ slot.slot.toTime }}
+                  <div v-if="isSlotShouldBeDisplay(slot.user)">
+                    {{ slot.slot.fromTime }}
+                    {{ slot.slot.toTime }}
 
-                  <div class="affected">{{ displayUser(slot.user) }}</div>
+                    <div class="affected">{{ displayUser(slot.user) }}</div>
+                  </div>
+                  <div v-else></div>
                 </div>
               </div>
             </div>
@@ -77,15 +83,18 @@
 
                 <div
                   v-on:click="show(slot.slot.slotId, slot.user)"
-                  v-bind:class="isAffected(slot.user)"
+                  v-bind:class="isAffectedClass(slot.user)"
                   class="block"
                   v-for="slot in room.slots"
                   :key="slot.slot.slotId"
                 >
-                  {{ slot.slot.fromTime }}
-                  {{ slot.slot.toTime }}
+                  <div v-if="isSlotShouldBeDisplay(slot.user)">
+                    {{ slot.slot.fromTime }}
+                    {{ slot.slot.toTime }}
 
-                  <div class="affected">{{ displayUser(slot.user) }}</div>
+                    <div class="affected">{{ displayUser(slot.user) }}</div>
+                  </div>
+                  <div v-else></div>
                 </div>
               </div>
             </div>
@@ -100,15 +109,18 @@
 
                 <div
                   v-on:click="show(slot.slot.slotId, slot.user)"
-                  v-bind:class="isAffected(slot.user)"
+                  v-bind:class="isAffectedClass(slot.user)"
                   class="block"
                   v-for="slot in room.slots"
                   :key="slot.slot.slotId"
                 >
-                  {{ slot.slot.fromTime }}
-                  {{ slot.slot.toTime }}
+                  <div v-if="isSlotShouldBeDisplay(slot.user)">
+                    {{ slot.slot.fromTime }}
+                    {{ slot.slot.toTime }}
 
-                  <div class="affected">{{ displayUser(slot.user) }}</div>
+                    <div class="affected">{{ displayUser(slot.user) }}</div>
+                  </div>
+                  <div v-else></div>
                 </div>
               </div>
             </div>
@@ -126,15 +138,17 @@
 
                 <div
                   v-on:click="show(slot.slot.slotId, slot.user)"
-                  v-bind:class="isAffected(slot.user)"
+                  v-bind:class="isAffectedClass(slot.user)"
                   class="block"
                   v-for="slot in room.slots"
                   :key="slot.slot.slotId"
                 >
-                  {{ slot.slot.fromTime }}
-                  {{ slot.slot.toTime }}
+                  <div v-if="isSlotShouldBeDisplay(slot.user)">
+                    {{ slot.slot.fromTime }}
+                    {{ slot.slot.toTime }}
 
-                  <div class="affected">{{ displayUser(slot.user) }}</div>
+                    <div class="affected">{{ displayUser(slot.user) }}</div>
+                  </div>
                 </div>
               </div>
             </div>
@@ -154,22 +168,28 @@
               {{ actualUserNameSelected }}
             </p>
           </div>
-          <div>
+          <div v-if="adminState">
             <v-select :options="users" v-model="selectedUser"></v-select>
           </div>
         </div>
 
         <div class="buttonmodal">
           <button type="button" v-on:click="hide" class="btn btn-secondary">
-            Cancel
+            Close
           </button>
-          <button type="button" v-on:click="remove" class="btn btn-secondary">
+          <button
+            type="button"
+            v-on:click="remove"
+            class="btn btn-secondary"
+            v-if="adminState"
+          >
             Remove
           </button>
           <button
             type="button"
             v-on:click="saveMapping"
             class="btn btn-secondary"
+            v-if="adminState"
           >
             Save
           </button>
@@ -180,8 +200,8 @@
 </template>
 
 <script lang="ts">
-import shared from "../../shared";
-import { User, Conference, Mapping } from "../../models";
+import shared from "../shared";
+import { User, Conference, Mapping } from "../models";
 import _ from "lodash";
 import { defineComponent, ref } from "vue";
 import { Tabs, Tab } from "vue3-tabs-component";
@@ -192,11 +212,13 @@ export default defineComponent({
     const toast = useToast();
     const selectedUser = ref(null);
     const users = ref(new Array<User>());
+    const adminState = false;
 
     return {
       selectedUser,
       users,
       toast,
+      adminState,
     };
   },
   components: {
@@ -211,12 +233,15 @@ export default defineComponent({
       currentConf: new Conference(),
     };
   },
+  mounted() {
+    this.adminState = shared.readAdminEtat();
+  },
   created: function () {
     loadPlanning.bind(this)();
   },
   methods: {
     backMenu: function () {
-      this.$router.push("/adminMenu");
+      this.$router.push("/menu");
     },
     getUserId: function (user) {
       if (_.isNull(user)) {
@@ -225,17 +250,20 @@ export default defineComponent({
         user.userId;
       }
     },
-    isAffected: function (user) {
+    isAffectedClass: function (user) {
       var userIdVal = "NoData";
       if (!_.isNull(user)) {
         userIdVal = user.userId;
       }
       return {
         affectedBox: !_.isNull(user),
         userIdVal: !_.isNull(user),
+        blockColor: _.isNull(user) && this.adminState,
       };
-
-      //
+    },
+    isSlotShouldBeDisplay: function (user) {
+      //if no user and mode admin then hide block
+      return (_.isNull(user) && this.adminState) || !_.isNull(user);
     },
     displayUser: function (user) {
       if (_.isNull(user)) {
@@ -357,7 +385,6 @@ function loadPlanning() {
 </script>
 
 <style  scoped>
-
 .header {
   display: flex;
   background-color: #61bf9b;
@@ -368,8 +395,10 @@ function loadPlanning() {
   justify-content: center;
 }
 
-.block {
+.blockColor {
   background-color: #3399ff;
+}
+.block {
   padding: 14px 28px;
   font-size: 16px;
   cursor: pointer;
@@ -404,7 +433,7 @@ function loadPlanning() {
   color: cornsilk;
   justify-content: center;
 }
-@media  screen and (max-width: 600px) {
+@media screen and (max-width: 600px) {
   .header {
     display: flex;
     background-color: #61bf9b;
@@ -416,7 +445,6 @@ function loadPlanning() {
   }
 
   .block {
-    background-color: #3399ff;
     padding: 7px 14px;
     font-size: 13px;
     cursor: pointer;

front/src/app/routeur-config.js

@@ -7,7 +7,7 @@ import adminmenu from './components/adminMenu.vue'
 import filling from './components/admins/filling.vue'
 import mappingRCR from './components/admins/mappingRCR.vue'
 import mySlots from './components/mySlots.vue'
-import planning from './components/desktop/planning.vue'
+import planning from './components/planning.vue'
 import allactivesslots from './components/AllActiveSlots.vue'
 import statistiques from './components/admins/statistiques.vue'
 import informations from './components/informations.vue'