Refactoring
Forum rules
Always add your Aimeos and PHP version as well as your environment (Linux/Mac/Win)
Spam and unrelated posts will be removed immediately!
Always add your Aimeos and PHP version as well as your environment (Linux/Mac/Win)
Spam and unrelated posts will be removed immediately!
-
- Posts: 44
- Joined: 05 Oct 2019, 06:42
Refactoring
What we observe in the admin page of the website is that in the network tab we see our custom pages that we have created are also been called every time. The ajax is been requested for all the pages. So we want to serve the request only for the specific tabs in the admin. I have attached screenshot for reference. How could this be done to prevent unnecessary ajax calls for the admin pages? If you see the screenshot you would notice that in the sales tab we could see ajax calls for get-all-questions, get-all-reviews and so on.
Please assist.
Please assist.
- Attachments
-
- image-2_compressed.jpg (214.89 KiB) Viewed 1507 times
Re: Refactoring
Check your Javascript code when the requests are made and try to perform them only if the HTML contains the required nodes.
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, give us a star
If you like Aimeos, give us a star
-
- Posts: 44
- Joined: 05 Oct 2019, 06:42
Re: Refactoring
How can I do it? Could you please explain the files I need to go in to check this?
-
- Posts: 44
- Joined: 05 Oct 2019, 06:42
Re: Refactoring
Hi Aimeos @aimeos I have this file named stocklog.js. Now how can I load it when requests are made and try to perform them only if the HTML contains the required nodes.
Please guide.
Code: Select all
$(function() {
Aimeos.Product.StockLog.init();
});
Aimeos.Product.StockLog = {
init : function() {
this.StockLog = new Vue({
el: '#stockLog',
data: {
items: [],
loading: false,
hasError: null,
hasSuccess: null,
errorMessage: null,
successMessage:null,
successClass:null,
siteid: null,
sitecode: null,
siteLabel: null,
product_id:'',
question_id:'',
stock_id:'',
sku:'',
stock_level_old:'',
stock_level_new:'',
from:'',
status:'',
product_filter:null,
customer_filter:null,
stock_filter:null,
stock_level_old_filter:null,
stock_level_new_filter:null,
message:null,
date_start:null,
date_end:null,
current_page: null,
to: null,
total: null,
first_page: 1,
prev_page: null,
next_page: null,
last_page: null,
per_page: null,
next_is_disabled: true,
prev_is_disabled: false,
shops:[],
},
mounted: function() {
this.getStockLog();
},
methods: {
getStockLog: function(number) {
this.siteid = this.$el.dataset.siteid;
let url = '/stocklog';
axios.get(url, {
params:{
siteid:this.siteid,
sitecode:this.sitecode,
page: number,
product_filter: this.product_filter,
stock_filter: this.stock_filter,
stock_level_new: this.stock_level_new_filter,
stock_level_old: this.stock_level_old_filter,
date_start:this.date_start,
date_end:this.date_end,
customer_id:this.customer_filter,
}
}).then(({data}) => {
this.items = data.StockLogs.data;
this.shops = data.SiteList;
this.last_page = data.StockLogs.last_page;
this.current_page = data.StockLogs.current_page;
this.from = data.StockLogs.from;
this.per_page = data.StockLogs.per_page;
this.to = data.StockLogs.to;
this.total = data.StockLogs.total;
if (this.current_page > this.first_page){
this.prev_is_disabled = false;
this.next_page = this.current_page + 1;
this.next_is_disabled = false;
this.prev_page = this.current_page -1;
}
else {
this.prev_page = this.current_page;
this.prev_is_disabled = true;
this.next_is_disabled = false
}
if (this.current_page < this.last_page){
this.next_page = this.current_page + 1;
this.next_is_disabled = false;
}
else {
this.next_page = this.current_page;
this.next_is_disabled = true;
}
});
},
removeStockLog: function(id){
let url = '/stocklog/' + id;
this.hasSuccess = id;
this.successMessage = 'Stock Log Removed';
this.successClass = 'alert alert-success';
axios.delete(url).then( () =>{
setTimeout(() => {
this.successClass = null;
this.hasSuccess = null;
this.successMessage = null;
}, 3000);
this.getStockLog();
}).catch((error) =>{
console.log(error);
});
},
getStatus: function (item_old,item_new) {
if (item_new === 0){
return this.status = '↓';
}
else if (item_old === 0){
return this.status = '↑';
}
else if (item_old < item_new){
return this.status = '↗';
}
else if (item_old > item_new) return this.status = '↘';
else return this.status = '—'
}
}
});
}
};
-
- Posts: 44
- Joined: 05 Oct 2019, 06:42
Re: Refactoring
This is what my manifest.jsb2 looks like
Code: Select all
{
"projectName": "ebdaa",
"licenseText": "proprietary",
"pkgs": [
{
"name": "ebdaa CSS",
"file": "ebdaa.css",
"isDebug": true,
"fileIncludes": [
{
"text": "sidebar.css",
"path": "themes/css/"
},
{
"text": "admin.css",
"path": "themes/css/"
},
{
"text": "dashboard.css",
"path": "themes/css/"
},
{
"text": "catalog.css",
"path": "themes/css/"
},
{
"text": "product.css",
"path": "themes/css/"
}
]
},
{
"name": "ebdaa JS",
"file": "ebdaa.js",
"isDebug": true,
"fileIncludes": [
{
"text": "custom_order.js",
"path": "themes/js/"
},
{
"text": "custom_admin.js",
"path": "themes/js/"
},
{
"text": "get_orders.js",
"path": "themes/js/"
},
{
"text": "get_transactions.js",
"path": "themes/js/"
},
{
"text": "dashboard-order.js",
"path": "themes/js/"
},
{
"text": "stock.js",
"path": "themes/js/"
},
{
"text": "product-questions.js",
"path": "themes/js/"
},
{
"text": "product-rating.js",
"path": "themes/js/"
},
{
"text": "moment.js",
"path": "themes/js/"
},
{
"text": "get_questions.js",
"path": "themes/js/"
},
{
"text": "get_reviews.js",
"path": "themes/js/"
},
{
"text": "stock_log.js",
"path": "themes/js/"
},
{
"text": "exported.js",
"path": "themes/js/"
},
{
"text": "uploader.js",
"path": "themes/js/"
},
{
"text": "price.js",
"path": "themes/js/"
},
{
"text": "price_log.js",
"path": "themes/js/"
},
{
"text": "product_price.js",
"path": "themes/js/"
}
]
}
],
"resources": []
}
Re: Refactoring
The component should only be created and initialized if a HTML node with the ID "stockLog" is available. Otherwise, nothing should be fetched from the server. You can check that by adding a console.log() debug statement in the VueJS component JS code.
Professional support and custom implementation are available at Aimeos.com
If you like Aimeos, give us a star
If you like Aimeos, give us a star