Skip to content

Instantly share code, notes, and snippets.

@raynoppe
Last active June 30, 2020 15:11
Show Gist options
  • Save raynoppe/221d9b8883ba25787794a41fb2b77f3c to your computer and use it in GitHub Desktop.
Save raynoppe/221d9b8883ba25787794a41fb2b77f3c to your computer and use it in GitHub Desktop.
Vue Code
// router
this.$router.push({ name: 'analytics' });
this.$router.push({ path: '/path' });
const currentroute = this.$router.currentRoute;
const currentroute = this.$router.currentRoute.path;
@click="(var) ? var=false:var=true"
<template v-html="html_text"></template>
<div v-bind:class="{ classToUse: isActive }"></div>
<div v-bind:class="{ classToUse: var === 'blah' }"></div>
<b-button size="is-small" @click="(showSelectSupplier) ? showSelectSupplier=false:showSelectSupplier=true"><span v-if="showSelectSupplier">Close</span><span v-else>Change</span></b-button>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
margin: 40px 0 0;
}
</style>
// open a modal
/*
<b-modal :active.sync="isCardModalActive" :width="640" scroll="keep">
<div class="card modal-card roundedtop roundedbottom">
<div class="card-header roundedtop bluebg10">
<div class="card-header-title white">Title</div>
</div>
<div class="modal-card-body">
<div class="content"></div>
</div>
<footer class="card-footer roundedbottom">
<div class="card-footer-item roundedbottomleft isPointer bluebg1 bluetxt8">Cancel</div>
<div class="card-footer-item roundedbottomright isPointer bluebg10 white txtbold">Save</div>
</footer>
</div>
</b-modal>
*/
const that = this; // re-assign the scope so it doesn't intefere with the modals scope
let useFull = true;
let useCanCancel = false;
const inw = document.body.clientWidth;
if (inw > 600) { useFull = false; useCanCancel = true; }
this.modal = this.$buefy.modal.open({
parent: this,
component: ModalMapForm,
hasModalCard: true,
fullScreen: useFull,
canCancel: useCanCancel,
width: 700,
props: {
data: {},
},
events: {
dataFromModal: value => {
console.log('value', value);
}
}
});
// call event from modal
this.$emit("dataFromModal", sv.data.row);
this.$buefy.snackbar.open({ message: "Message", position: "is-bottom" });
// toast
this.$buefy.toast.open({ message: "", position: "is-bottom", type: "is-danger" });
// confirm delete
this.$buefy.dialog.confirm({
title: "",
message:
"Are you sure you want to <b>delete</b> this? This cannot be undone.",
confirmText: "Delete",
type: "is-danger",
hasIcon: true,
icon: 'exclamation',
onConfirm: () => {}
});
// prompt
this.$buefy.dialog.prompt({
message: `Please enter a name for this form`,
inputAttrs: {
placeholder: "Contact form",
maxlength: 10
},
trapFocus: true,
onConfirm: value => this.$buefy.toast.open(`Your form is: ${value}`)
});
this.$buefy.snackbar.open({
message: "Restore this log entry?",
position: "is-bottom",
type: "is-warning",
indefinite: true,
onAction: async () => {
row.deleted = false;
row.deletedreason = '';
const updl = await this.DataSend('put', '/worklog/update', row);
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment