added event to detect when control and enter are pressed to confirm it. Also escape now escapes the window
This commit is contained in:
		
							parent
							
								
									9cf40ef452
								
							
						
					
					
						commit
						ecbe595b34
					
				
					 1 changed files with 11 additions and 1 deletions
				
			
		| 
						 | 
					@ -17,7 +17,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 | 
				
			||||||
	<template #header>{{ i18n.ts.describeFile }}</template>
 | 
						<template #header>{{ i18n.ts.describeFile }}</template>
 | 
				
			||||||
	<MkSpacer :marginMin="20" :marginMax="28">
 | 
						<MkSpacer :marginMin="20" :marginMax="28">
 | 
				
			||||||
		<MkDriveFileThumbnail :file="file" fit="contain" style="height: 193px; margin-bottom: 16px;"/>
 | 
							<MkDriveFileThumbnail :file="file" fit="contain" style="height: 193px; margin-bottom: 16px;"/>
 | 
				
			||||||
		<MkTextarea v-model="caption" autofocus :placeholder="i18n.ts.inputNewDescription">
 | 
							<MkTextarea v-model="caption" autofocus :placeholder="i18n.ts.inputNewDescription" @keydown="onKeydown($event)">
 | 
				
			||||||
			<template #label>{{ i18n.ts.caption }}</template>
 | 
								<template #label>{{ i18n.ts.caption }}</template>
 | 
				
			||||||
		</MkTextarea>
 | 
							</MkTextarea>
 | 
				
			||||||
	</MkSpacer>
 | 
						</MkSpacer>
 | 
				
			||||||
| 
						 | 
					@ -46,6 +46,16 @@ const dialog = shallowRef<InstanceType<typeof MkModalWindow>>();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const caption = ref(props.default);
 | 
					const caption = ref(props.default);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					function onKeydown(ev: KeyboardEvent) {
 | 
				
			||||||
 | 
						if (ev.key === 'Enter' && (ev.ctrlKey || ev.metaKey)) ok();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						if (ev.key === 'Escape') {
 | 
				
			||||||
 | 
							emit('closed');
 | 
				
			||||||
 | 
							dialog.value?.close();
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
async function ok() {
 | 
					async function ok() {
 | 
				
			||||||
	emit('done', caption.value);
 | 
						emit('done', caption.value);
 | 
				
			||||||
	dialog.value?.close();
 | 
						dialog.value?.close();
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue