apb/vue-poc
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

more

Browse source
This commit is contained in:
Andy Bunce 2018-02-13 22:28:34 +00:00
parent 9b34c2462e
commit 2c64c78b8b
2 changed files with 117 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

66
src/vue-poc/components/vp-favorite.vue Normal file
View file

@ -0,0 +1,66 @@
<!DOCTYPE html>
<!--
display button that invokes a save favorite form
-->
<template id="vp-favorite">
<v-menu
offset-x
:close-on-content-click="false"
:nudge-width="200"
v-model="frmfav"
>
<v-btn slot="activator" @click="set(!frmfav)" icon flat title="Bookmark this page">
<v-icon>star_border</v-icon>
</v-btn>
<v-card style="width:400px;">
<v-toolbar class="green">
<v-card-title>
Bookmark this page
</v-card-title>
</v-toolbar>
<v-card-text>
<h6>{{$route.meta.title}}</h6>
<v-select
v-model="tags"
label="tags"
chips
tags
:items="taglist"
></v-select>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="primary" flat @click.stop="set(false)">Cancel</v-btn>
<v-btn color="primary" flat @click.stop="favorite(); set(false)">Save</v-btn>
</v-card-actions>
</v-card>
</v-menu></template>
<script>{
props: {
frmfav: Boolean
},
data(){
return {
tags: [],
taglist: [
'todo',
'find',
'some',
'good',
'tags'
],
}
},
methods:{
set(v){
this.$emit('update:frmfav', v)
},
favorite(){
alert("save");
}
}
}</script>

51
src/vue-poc/components/vp-notifications.vue Normal file
View file

@ -0,0 +1,51 @@
<!DOCTYPE html>
<!--
show notifications
-->
<template id="vp-notifications">
<v-card>
<v-toolbar class="amber white--text">
<v-toolbar-title >Notifications </v-toolbar-title>
{{ $notification.nextId }}
<v-btn @click="refresh" icon><v-icon>refresh</v-icon></v-btn>
<v-spacer></v-spacer>
<v-btn @click="set(false)" icon><v-icon>close</v-icon></v-btn>
</v-toolbar>
<v-card-text>
<v-list three-line>
<template v-for="msg in $notification.messages" >
<v-list-tile avatar v-bind:key="msg.index" @click="">
<v-list-tile-avatar>
<v-icon color="red">swap_horiz</v-icon>
</v-list-tile-avatar>
<v-list-tile-content>
<v-tooltip>
<v-list-tile-title slot="activator">{{ msg.created | fromNow("from") }}</v-list-tile-title>
<span v-text="msg.created"></span>
</v-tooltip>
<v-list-tile-sub-title v-html="msg.text"></v-list-tile-sub-title>
</v-list-tile-content>
<v-list-tile-action>
<v-list-tile-action-text>{{ msg.index }}</v-list-tile-action-text>
</v-list-tile-action>
</v-list-tile>
</template>
</v-list>
</v-card-text>
</v-card>
</template>
<script>{
props: {
showNotifications: Boolean
},
methods:{
set(v){
this.$emit('update:showNotifications', v)
},
refresh(){
this.$forceUpdate();
}
}
}</script>