This commit is contained in:
Jason Snelders 2019-11-16 13:36:25 +11:00
parent f01c007ad6
commit 90d2d79978
4 changed files with 67 additions and 19 deletions

View File

@ -99,7 +99,7 @@ var app = new Vue({
mounted()
{
//this.loadFromStorage();
this.loadFromStorage();
// Set the "current" main navigation item based on the current route.
this.selectMenuItemForCurrentUrl();
@ -184,6 +184,16 @@ var app = new Vue({
},
saveResume: function()
{
var response = confirm("Resume saved");
helpers.setLocalStorage("sections", this.$root.sections);
alert("Resume saved");
return false;
},
/**
* Open the sidebar on smaller screens.
@ -508,12 +518,13 @@ var app = new Vue({
$data: {
handler: function(val, oldVal)
{
// Save the data to localStorage
//NOTE: I'm initially not concerned about performance here.
if (val.status == "loaded")
{
helpers.setLocalStorage("sections", val.sections);
}
//TODO: Disbled
// // Save the data to localStorage
// //NOTE: I'm initially not concerned about performance here.
// if (val.status == "loaded")
// {
// helpers.setLocalStorage("sections", val.sections);
// }
},
deep: true
}

View File

@ -34,6 +34,8 @@ var importComponent = {
var data = JSON.parse(this.json);
this.$root.populateSections(data);
helpers.setLocalStorage("sections", this.$root.sections);
},

View File

@ -14,7 +14,7 @@ Vue.component("preview-field", {
mounted: function()
{
this.displayFormat = (this.format ? this.format : "");
},
@ -29,6 +29,7 @@ Vue.component("preview-field", {
data: function()
{
return {
displayFormat: "", // Refine the "format" so we don't mutate the prop.
item: {}
};
},
@ -36,21 +37,41 @@ Vue.component("preview-field", {
methods: {
getLabel: function()
{
return (this.label ? this.label : " ");
},
getValue: function()
{
// Return the value formatted.
if (this.format == "url")
if (this.displayFormat == "url")
{
return "<a href='" + this.value + "' target='_blank'>" + this.value + "</a>";
}
if (this.format == "multi-line")
if (this.displayFormat == "email")
{
return "<a href='mailto:" + this.value + "' target='_blank'>" + this.value + "</a>";
}
if (this.displayFormat == "phone")
{
return "<a href='tel:" + this.value + "' target='_blank'>" + this.value + "</a>";
}
if (this.displayFormat == "multi-line")
{
return this.replaceLineBreaks(this.value);
}
return this.value;
if (this.displayFormat == "image")
{
return "<img src='" + this.value + "' style='max-width: 100px;'></img>";
}
return (this.value ? this.value : "&nbsp;");
},

View File

@ -55,9 +55,13 @@
</div>
<hr>
<div class="w3-bar-block">
<a href="#/preview" class="w3-bar-item w3-button w3-padding"><i class="fas fa-print"></i>&nbsp; Preview</a>
<a href="#/preview" class="w3-bar-item w3-button w3-padding"><i class="fas fa-print"></i>&nbsp; Preview</a>
</div>
<hr>
<div class="w3-bar-block">
<a href="#/import" class="w3-bar-item w3-button w3-padding"><i class="fas fa-file-upload"></i>&nbsp; Import</a>
<a href="#/export" class="w3-bar-item w3-button w3-padding"><i class="fas fa-file-download"></i>&nbsp; Export</a>
<span class="w3-bar-item w3-button w3-padding" v-on:click="saveResume"><i class="fas fa-sync-alt"></i>&nbsp; Save</span>
<span class="w3-bar-item w3-button w3-padding" v-on:click="resetResume"><i class="fas fa-sync-alt"></i>&nbsp; Reset Resume</span>
</div>
<hr>
@ -238,10 +242,11 @@
<preview-field label="Full Name" v-bind:value="$root.sections.basics.name"></preview-field>
<preview-field label="Label" v-bind:value="$root.sections.basics.label"></preview-field>
<preview-field label="Picture" v-bind:value="$root.sections.basics.picture" format="url"></preview-field>
<preview-field label="" v-bind:value="$root.sections.basics.picture" format="image"></preview-field>
<preview-field label="Email" v-bind:value="$root.sections.basics.email"></preview-field>
<preview-field label="Phone" v-bind:value="$root.sections.basics.phone"></preview-field>
<preview-field label="Website" v-bind:value="$root.sections.basics.website"></preview-field>
<preview-field label="Email" v-bind:value="$root.sections.basics.email" format="email"></preview-field>
<preview-field label="Phone" v-bind:value="$root.sections.basics.phone" format="phone"></preview-field>
<preview-field label="Website" v-bind:value="$root.sections.basics.website" format="url"></preview-field>
<preview-field label="Summary" v-bind:value="$root.sections.basics.summary" format="multi-line"></preview-field>
@ -258,7 +263,7 @@
<div class="preview w3-container w3-card-4 w3-padding-16 w3-margin-left w3-margin-top" v-for="profile in $root.sections.basics.profiles">
<preview-field label="Network" v-bind:value="profile.network"></preview-field>
<preview-field label="Username" v-bind:value="profile.username"></preview-field>
<preview-field label="URL" v-bind:value="profile.url"></preview-field>
<preview-field label="URL" v-bind:value="profile.url" format="url"></preview-field>
</div>
</div>
</div>
@ -885,18 +890,27 @@
<template type="text/x-template" id="preview-single-field-template" lang="html">
<div id="preview-single-field-root">
<div class="w3-row w3-margin-bottom" v-if="format != 'list-item'">
<div class="w3-row w3-margin-bottom" v-if="displayFormat == '' || displayFormat == 'url' || displayFormat == 'email' || displayFormat == 'phone'">
<div class="w3-col m3">
<span>{{label}}</span>
<span v-html="getLabel()"></span>
</div>
<div class="w3-col m9">
<span v-html="getValue()"></span>
</div>
</div>
<span v-if="format == 'list-item'">
<span class="w3-margin-bottom" v-if="displayFormat == 'list-item'">
<span v-html="getValue()"></span>
</span>
<span class="w3-row w3-margin-bottom" v-if="displayFormat == 'image'">
<div class="w3-col m3">
<span v-html="getLabel()"></span>
</div>
<div class="w3-col m9">
<span v-html="getValue()"></span>
</div>
</span>
</div>
</template>