[hub][vue] replace page files, fix item 'seen' prop

erpnext/public/js/hub/components/ItemCard.vue

@@ -1,5 +1,5 @@
 <template>
-	<div v-if="item.seen" class="col-md-3 col-sm-4 col-xs-6 hub-card-container">
+	<div v-if="seen" class="col-md-3 col-sm-4 col-xs-6 hub-card-container">
 		<div class="hub-card"
 			@click="on_click(item_id)"
 		>
@@ -34,7 +34,7 @@
 
 export default {
 	name: 'item-card',
-	props: ['item', 'item_id_fieldname', 'is_local', 'on_click', 'allow_clear'],
+	props: ['item', 'item_id_fieldname', 'is_local', 'on_click', 'allow_clear', 'seen'],
 	computed: {
 		title() {
 			const item_name = this.item.item_name || this.item.name;

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

@@ -15,6 +15,7 @@
 			:is_local="is_local"
 			:on_click="on_click"
 			:allow_clear="editable"
+			:seen="item.hasOwnProperty('seen') ? item.seen : true"
 			@remove-item="$emit('remove-item', item[item_id_fieldname])"
 		>
 		</item-card>

erpnext/public/js/hub/marketplace.js

@@ -1,18 +1,21 @@
+import Vue from 'vue/dist/vue.js';
+
 // pages
 import './pages/home';
-import './pages/favourites';
 import './pages/search';
 import './pages/category';
 import './pages/item';
 import './pages/seller';
 import './pages/register';
 import './pages/profile';
-import './pages/publish';
 import './pages/published_products';
 import './pages/messages';
 import './pages/buying_messages';
 import './pages/not_found';
 
+import SavedProducts from './pages/SavedProducts.vue';
+import Publish from './pages/Publish.vue';
+
 // components
 import { ProfileDialog } from './components/profile_dialog';
 
@@ -197,7 +200,7 @@ erpnext.hub.Marketplace = class Marketplace {
 
 		// registered seller routes
 		if (route[1] === 'saved-products' && !this.subpages['saved-products']) {
-			this.subpages['saved-products'] = new erpnext.hub.SavedProducts(this.$body);
+			this.subpages['saved-products'] = new erpnext.hub.SavedProductsPage(this.$body);
 		}
 
 		if (route[1] === 'profile' && !this.subpages.profile) {
@@ -205,7 +208,7 @@ erpnext.hub.Marketplace = class Marketplace {
 		}
 
 		if (route[1] === 'publish' && !this.subpages.publish) {
-			this.subpages.publish = new erpnext.hub.Publish(this.$body);
+			this.subpages.publish = new erpnext.hub.PublishPage(this.$body);
 		}
 
 		if (route[1] === 'my-products' && !this.subpages['my-products']) {
@@ -263,3 +266,41 @@ erpnext.hub.Marketplace = class Marketplace {
 		});
 	}
 }
+
+
+erpnext.hub.SavedProductsPage = class {
+	constructor(parent) {
+		this.$wrapper = $(`<div id="vue-area-saved">`).appendTo($(parent));
+
+		new Vue({
+			render: h => h(SavedProducts)
+		}).$mount('#vue-area-saved');
+	}
+
+	show() {
+		$('[data-page-name="saved-products"]').show();
+	}
+
+	hide() {
+		$('[data-page-name="saved-products"]').hide();
+	}
+}
+
+erpnext.hub.PublishPage = class {
+	constructor(parent) {
+		this.$wrapper = $(`<div id="vue-area">`).appendTo($(parent));
+
+		new Vue({
+			render: h => h(Publish)
+		}).$mount('#vue-area');
+	}
+
+	show() {
+		$('[data-page-name="publish"]').show();
+	}
+
+	hide() {
+		$('[data-page-name="publish"]').hide();
+	}
+
+}

erpnext/public/js/hub/pages/Publish.vue

@@ -53,10 +53,10 @@
 </template>
 
 <script>
-import SearchInput from './SearchInput.vue';
+import SearchInput from '../components/SearchInput.vue';
-import ItemCardsContainer from './ItemCardsContainer.vue';
+import ItemCardsContainer from '../components/ItemCardsContainer.vue';
-import NotificationMessage from './NotificationMessage.vue';
+import NotificationMessage from '../components/NotificationMessage.vue';
-import { ItemPublishDialog } from './item_publish_dialog';
+import { ItemPublishDialog } from '../components/item_publish_dialog';
 
 export default {
 	name: 'publish-page',

erpnext/public/js/hub/pages/SavedProducts.vue

@@ -18,7 +18,7 @@
 </template>
 
 <script>
-import ItemCardsContainer from './ItemCardsContainer.vue';
+import ItemCardsContainer from '../components/ItemCardsContainer.vue';
 
 export default {
 	name: 'saved-products-page',
@@ -50,10 +50,7 @@ export default {
 				'action:item_favourite'
 			)
 			.then((items) => {
-				this.items = items.map(item => {
+				this.items = items;
-					item.seen = true;
-					return item;
-				});
 			})
 		},
 

erpnext/public/js/hub/pages/favourites.js

@@ -1,20 +0,0 @@
-import SavedProductsPage from '../components/SavedProductsPage.vue';
-import Vue from 'vue/dist/vue.js';
-
-erpnext.hub.SavedProducts = class {
-	constructor(parent) {
-		this.$wrapper = $(`<div id="vue-area-saved">`).appendTo($(parent));
-
-		new Vue({
-			render: h => h(SavedProductsPage)
-		}).$mount('#vue-area-saved');
-	}
-
-	show() {
-		$('[data-page-name="saved-products"]').show();
-	}
-
-	hide() {
-		$('[data-page-name="saved-products"]').hide();
-	}
-}

erpnext/public/js/hub/pages/publish.js

@@ -1,21 +0,0 @@
-import PublishPage from '../components/PublishPage.vue';
-import Vue from 'vue/dist/vue.js';
-
-erpnext.hub.Publish = class Publish {
-	constructor(parent) {
-		this.$wrapper = $(`<div id="vue-area">`).appendTo($(parent));
-
-		new Vue({
-			render: h => h(PublishPage)
-		}).$mount('#vue-area');
-	}
-
-	show() {
-		$('[data-page-name="publish"]').show();
-	}
-
-	hide() {
-		$('[data-page-name="publish"]').hide();
-	}
-
-}