feat: copy link
This commit is contained in:
		
							parent
							
								
									5bd5748706
								
							
						
					
					
						commit
						acac6402d7
					
				
					 1 changed files with 62 additions and 31 deletions
				
			
		|  | @ -132,17 +132,13 @@ | ||||||
|     // Show the teacher, copying of the code was a successs |     // Show the teacher, copying of the code was a successs | ||||||
|     const copied = ref(false); |     const copied = ref(false); | ||||||
| 
 | 
 | ||||||
|     // Copy the generated code to the clipboard |     async function copyToClipboard(code: string, isDialog: boolean = false, isLink: boolean = false): Promise<void> { | ||||||
|     async function copyToClipboard(): Promise<void> { |         const content = isLink ? `${window.location.origin}/user/class?code=${code}` : code; | ||||||
|         await navigator.clipboard.writeText(code.value); |         await navigator.clipboard.writeText(content); | ||||||
|         copied.value = true; |         copied.value = isDialog; | ||||||
|     } |  | ||||||
| 
 | 
 | ||||||
|     async function copyCode(selectedCode: string): Promise<void> { |         if (!isDialog) | ||||||
|         code.value = selectedCode; |             showSnackbar(t("copied"), "white"); | ||||||
|         await copyToClipboard(); |  | ||||||
|         showSnackbar(t("copied"), "white"); |  | ||||||
|         copied.value = false; |  | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     // Custom breakpoints |     // Custom breakpoints | ||||||
|  | @ -235,20 +231,25 @@ | ||||||
|                                             </v-btn> |                                             </v-btn> | ||||||
|                                         </td> |                                         </td> | ||||||
|                                         <td> |                                         <td> | ||||||
|                                             <v-btn |                                             <v-row v-if="!isMdAndDown" dense align="center" no-gutters> | ||||||
|                                                 v-if="!isMdAndDown" |                                                 <v-btn | ||||||
|                                                 variant="text" |                                                     variant="text" | ||||||
|                                                 append-icon="mdi-content-copy" |                                                     append-icon="mdi-content-copy" | ||||||
|                                                 @click="copyCode(c.id)" |                                                     @click="copyToClipboard(c.id)" | ||||||
|                                             > |                                                 > | ||||||
|                                                 {{ c.id }} |                                                     {{ c.id }} | ||||||
|                                             </v-btn> |                                                 </v-btn> | ||||||
|                                             <span |                                                 <v-btn | ||||||
|                                                 v-else |                                                     icon | ||||||
|                                                 style="cursor: pointer" |                                                     variant="text" | ||||||
|                                                 @click="openCodeDialog(c.id)" |                                                     @click="copyToClipboard(c.id, false, true)" | ||||||
|                                                 ><v-icon icon="mdi-eye"></v-icon |                                                 > | ||||||
|                                             ></span> |                                                     <v-icon>mdi-link-variant</v-icon> | ||||||
|  |                                                 </v-btn> | ||||||
|  |                                             </v-row> | ||||||
|  |                                             <span v-else style="cursor: pointer" @click="openCodeDialog(c.id)"> | ||||||
|  |                                                 <v-icon icon="mdi-eye"></v-icon> | ||||||
|  |                                             </span> | ||||||
|                                         </td> |                                         </td> | ||||||
| 
 | 
 | ||||||
|                                         <td>{{ c.students.length }}</td> |                                         <td>{{ c.students.length }}</td> | ||||||
|  | @ -310,14 +311,29 @@ | ||||||
|                                         max-width="400px" |                                         max-width="400px" | ||||||
|                                     > |                                     > | ||||||
|                                         <v-card> |                                         <v-card> | ||||||
|                                             <v-card-title class="headline">code</v-card-title> |                                             <v-card-title class="headline">{{ t("code") }}</v-card-title> | ||||||
|                                             <v-card-text> |                                             <v-card-text> | ||||||
|                                                 <v-text-field |                                                 <v-text-field | ||||||
|                                                     v-model="code" |                                                     v-model="code" | ||||||
|                                                     readonly |                                                     readonly | ||||||
|                                                     append-inner-icon="mdi-content-copy" |                                                 > | ||||||
|                                                     @click:append-inner="copyToClipboard" |                                                     <template #append> | ||||||
|                                                 ></v-text-field> |                                                         <v-btn | ||||||
|  |                                                             icon | ||||||
|  |                                                             variant="text" | ||||||
|  |                                                             @click="copyToClipboard(code, true)" | ||||||
|  |                                                         > | ||||||
|  |                                                             <v-icon>mdi-content-copy</v-icon> | ||||||
|  |                                                         </v-btn> | ||||||
|  |                                                         <v-btn | ||||||
|  |                                                             icon | ||||||
|  |                                                             variant="text" | ||||||
|  |                                                             @click="copyToClipboard(code, true, true)" | ||||||
|  |                                                         > | ||||||
|  |                                                             <v-icon>mdi-link-variant</v-icon> | ||||||
|  |                                                         </v-btn> | ||||||
|  |                                                     </template> | ||||||
|  |                                                 </v-text-field> | ||||||
|                                                 <v-slide-y-transition> |                                                 <v-slide-y-transition> | ||||||
|                                                     <div |                                                     <div | ||||||
|                                                         v-if="copied" |                                                         v-if="copied" | ||||||
|  | @ -469,9 +485,24 @@ | ||||||
|                     <v-text-field |                     <v-text-field | ||||||
|                         v-model="selectedCode" |                         v-model="selectedCode" | ||||||
|                         readonly |                         readonly | ||||||
|                         append-inner-icon="mdi-content-copy" |                     > | ||||||
|                         @click:append-inner="copyToClipboard" |                         <template #append> | ||||||
|                     ></v-text-field> |                             <v-btn | ||||||
|  |                                 icon | ||||||
|  |                                 variant="text" | ||||||
|  |                                 @click="copyToClipboard(selectedCode, true)" | ||||||
|  |                             > | ||||||
|  |                                 <v-icon>mdi-content-copy</v-icon> | ||||||
|  |                             </v-btn> | ||||||
|  |                             <v-btn | ||||||
|  |                                 icon | ||||||
|  |                                 variant="text" | ||||||
|  |                                 @click="copyToClipboard(selectedCode, true, true)" | ||||||
|  |                             > | ||||||
|  |                                 <v-icon>mdi-link-variant</v-icon> | ||||||
|  |                             </v-btn> | ||||||
|  |                         </template> | ||||||
|  |                     </v-text-field> | ||||||
|                     <v-slide-y-transition> |                     <v-slide-y-transition> | ||||||
|                         <div |                         <div | ||||||
|                             v-if="copied" |                             v-if="copied" | ||||||
|  |  | ||||||
		Reference in a new issue
	
	 Gabriellvl
						Gabriellvl