settings: unify W axis save into master Save button

- Drop the in-form 'Save W Axis Settings' button. The Svelte
  WAxisSettings component now listens for a global onefin:save-all
  event and PUTs aux/config/save when fired.
- Vue root's save() dispatches that event after saving config.json,
  so a single click of the master Save button persists both the
  controller config and aux.json atomically.
- Editing any W axis field triggers onefin:dirty, which the Vue
  root catches to set modified=true so the master Save lights up
  with the unsaved-changes indicator.
This commit is contained in:
muehe
2026-05-01 14:28:15 +02:00
parent 19e6cc6c93
commit 6fe2e79bff
2 changed files with 45 additions and 25 deletions

View File

@@ -369,6 +369,13 @@ module.exports = new Vue({
ready: function() { ready: function() {
window.onhashchange = () => this.parse_hash(); window.onhashchange = () => this.parse_hash();
// Embedded Svelte subviews (W axis settings, etc.) signal
// unsaved changes via this event. The master Save button
// highlights when modified is true.
window.addEventListener("onefin:dirty", () => {
this.modified = true;
});
// Resolve the initial route before the websocket connects so // Resolve the initial route before the websocket connects so
@@ -673,9 +680,16 @@ module.exports = new Vue({
this.config["selected-tool-settings"][selected_tool] = settings; this.config["selected-tool-settings"][selected_tool] = settings;
this.display_units = this.config.settings["units"]; this.display_units = this.config.settings["units"];
try { try {
await api.put("config/save", this.config); await api.put("config/save", this.config);
// Notify any embedded Svelte subviews that own their
// own persistence (W axis -> aux.json, etc.) that
// the user just hit the master Save button. They
// listen for `onefin:save-all` and PUT their state.
try {
window.dispatchEvent(new CustomEvent("onefin:save-all"));
} catch (_e) {}
this.modified = false; this.modified = false;
} catch (error) { } catch (error) {
console.error("Save failed:", error); console.error("Save failed:", error);

View File

@@ -31,10 +31,19 @@
let cfg: AuxConfig | null = null; let cfg: AuxConfig | null = null;
let status: { enabled: boolean; present: boolean; homed: boolean; pos_mm: number } | null = null; let status: { enabled: boolean; present: boolean; homed: boolean; pos_mm: number } | null = null;
let busy = false; let busy = false;
let saveMessage = "";
// Listen for the global "save-all" event the Vue root dispatches
// when the user clicks the master Save button. We persist our
// current cfg the same way the in-form button used to. This way
// the user only ever needs one Save button.
function onGlobalSave() {
save().catch(e => console.error("aux save failed:", e));
}
onMount(async () => { onMount(async () => {
await refresh(); await refresh();
window.addEventListener("onefin:save-all", onGlobalSave);
return () => window.removeEventListener("onefin:save-all", onGlobalSave);
}); });
async function refresh() { async function refresh() {
@@ -49,19 +58,28 @@
async function save() { async function save() {
if (!cfg) return; if (!cfg) return;
busy = true; busy = true;
saveMessage = "";
try { try {
await api.PUT("aux/config/save", cfg); await api.PUT("aux/config/save", cfg);
saveMessage = "Saved.";
await refresh(); await refresh();
setTimeout(() => (saveMessage = ""), 3000);
} catch (e) { } catch (e) {
console.error("Failed to save aux config:", e); console.error("Failed to save aux config:", e);
saveMessage = "Save failed - see console."; throw e;
} finally { } finally {
busy = false; busy = false;
} }
} }
// Mark the root config as modified whenever a W axis field is
// edited, so the master Save button highlights and the user knows
// there are unsaved changes.
function markDirty() {
try {
const root = (window as any).$root || (window as any).Vue?.root;
if (root && "modified" in root) root.modified = true;
} catch (_e) {}
// Also dispatch a generic event the Vue root listens for.
window.dispatchEvent(new CustomEvent("onefin:dirty"));
}
</script> </script>
<div class="w-axis-settings"> <div class="w-axis-settings">
@@ -85,7 +103,7 @@
{/if} {/if}
</div> </div>
<div class="pure-form pure-form-aligned"> <div class="pure-form pure-form-aligned" on:input={markDirty} on:change={markDirty}>
<fieldset> <fieldset>
<div class="pure-control-group" title="Enable the auxcnc W axis. Edit aux.json to toggle."> <div class="pure-control-group" title="Enable the auxcnc W axis. Edit aux.json to toggle.">
<label for="enabled">enabled</label> <label for="enabled">enabled</label>
@@ -206,25 +224,13 @@
</div> </div>
</fieldset> </fieldset>
<div class="actions">
<Button
touch
variant="raised"
on:click={save}
disabled={busy}
>
<Label>Save W Axis Settings</Label>
</Button>
{#if saveMessage}
<span class="save-msg">{saveMessage}</span>
{/if}
</div>
<div class="tip"> <div class="tip">
Changes are written to aux.json. Homing rates and the Changes are written to aux.json when you click the
limit polarity are pushed to the ESP immediately; any master <strong>Save</strong> button at the bottom of the
running motion is unaffected. Re-home the W axis after settings rail. Homing rates and the limit polarity are
changing direction, sign, or step settings. pushed to the ESP immediately; any running motion is
unaffected. Re-home the W axis after changing direction,
sign, or step settings.
</div> </div>
</div> </div>
{/if} {/if}