This commit is contained in:
@@ -18,9 +18,27 @@
|
|||||||
<v-icon>mdi-heart</v-icon>
|
<v-icon>mdi-heart</v-icon>
|
||||||
</v-btn> -->
|
</v-btn> -->
|
||||||
|
|
||||||
<v-btn icon>
|
<!-- <v-btn icon>
|
||||||
<v-icon>$ayiEllipsisV</v-icon>
|
<v-icon>$ayiEllipsisV</v-icon>
|
||||||
</v-btn>
|
</v-btn> -->
|
||||||
|
<v-menu bottom left>
|
||||||
|
<template v-slot:activator="{ on, attrs }">
|
||||||
|
<v-btn icon v-bind="attrs" v-on="on">
|
||||||
|
<v-icon>$ayiEllipsisV</v-icon>
|
||||||
|
</v-btn>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<v-list>
|
||||||
|
<v-list-item @click="removeItem">
|
||||||
|
<v-list-item-title>$ay.t('Remove')</v-list-item-title>
|
||||||
|
</v-list-item>
|
||||||
|
<v-list-item v-for="(item, i) in items" :key="i">
|
||||||
|
<v-list-item-title @click="menuItemClick(item)">{{
|
||||||
|
item.name
|
||||||
|
}}</v-list-item-title>
|
||||||
|
</v-list-item>
|
||||||
|
</v-list>
|
||||||
|
</v-menu>
|
||||||
</v-toolbar>
|
</v-toolbar>
|
||||||
</slot>
|
</slot>
|
||||||
<slot name="main"
|
<slot name="main"
|
||||||
@@ -34,9 +52,29 @@
|
|||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
data: () => ({}),
|
data: () => ({
|
||||||
|
items: [
|
||||||
|
{ name: "Click Me", value: 0 },
|
||||||
|
{ name: "Click Me", value: 1 },
|
||||||
|
{ name: "Click Me", value: 2 },
|
||||||
|
{ name: "Click Me 2", value: 3 }
|
||||||
|
]
|
||||||
|
}),
|
||||||
props: {
|
props: {
|
||||||
title: String
|
id: {
|
||||||
|
type: String,
|
||||||
|
required: true
|
||||||
|
},
|
||||||
|
title: String,
|
||||||
|
moreUrl: String
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
removeItem() {
|
||||||
|
this.$emit("dash-remove", this.id);
|
||||||
|
},
|
||||||
|
menuItemClick(item) {
|
||||||
|
console.log(item);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<v-row>
|
<v-row>
|
||||||
<v-col
|
<v-col
|
||||||
v-for="(item, i) in TestItems()"
|
v-for="(item, i) in dashItems()"
|
||||||
:key="i"
|
:key="i"
|
||||||
class="d-flex child-flex"
|
class="d-flex child-flex"
|
||||||
cols="12"
|
cols="12"
|
||||||
@@ -9,7 +9,11 @@
|
|||||||
lg="4"
|
lg="4"
|
||||||
xl="3"
|
xl="3"
|
||||||
>
|
>
|
||||||
<gz-dash :title="'Dash-' + i" />
|
<gz-dash
|
||||||
|
:title="'Dash-' + i"
|
||||||
|
:id="'dashitem-' + i"
|
||||||
|
v-on:dash-remove="dashRemove"
|
||||||
|
/>
|
||||||
</v-col>
|
</v-col>
|
||||||
</v-row>
|
</v-row>
|
||||||
</template>
|
</template>
|
||||||
@@ -40,12 +44,15 @@ export default {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
TestItems: function() {
|
dashItems: function() {
|
||||||
let ret = [];
|
let ret = [];
|
||||||
for (var i = 0; i < 12; i++) {
|
for (var i = 0; i < 12; i++) {
|
||||||
ret.push({ index: i, title: `Dash ${i}` });
|
ret.push({ index: i, title: `Dash ${i}` });
|
||||||
}
|
}
|
||||||
return ret;
|
return ret;
|
||||||
|
},
|
||||||
|
dashRemove: function(item) {
|
||||||
|
console.log("home-dashboard:dashRemove", item);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
|
|||||||
Reference in New Issue
Block a user