traductionMenu

kujiu_test

@@ -0,0 +1 @@
+Subproject commit b59e3b608247e8a9cb4f09e81f8a6d878127a241

src/NervTN.vue

@@ -1,18 +1,10 @@
 <script setup>
 import ReloadPWA from './components/ReloadPWA.vue';
 import {useI18n} from 'vue-i18n';
-import NavMessage from './components/message/NavMessage.vue';
 
 const {t} = useI18n({useScope: 'local'});
 </script>
 
-<script>
-export default{
-    components: {NavMessage}
-}
-</script>
-
-
 <template>
     <div id="appflex">
         <div id="page">
@@ -28,8 +20,26 @@ export default{
             <router-view name="Sidebar"></router-view>
         
             <div id="menu">
-                <NavMessage/>
-                <router-view name="navMessage"></router-view>
+                <details>
+        <summary>
+            <span>👤 {{ t('menu.contact') }}</span>
+        </summary>
+        <ul>
+            <li><router-link to="/profil">📝 {{ t('menu.profile') }}</router-link></li>
+            <li><router-link to="">🗒️ {{ t('menu.contacts list') }}</router-link></li>
+        </ul>
+    </details>
+
+    <details>
+        <summary>
+            <span>💬 ✉️ {{ t('menu.messages') }}</span>
+        </summary>
+        <ul>
+            <li><router-link to="/correspondance">📭 {{ t('menu.correspondence') }}</router-link></li>
+            <li><router-link to="/chat">💬 {{ t('menu.chat') }}</router-link></li>
+            <li><router-link to="">🎥 {{ t('menu.video conferencing') }}</router-link></li>
+        </ul>  
+    </details> 
             </div> 
         </div>
     </div>
@@ -42,12 +52,12 @@ export default{
         <div class="nav-menu">
             <details>
                 <summary>
-                <span class="connect">👥 Connexion</span>
+                <span class="connect">👥 {{ t('home.connection') }}</span>
                 </summary>
                 <ul>
-                    <li class="nav-connect"><a href="#">Compte</a></li>
-                    <li class="nav-connect"><a href="#">Tableau de bord</a></li>
-                    <li class="nav-connect"><a href="#">Déconnexion</a></li>
+                    <li><router-link to="/">{{ t('home.account') }}</router-link></li>
+                    <li><router-link to="/">{{ t('home.dashboard') }}</router-link></li>
+                    <li><router-link to="/">{{ t('home.disconnect') }}</router-link></li>
                 </ul>  
             </details>
         </div>    

src/assets/css/sidebar.less

@@ -27,6 +27,14 @@
     font-size: 1.1rem;
     margin: 0.5rem;
     padding: 1rem;
+
+    summary {
+        padding: 10px;
+    }
+
+    li {
+        list-style: none;
+    }
 }
 
 .nav-menu{

src/components/contact/Profil.vue

@@ -1,9 +1,12 @@
+<script setup>
+import {useI18n} from 'vue-i18n';
+const {t} = useI18n({useScope: 'local'});
+</script>
 
 <template>
+<form id="profil" method="POST" v-on:submit="checkForm">
 
-<div class="personalInformation">
- <vue-tabs>
-    <v-tab title="👤 Profil">
+    <div title="👤 Profil">
 		<h1>👤 Profil</h1>
       	<div>
 			<label for="avatar">Avatar</label>
@@ -17,18 +20,17 @@
 
 		<div>
 			<label for="emailHome">Email Personnelle :</label>
-			<input type="email" v-model="home" required>
+			<input type="email" v-model="home" placeholder="john.Doe@email.com" required>
 		</div>
-			
-		 <button @click="persist">Enregistrer</button>
-		
-    </v-tab>
+    </div>
+
 	<br>
-    <v-tab title="📇 Informations personnelles">
+
+    <div title="📇 Informations personnelles">
 		<h1>📇 Informations personnelles</h1>
       	<div>
 			<label for="name">Nom complet :</label>
-			<input type="text" v-model="home" pattern="{a-zA-Z}{4,25}" required>
+			<input type="text" v-model="home" pattern="{a-zA-Z}{4,25}" placeholder="John Doe" required>
 		</div>
 
 		<div>
@@ -38,8 +40,7 @@
 		
         <div>
 			<label for="nbrHome">Numéro de téléphone :</label>
-			<input type="tel" pattern="^((\+\d{1,3}(-| )?\(?\d\)?(-| )?\d{1,5})|(\(?\d{2,6}\)?))(-| )?(\d{3,4})(-| )?(\d{4})(( x| ext)\d{1,5}){0,1}$" 
-			v-model="home">
+			<input type="tel" v-model="home" placeholder="+32(0)15738490" >
 		</div>
 
 		<div class="Home">
@@ -58,13 +59,11 @@
 					<input type="text" v-model="home">
 				</ul>	
 		</div>
+    </div>
 
-		<div>				
-		 <button @click="persist">Enregistrer</button>
-		</div> 
-    </v-tab>
 	<br>
-    <v-tab title="💼 Emploi">
+
+    <div title="💼 Emploi">
 		<h1>💼 Emploi</h1>
       <div>
 			<label for="orgname">Entreprise :</label>
@@ -84,8 +83,7 @@
 		</div>
         <div>
 			<label for="nbrWork">Numéro de téléphone :</label>
-			<input type="tel" pattern="^((\+\d{1,3}(-| )?\(?\d\)?(-| )?\d{1,5})|(\(?\d{2,6}\)?))(-| )?(\d{3,4})(-| )?(\d{4})(( x| ext)\d{1,5}){0,1}$"
-			v-model="work">
+			<input type="tel" v-model="work">
 		</div>
 
         <div class="Work">
@@ -104,30 +102,46 @@
 					<input type="text" v-model="work">
 				</ul>
 		</div>
+				
+		 <button type="submit" value="Submit">Enregistrer</button>
+    </div>
 
-		<div>				
-		 <button @click="persist">Enregistrer</button>
-		</div> 
-    </v-tab>
 	<br>
-	 <v-tab title="✍🏼 Commentaires">
-		 <h1>✍🏼 Commentaires</h1>
+
+	 <div title="✍🏼 À propos / Commentaires">
+		 <h1>✍🏼 À propos / Commentaires</h1>
 		 <div>
 			<label for="comments"></label>
 			<textarea v-model="home"></textarea>
 		</div>
-					
-		 <button @click="persist">Enregistrer</button>
-		
-    </v-tab>
-</vue-tabs>
-</div>
+		  <button @click="persist">Enregistrer</button>
+    </div>
+
+</form>
 
     </template>
 
     <script>
-		/*export default {
-            name: 'personalInformation',
+	/*const profil = new Vue ({	// vue n'est pas définie
+  		el: '#profil',
+  		data: {
+    	home: null,
+		work: null
+    
+  		},
+  		methods:{
+    		checkForm: function (e) {
+      		if (this.home && this.work) {
+        	return true;
+      	}
+      	e.preventDefault();
+    	}
+  		}
+		}); */
+
+
+		/*export default {  //home n'est pas déclarer
+            name: 'profil',
 			setup() {
             home = "",
             work = ""
@@ -147,8 +161,8 @@
 				console.log('ok');
 					}
 				}
-			};
-	*/
+			}; */
+	
     </script>
 
 	<style scoped>
@@ -168,3 +182,6 @@
 			margin-top: 20px;
 		}
 	</style>
+
+<i18n lang="json" locale="en" src="./locale/en.json"/>
+<i18n lang="json" locale="fr" src="./locale/fr.json"/>

src/components/message/ChatBox.vue

@@ -2,10 +2,10 @@
   <form class='chat-box' v-on:submit='onSubmit($event)'>
     <input
         v-model='text'
-        placeholder='Ecrire un message'
+        placeholder='Écrire un message'
         type='text'
     />
-    <button :disabled='text === ""'>Send</button>
+    <button :disabled='text === ""'>Envoyer</button>
   </form>
 </template>
 

src/components/message/NavMessage.vue

@@ -1,35 +0,0 @@
-
-<template>
-    <details>
-        <summary>
-            <span class="onglet">👤 Contact</span>
-        </summary>
-        <ul>
-            <li><router-link to="/profil">📝 Profil</router-link></li>
-            <li><router-link to="">🗒️ Liste des contacts</router-link></li>
-        </ul>
-    </details>
-
-    <details>
-        <summary>
-            <span class="onglet">💬 ✉️ Messages</span>
-        </summary>
-        <ul>
-            <li><router-link to="/correspondance">📭 Correspondance</router-link></li>
-            <li><router-link to="/chat">💬 Chat</router-link></li>
-            <li><router-link to="">🎥 Visioconférence</router-link></li>
-        </ul>  
-    </details>      
- 
-</template>
-
-<style scoped>
-    li {
-        list-style-type: none;
-    }
-
-    details {
-        padding-bottom: 10px;
-    }
-    
-</style>

src/locale/en.json

@@ -9,12 +9,26 @@
         "route_not_found": "Url {route} does not exist."
     },
     "home": {
-        "apps": "Applications"
+        "apps": "Applications",
+        "connection": "Connection",
+        "account":"Account",
+        "dashboard": "Dashboard",
+        "disconnect": "Disconnect"
     },
     "pwa": {
         "ready": "Your applications are ready for offline.",
         "new_content": "New version available!",
         "later": "See later",
         "reload": "Reload app"
+    },
+
+    "menu": {
+        "contact": "Contact",
+        "profile": "Profil",
+        "contacts list": "contacts list",
+        "messages": "Messages",
+        "correspondence": "Correspondence",
+        "chat": "Chat",
+        "video conferencing": "Video conferencing"
     }
 }

src/locale/fr.json

@@ -9,12 +9,26 @@
         "route_not_found": "La route {route} n'existe pas."
     },
     "home": {
-        "apps": "Applications"
+        "apps": "Applications",
+        "connection": "Connexion",
+        "account":"Compte",
+        "dashboard": "Tableau de bord",
+        "disconnect": "Déconnexion"
     },
     "pwa": {
         "ready": "Vous êtes prêts pour le mode hors-ligne.",
         "new_content": "Nouvelle version disponible !",
         "later": "Plus tard",
         "reload": "Recharger"
+    },
+
+    "menu": {
+        "contact": "Contact",
+        "profile ": "Profil",
+        "contacts list": "Liste des contacts",
+        "messages": "Messages",
+        "correspondence": "Correspondence",
+        "chat": "Chat",
+        "video conferencing": "Visioconférence"
     }
 }