first commit

This commit is contained in:
2024-11-11 18:46:54 +01:00
commit a630d17338
25634 changed files with 4923715 additions and 0 deletions

View File

@@ -0,0 +1,32 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import TableSorting from '@app/utils/table-sorting';
const $ = global.$;
$(() => {
new TableSorting($('table.table')).attach();
});

View File

@@ -0,0 +1,32 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import ModuleCard from '@components/module-card';
const $ = global.$;
$(() => {
new ModuleCard().init();
});

View File

@@ -0,0 +1,125 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div v-if="isReady" id="app" class="stock-app container-fluid">
<StockHeader />
<Search @search="onSearch" @applyFilter="applyFilter" />
<LowFilter v-if="isOverview" :filters="filters" @lowStockChecked="onLowStockChecked" />
<div class="card container-fluid pa-2 clearfix">
<router-view class="view" @resetFilters="resetFilters" @fetch="fetch"></router-view>
<PSPagination
:currentIndex="currentPagination"
:pagesCount="pagesCount"
@pageChanged="onPageChanged"
/>
</div>
</div>
</template>
<script>
import StockHeader from './header/stock-header';
import Search from './header/search';
import LowFilter from './header/filters/low-filter';
import PSPagination from '@app/widgets/ps-pagination';
const FIRST_PAGE = 1;
export default {
name: 'app',
computed: {
isReady() {
return this.$store.state.isReady;
},
pagesCount() {
return this.$store.state.totalPages;
},
currentPagination() {
return this.$store.state.pageIndex;
},
isOverview() {
return this.$route.name === 'overview';
},
},
methods: {
onPageChanged(pageIndex) {
this.$store.dispatch('updatePageIndex', pageIndex);
this.fetch('asc');
},
fetch(sortDirection) {
const action = this.$route.name === 'overview' ? 'getStock' : 'getMovements';
const sorting = (sortDirection === 'desc') ? ' desc' : '';
this.$store.dispatch('isLoading');
this.filters = Object.assign({}, this.filters, {
order: `${this.$store.state.order}${sorting}`,
page_size: this.$store.state.productsPerPage,
page_index: this.$store.state.pageIndex,
keywords: this.$store.state.keywords,
});
this.$store.dispatch(action, this.filters);
},
onSearch(keywords) {
this.$store.dispatch('updateKeywords', keywords);
this.resetPagination();
this.fetch();
},
applyFilter(filters) {
this.filters = filters;
this.resetPagination();
this.fetch();
},
resetFilters() {
this.filters = {};
},
resetPagination() {
this.$store.dispatch('updatePageIndex', FIRST_PAGE);
},
onLowStockChecked(isChecked) {
this.filters = Object.assign({}, this.filters, {
low_stock: isChecked,
});
this.fetch();
},
},
components: {
StockHeader,
Search,
PSPagination,
LowFilter,
},
data: () => ({
filters: {},
}),
};
</script>
<style lang="scss" type="text/scss">
// hide the layout header
#main-div > .header-toolbar {
height: 0;
display: none;
}
</style>

View File

@@ -0,0 +1,56 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<nav aria-label="Breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a :href="catalogLink">{{trans('link_catalog')}}</a>
</li>
<li class="breadcrumb-item">
<a :href="stockLink">{{trans('link_stock')}}</a>
</li>
<li class="breadcrumb-item active">
<span v-if="isOverview">{{trans('link_overview')}}</span>
<span v-else>{{trans('link_movements')}}</span>
</li>
</ol>
</nav>
</template>
<script>
export default {
computed: {
isOverview() {
return this.$route.name === 'overview';
},
catalogLink() {
return window.data.catalogUrl;
},
stockLink() {
return window.data.stockUrl;
},
},
};
</script>

View File

@@ -0,0 +1,207 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div id="filters-container">
<button class="search-input collapse-button" type="button" data-toggle="collapse" data-target="#filters">
<i class="material-icons mr-1">filter_list</i>
<i class="material-icons float-right ">keyboard_arrow_down</i>
{{trans('button_advanced_filter')}}
</button>
<div id="filters" class="container-fluid collapse">
<div class="row">
<div class="col-lg-4">
<div v-if="isOverview" class="py-3">
<h2>{{trans('filter_suppliers')}}</h2>
<FilterComponent
:placeholder="trans('filter_search_suppliers')"
:list="this.$store.getters.suppliers"
class="filter-suppliers"
itemID="supplier_id"
label="name"
@active="onFilterActive"
/>
</div>
<div v-else class="py-3">
<h2>{{trans('filter_movements_type')}}</h2>
<PSSelect :items="movementsTypes" itemID="id_stock_mvt_reason" itemName="name" @change="onChange">
{{trans('none')}}
</PSSelect>
<h2 class="mt-4">{{trans('filter_movements_employee')}}</h2>
<PSSelect :items="employees" itemID="id_employee" itemName="name" @change="onChange">
{{trans('none')}}
</PSSelect>
<h2 class="mt-4">{{trans('filter_movements_period')}}</h2>
<form class="row">
<div class="col-md-6">
<label>{{trans('filter_datepicker_from')}}</label>
<PSDatePicker :locale="locale" @dpChange="onDpChange" @reset="onClear" type="sup"/>
</div>
<div class="col-md-6">
<label>{{trans('filter_datepicker_to')}}</label>
<PSDatePicker :locale="locale" @dpChange="onDpChange" @reset="onClear" type="inf" />
</div>
</form>
</div>
</div>
<div class="col-lg-4">
<div class="py-3">
<h2>{{trans('filter_categories')}}</h2>
<FilterComponent
:placeholder="trans('filter_search_category')"
:list="categoriesList"
class="filter-categories"
itemID="id_category"
label="name"
@active="onFilterActive"
/>
</div>
</div>
<div class="col-lg-4">
<div class="py-3">
<h2>{{trans('filter_status')}}</h2>
<PSRadio
id="enable"
:label="trans('filter_status_enable')"
:checked="false"
value="1"
@change="onRadioChange"
/>
<PSRadio
id="disable"
:label="trans('filter_status_disable')"
:checked="false"
value="0"
@change="onRadioChange"
/>
<PSRadio
id="all"
:label="trans('filter_status_all')"
:checked="true"
value="null"
@change="onRadioChange"
/>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import FilterComponent from './filters/filter-component';
import PSSelect from '@app/widgets/ps-select';
import PSButton from '@app/widgets/ps-button';
import PSDatePicker from '@app/widgets/ps-datepicker';
import PSRadio from '@app/widgets/ps-radio';
import _ from 'lodash';
export default {
computed: {
locale() {
return window.data.locale;
},
isOverview() {
return this.$route.name === 'overview';
},
employees() {
return this.$store.state.employees;
},
movementsTypes() {
return this.$store.state.movementsTypes;
},
categoriesList() {
return this.$store.getters.categories;
},
},
methods: {
onClear(event) {
delete this.date_add[event.dateType];
this.applyFilter();
},
onClick() {
this.applyFilter();
},
onFilterActive(list, type) {
if (type === 'supplier') {
this.suppliers = list;
} else {
this.categories = list;
}
this.disabled = !this.suppliers.length && !this.categories.length;
this.applyFilter();
},
applyFilter() {
this.$store.dispatch('isLoading');
this.$emit('applyFilter', {
suppliers: this.suppliers,
categories: this.categories,
id_stock_mvt_reason: this.id_stock_mvt_reason,
id_employee: this.id_employee,
date_add: this.date_add,
active: this.active,
});
},
onChange(item) {
if (item.itemID === 'id_stock_mvt_reason') {
this.id_stock_mvt_reason = item.value === 'default' ? [] : item.value;
} else {
this.id_employee = item.value === 'default' ? [] : item.value;
}
this.applyFilter();
},
onDpChange(event) {
this.date_add[event.dateType] = event.date.unix();
if (event.oldDate) {
this.applyFilter();
}
},
onRadioChange(value) {
this.active = value;
this.applyFilter();
},
},
components: {
FilterComponent,
PSSelect,
PSButton,
PSDatePicker,
PSRadio,
},
mounted() {
this.date_add = {};
this.$store.dispatch('getSuppliers');
this.$store.dispatch('getCategories');
},
data: () => ({
disabled: true,
suppliers: [],
categories: [],
id_stock_mvt_reason: [],
id_employee: [],
date_add: {},
active: null,
}),
};
</script>

View File

@@ -0,0 +1,188 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div class="filter-container">
<PSTags
v-if="!hasChildren"
ref="tags"
class="form-control search search-input mb-2"
:tags="tags"
:placeholder="hasPlaceholder?placeholder:''"
:hasIcon="true"
@tagChange="onTagChanged"
@typing="onTyping"
/>
<div v-if="hasChildren">
<PSTree
v-if="isOverview"
v-once
ref="tree"
:hasCheckbox="true"
:model="list"
@checked="onCheck"
:translations="PSTreeTranslations"
>
</PSTree>
<PSTree
v-else
ref="tree"
:hasCheckbox="true"
:model="list"
@checked="onCheck"
:translations="PSTreeTranslations"
>
</PSTree>
</div>
<ul
class="mt-1"
v-else
>
<li
v-for="(item, index) in items"
v-show="item.visible"
class="item"
>
<PSTreeItem
:label="item[label]"
:model="item"
@checked="onCheck"
:hasCheckbox="true"
/>
</li>
</ul>
</div>
</template>
<script>
import PSTags from '@app/widgets/ps-tags';
import PSTreeItem from '@app/widgets/ps-tree/ps-tree-item';
import PSTree from '@app/widgets/ps-tree/ps-tree';
import { EventBus } from '@app/utils/event-bus';
import _ from 'lodash';
export default {
props: ['placeholder', 'itemID', 'label', 'list'],
computed: {
isOverview() {
return this.$route.name === 'overview';
},
hasPlaceholder() {
return !this.tags.length;
},
items() {
const matchList = [];
this.list.filter((data) => {
const label = data[this.label].toLowerCase();
data.visible = false;
if (label.match(this.currentVal)) {
data.visible = true;
matchList.push(data);
}
if (data.children) {
this.hasChildren = true;
}
return data;
});
if (matchList.length === 1) {
this.match = matchList[0];
} else {
this.match = null;
}
return this.list;
},
PSTreeTranslations() {
return {
expand: this.trans('tree_expand'),
reduce: this.trans('tree_reduce'),
};
},
},
methods: {
onCheck(obj) {
const itemLabel = obj.item[this.label];
const filterType = this.hasChildren ? 'category' : 'supplier';
if (obj.checked) {
this.tags.push(itemLabel);
} else {
const index = this.tags.indexOf(itemLabel);
if (this.splice) {
this.tags.splice(index, 1);
}
this.splice = true;
}
if (this.tags.length) {
this.$emit('active', this.filterList(this.tags), filterType);
} else {
this.$emit('active', [], filterType);
}
},
onTyping(val) {
this.currentVal = val.toLowerCase();
},
onTagChanged(tag) {
let checkedTag = tag;
if (this.tags.indexOf(this.currentVal) !== -1) {
this.tags.pop();
}
this.splice = false;
if (this.match) {
checkedTag = this.match[this.label];
}
EventBus.$emit('toggleCheckbox', checkedTag);
this.currentVal = '';
},
filterList(tags) {
const idList = [];
const categoryList = this.$store.state.categoryList;
const list = this.hasChildren ? categoryList : this.list;
list.map((data) => {
const isInIdList = idList.indexOf(Number(data[this.itemID])) === -1;
if (tags.indexOf(data[this.label]) !== -1 && isInIdList) {
idList.push(Number(data[this.itemID]));
}
return idList;
});
return idList;
},
},
data() {
return {
currentVal: '',
match: null,
tags: [],
splice: true,
hasChildren: false,
};
},
components: {
PSTags,
PSTree,
PSTreeItem,
},
};
</script>

View File

@@ -0,0 +1,85 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div class="container-fluid">
<div class="row py-2">
<div class="col row ml-1">
<PSCheckbox ref="low-filter" id="low-filter" class="mt-1" @checked="onCheck">
<span slot="label" class="ml-2">{{trans('filter_low_stock')}}</span>
</PSCheckbox>
</div>
<div class="col mr-3 d-flex align-items-center justify-content-end">
<a :href="stockExporttUrl">
<span data-toggle="pstooltip" :title="stockExportTitle" data-html="true" data-placement="top">
<i class="material-icons">cloud_upload</i>
</span>
</a>
<a class="ml-2" :href="stockImportUrl" target="_blank">
<span data-toggle="pstooltip" :title="stockImportTitle" data-html="true" data-placement="top">
<i class="material-icons">cloud_download</i>
</span>
</a>
</div>
</div>
</div>
</template>
<script>
import PSCheckbox from '@app/widgets/ps-checkbox';
export default {
props: {
filters: {},
},
computed: {
stockImportTitle() {
return this.trans('title_import');
},
stockExportTitle() {
return this.trans('title_export');
},
stockImportUrl() {
return window.data.stockImportUrl;
},
stockExporttUrl() {
const params = $.param(this.filters);
return `${window.data.stockExportUrl}&${params}`;
},
},
methods: {
onCheck(checkbox) {
const isChecked = checkbox.checked ? 1 : 0;
this.$emit('lowStockChecked', isChecked);
},
},
mounted() {
$('[data-toggle="pstooltip"]').pstooltip();
},
components: {
PSCheckbox,
},
};
</script>

View File

@@ -0,0 +1,115 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div id="search" class="row mb-2">
<div class="col-md-8">
<div class="mb-2">
<form class="search-form" @submit.prevent>
<label>{{trans('product_search')}}</label>
<div class="input-group">
<PSTags ref="psTags" :tags="tags" @tagChange="onSearch" />
<div class="input-group-append">
<PSButton @click="onClick" class="search-button" :primary="true">
<i class="material-icons">search</i>
{{trans('button_search')}}
</PSButton>
</div>
</div>
</form>
</div>
<Filters @applyFilter="applyFilter"/>
</div>
<div class="col-md-4 alert-box">
<transition name="fade">
<PSAlert
v-if="showAlert"
:alertType="alertType"
:hasClose="true"
@closeAlert="onCloseAlert"
>
<span v-if="error">{{trans('alert_bulk_edit')}}</span>
<span v-else>{{trans('notification_stock_updated')}}</span>
</PSAlert>
</transition>
</div>
</div>
</template>
<script>
import Filters from './filters';
import PSTags from '@app/widgets/ps-tags';
import PSButton from '@app/widgets/ps-button';
import PSAlert from '@app/widgets/ps-alert';
import { EventBus } from '@app/utils/event-bus';
export default {
components: {
Filters,
PSTags,
PSButton,
PSAlert,
},
computed: {
error() {
return (this.alertType === 'ALERT_TYPE_DANGER');
},
},
methods: {
onClick() {
const tag = this.$refs.psTags.tag;
this.$refs.psTags.add(tag);
},
onSearch() {
this.$emit('search', this.tags);
},
applyFilter(filters) {
this.$emit('applyFilter', filters);
},
onCloseAlert() {
this.showAlert = false;
},
},
watch: {
$route() {
this.tags = [];
},
},
mounted() {
EventBus.$on('displayBulkAlert', (type) => {
this.alertType = type === 'success' ? 'ALERT_TYPE_SUCCESS' : 'ALERT_TYPE_DANGER';
this.showAlert = true;
setTimeout(_ => {
this.showAlert = false;
}, 5000);
});
},
data: () => ({
tags: [],
showAlert: false,
alertType: 'ALERT_TYPE_DANGER',
duration: false,
}),
};
</script>

View File

@@ -0,0 +1,67 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div class="header-toolbar">
<div class="container-fluid">
<Breadcrumb />
<div class="title-row">
<h1 class="title">{{trans('head_title')}}</h1>
</div>
</div>
<Tabs />
</div>
</template>
<script>
import Breadcrumb from './breadcrumb';
import Tabs from './tabs';
const $ = global.$;
function getOldHeaderToolbarButtons() {
return $('.header-toolbar')
.first()
.find('.toolbar-icons');
}
export default {
components: {
Breadcrumb,
Tabs,
},
mounted() {
// move the toolbar buttons to this header
const toolbarButtons = getOldHeaderToolbarButtons();
toolbarButtons.insertAfter($(this.$el).find('.title-row > .title'));
// signal header change (so size can be updated)
const event = $.Event('vueHeaderMounted', {
name: 'stock-header',
});
$(document).trigger(event);
},
};
</script>

View File

@@ -0,0 +1,49 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div class="page-head-tabs" id="head_tabs">
<ul class="nav nav-pills">
<li class="nav-item">
<router-link data-toggle="tab" class="nav-link" :class="{active : isOverview}" to="/" role="tab">{{trans('menu_stock')}}</router-link>
</li>
<li class="nav-item">
<router-link data-toggle="tab" class="nav-link" :class="{active : isMovements}" to="/movements" role="tab">{{trans('menu_movements')}}</router-link>
</li>
</ul>
</div>
</template>
<script>
export default {
computed: {
isOverview() {
return this.$route.name === 'overview';
},
isMovements() {
return this.$route.name === 'movements';
},
},
};
</script>

View File

@@ -0,0 +1,128 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<section class="stock-movements">
<PSTable class="mt-1">
<thead>
<tr>
<th width="30%">
<PSSort order="product" @sort="sort" :current-sort="currentSort">
{{trans('title_product')}}
</PSSort>
</th>
<th>
<PSSort order="reference" @sort="sort" :current-sort="currentSort">
{{trans('title_reference')}}
</PSSort>
</th>
<th>
{{trans('title_movements_type')}}
</th>
<th class="text-center">
{{trans('title_quantity')}}
</th>
<th class="text-center">
<PSSort order="date_add" @sort="sort" :current-sort="currentSort">
{{trans('title_date')}}
</PSSort>
</th>
<th>
{{trans('title_employee')}}
</th>
</tr>
</thead>
<tbody>
<tr v-if="this.isLoading">
<td colspan="6">
<PSLoader v-for="(n, index) in 3" class="mt-1" :key="index">
<div class="background-masker header-top"></div>
<div class="background-masker header-left"></div>
<div class="background-masker header-bottom"></div>
<div class="background-masker subheader-left"></div>
<div class="background-masker subheader-bottom"></div>
</PSLoader>
</td>
</tr>
<tr v-else-if="emptyMovements">
<td colspan="6">
<PSAlert alertType="ALERT_TYPE_WARNING" :hasClose="false">
{{trans('no_product')}}
</PSAlert>
</td>
</tr>
<MovementLine v-else v-for="(product, index) in movements" key=${index} :product="product" />
</tbody>
</PSTable>
</section>
</template>
<script>
import PSTable from '@app/widgets/ps-table/ps-table';
import PSSort from '@app/widgets/ps-table/ps-sort';
import PSAlert from '@app/widgets/ps-alert';
import PSLoader from '@app/widgets/ps-loader';
import MovementLine from './movement-line';
const DEFAULT_SORT = 'desc';
export default {
computed: {
isLoading() {
return this.$store.state.isLoading;
},
movements() {
return this.$store.state.movements;
},
emptyMovements() {
return !this.$store.state.movements.length;
},
currentSort() {
return this.$store.state.order;
},
},
methods: {
sort(order, sortDirection) {
this.$store.dispatch('updateOrder', order);
this.$emit('fetch', sortDirection === 'desc' ? 'desc' : 'asc');
},
},
mounted() {
this.$store.dispatch('updatePageIndex', 1);
this.$store.dispatch('updateKeywords', []);
this.$store.dispatch('getEmployees');
this.$store.dispatch('getMovementsTypes');
this.$store.dispatch('updateOrder', 'date_add');
this.$emit('resetFilters');
this.$emit('fetch', DEFAULT_SORT);
},
components: {
PSTable,
PSSort,
PSAlert,
PSLoader,
MovementLine,
},
};
</script>

View File

@@ -0,0 +1,92 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<tr>
<td>
<div class="d-flex align-items-center">
<PSMedia
class="d-flex align-items-center"
:thumbnail="thumbnail"
>
<p>
{{ product.product_name }}
<small v-if="hasCombination"><br />
{{ combinationName }}
</small>
</p>
</PSMedia>
</div>
</td>
<td>
{{ product.product_reference }}
</td>
<td>
<a v-if="orderLink" :href="orderLink" target="_blank">
{{ product.movement_reason }}
</a>
<span v-else>{{ product.movement_reason }}</span>
</td>
<td class="text-sm-center">
<span class="qty-number" :class="{'is-positive' : isPositive}">
<span v-if="isPositive">+</span>
<span v-else>-</span>
{{ qty }}
</span>
</td>
<td class="text-sm-center">
{{ product.date_add }}
</td>
<td>
{{ employeeName }}
</td>
</tr>
</template>
<script>
import PSMedia from '@app/widgets/ps-media';
import productDesc from '@app/pages/stock/mixins/product-desc';
export default {
props: ['product'],
mixins: [productDesc],
computed: {
qty() {
return this.product.physical_quantity;
},
employeeName() {
return `${this.product.employee_firstname} ${this.product.employee_lastname}`;
},
isPositive() {
return this.product.sign > 0;
},
orderLink() {
return this.product.order_link !== 'N/A' ? this.product.order_link : null;
},
},
components: {
PSMedia,
},
};
</script>

View File

@@ -0,0 +1,65 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<section class="stock-overview">
<ProductsActions />
<ProductsTable
:isLoading="isLoading"
@sort="sort"
/>
</section>
</template>
<script>
import ProductsActions from './products-actions';
import ProductsTable from './products-table';
const DEFAULT_SORT = 'asc';
export default {
computed: {
isLoading() {
return this.$store.state.isLoading;
},
},
methods: {
sort(sortDirection) {
this.$emit('fetch', sortDirection);
},
},
mounted() {
this.$store.dispatch('updatePageIndex', 1);
this.$store.dispatch('updateKeywords', []);
this.$store.dispatch('updateOrder', 'product');
this.$store.dispatch('isLoading');
this.$emit('resetFilters');
this.$emit('fetch', DEFAULT_SORT);
},
components: {
ProductsActions,
ProductsTable,
},
};
</script>

View File

@@ -0,0 +1,74 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div class="col-md-4">
<div class="movements">
<PSButton
type="button"
class="update-qty float-sm-right"
:class="classObject"
:disabled="disabled"
:primary="true"
@click="sendQty"
>
<i class="material-icons">edit</i>
{{trans('button_movement_type')}}
</PSButton>
</div>
</div>
</template>
<script>
import PSButton from '@app/widgets/ps-button';
export default {
computed: {
disabled() {
return !this.$store.state.hasQty;
},
classObject() {
return {
'btn-primary': !this.disabled,
};
},
},
methods: {
sendQty() {
this.$store.dispatch('updateQtyByProductsId');
},
},
components: {
PSButton,
},
};
</script>
<style lang="scss" scoped>
@import "../../../../../../scss/config/_settings.scss";
.update-qty {
color: white;
transition: background-color 0.2s ease;
}
</style>

View File

@@ -0,0 +1,174 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<tr :class="{'low-stock':lowStock}">
<td>
<div class="d-flex align-items-center">
<PSCheckbox
:id="id"
:ref="id"
:model="product"
@checked="productChecked"
/>
<PSMedia
class="d-flex align-items-center ml-2"
:thumbnail="thumbnail"
>
<p>
{{ product.product_name }}
<small v-if="hasCombination"><br />
{{ combinationName }}
</small>
</p>
</PSMedia>
</div>
</td>
<td>
{{ reference }}
</td>
<td>
{{ product.supplier_name }}
</td>
<td v-if="product.active" class="text-sm-center">
<i class="material-icons enable">check</i>
</td>
<td v-else class="text-sm-center">
<i class="material-icons disable">close</i>
</td>
<td class="text-sm-center" :class="{'stock-warning':lowStock}">
{{ physical }}
<span v-if="updatedQty" class="qty-update" :class="{'stock-warning':lowStock}">
<i class="material-icons">trending_flat</i>
{{physicalQtyUpdated}}
</span>
</td>
<td class="text-sm-center" :class="{'stock-warning':lowStock}">
{{ product.product_reserved_quantity }}
</td>
<td class="text-sm-center" :class="{'stock-warning':lowStock}">
{{ product.product_available_quantity }}
<span v-if="updatedQty" class="qty-update" :class="{'stock-warning':lowStock}">
<i class="material-icons">trending_flat</i>
{{availableQtyUpdated}}
</span>
<span v-if="lowStock" class="stock-warning ico ml-2" data-toggle="pstooltip" data-placement="top" data-html="true" :title="lowStockLevel">!</span>
</td>
<td class="qty-spinner text-right">
<Spinner :product="product" @updateProductQty="updateProductQty" />
</td>
</tr>
</template>
<script>
import PSCheckbox from '@app/widgets/ps-checkbox';
import PSMedia from '@app/widgets/ps-media';
import ProductDesc from '@app/pages/stock/mixins/product-desc';
import { EventBus } from '@app/utils/event-bus';
import Spinner from '@app/pages/stock/components/overview/spinner';
import _ from 'lodash';
export default {
props: ['product'],
mixins: [ProductDesc],
computed: {
reference() {
if (this.product.combination_reference !== 'N/A') {
return this.product.combination_reference;
}
return this.product.product_reference;
},
updatedQty() {
return !!this.product.qty;
},
physicalQtyUpdated() {
return Number(this.physical) + Number(this.product.qty);
},
availableQtyUpdated() {
return Number(this.product.product_available_quantity) + Number(this.product.qty);
},
physical() {
const productAvailableQty = Number(this.product.product_available_quantity);
const productReservedQty = Number(this.product.product_reserved_quantity);
return productAvailableQty + productReservedQty;
},
lowStock() {
return this.product.product_low_stock_alert;
},
lowStockLevel() {
return `<div class="text-sm-left">
<p>${this.trans('product_low_stock')}</p>
<p><strong>${this.trans('product_low_stock_level')} ${this.product.product_low_stock_threshold}</strong></p>
</div>`;
},
lowStockAlert() {
return `<div class="text-sm-left">
<p><strong>${this.trans('product_low_stock_alert')} ${this.product.product_low_stock_alert}</strong></p>
</div>`;
},
id() {
return `product-${this.product.product_id}${this.product.combination_id}`;
},
},
methods: {
productChecked(checkbox) {
if (checkbox.checked) {
this.$store.dispatch('addSelectedProduct', checkbox.item);
} else {
this.$store.dispatch('removeSelectedProduct', checkbox.item);
}
},
updateProductQty(productToUpdate) {
const updatedProduct = {
product_id: productToUpdate.product.product_id,
combination_id: productToUpdate.product.combination_id,
delta: productToUpdate.delta,
};
this.$store.dispatch('updateProductQty', updatedProduct);
if (productToUpdate.delta) {
this.$store.dispatch('addProductToUpdate', updatedProduct);
} else {
this.$store.dispatch('removeProductToUpdate', updatedProduct);
}
},
},
mounted() {
EventBus.$on('toggleProductsCheck', (checked) => {
const ref = this.id;
if (this.$refs[ref]) {
this.$refs[ref].checked = checked;
}
});
$('[data-toggle="pstooltip"]').pstooltip();
},
data: () => ({
bulkEdition: false,
}),
components: {
Spinner,
PSMedia,
PSCheckbox,
},
};
</script>

View File

@@ -0,0 +1,147 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div class="row product-actions">
<div
class="col-md-8 qty d-flex align-items-center"
:class="{'active' : isFocused}"
>
<PSCheckbox
id="bulk-action"
ref="bulk-action"
class="mt-3"
:isIndeterminate="isIndeterminate"
@checked="bulkChecked"
/>
<div class="ml-2">
<small>{{trans('title_bulk')}}</small>
<PSNumber
class="bulk-qty"
:danger="danger"
:value="bulkEditQty"
:buttons="this.isFocused"
@focus="focusIn"
@blur="focusOut($event)"
@change="onChange"
@keyup="onKeyUp"
/>
</div>
</div>
<div class="col-md-4">
<PSButton
type="button"
class="update-qty float-sm-right my-4 mr-2"
:class="{'btn-primary': disabled }"
:disabled="disabled"
:primary="true"
@click="sendQty"
>
<i class="material-icons">edit</i>
{{trans('button_movement_type')}}
</PSButton>
</div>
</div>
</template>
<script>
import PSNumber from '@app/widgets/ps-number';
import PSCheckbox from '@app/widgets/ps-checkbox';
import PSButton from '@app/widgets/ps-button';
import { EventBus } from '@app/utils/event-bus';
export default {
computed: {
disabled() {
return !this.$store.state.hasQty;
},
bulkEditQty() {
return this.$store.state.bulkEditQty;
},
isIndeterminate() {
const selectedProductsLng = this.selectedProductsLng;
const productsLng = this.$store.state.products.length;
const isIndeterminate = (selectedProductsLng > 0 && selectedProductsLng < productsLng);
if (isIndeterminate) {
this.$refs['bulk-action'].checked = true;
}
return isIndeterminate;
},
selectedProductsLng() {
return this.$store.getters.selectedProductsLng;
},
},
watch: {
selectedProductsLng(value) {
if (value === 0 && this.$refs['bulk-action']) {
this.$refs['bulk-action'].checked = false;
this.isFocused = false;
}
if (value === 1 && this.$refs['bulk-action']) {
this.isFocused = true;
}
},
},
methods: {
focusIn() {
this.danger = !this.selectedProductsLng;
this.isFocused = !this.danger;
if (this.danger) {
EventBus.$emit('displayBulkAlert', 'error');
}
},
focusOut(event) {
this.isFocused = $(event.target).hasClass('ps-number');
this.danger = false;
},
bulkChecked(checkbox) {
if (!checkbox.checked) {
this.$store.dispatch('updateBulkEditQty', null);
}
if (!this.isIndeterminate) {
EventBus.$emit('toggleProductsCheck', checkbox.checked);
}
},
sendQty() {
this.$store.dispatch('updateQtyByProductsId');
},
onChange(value) {
this.$store.dispatch('updateBulkEditQty', value);
},
onKeyUp(event) {
this.isFocused = true;
this.$store.dispatch('updateBulkEditQty', event.target.value);
},
},
data: () => ({
isFocused: false,
danger: false,
}),
components: {
PSNumber,
PSCheckbox,
PSButton,
},
};
</script>

View File

@@ -0,0 +1,129 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<PSTable class="mt-1">
<thead>
<tr class="column-headers">
<th scope="col" width="27%" class="product-title">
<PSSort order="product" @sort="sort" :current-sort="currentSort">
{{trans('title_product')}}
</PSSort>
</th>
<th scope="col">
<PSSort order="reference" @sort="sort" :current-sort="currentSort">
{{trans('title_reference')}}
</PSSort>
</th>
<th>
<PSSort order="supplier" @sort="sort" :current-sort="currentSort">
{{trans('title_supplier')}}
</PSSort>
</th>
<th class="text-center">
{{trans('title_status')}}
</th>
<th class="text-center">
<PSSort order="physical_quantity" @sort="sort" :current-sort="currentSort">
{{trans('title_physical')}}
</PSSort>
</th>
<th class="text-center">
{{trans('title_reserved')}}
</th>
<th class="text-center">
<PSSort order="available_quantity" @sort="sort" :current-sort="currentSort">
{{trans('title_available')}}
</PSSort>
</th>
<th :title="trans('title_edit_quantity')">
<i class="material-icons">edit</i>
{{trans('title_edit_quantity')}}
</th>
</tr>
</thead>
<tbody>
<tr v-if="this.isLoading">
<td colspan="8">
<PSLoader v-for="(n, index) in 3" class="mt-1" :key="index">
<div class="background-masker header-top"></div>
<div class="background-masker header-left"></div>
<div class="background-masker header-bottom"></div>
<div class="background-masker subheader-left"></div>
<div class="background-masker subheader-bottom"></div>
</PSLoader>
</td>
</tr>
<tr v-else-if="emptyProducts">
<td colspan="8">
<PSAlert alertType="ALERT_TYPE_WARNING" :hasClose="false" >
{{trans('no_product')}}
</PSAlert>
</td>
</tr>
<ProductLine
v-else
v-for="(product, index) in products"
:key=index
:product="product"
/>
</tbody>
</PSTable>
</template>
<script>
import ProductLine from './product-line';
import PSAlert from '@app/widgets/ps-alert';
import PSTable from '@app/widgets/ps-table/ps-table';
import PSSort from '@app/widgets/ps-table/ps-sort';
import PSLoader from '@app/widgets/ps-loader';
export default {
props: ['isLoading'],
components: {
ProductLine,
PSSort,
PSAlert,
PSTable,
PSLoader,
},
methods: {
sort(order, sortDirection) {
this.$store.dispatch('updateOrder', order);
this.$emit('sort', sortDirection === 'desc' ? 'desc' : 'asc');
},
},
computed: {
products() {
return this.$store.state.products;
},
emptyProducts() {
return !this.$store.state.products.length;
},
currentSort() {
return this.$store.state.order;
},
},
};
</script>

View File

@@ -0,0 +1,151 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<form
class="qty"
:class="classObject"
@mouseover="focusIn"
@mouseleave="focusOut($event)"
@submit.prevent="sendQty"
>
<PSNumber
name="qty"
class="edit-qty"
placeholder="0"
pattern="\d*"
step="1"
buttons="true"
hoverButtons="true"
:value="qty"
@change="onChange"
@keyup="onKeyup($event)"
@focus="focusIn"
@blur="focusOut($event)"
/>
<transition name="fade">
<button v-if="isActive" class="check-button"><i class="material-icons">check</i></button>
</transition>
</form>
</template>
<script>
import PSNumber from '@app/widgets/ps-number';
const $ = global.$;
export default {
props: ['product'],
computed: {
qty() {
if (!this.product.qty) {
this.isEnabled = false;
this.value = '';
}
return this.product.qty;
},
id() {
return `qty-${this.product.product_id}-${this.product.combination_id}`;
},
classObject() {
return {
active: this.isActive,
disabled: !this.isEnabled,
};
},
},
methods: {
onChange(val) {
this.value = val;
this.isEnabled = !!val;
},
deActivate() {
this.isActive = false;
this.isEnabled = false;
this.value = null;
this.product.qty = null;
},
onKeyup(event) {
const val = event.target.value;
if (val === 0) {
this.deActivate();
} else {
this.isActive = true;
this.isEnabled = true;
this.value = val;
}
},
focusIn() {
this.isActive = true;
},
focusOut(event) {
const value = parseInt(this.value, 10);
if (!$(event.target).hasClass('ps-number') && (isNaN(value) || value === 0)) {
this.isActive = false;
}
this.isEnabled = !!this.value;
},
sendQty() {
const postUrl = this.product.edit_url;
if (parseInt(this.product.qty, 10) !== 0 && !isNaN(parseInt(this.value, 10))) {
this.$store.dispatch('updateQtyByProductId', {
url: postUrl,
delta: this.value,
});
this.deActivate();
}
},
},
watch: {
value(val) {
this.$emit('updateProductQty', {
product: this.product,
delta: val,
});
},
},
components: {
PSNumber,
},
data: () => ({
value: null,
isActive: false,
isEnabled: false,
}),
};
</script>
<style lang="scss" type="text/scss" scoped>
@import "~jquery-ui-dist/jquery-ui.css";
*{
outline: none;
}
.fade-enter-active, .fade-leave-active {
transition: opacity 0.2s ease;
}
.fade-enter, .fade-leave-to {
opacity: 0
}
</style>

View File

@@ -0,0 +1,42 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import Vue from 'vue';
import app from './components/app';
import store from './store/';
import router from './router';
import Translation from './mixins/translate';
Vue.mixin(Translation);
new Vue({
router,
store,
el: '#stock-app',
template: '<app />',
components: { app },
beforeMount() {
this.$store.dispatch('getTranslations');
},
});

View File

@@ -0,0 +1,48 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
export default {
computed: {
thumbnail() {
if (this.product.combination_thumbnail !== 'N/A') {
return `${this.product.combination_thumbnail}`;
} else if (this.product.product_thumbnail !== 'N/A') {
return `${this.product.product_thumbnail}`;
}
return null;
},
combinationName() {
const arr = this.product.combination_name.split(',');
let attr = '';
arr.forEach((attribute) => {
const value = attribute.split('-');
attr += attr.length ? ` - ${value[1]}` : value[1];
});
return attr;
},
hasCombination() {
return !!this.product.combination_id;
},
},
};

View File

@@ -0,0 +1,31 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
export default {
methods: {
trans(key) {
return this.$store.state.translations[key];
},
},
};

View File

@@ -0,0 +1,50 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import Vue from 'vue';
import VueRouter from 'vue-router';
import Overview from '@app/pages/stock/components/overview/index';
import Movements from '@app/pages/stock/components/movements/index';
Vue.use(VueRouter);
export default new VueRouter({
mode: 'history',
base: (() => {
const hasIndex = /(index\.php)/.exec(window.location.href);
return `${window.data.baseUrl}${hasIndex ? '/index.php' : ''}/sell/stocks`;
})(),
routes: [
{
path: '/',
name: 'overview',
component: Overview,
},
{
path: '/movements',
name: 'movements',
component: Movements,
},
],
});

View File

@@ -0,0 +1,190 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import Vue from 'vue';
import VueResource from 'vue-resource';
import * as types from '@app/pages/stock/store/mutation-types';
import { showGrowl } from '@app/utils/growl';
import { EventBus } from '@app/utils/event-bus';
import _ from 'lodash';
Vue.use(VueResource);
export const getStock = ({ commit }, payload) => {
const url = window.data.apiStockUrl;
Vue.http.get(url, {
params: {
order: payload.order,
page_size: payload.page_size,
page_index: payload.page_index,
keywords: payload.keywords ? payload.keywords : [],
supplier_id: payload.suppliers ? payload.suppliers : [],
category_id: payload.categories ? payload.categories : [],
active: payload.active !== 'null' ? payload.active : [],
low_stock: payload.low_stock,
},
}).then((response) => {
commit(types.LOADING_STATE, false);
commit(types.SET_TOTAL_PAGES, response.headers.get('Total-Pages'));
commit(types.ADD_PRODUCTS, response.body);
}, (error) => {
showGrowl('error', error.statusText);
});
};
export const getSuppliers = ({ commit }) => {
const url = window.data.suppliersUrl;
Vue.http.get(url).then((response) => {
commit(types.SET_SUPPLIERS, response.body);
}, (error) => {
showGrowl('error', error.statusText);
});
};
export const getCategories = ({ commit }) => {
const url = window.data.categoriesUrl;
Vue.http.get(url).then((response) => {
commit(types.SET_CATEGORIES, response.body);
}, (error) => {
showGrowl('error', error.statusText);
});
};
export const getMovements = ({ commit }, payload) => {
const url = window.data.apiMovementsUrl;
Vue.http.get(url, {
params: {
order: payload.order,
page_size: payload.page_size,
page_index: payload.page_index,
keywords: payload.keywords ? payload.keywords : [],
supplier_id: payload.suppliers ? payload.suppliers : [],
category_id: payload.categories ? payload.categories : [],
id_stock_mvt_reason: payload.id_stock_mvt_reason ? payload.id_stock_mvt_reason : [],
id_employee: payload.id_employee ? payload.id_employee : [],
date_add: payload.date_add ? payload.date_add : [],
},
}).then((response) => {
commit(types.LOADING_STATE, false);
commit(types.SET_TOTAL_PAGES, response.headers.get('Total-Pages'));
commit(types.SET_MOVEMENTS, response.body);
}, (error) => {
showGrowl('error', error.statusText);
});
};
export const getTranslations = ({ commit }) => {
const url = window.data.translationUrl;
Vue.http.get(url).then((response) => {
commit(types.SET_TRANSLATIONS, response.body);
commit(types.APP_IS_READY);
}, (error) => {
showGrowl('error', error.statusText);
});
};
export const getEmployees = ({ commit }) => {
const url = window.data.employeesUrl;
Vue.http.get(url).then((response) => {
commit(types.SET_EMPLOYEES_LIST, response.body);
}, (error) => {
showGrowl('error', error.statusText);
});
};
export const getMovementsTypes = ({ commit }) => {
const url = window.data.movementsTypesUrl;
Vue.http.get(url).then((response) => {
commit(types.SET_MOVEMENTS_TYPES, response.body);
}, (error) => {
showGrowl('error', error.statusText);
});
};
export const updateOrder = ({ commit }, order) => {
commit(types.UPDATE_ORDER, order);
};
export const updatePageIndex = ({ commit }, pageIndex) => {
commit(types.SET_PAGE_INDEX, pageIndex);
};
export const updateKeywords = ({ commit }, keywords) => {
commit(types.UPDATE_KEYWORDS, keywords);
};
export const isLoading = ({ commit }) => {
commit(types.LOADING_STATE, true);
};
export const updateProductQty = ({ commit }, payload) => {
commit(types.UPDATE_PRODUCT_QTY, payload);
};
export const updateQtyByProductId = ({ commit, state }, payload) => {
const url = payload.url;
const delta = payload.delta;
Vue.http.post(url, {
delta,
}).then((res) => {
commit(types.UPDATE_PRODUCT, res.body);
EventBus.$emit('displayBulkAlert', 'success');
}, (error) => {
showGrowl('error', error.statusText);
});
};
export const updateQtyByProductsId = ({ commit, state }) => {
const url = state.editBulkUrl;
const productsQty = state.productsToUpdate;
Vue.http.post(url, productsQty).then((res) => {
commit(types.UPDATE_PRODUCTS_QTY, res.body);
EventBus.$emit('displayBulkAlert', 'success');
}, (error) => {
showGrowl('error', error.statusText);
});
};
export const updateBulkEditQty = ({ commit }, value) => {
commit(types.UPDATE_BULK_EDIT_QTY, value);
};
export const addProductToUpdate = ({ commit }, product) => {
commit(types.ADD_PRODUCT_TO_UPDATE, product);
};
export const removeProductToUpdate = ({ commit }, product) => {
commit(types.REMOVE_PRODUCT_TO_UPDATE, product);
};
export const addSelectedProduct = ({ commit }, product) => {
commit(types.ADD_SELECTED_PRODUCT, product);
};
export const removeSelectedProduct = ({ commit }, product) => {
commit(types.REMOVE_SELECTED_PRODUCT, product);
};

View File

@@ -0,0 +1,95 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import Vue from 'vue';
import Vuex from 'vuex';
import * as actions from './actions';
import mutations from './mutations';
import _ from 'lodash';
Vue.use(Vuex);
// root state object.
const state = {
order: '',
pageIndex: 1,
totalPages: 0,
productsPerPage: 30,
products: [],
hasQty: false,
keywords: [],
suppliers: {
data: [],
},
categories: [],
categoryList: [],
movements: [],
employees: [],
movementsTypes: [],
translations: {},
isLoading: false,
isReady: false,
editBulkUrl: '',
bulkEditQty: null,
productsToUpdate: [],
selectedProducts: [],
};
// getters are functions
const getters = {
suppliers(rootState) {
function convert(suppliers) {
suppliers.forEach((supplier) => {
supplier.id = supplier.supplier_id;
});
return suppliers;
}
return convert(rootState.suppliers.data);
},
categories(rootState) {
function convert(categories) {
categories.forEach((category) => {
category.children = _.values(category.children);
rootState.categoryList.push(category);
category.id = `${category.id_parent}-${category.id_category}`;
convert(category.children);
});
return categories;
}
return convert(rootState.categories);
},
selectedProductsLng(rootState) {
return rootState.selectedProducts.length;
},
};
// A Vuex instance is created by combining the state, mutations, actions,
// and getters.
export default new Vuex.Store({
state,
getters,
actions,
mutations,
});

View File

@@ -0,0 +1,45 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
export const ADD_PRODUCTS = 'ADD_PRODUCTS';
export const ADD_PRODUCT_TO_UPDATE = 'ADD_PRODUCT_TO_UPDATE';
export const ADD_SELECTED_PRODUCT = 'ADD_SELECTED_PRODUCT';
export const APP_IS_READY = 'APP_IS_READY';
export const LOADING_STATE = 'LOADING_STATE';
export const REMOVE_PRODUCT_TO_UPDATE = 'REMOVE_PRODUCT_TO_UPDATE';
export const REMOVE_SELECTED_PRODUCT = 'REMOVE_SELECTED_PRODUCT';
export const SET_CATEGORIES = 'SET_CATEGORIES';
export const SET_EMPLOYEES_LIST = 'SET_EMPLOYEES_LIST';
export const SET_MOVEMENTS = 'SET_MOVEMENTS';
export const SET_MOVEMENTS_TYPES = 'SET_MOVEMENTS_TYPES';
export const SET_PAGE_INDEX = 'SET_PAGE_INDEX';
export const SET_SUPPLIERS = 'SET_SUPPLIERS';
export const SET_TOTAL_PAGES = 'SET_TOTAL_PAGES';
export const SET_TRANSLATIONS = 'SET_TRANSLATIONS';
export const UPDATE_BULK_EDIT_QTY = 'UPDATE_BULK_EDIT_QTY';
export const UPDATE_KEYWORDS = 'UPDATE_KEYWORDS';
export const UPDATE_PRODUCT = 'UPDATE_PRODUCT';
export const UPDATE_PRODUCT_QTY = 'UPDATE_PRODUCT_QTY';
export const UPDATE_PRODUCTS_QTY = 'UPDATE_PRODUCTS_QTY';
export const UPDATE_ORDER = 'UPDATE_ORDER';

View File

@@ -0,0 +1,185 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import * as types from './mutation-types';
export default {
[types.UPDATE_ORDER](state, order) {
state.order = order;
},
[types.UPDATE_KEYWORDS](state, keywords) {
state.keywords = keywords;
},
[types.SET_TOTAL_PAGES](state, totalPages) {
state.totalPages = Number(totalPages);
},
[types.SET_PAGE_INDEX](state, pageIndex) {
state.pageIndex = pageIndex;
},
[types.SET_SUPPLIERS](state, suppliers) {
state.suppliers = suppliers;
},
[types.SET_CATEGORIES](state, categories) {
state.categories = categories.data.tree.children;
},
[types.SET_MOVEMENTS](state, movements) {
state.movements = movements.data;
},
[types.SET_TRANSLATIONS](state, translations) {
translations.data.forEach((t) => {
state.translations[t.translation_id] = t.name;
});
},
[types.LOADING_STATE](state, isLoading) {
state.isLoading = isLoading;
},
[types.APP_IS_READY](state) {
state.isReady = true;
},
[types.SET_EMPLOYEES_LIST](state, employees) {
state.employees = employees.data;
},
[types.SET_MOVEMENTS_TYPES](state, movementsTypes) {
state.movementsTypes = movementsTypes.data;
},
[types.ADD_PRODUCTS](state, products) {
state.productsToUpdate = [];
state.selectedProducts = [];
_.forEach(products.data.data, (product) => {
product.qty = 0;
});
state.editBulkUrl = products.data.info.edit_bulk_url;
state.products = products.data.data;
},
[types.UPDATE_PRODUCT](state, updatedProduct) {
const index = _.findIndex(state.products, {
product_id: updatedProduct.product_id,
combination_id: updatedProduct.combination_id,
});
const updatedIndex = _.findIndex(state.productsToUpdate, {
product_id: updatedProduct.product_id,
combination_id: updatedProduct.combination_id,
});
updatedProduct.qty = 0;
state.products.splice(index, 1, updatedProduct);
state.productsToUpdate.splice(updatedIndex, 1);
},
[types.UPDATE_PRODUCTS_QTY](state, updatedProducts) {
state.productsToUpdate = [];
state.selectedProducts = [];
_.forEach(updatedProducts, (product) => {
const index = _.findIndex(state.products, {
product_id: product.product_id,
combination_id: product.combination_id,
});
product.qty = 0;
state.products.splice(index, 1, product);
});
state.hasQty = false;
},
[types.UPDATE_PRODUCT_QTY](state, updatedProduct) {
let hasQty = false;
const productToUpdate = _.find(state.products, {
product_id: updatedProduct.product_id,
combination_id: updatedProduct.combination_id,
});
_.forEach(state.products, (product) => {
productToUpdate.qty = updatedProduct.delta;
if (product.qty) {
hasQty = true;
}
});
state.hasQty = hasQty;
},
[types.ADD_PRODUCT_TO_UPDATE](state, updatedProduct) {
const index = _.findIndex(state.productsToUpdate, {
product_id: updatedProduct.product_id,
combination_id: updatedProduct.combination_id,
});
if (index !== -1) {
state.productsToUpdate.splice(index, 1, updatedProduct);
} else {
state.productsToUpdate.push(updatedProduct);
}
},
[types.REMOVE_PRODUCT_TO_UPDATE](state, updatedProduct) {
const index = _.findIndex(state.productsToUpdate, {
product_id: updatedProduct.product_id,
combination_id: updatedProduct.combination_id,
});
state.productsToUpdate.splice(index, 1);
},
[types.UPDATE_BULK_EDIT_QTY](state, value) {
state.bulkEditQty = value;
if (value) {
_.forEach(state.selectedProducts, (product) => {
const index = _.findIndex(state.productsToUpdate, {
product_id: product.product_id,
combination_id: product.combination_id,
});
product.qty = value;
product.delta = state.bulkEditQty;
if (index !== -1) {
state.productsToUpdate.splice(index, 1, product);
} else {
state.productsToUpdate.push(product);
}
});
state.hasQty = true;
}
if (value === null) {
_.forEach(state.selectedProducts, (product) => {
product.qty = 0;
});
state.productsToUpdate = [];
state.selectedProducts = [];
state.hasQty = false;
}
},
[types.ADD_SELECTED_PRODUCT](state, product) {
const index = _.findIndex(state.selectedProducts, {
product_id: product.product_id,
combination_id: product.combination_id,
});
if (index !== -1) {
state.selectedProducts.splice(index, 1, product);
} else {
state.selectedProducts.push(product);
}
},
[types.REMOVE_SELECTED_PRODUCT](state, product) {
const index = _.findIndex(state.selectedProducts, {
product_id: product.product_id,
combination_id: product.combination_id,
});
if (index !== -1) {
state.selectedProducts[index].qty = 0;
}
state.selectedProducts.splice(index, 1);
},
};

View File

@@ -0,0 +1,155 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div v-if="isReady" id="app" class="translations-app">
<TranslationsHeader />
<div class="container-fluid">
<div class="row justify-content-between align-items-center">
<Search @search="onSearch" />
<div class="translations-summary">
<span>{{ totalTranslations }}</span>
<span v-show="totalMissingTranslations"> - <span class="missing">{{ totalMissingTranslationsString }}</span></span>
</div>
</div>
<div class="row">
<Sidebar :modal="this.$refs.transModal" :principal="this.$refs.principal"/>
<Principal :modal="this.$refs.transModal" ref="principal" />
</div>
</div>
<PSModal ref="transModal" :translations="translations"/>
</div>
</template>
<script>
import TranslationsHeader from '@app/pages/translations/components/header/translations-header';
import Search from '@app/pages/translations/components/header/search';
import Sidebar from '@app/pages/translations/components/sidebar';
import Principal from '@app/pages/translations/components/principal';
import PSModal from '@app/widgets/ps-modal';
export default {
name: 'app',
computed: {
isReady() {
return this.$store.getters.isReady;
},
totalTranslations() {
return (this.$store.state.totalTranslations <= 1) ? this.trans('label_total_domain_singular').replace('%nb_translation%', this.$store.state.totalTranslations) : this.trans('label_total_domain').replace('%nb_translations%', this.$store.state.totalTranslations);
},
totalMissingTranslations() {
return this.$store.state.totalMissingTranslations;
},
totalMissingTranslationsString() {
return this.totalMissingTranslations === 1 ? this.trans('label_missing_singular') : this.trans('label_missing').replace('%d', this.totalMissingTranslations);
},
translations() {
return {
button_save: this.trans('button_save'),
button_leave: this.trans('button_leave'),
modal_content: this.trans('modal_content'),
modal_title: this.trans('modal_title'),
};
},
},
mounted() {
$('a').on('click', (e) => {
if ($(e.currentTarget).attr('href')) {
this.destHref = $(e.currentTarget).attr('href');
}
});
window.onbeforeunload = () => {
if (!this.destHref && this.isEdited() && !this.leave) {
return true;
}
if (!this.leave && this.isEdited()) {
setTimeout(() => {
window.stop();
}, 500);
this.$refs.transModal.showModal();
this.$refs.transModal.$once('save', () => {
this.$refs.principal.saveTranslations();
this.leavePage();
});
this.$refs.transModal.$once('leave', () => {
this.leavePage();
});
return null;
}
};
},
methods: {
onSearch(keywords) {
this.$store.dispatch('getDomainsTree', {
store: this.$store,
});
this.$store.currentDomain = '';
},
/**
* Set leave to true and redirect the user to the new location
*/
leavePage() {
this.leave = true;
window.location.href = this.destHref;
},
isEdited() {
return this.$refs.principal.edited();
},
},
data: () => ({
destHref: null,
leave: false,
}),
components: {
TranslationsHeader,
Search,
Sidebar,
Principal,
PSModal,
},
};
</script>
<style lang="scss" type="text/scss">
@import "../../../../../scss/config/_settings.scss";
// hide the layout header
#main-div > .header-toolbar {
height: 0;
display: none;
}
.flex {
display: flex;
align-items: center;
}
.missing {
color: $danger;
}
.translations-summary {
font-weight: $font-weight-semibold;
font-size: 1rem;
}
</style>

View File

@@ -0,0 +1,45 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div class="mb-1">
<small>
<a :href="internationalLink">{{trans('link_international')}}</a> /
<a :href="translationLink">{{trans('link_translations')}}</a>
</small>
</div>
</template>
<script>
export default {
computed: {
internationalLink() {
return window.data.internationalUrl;
},
translationLink() {
return window.data.translationsUrl;
},
},
};
</script>

View File

@@ -0,0 +1,72 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div id="search" class="col-md-8 mb-4">
<form class="search-form" @submit.prevent>
<label>{{trans('search_label')}}</label>
<div class="input-group">
<PSTags ref="psTags" :tags="tags" @tagChange="onSearch" :placeholder="trans('search_placeholder')" />
<div class="input-group-append">
<PSButton @click="onClick" class="search-button" :primary="true">
<i class="material-icons">search</i>
{{trans('button_search')}}
</PSButton>
</div>
</div>
</form>
</div>
</template>
<script>
import PSTags from '@app/widgets/ps-tags';
import PSButton from '@app/widgets/ps-button';
export default {
components: {
PSTags,
PSButton,
},
methods: {
onClick() {
const tag = this.$refs.psTags.tag;
this.$refs.psTags.add(tag);
},
onSearch() {
this.$store.dispatch('updateSearch', this.tags);
this.$emit('search', this.tags);
},
},
watch: {
$route() {
this.tags = [];
},
},
data() {
return {
tags: [],
};
},
};
</script>

View File

@@ -0,0 +1,63 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div class="header-toolbar">
<div class="container-fluid">
<Breadcrumb />
<div class="title-row">
<h1 class="title">{{trans('head_title')}}</h1>
</div>
</div>
</div>
</template>
<script>
import Breadcrumb from './breadcrumb';
const $ = global.$;
function getOldHeaderToolbarButtons() {
return $('.header-toolbar')
.first()
.find('.toolbar-icons');
}
export default {
components: {
Breadcrumb,
},
mounted() {
// move the toolbar buttons to this header
const toolbarButtons = getOldHeaderToolbarButtons();
toolbarButtons.insertAfter($(this.$el).find('.title-row > .title'));
// signal header change (so size can be updated)
const event = $.Event('vueHeaderMounted', {
name: 'stock-header',
});
$(document).trigger(event);
},
};
</script>

View File

@@ -0,0 +1,288 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<transition name="fade">
<div class="col-sm-9 card" v-if="principalReady">
<div class="p-3 translations-wrapper">
<PSAlert v-if="noResult" alertType="ALERT_TYPE_WARNING" :hasClose="false">
{{noResultInfo}}
</PSAlert>
<div class="translations-catalog row p-0" v-else>
<PSAlert v-if="searchActive" class="col-sm-12" alertType="ALERT_TYPE_INFO" :hasClose="false">
{{searchInfo}}
</PSAlert>
<div class="col-sm-8 pt-3">
<h3 class="domain-info">
<span>{{ currentDomain }}</span>
<span>{{ currentDomainTotalTranslations }}</span>
<span v-show="currentDomainTotalMissingTranslations"> - <span class="missing">{{ currentDomainTotalMissingTranslationsString }}</span></span>
</h3>
</div>
<div class="col-sm-4">
<PSPagination
:currentIndex="currentPagination"
:pagesCount="pagesCount"
class="float-sm-right"
@pageChanged="onPageChanged"
/>
</div>
<form class="col-sm-12"
method="post"
:action="saveAction"
:isEdited="isEdited"
@submit.prevent="saveTranslations"
>
<div class="row">
<div class="col-sm-12 mb-2">
<PSButton :primary="true" type="submit" class="float-sm-right">
{{ trans('button_save') }}
</PSButton>
</div>
</div>
<TranslationInput
v-for="(translation, key) in translationsCatalog"
:key="key"
:id="key"
:translated="translation"
:label="translation.default"
:extraInfo="getDomain(translation.tree_domain)"
@editedAction="isEdited"
>
</TranslationInput>
<div class="row">
<div class="col-sm-12">
<PSButton :primary="true" type="submit" class="float-sm-right mt-3">
{{ trans('button_save') }}
</PSButton>
</div>
</div>
</form>
<div class="col-sm-12">
<PSPagination
:currentIndex="currentPagination"
:pagesCount="pagesCount"
@pageChanged="onPageChanged"
/>
</div>
</div>
</div>
</div>
</transition>
</template>
<script>
import TranslationInput from './translation-input';
import PSButton from '@app/widgets/ps-button';
import PSPagination from '@app/widgets/ps-pagination';
import PSAlert from '@app/widgets/ps-alert';
import { EventBus } from '@app/utils/event-bus';
export default {
props: [
'modal',
],
computed: {
principalReady() {
return !this.$store.state.principalLoading;
},
translationsCatalog() {
this.translations = this.$store.getters.catalog.data.data;
return this.translations;
},
saveAction() {
return this.$store.getters.catalog.data.info ? this.$store.getters.catalog.data.info.edit_url : '';
},
resetAction() {
return this.$store.getters.catalog.data.info ? this.$store.getters.catalog.data.info.reset_url : '';
},
pagesCount() {
return this.$store.getters.totalPages;
},
currentPagination() {
return this.$store.getters.pageIndex;
},
currentDomain() {
return this.$store.state.currentDomain;
},
currentDomainTotalTranslations() {
return (this.$store.state.currentDomainTotalTranslations <= 1)
? `- ${this.trans('label_total_domain_singular').replace('%nb_translation%', this.$store.state.currentDomainTotalTranslations)}`
: `- ${this.trans('label_total_domain').replace('%nb_translations%', this.$store.state.currentDomainTotalTranslations)}`;
},
currentDomainTotalMissingTranslations() {
return this.$store.state.currentDomainTotalMissingTranslations;
},
currentDomainTotalMissingTranslationsString() {
let totalMissingTranslationsString = '';
if (this.currentDomainTotalMissingTranslations) {
if (this.currentDomainTotalMissingTranslations === 1) {
totalMissingTranslationsString = this.trans('label_missing_singular');
} else {
totalMissingTranslationsString = this.trans('label_missing').replace('%d', this.currentDomainTotalMissingTranslations);
}
}
return totalMissingTranslationsString;
},
noResult() {
return (this.$store.getters.currentDomain === '' || typeof this.$store.getters.currentDomain === 'undefined');
},
noResultInfo() {
return this.trans('no_result').replace('%s', this.$store.getters.searchTags.join(' - '));
},
searchActive() {
return this.$store.getters.searchTags.length;
},
searchInfo() {
const transKey = (this.$store.state.totalTranslations <= 1) ? 'search_info_singular' : 'search_info';
return this.trans(transKey)
.replace('%s', this.$store.getters.searchTags.join(' - '))
.replace('%d', this.$store.state.totalTranslations);
},
},
methods: {
/**
* Dispatch the event to change the page index,
* get the translations and reset the modified translations into the state
* @param {Number} pageIndex
*/
changePage: function changePage(pageIndex) {
this.$store.dispatch('updatePageIndex', pageIndex);
this.fetch();
this.$store.state.modifiedTranslations = [];
},
isEdited(input) {
if (input.translation.edited) {
this.$store.state.modifiedTranslations[input.id] = input.translation;
} else {
this.$store.state.modifiedTranslations.splice(
this.$store.state.modifiedTranslations.indexOf(input.id),
1
);
}
},
onPageChanged(pageIndex) {
if (this.edited()) {
this.modal.showModal();
this.modal.$once('save', () => {
this.saveTranslations();
this.changePage(pageIndex);
});
this.modal.$once('leave', () => {
this.changePage(pageIndex);
});
} else {
this.changePage(pageIndex);
}
},
fetch() {
this.$store.dispatch('getCatalog', {
url: this.$store.getters.catalog.info.current_url_without_pagination,
page_size: this.$store.state.translationsPerPage,
page_index: this.$store.getters.pageIndex,
});
},
getDomain(domains) {
let domain = '';
domains.forEach((d) => {
domain += d + ' > ';
});
return domain.slice(0, -3);
},
saveTranslations() {
const modifiedTranslations = this.getModifiedTranslations();
if (modifiedTranslations.length) {
this.$store.dispatch('saveTranslations', {
url: this.saveAction,
translations: this.getModifiedTranslations(),
store: this.$store,
});
}
},
getModifiedTranslations() {
this.modifiedTranslations = [];
const targetTheme = (window.data.type === 'modules') ? '' : window.data.selected;
this.$store.state.modifiedTranslations.forEach((translation) => {
this.modifiedTranslations.push({
default: translation.default,
edited: translation.edited,
domain: translation.tree_domain.join(''),
locale: window.data.locale,
theme: targetTheme,
});
});
return this.modifiedTranslations;
},
edited() {
return this.$store.state.modifiedTranslations.length > 0;
},
},
data: () => ({
translations: [],
originalTranslations: [],
modifiedTranslations: [],
}),
mounted() {
EventBus.$on('resetTranslation', (el) => {
const translations = [];
translations.push({
default: el.default,
domain: el.tree_domain.join(''),
locale: window.data.locale,
theme: window.data.selected,
});
this.$store.dispatch('resetTranslation', {
url: this.resetAction,
translations,
});
});
},
components: {
TranslationInput,
PSButton,
PSPagination,
PSAlert,
},
};
</script>
<style lang="scss" scoped>
@import "../../../../../../scss/config/_settings.scss";
.fade-enter-active, .fade-leave-active {
transition: opacity .5s
}
.fade-enter, .fade-leave-to /* .fade-leave-active in <2.1.8 */ {
opacity: 0
}
</style>

View File

@@ -0,0 +1,99 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div class="form-group">
<label>{{label}}</label>
<textarea class="form-control" rows="2" v-model="getTranslated" :class="{ missing : isMissing }"></textarea>
<PSButton class="mt-3 float-sm-right" :primary="false" ghost @click="resetTranslation">
{{ trans('button_reset') }}
</PSButton>
<small class="mt-3">{{extraInfo}}</small>
</div>
</template>
<script>
import PSButton from '@app/widgets/ps-button';
import { EventBus } from '@app/utils/event-bus';
export default {
name: 'TranslationInput',
props: {
id: {
type: Number,
},
extraInfo: {
type: String,
required: false,
},
label: {
type: String,
required: true,
},
translated: {
required: true,
},
},
computed: {
getTranslated: {
get() {
return this.translated.database ? this.translated.database : this.translated.xliff;
},
set(modifiedValue) {
const modifiedTranslated = this.translated;
modifiedTranslated.database = modifiedValue;
modifiedTranslated.edited = modifiedValue;
this.$emit('input', modifiedTranslated);
this.$emit('editedAction', {
translation: modifiedTranslated,
id: this.id,
});
},
},
isMissing() {
return this.getTranslated === null;
},
},
methods: {
resetTranslation() {
this.getTranslated = '';
EventBus.$emit('resetTranslation', this.translated);
},
},
components: {
PSButton,
},
};
</script>
<style lang="scss" scoped>
@import "../../../../../../scss/config/_settings.scss";
.form-group {
overflow: hidden;
}
.missing {
border: 1px solid $danger;
}
</style>

View File

@@ -0,0 +1,222 @@
<!--**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*-->
<template>
<div class="col-sm-3">
<div class="card p-3">
<PSTree
ref="domainTree"
:model="domainsTree"
className="translationTree"
:translations="translations"
:currentItem="currentItem"
v-if="treeReady"
/>
<PSSpinner v-else />
</div>
</div>
</template>
<script>
import PSTree from '@app/widgets/ps-tree/ps-tree';
import PSSpinner from '@app/widgets/ps-spinner';
import { EventBus } from '@app/utils/event-bus';
export default {
props: [
'modal',
'principal',
],
computed: {
treeReady() {
return !this.$store.state.sidebarLoading;
},
currentItem() {
if (this.$store.getters.currentDomain === '' || typeof this.$store.getters.currentDomain === 'undefined') {
if (this.domainsTree.length) {
const domain = this.getFirstDomainToDisplay(this.domainsTree);
EventBus.$emit('reduce');
this.$store.dispatch('updateCurrentDomain', domain);
if (domain !== '') {
this.$store.dispatch('getCatalog', { url: domain.dataValue });
EventBus.$emit('setCurrentElement', domain.full_name);
return domain.full_name;
}
this.$store.dispatch('updatePrincipalLoading', false);
return '';
}
}
return this.$store.getters.currentDomain;
},
domainsTree() {
return this.$store.getters.domainsTree;
},
translations() {
return {
expand: this.trans('sidebar_expand'),
reduce: this.trans('sidebar_collapse'),
extra: this.trans('label_missing'),
extra_singular: this.trans('label_missing_singular'),
};
},
},
mounted() {
this.$store.dispatch('getDomainsTree', {
store: this.$store,
});
EventBus.$on('lastTreeItemClick', (el) => {
if (this.edited()) {
this.modal.showModal();
this.modal.$once('save', () => {
this.principal.saveTranslations();
this.itemClick(el);
});
this.modal.$once('leave', () => {
this.itemClick(el);
});
} else {
this.itemClick(el);
}
});
},
methods: {
/**
* Update the domain, retrieve the translations catalog, set the page to 1
* and reset the modified translations
* @param {object} el - Domain to set
*/
itemClick: function itemClick(el) {
this.$store.dispatch('updateCurrentDomain', el.item);
this.$store.dispatch('getCatalog', { url: el.item.dataValue });
this.$store.dispatch('updatePageIndex', 1);
this.$store.state.modifiedTranslations = [];
},
getFirstDomainToDisplay: function getFirstDomainToDisplay(tree) {
const keys = Object.keys(tree);
let toDisplay = '';
for (let i = 0; i < tree.length; i++) {
if (!tree[keys[i]].disable) {
if (tree[keys[i]].children && tree[keys[i]].children.length > 0) {
return getFirstDomainToDisplay(tree[keys[i]].children);
}
toDisplay = tree[keys[i]];
break;
}
}
return toDisplay;
},
/**
* Check if some translations have been edited
* @returns {boolean}
*/
edited: function edited() {
return this.$store.state.modifiedTranslations.length > 0;
},
},
components: {
PSTree,
PSSpinner,
},
};
</script>
<style lang="scss" type="text/scss">
@import "../../../../../../scss/config/_settings.scss";
.translationTree {
.tree-name {
margin-bottom: .9375rem;
&.active {
font-weight: bold;
}
&.extra {
color: $danger;
}
}
.tree-extra-label {
color: $danger;
text-transform: uppercase;
font-size: .65rem;
margin-left: auto;
}
.tree-extra-label-mini {
background-color: $danger;
color: #ffffff;
padding: 0 0.5rem;
border-radius: 0.75rem;
display: inline-block;
font-size: .75rem;
height: 1.5rem;
margin-left: auto;
}
.tree-label {
&:hover {
color: $primary;
}
}
}
.ps-loader {
$loader-white-height: 20px;
$loader-line-height: 16px;
.animated-background {
height: 144px!important;
animation-duration: 2s!important;
}
.background-masker {
&.header-left {
left: 0;
top: $loader-line-height;
height: 108px;
width: 20px;
}
&.content-top {
left: 0;
top: $loader-line-height;
height: $loader-white-height;
}
&.content-first-end {
left: 0;
top: $loader-line-height*2+$loader-white-height;
height: $loader-white-height;
}
&.content-second-end {
left: 0;
top: $loader-line-height*3+$loader-white-height*2;
height: $loader-white-height;
}
&.content-third-end {
left: 0;
top: $loader-line-height*4+$loader-white-height*3;
height: $loader-white-height;
}
}
}
</style>

View File

@@ -0,0 +1,42 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import Vue from 'vue';
import app from './components/app';
import store from './store/';
import router from './router';
import Translation from './mixins/translate';
Vue.mixin(Translation);
new Vue({
router,
store,
el: '#translations-app',
template: '<app />',
components: { app },
beforeMount() {
this.$store.dispatch('getTranslations');
},
});

View File

@@ -0,0 +1,31 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
export default {
methods: {
trans(key) {
return this.$store.getters.translations[key];
},
},
};

View File

@@ -0,0 +1,41 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import Vue from 'vue';
import VueRouter from 'vue-router';
import Overview from '@app/pages/translations/components/app';
Vue.use(VueRouter);
export default new VueRouter({
mode: 'history',
base: `${window.data.baseUrl}/translations`,
routes: [
{
path: '/',
name: 'overview',
component: Overview,
},
],
});

View File

@@ -0,0 +1,143 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import Vue from 'vue';
import VueResource from 'vue-resource';
import * as types from '@app/pages/translations/store/mutation-types';
import { showGrowl } from '@app/utils/growl';
Vue.use(VueResource);
export const getTranslations = ({ commit }) => {
const url = window.data.translationUrl;
Vue.http.get(url).then((response) => {
commit(types.SET_TRANSLATIONS, response.body);
commit(types.APP_IS_READY);
}, (error) => {
showGrowl('error', error.bodyText ? JSON.parse(error.bodyText).error : error.statusText);
});
};
export const getCatalog = ({ commit }, payload) => {
commit(types.PRINCIPAL_LOADING, true);
Vue.http.get(payload.url, {
params: {
page_size: payload.page_size,
page_index: payload.page_index,
},
}).then((response) => {
commit(types.SET_TOTAL_PAGES, response.headers.get('Total-Pages'));
commit(types.SET_CATALOG, response.body);
commit(types.PRINCIPAL_LOADING, false);
}, (error) => {
showGrowl('error', error.bodyText ? JSON.parse(error.bodyText).error : error.statusText);
});
};
export const getDomainsTree = ({ commit }, payload) => {
const url = window.data.domainsTreeUrl;
const params = {};
commit(types.SIDEBAR_LOADING, true);
commit(types.PRINCIPAL_LOADING, true);
if (payload.store.getters.searchTags.length) {
params.search = payload.store.getters.searchTags;
}
Vue.http.get(url, {
params,
}).then((response) => {
commit(types.SET_DOMAINS_TREE, response.body);
commit(types.SIDEBAR_LOADING, false);
commit(types.RESET_CURRENT_DOMAIN);
}, (error) => {
showGrowl('error', error.bodyText ? JSON.parse(error.bodyText).error : error.statusText);
});
};
export const refreshCounts = ({ commit }, payload) => {
const url = window.data.domainsTreeUrl;
const params = {};
if (payload.store.getters.searchTags.length) {
params.search = payload.store.getters.searchTags;
}
Vue.http.get(url, {
params,
}).then((response) => {
payload.store.state.currentDomainTotalMissingTranslations -= payload.successfullySaved;
commit(types.SET_DOMAINS_TREE, response.body);
}, (error) => {
showGrowl('error', error.bodyText ? JSON.parse(error.bodyText).error : error.statusText);
});
};
export const saveTranslations = ({ commit }, payload) => {
const url = payload.url;
const translations = payload.translations;
Vue.http.post(url, {
translations,
}).then(() => {
payload.store.dispatch('refreshCounts', {
successfullySaved: translations.length,
store: payload.store,
});
payload.store.state.modifiedTranslations = [];
return showGrowl('notice', 'Translations successfully updated');
}, (error) => {
showGrowl('error', error.bodyText ? JSON.parse(error.bodyText).error : error.statusText);
});
};
export const resetTranslation = ({ commit }, payload) => {
const url = payload.url;
const translations = payload.translations;
Vue.http.post(url, {
translations,
}).then(() => {
showGrowl('notice', 'Translations successfully reset');
}, (error) => {
showGrowl('error', error.bodyText ? JSON.parse(error.bodyText).error : error.statusText);
});
};
export const updatePageIndex = ({ commit }, pageIndex) => {
commit(types.SET_PAGE_INDEX, pageIndex);
};
export const updateCurrentDomain = ({ commit }, currentDomain) => {
commit(types.SET_CURRENT_DOMAIN, currentDomain);
};
export const updatePrincipalLoading = ({ commit }, principalLoading) => {
commit(types.PRINCIPAL_LOADING, principalLoading);
};
export const updateSearch = ({ commit }, searchTags) => {
commit(types.SEARCH_TAGS, searchTags);
};

View File

@@ -0,0 +1,108 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import Vue from 'vue';
import Vuex from 'vuex';
import * as actions from './actions';
import mutations from './mutations';
import _ from 'lodash';
Vue.use(Vuex);
// root state object.
const state = {
pageIndex: 1,
totalPages: 0,
translationsPerPage: 20,
currentDomain: '',
translations: {
data: {},
info: {},
},
catalog: {
data: {},
info: {},
},
domainsTree: [],
totalMissingTranslations: 0,
totalTranslations: 0,
currentDomainTotalTranslations: 0,
currentDomainTotalMissingTranslations: 0,
isReady: false,
sidebarLoading: true,
principalLoading: true,
searchTags: [],
modifiedTranslations: [],
};
// getters are functions
const getters = {
totalPages(rootState) {
return rootState.totalPages;
},
pageIndex(rootState) {
return rootState.pageIndex;
},
currentDomain(rootState) {
return rootState.currentDomain;
},
translations(rootState) {
return rootState.translations;
},
catalog(rootState) {
return rootState.catalog;
},
domainsTree() {
function convert(domains) {
domains.forEach((domain) => {
domain.children = _.values(domain.children);
domain.extraLabel = domain.total_missing_translations;
domain.dataValue = domain.domain_catalog_link;
domain.warning = Boolean(domain.total_missing_translations);
domain.disable = !domain.total_translations;
domain.id = domain.full_name;
convert(domain.children);
});
return domains;
}
return convert(state.domainsTree);
},
isReady(rootState) {
return rootState.isReady;
},
searchTags(rootState) {
return rootState.searchTags;
},
};
// A Vuex instance is created by combining the state, mutations, actions,
// and getters.
export default new Vuex.Store({
state,
getters,
actions,
mutations,
});

View File

@@ -0,0 +1,35 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
export const SET_TRANSLATIONS = 'SET_TRANSLATIONS';
export const SET_CATALOG = 'SET_CATALOG';
export const SET_DOMAINS_TREE = 'SET_DOMAINS_TREE';
export const APP_IS_READY = 'APP_IS_READY';
export const SET_TOTAL_PAGES = 'SET_TOTAL_PAGES';
export const SET_PAGE_INDEX = 'SET_PAGE_INDEX';
export const SET_CURRENT_DOMAIN = 'SET_CURRENT_DOMAIN';
export const RESET_CURRENT_DOMAIN = 'RESET_CURRENT_DOMAIN';
export const SIDEBAR_LOADING = 'SIDEBAR_LOADING';
export const PRINCIPAL_LOADING = 'PRINCIPAL_LOADING';
export const SEARCH_TAGS = 'SEARCH_TAGS';

View File

@@ -0,0 +1,69 @@
/**
* Copyright since 2007 PrestaShop SA and Contributors
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
*
* NOTICE OF LICENSE
*
* This source file is subject to the Open Software License (OSL 3.0)
* that is bundled with this package in the file LICENSE.md.
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/OSL-3.0
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://devdocs.prestashop.com/ for more information.
*
* @author PrestaShop SA and Contributors <contact@prestashop.com>
* @copyright Since 2007 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/OSL-3.0 Open Software License (OSL 3.0)
*/
import * as types from './mutation-types';
export default {
[types.SET_TRANSLATIONS](state, translations) {
translations.data.forEach((t) => {
state.translations[t.translation_id] = t.name;
});
},
[types.SET_CATALOG](state, catalog) {
state.catalog = catalog;
},
[types.SET_DOMAINS_TREE](state, domainsTree) {
state.totalMissingTranslations = domainsTree.data.tree.total_missing_translations;
state.totalTranslations = domainsTree.data.tree.total_translations;
state.domainsTree = domainsTree.data.tree.children;
},
[types.APP_IS_READY](state) {
state.isReady = true;
},
[types.SET_TOTAL_PAGES](state, totalPages) {
state.totalPages = Number(totalPages);
},
[types.SET_PAGE_INDEX](state, pageIndex) {
state.pageIndex = pageIndex;
},
[types.SET_CURRENT_DOMAIN](state, currentDomain) {
state.currentDomain = currentDomain.full_name;
state.currentDomainTotalTranslations = currentDomain.total_translations;
state.currentDomainTotalMissingTranslations = currentDomain.total_missing_translations;
},
[types.RESET_CURRENT_DOMAIN](state) {
state.currentDomain = '';
state.currentDomainTotalTranslations = 0;
state.currentDomainTotalMissingTranslations = 0;
},
[types.SIDEBAR_LOADING](state, isLoading) {
state.sidebarLoading = isLoading;
},
[types.PRINCIPAL_LOADING](state, isLoading) {
state.principalLoading = isLoading;
},
[types.SEARCH_TAGS](state, searchTags) {
state.searchTags = searchTags;
},
};