brotherton-erpnext/erpnext/public/js/hub/components/ItemCardsContainer.vue

60 lines
1.1 KiB
Vue
Raw Normal View History

<template>
2018-08-24 11:08:34 +00:00
<div class="item-cards-container">
<empty-state
v-if="items.length === 0"
:message="empty_state_message"
:bordered="true"
:height="80"
>
</empty-state>
<item-card
v-for="item in items"
2018-08-24 11:08:34 +00:00
:key="item[item_id_fieldname]"
:item="item"
2018-08-24 11:08:34 +00:00
:item_id_fieldname="item_id_fieldname"
:is_local="is_local"
2018-08-24 11:08:34 +00:00
:on_click="on_click"
:allow_clear="editable"
@remove-item="$emit('remove-item', item[item_id_fieldname])"
>
</item-card>
</div>
</template>
<script>
import ItemCard from './ItemCard.vue';
import EmptyState from './EmptyState.vue';
export default {
name: 'item-cards-container',
props: {
2018-08-24 11:08:34 +00:00
items: Array,
item_id_fieldname: String,
is_local: Boolean,
2018-08-24 11:08:34 +00:00
on_click: Function,
editable: Boolean,
2018-08-24 11:08:34 +00:00
empty_state_message: String,
empty_state_height: Number,
empty_state_bordered: Boolean
},
components: {
ItemCard,
EmptyState
},
2018-08-23 08:22:41 +00:00
watch: {
items() {
2018-08-24 11:08:34 +00:00
// TODO: handling doesn't work
2018-08-23 08:22:41 +00:00
frappe.dom.handle_broken_images($(this.$el));
}
}
}
</script>
2018-08-24 11:08:34 +00:00
<style scoped>
.item-cards-container {
margin: 0 -15px;
overflow: overlay;
}
</style>