fix: focus reanme and new dir,file inputs

This commit is contained in:
Jaroslav Rakhmatoullin 2024-04-02 02:33:52 +02:00
parent 0aedbbebac
commit cf540481c2
5 changed files with 17 additions and 4 deletions

View File

@ -11,7 +11,7 @@
type="text" type="text"
@keyup.enter="submit" @keyup.enter="submit"
v-model.trim="name" v-model.trim="name"
v-focus ref="wantInput"
/> />
</div> </div>
@ -61,6 +61,9 @@ export default {
computed: { computed: {
...mapGetters(["isFiles", "isListing"]), ...mapGetters(["isFiles", "isListing"]),
}, },
mounted() {
this.$nextTick(() => setTimeout(() => this.$refs.wantInput.focus(), 100))
},
methods: { methods: {
submit: async function (event) { submit: async function (event) {
event.preventDefault(); event.preventDefault();

View File

@ -8,7 +8,7 @@
<p>{{ $t("prompts.newFileMessage") }}</p> <p>{{ $t("prompts.newFileMessage") }}</p>
<input <input
class="input input--block" class="input input--block"
v-focus ref="wantInput"
type="text" type="text"
@keyup.enter="submit" @keyup.enter="submit"
v-model.trim="name" v-model.trim="name"
@ -51,6 +51,9 @@ export default {
computed: { computed: {
...mapGetters(["isFiles", "isListing"]), ...mapGetters(["isFiles", "isListing"]),
}, },
mounted() {
this.$nextTick(() => setTimeout(() => this.$refs.wantInput.focus(), 100))
},
methods: { methods: {
submit: async function (event) { submit: async function (event) {
event.preventDefault(); event.preventDefault();

View File

@ -93,6 +93,7 @@ export default {
computed: { computed: {
...mapState(["plugins"]), ...mapState(["plugins"]),
...mapGetters(["currentPrompt", "currentPromptName"]), ...mapGetters(["currentPrompt", "currentPromptName"]),
// yes, if the stack of modals/dialogs is not empty
showOverlay: function () { showOverlay: function () {
return ( return (
this.currentPrompt !== null && this.currentPrompt !== null &&

View File

@ -11,7 +11,7 @@
</p> </p>
<input <input
class="input input--block" class="input input--block"
v-focus ref="wantInput"
type="text" type="text"
@keyup.enter="submit" @keyup.enter="submit"
v-model.trim="name" v-model.trim="name"
@ -59,6 +59,10 @@ export default {
...mapState(["req", "selected", "selectedCount"]), ...mapState(["req", "selected", "selectedCount"]),
...mapGetters(["isListing"]), ...mapGetters(["isListing"]),
}, },
mounted() {
this.$nextTick(() => setTimeout(() => this.$refs.wantInput.focus(), 100))
},
methods: { methods: {
cancel: function () { cancel: function () {
this.$store.commit("closeHovers"); this.$store.commit("closeHovers");

View File

@ -9,6 +9,8 @@ const mutations = {
state.show = null; state.show = null;
state.showShell = !state.showShell; state.showShell = !state.showShell;
}, },
// display a modal prompt or a dialog, such as when renaming a file
// opinion: should be renamed to showPrompt or showDialog because "hover" means something else in HTML speak
showHover: (state, value) => { showHover: (state, value) => {
if (typeof value !== "object") { if (typeof value !== "object") {
state.prompts.push({ state.prompts.push({
@ -21,7 +23,7 @@ const mutations = {
} }
state.prompts.push({ state.prompts.push({
prompt: value.prompt, // Should not be null prompt: value.prompt, // Should not be null ('newDir', 'newFile', etc)
confirm: value?.confirm, confirm: value?.confirm,
action: value?.action, action: value?.action,
props: value?.props, props: value?.props,