github
/
halo
mirror of https://github.com/halo-dev/halo
1
0
Fork 0
Code Issues Releases Wiki Activity

feat: add shortcut support for user editing form 

Signed-off-by: Ryan Wang <i@ryanc.cc>
pull/3445/head
Ryan Wang 2022-07-27 10:44:50 +08:00
parent 12d4135d69
commit 977ee0208c
1 changed files with 27 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/modules/system/users/components/UserEditingModal.vue
View File

@ -6,16 +6,18 @@ import type { Role, User } from "@halo-dev/api-client";
import { import {
IconCodeBoxLine, IconCodeBoxLine,
IconEye, IconEye,
IconSave,
VButton, VButton,
VCodemirror, VCodemirror,
VModal, VModal,
VSpace,
} from "@halo-dev/components"; } from "@halo-dev/components";
import { v4 as uuid } from "uuid"; import { v4 as uuid } from "uuid";
import { roleLabels } from "@/constants/labels"; import { roleLabels } from "@/constants/labels";
import { rbacAnnotations } from "@/constants/annotations"; import { rbacAnnotations } from "@/constants/annotations";
import YAML from "yaml"; import YAML from "yaml";
import cloneDeep from "lodash.clonedeep"; import cloneDeep from "lodash.clonedeep";
import { useMagicKeys } from "@vueuse/core";
import { submitForm } from "@formkit/core";
const props = defineProps({ const props = defineProps({
visible: { visible: {
@ -82,7 +84,20 @@ const basicRoles = computed(() => {
); );
}); });
const { Command_Enter } = useMagicKeys();
watch(props, (newVal) => { watch(props, (newVal) => {
let keyboardWatcher;
if (newVal.visible) {
keyboardWatcher = watch(Command_Enter, (v) => {
if (v) {
submitForm("user-form");
}
});
} else {
keyboardWatcher?.unwatch();
}
if (newVal.visible && props.user) { if (newVal.visible && props.user) {
formState.value.user = cloneDeep(props.user); formState.value.user = cloneDeep(props.user);
return; return;
@ -148,6 +163,7 @@ const handleRawModeChange = () => {
formState.value.user = YAML.parse(formState.value.raw); formState.value.user = YAML.parse(formState.value.raw);
} }
}; };
onMounted(handleFetchRoles); onMounted(handleFetchRoles);
</script> </script>
<template> <template>
@ -223,16 +239,16 @@ onMounted(handleFetchRoles);
</FormKit> </FormKit>
</div> </div>
<template #footer> <template #footer>
<VButton <VSpace>
:loading="formState.saving" <VButton
type="secondary" :loading="formState.saving"
@click="$formkit.submit('user-form')" type="secondary"
> @click="$formkit.submit('user-form')"
<template #icon> >
<IconSave class="h-full w-full" /> 保存 ⌘ + ↵
</template> </VButton>
保存 <VButton @click="handleVisibleChange(false)">取消 Esc</VButton>
</VButton> </VSpace>
</template> </template>
</VModal> </VModal>
</template> </template>