gitadmin
/
profile-studio
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Better managerment of skills with generic sub-item controller

This commit is contained in:
chris2fr 2020-10-26 10:51:41 +01:00
parent c6ea974f4e
commit 177056f222
2 changed files with 38 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
components/section_projects.js
View File

@ -92,6 +92,27 @@ var sectionProjectsComponent = {
moveDownClicked: function(index) moveDownClicked: function(index)
{ {
this.$root.moveArrayPosition(this.$root.sections.work, index, index + 1); this.$root.moveArrayPosition(this.$root.sections.work, index, index + 1);
},
deleteClickedSubitem: function(mainitem, index)
{
var response = confirm("Are you sure you want to delete this keyword?");
if (response == true)
{
mainitem.splice(index, 1);
}
},
moveUpClickedSubitem: function(mainitem,index)
{
this.$root.moveArrayPosition(mainitem, index, index - 1);
},
moveDownClickedSubitem: function(mainitem,index)
{
this.$root.moveArrayPosition(mainitem, index, index + 1);
} }
} }
}; };

36
index.html
View File

@ -376,7 +376,7 @@
<form class="margin-top-32" v-for="(highlight, h_index) in work.highlights"> <form class="" v-for="(highlight, h_index) in work.highlights">
<simple-list-item v-bind:modelitem="$root.sections.work[w_index].highlights" v-bind:id="h_index" v-on:delete-clicked="deleteClickedHighlight(w_index,h_index)" v-on:move-up-clicked="moveUpClickedHighlight(w_index,h_index)" v-on:move-down-clicked="moveDownClickedHighlight(w_index,h_index)"></simple-list-item> <simple-list-item v-bind:modelitem="$root.sections.work[w_index].highlights" v-bind:id="h_index" v-on:delete-clicked="deleteClickedHighlight(w_index,h_index)" v-on:move-up-clicked="moveUpClickedHighlight(w_index,h_index)" v-on:move-down-clicked="moveDownClickedHighlight(w_index,h_index)"></simple-list-item>
</form> </form>
<!-- <!--
@ -537,7 +537,7 @@
<button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addCourse(e_index)">+ Add Course</button> <button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addCourse(e_index)">+ Add Course</button>
<form class="margin-top-32" v-for="(course, c_index) in edu.courses"> <form class="" v-for="(course, c_index) in edu.courses">
<simple-list-item v-bind:modelitem="$root.sections.education[e_index].courses" v-bind:id="c_index" v-on:delete-clicked="deleteClickedCourse(e_index,c_index)" v-on:move-up-clicked="moveUpClickedCourse(e_index,c_index)" v-on:move-down-clicked="moveDownClickedCourse(e_index,c_index)"></simple-list-item> <simple-list-item v-bind:modelitem="$root.sections.education[e_index].courses" v-bind:id="c_index" v-on:delete-clicked="deleteClickedCourse(e_index,c_index)" v-on:move-up-clicked="moveUpClickedCourse(e_index,c_index)" v-on:move-down-clicked="moveDownClickedCourse(e_index,c_index)"></simple-list-item>
</form> </form>
</div> </div>
@ -694,7 +694,7 @@
<small id="keywordsHelp" class="form-help text-muted">Keywords (e.g. HTML, CSS, JavaScript).</small> <small id="keywordsHelp" class="form-help text-muted">Keywords (e.g. HTML, CSS, JavaScript).</small>
<button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addKeyword(s_index)">+ Add Keyword</button> <button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addKeyword(s_index)">+ Add Keyword</button>
<form class="margin-top-32" v-for="(keyword, k_index) in skill.keywords"> <form class="" v-for="(keyword, k_index) in skill.keywords">
<simple-list-item v-bind:modelitem="$root.sections.skills[s_index].keywords" v-bind:id="k_index" v-on:delete-clicked="deleteClickedKeyword(s_index,k_index)" v-on:move-up-clicked="moveUpClickedKeyword(s_index,k_index)" v-on:move-down-clicked="moveDownClickedKeyword(s_index,k_index)"></simple-list-item> <simple-list-item v-bind:modelitem="$root.sections.skills[s_index].keywords" v-bind:id="k_index" v-on:delete-clicked="deleteClickedKeyword(s_index,k_index)" v-on:move-up-clicked="moveUpClickedKeyword(s_index,k_index)" v-on:move-down-clicked="moveDownClickedKeyword(s_index,k_index)"></simple-list-item>
</form> </form>
</div> </div>
@ -875,33 +875,31 @@
<small id="highlightsHelp" class="form-help text-muted">Briefly describe successes and outcomes (e.g. Increased profits by 20% from 2011-2012 through viral advertising).</small> <small id="highlightsHelp" class="form-help text-muted">Briefly describe successes and outcomes (e.g. Increased profits by 20% from 2011-2012 through viral advertising).</small>
<button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addHighlight(p_index)">+ Add Highlight</button> <button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addHighlight(p_index)">+ Add Highlight</button>
<ol>
<li v-for="(highlight, h_index) in project.highlights"> <form class="" v-for="(subitem, si_index) in project.highlights">
<input class="w3-input w3-border" type="text" v-model="$root.sections.projects[p_index].highlights[h_index]"> <simple-list-item v-bind:modelitem="project.highlights" v-bind:id="si_index" v-on:delete-clicked="deleteClickedSubitem(project.highlights,si_index)" v-on:move-up-clicked="moveUpClickedSubitem(project.highlights,si_index)" v-on:move-down-clicked="moveDownClickedSubitem(project.highlights,si_index)"></simple-list-item>
</li> </form>
</ol>
<h5 class="margin-top-32">Keywords</h5> <h5 class="margin-top-32">Keywords</h5>
<small id="highlightsHelp" class="form-help text-muted">Briefly describe successes and outcomes (e.g. Increased profits by 20% from 2011-2012 through viral advertising).</small> <small id="highlightsHelp" class="form-help text-muted">Briefly describe successes and outcomes (e.g. Increased profits by 20% from 2011-2012 through viral advertising).</small>
<button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addKeyword(p_index)">+ Add Keyword</button> <button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addKeyword(p_index)">+ Add Keyword</button>
<ol>
<li v-for="(keyword, k_index) in project.keywords">
<input class="w3-input w3-border" type="text" v-model="$root.sections.projects[p_index].keywords[k_index]"> <form class="" v-for="(subitem, si_index) in project.keywords">
</li> <simple-list-item v-bind:modelitem="project.keywords" v-bind:id="si_index" v-on:delete-clicked="deleteClickedSubitem(project.keywords,si_index)" v-on:move-up-clicked="moveUpClickedSubitem(project.keywords,si_index)" v-on:move-down-clicked="moveDownClickedSubitem(project.keywords,si_index)"></simple-list-item>
</ol> </form>
<h5 class="margin-top-32">Roles</h5> <h5 class="">Roles</h5>
<small id="highlightsHelp" class="form-help text-muted">Briefly describe successes and outcomes (e.g. Increased profits by 20% from 2011-2012 through viral advertising).</small> <small id="highlightsHelp" class="form-help text-muted">Briefly describe successes and outcomes (e.g. Increased profits by 20% from 2011-2012 through viral advertising).</small>
<button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addRole(p_index)">+ Add Role</button> <button type="button" class="w3-btn w3-white w3-border w3-border-blue w3-round w3-padding-small" v-on:click="addRole(p_index)">+ Add Role</button>
<ol>
<li v-for="(role, r_index) in project.roles"> <form class="margin-top-32" v-for="(subitem, si_index) in project.roles">
<input class="w3-input w3-border" type="text" v-model="$root.sections.projects[p_index].roles[r_index]"> <simple-list-item v-bind:modelitem="project.roles" v-bind:id="si_index" v-on:delete-clicked="deleteClickedSubitem(project.roles,si_index)" v-on:move-up-clicked="moveUpClickedSubitem(project.roles,si_index)" v-on:move-down-clicked="moveDownClickedSubitem(project.roles,si_index)"></simple-list-item>
</li> </form>
</ol>
</div> </div>
</form> </form>
</div> </div>