feat(frontend): add move buttons to links (fixes #54)
This commit is contained in:
		
							parent
							
								
									21c1c5b0d9
								
							
						
					
					
						commit
						848d0787a5
					
				
					 2 changed files with 46 additions and 0 deletions
				
			
		|  | @ -200,6 +200,17 @@ | |||
|     fields[newIndex] = temp; | ||||
|   }; | ||||
| 
 | ||||
|   const moveLink = (index: number, up: boolean) => { | ||||
|     if (up && index == 0) return; | ||||
|     if (!up && index == links.length - 1) return; | ||||
| 
 | ||||
|     const newIndex = up ? index - 1 : index + 1; | ||||
| 
 | ||||
|     const temp = links[index]; | ||||
|     links[index] = links[newIndex]; | ||||
|     links[newIndex] = temp; | ||||
|   }; | ||||
| 
 | ||||
|   const addName = (event: Event) => { | ||||
|     event.preventDefault(); | ||||
| 
 | ||||
|  | @ -534,6 +545,18 @@ | |||
|     <div class="mt-3"> | ||||
|       {#each links as _, index} | ||||
|         <div class="input-group m-1"> | ||||
|           <IconButton | ||||
|             icon="chevron-up" | ||||
|             color="secondary" | ||||
|             tooltip="Move link up" | ||||
|             click={() => moveLink(index, true)} | ||||
|           /> | ||||
|           <IconButton | ||||
|             icon="chevron-down" | ||||
|             color="secondary" | ||||
|             tooltip="Move link down" | ||||
|             click={() => moveLink(index, false)} | ||||
|           /> | ||||
|           <input type="text" class="form-control" bind:value={links[index]} /> | ||||
|           <IconButton | ||||
|             color="danger" | ||||
|  |  | |||
|  | @ -214,6 +214,17 @@ | |||
|     fields[newIndex] = temp; | ||||
|   }; | ||||
| 
 | ||||
|   const moveLink = (index: number, up: boolean) => { | ||||
|     if (up && index == 0) return; | ||||
|     if (!up && index == links.length - 1) return; | ||||
| 
 | ||||
|     const newIndex = up ? index - 1 : index + 1; | ||||
| 
 | ||||
|     const temp = links[index]; | ||||
|     links[index] = links[newIndex]; | ||||
|     links[newIndex] = temp; | ||||
|   }; | ||||
| 
 | ||||
|   const addName = (event: Event) => { | ||||
|     event.preventDefault(); | ||||
| 
 | ||||
|  | @ -507,6 +518,18 @@ | |||
|     <div class="mt-3"> | ||||
|       {#each links as _, index} | ||||
|         <div class="input-group m-1"> | ||||
|           <IconButton | ||||
|             icon="chevron-up" | ||||
|             color="secondary" | ||||
|             tooltip="Move link up" | ||||
|             click={() => moveLink(index, true)} | ||||
|           /> | ||||
|           <IconButton | ||||
|             icon="chevron-down" | ||||
|             color="secondary" | ||||
|             tooltip="Move link down" | ||||
|             click={() => moveLink(index, false)} | ||||
|           /> | ||||
|           <input type="text" class="form-control" bind:value={links[index]} /> | ||||
|           <IconButton | ||||
|             color="danger" | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue