diff --git a/src/js/macros.js b/src/js/macros.js index 4e4a36c..08bdfca 100644 --- a/src/js/macros.js +++ b/src/js/macros.js @@ -15,7 +15,7 @@ module.exports = { deleteSelected: false, deleteGCode: false, edited: false, - newGcode: ["", "", "", "", "", "", "", ""], + newGcode: new Array(this.config.macros.length).fill(""), }; }, events: { @@ -38,7 +38,7 @@ module.exports = { return this.mach_state == "READY"; }, macrosLength: function () { - return this.config.macros.length > 0; + return this.config.macros.length > 1; }, macrosList: function () { return this.config.macrosList.map(el => el.file_name); @@ -168,8 +168,8 @@ module.exports = { } }, saveMacros: async function () { - var macrosName = document.getElementById(`macros-name-${this.tab}`).value; - var macrosColor = document.getElementById(`macros-color-${this.tab}`).value; + var macrosName = document.getElementById(`macros-name-${this.tab - 1}`).value; + var macrosColor = document.getElementById(`macros-color-${this.tab - 1}`).value; console.log(" this.state.selected && time: ", this.state.selected, this.state.selected_time); console.log("selectedValues: ", this.config.macros[this.tab - 1].file_name); @@ -293,6 +293,7 @@ module.exports = { }, printConfig: function () { console.log(this.config); + console.log(this.newGcode); }, resetMacrosList: async function () { this.config.macrosList = []; @@ -330,6 +331,7 @@ module.exports = { console.error("Restore Failed: ", error); alert("Restore failed"); } + this.deleteSelected = false; }, }, }; diff --git a/src/pug/templates/macros.pug b/src/pug/templates/macros.pug index ea23804..0b452c7 100644 --- a/src/pug/templates/macros.pug +++ b/src/pug/templates/macros.pug @@ -39,14 +39,17 @@ script#macros-template(type="text/x-template") h1 Macros Configuration .flex-row-container - button.config-button(title="Reset Macros", @click="confirmReset=true") Delete All - button.config-button(title="Add a Macros", @click="addNewMacros", style="margin-left:5px") New Macros - button.config-button(title="Add a Macros", @click="deleteSelected=true", style="margin-left:5px",:disabled="!macrosLength") Delete Selected + button.blue-button(title="Reset Macros", @click="confirmReset=true") Delete All + button.blue-button(title="Add a Macros", @click="addNewMacros", style="margin-left:5px") New Macros + button.blue-button(title="Add a Macros", @click="deleteSelected=true", style="margin-left:5px",:disabled="!macrosLength") Delete Selected .tabs - template(v-for="(index,macros) in config.macros",:key="index+1") - input(type="radio",:id="'tab'+(index+1)", name="tabs",@click="tab = (index+1).toString()") - label(:for="'tab'+(index+1)",style="height:50px;width:100px") Macros {{index+1}} + input#tab1(type="radio", name="tabs",checked="" @click="tab = '1'") + label(for="tab1",style="height:50px;width:100px") Macros 1 + + template(v-for="(index,macros) in config.macros.slice(1)",:key="index+2") + input(type="radio",:id="'tab'+(index+2)", name="tabs",@click="tab = (index+2).toString()") + label(:for="'tab'+(index+2)",style="height:50px;width:100px") Macros {{index+2}} section.tab-content(v-for="(index,macros) in config.macros",:id="'content'+(index+1)") .macros-form diff --git a/src/stylus/style.styl b/src/stylus/style.styl index 6ba526e..f86be1e 100644 --- a/src/stylus/style.styl +++ b/src/stylus/style.styl @@ -650,20 +650,7 @@ span.unit border-radius 10px border-color #424242 border-style solid - - .config-button - height 45px - margin-bottom 1rem - width 135px - border-radius 2px - border 0 - font-weight normal - color #fff - background-color #0078e7 - display flex - align-items center - justify-content space-around - + .new-gcode height 13rem width 23rem @@ -673,6 +660,7 @@ span.unit .flex-row-container display flex flex-direction row + margin-bottom 1rem .tabs margin-top 5px @@ -686,9 +674,9 @@ span.unit .blue-button height 40px - width 130px + width 135px font-weight normal - border-radius 5px + border-radius 3px border 0 margin-left 1rem background-color #0078e7